@dcl/ecs 7.13.0 → 7.13.1-19516109426.commit-e1e79aa

package/dist/components/generated/pb/decentraland/sdk/components/ui_transform.gen.js

@@ -1,6 +1,7 @@
 /* eslint-disable */
 import _m0 from "protobufjs/minimal";
 import { Color4 } from "../../common/colors.gen";
+import { Vector2 } from "../../common/vectors.gen";
 const protobufPackageSarasa = "decentraland.sdk.components";
 /**
  * @public
@@ -105,6 +106,65 @@ export var PointerFilterMode;
     PointerFilterMode[PointerFilterMode["PFM_NONE"] = 0] = "PFM_NONE";
     PointerFilterMode[PointerFilterMode["PFM_BLOCK"] = 1] = "PFM_BLOCK";
 })(PointerFilterMode || (PointerFilterMode = {}));
+/**
+ * @public
+ */
+export var ShowScrollBar;
+(function (ShowScrollBar) {
+    ShowScrollBar[ShowScrollBar["SSB_BOTH"] = 0] = "SSB_BOTH";
+    ShowScrollBar[ShowScrollBar["SSB_ONLY_VERTICAL"] = 1] = "SSB_ONLY_VERTICAL";
+    ShowScrollBar[ShowScrollBar["SSB_ONLY_HORIZONTAL"] = 2] = "SSB_ONLY_HORIZONTAL";
+    ShowScrollBar[ShowScrollBar["SSB_HIDDEN"] = 3] = "SSB_HIDDEN";
+})(ShowScrollBar || (ShowScrollBar = {}));
+function createBaseScrollPositionValue() {
+    return { value: undefined };
+}
+/**
+ * @public
+ */
+export var ScrollPositionValue;
+(function (ScrollPositionValue) {
+    function encode(message, writer = _m0.Writer.create()) {
+        switch (message.value?.$case) {
+            case "position":
+                Vector2.encode(message.value.position, writer.uint32(10).fork()).ldelim();
+                break;
+            case "reference":
+                writer.uint32(18).string(message.value.reference);
+                break;
+        }
+        return writer;
+    }
+    ScrollPositionValue.encode = encode;
+    function decode(input, length) {
+        const reader = input instanceof _m0.Reader ? input : _m0.Reader.create(input);
+        let end = length === undefined ? reader.len : reader.pos + length;
+        const message = createBaseScrollPositionValue();
+        while (reader.pos < end) {
+            const tag = reader.uint32();
+            switch (tag >>> 3) {
+                case 1:
+                    if (tag !== 10) {
+                        break;
+                    }
+                    message.value = { $case: "position", position: Vector2.decode(reader, reader.uint32()) };
+                    continue;
+                case 2:
+                    if (tag !== 18) {
+                        break;
+                    }
+                    message.value = { $case: "reference", reference: reader.string() };
+                    continue;
+            }
+            if ((tag & 7) === 4 || tag === 0) {
+                break;
+            }
+            reader.skipType(tag & 7);
+        }
+        return message;
+    }
+    ScrollPositionValue.decode = decode;
+})(ScrollPositionValue || (ScrollPositionValue = {}));
 function createBasePBUiTransform() {
     return {
         parent: 0,
@@ -180,6 +240,9 @@ function createBasePBUiTransform() {
         borderLeftColor: undefined,
         borderRightColor: undefined,
         opacity: undefined,
+        elementId: undefined,
+        scrollPosition: undefined,
+        scrollVisible: undefined,
         zIndex: undefined,
     };
 }
@@ -408,6 +471,15 @@ export var PBUiTransform;
         if (message.opacity !== undefined) {
             writer.uint32(589).float(message.opacity);
         }
+        if (message.elementId !== undefined) {
+            writer.uint32(594).string(message.elementId);
+        }
+        if (message.scrollPosition !== undefined) {
+            ScrollPositionValue.encode(message.scrollPosition, writer.uint32(602).fork()).ldelim();
+        }
+        if (message.scrollVisible !== undefined) {
+            writer.uint32(608).int32(message.scrollVisible);
+        }
         if (message.zIndex !== undefined) {
             writer.uint32(616).int32(message.zIndex);
         }
@@ -859,6 +931,24 @@ export var PBUiTransform;
                     }
                     message.opacity = reader.float();
                     continue;
+                case 74:
+                    if (tag !== 594) {
+                        break;
+                    }
+                    message.elementId = reader.string();
+                    continue;
+                case 75:
+                    if (tag !== 602) {
+                        break;
+                    }
+                    message.scrollPosition = ScrollPositionValue.decode(reader, reader.uint32());
+                    continue;
+                case 76:
+                    if (tag !== 608) {
+                        break;
+                    }
+                    message.scrollVisible = reader.int32();
+                    continue;
                 case 77:
                     if (tag !== 616) {
                         break;

package/dist/components/index.d.ts

@@ -2,25 +2,27 @@ import { GrowOnlyValueSetComponentDefinition, LastWriteWinElementSetComponentDef
 import { IEngine } from '../engine/types';
 import { AnimatorComponentDefinitionExtended } from './extended/Animator';
 import { AudioSourceComponentDefinitionExtended } from './extended/AudioSource';
+import { AudioStreamComponentDefinitionExtended } from './extended/AudioStream';
+import { AvatarEquippedDataComponentDefinitionExtended } from './extended/AvatarEquippedData';
+import { AvatarShapeComponentDefinitionExtended } from './extended/AvatarShape';
+import { InputModifierComponentDefinitionExtended } from './extended/InputModifier';
 import { MaterialComponentDefinitionExtended } from './extended/Material';
 import { MeshColliderComponentDefinitionExtended } from './extended/MeshCollider';
 import { MeshRendererComponentDefinitionExtended } from './extended/MeshRenderer';
 import { TweenComponentDefinitionExtended } from './extended/Tween';
-import { LwwComponentGetter, GSetComponentGetter } from './generated/index.gen';
+import { VirtualCameraComponentDefinitionExtended } from './extended/VirtualCamera';
+import { GSetComponentGetter, LwwComponentGetter } from './generated/index.gen';
+import { MediaState } from './generated/pb/decentraland/sdk/components/common/media_state.gen';
 import { NameType } from './manual/Name';
-import { ISyncComponentsType } from './manual/SyncComponents';
 import { INetowrkEntityType } from './manual/NetworkEntity';
 import { INetowrkParentType } from './manual/NetworkParent';
+import { ISyncComponentsType } from './manual/SyncComponents';
 import { TransformComponentExtended } from './manual/Transform';
-import { AudioStreamComponentDefinitionExtended } from './extended/AudioStream';
-import { MediaState } from './generated/pb/decentraland/sdk/components/common/media_state.gen';
-import { VirtualCameraComponentDefinitionExtended } from './extended/VirtualCamera';
-import { InputModifierComponentDefinitionExtended } from './extended/InputModifier';
 import { LightSourceComponentDefinitionExtended } from './extended/LightSource';
 import { TriggerAreaComponentDefinitionExtended } from './extended/TriggerArea';
 import { TagsComponentDefinitionExtended } from './manual/Tags';
 export * from './generated/index.gen';
-export type { GrowOnlyValueSetComponentDefinition, LastWriteWinElementSetComponentDefinition, LwwComponentGetter, GSetComponentGetter };
+export type { GrowOnlyValueSetComponentDefinition, GSetComponentGetter, LastWriteWinElementSetComponentDefinition, LwwComponentGetter };
 export declare const Transform: LwwComponentGetter<TransformComponentExtended>;
 export declare const Material: LwwComponentGetter<MaterialComponentDefinitionExtended>;
 export declare const Animator: LwwComponentGetter<AnimatorComponentDefinitionExtended>;
@@ -29,6 +31,8 @@ export declare const AudioStream: (engine: Pick<IEngine, 'defineComponentFromSch
 export declare const MeshRenderer: LwwComponentGetter<MeshRendererComponentDefinitionExtended>;
 export declare const MeshCollider: LwwComponentGetter<MeshColliderComponentDefinitionExtended>;
 export declare const Tween: LwwComponentGetter<TweenComponentDefinitionExtended>;
+export declare const AvatarShape: LwwComponentGetter<AvatarShapeComponentDefinitionExtended>;
+export declare const AvatarEquippedData: LwwComponentGetter<AvatarEquippedDataComponentDefinitionExtended>;
 export declare const VirtualCamera: LwwComponentGetter<VirtualCameraComponentDefinitionExtended>;
 export declare const InputModifier: LwwComponentGetter<InputModifierComponentDefinitionExtended>;
 export declare const LightSource: LwwComponentGetter<LightSourceComponentDefinitionExtended>;

package/dist/components/index.js

@@ -1,18 +1,20 @@
 import { defineAnimatorComponent } from './extended/Animator';
 import { defineAudioSourceComponent } from './extended/AudioSource';
+import { defineAudioStreamComponent } from './extended/AudioStream';
+import { defineAvatarEquippedDataComponent } from './extended/AvatarEquippedData';
+import { defineAvatarShapeComponent } from './extended/AvatarShape';
+import { defineInputModifierComponent } from './extended/InputModifier';
 import { defineMaterialComponent } from './extended/Material';
 import { defineMeshColliderComponent } from './extended/MeshCollider';
 import { defineMeshRendererComponent } from './extended/MeshRenderer';
 import { defineTweenComponent } from './extended/Tween';
+import { defineVirtualCameraComponent } from './extended/VirtualCamera';
+import { MediaState } from './generated/pb/decentraland/sdk/components/common/media_state.gen';
 import defineNameComponent from './manual/Name';
-import defineSyncComponent from './manual/SyncComponents';
 import defineNetworkEntity from './manual/NetworkEntity';
 import defineNetworkParent from './manual/NetworkParent';
+import defineSyncComponent from './manual/SyncComponents';
 import { defineTransformComponent } from './manual/Transform';
-import { defineAudioStreamComponent } from './extended/AudioStream';
-import { MediaState } from './generated/pb/decentraland/sdk/components/common/media_state.gen';
-import { defineVirtualCameraComponent } from './extended/VirtualCamera';
-import { defineInputModifierComponent } from './extended/InputModifier';
 import { defineLightSourceComponent } from './extended/LightSource';
 import { defineTriggerAreaComponent } from './extended/TriggerArea';
 import defineTagsComponent from './manual/Tags';
@@ -34,6 +36,10 @@ export const MeshCollider = (engine) => defineMeshColliderComponent(engine);
 /* @__PURE__ */
 export const Tween = (engine) => defineTweenComponent(engine);
 /* @__PURE__ */
+export const AvatarShape = (engine) => defineAvatarShapeComponent(engine);
+/* @__PURE__ */
+export const AvatarEquippedData = (engine) => defineAvatarEquippedDataComponent(engine);
+/* @__PURE__ */
 export const VirtualCamera = (engine) => defineVirtualCameraComponent(engine);
 /* @__PURE__*/
 export const InputModifier = (engine) => defineInputModifierComponent(engine);

package/dist/components/types.d.ts

@@ -3,6 +3,8 @@ export type { AudioSourceComponentDefinitionExtended } from './extended/AudioSou
 export type { AudioStreamComponentDefinitionExtended } from './extended/AudioStream';
 export type { MeshRendererComponentDefinitionExtended } from './extended/MeshRenderer';
 export type { MeshColliderComponentDefinitionExtended } from './extended/MeshCollider';
+export type { AvatarEquippedDataComponentDefinitionExtended, AvatarEquippedDataType } from './extended/AvatarEquippedData';
+export type { AvatarShapeComponentDefinitionExtended, AvatarShapeType } from './extended/AvatarShape';
 export type { TextureHelper, MaterialComponentDefinitionExtended } from './extended/Material';
 export type { TweenHelper, TweenComponentDefinitionExtended } from './extended/Tween';
 export type { CameraTransitionHelper, VirtualCameraComponentDefinitionExtended } from './extended/VirtualCamera';

package/dist/engine/input.d.ts

@@ -32,6 +32,12 @@ export type IInputSystem = {
      * @returns the input command info or undefined if there is no command in the last tick-update
      */
     getInputCommand: (inputAction: InputAction, pointerEventType: PointerEventType, entity?: Entity) => PBPointerEventsResult | null;
+    /**
+     * @public
+     * Get an ordered iterator over events received within the current frame.
+     * @returns the iterator
+     */
+    getInputCommands: () => Generator<PBPointerEventsResult>;
 };
 /**
  * @public

package/dist/engine/input.js

@@ -185,11 +185,17 @@ export function createInputSystem(engine) {
     function isPressed(inputAction) {
         return globalState.buttonState.get(inputAction)?.state === 1 /* PointerEventType.PET_DOWN */;
     }
+    function* getInputCommands() {
+        for (let i = globalState.thisFrameCommands.length - 1; i >= 0; i--) {
+            yield globalState.thisFrameCommands[i];
+        }
+    }
     return {
         isPressed,
         getClick,
         getInputCommand,
         isClicked,
-        isTriggered
+        isTriggered,
+        getInputCommands
     };
 }

package/dist/runtime/initialization/index.d.ts

@@ -53,7 +53,7 @@ export declare const videoEventsSystem: VideoEventsSystem;
 export { VideoEventsSystem };
 /**
  * @public
- * Register callback functions to a particular entity on tween events.
+ * Register callback functions to a particular entity on video events.
  */
 export declare const tweenSystem: TweenSystem;
 export { TweenSystem };

package/dist/runtime/initialization/index.js

@@ -50,7 +50,7 @@ export const raycastSystem = /* @__PURE__ */ createRaycastSystem(engine);
 export const videoEventsSystem = /* @__PURE__ */ createVideoEventsSystem(engine);
 /**
  * @public
- * Register callback functions to a particular entity on tween events.
+ * Register callback functions to a particular entity on video events.
  */
 export const tweenSystem = createTweenSystem(engine);
 /**

package/dist/systems/events.d.ts

@@ -17,6 +17,12 @@ export type EventSystemOptions = {
     showFeedback?: boolean;
     showHighlight?: boolean;
 };
+/**
+ * @public
+ */
+export type EventSystemOptionsCallback = EventSystemOptions & {
+    cb: EventSystemCallback;
+};
 export declare const getDefaultOpts: (opts?: Partial<EventSystemOptions>) => EventSystemOptions;
 /**
  * @public
@@ -46,11 +52,37 @@ export interface PointerEventsSystem {
      * @param entity - Entity where the callback was attached
      */
     removeOnPointerHoverLeave(entity: Entity): void;
+    /**
+     * @public
+     * Remove the callback for onPointerDrag event
+     * @param entity - Entity where the callback was attached
+     */
+    removeOnPointerDrag(entity: Entity): void;
+    /**
+     * @public
+     * Remove the callback for onPointerDragLocked event
+     * @param entity - Entity where the callback was attached
+     */
+    removeOnPointerDragLocked(entity: Entity): void;
+    /**
+     * @public
+     * Remove the callback for onPointerDragEnd event
+     * @param entity - Entity where the callback was attached
+     */
+    removeOnPointerDragEnd(entity: Entity): void;
+    /**
+     * @public
+     * Execute callbacks when the user presses one of the InputButtons pointing at the entity
+     * @param pointerData - Entity to attach the callbacks, list of options to trigger Feedback, Button, and Callback
+     */
+    onPointerDown(pointerData: {
+        entity: Entity;
+        optsList: EventSystemOptionsCallback[];
+    }): void;
     /**
      * @public
      * Execute callback when the user press the InputButton pointing at the entity
      * @param pointerData - Entity to attach the callback, Opts to trigger Feedback and Button
-     * @param cb - Function to execute when click fires
      */
     onPointerDown(pointerData: {
         entity: Entity;
@@ -63,6 +95,15 @@ export interface PointerEventsSystem {
      * @param opts - Opts to trigger Feedback and Button
      */
     onPointerDown(entity: Entity, cb: EventSystemCallback, opts?: Partial<EventSystemOptions>): void;
+    /**
+     * @public
+     * Execute callbacks when the user releases one of the InputButtons pointing at the entity
+     * @param pointerData - Entity to attach the callbacks, list of options to trigger Feedback, Button, and Callback
+     */
+    onPointerUp(pointerData: {
+        entity: Entity;
+        optsList: EventSystemOptionsCallback[];
+    }): void;
     /**
      * @public
      * Execute callback when the user releases the InputButton pointing at the entity
@@ -100,6 +141,64 @@ export interface PointerEventsSystem {
         entity: Entity;
         opts?: Partial<EventSystemOptions>;
     }, cb: EventSystemCallback): void;
+    /**
+     * @public
+     * Execute callbacks when the user drags the pointer from inside the entity
+     * @param pointerData - Entity to attach the callbacks, list of options to trigger Feedback, Button, and Callback
+     */
+    onPointerDrag(pointerData: {
+        entity: Entity;
+        optsList: EventSystemOptionsCallback[];
+    }): void;
+    /**
+     * @public
+     * Execute callback when the user clicks and drags the pointer from inside the entity
+     * @param pointerData - Entity to attach the callback - Opts to trigger Feedback and Button
+     * @param cb - Function to execute when click fires
+     */
+    onPointerDrag(pointerData: {
+        entity: Entity;
+        opts?: Partial<EventSystemOptions>;
+    }, cb: EventSystemCallback): void;
+    /**
+     * @public
+     * Execute callbacks when the user drags the pointer from inside the entity, locking the cursor in place.
+     * @param pointerData - Entity to attach the callbacks, list of options to trigger Feedback, Button, and Callback
+     */
+    onPointerDragLocked(pointerData: {
+        entity: Entity;
+        optsList: EventSystemOptionsCallback[];
+    }): void;
+    /**
+     * @public
+     * Execute callback when the user clicks and drags the pointer from inside the entity,
+     * locking the cursor in place
+     * @param pointerData - Entity to attach the callback - Opts to trigger Feedback and Button
+     * @param cb - Function to execute when click fires
+     */
+    onPointerDragLocked(pointerData: {
+        entity: Entity;
+        opts?: Partial<EventSystemOptions>;
+    }, cb: EventSystemCallback): void;
+    /**
+     * @public
+     * Execute callbacks when the user releases a button after a drag
+     * @param pointerData - Entity to attach the callbacks, list of options to trigger Feedback, Button, and Callback
+     */
+    onPointerDragEnd(pointerData: {
+        entity: Entity;
+        optsList: EventSystemOptionsCallback[];
+    }): void;
+    /**
+     * @public
+     * Execute callback when the user releases the button after a drag
+     * @param pointerData - Entity to attach the callback - Opts to trigger Feedback and Button
+     * @param cb - Function to execute when click fires
+     */
+    onPointerDragEnd(pointerData: {
+        entity: Entity;
+        opts?: Partial<EventSystemOptions>;
+    }, cb: EventSystemCallback): void;
 }
 /**
  * @public

package/dist/systems/events.js

@@ -18,6 +18,9 @@ export function createPointerEventsSystem(engine, inputSystem) {
         EventType[EventType["Up"] = 2] = "Up";
         EventType[EventType["HoverEnter"] = 3] = "HoverEnter";
         EventType[EventType["HoverLeave"] = 4] = "HoverLeave";
+        EventType[EventType["Drag"] = 5] = "Drag";
+        EventType[EventType["DragLocked"] = 6] = "DragLocked";
+        EventType[EventType["DragEnd"] = 7] = "DragEnd";
     })(EventType || (EventType = {}));
     const eventsMap = new Map();
     function getEvent(entity) {
@@ -52,77 +55,148 @@ export function createPointerEventsSystem(engine, inputSystem) {
         else if (eventType === EventType.HoverEnter) {
             return 2 /* PointerEventType.PET_HOVER_ENTER */;
         }
+        else if (eventType === EventType.Drag) {
+            return 5 /* PointerEventType.PET_DRAG */;
+        }
+        else if (eventType === EventType.DragLocked) {
+            return 4 /* PointerEventType.PET_DRAG_LOCKED */;
+        }
+        else if (eventType === EventType.DragEnd) {
+            return 6 /* PointerEventType.PET_DRAG_END */;
+        }
         return 1 /* PointerEventType.PET_DOWN */;
     }
+    function getEventType(pet) {
+        if (pet === 0 /* PointerEventType.PET_UP */) {
+            return EventType.Up;
+        }
+        else if (pet === 2 /* PointerEventType.PET_HOVER_ENTER */) {
+            return EventType.HoverEnter;
+        }
+        else if (pet === 3 /* PointerEventType.PET_HOVER_LEAVE */) {
+            return EventType.HoverLeave;
+        }
+        else if (pet === 5 /* PointerEventType.PET_DRAG */) {
+            return EventType.Drag;
+        }
+        else if (pet === 4 /* PointerEventType.PET_DRAG_LOCKED */) {
+            return EventType.DragLocked;
+        }
+        else if (pet === 6 /* PointerEventType.PET_DRAG_END */) {
+            return EventType.DragEnd;
+        }
+        else {
+            return EventType.Down;
+        }
+    }
     function removeEvent(entity, type) {
         const event = getEvent(entity);
-        const pointerEvent = event.get(type);
-        if (pointerEvent?.opts.hoverText) {
-            removePointerEvent(entity, getPointerEvent(type), pointerEvent.opts.button);
+        const pointerEventList = event.get(type);
+        if (pointerEventList === undefined) {
+            return;
+        }
+        for (const button of pointerEventList.keys()) {
+            removePointerEvent(entity, getPointerEvent(type), button);
         }
         event.delete(type);
     }
     engine.addSystem(function EventSystem() {
-        for (const [entity, event] of eventsMap) {
+        if (eventsMap.size === 0) {
+            return;
+        }
+        for (const entity of eventsMap.keys()) {
             if (engine.getEntityState(entity) === EntityState.Removed) {
                 eventsMap.delete(entity);
+            }
+        }
+        for (const command of inputSystem.getInputCommands()) {
+            const entity = command.hit?.entityId;
+            if (entity === undefined) {
+                continue;
+            }
+            const entityMap = eventsMap.get(entity);
+            if (entityMap === undefined) {
                 continue;
             }
-            for (const [eventType, { cb, opts }] of event) {
-                if (eventType === EventType.Click) {
-                    const command = inputSystem.getClick(opts.button, entity);
-                    if (command)
-                        checkNotThenable(cb(command.up), 'Click event returned a thenable. Only synchronous functions are allowed');
+            const typeMap = entityMap.get(getEventType(command.state));
+            if (typeMap) {
+                const data = typeMap.get(command.button);
+                if (data) {
+                    checkNotThenable(data.cb(command), 'Event handler returned a thenable. Only synchronous functions are allowed');
                 }
-                if (eventType === EventType.Down ||
-                    eventType === EventType.Up ||
-                    eventType === EventType.HoverEnter ||
-                    eventType === EventType.HoverLeave) {
-                    const command = inputSystem.getInputCommand(opts.button, getPointerEvent(eventType), entity);
-                    if (command) {
-                        checkNotThenable(cb(command), 'Event handler returned a thenable. Only synchronous functions are allowed');
+                const anyData = typeMap.get(3 /* InputAction.IA_ANY */);
+                if (anyData) {
+                    checkNotThenable(anyData.cb(command), 'Event handler returned a thenable. Only synchronous functions are allowed');
+                }
+            }
+            // check clicks separately
+            if (command.state === 0 /* PointerEventType.PET_UP */) {
+                const clickMap = entityMap.get(EventType.Click);
+                if (clickMap) {
+                    const data = clickMap.get(command.button);
+                    if (data && inputSystem.getClick(command.button, entity)) {
+                        checkNotThenable(data.cb(command), 'Click event returned a thenable. Only synchronous functions are allowed');
+                    }
+                    const anyData = clickMap.get(3 /* InputAction.IA_ANY */);
+                    if (anyData && inputSystem.getClick(command.button, entity)) {
+                        checkNotThenable(anyData.cb(command), 'Event handler returned a thenable. Only synchronous functions are allowed');
                     }
                 }
             }
         }
     });
-    const onPointerDown = (...args) => {
-        const [data, cb, maybeOpts] = args;
-        if (typeof data === 'number') {
-            return onPointerDown({ entity: data, opts: maybeOpts ?? {} }, cb);
-        }
-        const { entity, opts } = data;
-        const options = getDefaultOpts(opts);
-        removeEvent(entity, EventType.Down);
-        getEvent(entity).set(EventType.Down, { cb, opts: options });
-        setPointerEvent(entity, 1 /* PointerEventType.PET_DOWN */, options);
-    };
-    const onPointerUp = (...args) => {
-        const [data, cb, maybeOpts] = args;
-        if (typeof data === 'number') {
-            return onPointerUp({ entity: data, opts: maybeOpts ?? {} }, cb);
-        }
-        const { entity, opts } = data;
-        const options = getDefaultOpts(opts);
-        removeEvent(entity, EventType.Up);
-        getEvent(entity).set(EventType.Up, { cb, opts: options });
-        setPointerEvent(entity, 0 /* PointerEventType.PET_UP */, options);
-    };
-    const onPointerHoverEnter = (...args) => {
-        const [data, cb] = args;
-        const { entity, opts } = data;
-        const options = getDefaultOpts(opts);
-        removeEvent(entity, EventType.HoverEnter);
-        getEvent(entity).set(EventType.HoverEnter, { cb, opts: options });
-        setPointerEvent(entity, 2 /* PointerEventType.PET_HOVER_ENTER */, options);
-    };
-    const onPointerHoverLeave = (...args) => {
-        const [data, cb] = args;
-        const { entity, opts } = data;
-        const options = getDefaultOpts(opts);
-        removeEvent(entity, EventType.HoverLeave);
-        getEvent(entity).set(EventType.HoverLeave, { cb, opts: options });
-        setPointerEvent(entity, 3 /* PointerEventType.PET_HOVER_LEAVE */, options);
+    // return a function with the correct event type.
+    // we use onPointerDown as the "archetype" for the returned function, but it fits with
+    // all the onPointer* declarations
+    const onPointerFunction = (ty) => {
+        return (arg0, arg1, arg2) => {
+            let entity;
+            let optsList;
+            if (typeof arg0 === 'number') {
+                // called as onPointerDown(entity: Entity, cb: EventSystemCallback, opts?: Partial<EventSystemOptions>): void
+                entity = arg0;
+                const cb = arg1;
+                const opts = arg2;
+                optsList = [{ cb, ...getDefaultOpts(opts) }];
+            }
+            else if (typeof arg1 === 'function') {
+                // called as onPointerDown(pointerData: { entity: Entity; opts?: Partial<EventSystemOptions> }, cb: EventSystemCallback): void
+                const { entity: e, opts } = arg0;
+                const cb = arg1;
+                entity = e;
+                optsList = [{ cb, ...getDefaultOpts(opts) }];
+            }
+            else {
+                // called as onPointerDown(pointerData: { entity: Entity; optsList: EventSystemOptionsCallback[] }): void
+                const { entity: e, optsList: o } = arg0;
+                entity = e;
+                optsList = o;
+            }
+            const previous = getEvent(entity).get(ty) ?? new Map();
+            const callbacks = new Map();
+            for (const opts of optsList) {
+                const prevOpts = previous.get(opts.button);
+                if (prevOpts !== undefined) {
+                    if (prevOpts.hoverText !== opts.hoverText ||
+                        prevOpts.maxDistance !== opts.maxDistance ||
+                        prevOpts.showFeedback !== opts.showFeedback ||
+                        prevOpts.showHighlight !== opts.showHighlight) {
+                        removePointerEvent(entity, getPointerEvent(ty), opts.button);
+                        setPointerEvent(entity, getPointerEvent(ty), opts);
+                    }
+                }
+                else {
+                    setPointerEvent(entity, getPointerEvent(ty), opts);
+                }
+                callbacks.set(opts.button, opts);
+            }
+            for (const button of previous.keys()) {
+                if (!callbacks.has(button)) {
+                    removePointerEvent(entity, getPointerEvent(ty), button);
+                }
+            }
+            getEvent(entity).set(ty, callbacks);
+        };
     };
     return {
         removeOnClick(entity) {
@@ -140,18 +214,22 @@ export function createPointerEventsSystem(engine, inputSystem) {
         removeOnPointerHoverLeave(entity) {
             removeEvent(entity, EventType.HoverLeave);
         },
-        onClick(value, cb) {
-            const { entity } = value;
-            const options = getDefaultOpts(value.opts);
-            // Clear previous event with over feedback included
-            removeEvent(entity, EventType.Click);
-            // Set new event
-            getEvent(entity).set(EventType.Click, { cb, opts: options });
-            setPointerEvent(entity, 1 /* PointerEventType.PET_DOWN */, options);
+        removeOnPointerDrag(entity) {
+            removeEvent(entity, EventType.Drag);
+        },
+        removeOnPointerDragLocked(entity) {
+            removeEvent(entity, EventType.DragLocked);
+        },
+        removeOnPointerDragEnd(entity) {
+            removeEvent(entity, EventType.DragEnd);
         },
-        onPointerDown,
-        onPointerUp,
-        onPointerHoverEnter,
-        onPointerHoverLeave
+        onClick: onPointerFunction(EventType.Click),
+        onPointerDown: onPointerFunction(EventType.Down),
+        onPointerUp: onPointerFunction(EventType.Up),
+        onPointerHoverEnter: onPointerFunction(EventType.HoverEnter),
+        onPointerHoverLeave: onPointerFunction(EventType.HoverLeave),
+        onPointerDrag: onPointerFunction(EventType.Drag),
+        onPointerDragLocked: onPointerFunction(EventType.DragLocked),
+        onPointerDragEnd: onPointerFunction(EventType.DragEnd)
     };
 }