@combos-fun/plugin-renderer-event 0.0.45 → 0.0.47
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/agent-skill.md +15 -70
- package/package.json +3 -3
package/agent-skill.md
CHANGED
|
@@ -1,12 +1,6 @@
|
|
|
1
1
|
# `@combos-fun/plugin-renderer-event` — Agent notes
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
## When to read
|
|
6
|
-
|
|
7
|
-
Read for any input task: tap detection, drag, swipe, hit-area shapes, or when integrating with `plugin-a11y` (which forwards DOM clicks as Event events).
|
|
8
|
-
|
|
9
|
-
## Public API
|
|
3
|
+
Read only for 2D pointer/touch input, hit areas, dragging, or a11y-forwarded activation.
|
|
10
4
|
|
|
11
5
|
```ts
|
|
12
6
|
import {
|
|
@@ -18,80 +12,31 @@ import {
|
|
|
18
12
|
} from '@combos-fun/plugin-renderer-event';
|
|
19
13
|
```
|
|
20
14
|
|
|
21
|
-
`componentName = 'Event'
|
|
15
|
+
`Event.componentName = 'Event'`; `EventSystem.systemName = 'Event'`.
|
|
22
16
|
|
|
23
|
-
|
|
17
|
+
`HIT_AREA_TYPE` is `Circle | Ellipse | Polygon | Rect | RoundedRect`. `EventParams.hitArea` is required; pass a concrete local-space `style` even though its type is optional because the system reads shape fields directly. Circle uses `x/y/radius`; Ellipse and Rect use `x/y/width/height`; RoundedRect also uses `radius`; Polygon uses flat `paths`.
|
|
24
18
|
|
|
25
|
-
`
|
|
19
|
+
`EventSystemParams.moveWhenInside` defaults to `false`. It sets Pixi `globalMove = !moveWhenInside`, so `true` limits move events to the pointer being inside.
|
|
26
20
|
|
|
27
|
-
|
|
21
|
+
Emitted events are `touchstart`, `touchmove`, `touchend`, `tap`, `touchendoutside`, and `touchcancel`. Every callback receives:
|
|
28
22
|
|
|
29
23
|
```ts
|
|
30
24
|
{
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
25
|
+
stopPropagation: () => void,
|
|
26
|
+
data: {
|
|
27
|
+
pointerId: number,
|
|
28
|
+
position: { x: number, y: number }, // global/canvas space
|
|
29
|
+
localPosition: { x: number, y: number } // GameObject container space
|
|
30
|
+
},
|
|
31
|
+
gameObject
|
|
35
32
|
}
|
|
36
33
|
```
|
|
37
34
|
|
|
38
|
-
### `EventSystemParams`
|
|
39
|
-
|
|
40
|
-
| Field | Type | Notes |
|
|
41
|
-
|-------|------|-------|
|
|
42
|
-
| `moveWhenInside` | `boolean?` | Drives Pixi `events.features.globalMove` |
|
|
43
|
-
|
|
44
|
-
### Events emitted by the `Event` component
|
|
45
|
-
|
|
46
|
-
`touchstart`, `touchmove`, `touchend`, `tap`, `touchendoutside`, `touchcancel`.
|
|
47
|
-
|
|
48
|
-
Callback payload:
|
|
49
|
-
|
|
50
35
|
```ts
|
|
51
|
-
(payload) => {
|
|
52
|
-
payload.stopPropagation();
|
|
53
|
-
payload.data.pointerId;
|
|
54
|
-
payload.data.position; // global / canvas-space
|
|
55
|
-
payload.data.localPosition; // local to the GameObject
|
|
56
|
-
payload.gameObject;
|
|
57
|
-
};
|
|
58
|
-
```
|
|
59
|
-
|
|
60
|
-
## Required setup
|
|
61
|
-
|
|
62
|
-
- Add `RendererSystem` (from `plugin-renderer`) before `EventSystem`.
|
|
63
|
-
- Provide `hitArea.style` in the same coordinate space as the visual:
|
|
64
|
-
`style` is interpreted in **local space** of the GameObject.
|
|
65
|
-
|
|
66
|
-
## Runtime behaviour
|
|
67
|
-
|
|
68
|
-
- Each `Event` component installs a Pixi hit-area on its container; the
|
|
69
|
-
system routes Pixi pointer events into Combos events.
|
|
70
|
-
- `plugin-a11y` forwards DOM clicks on the a11y overlay as
|
|
71
|
-
`touchstart` / `touchend` / `tap` on the matching `Event` component.
|
|
72
|
-
|
|
73
|
-
## Common pitfalls
|
|
74
|
-
|
|
75
|
-
| Symptom | Fix |
|
|
76
|
-
|---------|-----|
|
|
77
|
-
| `tap` never fires | Add `EventSystem`, attach an `Event` component with a `hitArea` |
|
|
78
|
-
| Hit area off-target | `style` coords are in local space — origin is the GameObject's `Transform.origin` |
|
|
79
|
-
| Double-fire from a11y + canvas | Only attach handler once; A11y forwards through Event so a single subscription is enough |
|
|
80
|
-
|
|
81
|
-
## Minimal example
|
|
82
|
-
|
|
83
|
-
```ts
|
|
84
|
-
import { Event, HIT_AREA_TYPE } from '@combos-fun/plugin-renderer-event';
|
|
85
|
-
|
|
86
36
|
go.addComponent(new Event({
|
|
87
|
-
hitArea: { type: HIT_AREA_TYPE.Rect, style: { width: 200, height: 80 } },
|
|
37
|
+
hitArea: { type: HIT_AREA_TYPE.Rect, style: { x: 0, y: 0, width: 200, height: 80 } },
|
|
88
38
|
}));
|
|
89
|
-
|
|
90
|
-
go.getComponent(Event)!.on('tap', (e) => {
|
|
91
|
-
/* handle */
|
|
92
|
-
});
|
|
39
|
+
go.getComponent(Event)!.on('tap', ({ stopPropagation }) => stopPropagation());
|
|
93
40
|
```
|
|
94
41
|
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
`pnpm --filter @combos-fun/plugin-renderer-event run build`.
|
|
42
|
+
`plugin-a11y` forwards its DOM activation through this same Event Component, so subscribe once rather than adding a second a11y-specific action handler.
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@combos-fun/plugin-renderer-event",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.47",
|
|
4
4
|
"description": "Pointer / touch event input via Pixi v8 interaction",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"module": "dist/plugin-renderer-event.esm.js",
|
|
@@ -37,8 +37,8 @@
|
|
|
37
37
|
"author": "sun668 <q947692259@gmail.com>",
|
|
38
38
|
"dependencies": {
|
|
39
39
|
"pixi.js": "^8.18.1",
|
|
40
|
-
"@combos-fun/
|
|
41
|
-
"@combos-fun/
|
|
40
|
+
"@combos-fun/engine": "0.0.47",
|
|
41
|
+
"@combos-fun/plugin-renderer": "0.0.47"
|
|
42
42
|
},
|
|
43
43
|
"scripts": {
|
|
44
44
|
"build": "node ../../scripts/build-package.mjs"
|