@hypen-space/web 0.5.2 → 0.5.3

package/dist/canvas/focus.js

@@ -0,0 +1,182 @@
+/**
+ * Focus Manager
+ *
+ * Real DOM focus on accessibility-mirror elements (canvas fallback content)
+ * is the single source of truth for canvas focus. Tab/Shift+Tab traverse
+ * the mirror natively; `focusin`/`focusout` translate DOM focus into
+ * `node.focused` + repaint; the pointer path (canvas hit-test) funnels into
+ * the same place by focusing the node's mirror element.
+ *
+ * Loop-free by construction: DOM focus events only ever *read* into node
+ * state — nothing in the sync path calls `.focus()` back.
+ *
+ * The mirror also carries keyboard/AT interaction back to the engine:
+ * Enter/Space on a mirror `<button>` produces a native `click` (dispatched
+ * to the node's action), and keydown/keyup on the focused element dispatch
+ * the node's `onKeyDown`/`onKeyUp` applicators — which the old
+ * canvas-attached listeners never could (a canvas without tabindex never
+ * receives key events).
+ */
+import { dispatchNodeEvent } from "./dispatch.js";
+export class FocusManager {
+    mirror;
+    engine;
+    hooks;
+    focusedNode = null;
+    boundFocusIn = (e) => this.onFocusIn(e);
+    boundFocusOut = (e) => this.onFocusOut(e);
+    boundClick = (e) => this.onMirrorClick(e);
+    boundKeyDown = (e) => this.onMirrorKey("keydown", e);
+    boundKeyUp = (e) => this.onMirrorKey("keyup", e);
+    constructor(mirror, engine, hooks) {
+        this.mirror = mirror;
+        this.engine = engine;
+        this.hooks = hooks;
+        const root = mirror.getRoot();
+        if (root && typeof root.addEventListener === "function") {
+            root.addEventListener("focusin", this.boundFocusIn);
+            root.addEventListener("focusout", this.boundFocusOut);
+            root.addEventListener("click", this.boundClick);
+            root.addEventListener("keydown", this.boundKeyDown);
+            root.addEventListener("keyup", this.boundKeyUp);
+        }
+    }
+    // -------------------------------------------------------------------------
+    // DOM → node state (the only direction focus state flows)
+    // -------------------------------------------------------------------------
+    /** Climb from an event target to the mirror element's virtual node. */
+    resolveNode(target) {
+        let el = target;
+        const root = this.mirror.getRoot();
+        while (el && el !== root) {
+            const id = el.getAttribute?.("data-hypen-id");
+            if (id) {
+                return this.hooks.getNode(id) ?? null;
+            }
+            el = el.parentNode ?? null;
+        }
+        return null;
+    }
+    onFocusIn(e) {
+        this.syncFocus(this.resolveNode(e.target));
+    }
+    onFocusOut(e) {
+        // If focus moves to another mirror element, its focusin handles the
+        // transition; a handoff to the editor's IME proxy keeps the node
+        // focused; only a departure from both clears focus.
+        const next = e.relatedTarget;
+        if (next && this.hooks.isAuxFocusTarget?.(next))
+            return;
+        const root = this.mirror.getRoot();
+        if (!next || !root || !(root.contains?.(next) ?? false)) {
+            this.syncFocus(null);
+        }
+    }
+    /** Update node.focused flags from the new DOM focus target. Idempotent. */
+    syncFocus(node) {
+        if (node === this.focusedNode)
+            return;
+        const prev = this.focusedNode;
+        if (prev) {
+            prev.focused = false;
+            dispatchNodeEvent(this.engine, prev, "blur", {});
+        }
+        this.focusedNode = node;
+        if (node) {
+            node.focused = true;
+            dispatchNodeEvent(this.engine, node, "focus", {});
+        }
+        this.hooks.onFocusChange(node, prev);
+    }
+    // -------------------------------------------------------------------------
+    // Pointer path — canvas hit-test funnels into DOM focus
+    // -------------------------------------------------------------------------
+    /**
+     * Focus a node from the canvas pointer path. Focuses the mirror element
+     * (so `document.activeElement` agrees) and syncs node state directly —
+     * in real browsers the element's focusin already did that synchronously
+     * and the second sync is a no-op; in environments without focus events
+     * the direct sync keeps behavior identical.
+     */
+    requestFocus(node) {
+        if (!node) {
+            this.clearFocus();
+            return;
+        }
+        const el = this.mirror.getElement(node.id);
+        el?.focus?.({ preventScroll: true });
+        this.syncFocus(node);
+    }
+    /** Pointer landed on nothing focusable: blur any mirror focus and clear. */
+    clearFocus() {
+        if (typeof document !== "undefined") {
+            const active = document.activeElement;
+            const root = this.mirror.getRoot();
+            if (active &&
+                ((root && (root.contains?.(active) ?? false)) ||
+                    this.hooks.isAuxFocusTarget?.(active))) {
+                active.blur?.();
+            }
+        }
+        this.syncFocus(null);
+    }
+    /**
+     * Clear focus if the focused node is `node` or one of its descendants —
+     * called before a subtree is removed/detached (the mirror element may
+     * leave the DOM without a browser blur when focus sits on the IME proxy).
+     */
+    clearIfWithin(node) {
+        let current = this.focusedNode;
+        while (current) {
+            if (current === node) {
+                this.syncFocus(null);
+                return;
+            }
+            current = current.parent;
+        }
+    }
+    getFocusedNode() {
+        return this.focusedNode;
+    }
+    // -------------------------------------------------------------------------
+    // Mirror interaction → engine actions
+    // -------------------------------------------------------------------------
+    /**
+     * Native click on a mirror element — keyboard activation (Enter/Space on
+     * a real `<button>`) or an AT-initiated action. Pointer clicks never land
+     * here (fallback content has no rendered boxes), so this can't double-fire
+     * with the canvas hit-test click path.
+     */
+    onMirrorClick(e) {
+        const node = this.resolveNode(e.target);
+        if (!node)
+            return;
+        if (!node.clickable)
+            return;
+        dispatchNodeEvent(this.engine, node, "click", {});
+    }
+    onMirrorKey(type, e) {
+        const node = this.resolveNode(e.target);
+        if (!node)
+            return;
+        dispatchNodeEvent(this.engine, node, type, {
+            key: e.key,
+            code: e.code,
+            ctrlKey: e.ctrlKey,
+            shiftKey: e.shiftKey,
+            altKey: e.altKey,
+        });
+    }
+    destroy() {
+        const root = this.mirror.getRoot();
+        if (root && typeof root.removeEventListener === "function") {
+            root.removeEventListener("focusin", this.boundFocusIn);
+            root.removeEventListener("focusout", this.boundFocusOut);
+            root.removeEventListener("click", this.boundClick);
+            root.removeEventListener("keydown", this.boundKeyDown);
+            root.removeEventListener("keyup", this.boundKeyUp);
+        }
+        this.focusedNode = null;
+    }
+}
+//# sourceMappingURL=focus.js.map

package/dist/canvas/focus.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"focus.js","sourceRoot":"","sources":["../../src/canvas/focus.ts"],"names":[],"mappings":"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"}

package/dist/canvas/index.d.ts

@@ -6,10 +6,12 @@
 export { CanvasRenderer } from "./renderer.js";
 export { registerPainter } from "./paint.js";
 export { CanvasEventManager } from "./events.js";
-export { InputOverlay } from "./input.js";
 export { AccessibilityLayer } from "./accessibility.js";
+export { FocusManager } from "./focus.js";
+export { TextEditController } from "./editing.js";
 export { initTaffyLayout } from "./layout.js";
 export { ScrollManager } from "./scroll.js";
 export { DirtyRectTracker } from "./dirty.js";
 export { SelectionManager } from "./selection.js";
+export { pointToOffset, offsetToCaretRect, rangeToRects, type TextGeometry, } from "./text-geometry.js";
 export type { VirtualNode, Layout, Rectangle, Point, FontStyle, TextStyle, TextMetrics, ScrollState, CanvasRendererOptions, PainterFunction, LayoutFunction, } from "./types.js";

package/dist/canvas/index.js

@@ -6,10 +6,12 @@
 export { CanvasRenderer } from "./renderer.js";
 export { registerPainter } from "./paint.js";
 export { CanvasEventManager } from "./events.js";
-export { InputOverlay } from "./input.js";
 export { AccessibilityLayer } from "./accessibility.js";
+export { FocusManager } from "./focus.js";
+export { TextEditController } from "./editing.js";
 export { initTaffyLayout } from "./layout.js";
 export { ScrollManager } from "./scroll.js";
 export { DirtyRectTracker } from "./dirty.js";
 export { SelectionManager } from "./selection.js";
+export { pointToOffset, offsetToCaretRect, rangeToRects, } from "./text-geometry.js";
 //# sourceMappingURL=index.js.map

package/dist/canvas/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/canvas/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAC7C,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AACjD,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAC1C,OAAO,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AACxD,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAC9C,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAC5C,OAAO,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAC9C,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/canvas/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAC7C,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AACjD,OAAO,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AACxD,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAC1C,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAClD,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAC9C,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAC5C,OAAO,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAC9C,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EACL,aAAa,EACb,iBAAiB,EACjB,YAAY,GAEb,MAAM,oBAAoB,CAAC"}

package/dist/canvas/paint.d.ts

@@ -3,17 +3,30 @@
  *
  * Drawing virtual nodes to canvas
  */
-import type { VirtualNode, PainterFunction } from "./types.js";
+import type { VirtualNode, PainterFunction, Rectangle } from "./types.js";
 import type { SelectionManager } from "./selection.js";
+import type { TextEditController } from "./editing.js";
 export declare function setSelectionManager(mgr: SelectionManager | null): void;
+export declare function setTextEditor(editor: TextEditController | null): void;
 /**
  * Register a custom painter for a component type
  */
 export declare function registerPainter(type: string, painter: PainterFunction): void;
 /**
- * Paint a virtual node and its children
+ * Clear cached per-character advances. Must be called when web fonts finish
+ * loading: the cache is keyed by CSS font string, which is identical before
+ * and after a webfont replaces its fallback, so advances measured against
+ * the fallback font would otherwise poison letter-spaced rendering
+ * permanently.
  */
-export declare function paintNode(ctx: CanvasRenderingContext2D, node: VirtualNode): void;
+export declare function clearCharAdvanceCache(): void;
+/**
+ * Paint a virtual node and its children.
+ *
+ * `cull` (optional) is the dirty region being repainted — subtrees that
+ * provably cannot reach it are skipped entirely.
+ */
+export declare function paintNode(ctx: CanvasRenderingContext2D, node: VirtualNode, cull?: Rectangle | null): void;
 /** Returns width/height of the cached image, or null if unknown. */
 export declare function getImageNaturalAspect(src: string): number | null;
 /** Test helper: seed the intrinsic-size cache without loading a real image. */