@aws-amplify/ui-react-native 2.5.3 → 2.6.1

package/dist/Authenticator/hooks/types.d.ts

@@ -4,6 +4,7 @@ export type AuthenticatorFieldTypeKey = 'email' | 'password' | 'phone' | 'defaul
 type RadioFieldOnBlur = RadioProps<string>['onBlur'];
 export type TextFieldOnBlur = TextFieldProps['onBlur'];
 export type OnChangeText = TextFieldProps['onChangeText'];
+export type OnChange = TextFieldProps['onChange'];
 type FieldOptions<FieldProps, Type extends AuthenticatorFieldTypeKey> = {
     name: string;
     onBlur?: Type extends 'radio' ? RadioFieldOnBlur : TextFieldOnBlur;

package/dist/Authenticator/hooks/useFieldValues/useFieldValues.js

@@ -1,9 +1,10 @@
-import { useMemo, useState } from 'react';
+import { useMemo, useRef, useState } from 'react';
 import { ConsoleLogger as Logger } from 'aws-amplify/utils';
 import { getSanitizedTextFields, isRadioFieldOptions, runFieldValidation, getSanitizedVerifyUserFields, getSanitizedSelectMfaTypeFields, } from './utils';
 const logger = new Logger('Authenticator');
 export default function useFieldValues({ componentName, fields = [], handleBlur, handleChange, handleSubmit, validationErrors, }) {
     const [touched, setTouched] = useState({});
+    const lastProcessed = useRef();
     const [fieldValidationErrors, setFieldValidationErrors] = useState({});
     const isVerifyUserRoute = componentName === 'VerifyUser';
     const isSelectMfaTypeRoute = componentName === 'SelectMfaType';
@@ -78,9 +79,10 @@ export default function useFieldValues({ componentName, fields = [], handleBlur,
                 [name]: runFieldValidation(field, values[name], validationErrors),
             });
         };
-        const onChangeText = (value) => {
-            // call `onChangeText` passed as text `field` option
-            field.onChangeText?.(value);
+        const reportChange = (value) => {
+            if (lastProcessed.current === `${name}:${value}`) {
+                return;
+            }
             // call machine change handler
             handleChange({ name, value });
             if (touched[name]) {
@@ -89,12 +91,24 @@ export default function useFieldValues({ componentName, fields = [], handleBlur,
                     [name]: runFieldValidation(field, value, validationErrors),
                 });
             }
-            setValues({ ...values, [name]: value });
+            lastProcessed.current = `${name}:${value}`;
+            setValues((prev) => ({ ...prev, [name]: value }));
+        };
+        const onChangeText = (value) => {
+            // call `onChangeText` passed as text `field` option
+            field.onChangeText?.(value);
+            reportChange(value);
+        };
+        const onChange = (event) => {
+            // call `onChange` passed as text `field` option
+            field.onChange?.(event);
+            reportChange(event.nativeEvent.text ?? '');
         };
         return {
             ...rest,
             label: labelHidden ? undefined : label,
             onBlur,
+            onChange,
             onChangeText,
             name,
             value: values[name],

package/dist/version.d.ts

@@ -1 +1 @@
-export declare const VERSION = "2.5.3";
+export declare const VERSION = "2.6.1";

package/dist/version.js

@@ -1 +1 @@
-export const VERSION = '2.5.3';
+export const VERSION = '2.6.1';

package/lib/Authenticator/hooks/useFieldValues/useFieldValues.js

@@ -6,6 +6,7 @@ const utils_2 = require("./utils");
 const logger = new utils_1.ConsoleLogger('Authenticator');
 function useFieldValues({ componentName, fields = [], handleBlur, handleChange, handleSubmit, validationErrors, }) {
     const [touched, setTouched] = (0, react_1.useState)({});
+    const lastProcessed = (0, react_1.useRef)();
     const [fieldValidationErrors, setFieldValidationErrors] = (0, react_1.useState)({});
     const isVerifyUserRoute = componentName === 'VerifyUser';
     const isSelectMfaTypeRoute = componentName === 'SelectMfaType';
@@ -80,9 +81,10 @@ function useFieldValues({ componentName, fields = [], handleBlur, handleChange,
                 [name]: (0, utils_2.runFieldValidation)(field, values[name], validationErrors),
             });
         };
-        const onChangeText = (value) => {
-            // call `onChangeText` passed as text `field` option
-            field.onChangeText?.(value);
+        const reportChange = (value) => {
+            if (lastProcessed.current === `${name}:${value}`) {
+                return;
+            }
             // call machine change handler
             handleChange({ name, value });
             if (touched[name]) {
@@ -91,12 +93,24 @@ function useFieldValues({ componentName, fields = [], handleBlur, handleChange,
                     [name]: (0, utils_2.runFieldValidation)(field, value, validationErrors),
                 });
             }
-            setValues({ ...values, [name]: value });
+            lastProcessed.current = `${name}:${value}`;
+            setValues((prev) => ({ ...prev, [name]: value }));
+        };
+        const onChangeText = (value) => {
+            // call `onChangeText` passed as text `field` option
+            field.onChangeText?.(value);
+            reportChange(value);
+        };
+        const onChange = (event) => {
+            // call `onChange` passed as text `field` option
+            field.onChange?.(event);
+            reportChange(event.nativeEvent.text ?? '');
         };
         return {
             ...rest,
             label: labelHidden ? undefined : label,
             onBlur,
+            onChange,
             onChangeText,
             name,
             value: values[name],

package/lib/version.js

@@ -1,4 +1,4 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.VERSION = void 0;
-exports.VERSION = '2.5.3';
+exports.VERSION = '2.6.1';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aws-amplify/ui-react-native",
-  "version": "2.5.3",
+  "version": "2.6.1",
   "main": "lib/index.js",
   "module": "dist/index.js",
   "react-native": "src/index.ts",
@@ -30,9 +30,9 @@
     "react-native-safe-area-context": "^5.2.0"
   },
   "dependencies": {
-    "@aws-amplify/ui": "6.10.3",
-    "@aws-amplify/ui-react-core": "3.4.3",
-    "@aws-amplify/ui-react-core-notifications": "2.2.9"
+    "@aws-amplify/ui": "6.11.0",
+    "@aws-amplify/ui-react-core": "3.4.4",
+    "@aws-amplify/ui-react-core-notifications": "2.2.10"
   },
   "peerDependencies": {
     "aws-amplify": "^6.14.3",

package/src/Authenticator/hooks/types.ts

@@ -16,6 +16,7 @@ export type AuthenticatorFieldTypeKey =
 type RadioFieldOnBlur = RadioProps<string>['onBlur'];
 export type TextFieldOnBlur = TextFieldProps['onBlur'];
 export type OnChangeText = TextFieldProps['onChangeText'];
+export type OnChange = TextFieldProps['onChange'];
 
 type FieldOptions<FieldProps, Type extends AuthenticatorFieldTypeKey> = {
   name: string;

package/src/Authenticator/hooks/useFieldValues/useFieldValues.ts

@@ -1,8 +1,9 @@
-import { useMemo, useState } from 'react';
+import { useMemo, useRef, useState } from 'react';
 import { ConsoleLogger as Logger } from 'aws-amplify/utils';
 import type { ValidationError } from '@aws-amplify/ui';
 
 import type {
+  OnChange,
   OnChangeText,
   RadioFieldOptions,
   TextFieldOnBlur,
@@ -29,6 +30,7 @@ export default function useFieldValues<FieldType extends TypedField>({
   validationErrors,
 }: UseFieldValuesParams<FieldType>): UseFieldValues<FieldType> {
   const [touched, setTouched] = useState<Record<string, boolean>>({});
+  const lastProcessed = useRef<string>();
   const [fieldValidationErrors, setFieldValidationErrors] =
     useState<ValidationError>({});
   const isVerifyUserRoute = componentName === 'VerifyUser';
@@ -124,9 +126,10 @@ export default function useFieldValues<FieldType extends TypedField>({
       });
     };
 
-    const onChangeText: OnChangeText = (value) => {
-      // call `onChangeText` passed as text `field` option
-      field.onChangeText?.(value);
+    const reportChange = (value: string) => {
+      if (lastProcessed.current === `${name}:${value}`) {
+        return;
+      }
 
       // call machine change handler
       handleChange({ name, value });
@@ -138,13 +141,29 @@ export default function useFieldValues<FieldType extends TypedField>({
         });
       }
 
-      setValues({ ...values, [name]: value });
+      lastProcessed.current = `${name}:${value}`;
+      setValues((prev) => ({ ...prev, [name]: value }));
+    };
+
+    const onChangeText: OnChangeText = (value) => {
+      // call `onChangeText` passed as text `field` option
+      field.onChangeText?.(value);
+
+      reportChange(value);
+    };
+
+    const onChange: OnChange = (event) => {
+      // call `onChange` passed as text `field` option
+      field.onChange?.(event);
+
+      reportChange(event.nativeEvent.text ?? '');
     };
 
     return {
       ...rest,
       label: labelHidden ? undefined : label,
       onBlur,
+      onChange,
       onChangeText,
       name,
       value: values[name],

package/src/version.ts

@@ -1 +1 @@
-export const VERSION = '2.5.3';
+export const VERSION = '2.6.1';