resize text area when input changes (#440)

oncokb · Sep 19, 2024 · 5cc5a79 · 5cc5a79
1 parent 860dbab
commit 5cc5a79
Showing 1 changed file with 11 additions and 2 deletions.
diff --git a/src/main/webapp/app/shared/firebase/input/RealtimeBasicInput.tsx b/src/main/webapp/app/shared/firebase/input/RealtimeBasicInput.tsx
@@ -127,8 +127,7 @@ const RealtimeBasicInput: React.FunctionComponent<IRealtimeBasicInput> = (props:
 
     const resizeObserver = new ResizeObserver(() => {
       window.requestAnimationFrame(() => {
-        input.style.height = 'auto';
-        input.style.height = `${input.scrollHeight}px`;
+        resizeTextArea(input);
       });
     });
     resizeObserver.observe(input);
@@ -155,6 +154,11 @@ const RealtimeBasicInput: React.FunctionComponent<IRealtimeBasicInput> = (props:
     if (onChange) {
       onChange(e);
     }
+
+    const input = inputRef.current;
+    if (type === RealtimeInputType.TEXTAREA && input) {
+      resizeTextArea(input);
+    }
   };
 
   function isChecked() {
@@ -164,6 +168,11 @@ const RealtimeBasicInput: React.FunctionComponent<IRealtimeBasicInput> = (props:
     return label === RADIO_OPTION_NONE;
   }
 
+  function resizeTextArea(textArea: HTMLInputElement | HTMLTextAreaElement) {
+    textArea.style.height = 'auto';
+    textArea.style.height = `${textArea.scrollHeight}px`;
+  }
+
   const inputStyle: React.CSSProperties | undefined = isCheckType ? { marginRight: '0.25rem', ...style } : undefined;
   const inputComponent = (
     <>