@dcl/react-ecs 7.3.26 → 7.3.27-6730660340.commit-f58fd69

package/dist/components/Input/index.d.ts

@@ -13,6 +13,9 @@ import { UiInputProps } from './types';
       onChange={(value) => {
         email = value
       }}
+      onSubmit={(value) => {
+        email = value
+      }}
       uiBackground={{ color: Color4.Red() }}
       uiTransform={{ width: 200, height: 36 }}
       value={textValue}

package/dist/components/Input/index.js

@@ -23,6 +23,9 @@ function parseUiInput(props) {
       onChange={(value) => {
         email = value
       }}
+      onSubmit={(value) => {
+        email = value
+      }}
       uiBackground={{ color: Color4.Red() }}
       uiTransform={{ width: 200, height: 36 }}
       value={textValue}

package/dist/components/Input/types.d.ts

@@ -6,6 +6,8 @@ import { TextAlignType, UiFontType } from '../Label/types';
 export interface UiInputProps extends Omit<PBUiInput, 'font' | 'textAlign'> {
     /** function to be called on value change  */
     onChange?(value: string): void;
+    /** function to be called on text field submit  */
+    onSubmit?(value: string): void;
     font?: UiFontType;
     textAlign?: TextAlignType;
 }

package/dist/reconciler/index.js

@@ -75,10 +75,22 @@ export function createReconciler(engine, pointerEvents) {
     }
     function upsertComponent(instance, props = {}, componentName) {
         const componentId = getComponentId[componentName];
-        if ('onChange' in props) {
-            const onChange = props['onChange'];
-            updateOnChange(instance.entity, componentId, { fn: onChange });
-            delete props['onChange'];
+        const onChangeExists = 'onChange' in props;
+        const onSubmitExists = 'onSubmit' in props;
+        const entityState = changeEvents.get(instance.entity)?.get(componentId);
+        const onChange = onChangeExists
+            ? props['onChange']
+            : entityState?.onChangeCallback;
+        const onSubmit = onSubmitExists
+            ? props['onSubmit']
+            : entityState?.onSubmitCallback;
+        if (onChangeExists || onSubmitExists) {
+            updateOnChange(instance.entity, componentId, {
+                onChangeCallback: onChange,
+                onSubmitCallback: onSubmit
+            });
+            delete props.onChange;
+            delete props.onSubmit;
         }
         // We check if there is any key pending to be changed to avoid updating the existing component
         if (!Object.keys(props).length) {
@@ -141,9 +153,11 @@ export function createReconciler(engine, pointerEvents) {
     function updateOnChange(entity, componentId, state) {
         const event = changeEvents.get(entity) || changeEvents.set(entity, new Map()).get(entity);
         const oldState = event.get(componentId);
-        const fn = state?.fn;
+        const onChangeCallback = state?.onChangeCallback;
+        const onSubmitCallback = state?.onSubmitCallback;
         const value = state?.value ?? oldState?.value;
-        event.set(componentId, { fn, value });
+        const isSubmit = state?.isSubmit ?? oldState?.isSubmit;
+        event.set(componentId, { onChangeCallback, onSubmitCallback, value, isSubmit });
     }
     const hostConfig = {
         ...noopConfig,
@@ -223,14 +237,19 @@ export function createReconciler(engine, pointerEvents) {
     function handleOnChange(componentId, resultComponent) {
         for (const [entity, Result] of engine.getEntitiesWith(resultComponent)) {
             const entityState = changeEvents.get(entity)?.get(componentId);
-            if (entityState?.fn && Result.value !== entityState.value) {
-                // Call onChange callback and update internal timestamp
-                entityState.fn(Result.value);
-                updateOnChange(entity, componentId, {
-                    fn: entityState.fn,
-                    value: Result.value
-                });
+            const isSubmit = !!Result.isSubmit;
+            if (entityState?.onChangeCallback && Result.value !== entityState.value) {
+                entityState.onChangeCallback(Result.value);
+            }
+            if (entityState?.onSubmitCallback && isSubmit && !entityState.isSubmit) {
+                entityState.onSubmitCallback(Result.value);
             }
+            updateOnChange(entity, componentId, {
+                onChangeCallback: entityState?.onChangeCallback,
+                onSubmitCallback: entityState?.onSubmitCallback,
+                value: Result.value,
+                isSubmit
+            });
         }
     }
     return {

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@dcl/react-ecs",
   "description": "Decentraland ECS",
-  "version": "7.3.26",
+  "version": "7.3.27-6730660340.commit-f58fd69",
   "author": "DCL",
   "bugs": "https://github.com/decentraland/js-sdk-toolchain/issues",
   "dependencies": {
-    "@dcl/ecs": "7.3.26",
+    "@dcl/ecs": "7.3.27-6730660340.commit-f58fd69",
     "react": "^18.2.0",
     "react-reconciler": "^0.29.0"
   },
@@ -39,5 +39,5 @@
     "tsconfig": "./tsconfig.json"
   },
   "types": "./dist/index.d.ts",
-  "commit": "46ced7f69956231d5cd583ea8bedd46efac38574"
+  "commit": "f58fd69f1dc7178d6d26b86cf6fe6243f1e9328b"
 }