fix(elements): ensure updated provided values are sent to the machine (…

…#3702)

Co-authored-by: Tom Milewski <[email protected]>

.changeset/metal-chairs-shave.md

@@ -0,0 +1,5 @@
+---
+"@clerk/elements": patch
+---
+
+Ensure updated provided values to controlled inputs are sent to the machine

packages/elements/src/react/common/form/index.tsx

@@ -193,7 +193,7 @@ const useField = ({ name }: Partial<Pick<FieldDetails, 'name'>>) => {
 
 const useInput = ({
   name: inputName,
-  value: initialValue,
+  value: providedValue,
   type: inputType,
   onChange: onChangeProp,
   onBlur: onBlurProp,
@@ -265,7 +265,7 @@ const useInput = ({
       return;
     }
 
-    ref.send({ type: 'FIELD.ADD', field: { name, value: initialValue } });
+    ref.send({ type: 'FIELD.ADD', field: { name, value: providedValue } });
 
     return () => ref.send({ type: 'FIELD.REMOVE', field: { name } });
   }, [ref]); // eslint-disable-line react-hooks/exhaustive-deps
@@ -274,15 +274,15 @@ const useInput = ({
   const onChange = React.useCallback(
     (event: React.ChangeEvent<HTMLInputElement>) => {
       onChangeProp?.(event);
-      if (!name || initialValue) {
+      if (!name) {
         return;
       }
       ref.send({ type: 'FIELD.UPDATE', field: { name, value: event.target.value } });
       if (shouldValidatePassword) {
         validatePassword(event.target.value);
       }
     },
-    [ref, name, onChangeProp, initialValue, shouldValidatePassword, validatePassword],
+    [ref, name, onChangeProp, shouldValidatePassword, validatePassword],
   );
 
   const onBlur = React.useCallback(
@@ -306,11 +306,11 @@ const useInput = ({
   );
 
   React.useEffect(() => {
-    if (!initialValue || !name) {
+    if (!name) {
       return;
     }
-    ref.send({ type: 'FIELD.UPDATE', field: { name, value: initialValue } });
-  }, [name, ref, initialValue]);
+    ref.send({ type: 'FIELD.UPDATE', field: { name, value: providedValue } });
+  }, [name, ref, providedValue]);
 
   // TODO: Implement clerk-js utils
   const shouldBeHidden = false;