@dcl/react-ecs 7.6.7 → 7.6.8-12354882097.commit-0c727b8

package/dist/components/Button/index.js

@@ -29,7 +29,7 @@ function getButtonProps(props) {
  */
 /* @__PURE__ */
 export function Button(props) {
-    const { uiTransform, uiBackground, onMouseDown, onMouseUp, ...otherProps } = props;
+    const { uiTransform, uiBackground, onMouseDown, onMouseUp, onMouseEnter, onMouseLeave, ...otherProps } = props;
     const buttonProps = getButtonProps(props);
     const uiBackgroundProps = parseUiBackground({
         ...buttonProps.uiBackground,
@@ -54,5 +54,5 @@ export function Button(props) {
         if (uiBackgroundProps && uiBackgroundProps.color)
             uiBackgroundProps.color.a /= 2;
     }
-    return (ReactEcs.createElement("entity", { onMouseDown: !!props.disabled ? undefined : onMouseDown, onMouseUp: !!props.disabled ? undefined : onMouseUp, uiTransform: uiTransformProps, uiText: textProps, uiBackground: uiBackgroundProps }));
+    return (ReactEcs.createElement("entity", { onMouseDown: !!props.disabled ? undefined : onMouseDown, onMouseUp: !!props.disabled ? undefined : onMouseUp, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, uiTransform: uiTransformProps, uiText: textProps, uiBackground: uiBackgroundProps }));
 }

package/dist/components/Dropdown/index.js

@@ -34,13 +34,15 @@ function parseUiDropdown(props) {
  */
 /* @__PURE__ */
 export function Dropdown(props) {
-    const { uiTransform, uiBackground, onMouseDown, onMouseUp, ...otherProps } = props;
+    const { uiTransform, uiBackground, onMouseDown, onMouseUp, onMouseEnter, onMouseLeave, ...otherProps } = props;
     const dropdownProps = parseUiDropdown(otherProps);
     const commonProps = parseProps({
         uiTransform,
         uiBackground,
         onMouseDown,
-        onMouseUp
+        onMouseUp,
+        onMouseEnter,
+        onMouseLeave
     });
     return ReactEcs.createElement("entity", { ...commonProps, uiDropdown: dropdownProps });
 }

package/dist/components/Input/index.js

@@ -35,13 +35,15 @@ function parseUiInput(props) {
  * @category Component
  */ /* @__PURE__ */
 export function Input(props) {
-    const { uiTransform, uiBackground, onMouseDown, onMouseUp, ...otherProps } = props;
+    const { uiTransform, uiBackground, onMouseDown, onMouseUp, onMouseEnter, onMouseLeave, ...otherProps } = props;
     const inputProps = parseUiInput(otherProps);
     const commonProps = parseProps({
         uiTransform,
         uiBackground,
         onMouseDown,
-        onMouseUp
+        onMouseUp,
+        onMouseEnter,
+        onMouseLeave
     });
     return ReactEcs.createElement("entity", { ...commonProps, uiInput: inputProps });
 }

package/dist/components/Label/index.js

@@ -16,12 +16,14 @@ export { scaleFontSize } from './utils';
  */
 /* @__PURE__ */
 export function Label(props) {
-    const { uiTransform, uiBackground, onMouseDown, onMouseUp, ...uiTextProps } = props;
+    const { uiTransform, uiBackground, onMouseDown, onMouseUp, onMouseEnter, onMouseLeave, ...uiTextProps } = props;
     const commonProps = parseProps({
         uiTransform,
         uiBackground,
         onMouseDown,
-        onMouseUp
+        onMouseUp,
+        onMouseEnter,
+        onMouseLeave
     });
     const { font, textAlign, fontSize, textWrap, ...textProps } = uiTextProps;
     const uiText = {

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

@@ -12,4 +12,8 @@ export type Listeners = {
     onMouseDown?: Callback;
     /** triggered on mouse up event */
     onMouseUp?: Callback;
+    /** triggered on mouse hover event */
+    onMouseEnter?: Callback;
+    /** triggered on mouse leave event */
+    onMouseLeave?: Callback;
 };

package/dist/components/listeners/types.js

@@ -1,6 +1,8 @@
 const listeners = {
     onMouseDown: undefined,
-    onMouseUp: undefined
+    onMouseUp: undefined,
+    onMouseEnter: undefined,
+    onMouseLeave: undefined
 };
 const listenersKey = Object.keys(listeners);
 /**

package/dist/react-ecs.d.ts

@@ -20,6 +20,8 @@ export type EntityComponents = {
     uiDropdown: PBUiDropdown;
     onMouseDown: Callback;
     onMouseUp: Callback;
+    onMouseEnter: Callback;
+    onMouseLeave: Callback;
 };
 /**
  * @hidden

package/dist/reconciler/index.js

@@ -6,7 +6,9 @@ import { componentKeys, isNotUndefined, noopConfig, propsChanged } from './utils
 function getPointerEnum(pointerKey) {
     const pointers = {
         onMouseDown: 1 /* PointerEventType.PET_DOWN */,
-        onMouseUp: 0 /* PointerEventType.PET_UP */
+        onMouseUp: 0 /* PointerEventType.PET_UP */,
+        onMouseEnter: 2 /* PointerEventType.PET_HOVER_ENTER */,
+        onMouseLeave: 3 /* PointerEventType.PET_HOVER_LEAVE */
     };
     return pointers[pointerKey];
 }
@@ -50,6 +52,12 @@ export function createReconciler(engine, pointerEvents) {
             else if (update.component === 'onMouseUp') {
                 pointerEvents.removeOnPointerUp(instance.entity);
             }
+            else if (update.component === 'onMouseEnter') {
+                pointerEvents.removeOnPointerHoverEnter(instance.entity);
+            }
+            else if (update.component === 'onMouseLeave') {
+                pointerEvents.removeOnPointerHoverLeave(instance.entity);
+            }
             return;
         }
         if (update.props) {
@@ -59,13 +67,24 @@ export function createReconciler(engine, pointerEvents) {
             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
-                showFeedback: true
-            });
+            const pointerEventSystem = update.component === 'onMouseDown'
+                ? pointerEvents.onPointerDown
+                : update.component === 'onMouseUp'
+                    ? pointerEvents.onPointerUp
+                    : update.component === 'onMouseEnter'
+                        ? pointerEvents.onPointerHoverEnter
+                        : update.component === 'onMouseLeave' && pointerEvents.onPointerHoverLeave;
+            if (pointerEventSystem) {
+                pointerEventSystem({
+                    entity: instance.entity,
+                    opts: {
+                        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
+                        showFeedback: true
+                    }
+                }, () => pointerEventCallback(instance.entity, pointerEvent));
+            }
         }
     }
     function removeComponent(instance, component) {

package/dist/reconciler/utils.js

@@ -33,6 +33,8 @@ const entityComponent = {
     uiTransform: undefined,
     onMouseDown: undefined,
     onMouseUp: undefined,
+    onMouseEnter: undefined,
+    onMouseLeave: undefined,
     uiInput: undefined,
     uiDropdown: undefined
 };

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@dcl/react-ecs",
   "description": "Decentraland ECS",
-  "version": "7.6.7",
+  "version": "7.6.8-12354882097.commit-0c727b8",
   "author": "DCL",
   "bugs": "https://github.com/decentraland/js-sdk-toolchain/issues",
   "dependencies": {
-    "@dcl/ecs": "7.6.7",
+    "@dcl/ecs": "7.6.8-12354882097.commit-0c727b8",
     "react": "^18.2.0",
     "react-reconciler": "^0.29.0"
   },
@@ -40,5 +40,5 @@
     "tsconfig": "./tsconfig.json"
   },
   "types": "./dist/index.d.ts",
-  "commit": "085da37eac19a1ee4794076a6acf221cf8b796fe"
+  "commit": "0c727b82d18c849bc14e34108ef9ce7e3531ca64"
 }