fix: add useCallback to TextInput onChange handler

contentful · Nov 20, 2020 · 783e2c0 · 783e2c0
1 parent de27965
commit 783e2c0
Showing 1 changed file with 11 additions and 8 deletions.
diff --git a/packages/forma-36-react-components/src/components/TextInput/TextInput.tsx b/packages/forma-36-react-components/src/components/TextInput/TextInput.tsx
@@ -80,15 +80,18 @@ export const TextInput = (props: TextInputProps) => {
     }
   };
 
-  const handleChange = (e: ChangeEvent<HTMLInputElement>) => {
-    e.persist();
-    if (disabled || isReadOnly) return;
+  const handleChange = useCallback(
+    (e: ChangeEvent<HTMLInputElement>) => {
+      e.persist();
+      if (disabled || isReadOnly) return;
 
-    if (onChange) {
-      onChange(e);
-    }
-    setValueState(e.currentTarget.value);
-  };
+      if (onChange) {
+        onChange(e);
+      }
+      setValueState(e.currentTarget.value);
+    },
+    [onChange, disabled, isReadOnly],
+  );
 
   const handleKeyDown = useCallback(
     (e: KeyboardEvent<HTMLInputElement>) => {