@multiplatform.one/node-graph 7.7.2

package/types/nodes/GraphNode.d.ts

@@ -0,0 +1,48 @@
+/**
+ * The Tamagui node body.
+ *
+ * Knobs reach it through the REAL `useResolvedKnobs` — the resolver with its
+ * Preset / Surface / Intent context stack, not the pure functions — which is
+ * what MPO-191 AC-3 asks for. Every style comes from a whole `knobProps.*`
+ * fragment spread (AGENTS.md); nothing here cherry-picks a resolved token.
+ *
+ * Two things this component must NOT do, both from design §7.1:
+ *  - clip. The frame is never `overflow: hidden`, because handles sit at the
+ *    node edge under `translate(±50%)` and a clipping frame eats half the dot
+ *    and most of the 44pt hit region.
+ *  - re-measure the world on a knob flip. `useUpdateNodeInternals` fires for
+ *    ONE node when its own `ports` identity changes — a port added or removed
+ *    changes `handleBounds` with no size change for React Flow's per-node
+ *    ResizeObserver to see. A knob flip DOES change height, the observer does
+ *    catch that (measured, design §5), and firing 200 updates on top of it
+ *    would stack a second forced-layout storm on the observer's.
+ */
+import { type ReactNode } from "react";
+import type { GraphRenderMode } from "./lod";
+import { type GraphNodeMeasure, type GraphNodePort } from "./nodeMeasure";
+export interface GraphNodeProps {
+    /** Node id. React Flow addresses `updateNodeInternals` by it. */
+    readonly id: string;
+    readonly title: string;
+    readonly subtitle?: string;
+    readonly ports?: readonly GraphNodePort[];
+    /** Semantic intent — reaches the resolver, never a colour prop. */
+    readonly intent?: string;
+    readonly selected?: boolean;
+    readonly dragging?: boolean;
+    /** `NodeKindSpec.measure`; falls back to the per-kind default table. */
+    readonly measure?: Partial<GraphNodeMeasure>;
+    /**
+     * "overview" below `overviewZoom` (design §5). Children FADE, they never
+     * unmount, so the box keeps the same height in both modes and React Flow's
+     * ResizeObserver has nothing to chase.
+     */
+    readonly renderMode?: GraphRenderMode;
+    /** true on a touch surface — widens the port pitch to the press floor. */
+    readonly coarsePointer?: boolean;
+    /** Rendered inside each port row. Task 1.9 puts the painted disc here. */
+    readonly renderPort?: (port: GraphNodePort) => ReactNode;
+    readonly children?: ReactNode;
+}
+export declare function GraphNode({ id, title, subtitle, ports, intent, selected, dragging, measure, renderMode, coarsePointer, renderPort, children, }: GraphNodeProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=GraphNode.d.ts.map

package/types/nodes/GraphNode.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GraphNode.d.ts","sourceRoot":"","sources":["../../src/nodes/GraphNode.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;GAkBG;AAEH,OAAO,EAAE,KAAK,SAAS,EAAqB,MAAM,OAAO,CAAC;AAM1D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,OAAO,CAAC;AAC7C,OAAO,EAEL,KAAK,gBAAgB,EACrB,KAAK,aAAa,EAKnB,MAAM,eAAe,CAAC;AAEvB,MAAM,WAAW,cAAc;IAC7B,iEAAiE;IACjE,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,KAAK,CAAC,EAAE,SAAS,aAAa,EAAE,CAAC;IAC1C,mEAAmE;IACnE,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,wEAAwE;IACxE,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,gBAAgB,CAAC,CAAC;IAC7C;;;;OAIG;IACH,QAAQ,CAAC,UAAU,CAAC,EAAE,eAAe,CAAC;IACtC,0EAA0E;IAC1E,QAAQ,CAAC,aAAa,CAAC,EAAE,OAAO,CAAC;IACjC,0EAA0E;IAC1E,QAAQ,CAAC,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,aAAa,KAAK,SAAS,CAAC;IACzD,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;CAC/B;AAmBD,wBAAgB,SAAS,CAAC,EACxB,EAAE,EACF,KAAK,EACL,QAAQ,EACR,KAAK,EACL,MAAM,EACN,QAAgB,EAChB,QAAgB,EAChB,OAAO,EACP,UAAqB,EACrB,aAAqB,EACrB,UAAU,EACV,QAAQ,GACT,EAAE,cAAc,2CAmJhB"}

package/types/nodes/GraphPort.d.ts

@@ -0,0 +1,41 @@
+/**
+ * A port. PAINTED ONLY — this component draws a dot and declares a hit region;
+ * it decides nothing about whether a connection is legal. That is
+ * `validateConnection`'s job (task 1.3) and the puck's (task 3.5).
+ *
+ * Two knob laws it obeys and one it refuses (design §11):
+ *  - size: `honour`. The painted dot is 8 / 10 / 12.
+ *  - borderWidth: `honour`. The dot's ring follows the knob.
+ *  - borderRadius: `IGNORE`. 50% at every stop, `none` included, because a
+ *    square port reads as a resize grip. The circle is the part's identity,
+ *    not its styling.
+ *  - elevation: `ignore`. Ports never cast a shadow.
+ *
+ * The 44pt region is a `::after` pseudo-element in `css/graph.css`, never
+ * element growth — see §7.1 H2 and `handleGeometry.ts`. This component's only
+ * job in that mechanism is to publish the two custom properties the sheet
+ * reads, so the geometry has exactly one source.
+ */
+import type { GraphPortSide } from "./nodeMeasure";
+export interface GraphPortProps {
+    readonly id: string;
+    readonly side: GraphPortSide;
+    readonly direction: "in" | "out";
+    /** Semantic intent — reaches the resolver, never a colour prop. */
+    readonly intent?: string;
+    /**
+     * true on a touch surface. Picks H3's 44 over its fine-pointer value.
+     *
+     * Defaults to `isTouchSurface()` (design 7.1 H3), not to `false`. A port
+     * rendered on a phone with nobody passing the prop was getting a 24 px
+     * target — under the press floor the whole mechanism exists to reach — and
+     * nothing in the type said so. The canvas passes it explicitly; this is the
+     * standalone case.
+     */
+    readonly coarsePointer?: boolean;
+    /** The owning node's port pitch, so H4's crowding cap can bite. */
+    readonly portSpacingPx?: number;
+    readonly isConnectable?: boolean;
+}
+export declare function GraphPort({ id, side, direction, intent, coarsePointer, portSpacingPx, isConnectable, }: GraphPortProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=GraphPort.d.ts.map

package/types/nodes/GraphPort.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GraphPort.d.ts","sourceRoot":"","sources":["../../src/nodes/GraphPort.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AAMH,OAAO,KAAK,EAAqB,aAAa,EAAE,MAAM,eAAe,CAAC;AAStE,MAAM,WAAW,cAAc;IAC7B,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,IAAI,EAAE,aAAa,CAAC;IAC7B,QAAQ,CAAC,SAAS,EAAE,IAAI,GAAG,KAAK,CAAC;IACjC,mEAAmE;IACnE,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAC;IACzB;;;;;;;;OAQG;IACH,QAAQ,CAAC,aAAa,CAAC,EAAE,OAAO,CAAC;IACjC,mEAAmE;IACnE,QAAQ,CAAC,aAAa,CAAC,EAAE,MAAM,CAAC;IAChC,QAAQ,CAAC,aAAa,CAAC,EAAE,OAAO,CAAC;CAClC;AAED,wBAAgB,SAAS,CAAC,EACxB,EAAE,EACF,IAAI,EACJ,SAAS,EACT,MAAM,EACN,aAAgC,EAChC,aAAa,EACb,aAAoB,GACrB,EAAE,cAAc,2CAuDhB"}

package/types/nodes/handleGeometry.d.ts

@@ -0,0 +1,183 @@
+/**
+ * Port geometry — pure. The painted dot and the region you can actually hit
+ * are two different numbers, and design §7.1 is emphatic that conflating them
+ * is the commonest false FAIL in a knob sweep.
+ *
+ * The laws, verbatim from §7.1:
+ *
+ *  H1. The painted dot is 8 / 10 / 12 by the size knob and NEVER grows to 44.
+ *      A 44 px painted dot is a different component.
+ *  H2. The hit region is a pseudo-element, never element growth, because
+ *      `getEdgePosition` reads the handle box's outer edge (`center` defaults
+ *      to false) — growing 8 to 44 would move every rendered edge endpoint 18
+ *      flow units outward on exactly the sides an LR graph uses.
+ *  H3. 44 on coarse pointers, `max(painted, 24)` on fine. A 44 px invisible
+ *      disc around every handle on a dense mouse canvas steals clicks from the
+ *      node body.
+ *  H4. Two ports closer than the hit diameter would have overlapping discs and
+ *      the wrong one would win, so the hit caps at `min(44, portSpacing)`.
+ *  H7. The region is 44 SCREEN px at every zoom, not 44 px of flow space.
+ *      Added in milestone 6, and it is the only law here that was measured on a
+ *      phone before it was written down. Every element a node owns lives inside
+ *      `.react-flow__viewport`, whose transform carries the zoom, so a region
+ *      declared 44 px renders 44 x zoom. On the iPhone 16e at zoom 0.377 that
+ *      is 16.6 pt wide — a half-width of 8.3 pt — and a tap 18 pt off the
+ *      painted centre panned the canvas instead of grabbing the port. Same miss
+ *      on emulator-5592 at zoom 0.397. So the inset carries a 1/zoom term and
+ *      the sheet reads the live zoom from `--mpo-graph-zoom`.
+ *
+ * H2 and H7 are the CSS in `css/graph.css`, not numbers; the rest are here.
+ */
+import { type GraphNodeSizeKnob, type GraphPortSide } from "./nodeMeasure";
+/** H1. Painted diameter per size stop. Never 44 at any stop, by construction. */
+export declare const paintedPortSizePx: Record<GraphNodeSizeKnob, number>;
+/**
+ * H3's fine-pointer floor. Below this a mouse target is a coin toss; above 44
+ * it would start eating the node body, which is why fine and coarse differ at
+ * all.
+ */
+export declare const FINE_PORT_HIT_MIN = 24;
+export declare function paintedPortSize(size: GraphNodeSizeKnob): number;
+/**
+ * H3 with H4's cap applied.
+ *
+ * The floor at the painted size is geometric, not a taste call: the hit region
+ * is a pseudo-element inset OUTWARD from the dot, so a hit smaller than the
+ * dot would inset inward and shrink the target below what the user can see.
+ */
+export declare function portHitSize(opts: {
+    readonly size: GraphNodeSizeKnob;
+    readonly coarsePointer: boolean;
+    /** The node's port pitch. Defaults to the pitch for this pointer kind. */
+    readonly portSpacingPx?: number;
+}): number;
+/**
+ * The `inset` the `::after` region carries, in px.
+ *
+ * NEGATIVE when the hit is larger than the dot, which is the whole point: the
+ * pseudo-element grows outward from the painted disc without touching the
+ * handle's own box, so `handleBounds` — which reads `getBoundingClientRect()`
+ * and `getDimensions()` — sees nothing change and every edge endpoint stays
+ * where the 8 px dot put it.
+ *
+ * `borderWidthPx` is not decoration. An absolutely positioned pseudo-element
+ * insets from its parent's PADDING box, and the dot is `box-sizing:
+ * border-box` with a knob-driven ring, so the padding box is `size - 2 ×
+ * border`. Measured in Chrome before this term existed: a 44 asked for
+ * rendered as 42. A press floor that lands two pixels under the floor is not
+ * a floor, so the ring is added back here rather than rounded away.
+ */
+export declare function portRegionInset(opts: {
+    readonly size: GraphNodeSizeKnob;
+    readonly coarsePointer: boolean;
+    readonly portSpacingPx?: number;
+    /** The dot's ring, from `knobProps.surface.borderWidth`. */
+    readonly borderWidthPx?: number;
+}): number;
+/**
+ * H7. The same inset with the viewport zoom divided back out.
+ *
+ * The region has to be `hit` SCREEN px, and it is painted inside a box the
+ * viewport transform scales by `zoom`. Local width is therefore `hit / zoom`,
+ * and the inset that produces it is `(painted - hit / zoom) / 2`, plus the ring
+ * term H2 already carries. At zoom 1 this IS `portRegionInset`, which is what
+ * `handleGeometry.spec.ts` asserts, so the new term cannot silently change the
+ * number the desktop canvas has always used.
+ *
+ * The floor on `zoom` is not defensive tidiness: dividing by zero in CSS is
+ * silent and yields an infinite region that swallows the whole canvas. React
+ * Flow never emits a zoom of 0, so the guard costs nothing and removes the one
+ * way this arithmetic can produce something catastrophic.
+ *
+ * `css/graph.css` computes the identical expression from
+ * `--mpo-graph-handle-size`, `--mpo-graph-handle-hit`,
+ * `--mpo-graph-handle-border` and `--mpo-graph-zoom`. `GraphPort.spec.tsx`
+ * reads the rule text and checks the two agree, because jsdom cannot resolve a
+ * pseudo-element and a spec written against `getComputedStyle(el, "::after")`
+ * would assert nothing at all.
+ */
+export declare function portRegionInsetAtZoom(opts: {
+    readonly size: GraphNodeSizeKnob;
+    readonly coarsePointer: boolean;
+    readonly portSpacingPx?: number;
+    readonly borderWidthPx?: number;
+    /** The live viewport zoom. 1 outside a canvas. */
+    readonly zoom: number;
+}): number;
+/**
+ * What the region ACTUALLY measures on screen, in px, at a given zoom.
+ *
+ * The number MPO-212's 3.4 criterion is about, and the one nothing computed
+ * before milestone 6. With the 1/zoom term this is `portHitSize(opts)` at every
+ * zoom, which is the whole claim — so a spec asserting it at 0.4 and at 2 is
+ * asserting the fix rather than the arithmetic that implements it.
+ */
+export declare function portRegionScreenSize(opts: {
+    readonly size: GraphNodeSizeKnob;
+    readonly coarsePointer: boolean;
+    readonly portSpacingPx?: number;
+    readonly borderWidthPx?: number;
+    readonly zoom: number;
+}): number;
+/**
+ * H5. `connectionRadius` matches the hit diameter, so the magnetic drop radius
+ * is the visible affordance rather than React Flow's 20 px default. Wired into
+ * the canvas in task 1.11; the number lives here with its siblings.
+ */
+export declare function portConnectionRadius(opts: {
+    readonly size: GraphNodeSizeKnob;
+    readonly coarsePointer: boolean;
+    readonly portSpacingPx?: number;
+}): number;
+/** A rectangle in the node's own coordinate space, top-left anchored. */
+export interface PortRect {
+    readonly x: number;
+    readonly y: number;
+    readonly width: number;
+    readonly height: number;
+}
+/**
+ * The two rectangles a port occupies, which are NOT the same rectangle.
+ *
+ * `box` is what React Flow measures. `handleBounds` is built from
+ * `getBoundingClientRect()` and `getDimensions()` (`dom.ts:82-91`), so `box` is
+ * the handle ELEMENT — and `getHandlePosition` turns it into the point every
+ * edge is drawn to.
+ *
+ * `region` is what a finger lands on: the `::after` pseudo-element. A
+ * pseudo-element is not in the box tree its parent reports, so it moves
+ * `region` without moving `box`.
+ *
+ * Keeping them apart in the TYPE is the mechanism H2 describes. Element growth
+ * would collapse them into one rectangle, and every edge endpoint on an LR
+ * graph would slide outward by half the difference — 18 units at 8 → 44.
+ */
+export interface PortGeometry {
+    /** What `handleBounds` measures. Painted size only; `hit` never enters. */
+    readonly box: PortRect;
+    /** What the pointer hits — the `::after` region. Grows with `hit`. */
+    readonly region: PortRect;
+}
+/**
+ * Where a port sits on its node, and how big each of its two rectangles is.
+ *
+ * `painted` and `hit` are separate parameters ON PURPOSE, so the endpoint law
+ * is falsifiable: a caller can ask for a 44 px hit and read back a box that did
+ * not move. A single-size signature could not express the broken mechanism, and
+ * a test that cannot express the bug cannot catch it.
+ *
+ * React Flow's own sheet centres a handle on the node edge — `left: 0` /
+ * `right: 0` with `translate(∓50%)` and `top: 50%` with `translateY(-50%)`
+ * (style.css `.react-flow__handle-left` and friends) — so both rectangles are
+ * concentric on that edge point rather than tangent to it.
+ */
+export declare function portGeometry(opts: {
+    readonly painted: number;
+    readonly hit: number;
+    readonly side: GraphPortSide;
+    readonly nodeWidth: number;
+    readonly nodeHeight: number;
+    /** Distance along the port's edge, from the node's top-left corner. */
+    readonly offset: number;
+}): PortGeometry;
+//# sourceMappingURL=handleGeometry.d.ts.map

package/types/nodes/handleGeometry.d.ts.map

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

package/types/nodes/lod.d.ts

@@ -0,0 +1,55 @@
+/**
+ * Level of detail, and the one invariant that makes it safe (design §5).
+ *
+ * Pure. No React, no DOM, no `@xyflow` — the whole decision is one comparison,
+ * and putting it here rather than inline in `GraphNodeHost` is what lets the
+ * crossing be swept over a grid in vitest instead of eyeballed in a browser.
+ *
+ * The invariant this module exists to protect is NOT about paint. React Flow 12
+ * installs a per-node `ResizeObserver`, so a height-changing LOD would
+ * re-measure every node on every zoom tick and move every attached edge
+ * endpoint with it. That is why `renderMode` fades children and never unmounts
+ * them, and why `overviewNode.tsx` is measured from the same recipe the detail
+ * body uses rather than being "a small box".
+ */
+/**
+ * On `GraphNodeRenderProps` from v1 (design §5). Naming it here rather than
+ * inline in the schema is what lets a consumer's own node body take the union
+ * without importing the whole model.
+ */
+export type GraphRenderMode = "detail" | "overview";
+/**
+ * The default crossing. 0.35 is design §5's number, and it lives here so
+ * `graphCanvasDefaults`, `GraphHostValue` and every spec read ONE constant
+ * instead of three copies that can drift apart by a decimal.
+ */
+export declare const defaultOverviewZoom = 0.35;
+/**
+ * Which mode a node draws in at this zoom.
+ *
+ * The comparison is `zoom < overviewZoom`, so the threshold itself is DETAIL.
+ * That is a real choice and not an off-by-one: `overviewZoom` is the zoom at
+ * which detail is still legible, and a canvas parked exactly on its own
+ * default should show the graph, not the summary.
+ *
+ * Monotone by construction, which is the whole of "crosses at `overviewZoom`
+ * and nowhere else": one comparison cannot produce two transitions.
+ *
+ * A non-finite zoom resolves to `detail`. It only reaches here from a store
+ * mid-initialisation or a consumer's own transform, and a graph that renders
+ * its full body is a graph a user can still work with — where an overview of
+ * unknown zoom is a screen of grey rectangles with no way back.
+ */
+export declare function lodForZoom(zoom: number, overviewZoom?: number): GraphRenderMode;
+/** True when children should be faded out. Spelled once so no caller re-derives it. */
+export declare function isOverview(mode: GraphRenderMode): boolean;
+/**
+ * The opacity a node's non-essential children carry in each mode.
+ *
+ * A NUMBER, not a boolean the caller turns into a number, because zero is the
+ * load-bearing value: children at `opacity: 0` are still laid out, still
+ * measured, and still hold the box open. `display: none` or an unmount would
+ * collapse the box and hand React Flow's observer a new height to chase.
+ */
+export declare function detailOpacity(mode: GraphRenderMode): number;
+//# sourceMappingURL=lod.d.ts.map

package/types/nodes/lod.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"lod.d.ts","sourceRoot":"","sources":["../../src/nodes/lod.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AAEH;;;;GAIG;AACH,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG,UAAU,CAAC;AAEpD;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,OAAO,CAAC;AAExC;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,UAAU,CACxB,IAAI,EAAE,MAAM,EACZ,YAAY,GAAE,MAA4B,GACzC,eAAe,CAGjB;AAED,uFAAuF;AACvF,wBAAgB,UAAU,CAAC,IAAI,EAAE,eAAe,GAAG,OAAO,CAEzD;AAED;;;;;;;GAOG;AACH,wBAAgB,aAAa,CAAC,IAAI,EAAE,eAAe,GAAG,MAAM,CAE3D"}

package/types/nodes/nodeMeasure.d.ts

@@ -0,0 +1,146 @@
+/**
+ * The GraphNode measure recipe — pure. No React, no DOM, no `@xyflow`.
+ *
+ * A node is a CONTAINER, not a control (design §11 Size). Everything here
+ * exists to keep it off the control-height ladder: the width rides a per-kind
+ * table, the radius caps at the node's own padding, and the minimum height is
+ * floored by how many ports have to fit down one edge.
+ *
+ * Pure on purpose. `graphNode.spec.ts` runs it in Node with no renderer, so
+ * the laws are falsifiable before a pixel exists.
+ */
+import { type Knobs } from "@multiplatform.one/theme";
+export type GraphNodeSizeKnob = Knobs["size"];
+export type GraphNodeSpaceKnob = Knobs["space"];
+export type GraphNodeRadiusKnob = Knobs["borderRadius"];
+export type GraphPortSide = "left" | "right" | "top" | "bottom";
+/**
+ * The structural subset of `PortSpec` this module needs to measure a node.
+ *
+ * TODO(task 1.3): replace with `PortSpec` from `../model` once the schema
+ * lands. It is declared structurally compatible on purpose — `PortSpec` adds
+ * `index`, `dataType` and `arity`, none of which change a measurement — so the
+ * swap is an import change, not a rewrite.
+ */
+export interface GraphNodePort {
+    readonly id: string;
+    readonly side: GraphPortSide;
+    readonly direction: "in" | "out";
+    readonly label?: string;
+}
+/** `NodeKindSpec.measure` (design §4.3): width fixed per kind, height knob-driven. */
+export interface GraphNodeMeasure {
+    readonly width: number;
+    readonly minHeight: number;
+}
+/**
+ * The default per-kind measure table (design §11 Size: "default 172 / 190 / 216").
+ *
+ * A kind that declares its own `measure` overrides this entirely; the table is
+ * what an undeclared kind falls back to. `minHeight` anchors on design §5's
+ * measured node heights (62 px compact, 72 px default) with `large` one step
+ * above, rather than a number invented here.
+ */
+export declare const defaultNodeMeasure: Record<GraphNodeSizeKnob, GraphNodeMeasure>;
+/**
+ * Container padding in px per `space` stop.
+ *
+ * Mirrors `panelPaddingPxMap` in `resolveKnobs.ts`, which is private to that
+ * module — the resolver mirrors the same numbers for the same reason (it stays
+ * pure, so it cannot read live tokens). `graphNode.spec.ts` pins this mirror
+ * against `capContainerRadius(..., "full")`, which returns the padding px
+ * itself, so a change in the resolver fails the spec here instead of drifting.
+ */
+export declare const nodePanelPaddingPx: Record<GraphNodeSpaceKnob, number>;
+/**
+ * Vertical pitch between two ports on the same node edge.
+ *
+ * Coarse pointers get the press floor itself (design §7.1 H4: two ports closer
+ * than the hit diameter would have overlapping discs and the wrong one would
+ * win). Fine pointers get 24, which is H3's fine-pointer hit diameter and is
+ * already above every painted stop (8 / 10 / 12), so the pitch never has to
+ * consult the painted ladder — that is what keeps this module independent of
+ * `handleGeometry.ts` rather than circular with it.
+ */
+export declare const FINE_PORT_PITCH = 24;
+export declare function portSpacing(opts: {
+    readonly coarsePointer: boolean;
+}): number;
+/**
+ * §11 Size, GraphNode frame: `remap` to `NodeKindSpec.measure.width`.
+ *
+ * The size knob reaches the width only through the per-kind table. It never
+ * reaches the control-height recipe (`knobProps.control.height`), because a
+ * node is a container and a container that steps with a control ladder is a
+ * control wearing a frame.
+ */
+export declare function graphNodeWidth(opts: {
+    readonly size: GraphNodeSizeKnob;
+    readonly measure?: Partial<GraphNodeMeasure>;
+}): number;
+/**
+ * How many ports stack down the tallest vertical edge.
+ *
+ * Height crowding is per EDGE, not per node: `left` and `right` ports stack
+ * vertically and can collide with their own side's neighbours, never with the
+ * opposite side's. `top` / `bottom` ports stack horizontally and constrain
+ * width, so they do not enter a height floor at all.
+ */
+export declare function verticalPortCrowd(ports: readonly GraphNodePort[]): number;
+/**
+ * §7.1 H4, the floor half: a node is tall enough for every port on its
+ * busiest edge to be a real target, instead of ports silently stealing hits
+ * from each other.
+ */
+export declare function graphNodeMinHeight(opts: {
+    readonly size: GraphNodeSizeKnob;
+    readonly ports: readonly GraphNodePort[];
+    readonly portSpacingPx: number;
+    readonly measure?: Partial<GraphNodeMeasure>;
+}): number;
+/**
+ * §11 Radius, GraphNode frame: CONTAINER-CAP. The Tamagui value to paint —
+ * the radius token while it fits inside the node's own padding, the padding px
+ * once it would not.
+ */
+export declare function graphNodeRadius(knobs: {
+    readonly borderRadius: GraphNodeRadiusKnob;
+    readonly space: GraphNodeSpaceKnob;
+}): string | number;
+/**
+ * Radius TOKEN → px.
+ *
+ * Mirrors `borderRadiusMap` / `radiusPxMap` in `resolveKnobs.ts`, both private
+ * to that module. Needed because `capContainerRadius` returns either a token
+ * (`"$4"`) or a px number, and a rendered node has to report ONE number.
+ * `graphNode.spec.ts` pins the whole map against the doctrine table at every
+ * stop and space, so a token that stops meaning what it says fails there.
+ */
+export declare const nodeRadiusTokenPx: Readonly<Record<string, number>>;
+/**
+ * px for whatever `capContainerRadius` resolved to. A number is already the
+ * capped px; a token goes through the mirror above.
+ */
+export declare function containerRadiusPx(value: string | number): number;
+/**
+ * The same radius in px, resolved through the DG-RAD doctrine table rather
+ * than the resolver.
+ *
+ * Two independent implementations of one law: `graphNodeRadius` goes through
+ * `capContainerRadius` (resolver), this goes through `resolveRadiusForPart`
+ * (doctrine). `graphNode.spec.ts` asserts they agree at every stop, so a
+ * doctrine/resolver drift is a failing test rather than a corner that quietly
+ * clips a child.
+ */
+export declare function graphNodeRadiusPx(knobs: {
+    readonly borderRadius: GraphNodeRadiusKnob;
+    readonly space: GraphNodeSpaceKnob;
+}): number;
+/** The complete measure a node is seeded with BEFORE first paint (design §5). */
+export declare function graphNodeMeasure(opts: {
+    readonly size: GraphNodeSizeKnob;
+    readonly ports: readonly GraphNodePort[];
+    readonly portSpacingPx: number;
+    readonly measure?: Partial<GraphNodeMeasure>;
+}): GraphNodeMeasure;
+//# sourceMappingURL=nodeMeasure.d.ts.map

package/types/nodes/nodeMeasure.d.ts.map

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

package/types/nodes/overviewNode.d.ts

@@ -0,0 +1,34 @@
+/**
+ * The overview body: one plain box with the resolved background (design §5).
+ *
+ * At 500 nodes and zoom 0.2, a Tamagui body per node is 500 knob resolutions,
+ * 500 subtrees and 500 observer callbacks to paint something the size of a
+ * postage stamp. This is what a consumer swaps in instead, and it is also what
+ * the merged single-path edge layer will sit behind in v1.1.
+ *
+ * The load-bearing part is not the div, it is the MEASURE. Width and minimum
+ * height come from `nodeMeasure.ts` — the same recipe `GraphNode` uses, given
+ * the same knobs and the same ports — so swapping the body cannot change the
+ * node's box, and React Flow's per-node `ResizeObserver` has nothing to report.
+ * A "small grey rectangle" here would move every edge endpoint on the canvas
+ * the moment a user zoomed out, which is the failure design §5 is written
+ * against.
+ *
+ * `lod.spec.tsx` asserts the box against `GraphNode`'s rather than against a
+ * number, so the two cannot drift.
+ */
+import type { GraphNodeMeasure, GraphNodePort } from "./nodeMeasure";
+export interface OverviewNodeProps {
+    readonly id: string;
+    /** Same ports the detail body would render. They set the height floor. */
+    readonly ports?: readonly GraphNodePort[];
+    /** Semantic intent — reaches the resolver, never a colour prop. */
+    readonly intent?: string;
+    readonly selected?: boolean;
+    /** `NodeKindSpec.measure`; falls back to the per-kind default table. */
+    readonly measure?: Partial<GraphNodeMeasure>;
+    /** true on a touch surface — widens the port pitch, raising the floor. */
+    readonly coarsePointer?: boolean;
+}
+export declare function OverviewNode({ id, ports, intent, selected, measure, coarsePointer, }: OverviewNodeProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=overviewNode.d.ts.map

package/types/nodes/overviewNode.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"overviewNode.d.ts","sourceRoot":"","sources":["../../src/nodes/overviewNode.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;GAkBG;AAIH,OAAO,KAAK,EAAE,gBAAgB,EAAE,aAAa,EAAqB,MAAM,eAAe,CAAC;AAGxF,MAAM,WAAW,iBAAiB;IAChC,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,0EAA0E;IAC1E,QAAQ,CAAC,KAAK,CAAC,EAAE,SAAS,aAAa,EAAE,CAAC;IAC1C,mEAAmE;IACnE,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,wEAAwE;IACxE,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,gBAAgB,CAAC,CAAC;IAC7C,0EAA0E;IAC1E,QAAQ,CAAC,aAAa,CAAC,EAAE,OAAO,CAAC;CAClC;AAED,wBAAgB,YAAY,CAAC,EAC3B,EAAE,EACF,KAAK,EACL,MAAM,EACN,QAAgB,EAChB,OAAO,EACP,aAAqB,GACtB,EAAE,iBAAiB,2CAyBnB"}

package/types/react-flow/ConnectionPuck.d.ts

@@ -0,0 +1,62 @@
+/**
+ * The connection puck (design §7.4, task 3.5).
+ *
+ * The native spike named this the hardest touch item, verbatim: the finger
+ * occludes the port it is aiming at. So during a connection drag ONE overlay,
+ * pinned to the top of the canvas, says what the drag is currently over. One
+ * div, updated on move, no per-node cost.
+ *
+ * COUNTER-SCALED, and the mechanism is placement rather than arithmetic. React
+ * Flow renders `<ReactFlow>`'s children as siblings of `.react-flow__viewport`,
+ * not inside it, so nothing here rides the pan/zoom matrix and the puck is the
+ * same physical size at zoom 0.25 and at zoom 2. Applying a `scale(1/zoom)` on
+ * top of that would counter a transform that was never applied and shrink the
+ * puck as the user zoomed IN. `ConnectionPuck.spec.tsx` measures the rendered
+ * size at both extremes rather than trusting either story.
+ *
+ * The candidate it names is filtered through `legalTargets`. `connectionRadius`
+ * is the 44 px hit diameter (task 3.4 H5), so React Flow will snap the drag
+ * onto whatever handle is nearest, including one the schema refuses. Naming a
+ * target the drop will then reject is worse than naming nothing.
+ */
+import type { EdgeKindDefs, GraphDocument, GraphSchema, NodeKindDefs, PortRef } from "../model/index";
+export interface ConnectionPuckProps<N extends NodeKindDefs, E extends EdgeKindDefs> {
+    readonly document: GraphDocument<N, E>;
+    readonly schema: GraphSchema<N, E>;
+    /**
+     * Names a node for the puck. Defaults to the node id, which is the only name
+     * the MODEL has: a node's human title lives in the consumer's own `render`,
+     * and this package cannot reach into it.
+     */
+    readonly nodeLabel?: (nodeId: string) => string | undefined;
+    /** Semantic intent, reaches the resolver, never a colour prop. */
+    readonly intent?: string;
+}
+export interface ConnectionPuckLabel {
+    /** What the puck says. */
+    readonly text: string;
+    /** Whether a LEGAL candidate is under the pointer right now. */
+    readonly legal: boolean;
+    /** `node:port` of that candidate, or `""`. What the device screenshot reads. */
+    readonly target: string;
+}
+/**
+ * What the puck should say, as a pure function.
+ *
+ * Split out of the component because everything interesting here is a
+ * DECISION — is this candidate legal, and if not what is still worth saying —
+ * and a decision asserted through a rendered DOM is a decision asserted
+ * through three layers of Tamagui. The component keeps only the two store
+ * reads.
+ */
+export declare function connectionPuckLabel<N extends NodeKindDefs, E extends EdgeKindDefs>(opts: {
+    readonly document: GraphDocument<N, E>;
+    readonly schema: GraphSchema<N, E>;
+    /** null when no connection is in progress. */
+    readonly source: PortRef | null;
+    /** null when the drag is over open canvas. */
+    readonly candidate: PortRef | null;
+    readonly nodeLabel?: (nodeId: string) => string | undefined;
+}): ConnectionPuckLabel | null;
+export declare function ConnectionPuck<N extends NodeKindDefs, E extends EdgeKindDefs>({ document, schema, nodeLabel, intent, }: ConnectionPuckProps<N, E>): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=ConnectionPuck.d.ts.map

package/types/react-flow/ConnectionPuck.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConnectionPuck.d.ts","sourceRoot":"","sources":["../../src/react-flow/ConnectionPuck.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;GAoBG;AAKH,OAAO,KAAK,EACV,YAAY,EACZ,aAAa,EACb,WAAW,EACX,YAAY,EACZ,OAAO,EAER,MAAM,gBAAgB,CAAC;AAIxB,MAAM,WAAW,mBAAmB,CAAC,CAAC,SAAS,YAAY,EAAE,CAAC,SAAS,YAAY;IACjF,QAAQ,CAAC,QAAQ,EAAE,aAAa,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IACvC,QAAQ,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IACnC;;;;OAIG;IACH,QAAQ,CAAC,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAC;IAC5D,kEAAkE;IAClE,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAC;CAC1B;AAoBD,MAAM,WAAW,mBAAmB;IAClC,0BAA0B;IAC1B,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,gEAAgE;IAChE,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAC;IACxB,gFAAgF;IAChF,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;CACzB;AAED;;;;;;;;GAQG;AACH,wBAAgB,mBAAmB,CAAC,CAAC,SAAS,YAAY,EAAE,CAAC,SAAS,YAAY,EAAE,IAAI,EAAE;IACxF,QAAQ,CAAC,QAAQ,EAAE,aAAa,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IACvC,QAAQ,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IACnC,8CAA8C;IAC9C,QAAQ,CAAC,MAAM,EAAE,OAAO,GAAG,IAAI,CAAC;IAChC,8CAA8C;IAC9C,QAAQ,CAAC,SAAS,EAAE,OAAO,GAAG,IAAI,CAAC;IACnC,QAAQ,CAAC,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAC;CAC7D,GAAG,mBAAmB,GAAG,IAAI,CAgB7B;AAED,wBAAgB,cAAc,CAAC,CAAC,SAAS,YAAY,EAAE,CAAC,SAAS,YAAY,EAAE,EAC7E,QAAQ,EACR,MAAM,EACN,SAAS,EACT,MAAM,GACP,EAAE,mBAAmB,CAAC,CAAC,EAAE,CAAC,CAAC,kDA0D3B"}

package/types/react-flow/GraphActions.d.ts

@@ -0,0 +1,45 @@
+/**
+ * The canvas's own actions, published to whatever a consumer renders inside it.
+ *
+ * `NodeGraphWeb` mounts the controller; a toolbar, a Tidy button or an Undo
+ * button is a `children` of the canvas, which is BELOW that. Without a channel
+ * the only way to reach `relayout()` would be for every consumer to call
+ * `useGraphController` themselves and mount `ReactFlow` by hand, which is
+ * exactly the composition the package exists to do once.
+ *
+ * A context rather than a ref prop: `canUndo`, `layoutPending` and
+ * `layoutRunner` all change, and a button that reads them has to re-render
+ * when they do. A ref would hand out stale booleans.
+ *
+ * Deliberately NOT merged into `GraphHostProvider`. That context is read by
+ * every node body on every render at 200 nodes; putting `layoutPending` in it
+ * would re-render the whole graph each time a tidy starts and finishes.
+ */
+import type { ReactNode } from "react";
+import type { LayoutRunnerKind } from "../diagnostics/types";
+import type { LayoutResult } from "../layout/types";
+import type { GraphRelayoutOptions } from "./useGraphController";
+export interface GraphActions {
+    /** Tidy. ONE undoable command, design §8. */
+    readonly relayout: (options?: GraphRelayoutOptions) => Promise<LayoutResult | null>;
+    readonly undo: () => void;
+    readonly redo: () => void;
+    readonly canUndo: boolean;
+    readonly canRedo: boolean;
+    /** `none` until the first relayout has resolved a runner. */
+    readonly layoutRunner: LayoutRunnerKind;
+    readonly lastLayoutMs: number | null;
+    readonly layoutPending: boolean;
+    readonly nodeCount: number;
+}
+export declare function GraphActionsProvider({ value, children, }: {
+    readonly value: GraphActions;
+    readonly children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+/**
+ * Throws outside the canvas, on purpose. A silent `null` here would surface as
+ * a Tidy button that does nothing, which is the hardest kind of bug to see in
+ * a story.
+ */
+export declare function useGraphActions(): GraphActions;
+//# sourceMappingURL=GraphActions.d.ts.map