make sure all text area heights stay in step (#13341)

This commit is contained in:
Suzanne Aitchison 2021-04-12 10:34:21 +01:00 committed by GitHub
parent 5406b0576e
commit 458e3fbc7a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -117,7 +117,7 @@ const getIndexOfCurrentWordAutocompleteSymbol = (content, selectionIndex) => {
/**
* This hook can be used to keep the height of a textarea in step with the current content height, avoiding a scrolling textarea.
* An optional array of additional elements can be set. If provided, all additional elements will receive the same height.
* An optional array of additional elements can be set. If provided, all elements will be set to the greatest content height.
* Optionally, it can be specified to also constrain the max-height to the content height. Otherwise the max-height will continue to be managed only by the textarea's CSS
*
* @example
@ -139,7 +139,13 @@ export const useTextAreaAutoResize = () => {
}
const resizeTextArea = () => {
const { height } = calculateTextAreaHeight(textArea);
const allElements = [textArea, ...additionalElements];
const allContentHeights = allElements.map(
(element) => calculateTextAreaHeight(element).height,
);
const height = Math.max(...allContentHeights);
const newHeight = `${height}px`;
[textArea, ...additionalElements].forEach((element) => {