pixi.js

Version:

pixijs.com

pixijs/pixijs

1 lines • 48.2 kB

Source Map (JSON)

View Raw

{"version":3,"file":"FederatedEventTarget.mjs","sources":["../../src/events/FederatedEventTarget.ts"],"sourcesContent":["import { EventSystem } from './EventSystem';\nimport { FederatedEvent } from './FederatedEvent';\n\nimport type EventEmitter from 'eventemitter3';\nimport type { Container } from '../scene/container/Container';\nimport type { AllFederatedEventMap } from './FederatedEventMap';\nimport type { FederatedPointerEvent } from './FederatedPointerEvent';\nimport type { FederatedWheelEvent } from './FederatedWheelEvent';\n\n/**\n * The type of cursor to use when the mouse pointer is hovering over an interactive element.\n * Accepts any valid CSS cursor value.\n * @example\n * ```ts\n * // Basic cursor types\n * sprite.cursor = 'pointer'; // Hand cursor for clickable elements\n * sprite.cursor = 'grab'; // Grab cursor for draggable elements\n * sprite.cursor = 'crosshair'; // Precise cursor for selection\n *\n * // Direction cursors\n * sprite.cursor = 'n-resize'; // North resize\n * sprite.cursor = 'ew-resize'; // East-west resize\n * sprite.cursor = 'nesw-resize';// Northeast-southwest resize\n *\n * // Custom cursor with fallback\n * sprite.cursor = 'url(\"custom.png\"), auto';\n * ```\n *\n * Common cursor values:\n * - Basic: `auto`, `default`, `none`, `pointer`, `wait`\n * - Text: `text`, `vertical-text`\n * - Links: `alias`, `copy`, `move`\n * - Selection: `cell`, `crosshair`\n * - Drag: `grab`, `grabbing`\n * - Disabled: `not-allowed`, `no-drop`\n * - Resize: `n-resize`, `e-resize`, `s-resize`, `w-resize`\n * - Bidirectional: `ns-resize`, `ew-resize`, `nesw-resize`, `nwse-resize`\n * - Other: `help`, `progress`\n * @see {@link https://developer.mozilla.org/en-US/docs/Web/CSS/cursor} MDN Cursor Documentation\n * @category events\n * @standard\n */\nexport type Cursor = 'auto'\n| 'default'\n| 'none'\n| 'context-menu'\n| 'help'\n| 'pointer'\n| 'progress'\n| 'wait'\n| 'cell'\n| 'crosshair'\n| 'text'\n| 'vertical-text'\n| 'alias'\n| 'copy'\n| 'move'\n| 'no-drop'\n| 'not-allowed'\n| 'e-resize'\n| 'n-resize'\n| 'ne-resize'\n| 'nw-resize'\n| 's-resize'\n| 'se-resize'\n| 'sw-resize'\n| 'w-resize'\n| 'ns-resize'\n| 'ew-resize'\n| 'nesw-resize'\n| 'col-resize'\n| 'nwse-resize'\n| 'row-resize'\n| 'all-scroll'\n| 'zoom-in'\n| 'zoom-out'\n| 'grab'\n| 'grabbing';\n\n/**\n * Interface defining a hit area for pointer interaction. The hit area specifies\n * the region in which pointer events should be captured by a display object.\n * @example\n * ```ts\n * // Create a rectangular hit area\n * sprite.hitArea = new Rectangle(0, 0, 100, 100);\n *\n * // Create a circular hit area\n * sprite.hitArea = new Circle(50, 50, 50);\n *\n * // Custom hit area implementation\n * sprite.hitArea = {\n * contains(x: number, y: number) {\n * // Custom hit testing logic\n * return x >= 0 && x <= 100 && y >= 0 && y <= 100;\n * }\n * };\n * ```\n * @remarks\n * - Hit areas override the default bounds-based hit testing\n * - Can improve performance by simplifying hit tests\n * - Useful for irregular shapes or precise interaction areas\n * - Common implementations include Rectangle, Circle, Polygon\n * @see {@link Container.eventMode} For enabling interactivity\n * @see {@link Container.interactive} For backwards compatibility\n * @category events\n * @standard\n */\nexport interface IHitArea\n{\n /**\n * Checks if the given coordinates are inside this hit area.\n * @param {number} x - The x coordinate to check\n * @param {number} y - The y coordinate to check\n * @returns True if the coordinates are inside the hit area\n */\n contains(x: number, y: number): boolean;\n}\n\n/**\n * Function type for handlers, e.g., onclick\n * @category events\n * @advanced\n */\nexport type FederatedEventHandler<T = FederatedPointerEvent> = (event: T) => void;\n\n/**\n * The type of interaction behavior for a Container. This is set via the {@link Container#eventMode} property.\n * @example\n * ```ts\n * // Basic event mode setup\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static'; // Enable standard interaction\n * sprite.on('pointerdown', () => { console.log('clicked!'); });\n *\n * // Different event modes\n * sprite.eventMode = 'none'; // Disable all interaction\n * sprite.eventMode = 'passive'; // Only allow interaction on children\n * sprite.eventMode = 'auto'; // Like DOM pointer-events: auto\n * sprite.eventMode = 'dynamic'; // For moving/animated objects\n * ```\n *\n * Available modes:\n * - `'none'`: Ignores all interaction events, even on its children\n * - `'passive'`: **(default)** Does not emit events and ignores hit testing on itself and non-interactive children.\n * Interactive children will still emit events.\n * - `'auto'`: Does not emit events but is hit tested if parent is interactive. Same as `interactive = false` in v7\n * - `'static'`: Emit events and is hit tested. Same as `interactive = true` in v7\n * - `'dynamic'`: Emits events and is hit tested but will also receive mock interaction events fired from\n * a ticker to allow for interaction when the mouse isn't moving\n *\n * Performance tips:\n * - Use `'none'` for pure visual elements\n * - Use `'passive'` for containers with some interactive children\n * - Use `'static'` for standard buttons/controls\n * - Use `'dynamic'` only for moving/animated interactive elements\n * @since 7.2.0\n * @category events\n * @standard\n */\nexport type EventMode = 'none' | 'passive' | 'auto' | 'static' | 'dynamic';\n\n/**\n * The properties available for any interactive object. This interface defines the core interaction\n * properties and event handlers that can be set on any Container in PixiJS.\n * @example\n * ```ts\n * // Basic interactive setup\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n * sprite.cursor = 'pointer';\n *\n * // Using event handlers\n * sprite.on('click', (event) => console.log('Sprite clicked!', event));\n * sprite.on('pointerdown', (event) => console.log('Pointer down!', event));\n *\n * // Using property-based event handlers\n * sprite.onclick = (event) => console.log('Clicked!');\n * sprite.onpointerenter = () => sprite.alpha = 0.7;\n * sprite.onpointerleave = () => sprite.alpha = 1.0;\n *\n * // Custom hit area\n * sprite.hitArea = new Rectangle(0, 0, 100, 100);\n * ```\n *\n * Core Properties:\n * - `eventMode`: Controls how the object handles interaction events\n * - `cursor`: Sets the mouse cursor when hovering\n * - `hitArea`: Defines custom hit testing area\n * - `interactive`: Alias for `eventMode` to enable interaction with \"static\" or \"passive\" modes\n * - `interactiveChildren`: Controls hit testing on children\n *\n * Event Handlers:\n * - Mouse: click, mousedown, mouseup, mousemove, mouseenter, mouseleave\n * - Touch: touchstart, touchend, touchmove, tap\n * - Pointer: pointerdown, pointerup, pointermove, pointerover\n * - Global: globalpointermove, globalmousemove, globaltouchmove\n * > [!IMPORTANT] Global events are fired when the pointer moves even if it is outside the bounds of the Container.\n * @see {@link EventMode} For interaction mode details\n * @see {@link Cursor} For cursor style options\n * @see {@link IHitArea} For hit area implementation\n * @category events\n * @standard\n */\nexport interface FederatedOptions\n{\n /**\n * The cursor style to display when the mouse pointer is hovering over the object.\n * Accepts any valid CSS cursor value or custom cursor URL.\n * @example\n * ```ts\n * // Common cursor types\n * sprite.cursor = 'pointer'; // Hand cursor for clickable elements\n * sprite.cursor = 'grab'; // Grab cursor for draggable elements\n * sprite.cursor = 'crosshair'; // Precise cursor for selection\n * sprite.cursor = 'not-allowed'; // Indicate disabled state\n *\n * // Direction cursors\n * sprite.cursor = 'n-resize'; // North resize\n * sprite.cursor = 'ew-resize'; // East-west resize\n * sprite.cursor = 'nesw-resize'; // Northeast-southwest resize\n *\n * // Custom cursor with fallback\n * sprite.cursor = 'url(\"custom.png\"), auto';\n * sprite.cursor = 'url(\"cursor.cur\") 2 2, pointer'; // With hotspot offset\n * ```\n * @type {Cursor | string}\n * @default undefined\n * @see {@link EventSystem.cursorStyles} For setting global cursor styles\n * @see {@link https://developer.mozilla.org/en-US/docs/Web/CSS/cursor} MDN Cursor Documentation\n */\n cursor?: Cursor | (string & {});\n /**\n * Enable interaction events for the Container. Touch, pointer and mouse events are supported.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n *\n * // Enable standard interaction (like buttons)\n * sprite.eventMode = 'static';\n * sprite.on('pointerdown', () => console.log('clicked!'));\n *\n * // Enable for moving objects\n * sprite.eventMode = 'dynamic';\n * sprite.on('pointermove', () => updatePosition());\n *\n * // Disable all interaction\n * sprite.eventMode = 'none';\n *\n * // Only allow child interactions\n * sprite.eventMode = 'passive';\n * ```\n *\n * Available modes:\n *\n * - `'none'`: Ignores all interaction events, even on its children. Best for pure visuals.\n * - `'passive'`: **(default)** Does not emit events and ignores hit testing on itself and non-interactive\n * children. Interactive children will still emit events.\n * - `'auto'`: Does not emit events but is hit tested if parent is interactive. Same as `interactive = false` in v7.\n * - `'static'`: Emit events and is hit tested. Same as `interactive = true` in v7. Best for buttons/UI.\n * - `'dynamic'`: Like static but also receives synthetic events when pointer is idle. Best for moving objects.\n *\n * Performance tips:\n * - Use `'none'` for pure visual elements\n * - Use `'passive'` for containers with some interactive children\n * - Use `'static'` for standard UI elements\n * - Use `'dynamic'` only when needed for moving/animated elements\n * @since 7.2.0\n */\n eventMode?: EventMode;\n /**\n * Whether this object should fire UI events. This is an alias for `eventMode` set to `'static'` or `'passive'`.\n * Setting this to true will enable interaction events like `pointerdown`, `click`, etc.\n * Setting it to false will disable all interaction events on this object.\n * @see {@link Container.eventMode}\n * @example\n * ```ts\n * // Enable interaction events\n * sprite.interactive = true; // Sets eventMode = 'static'\n * sprite.interactive = false; // Sets eventMode = 'passive'\n * ```\n */\n interactive?: boolean\n /**\n * Controls whether children of this container can receive pointer events.\n *\n * Setting this to false allows PixiJS to skip hit testing on all children,\n * improving performance for containers with many non-interactive children.\n * @default true\n * @example\n * ```ts\n * // Container with many visual-only children\n * const container = new Container();\n * container.interactiveChildren = false; // Skip hit testing children\n *\n * // Menu with interactive buttons\n * const menu = new Container();\n * menu.interactiveChildren = true; // Test all children\n * menu.addChild(button1, button2, button3);\n *\n * // Performance optimization\n * background.interactiveChildren = false;\n * foreground.interactiveChildren = true;\n * ```\n */\n interactiveChildren?: boolean;\n /**\n * Defines a custom hit area for pointer interaction testing. When set, this shape will be used\n * for hit testing instead of the container's standard bounds.\n * @example\n * ```ts\n * import { Rectangle, Circle, Sprite } from 'pixi.js';\n *\n * // Rectangular hit area\n * const button = new Sprite(texture);\n * button.eventMode = 'static';\n * button.hitArea = new Rectangle(0, 0, 100, 50);\n *\n * // Circular hit area\n * const icon = new Sprite(texture);\n * icon.eventMode = 'static';\n * icon.hitArea = new Circle(32, 32, 32);\n *\n * // Custom hit area with polygon\n * const custom = new Sprite(texture);\n * custom.eventMode = 'static';\n * custom.hitArea = new Polygon([0,0, 100,0, 100,100, 0,100]);\n *\n * // Custom hit testing logic\n * sprite.hitArea = {\n * contains(x: number, y: number) {\n * // Custom collision detection\n * return x >= 0 && x <= width && y >= 0 && y <= height;\n * }\n * };\n * ```\n * @remarks\n * - Takes precedence over the container's bounds for hit testing\n * - Can improve performance by simplifying collision checks\n * - Useful for irregular shapes or precise click areas\n */\n hitArea?: IHitArea | null;\n\n /**\n * Property-based event handler for the `click` event.\n * Fired when a pointer device (mouse, touch, etc.) completes a click action.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('click', (event) => {\n * console.log('Sprite clicked at:', event.global.x, event.global.y);\n * });\n * // Using property-based handler\n * sprite.onclick = (event) => {\n * console.log('Clicked at:', event.global.x, event.global.y);\n * };\n * ```\n * @default null\n */\n onclick?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `mousedown` event.\n * Fired when a mouse button is pressed while the pointer is over the object.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('mousedown', (event) => {\n * sprite.alpha = 0.5; // Visual feedback\n * console.log('Mouse button:', event.button);\n * });\n * // Using property-based handler\n * sprite.onmousedown = (event) => {\n * sprite.alpha = 0.5; // Visual feedback\n * console.log('Mouse button:', event.button);\n * };\n * ```\n * @default null\n */\n onmousedown?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `mouseenter` event.\n * Fired when the mouse pointer enters the bounds of the object. Does not bubble.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('mouseenter', (event) => {\n * sprite.scale.set(1.1);\n * });\n * // Using property-based handler\n * sprite.onmouseenter = (event) => {\n * sprite.scale.set(1.1);\n * };\n * ```\n * @default null\n */\n onmouseenter?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `mouseleave` event.\n * Fired when the pointer leaves the bounds of the display object. Does not bubble.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('mouseleave', (event) => {\n * sprite.scale.set(1.0);\n * });\n * // Using property-based handler\n * sprite.onmouseleave = (event) => {\n * sprite.scale.set(1.0);\n * };\n * ```\n * @default null\n */\n onmouseleave?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `mousemove` event.\n * Fired when the pointer moves while over the display object.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('mousemove', (event) => {\n * // Get coordinates relative to the sprite\n * console.log('Local:', event.getLocalPosition(sprite));\n * });\n * // Using property-based handler\n * sprite.onmousemove = (event) => {\n * // Get coordinates relative to the sprite\n * console.log('Local:', event.getLocalPosition(sprite));\n * };\n * ```\n * @default null\n */\n onmousemove?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `globalmousemove` event.\n *\n * Fired when the mouse moves anywhere, regardless of whether the pointer is over this object.\n * The object must have `eventMode` set to 'static' or 'dynamic' to receive this event.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('globalmousemove', (event) => {\n * // Move sprite to mouse position\n * sprite.position.copyFrom(event.global);\n * });\n * // Using property-based handler\n * sprite.onglobalmousemove = (event) => {\n * // Move sprite to mouse position\n * sprite.position.copyFrom(event.global);\n * };\n * ```\n * @default null\n * @remarks\n * - Fires even when the mouse is outside the object's bounds\n * - Useful for drag operations or global mouse tracking\n * - Must have `eventMode` set appropriately to receive events\n * - Part of the global move events family along with `globalpointermove` and `globaltouchmove`\n */\n onglobalmousemove?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `mouseout` event.\n * Fired when the pointer moves out of the bounds of the display object.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('mouseout', (event) => {\n * sprite.scale.set(1.0);\n * });\n * // Using property-based handler\n * sprite.onmouseout = (event) => {\n * sprite.scale.set(1.0);\n * };\n * ```\n * @default null\n */\n onmouseout?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `mouseover` event.\n * Fired when the pointer moves onto the bounds of the display object.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('mouseover', (event) => {\n * sprite.scale.set(1.1);\n * });\n * // Using property-based handler\n * sprite.onmouseover = (event) => {\n * sprite.scale.set(1.1);\n * };\n * ```\n * @default null\n */\n onmouseover?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `mouseup` event.\n * Fired when a mouse button is released over the display object.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('mouseup', (event) => {\n * sprite.scale.set(1.0);\n * });\n * // Using property-based handler\n * sprite.onmouseup = (event) => {\n * sprite.scale.set(1.0);\n * };\n * ```\n * @default null\n */\n onmouseup?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `mouseupoutside` event.\n * Fired when a mouse button is released outside the display object that initially\n * registered a mousedown.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('mouseupoutside', (event) => {\n * sprite.scale.set(1.0);\n * });\n * // Using property-based handler\n * sprite.onmouseupoutside = (event) => {\n * sprite.scale.set(1.0);\n * };\n * ```\n * @default null\n */\n onmouseupoutside?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `pointercancel` event.\n * Fired when a pointer device interaction is canceled or lost.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('pointercancel', (event) => {\n * sprite.scale.set(1.0);\n * });\n * // Using property-based handler\n * sprite.onpointercancel = (event) => {\n * sprite.scale.set(1.0);\n * };\n * ```\n * @default null\n */\n onpointercancel?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `pointerdown` event.\n * Fired when a pointer device button (mouse, touch, pen, etc.) is pressed.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('pointerdown', (event) => {\n * sprite.position.set(event.global.x, event.global.y);\n * });\n * // Using property-based handler\n * sprite.onpointerdown = (event) => {\n * sprite.position.set(event.global.x, event.global.y);\n * };\n * ```\n * @default null\n */\n onpointerdown?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `pointerenter` event.\n * Fired when a pointer device enters the bounds of the display object. Does not bubble.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('pointerenter', (event) => {\n * sprite.scale.set(1.2);\n * });\n * // Using property-based handler\n * sprite.onpointerenter = (event) => {\n * sprite.scale.set(1.2);\n * };\n * ```\n * @default null\n */\n onpointerenter?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `pointerleave` event.\n * Fired when a pointer device leaves the bounds of the display object. Does not bubble.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n * // Using emitter handler\n * sprite.on('pointerleave', (event) => {\n * sprite.scale.set(1.0);\n * });\n * // Using property-based handler\n * sprite.onpointerleave = (event) => {\n * sprite.scale.set(1.0);\n * };\n * ```\n * @default null\n */\n onpointerleave?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `pointermove` event.\n * Fired when a pointer device moves while over the display object.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('pointermove', (event) => {\n * sprite.position.set(event.global.x, event.global.y);\n * });\n * // Using property-based handler\n * sprite.onpointermove = (event) => {\n * sprite.position.set(event.global.x, event.global.y);\n * };\n * ```\n * @default null\n */\n onpointermove?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `globalpointermove` event.\n *\n * Fired when the pointer moves anywhere, regardless of whether the pointer is over this object.\n * The object must have `eventMode` set to 'static' or 'dynamic' to receive this event.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('globalpointermove', (event) => {\n * sprite.position.set(event.global.x, event.global.y);\n * });\n * // Using property-based handler\n * sprite.onglobalpointermove = (event) => {\n * sprite.position.set(event.global.x, event.global.y);\n * };\n * ```\n * @default null\n * @remarks\n * - Fires even when the mouse is outside the object's bounds\n * - Useful for drag operations or global mouse tracking\n * - Must have `eventMode` set appropriately to receive events\n * - Part of the global move events family along with `globalpointermove` and `globaltouchmove`\n */\n onglobalpointermove?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `pointerout` event.\n * Fired when the pointer moves out of the bounds of the display object.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('pointerout', (event) => {\n * sprite.scale.set(1.0);\n * });\n * // Using property-based handler\n * sprite.onpointerout = (event) => {\n * sprite.scale.set(1.0);\n * };\n * ```\n * @default null\n */\n onpointerout?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `pointerover` event.\n * Fired when the pointer moves over the bounds of the display object.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('pointerover', (event) => {\n * sprite.scale.set(1.2);\n * });\n * // Using property-based handler\n * sprite.onpointerover = (event) => {\n * sprite.scale.set(1.2);\n * };\n * ```\n * @default null\n */\n onpointerover?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `pointertap` event.\n * Fired when a pointer device completes a tap action (e.g., touch or mouse click).\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('pointertap', (event) => {\n * console.log('Sprite tapped at:', event.global.x, event.global.y);\n * });\n * // Using property-based handler\n * sprite.onpointertap = (event) => {\n * console.log('Sprite tapped at:', event.global.x, event.global.y);\n * };\n * ```\n * @default null\n */\n onpointertap?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `pointerup` event.\n * Fired when a pointer device button (mouse, touch, pen, etc.) is released.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('pointerup', (event) => {\n * sprite.scale.set(1.0);\n * });\n * // Using property-based handler\n * sprite.onpointerup = (event) => {\n * sprite.scale.set(1.0);\n * };\n * ```\n * @default null\n */\n onpointerup?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `pointerupoutside` event.\n * Fired when a pointer device button is released outside the bounds of the display object\n * that initially registered a pointerdown.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('pointerupoutside', (event) => {\n * sprite.scale.set(1.0);\n * });\n * // Using property-based handler\n * sprite.onpointerupoutside = (event) => {\n * sprite.scale.set(1.0);\n * };\n * ```\n * @default null\n */\n onpointerupoutside?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `rightclick` event.\n * Fired when a right-click (context menu) action is performed on the object.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('rightclick', (event) => {\n * console.log('Right-clicked at:', event.global.x, event.global.y);\n * });\n * // Using property-based handler\n * sprite.onrightclick = (event) => {\n * console.log('Right-clicked at:', event.global.x, event.global.y);\n * };\n * ```\n * @default null\n */\n onrightclick?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `rightdown` event.\n * Fired when a right mouse button is pressed down over the display object.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('rightdown', (event) => {\n * sprite.scale.set(0.9);\n * });\n * // Using property-based handler\n * sprite.onrightdown = (event) => {\n * sprite.scale.set(0.9);\n * };\n * ```\n * @default null\n */\n onrightdown?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `rightup` event.\n * Fired when a right mouse button is released over the display object.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('rightup', (event) => {\n * sprite.scale.set(1.0);\n * });\n * // Using property-based handler\n * sprite.onrightup = (event) => {\n * sprite.scale.set(1.0);\n * };\n * ```\n * @default null\n */\n onrightup?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `rightupoutside` event.\n * Fired when a right mouse button is released outside the bounds of the display object\n * that initially registered a rightdown.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('rightupoutside', (event) => {\n * sprite.scale.set(1.0);\n * });\n * // Using property-based handler\n * sprite.onrightupoutside = (event) => {\n * sprite.scale.set(1.0);\n * };\n * ```\n * @default null\n */\n onrightupoutside?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `tap` event.\n * Fired when a tap action (touch) is completed on the object.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('tap', (event) => {\n * console.log('Sprite tapped at:', event.global.x, event.global.y);\n * });\n * // Using property-based handler\n * sprite.ontap = (event) => {\n * console.log('Sprite tapped at:', event.global.x, event.global.y);\n * };\n * ```\n * @default null\n */\n ontap?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `touchcancel` event.\n * Fired when a touch interaction is canceled, such as when the touch is interrupted.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('touchcancel', (event) => {\n * console.log('Touch canceled at:', event.global.x, event.global.y);\n * });\n * // Using property-based handler\n * sprite.ontouchcancel = (event) => {\n * console.log('Touch canceled at:', event.global.x, event.global.y);\n * };\n * ```\n * @default null\n */\n ontouchcancel?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `touchend` event.\n * Fired when a touch interaction ends, such as when the finger is lifted from the screen.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('touchend', (event) => {\n * sprite.scale.set(1.0);\n * });\n * // Using property-based handler\n * sprite.ontouchend = (event) => {\n * sprite.scale.set(1.0);\n * };\n * ```\n * @default null\n */\n ontouchend?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `touchendoutside` event.\n * Fired when a touch interaction ends outside the bounds of the display object\n * that initially registered a touchstart.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('touchendoutside', (event) => {\n * sprite.scale.set(1.0);\n * });\n * // Using property-based handler\n * sprite.ontouchendoutside = (event) => {\n * sprite.scale.set(1.0);\n * };\n * ```\n * @default null\n */\n ontouchendoutside?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `touchmove` event.\n * Fired when a touch interaction moves while over the display object.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('touchmove', (event) => {\n * sprite.position.set(event.global.x, event.global.y);\n * });\n * // Using property-based handler\n * sprite.ontouchmove = (event) => {\n * sprite.position.set(event.global.x, event.global.y);\n * };\n * ```\n * @default null\n */\n ontouchmove?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `globaltouchmove` event.\n *\n * Fired when a touch interaction moves anywhere, regardless of whether the pointer is over this object.\n * The object must have `eventMode` set to 'static' or 'dynamic' to receive this event.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('globaltouchmove', (event) => {\n * sprite.position.set(event.global.x, event.global.y);\n * });\n * // Using property-based handler\n * sprite.onglobaltouchmove = (event) => {\n * sprite.position.set(event.global.x, event.global.y);\n * };\n * ```\n * @default null\n * @remarks\n * - Fires even when the touch is outside the object's bounds\n * - Useful for drag operations or global touch tracking\n * - Must have `eventMode` set appropriately to receive events\n * - Part of the global move events family along with `globalpointermove` and `globalmousemove`\n */\n onglobaltouchmove?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `touchstart` event.\n * Fired when a touch interaction starts, such as when a finger touches the screen.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('touchstart', (event) => {\n * sprite.scale.set(0.9);\n * });\n * // Using property-based handler\n * sprite.ontouchstart = (event) => {\n * sprite.scale.set(0.9);\n * };\n * ```\n * @default null\n */\n ontouchstart?: FederatedEventHandler | null;\n\n /**\n * Property-based event handler for the `wheel` event.\n * Fired when the mouse wheel is scrolled while over the display object.\n * @example\n * ```ts\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n *\n * // Using emitter handler\n * sprite.on('wheel', (event) => {\n * sprite.scale.x += event.deltaY * 0.01; // Zoom in/out\n * sprite.scale.y += event.deltaY * 0.01; // Zoom in/out\n * });\n * // Using property-based handler\n * sprite.onwheel = (event) => {\n * sprite.scale.x += event.deltaY * 0.01; // Zoom in/out\n * sprite.scale.y += event.deltaY * 0.01; // Zoom in/out\n * };\n * ```\n * @default null\n */\n onwheel?: FederatedEventHandler<FederatedWheelEvent> | null;\n}\n\n/**\n * The options for the `addEventListener` method.\n * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener}\n * @category events\n * @advanced\n */\nexport type AddListenerOptions = boolean | AddEventListenerOptions;\n/**\n * The options for the `removeEventListener` method.\n * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/removeEventListener}\n * @category events\n * @advanced\n */\nexport type RemoveListenerOptions = boolean | EventListenerOptions;\n\n/**\n * Additional properties for a Container that is used for interaction events.\n * @category events\n * @advanced\n */\nexport interface IFederatedContainer extends FederatedOptions\n{\n /** The parent of this event target. */\n readonly parent?: Container | null;\n\n /** The children of this event target. */\n readonly children?: ReadonlyArray<Container>;\n\n /** @private */\n _internalEventMode: EventMode;\n\n /**\n * Determines if the container is interactive or not\n * @returns {boolean} Whether the container is interactive or not\n * @since 7.2.0\n * @example\n * import { Sprite } from 'pixi.js';\n *\n * const sprite = new Sprite(texture);\n * sprite.eventMode = 'static';\n * sprite.isInteractive(); // true\n *\n * sprite.eventMode = 'dynamic';\n * sprite.isInteractive(); // true\n *\n * sprite.eventMode = 'none';\n * sprite.isInteractive(); // false\n *\n * sprite.eventMode = 'passive';\n * sprite.isInteractive(); // false\n *\n * sprite.eventMode = 'auto';\n * sprite.isInteractive(); // false\n */\n isInteractive: () => boolean;\n /**\n * Unlike `on` or `addListener` which are methods from EventEmitter, `addEventListener`\n * seeks to be compatible with the DOM's `addEventListener` with support for options.\n * @param {any} type - The type of event to listen to.\n * @param {any} listener - The listener callback or object.\n * @param {any} options - Listener options, used for capture phase.\n * @example\n * // Tell the user whether they did a single, double, triple, or nth click.\n * button.addEventListener('click', {\n * handleEvent(e): {\n * let prefix;\n *\n * switch (e.detail) {\n * case 1: prefix = 'single'; break;\n * case 2: prefix = 'double'; break;\n * case 3: prefix = 'triple'; break;\n * default: prefix = e.detail + 'th'; break;\n * }\n *\n * console.log('That was a ' + prefix + 'click');\n * }\n * });\n *\n * // But skip the first click!\n * button.parent.addEventListener('click', function blockClickOnce(e) {\n * e.stopImmediatePropagation();\n * button.parent.removeEventListener('click', blockClickOnce, true);\n * }, {\n * capture: true,\n * });\n */\n addEventListener<K extends keyof AllFederatedEventMap>(\n type: K,\n listener: (e: AllFederatedEventMap[K]) => any,\n options?: AddListenerOptions\n ): void;\n addEventListener(\n type: string,\n listener: EventListenerOrEventListenerObject,\n options?: AddListenerOptions\n ): void;\n /**\n * Unlike `off` or `removeListener` which are methods from EventEmitter, `removeEventListener`\n * seeks to be compatible with the DOM's `removeEventListener` with support for options.\n * @param {K} type - The type of event the listener is bound to.\n * @param {any} listener - The listener callback or object.\n * @param {RemoveListenerOptions} options - The original listener options.\n * This is required to deregister a capture phase listener.\n */\n removeEventListener<K extends keyof AllFederatedEventMap>(\n type: K,\n listener: (e: AllFederatedEventMap[K]) => any,\n options?: RemoveListenerOptions\n ): void;\n removeEventListener(\n type: string,\n listener: EventListenerOrEventListenerObject,\n options?: RemoveListenerOptions\n ): void;\n /**\n * Dispatch the event on this {@link Container} using the event's {@link EventBoundary}.\n *\n * The target of the event is set to `this` and the `defaultPrevented` flag is cleared before dispatch.\n * @param {FederatedEvent} e - The event to dispatch.\n * @returns Whether the {@link FederatedEvent.preventDefault preventDefault}() method was not invoked.\n * @example\n * // Reuse a click event!\n * button.dispatchEvent(clickEvent);\n */\n dispatchEvent(e: FederatedEvent): boolean;\n}\n\n/** @internal */\nexport const FederatedContainer: IFederatedContainer = {\n onclick: null,\n onmousedown: null,\n onmouseenter: null,\n onmouseleave: null,\n onmousemove: null,\n onglobalmousemove: null,\n onmouseout: null,\n onmouseover: null,\n onmouseup: null,\n onmouseupoutside: null,\n onpointercancel: null,\n onpointerdown: null,\n onpointerenter: null,\n onpointerleave: null,\n onpointermove: null,\n onglobalpointermove: null,\n onpointerout: null,\n onpointerover: null,\n onpointertap: null,\n onpointerup: null,\n onpointerupoutside: null,\n onrightclick: null,\n onrightdown: null,\n onrightup: null,\n onrightupoutside: null,\n ontap: null,\n ontouchcancel: null,\n ontouchend: null,\n ontouchendoutside: null,\n ontouchmove: null,\n onglobaltouchmove: null,\n ontouchstart: null,\n onwheel: null,\n get interactive()\n {\n return this.eventMode === 'dynamic' || this.eventMode === 'static';\n },\n set interactive(value: boolean)\n {\n this.eventMode = value ? 'static' : 'passive';\n },\n _internalEventMode: undefined,\n get eventMode()\n {\n return this._internalEventMode ?? EventSystem.defaultEventMode;\n },\n set eventMode(value)\n {\n this._internalEventMode = value;\n },\n isInteractive(): boolean\n {\n return this.eventMode === 'static' || this.eventMode === 'dynamic';\n },\n interactiveChildren: true,\n hitArea: null,\n addEventListener(\n type: string,\n listener: EventListenerOrEventListenerObject,\n options?: AddListenerOptions\n )\n {\n const capture = (typeof options === 'boolean' && options)\n || (typeof options === 'object' && options.capture);\n const signal = typeof options === 'object' ? options.signal : undefined;\n const once = typeof options === 'object' ? (options.once === true) : false;\n const context = typeof listener === 'function' ? undefined : listener;\n\n type = capture ? `${type}capture` : type;\n const listenerFn = typeof listener === 'function' ? listener : listener.handleEvent;\n\n const emitter = (this as unknown as EventEmitter);\n\n if (signal)\n {\n signal.addEventListener('abort', () =>\n {\n emitter.off(type, listenerFn, context);\n });\n }\n\n if (once)\n {\n emitter.once(type, listenerFn, context);\n }\n else\n {\n emitter.on(type, listenerFn, context);\n }\n },\n removeEventListener(\n type: string,\n listener: EventListenerOrEventListenerObject,\n options?: RemoveListenerOptions\n )\n {\n const capture = (typeof options === 'boolean' && options)\n || (typeof options === 'object' && options.capture);\n const context = typeof listener === 'function' ? undefined : listener;\n\n type = capture ? `${type}capture` : type;\n listener = typeof listener === 'function' ? listener : listener.handleEvent;\n\n (this as unknown as EventEmitter).off(type, listener, context);\n },\n dispatchEvent(e: Event): boolean\n {\n if (!(e instanceof FederatedEvent))\n {\n throw new Error('Container cannot propagate events outside of the Federated Events API');\n }\n\n e.defaultPrevented = false;\n e.path = null;\n e.target = this as Container;\n e.manager.dispatchEvent(e);\n\n return !e.defaultPrevented;\n }\n};\n"],"names":[],"mappings":"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"}