| 225 | // Force re-render when value changes so we update the height. |
| 226 | let {placeholder} = useSlottedContext(AriaTextAreaContext) ?? {}; |
| 227 | let onHeightChange = (input: HTMLTextAreaElement) => { |
| 228 | // TODO: only do this if an explicit height is not given? |
| 229 | if (input) { |
| 230 | let prevAlignment = input.style.alignSelf; |
| 231 | let prevOverflow = input.style.overflow; |
| 232 | // Firefox scroll position is lost when overflow: 'hidden' is applied so we skip applying it. |
| 233 | // The measure/applied height is also incorrect/reset if we turn on and off |
| 234 | // overflow: hidden in Firefox https://bugzilla.mozilla.org/show_bug.cgi?id=1787062 |
| 235 | let isFirefox = 'MozAppearance' in input.style; |
| 236 | if (!isFirefox) { |
| 237 | input.style.overflow = 'hidden'; |
| 238 | } |
| 239 | input.style.alignSelf = 'start'; |
| 240 | input.style.height = 'auto'; |
| 241 | // offsetHeight - clientHeight accounts for the border/padding. |
| 242 | input.style.height = `${input.scrollHeight + (input.offsetHeight - input.clientHeight)}px`; |
| 243 | input.style.overflow = prevOverflow; |
| 244 | input.style.alignSelf = prevAlignment; |
| 245 | } |
| 246 | }; |
| 247 | let {ref} = useSlottedContext(InputContext) ?? {}; |
| 248 | |
| 249 | return ( |