diff --git a/webapp/channels/src/components/__snapshots__/autosize_textarea.test.tsx.snap b/webapp/channels/src/components/__snapshots__/autosize_textarea.test.tsx.snap index 82497cc1fd..9ba5389643 100644 --- a/webapp/channels/src/components/__snapshots__/autosize_textarea.test.tsx.snap +++ b/webapp/channels/src/components/__snapshots__/autosize_textarea.test.tsx.snap @@ -26,6 +26,11 @@ exports[`components/AutosizeTextarea should match snapshot, init 1`] = ` id="autosize_textarea" role="textbox" rows={1} + style={ + Object { + "overflowY": "auto", + } + } />
diff --git a/webapp/channels/src/components/autosize_textarea.tsx b/webapp/channels/src/components/autosize_textarea.tsx index 91b7619046..58ba8888df 100644 --- a/webapp/channels/src/components/autosize_textarea.tsx +++ b/webapp/channels/src/components/autosize_textarea.tsx @@ -25,9 +25,12 @@ const styles = { overflow: 'hidden', }, reference: { - display: 'inline-block', height: 'auto', width: 'auto', + display: 'inline-block', + position: 'relative' as const, + transform: 'translateY(-100%)', + wordBreak: 'break-word' as const, }, placeholder: { overflow: 'hidden', @@ -39,6 +42,9 @@ const styles = { background: 'none', borderColor: 'transparent', }, + textArea: { + overflowY: 'auto' as const, + }, }; const AutosizeTextarea = React.forwardRef