Remove react-autosize-textarea #10543
Conversation
| }; | ||
|
|
||
| private lineHeight?: number; | ||
| private ref = this.props.innerRef ?? React.createRef<HTMLTextAreaElement>(); |
There was a problem hiding this comment.
should this be a getter instead so the value doesn't potentially get outdated when the props change? (although probably practically impossible? also there are a bunch of other ref-related things that's being set once in componentDidMount and assumed being the same in componentDidUpdate)
There was a problem hiding this comment.
Refs aren't managed by React other than committing a value to it after render, so messing with a ref wouldn't normally be triggering renders anyway
| autoComplete='off' | ||
| className={classWithModifiers('chat-input__box', { disabled: this.inputDisabled })} | ||
| disabled={this.inputDisabled} | ||
| innerRef={this.inputBoxRef} | ||
| maxLength={channel?.messageLengthLimit ?? maxMessageLength} | ||
| maxRows={channel?.type === 'ANNOUNCE' ? 10 : 3} |
There was a problem hiding this comment.
looks like the maximum rows option doesn't get applied correctly
| const maxHeight = this.maxHeight; | ||
|
|
||
| return ( | ||
| <textarea |
There was a problem hiding this comment.
not sure exactly where but the styling seems to be slightly wrong
old
this pr
note the wrong background colour for the padding
it's slightly more interesting in chrome
There was a problem hiding this comment.
The old one uses Math.round before multiplying the rows, this one applies Math.ceil after multiplying; current line-height is 17.5px
There was a problem hiding this comment.
white box appears to be a change in autosize between 4 and the current version where previously it applied overflow: hidden scroll but now it doesn't 🤔
notbakaneko
force-pushed
the
remove-react-autosize-textbox
branch
from
d8416a1
to
3d67fc8
Compare
react-autosize-textareahasn't been updated in a while and doesn't have current versions of React in its dependencies.It's just wrapping
autosize, anyway, so we might as well useautosizedirectly - the component is just a convenience wrapper to attach and detachautosizeand doesn't useforwardRef, making the implementation more straight-forward.