@hypen-space/web 0.5.2 → 0.5.3

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.
Files changed (104) hide show
  1. package/dist/canvas/accessibility.d.ts +118 -11
  2. package/dist/canvas/accessibility.js +470 -108
  3. package/dist/canvas/accessibility.js.map +1 -1
  4. package/dist/canvas/dispatch.d.ts +24 -0
  5. package/dist/canvas/dispatch.js +62 -0
  6. package/dist/canvas/dispatch.js.map +1 -0
  7. package/dist/canvas/editing.d.ts +178 -0
  8. package/dist/canvas/editing.js +590 -0
  9. package/dist/canvas/editing.js.map +1 -0
  10. package/dist/canvas/events.d.ts +28 -23
  11. package/dist/canvas/events.js +76 -128
  12. package/dist/canvas/events.js.map +1 -1
  13. package/dist/canvas/focus.d.ts +78 -0
  14. package/dist/canvas/focus.js +182 -0
  15. package/dist/canvas/focus.js.map +1 -0
  16. package/dist/canvas/index.d.ts +3 -1
  17. package/dist/canvas/index.js +3 -1
  18. package/dist/canvas/index.js.map +1 -1
  19. package/dist/canvas/paint.d.ts +16 -3
  20. package/dist/canvas/paint.js +283 -41
  21. package/dist/canvas/paint.js.map +1 -1
  22. package/dist/canvas/renderer.d.ts +20 -1
  23. package/dist/canvas/renderer.js +181 -50
  24. package/dist/canvas/renderer.js.map +1 -1
  25. package/dist/canvas/selection.js +31 -177
  26. package/dist/canvas/selection.js.map +1 -1
  27. package/dist/canvas/text-geometry.d.ts +72 -0
  28. package/dist/canvas/text-geometry.js +244 -0
  29. package/dist/canvas/text-geometry.js.map +1 -0
  30. package/dist/canvas/text.js +42 -9
  31. package/dist/canvas/text.js.map +1 -1
  32. package/dist/canvas/types.d.ts +7 -1
  33. package/dist/canvas/variants.d.ts +4 -1
  34. package/dist/canvas/variants.js +22 -3
  35. package/dist/canvas/variants.js.map +1 -1
  36. package/dist/dom/a11y-styles.d.ts +20 -0
  37. package/dist/dom/a11y-styles.js +61 -0
  38. package/dist/dom/a11y-styles.js.map +1 -0
  39. package/dist/dom/applicators/aria.d.ts +19 -0
  40. package/dist/dom/applicators/aria.js +36 -0
  41. package/dist/dom/applicators/aria.js.map +1 -0
  42. package/dist/dom/applicators/events.d.ts +7 -0
  43. package/dist/dom/applicators/events.js +35 -8
  44. package/dist/dom/applicators/events.js.map +1 -1
  45. package/dist/dom/applicators/index.js +4 -0
  46. package/dist/dom/applicators/index.js.map +1 -1
  47. package/dist/dom/components/hypenapp.d.ts +25 -1
  48. package/dist/dom/components/hypenapp.js +213 -245
  49. package/dist/dom/components/hypenapp.js.map +1 -1
  50. package/dist/dom/components/index.js +7 -0
  51. package/dist/dom/components/index.js.map +1 -1
  52. package/dist/dom/components/spinner.js +24 -10
  53. package/dist/dom/components/spinner.js.map +1 -1
  54. package/dist/dom/components/tabs.d.ts +27 -0
  55. package/dist/dom/components/tabs.js +69 -0
  56. package/dist/dom/components/tabs.js.map +1 -0
  57. package/dist/dom/components/visuallyhidden.d.ts +9 -0
  58. package/dist/dom/components/visuallyhidden.js +26 -0
  59. package/dist/dom/components/visuallyhidden.js.map +1 -0
  60. package/dist/dom/operability.d.ts +100 -0
  61. package/dist/dom/operability.js +298 -0
  62. package/dist/dom/operability.js.map +1 -0
  63. package/dist/dom/renderer.d.ts +98 -5
  64. package/dist/dom/renderer.js +398 -63
  65. package/dist/dom/renderer.js.map +1 -1
  66. package/dist/dom/route-focus.d.ts +42 -0
  67. package/dist/dom/route-focus.js +88 -0
  68. package/dist/dom/route-focus.js.map +1 -0
  69. package/dist/dom/semantics.d.ts +35 -0
  70. package/dist/dom/semantics.js +184 -0
  71. package/dist/dom/semantics.js.map +1 -0
  72. package/package.json +2 -2
  73. package/src/canvas/QUICKSTART.md +4 -4
  74. package/src/canvas/README.md +55 -29
  75. package/src/canvas/accessibility.ts +507 -115
  76. package/src/canvas/dispatch.ts +78 -0
  77. package/src/canvas/editing.ts +697 -0
  78. package/src/canvas/events.ts +89 -142
  79. package/src/canvas/focus.ts +216 -0
  80. package/src/canvas/index.ts +8 -1
  81. package/src/canvas/paint.ts +339 -42
  82. package/src/canvas/renderer.ts +218 -70
  83. package/src/canvas/selection.ts +52 -210
  84. package/src/canvas/text-geometry.ts +311 -0
  85. package/src/canvas/text.ts +43 -9
  86. package/src/canvas/types.ts +14 -1
  87. package/src/canvas/variants.ts +24 -5
  88. package/src/dom/a11y-styles.ts +65 -0
  89. package/src/dom/applicators/aria.ts +41 -0
  90. package/src/dom/applicators/events.ts +38 -7
  91. package/src/dom/applicators/index.ts +5 -0
  92. package/src/dom/components/hypenapp.ts +244 -272
  93. package/src/dom/components/index.ts +7 -0
  94. package/src/dom/components/spinner.ts +31 -13
  95. package/src/dom/components/tabs.ts +76 -0
  96. package/src/dom/components/visuallyhidden.ts +30 -0
  97. package/src/dom/operability.ts +312 -0
  98. package/src/dom/renderer.ts +455 -63
  99. package/src/dom/route-focus.ts +98 -0
  100. package/src/dom/semantics.ts +199 -0
  101. package/dist/canvas/input.d.ts +0 -76
  102. package/dist/canvas/input.js +0 -207
  103. package/dist/canvas/input.js.map +0 -1
  104. package/src/canvas/input.ts +0 -251
@@ -0,0 +1,78 @@
1
+ /**
2
+ * Action Dispatch
3
+ *
4
+ * Resolves a DOM-ish event on a virtual node to the engine action its
5
+ * props declare, and dispatches it. Shared by the canvas hit-test path
6
+ * (pointer events) and the accessibility-mirror path (keyboard / AT
7
+ * activation) so both produce identical action payloads.
8
+ */
9
+
10
+ import type { VirtualNode } from "./types.js";
11
+ import { resolveEventAction } from "./props.js";
12
+
13
+ /** Minimal engine surface needed for dispatch. */
14
+ export interface DispatchEngine {
15
+ dispatchAction(name: string, payload?: any): void;
16
+ }
17
+
18
+ // Maps a DOM event type to the applicator prop names the engine may have set
19
+ // on a node, in priority order. Multi-word events (`mouseenter`) need their
20
+ // proper camelCase form (`onMouseEnter`) since the engine emits applicator
21
+ // names verbatim. `mouseenter` also accepts `onHover` as an alias.
22
+ const CANVAS_EVENT_PROP_NAMES: Record<string, string[]> = {
23
+ mouseenter: ["onMouseEnter", "onHover", "onmouseenter", "mouseenter"],
24
+ mouseleave: ["onMouseLeave", "onmouseleave", "mouseleave"],
25
+ mousedown: ["onMouseDown", "onmousedown", "mousedown"],
26
+ mouseup: ["onMouseUp", "onmouseup", "mouseup"],
27
+ dblclick: ["onDblClick", "onDoubleClick", "ondblclick", "dblclick"],
28
+ contextmenu: ["onContextMenu", "oncontextmenu", "contextmenu"],
29
+ keydown: ["onKeyDown", "onkeydown", "keydown"],
30
+ keyup: ["onKeyUp", "onkeyup", "keyup"],
31
+ };
32
+
33
+ /**
34
+ * Dispatch an event on a node to the engine action its props declare.
35
+ *
36
+ * Engine emits event applicators in camelCase (`onClick`, `onMouseEnter`).
37
+ * Multi-word DOM events like `mouseenter` must map to `onMouseEnter`, not
38
+ * the naive `onMouseenter` that `on${capitalize(eventType)}` would produce.
39
+ * The older flat form `onclick`/`onmouseenter` is still accepted. After
40
+ * prop normalisation the value is either a string (action name) or an
41
+ * object carrying an action name at `"0"` plus an auxiliary payload.
42
+ */
43
+ export function dispatchNodeEvent(
44
+ engine: DispatchEngine,
45
+ node: VirtualNode,
46
+ eventType: string,
47
+ data: any,
48
+ ): void {
49
+ const propNames = CANVAS_EVENT_PROP_NAMES[eventType] ?? [
50
+ `on${eventType.charAt(0).toUpperCase()}${eventType.slice(1)}`,
51
+ `on${eventType}`,
52
+ eventType,
53
+ ];
54
+
55
+ let spec: unknown;
56
+ for (const name of propNames) {
57
+ if (node.props[name] != null) {
58
+ spec = node.props[name];
59
+ break;
60
+ }
61
+ }
62
+
63
+ // Actionable components fall back to the bare `action` prop on click.
64
+ if (spec == null && eventType === "click") {
65
+ spec = node.props.action;
66
+ }
67
+
68
+ const resolved = resolveEventAction(spec);
69
+ if (!resolved) return;
70
+
71
+ engine.dispatchAction(resolved.actionName, {
72
+ type: eventType,
73
+ nodeId: node.id,
74
+ timestamp: Date.now(),
75
+ ...resolved.payload,
76
+ ...data,
77
+ });
78
+ }