cursedbelt 5.45.0 → 5.45.1

package/dist/react/canvas-hud/CanvasMinimap.d.ts

@@ -0,0 +1,32 @@
+import type { ReactNode } from 'react';
+import { type CanvasBounds, type CanvasSize, type CanvasView } from './viewport.js';
+export interface CanvasMinimapProps {
+    /** The content's extent in WORLD units — what the thumbnail shows. */
+    bounds: CanvasBounds;
+    view: CanvasView;
+    /** The canvas viewport in screen pixels, for the visible window. */
+    viewport: CanvasSize;
+    /** A click on the thumbnail, in WORLD units — the canvas centres there. */
+    onJump?: (point: {
+        x: number;
+        y: number;
+    }) => void;
+    /** The thumbnail's longest side in pixels. Default 168. */
+    size?: number;
+    /** Drawn inside the SVG in WORLD units, under the window: dots, zones, edges. */
+    children?: ReactNode;
+    /** A one-line caption under the map. Default "Tap to jump" when `onJump` is set. */
+    hint?: ReactNode;
+    className?: string;
+}
+/**
+ * CNV-3's minimap — the whole content as a low-opacity thumbnail with the visible window drawn
+ * on it. What a canvas draws on it (a dot per node, a heat zone per cluster) is `children` in its
+ * own world coordinates; the frame, the scaling and the window are this component's.
+ *
+ * The SVG is `aria-hidden`: the jump is a pointer shortcut over content that is already
+ * reachable by keyboard on the canvas itself, and a parallel interface over unlabeled dots would
+ * be a second, worse way to do what Tab already does (family's reasoning, kept).
+ */
+export declare function CanvasMinimap({ bounds, view, viewport, onJump, size, children, hint, className, }: CanvasMinimapProps): import("react").JSX.Element | null;
+//# sourceMappingURL=CanvasMinimap.d.ts.map

package/dist/react/canvas-hud/CanvasMinimap.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CanvasMinimap.d.ts","sourceRoot":"","sources":["../../../src/react/canvas-hud/CanvasMinimap.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAc,SAAS,EAAE,MAAM,OAAO,CAAC;AAEnD,OAAO,EAAE,KAAK,YAAY,EAAE,KAAK,UAAU,EAAE,KAAK,UAAU,EAAiB,MAAM,eAAe,CAAC;AAEnG,MAAM,WAAW,kBAAkB;IACjC,sEAAsE;IACtE,MAAM,EAAE,YAAY,CAAC;IACrB,IAAI,EAAE,UAAU,CAAC;IACjB,oEAAoE;IACpE,QAAQ,EAAE,UAAU,CAAC;IACrB,2EAA2E;IAC3E,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACnD,2DAA2D;IAC3D,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,iFAAiF;IACjF,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,oFAAoF;IACpF,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;GAQG;AACH,wBAAgB,aAAa,CAAC,EAC5B,MAAM,EACN,IAAI,EACJ,QAAQ,EACR,MAAM,EACN,IAAU,EACV,QAAQ,EACR,IAAI,EACJ,SAAS,GACV,EAAE,kBAAkB,sCAgDpB"}

package/dist/react/canvas-hud/CanvasMinimap.js

@@ -0,0 +1,32 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from '../lib/cn.js';
+import { visibleBounds } from './viewport.js';
+/**
+ * CNV-3's minimap — the whole content as a low-opacity thumbnail with the visible window drawn
+ * on it. What a canvas draws on it (a dot per node, a heat zone per cluster) is `children` in its
+ * own world coordinates; the frame, the scaling and the window are this component's.
+ *
+ * The SVG is `aria-hidden`: the jump is a pointer shortcut over content that is already
+ * reachable by keyboard on the canvas itself, and a parallel interface over unlabeled dots would
+ * be a second, worse way to do what Tab already does (family's reasoning, kept).
+ */
+export function CanvasMinimap({ bounds, view, viewport, onJump, size = 168, children, hint, className, }) {
+    if (bounds.width <= 0 || bounds.height <= 0 || viewport.width <= 0 || view.scale <= 0)
+        return null;
+    const ratio = Math.min(size / bounds.width, (size * 0.62) / bounds.height);
+    const width = Math.max(1, bounds.width * ratio);
+    const height = Math.max(1, bounds.height * ratio);
+    const seen = visibleBounds(view, viewport);
+    const jump = (event) => {
+        if (!onJump)
+            return;
+        const rect = event.currentTarget.getBoundingClientRect();
+        onJump({
+            x: bounds.x + (event.clientX - rect.left) / ratio,
+            y: bounds.y + (event.clientY - rect.top) / ratio,
+        });
+    };
+    const caption = hint === undefined ? (onJump ? 'Tap to jump' : null) : hint;
+    return (_jsxs("div", { "data-testid": 'canvas-minimap', className: cn('pointer-events-auto flex flex-col items-center gap-1 rounded-lg border border-border/60 bg-background/70 p-2 shadow-raised backdrop-blur-md', className), children: [_jsxs("svg", { width: width, height: height, viewBox: `${bounds.x} ${bounds.y} ${bounds.width} ${bounds.height}`, onClick: jump, "aria-hidden": 'true', className: cn('overflow-hidden', onJump && 'cursor-pointer'), children: [children, _jsx("rect", { "data-testid": 'canvas-minimap-window', x: seen.x, y: seen.y, width: seen.width, height: seen.height, fill: 'var(--accent)', fillOpacity: 0.12, stroke: 'var(--accent)', strokeWidth: 1.5 / ratio, rx: 3 / ratio })] }), caption ? _jsx("span", { className: 'text-caption text-muted-foreground', children: caption }) : null] }));
+}
+//# sourceMappingURL=CanvasMinimap.js.map

package/dist/react/canvas-hud/CanvasMinimap.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CanvasMinimap.js","sourceRoot":"","sources":["../../../src/react/canvas-hud/CanvasMinimap.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAuD,aAAa,EAAE,MAAM,eAAe,CAAC;AAmBnG;;;;;;;;GAQG;AACH,MAAM,UAAU,aAAa,CAAC,EAC5B,MAAM,EACN,IAAI,EACJ,QAAQ,EACR,MAAM,EACN,IAAI,GAAG,GAAG,EACV,QAAQ,EACR,IAAI,EACJ,SAAS,GACU;IACnB,IAAI,MAAM,CAAC,KAAK,IAAI,CAAC,IAAI,MAAM,CAAC,MAAM,IAAI,CAAC,IAAI,QAAQ,CAAC,KAAK,IAAI,CAAC,IAAI,IAAI,CAAC,KAAK,IAAI,CAAC;QAAE,OAAO,IAAI,CAAC;IACnG,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,GAAG,MAAM,CAAC,KAAK,EAAE,CAAC,IAAI,GAAG,IAAI,CAAC,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC;IAC3E,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,MAAM,CAAC,KAAK,GAAG,KAAK,CAAC,CAAC;IAChD,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,MAAM,CAAC,MAAM,GAAG,KAAK,CAAC,CAAC;IAClD,MAAM,IAAI,GAAG,aAAa,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;IAC3C,MAAM,IAAI,GAAG,CAAC,KAAgC,EAAE,EAAE;QAChD,IAAI,CAAC,MAAM;YAAE,OAAO;QACpB,MAAM,IAAI,GAAG,KAAK,CAAC,aAAa,CAAC,qBAAqB,EAAE,CAAC;QACzD,MAAM,CAAC;YACL,CAAC,EAAE,MAAM,CAAC,CAAC,GAAG,CAAC,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG,KAAK;YACjD,CAAC,EAAE,MAAM,CAAC,CAAC,GAAG,CAAC,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,KAAK;SACjD,CAAC,CAAC;IACL,CAAC,CAAC;IACF,MAAM,OAAO,GAAG,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;IAC5E,OAAO,CACL,8BACc,gBAAgB,EAC5B,SAAS,EAAE,EAAE,CACX,6IAA6I,EAC7I,SAAS,CACV,aAED,eACE,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,GAAG,MAAM,CAAC,CAAC,IAAI,MAAM,CAAC,CAAC,IAAI,MAAM,CAAC,KAAK,IAAI,MAAM,CAAC,MAAM,EAAE,EACnE,OAAO,EAAE,IAAI,iBACD,MAAM,EAClB,SAAS,EAAE,EAAE,CAAC,iBAAiB,EAAE,MAAM,IAAI,gBAAgB,CAAC,aAE3D,QAAQ,EACT,8BACc,uBAAuB,EACnC,CAAC,EAAE,IAAI,CAAC,CAAC,EACT,CAAC,EAAE,IAAI,CAAC,CAAC,EACT,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,IAAI,EAAC,eAAe,EACpB,WAAW,EAAE,IAAI,EACjB,MAAM,EAAC,eAAe,EACtB,WAAW,EAAE,GAAG,GAAG,KAAK,EACxB,EAAE,EAAE,CAAC,GAAG,KAAK,GACb,IACE,EACL,OAAO,CAAC,CAAC,CAAC,eAAM,SAAS,EAAC,oCAAoC,YAAE,OAAO,GAAQ,CAAC,CAAC,CAAC,IAAI,IACnF,CACP,CAAC;AACJ,CAAC"}

package/dist/react/canvas-hud/CanvasNodeMenu.d.ts

@@ -0,0 +1,34 @@
+import type { ReactNode } from 'react';
+export interface CanvasNodeMenuItem {
+    label: string;
+    onSelect: () => void;
+    /** Drawn disabled. The section's `note` is where the reason goes. */
+    disabled?: boolean;
+    destructive?: boolean;
+}
+export interface CanvasNodeMenuSection {
+    heading?: string;
+    items: CanvasNodeMenuItem[];
+    /** One quiet line under the rows: what they change, or why they cannot. */
+    note?: ReactNode;
+}
+export interface CanvasNodeMenuProps {
+    trigger: ReactNode;
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    sections: CanvasNodeMenuSection[];
+    align?: 'start' | 'center' | 'end';
+    side?: 'top' | 'right' | 'bottom' | 'left';
+    className?: string;
+}
+/**
+ * A node's menu on a canvas — a `Popover`, deliberately not a `DropdownMenu`.
+ *
+ * A menu takes the arrow keys for its own rows; on a canvas they belong to the CANVAS, which
+ * moves its cursor to the next node and closes this (family's branch menu, the owner's ask of
+ * 2026-09-24: *"I want it to disappear if I click off of it or use arrows to move to another
+ * person"*). So the rows are Tab-reachable buttons, the keys bubble, and an outside press or
+ * Escape closes it. Pointer-downs stop here so pressing a row never starts a pan.
+ */
+export declare function CanvasNodeMenu({ trigger, open, onOpenChange, sections, align, side, className, }: CanvasNodeMenuProps): import("react").JSX.Element;
+//# sourceMappingURL=CanvasNodeMenu.d.ts.map

package/dist/react/canvas-hud/CanvasNodeMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CanvasNodeMenu.d.ts","sourceRoot":"","sources":["../../../src/react/canvas-hud/CanvasNodeMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAgB,SAAS,EAAE,MAAM,OAAO,CAAC;AAKrD,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,qEAAqE;IACrE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,MAAM,WAAW,qBAAqB;IACpC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,kBAAkB,EAAE,CAAC;IAC5B,2EAA2E;IAC3E,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED,MAAM,WAAW,mBAAmB;IAClC,OAAO,EAAE,SAAS,CAAC;IACnB,IAAI,EAAE,OAAO,CAAC;IACd,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,QAAQ,EAAE,qBAAqB,EAAE,CAAC;IAClC,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;IACnC,IAAI,CAAC,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;GAQG;AACH,wBAAgB,cAAc,CAAC,EAC7B,OAAO,EACP,IAAI,EACJ,YAAY,EACZ,QAAQ,EACR,KAAe,EACf,IAAe,EACf,SAAS,GACV,EAAE,mBAAmB,+BA2CrB"}

package/dist/react/canvas-hud/CanvasNodeMenu.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button } from '../components/Button.js';
+import { Popover } from '../components/Popover.js';
+import { cn } from '../lib/cn.js';
+/**
+ * A node's menu on a canvas — a `Popover`, deliberately not a `DropdownMenu`.
+ *
+ * A menu takes the arrow keys for its own rows; on a canvas they belong to the CANVAS, which
+ * moves its cursor to the next node and closes this (family's branch menu, the owner's ask of
+ * 2026-09-24: *"I want it to disappear if I click off of it or use arrows to move to another
+ * person"*). So the rows are Tab-reachable buttons, the keys bubble, and an outside press or
+ * Escape closes it. Pointer-downs stop here so pressing a row never starts a pan.
+ */
+export function CanvasNodeMenu({ trigger, open, onOpenChange, sections, align = 'start', side = 'bottom', className, }) {
+    const stop = (event) => event.stopPropagation();
+    return (_jsx(Popover, { open: open, onOpenChange: onOpenChange, align: align, side: side, className: cn('w-64 p-1', className), trigger: trigger, children: _jsx("div", { role: 'menu', onPointerDown: stop, className: 'flex flex-col', children: sections.map((section, sectionIndex) => (_jsxs("div", { className: cn('flex flex-col py-1', sectionIndex > 0 && 'border-t border-border'), children: [section.heading ? _jsx("p", { className: 'cb-meta-label px-2 pt-1 pb-1.5', children: section.heading }) : null, section.items.map((item) => (_jsx(Button, { role: 'menuitem', variant: item.destructive ? 'destructive' : 'ghost', size: 'sm', tooltip: item.label, tooltipMobile: 'off', disabled: item.disabled, className: 'w-full justify-start', onClick: (event) => {
+                            event.stopPropagation();
+                            item.onSelect();
+                        }, children: item.label }, item.label))), section.note ? _jsx("p", { className: 'px-2 pt-1 text-caption text-muted-foreground', children: section.note }) : null] }, sectionIndex))) }) }));
+}
+//# sourceMappingURL=CanvasNodeMenu.js.map

package/dist/react/canvas-hud/CanvasNodeMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CanvasNodeMenu.js","sourceRoot":"","sources":["../../../src/react/canvas-hud/CanvasNodeMenu.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACjD,OAAO,EAAE,OAAO,EAAE,MAAM,0BAA0B,CAAC;AACnD,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AA2BlC;;;;;;;;GAQG;AACH,MAAM,UAAU,cAAc,CAAC,EAC7B,OAAO,EACP,IAAI,EACJ,YAAY,EACZ,QAAQ,EACR,KAAK,GAAG,OAAO,EACf,IAAI,GAAG,QAAQ,EACf,SAAS,GACW;IACpB,MAAM,IAAI,GAAG,CAAC,KAAmB,EAAE,EAAE,CAAC,KAAK,CAAC,eAAe,EAAE,CAAC;IAC9D,OAAO,CACL,KAAC,OAAO,IACN,IAAI,EAAE,IAAI,EACV,YAAY,EAAE,YAAY,EAC1B,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,EAAE,CAAC,UAAU,EAAE,SAAS,CAAC,EACpC,OAAO,EAAE,OAAO,YAEhB,cAAK,IAAI,EAAC,MAAM,EAAC,aAAa,EAAE,IAAI,EAAE,SAAS,EAAC,eAAe,YAC5D,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,YAAY,EAAE,EAAE,CAAC,CACvC,eAGE,SAAS,EAAE,EAAE,CAAC,oBAAoB,EAAE,YAAY,GAAG,CAAC,IAAI,wBAAwB,CAAC,aAEhF,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,YAAG,SAAS,EAAC,gCAAgC,YAAE,OAAO,CAAC,OAAO,GAAK,CAAC,CAAC,CAAC,IAAI,EAC5F,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAC3B,KAAC,MAAM,IAEL,IAAI,EAAC,UAAU,EACf,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,OAAO,EACnD,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,IAAI,CAAC,KAAK,EACnB,aAAa,EAAC,KAAK,EACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,SAAS,EAAC,sBAAsB,EAChC,OAAO,EAAE,CAAC,KAAK,EAAE,EAAE;4BACjB,KAAK,CAAC,eAAe,EAAE,CAAC;4BACxB,IAAI,CAAC,QAAQ,EAAE,CAAC;wBAClB,CAAC,YAEA,IAAI,CAAC,KAAK,IAbN,IAAI,CAAC,KAAK,CAcR,CACV,CAAC,EACD,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,YAAG,SAAS,EAAC,8CAA8C,YAAE,OAAO,CAAC,IAAI,GAAK,CAAC,CAAC,CAAC,IAAI,KAtBhG,YAAY,CAuBb,CACP,CAAC,GACE,GACE,CACX,CAAC;AACJ,CAAC"}

package/dist/react/canvas-hud/CanvasSearchField.d.ts

@@ -0,0 +1,27 @@
+export interface CanvasSearchFieldProps {
+    value: string;
+    onChange: (value: string) => void;
+    /** Step to the next (1) or previous (-1) match — Enter and Shift+Enter, and the ‹ › keys. */
+    onStep?: (delta: 1 | -1) => void;
+    /** How many matches the query has, and which one is current (0-based). */
+    matches?: number;
+    index?: number;
+    placeholder?: string;
+    'aria-label'?: string;
+    className?: string;
+}
+/**
+ * The find box that floats over a canvas, and the one that does not steal the canvas's keys.
+ *
+ * 🔴 A canvas binds the arrow keys on an ancestor of this field. Without stopping them here,
+ * typing a name and pressing ← to fix a typo walked the reader to a cousin instead of moving
+ * the caret (family, 2026-09). Every key stops at the field; Enter and Shift+Enter step through
+ * the matches, the convention of every find-in-page; Escape empties the box rather than blurring.
+ *
+ * It is the belt's `Input` drawn borderless, so the pill around it is the field — and NOT
+ * `SearchInput`: a find box over a canvas matches names, never wildcards or regexes, and the
+ * syntax parser and its badge were 5.6 kB gzip on family's first paint for nothing (task 2401).
+ * A ✕ empties it too, because a phone has no Escape key.
+ */
+export declare function CanvasSearchField({ value, onChange, onStep, matches, index, placeholder, 'aria-label': ariaLabel, className, }: CanvasSearchFieldProps): import("react").JSX.Element;
+//# sourceMappingURL=CanvasSearchField.d.ts.map

package/dist/react/canvas-hud/CanvasSearchField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CanvasSearchField.d.ts","sourceRoot":"","sources":["../../../src/react/canvas-hud/CanvasSearchField.tsx"],"names":[],"mappings":"AAOA,MAAM,WAAW,sBAAsB;IACrC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,6FAA6F;IAC7F,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,GAAG,CAAC,CAAC,KAAK,IAAI,CAAC;IACjC,0EAA0E;IAC1E,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,QAAQ,EACR,MAAM,EACN,OAAW,EACX,KAAS,EACT,WAAqB,EACrB,YAAY,EAAE,SAAS,EACvB,SAAS,GACV,EAAE,sBAAsB,+BAgDxB"}

package/dist/react/canvas-hud/CanvasSearchField.js

@@ -0,0 +1,35 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { HudPill } from '../components/HudPill.js';
+import { Input } from '../components/Input.js';
+import { IconSearch } from '../icons.js';
+import { cn } from '../lib/cn.js';
+import { HudButton } from './HudControls.js';
+/**
+ * The find box that floats over a canvas, and the one that does not steal the canvas's keys.
+ *
+ * 🔴 A canvas binds the arrow keys on an ancestor of this field. Without stopping them here,
+ * typing a name and pressing ← to fix a typo walked the reader to a cousin instead of moving
+ * the caret (family, 2026-09). Every key stops at the field; Enter and Shift+Enter step through
+ * the matches, the convention of every find-in-page; Escape empties the box rather than blurring.
+ *
+ * It is the belt's `Input` drawn borderless, so the pill around it is the field — and NOT
+ * `SearchInput`: a find box over a canvas matches names, never wildcards or regexes, and the
+ * syntax parser and its badge were 5.6 kB gzip on family's first paint for nothing (task 2401).
+ * A ✕ empties it too, because a phone has no Escape key.
+ */
+export function CanvasSearchField({ value, onChange, onStep, matches = 0, index = 0, placeholder = 'Find…', 'aria-label': ariaLabel, className, }) {
+    const searching = value.trim().length > 0;
+    const onKeyDown = (event) => {
+        if (event.key === 'Enter' && onStep) {
+            event.preventDefault();
+            onStep(event.shiftKey ? -1 : 1);
+        }
+        if (event.key === 'Escape' && value !== '') {
+            event.preventDefault();
+            onChange('');
+        }
+        event.stopPropagation();
+    };
+    return (_jsxs(HudPill, { className: cn('gap-0.5 rounded-lg py-0.5 pr-1 pl-0', className), children: [_jsx(IconSearch, { size: 16, className: 'ml-2 shrink-0 text-muted-foreground' }), _jsx(Input, { type: 'search', size: 'sm', value: value, onChange: (event) => onChange(event.target.value), placeholder: placeholder, "aria-label": ariaLabel ?? placeholder, onKeyDown: onKeyDown, className: 'w-40 border-transparent bg-transparent pl-1 shadow-none focus-visible:border-transparent focus-visible:ring-0 [&::-webkit-search-cancel-button]:hidden' }), searching ? (_jsx("span", { className: 'min-w-10 text-center text-xs text-muted-foreground tabular-nums', "aria-live": 'polite', children: matches === 0 ? 'none' : `${index + 1}/${matches}` })) : null, onStep && matches > 1 ? (_jsxs(_Fragment, { children: [_jsx(HudButton, { label: 'Previous match \u2014 Shift+Enter', onClick: () => onStep(-1), children: _jsx("span", { "aria-hidden": true, children: "\u2039" }) }), _jsx(HudButton, { label: 'Next match \u2014 Enter', onClick: () => onStep(1), children: _jsx("span", { "aria-hidden": true, children: "\u203A" }) })] })) : null, searching ? (_jsx(HudButton, { label: 'Clear the search \u2014 Escape', onClick: () => onChange(''), children: _jsx("span", { "aria-hidden": true, children: "\u00D7" }) })) : null] }));
+}
+//# sourceMappingURL=CanvasSearchField.js.map

package/dist/react/canvas-hud/CanvasSearchField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CanvasSearchField.js","sourceRoot":"","sources":["../../../src/react/canvas-hud/CanvasSearchField.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,OAAO,EAAE,MAAM,0BAA0B,CAAC;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAC/C,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACzC,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAe7C;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,iBAAiB,CAAC,EAChC,KAAK,EACL,QAAQ,EACR,MAAM,EACN,OAAO,GAAG,CAAC,EACX,KAAK,GAAG,CAAC,EACT,WAAW,GAAG,OAAO,EACrB,YAAY,EAAE,SAAS,EACvB,SAAS,GACc;IACvB,MAAM,SAAS,GAAG,KAAK,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,CAAC,CAAC;IAC1C,MAAM,SAAS,GAAG,CAAC,KAAsC,EAAE,EAAE;QAC3D,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,MAAM,EAAE,CAAC;YACpC,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,MAAM,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAClC,CAAC;QACD,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,IAAI,KAAK,KAAK,EAAE,EAAE,CAAC;YAC3C,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,QAAQ,CAAC,EAAE,CAAC,CAAC;QACf,CAAC;QACD,KAAK,CAAC,eAAe,EAAE,CAAC;IAC1B,CAAC,CAAC;IACF,OAAO,CACL,MAAC,OAAO,IAAC,SAAS,EAAE,EAAE,CAAC,qCAAqC,EAAE,SAAS,CAAC,aACtE,KAAC,UAAU,IAAC,IAAI,EAAE,EAAE,EAAE,SAAS,EAAC,qCAAqC,GAAG,EACxE,KAAC,KAAK,IACJ,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,IAAI,EACT,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,EACjD,WAAW,EAAE,WAAW,gBACZ,SAAS,IAAI,WAAW,EACpC,SAAS,EAAE,SAAS,EACpB,SAAS,EAAC,wJAAwJ,GAClK,EACD,SAAS,CAAC,CAAC,CAAC,CACX,eAAM,SAAS,EAAC,iEAAiE,eAAW,QAAQ,YACjG,OAAO,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,IAAI,OAAO,EAAE,GAC9C,CACR,CAAC,CAAC,CAAC,IAAI,EACP,MAAM,IAAI,OAAO,GAAG,CAAC,CAAC,CAAC,CAAC,CACvB,8BACE,KAAC,SAAS,IAAC,KAAK,EAAC,mCAA8B,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,YACvE,yDAA0B,GAChB,EACZ,KAAC,SAAS,IAAC,KAAK,EAAC,yBAAoB,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,YAC5D,yDAA0B,GAChB,IACX,CACJ,CAAC,CAAC,CAAC,IAAI,EACP,SAAS,CAAC,CAAC,CAAC,CACX,KAAC,SAAS,IAAC,KAAK,EAAC,gCAA2B,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,YACtE,yDAA0B,GAChB,CACb,CAAC,CAAC,CAAC,IAAI,IACA,CACX,CAAC;AACJ,CAAC"}

package/dist/react/canvas-hud/HudControls.d.ts

@@ -0,0 +1,43 @@
+import type { ReactNode } from 'react';
+export interface HudButtonProps {
+    /** What it does — the accessible name and the hover hint. */
+    label: string;
+    onClick: () => void;
+    children: ReactNode;
+    /** Present only on a control that TOGGLES, so the others announce no pressed state. */
+    pressed?: boolean;
+    /** Why it cannot act right now: drawn disabled, still focusable, the reason on hover. */
+    unavailableReason?: string | null;
+    className?: string;
+}
+/** One HUD control — an icon-sized belt `IconButton`, with a pressed state for a toggle. */
+export declare function HudButton({ label, onClick, children, pressed, unavailableReason, className }: HudButtonProps): import("react").JSX.Element;
+export interface HudZoomControlsProps {
+    /** The live scale; drawn as a percentage. */
+    scale: number;
+    onZoomIn: () => void;
+    onZoomOut: () => void;
+    /** Fit the content to the screen. */
+    onFit: () => void;
+    /** Center on the focused node. Omit it when the canvas has no focus to centre on. */
+    onCenter?: () => void;
+    fitLabel?: string;
+    centerLabel?: string;
+    /** The canvas's own utilities, drawn before the zoom keys in the same pill (CNV-4 — utilities
+     *  only; preferences and primary actions belong in the page's panel). */
+    children?: ReactNode;
+    className?: string;
+}
+/** CNV-3's essentials as one pill: −, the zoom %, +, Fit and Center. */
+export declare function HudZoomControls({ scale, onZoomIn, onZoomOut, onFit, onCenter, fitLabel, centerLabel, children, className, }: HudZoomControlsProps): import("react").JSX.Element;
+export interface CanvasZoomHintProps {
+    /** `useCanvasWheel(…).hint` — up while the reader wheels over an embedded canvas. */
+    show: boolean;
+    className?: string;
+}
+/**
+ * CNV-1's "Hold ⌘ to zoom" — what an embedded canvas says when a plain wheel scrolled the page
+ * instead of zooming it, the way an embedded Google Map does. Says Ctrl off a Mac.
+ */
+export declare function CanvasZoomHint({ show, className }: CanvasZoomHintProps): import("react").JSX.Element;
+//# sourceMappingURL=HudControls.d.ts.map

package/dist/react/canvas-hud/HudControls.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HudControls.d.ts","sourceRoot":"","sources":["../../../src/react/canvas-hud/HudControls.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAoBvC,MAAM,WAAW,cAAc;IAC7B,6DAA6D;IAC7D,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,EAAE,SAAS,CAAC;IACpB,uFAAuF;IACvF,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,yFAAyF;IACzF,iBAAiB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,4FAA4F;AAC5F,wBAAgB,SAAS,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAE,EAAE,cAAc,+BAc5G;AAED,MAAM,WAAW,oBAAoB;IACnC,6CAA6C;IAC7C,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,qCAAqC;IACrC,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,qFAAqF;IACrF,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;6EACyE;IACzE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wEAAwE;AACxE,wBAAgB,eAAe,CAAC,EAC9B,KAAK,EACL,QAAQ,EACR,SAAS,EACT,KAAK,EACL,QAAQ,EACR,QAA0B,EAC1B,WAAuC,EACvC,QAAQ,EACR,SAAS,GACV,EAAE,oBAAoB,+BAuBtB;AAED,MAAM,WAAW,mBAAmB;IAClC,qFAAqF;IACrF,IAAI,EAAE,OAAO,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;GAGG;AACH,wBAAgB,cAAc,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,mBAAmB,+BAetE"}

package/dist/react/canvas-hud/HudControls.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { HudPill } from '../components/HudPill.js';
+import { IconButton } from '../components/IconButton.js';
+import { IconCenter, IconFit, IconZoomIn, IconZoomOut } from '../icons.js';
+import { cn } from '../lib/cn.js';
+/** One HUD control — an icon-sized belt `IconButton`, with a pressed state for a toggle. */
+export function HudButton({ label, onClick, children, pressed, unavailableReason, className }) {
+    return (_jsx(IconButton, { label: label, size: 'sm', "aria-pressed": pressed, unavailableReason: unavailableReason ?? undefined, tooltipMobile: 'off', onClick: onClick, className: cn('text-muted-foreground aria-pressed:bg-muted aria-pressed:text-foreground', className), children: children }));
+}
+/** CNV-3's essentials as one pill: −, the zoom %, +, Fit and Center. */
+export function HudZoomControls({ scale, onZoomIn, onZoomOut, onFit, onCenter, fitLabel = 'Fit to screen', centerLabel = 'Center on the selection', children, className, }) {
+    return (_jsxs(HudPill, { role: 'group', "aria-label": 'View', className: cn('gap-0.5 rounded-lg px-1 py-1', className), children: [children, _jsx(HudButton, { label: 'Zoom out', onClick: onZoomOut, children: _jsx(IconZoomOut, {}) }), _jsxs("span", { className: 'min-w-11 text-center text-xs text-muted-foreground tabular-nums', "data-testid": 'hud-zoom', children: [Math.round(scale * 100), "%"] }), _jsx(HudButton, { label: 'Zoom in', onClick: onZoomIn, children: _jsx(IconZoomIn, {}) }), _jsx(HudButton, { label: fitLabel, onClick: onFit, children: _jsx(IconFit, {}) }), onCenter ? (_jsx(HudButton, { label: centerLabel, onClick: onCenter, children: _jsx(IconCenter, {}) })) : null] }));
+}
+/**
+ * CNV-1's "Hold ⌘ to zoom" — what an embedded canvas says when a plain wheel scrolled the page
+ * instead of zooming it, the way an embedded Google Map does. Says Ctrl off a Mac.
+ */
+export function CanvasZoomHint({ show, className }) {
+    const mac = typeof navigator !== 'undefined' && /Mac|iPhone|iPad/.test(navigator.platform || navigator.userAgent);
+    return (_jsx("div", { "aria-hidden": !show, "data-testid": 'canvas-zoom-hint', className: cn('pointer-events-none absolute inset-0 grid place-items-center bg-background/40 transition-opacity duration-200', show ? 'opacity-100' : 'opacity-0', className), children: _jsxs(HudPill, { className: 'px-3 py-1.5 text-sm', children: ["Hold ", mac ? '⌘' : 'Ctrl', " to zoom"] }) }));
+}
+//# sourceMappingURL=HudControls.js.map

package/dist/react/canvas-hud/HudControls.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HudControls.js","sourceRoot":"","sources":["../../../src/react/canvas-hud/HudControls.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,OAAO,EAAE,MAAM,0BAA0B,CAAC;AACnD,OAAO,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAC;AACzD,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC3E,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AA4BlC,4FAA4F;AAC5F,MAAM,UAAU,SAAS,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAkB;IAC3G,OAAO,CACL,KAAC,UAAU,IACT,KAAK,EAAE,KAAK,EACZ,IAAI,EAAC,IAAI,kBACK,OAAO,EACrB,iBAAiB,EAAE,iBAAiB,IAAI,SAAS,EACjD,aAAa,EAAC,KAAK,EACnB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,EAAE,CAAC,0EAA0E,EAAE,SAAS,CAAC,YAEnG,QAAQ,GACE,CACd,CAAC;AACJ,CAAC;AAmBD,wEAAwE;AACxE,MAAM,UAAU,eAAe,CAAC,EAC9B,KAAK,EACL,QAAQ,EACR,SAAS,EACT,KAAK,EACL,QAAQ,EACR,QAAQ,GAAG,eAAe,EAC1B,WAAW,GAAG,yBAAyB,EACvC,QAAQ,EACR,SAAS,GACY;IACrB,OAAO,CACL,MAAC,OAAO,IAAC,IAAI,EAAC,OAAO,gBAAY,MAAM,EAAC,SAAS,EAAE,EAAE,CAAC,8BAA8B,EAAE,SAAS,CAAC,aAC7F,QAAQ,EACT,KAAC,SAAS,IAAC,KAAK,EAAC,UAAU,EAAC,OAAO,EAAE,SAAS,YAC5C,KAAC,WAAW,KAAG,GACL,EACZ,gBAAM,SAAS,EAAC,iEAAiE,iBAAa,UAAU,aACrG,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,CAAC,SACnB,EACP,KAAC,SAAS,IAAC,KAAK,EAAC,SAAS,EAAC,OAAO,EAAE,QAAQ,YAC1C,KAAC,UAAU,KAAG,GACJ,EACZ,KAAC,SAAS,IAAC,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,YACxC,KAAC,OAAO,KAAG,GACD,EACX,QAAQ,CAAC,CAAC,CAAC,CACV,KAAC,SAAS,IAAC,KAAK,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,YAC9C,KAAC,UAAU,KAAG,GACJ,CACb,CAAC,CAAC,CAAC,IAAI,IACA,CACX,CAAC;AACJ,CAAC;AAQD;;;GAGG;AACH,MAAM,UAAU,cAAc,CAAC,EAAE,IAAI,EAAE,SAAS,EAAuB;IACrE,MAAM,GAAG,GAAG,OAAO,SAAS,KAAK,WAAW,IAAI,iBAAiB,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,IAAI,SAAS,CAAC,SAAS,CAAC,CAAC;IAClH,OAAO,CACL,6BACe,CAAC,IAAI,iBACN,kBAAkB,EAC9B,SAAS,EAAE,EAAE,CACX,+GAA+G,EAC/G,IAAI,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,WAAW,EAClC,SAAS,CACV,YAED,MAAC,OAAO,IAAC,SAAS,EAAC,qBAAqB,sBAAO,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,MAAM,gBAAmB,GAChF,CACP,CAAC;AACJ,CAAC"}

package/dist/react/canvas-hud/index.d.ts

@@ -0,0 +1,13 @@
+export type { CanvasMinimapProps } from './CanvasMinimap.js';
+export { CanvasMinimap } from './CanvasMinimap.js';
+export type { CanvasNodeMenuItem, CanvasNodeMenuProps, CanvasNodeMenuSection } from './CanvasNodeMenu.js';
+export { CanvasNodeMenu } from './CanvasNodeMenu.js';
+export type { CanvasSearchFieldProps } from './CanvasSearchField.js';
+export { CanvasSearchField } from './CanvasSearchField.js';
+export type { CanvasZoomHintProps, HudButtonProps, HudZoomControlsProps } from './HudControls.js';
+export { CanvasZoomHint, HudButton, HudZoomControls } from './HudControls.js';
+export type { CanvasWheelMode, CanvasWheelOptions } from './useCanvasWheel.js';
+export { readWheel, useCanvasWheel, useLevelOfDetail } from './useCanvasWheel.js';
+export type { CanvasBounds, CanvasPoint, CanvasSize, CanvasView, FitOptions, LevelOfDetail, LevelOfDetailThresholds, } from './viewport.js';
+export { centerView, clampScale, fitScale, fitView, LEVEL_OF_DETAIL, levelOfDetail, visibleBounds, wheelZoomFactor, zoomAt, } from './viewport.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/react/canvas-hud/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/react/canvas-hud/index.ts"],"names":[],"mappings":"AAGA,YAAY,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAC7D,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,YAAY,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,qBAAqB,EAAE,MAAM,qBAAqB,CAAC;AAC1G,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrD,YAAY,EAAE,sBAAsB,EAAE,MAAM,wBAAwB,CAAC;AACrE,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAC3D,YAAY,EAAE,mBAAmB,EAAE,cAAc,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAClG,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAC9E,YAAY,EAAE,eAAe,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAC/E,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAClF,YAAY,EACV,YAAY,EACZ,WAAW,EACX,UAAU,EACV,UAAU,EACV,UAAU,EACV,aAAa,EACb,uBAAuB,GACxB,MAAM,eAAe,CAAC;AACvB,OAAO,EACL,UAAU,EACV,UAAU,EACV,QAAQ,EACR,OAAO,EACP,eAAe,EACf,aAAa,EACb,aAAa,EACb,eAAe,EACf,MAAM,GACP,MAAM,eAAe,CAAC"}

package/dist/react/canvas-hud/index.js

@@ -0,0 +1,7 @@
+export { CanvasMinimap } from './CanvasMinimap.js';
+export { CanvasNodeMenu } from './CanvasNodeMenu.js';
+export { CanvasSearchField } from './CanvasSearchField.js';
+export { CanvasZoomHint, HudButton, HudZoomControls } from './HudControls.js';
+export { readWheel, useCanvasWheel, useLevelOfDetail } from './useCanvasWheel.js';
+export { centerView, clampScale, fitScale, fitView, LEVEL_OF_DETAIL, levelOfDetail, visibleBounds, wheelZoomFactor, zoomAt, } from './viewport.js';
+//# sourceMappingURL=index.js.map

package/dist/react/canvas-hud/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/react/canvas-hud/index.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAEnD,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAErD,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAE3D,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAE9E,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAUlF,OAAO,EACL,UAAU,EACV,UAAU,EACV,QAAQ,EACR,OAAO,EACP,eAAe,EACf,aAAa,EACb,aAAa,EACb,eAAe,EACf,MAAM,GACP,MAAM,eAAe,CAAC"}

package/dist/react/canvas-hud/useCanvasWheel.d.ts

@@ -0,0 +1,41 @@
+import { type RefObject } from 'react';
+import { type CanvasPoint, type LevelOfDetail, type LevelOfDetailThresholds } from './viewport.js';
+/**
+ * How a canvas reads the wheel (CNV-1 — one gesture, one meaning, on every surface):
+ *
+ * - `'full'` — the canvas owns the viewport and the page does not scroll. Pinch and ⌘/Ctrl+wheel
+ *   zoom; a plain wheel or a two-finger swipe PANS (Figma, Miro).
+ * - `'full-zoom'` — the same, except a plain wheel ZOOMS, the way a full-page map does. For a
+ *   canvas whose readers already zoom with a mouse wheel (family's tree): a shift+wheel pans.
+ * - `'embedded'` — the page scrolls past the canvas. A plain wheel is the PAGE's and is left
+ *   alone; pinch and ⌘/Ctrl+wheel zoom; the hook raises `hint` so the canvas can say
+ *   "Hold ⌘ to zoom", the way an embedded Google Map does.
+ */
+export type CanvasWheelMode = 'full' | 'full-zoom' | 'embedded';
+export interface CanvasWheelOptions {
+    mode: CanvasWheelMode;
+    /** Zoom by `factor` about `anchor` (viewport pixels). The canvas clamps. */
+    onZoom: (factor: number, anchor: CanvasPoint) => void;
+    /** Pan by screen pixels. Unused in `'embedded'` mode. */
+    onPan?: (dx: number, dy: number) => void;
+    /** How long the embedded hint stays up after the last plain wheel. Default 1200 ms. */
+    hintMs?: number;
+}
+/** The decision, separated from the DOM so it is testable: what one wheel event means. */
+export declare function readWheel(mode: CanvasWheelMode, event: Pick<WheelEvent, 'ctrlKey' | 'metaKey' | 'shiftKey' | 'deltaX' | 'deltaY'>): 'zoom' | 'pan' | 'page';
+/**
+ * Binds the wheel on `ref` per {@link CanvasWheelMode}.
+ *
+ * 🔴 A NON-passive native listener, never a JSX `onWheel`: React registers `wheel` at the root as
+ * passive, so `preventDefault()` there is ignored and the page scrolls (or zooms the whole
+ * browser on a pinch) under the canvas.
+ */
+export declare function useCanvasWheel(ref: RefObject<HTMLElement | null>, options: CanvasWheelOptions): {
+    hint: boolean;
+};
+/**
+ * CNV-5 — the density to draw at this scale. A string that changes only at a threshold, so an
+ * effect or memo keyed on it re-runs three times across the whole zoom range, not every frame.
+ */
+export declare function useLevelOfDetail(scale: number, thresholds?: LevelOfDetailThresholds): LevelOfDetail;
+//# sourceMappingURL=useCanvasWheel.d.ts.map

package/dist/react/canvas-hud/useCanvasWheel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCanvasWheel.d.ts","sourceRoot":"","sources":["../../../src/react/canvas-hud/useCanvasWheel.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAA+B,MAAM,OAAO,CAAC;AACpE,OAAO,EACL,KAAK,WAAW,EAEhB,KAAK,aAAa,EAClB,KAAK,uBAAuB,EAG7B,MAAM,eAAe,CAAC;AAEvB;;;;;;;;;;GAUG;AACH,MAAM,MAAM,eAAe,GAAG,MAAM,GAAG,WAAW,GAAG,UAAU,CAAC;AAEhE,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,eAAe,CAAC;IACtB,4EAA4E;IAC5E,MAAM,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,KAAK,IAAI,CAAC;IACtD,yDAAyD;IACzD,KAAK,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,uFAAuF;IACvF,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,0FAA0F;AAC1F,wBAAgB,SAAS,CACvB,IAAI,EAAE,eAAe,EACrB,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,SAAS,GAAG,SAAS,GAAG,UAAU,GAAG,QAAQ,GAAG,QAAQ,CAAC,GAChF,MAAM,GAAG,KAAK,GAAG,MAAM,CAMzB;AAED;;;;;;GAMG;AACH,wBAAgB,cAAc,CAAC,GAAG,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,EAAE,OAAO,EAAE,kBAAkB,GAAG;IAAE,IAAI,EAAE,OAAO,CAAA;CAAE,CAmCjH;AAED;;;GAGG;AACH,wBAAgB,gBAAgB,CAC9B,KAAK,EAAE,MAAM,EACb,UAAU,GAAE,uBAAyC,GACpD,aAAa,CAEf"}

package/dist/react/canvas-hud/useCanvasWheel.js

@@ -0,0 +1,65 @@
+import { useEffect, useRef, useState } from 'react';
+import { LEVEL_OF_DETAIL, levelOfDetail, wheelZoomFactor, } from './viewport.js';
+/** The decision, separated from the DOM so it is testable: what one wheel event means. */
+export function readWheel(mode, event) {
+    // A trackpad pinch arrives as a wheel event with ctrlKey set, on every browser.
+    if (event.ctrlKey || event.metaKey)
+        return 'zoom';
+    if (mode === 'embedded')
+        return 'page';
+    if (mode === 'full-zoom')
+        return event.shiftKey ? 'pan' : 'zoom';
+    return 'pan';
+}
+/**
+ * Binds the wheel on `ref` per {@link CanvasWheelMode}.
+ *
+ * 🔴 A NON-passive native listener, never a JSX `onWheel`: React registers `wheel` at the root as
+ * passive, so `preventDefault()` there is ignored and the page scrolls (or zooms the whole
+ * browser on a pinch) under the canvas.
+ */
+export function useCanvasWheel(ref, options) {
+    const latest = useRef(options);
+    latest.current = options;
+    const [hint, setHint] = useState(false);
+    useEffect(() => {
+        const element = ref.current;
+        if (!element)
+            return;
+        let timer;
+        const onWheel = (event) => {
+            const { mode, onZoom, onPan, hintMs = 1200 } = latest.current;
+            const meaning = readWheel(mode, event);
+            if (meaning === 'page') {
+                setHint(true);
+                clearTimeout(timer);
+                timer = setTimeout(() => setHint(false), hintMs);
+                return;
+            }
+            event.preventDefault();
+            if (meaning === 'zoom') {
+                const rect = element.getBoundingClientRect();
+                onZoom(wheelZoomFactor(event.deltaY), { x: event.clientX - rect.left, y: event.clientY - rect.top });
+                return;
+            }
+            // A shift+wheel from a mouse reports its motion on Y; a sideways trackpad swipe on X.
+            const dx = event.shiftKey && event.deltaX === 0 ? event.deltaY : event.deltaX;
+            const dy = event.shiftKey && event.deltaX === 0 ? 0 : event.deltaY;
+            onPan?.(-dx, -dy);
+        };
+        element.addEventListener('wheel', onWheel, { passive: false });
+        return () => {
+            clearTimeout(timer);
+            element.removeEventListener('wheel', onWheel);
+        };
+    }, [ref]);
+    return { hint };
+}
+/**
+ * CNV-5 — the density to draw at this scale. A string that changes only at a threshold, so an
+ * effect or memo keyed on it re-runs three times across the whole zoom range, not every frame.
+ */
+export function useLevelOfDetail(scale, thresholds = LEVEL_OF_DETAIL) {
+    return levelOfDetail(scale, thresholds);
+}
+//# sourceMappingURL=useCanvasWheel.js.map

package/dist/react/canvas-hud/useCanvasWheel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCanvasWheel.js","sourceRoot":"","sources":["../../../src/react/canvas-hud/useCanvasWheel.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkB,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACpE,OAAO,EAEL,eAAe,EAGf,aAAa,EACb,eAAe,GAChB,MAAM,eAAe,CAAC;AAyBvB,0FAA0F;AAC1F,MAAM,UAAU,SAAS,CACvB,IAAqB,EACrB,KAAiF;IAEjF,gFAAgF;IAChF,IAAI,KAAK,CAAC,OAAO,IAAI,KAAK,CAAC,OAAO;QAAE,OAAO,MAAM,CAAC;IAClD,IAAI,IAAI,KAAK,UAAU;QAAE,OAAO,MAAM,CAAC;IACvC,IAAI,IAAI,KAAK,WAAW;QAAE,OAAO,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC;IACjE,OAAO,KAAK,CAAC;AACf,CAAC;AAED;;;;;;GAMG;AACH,MAAM,UAAU,cAAc,CAAC,GAAkC,EAAE,OAA2B;IAC5F,MAAM,MAAM,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC;IAC/B,MAAM,CAAC,OAAO,GAAG,OAAO,CAAC;IACzB,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACxC,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,OAAO,GAAG,GAAG,CAAC,OAAO,CAAC;QAC5B,IAAI,CAAC,OAAO;YAAE,OAAO;QACrB,IAAI,KAAgD,CAAC;QACrD,MAAM,OAAO,GAAG,CAAC,KAAiB,EAAQ,EAAE;YAC1C,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,EAAE,GAAG,MAAM,CAAC,OAAO,CAAC;YAC9D,MAAM,OAAO,GAAG,SAAS,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;YACvC,IAAI,OAAO,KAAK,MAAM,EAAE,CAAC;gBACvB,OAAO,CAAC,IAAI,CAAC,CAAC;gBACd,YAAY,CAAC,KAAK,CAAC,CAAC;gBACpB,KAAK,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC,CAAC;gBACjD,OAAO;YACT,CAAC;YACD,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,IAAI,OAAO,KAAK,MAAM,EAAE,CAAC;gBACvB,MAAM,IAAI,GAAG,OAAO,CAAC,qBAAqB,EAAE,CAAC;gBAC7C,MAAM,CAAC,eAAe,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE,EAAE,CAAC,EAAE,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;gBACrG,OAAO;YACT,CAAC;YACD,sFAAsF;YACtF,MAAM,EAAE,GAAG,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC;YAC9E,MAAM,EAAE,GAAG,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC;YACnE,KAAK,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC;QACpB,CAAC,CAAC;QACF,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,OAAO,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC;QAC/D,OAAO,GAAG,EAAE;YACV,YAAY,CAAC,KAAK,CAAC,CAAC;YACpB,OAAO,CAAC,mBAAmB,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;QAChD,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC;IACV,OAAO,EAAE,IAAI,EAAE,CAAC;AAClB,CAAC;AAED;;;GAGG;AACH,MAAM,UAAU,gBAAgB,CAC9B,KAAa,EACb,aAAsC,eAAe;IAErD,OAAO,aAAa,CAAC,KAAK,EAAE,UAAU,CAAC,CAAC;AAC1C,CAAC"}

package/dist/react/canvas-hud/viewport.d.ts

@@ -0,0 +1,68 @@
+/**
+ * The camera arithmetic every pan-and-zoom canvas needs (CNV-2, CNV-3, CNV-5).
+ *
+ * Pure — no React, no DOM — so each rule is pinned by a spec rather than by opening an app.
+ * A view maps a WORLD point to the screen as `screen = world × scale + (x, y)`: `x`/`y` are the
+ * screen position of the world origin, which is what a CSS `translate(x, y) scale(scale)` on the
+ * stage means. Every canvas in the fleet already used that convention (family's `Camera`,
+ * patterns' `viewportGestures.ts`, desk's xyflow viewport), which is why it is the one here.
+ */
+export interface CanvasView {
+    x: number;
+    y: number;
+    scale: number;
+}
+export interface CanvasPoint {
+    x: number;
+    y: number;
+}
+export interface CanvasSize {
+    width: number;
+    height: number;
+}
+/** A rectangle in WORLD units — the content's extent, or the visible window. */
+export interface CanvasBounds extends CanvasPoint, CanvasSize {
+}
+export declare function clampScale(scale: number, min: number, max: number): number;
+/**
+ * CNV-2 — zoom to `scale` keeping the screen point `anchor` still: the pointer for a wheel or a
+ * pinch, the middle of the viewport for the ± buttons. The caller clamps `scale` first, because
+ * the floor is the canvas's own business (family floors it at the whole tree).
+ */
+export declare function zoomAt(view: CanvasView, scale: number, anchor: CanvasPoint): CanvasView;
+/** The zoom factor for one wheel event — exponential, so a trackpad pinch (which arrives as a
+ *  ctrl+wheel stream of small deltas) and a mouse notch feel equally linear. */
+export declare function wheelZoomFactor(deltaY: number): number;
+export interface FitOptions {
+    /** Screen pixels of breathing room on every side. Default 48. */
+    padding?: number;
+    /**
+     * The largest scale a fit may land on. Default 1: fit SHRINKS to fit and never magnifies a
+     * small graph past its natural size — a two-node graph "fitted" to 400% reads as a zoom
+     * nobody asked for (Figma's and Miro's zoom-to-fit behave the same way).
+     */
+    maxScale?: number;
+    /** The smallest. Default 0.02 — a degenerate extent must still be a drawable number. */
+    minScale?: number;
+}
+/** The scale at which `bounds` fits the viewport, or `null` while there is nothing to fit
+ *  (an empty extent, or a viewport not measured yet). */
+export declare function fitScale(bounds: CanvasSize, viewport: CanvasSize, options?: FitOptions): number | null;
+/** CNV-3 "Fit" — the view that centres `bounds` in the viewport at {@link fitScale}. */
+export declare function fitView(bounds: CanvasBounds, viewport: CanvasSize, options?: FitOptions): CanvasView | null;
+/** CNV-3 "Center" — the view that puts the world point `point` in the middle of the viewport. */
+export declare function centerView(point: CanvasPoint, viewport: CanvasSize, scale: number): CanvasView;
+/** The part of the world the viewport shows — what a minimap draws as its window. */
+export declare function visibleBounds(view: CanvasView, viewport: CanvasSize): CanvasBounds;
+/** CNV-5's three densities. */
+export type LevelOfDetail = 'far' | 'mid' | 'close';
+export interface LevelOfDetailThresholds {
+    /** At and above this scale, primary labels may appear. Default 0.3. */
+    mid: number;
+    /** At and above this scale, full labels and metadata. Default 0.5. */
+    close: number;
+}
+export declare const LEVEL_OF_DETAIL: LevelOfDetailThresholds;
+/** CNV-5 — which density a canvas draws at this scale. */
+export declare function levelOfDetail(scale: number, thresholds?: LevelOfDetailThresholds): LevelOfDetail;
+//# sourceMappingURL=viewport.d.ts.map

package/dist/react/canvas-hud/viewport.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"viewport.d.ts","sourceRoot":"","sources":["../../../src/react/canvas-hud/viewport.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,MAAM,WAAW,UAAU;IACzB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,WAAW;IAC1B,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX;AAED,MAAM,WAAW,UAAU;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,gFAAgF;AAChF,MAAM,WAAW,YAAa,SAAQ,WAAW,EAAE,UAAU;CAAG;AAEhE,wBAAgB,UAAU,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,MAAM,CAE1E;AAED;;;;GAIG;AACH,wBAAgB,MAAM,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,GAAG,UAAU,CAQvF;AAED;gFACgF;AAChF,wBAAgB,eAAe,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAEtD;AAED,MAAM,WAAW,UAAU;IACzB,iEAAiE;IACjE,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,wFAAwF;IACxF,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED;yDACyD;AACzD,wBAAgB,QAAQ,CAAC,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,OAAO,GAAE,UAAe,GAAG,MAAM,GAAG,IAAI,CAS1G;AAED,wFAAwF;AACxF,wBAAgB,OAAO,CAAC,MAAM,EAAE,YAAY,EAAE,QAAQ,EAAE,UAAU,EAAE,OAAO,GAAE,UAAe,GAAG,UAAU,GAAG,IAAI,CAI/G;AAED,iGAAiG;AACjG,wBAAgB,UAAU,CAAC,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,GAAG,UAAU,CAM9F;AAED,qFAAqF;AACrF,wBAAgB,aAAa,CAAC,IAAI,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,GAAG,YAAY,CAOlF;AAED,+BAA+B;AAC/B,MAAM,MAAM,aAAa,GAAG,KAAK,GAAG,KAAK,GAAG,OAAO,CAAC;AAEpD,MAAM,WAAW,uBAAuB;IACtC,uEAAuE;IACvE,GAAG,EAAE,MAAM,CAAC;IACZ,sEAAsE;IACtE,KAAK,EAAE,MAAM,CAAC;CACf;AAED,eAAO,MAAM,eAAe,EAAE,uBAAkD,CAAC;AAEjF,0DAA0D;AAC1D,wBAAgB,aAAa,CAAC,KAAK,EAAE,MAAM,EAAE,UAAU,GAAE,uBAAyC,GAAG,aAAa,CAIjH"}

package/dist/react/canvas-hud/viewport.js

@@ -0,0 +1,77 @@
+/**
+ * The camera arithmetic every pan-and-zoom canvas needs (CNV-2, CNV-3, CNV-5).
+ *
+ * Pure — no React, no DOM — so each rule is pinned by a spec rather than by opening an app.
+ * A view maps a WORLD point to the screen as `screen = world × scale + (x, y)`: `x`/`y` are the
+ * screen position of the world origin, which is what a CSS `translate(x, y) scale(scale)` on the
+ * stage means. Every canvas in the fleet already used that convention (family's `Camera`,
+ * patterns' `viewportGestures.ts`, desk's xyflow viewport), which is why it is the one here.
+ */
+export function clampScale(scale, min, max) {
+    return Math.min(max, Math.max(min, scale));
+}
+/**
+ * CNV-2 — zoom to `scale` keeping the screen point `anchor` still: the pointer for a wheel or a
+ * pinch, the middle of the viewport for the ± buttons. The caller clamps `scale` first, because
+ * the floor is the canvas's own business (family floors it at the whole tree).
+ */
+export function zoomAt(view, scale, anchor) {
+    if (!Number.isFinite(scale) || scale <= 0 || view.scale <= 0)
+        return view;
+    const applied = scale / view.scale;
+    return {
+        scale,
+        x: anchor.x - (anchor.x - view.x) * applied,
+        y: anchor.y - (anchor.y - view.y) * applied,
+    };
+}
+/** The zoom factor for one wheel event — exponential, so a trackpad pinch (which arrives as a
+ *  ctrl+wheel stream of small deltas) and a mouse notch feel equally linear. */
+export function wheelZoomFactor(deltaY) {
+    return Math.exp(-deltaY * 0.0015);
+}
+/** The scale at which `bounds` fits the viewport, or `null` while there is nothing to fit
+ *  (an empty extent, or a viewport not measured yet). */
+export function fitScale(bounds, viewport, options = {}) {
+    const { padding = 48, maxScale = 1, minScale = 0.02 } = options;
+    if (bounds.width <= 0 || bounds.height <= 0 || viewport.width <= 0 || viewport.height <= 0)
+        return null;
+    const scale = Math.min((viewport.width - padding * 2) / bounds.width, (viewport.height - padding * 2) / bounds.height);
+    if (!Number.isFinite(scale))
+        return null;
+    return clampScale(scale, minScale, maxScale);
+}
+/** CNV-3 "Fit" — the view that centres `bounds` in the viewport at {@link fitScale}. */
+export function fitView(bounds, viewport, options = {}) {
+    const scale = fitScale(bounds, viewport, options);
+    if (scale === null)
+        return null;
+    return centerView({ x: bounds.x + bounds.width / 2, y: bounds.y + bounds.height / 2 }, viewport, scale);
+}
+/** CNV-3 "Center" — the view that puts the world point `point` in the middle of the viewport. */
+export function centerView(point, viewport, scale) {
+    return {
+        scale,
+        x: viewport.width / 2 - point.x * scale,
+        y: viewport.height / 2 - point.y * scale,
+    };
+}
+/** The part of the world the viewport shows — what a minimap draws as its window. */
+export function visibleBounds(view, viewport) {
+    return {
+        x: -view.x / view.scale,
+        y: -view.y / view.scale,
+        width: viewport.width / view.scale,
+        height: viewport.height / view.scale,
+    };
+}
+export const LEVEL_OF_DETAIL = { mid: 0.3, close: 0.5 };
+/** CNV-5 — which density a canvas draws at this scale. */
+export function levelOfDetail(scale, thresholds = LEVEL_OF_DETAIL) {
+    if (scale >= thresholds.close)
+        return 'close';
+    if (scale >= thresholds.mid)
+        return 'mid';
+    return 'far';
+}
+//# sourceMappingURL=viewport.js.map

package/dist/react/canvas-hud/viewport.js.map

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