PromucFlow_constructor/app/client/src/utils/hooks/useAutoGrow.tsx

22 lines
569 B
TypeScript

import { useEffect, useState } from "react";
const useAutoGrow = (value: string, defaultHeight?: number) => {
const [height, setHeight] = useState(defaultHeight || 24);
const handleValueChange = () => {
setTimeout(() => {
const numberOfLineBreaks = (value.match(/\n/g) || []).length;
// defaultHeight + lines x line-height
const newHeight = (defaultHeight || 24) + numberOfLineBreaks * 20;
setHeight(newHeight);
});
};
useEffect(() => {
handleValueChange();
}, [value]);
return height;
};
export default useAutoGrow;