@dcl/react-ecs 7.1.0 → 7.1.1-4386019452.commit-8b1daa0

package/dist/reconciler/index.js

@@ -3,11 +3,19 @@ import Reconciler from 'react-reconciler';
 import { isListener } from '../components';
 import { CANVAS_ROOT_ENTITY } from '../components/uiTransform';
 import { componentKeys, isNotUndefined, noopConfig, propsChanged } from './utils';
+function getPointerEnum(pointerKey) {
+    const pointers = {
+        onMouseDown: 1 /* PointerEventType.PET_DOWN */,
+        onMouseUp: 0 /* PointerEventType.PET_UP */
+    };
+    return pointers[pointerKey];
+}
 export function createReconciler(engine, pointerEvents) {
     // Store all the entities so when we destroy the UI we can also destroy them
     const entities = new Set();
     // Store the onChange callbacks to be runned every time a Result has changed
     const changeEvents = new Map();
+    const clickEvents = new Map();
     // Initialize components
     const UiTransform = components.UiTransform(engine);
     const UiText = components.UiText(engine);
@@ -24,11 +32,18 @@ export function createReconciler(engine, pointerEvents) {
         uiInput: UiInput.componentId,
         uiDropdown: UiDropdown.componentId
     };
+    function pointerEventCallback(entity, pointerEvent) {
+        const callback = clickEvents.get(entity)?.get(pointerEvent);
+        if (callback)
+            callback();
+        return;
+    }
     function updateTree(instance, props) {
         upsertComponent(instance, props, 'uiTransform');
     }
     function upsertListener(instance, update) {
         if (update.type === 'delete' || !update.props) {
+            clickEvents.get(instance.entity)?.delete(getPointerEnum(update.component));
             if (update.component === 'onMouseDown') {
                 pointerEvents.removeOnPointerDown(instance.entity);
             }
@@ -38,8 +53,14 @@ export function createReconciler(engine, pointerEvents) {
             return;
         }
         if (update.props) {
-            const pointerEvent = update.component === 'onMouseDown' ? pointerEvents.onPointerDown : pointerEvents.onPointerUp;
-            pointerEvent(instance.entity, update.props, {
+            const pointerEvent = getPointerEnum(update.component);
+            const entityEvent = clickEvents.get(instance.entity) || clickEvents.set(instance.entity, new Map()).get(instance.entity);
+            const alreadyHasPointerEvent = entityEvent.get(pointerEvent);
+            entityEvent.set(pointerEvent, update.props);
+            if (alreadyHasPointerEvent)
+                return;
+            const pointerEventSystem = update.component === 'onMouseDown' ? pointerEvents.onPointerDown : pointerEvents.onPointerUp;
+            pointerEventSystem(instance.entity, () => pointerEventCallback(instance.entity, pointerEvent), {
                 button: 0 /* InputAction.IA_POINTER */,
                 // We add this showFeedBack so the pointerEventSystem creates a PointerEvent component with our entity
                 // This is needed for the renderer to know which entities are clickeables
@@ -52,20 +73,22 @@ export function createReconciler(engine, pointerEvents) {
         const Component = engine.getComponent(componentId);
         Component.deleteFrom(instance.entity);
     }
-    function upsertComponent(instance, props, componentName) {
+    function upsertComponent(instance, props = {}, componentName) {
         const componentId = getComponentId[componentName];
-        const Component = engine.getComponent(componentId);
-        const component = Component.getMutableOrNull(instance.entity) || Component.create(instance.entity);
+        if ('onChange' in props) {
+            const onChange = props['onChange'];
+            updateOnChange(instance.entity, componentId, { fn: onChange });
+            delete props['onChange'];
+        }
+        // We check if there is any key pending to be changed to avoid updating the existing component
+        if (!Object.keys(props).length) {
+            return;
+        }
+        const ComponentDef = engine.getComponent(componentId);
+        const component = ComponentDef.getMutableOrNull(instance.entity) || ComponentDef.create(instance.entity);
         for (const key in props) {
             const keyProp = key;
-            if (key === 'onChange') {
-                const onChange = props[keyProp];
-                updateOnChange(instance.entity, componentId, { fn: onChange });
-            }
-            else {
-                ;
-                component[keyProp] = props[keyProp];
-            }
+            component[keyProp] = props[keyProp];
         }
     }
     function removeChildEntity(instance) {
@@ -169,7 +192,7 @@ export function createReconciler(engine, pointerEvents) {
                 if (update.type === 'delete') {
                     removeComponent(instance, update.component);
                 }
-                else {
+                else if (update.props) {
                     upsertComponent(instance, update.props, update.component);
                 }
             }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dcl/react-ecs",
-  "version": "7.1.0",
+  "version": "7.1.1-4386019452.commit-8b1daa0",
   "description": "Decentraland ECS",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -28,7 +28,7 @@
     "@types/react-reconciler": "^0.28.0"
   },
   "dependencies": {
-    "@dcl/ecs": "7.1.0",
+    "@dcl/ecs": "7.1.1-4386019452.commit-8b1daa0",
     "react": "^18.2.0",
     "react-reconciler": "^0.29.0"
   },
@@ -42,5 +42,5 @@
     "displayName": "React ECS",
     "tsconfig": "./tsconfig.json"
   },
-  "commit": "e8aeb07d8dc9bf6eb1b021853d9957ed2828c1e4"
+  "commit": "8b1daa095e12f588f917054be41cfad6da952487"
 }