@multiplatform.one/node-graph 7.7.2

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

@@ -0,0 +1 @@
+{"version":3,"file":"GraphActions.d.ts","sourceRoot":"","sources":["../../src/react-flow/GraphActions.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AAGH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAC7D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AACpD,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAEjE,MAAM,WAAW,YAAY;IAC3B,6CAA6C;IAC7C,QAAQ,CAAC,QAAQ,EAAE,CAAC,OAAO,CAAC,EAAE,oBAAoB,KAAK,OAAO,CAAC,YAAY,GAAG,IAAI,CAAC,CAAC;IACpF,QAAQ,CAAC,IAAI,EAAE,MAAM,IAAI,CAAC;IAC1B,QAAQ,CAAC,IAAI,EAAE,MAAM,IAAI,CAAC;IAC1B,QAAQ,CAAC,OAAO,EAAE,OAAO,CAAC;IAC1B,QAAQ,CAAC,OAAO,EAAE,OAAO,CAAC;IAC1B,6DAA6D;IAC7D,QAAQ,CAAC,YAAY,EAAE,gBAAgB,CAAC;IACxC,QAAQ,CAAC,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;IACrC,QAAQ,CAAC,aAAa,EAAE,OAAO,CAAC;IAChC,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAC;CAC5B;AAID,wBAAgB,oBAAoB,CAAC,EACnC,KAAK,EACL,QAAQ,GACT,EAAE;IACD,QAAQ,CAAC,KAAK,EAAE,YAAY,CAAC;IAC7B,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAC;CAC9B,2CAEA;AAED;;;;GAIG;AACH,wBAAgB,eAAe,IAAI,YAAY,CAQ9C"}

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

@@ -0,0 +1,45 @@
+/**
+ * The one place the imperative handle is IMPLEMENTED, for both realms.
+ *
+ * Milestone 6's rule (design §9.1): on native a consumer cannot put React
+ * children inside the canvas, so a control is either a native SIBLING driving
+ * the canvas through the handle, or it is rendered inside the DOM bundle from
+ * serializable options. That makes the handle load-bearing rather than
+ * decorative, and a handle implemented twice — once for the WebView and once
+ * for the web — is two implementations that drift. `NodeGraphWeb` mounts this
+ * and publishes the result through `graphRef`; `NodeGraphDomInner` mounts the
+ * same component and lets the shell forward it across the bridge.
+ *
+ * It is a CHILD of `ReactFlow` because `useReactFlow()` throws outside the
+ * provider the canvas mounts itself, and a child of `GraphActionsProvider`
+ * because `relayout` / `undo` / `redo` live on the controller. It renders
+ * `null`: nothing here paints.
+ *
+ * THE SAMPLER LIVES HERE TOO, and that is the milestone-6 change that unblocks
+ * every device frame number. `Perf200` used to own it, as a CHILD of
+ * `<NodeGraph>` — which native drops — so `window.__mpoPerf200` appeared zero
+ * times in the emitted www.bundle and no device run was possible at all. The
+ * sampler has to run in the realm that PAINTS: the host RN view's frame clock
+ * keeps ticking while the WebView is stalled, so it measures the wrong thing by
+ * construction.
+ */
+import type { GraphEventWire } from "../dom/wire";
+import type { GraphCommandSlot } from "./graphHandle";
+export interface GraphCommandBridgeProps {
+    /** Filled once React Flow is reachable, emptied on unmount. */
+    readonly commands: GraphCommandSlot;
+    /** The single channel. `onEvent` on the DOM side; a story collector on web. */
+    readonly emit: (event: GraphEventWire) => void;
+    /** `react-flow-dom` or `react-flow-web`. Recorded on every perf report. */
+    readonly host: string;
+    /** Whether `onlyRenderVisibleElements` is on, recorded on every perf report. */
+    readonly culling: boolean;
+    /** The canvas root, so two canvases on one page do not measure each other. */
+    readonly rootRef: {
+        current: HTMLElement | null;
+    };
+    /** The DOM realm stamps its boot record here. Web passes nothing. */
+    readonly onMounted?: () => void;
+}
+export declare function GraphCommandBridge({ commands, culling, emit, host, onMounted, rootRef, }: GraphCommandBridgeProps): null;
+//# sourceMappingURL=GraphCommandBridge.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"GraphCommandBridge.d.ts","sourceRoot":"","sources":["../../src/react-flow/GraphCommandBridge.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAUH,OAAO,KAAK,EAAE,cAAc,EAAkB,MAAM,aAAa,CAAC;AAClE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAStD,MAAM,WAAW,uBAAuB;IACtC,+DAA+D;IAC/D,QAAQ,CAAC,QAAQ,EAAE,gBAAgB,CAAC;IACpC,+EAA+E;IAC/E,QAAQ,CAAC,IAAI,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,IAAI,CAAC;IAC/C,2EAA2E;IAC3E,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,gFAAgF;IAChF,QAAQ,CAAC,OAAO,EAAE,OAAO,CAAC;IAC1B,8EAA8E;IAC9E,QAAQ,CAAC,OAAO,EAAE;QAAE,OAAO,EAAE,WAAW,GAAG,IAAI,CAAA;KAAE,CAAC;IAClD,qEAAqE;IACrE,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACjC;AAkDD,wBAAgB,kBAAkB,CAAC,EACjC,QAAQ,EACR,OAAO,EACP,IAAI,EACJ,IAAI,EACJ,SAAS,EACT,OAAO,GACR,EAAE,uBAAuB,QA6KzB"}

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

@@ -0,0 +1,32 @@
+/**
+ * The ONE registered React Flow node type.
+ *
+ * Same shape as the edge layer (design §4.4): one registration, switching on
+ * the model kind internally, so the node component count stays at one however
+ * many kinds a schema declares. It looks the kind up in the schema and renders
+ * that kind's own `render` — the consumer's Tamagui body — which is what keeps
+ * nodes Tamagui rather than a fixed shape this package chose.
+ *
+ * `renderMode` is computed HERE, from the live zoom, and handed down as a prop
+ * (design §5). Every mode keeps the same box: below `overviewZoom` children
+ * fade, they do not unmount, because React Flow 12 installs a per-node
+ * `ResizeObserver` and a height-changing LOD would re-measure every node on
+ * every zoom tick and move every edge endpoint with it.
+ */
+import type { EdgeKindDefs, GraphSchema, NodeKindDefs } from "../model/index";
+import type { NodeProps } from "./xy";
+export interface GraphHostValue {
+    readonly schema: GraphSchema<NodeKindDefs, EdgeKindDefs>;
+    /** Below this zoom the graph draws in `overview` mode (design §5). */
+    readonly overviewZoom: number;
+    /** Touch surface: fields are display-only and taps route to the sheet. */
+    readonly coarsePointer: boolean;
+    readonly readOnly: boolean;
+    readonly setNodeData: (id: string, patch: Record<string, unknown>) => void;
+}
+export declare const GraphHostProvider: import("react").Provider<GraphHostValue | null>;
+export declare function useGraphHost(): GraphHostValue;
+declare function GraphNodeHostComponent({ id, data, selected, dragging }: NodeProps): import("react/jsx-runtime").JSX.Element;
+export declare const GraphNodeHost: import("react").MemoExoticComponent<typeof GraphNodeHostComponent>;
+export {};
+//# sourceMappingURL=GraphNodeHost.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"GraphNodeHost.d.ts","sourceRoot":"","sources":["../../src/react-flow/GraphNodeHost.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAGH,OAAO,KAAK,EAAE,YAAY,EAAE,WAAW,EAAE,YAAY,EAAY,MAAM,gBAAgB,CAAC;AAMxF,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,MAAM,CAAC;AAEtC,MAAM,WAAW,cAAc;IAC7B,QAAQ,CAAC,MAAM,EAAE,WAAW,CAAC,YAAY,EAAE,YAAY,CAAC,CAAC;IACzD,sEAAsE;IACtE,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAC;IAC9B,0EAA0E;IAC1E,QAAQ,CAAC,aAAa,EAAE,OAAO,CAAC;IAChC,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,WAAW,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAC;CAC5E;AAID,eAAO,MAAM,iBAAiB,iDAA4B,CAAC;AAE3D,wBAAgB,YAAY,IAAI,cAAc,CAS7C;AAED,iBAAS,sBAAsB,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,SAAS,2CAgD1E;AAED,eAAO,MAAM,aAAa,oEAA+B,CAAC"}

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

@@ -0,0 +1,26 @@
+/**
+ * The `paint` marker — milestone 6, design §9.4.
+ *
+ * `ready` is deliberately LATE. The canvas waits `graphReadySettleMs` (1800)
+ * before stamping it so the diagnostics it carries are filled in rather than
+ * reporting `nodesMounted: 0` and every face `pending`. That was the right fix
+ * for the diagnostics and the wrong clock for the watchdog: on emulator-5592
+ * the 12 s budget fired on a canvas that was ALREADY on screen, and Retry did
+ * not recover emulator-5590. Ready and paint had come apart, and the watchdog
+ * was timing the one that is allowed to be slow.
+ *
+ * So this is the early half, and it carries nothing but the fact that pixels
+ * exist. Two `requestAnimationFrame`s, not one: the first is scheduled before
+ * the browser paints the frame this mount produced, the second runs after it.
+ * A single frame would report "about to paint", which is the claim that was
+ * already being made by `ready` and is not the one the watchdog needs.
+ *
+ * It is a child of `ReactFlow`, so mounting means React Flow rendered. It
+ * renders `null` and fires exactly once per mount.
+ */
+export interface GraphPaintProbeProps {
+    /** Fired once, on the frame after React Flow's first render. */
+    readonly onPaint: () => void;
+}
+export declare function GraphPaintProbe({ onPaint }: GraphPaintProbeProps): null;
+//# sourceMappingURL=GraphPaintProbe.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"GraphPaintProbe.d.ts","sourceRoot":"","sources":["../../src/react-flow/GraphPaintProbe.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAIH,MAAM,WAAW,oBAAoB;IACnC,gEAAgE;IAChE,QAAQ,CAAC,OAAO,EAAE,MAAM,IAAI,CAAC;CAC9B;AAED,wBAAgB,eAAe,CAAC,EAAE,OAAO,EAAE,EAAE,oBAAoB,QAoChE"}

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

@@ -0,0 +1,31 @@
+/**
+ * `--mpo-graph-zoom` on the canvas root — milestone 6, design §7.1 H7.
+ *
+ * The 44 px port hit region is an `::after` pseudo-element, and every element
+ * a node owns lives INSIDE `.react-flow__viewport`, whose transform carries the
+ * pan and the zoom. So a region declared 44 px renders 44 × zoom SCREEN px, and
+ * on device that was measured rather than reasoned about: on the iPhone 16e at
+ * zoom 0.377 the region was 16.6 pt wide — a half-width of 8.3 pt against a
+ * demanded 18 — and a tap 18 pt off the painted centre panned the canvas
+ * instead of grabbing the port. The same miss on emulator-5592 at zoom 0.397.
+ *
+ * The fix is to counter-scale the region by 1/zoom, which needs the zoom in
+ * CSS. This writes it, and it writes it IMPERATIVELY: `style.setProperty` on a
+ * ref rather than a React prop, because a viewport change is a per-frame event
+ * during a pinch and re-rendering the canvas tree 120 times a second to move a
+ * custom property would cost more than the region is worth.
+ *
+ * The component itself still re-renders per zoom frame — `useStore` is a
+ * subscription — but it renders `null` and has no children, so the cost is one
+ * function call and a store comparison. The SELECTOR reads only `transform[2]`,
+ * so a pan (which changes `transform[0]` and `[1]`) wakes nothing here.
+ */
+/** The property name, in one place. `css/graph.css` reads it. */
+export declare const graphZoomVarName = "--mpo-graph-zoom";
+export interface GraphZoomVarProps {
+    readonly rootRef: {
+        current: HTMLElement | null;
+    };
+}
+export declare function GraphZoomVar({ rootRef }: GraphZoomVarProps): null;
+//# sourceMappingURL=GraphZoomVar.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"GraphZoomVar.d.ts","sourceRoot":"","sources":["../../src/react-flow/GraphZoomVar.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;GAqBG;AAKH,iEAAiE;AACjE,eAAO,MAAM,gBAAgB,qBAAqB,CAAC;AAEnD,MAAM,WAAW,iBAAiB;IAChC,QAAQ,CAAC,OAAO,EAAE;QAAE,OAAO,EAAE,WAAW,GAAG,IAAI,CAAA;KAAE,CAAC;CACnD;AAED,wBAAgB,YAAY,CAAC,EAAE,OAAO,EAAE,EAAE,iBAAiB,QAc1D"}

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

@@ -0,0 +1,39 @@
+/**
+ * The long-press marquee (design §7.3 L4, task 3.7).
+ *
+ * One absolutely-positioned div, painted from `--xy-selection-background-color`
+ * and `--xy-selection-border` — the SAME two variables React Flow's own
+ * `.react-flow__selection` reads (`style.css`), which `graphVars.ts` already
+ * writes from the mpo token layer. So the long-press marquee and the toolbar-
+ * mode marquee are the same rectangle to look at, in both schemes, without this
+ * file knowing a colour. `checkGraphVarsCoverage()` would fail the build for a
+ * `.react-flow__` selector outside `css/graph.css`; reading the variables from
+ * an inline style is the way to match upstream's paint without restating its
+ * selector.
+ *
+ * WHERE IT MOUNTS IS LOAD-BEARING, and this is measured rather than assumed.
+ * Rendered as a SIBLING of the canvas it painted nothing: computed
+ * `background-color: rgba(0, 0, 0, 0)` and `border-style: none`, a correctly
+ * sized rectangle that is entirely invisible. `GraphVars` writes the `--xy-*`
+ * layer onto the `.mp-graph` root, and a variable that is not in scope resolves
+ * to the empty string in silence. So it goes INSIDE the canvas, as a
+ * `NodeGraph` child: React Flow renders children in the `.react-flow`
+ * container, which is screen space, is `position: relative`, and is under the
+ * root the variables are written to.
+ *
+ * Screen space, not the viewport transform. The marquee is drawn under a finger
+ * and it must not scale, shear or move when the viewport is restored on arm.
+ * The rect arrives pane-relative, and the pane fills that same container
+ * exactly, so the two coordinate systems are one.
+ *
+ * `pointer-events: none` is not decoration. The overlay sits on top of the pane
+ * during the one gesture whose events the pane must keep receiving, and a div
+ * that swallowed them would break the lasso by painting it.
+ */
+import type { Rect } from "../model/index";
+export interface LassoOverlayProps {
+    /** Pane-relative screen px. `null` paints nothing. */
+    readonly rect: Rect | null;
+}
+export declare function LassoOverlay({ rect }: LassoOverlayProps): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=LassoOverlay.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"LassoOverlay.d.ts","sourceRoot":"","sources":["../../src/react-flow/LassoOverlay.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AAEH,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AAE3C,MAAM,WAAW,iBAAiB;IAChC,sDAAsD;IACtD,QAAQ,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC;CAC5B;AAED,wBAAgB,YAAY,CAAC,EAAE,IAAI,EAAE,EAAE,iBAAiB,kDAkBvD"}

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

@@ -0,0 +1,195 @@
+/**
+ * The web canvas: `GraphVars` + `KnobEnvelopeProvider` + `ReactFlow`, in that
+ * order, under one root that carries the package's scope class.
+ *
+ * The order is the whole composition:
+ *
+ *  1. `GraphVars` writes the `--xy-*` / `--mpo-graph-*` layer onto the root, so
+ *     React Flow's OWN stylesheet paints from mpo tokens instead of its
+ *     defaults. Nothing else in the package touches a `.react-flow__` selector
+ *     (`checkGraphVarsCoverage` in public/config/lint.mjs fails the build if it
+ *     does, outside `css/graph.css`).
+ *  2. `KnobEnvelopeProvider` rebuilds the Preset / Surface / Intent stack from
+ *     the envelope. On web that is the degenerate case — the host stack is
+ *     already above us — and it is HERE anyway, because milestone 2's WebView
+ *     entry must run the same code path. One path, not two that drift.
+ *  3. `ReactFlow` with exactly two registrations: one node type and one edge
+ *     type, both switching on the model kind internally.
+ *
+ * Two stylesheets are imported. `@xyflow/react/dist/style.css` is required and
+ * is NOT restated by this package — `css/graph.css` deliberately carries only
+ * the handle `position: absolute` the 44pt region needs, not the edge
+ * placement rules. Importing it here means a consumer cannot forget.
+ */
+import "@xyflow/react/dist/style.css";
+import "../../css/graph.css";
+import type { Knobs } from "@multiplatform.one/theme";
+import { type CSSProperties, type ReactNode, type Ref } from "react";
+import type { GraphSnappingOptions } from "../interaction/snapChanges";
+import type { GraphInteractionMode } from "../interaction/useLassoSelect";
+import type { GraphEventWire } from "../dom/wire";
+import type { ConnectionVerdict, EdgeKindDefs, GraphCommand, GraphDocument, GraphSchema, NodeKindDefs } from "../model/index";
+import type { GraphCommandSlot, NodeGraphHandle } from "./graphHandle";
+import type { NodeTypes } from "./xy";
+/**
+ * The canvas decisions this package makes, spelled once so they can be read
+ * and asserted without mounting anything.
+ *
+ * `onlyRenderVisibleElements` is true, against React Flow's own `false`. It is
+ * measured: node drag 25.71 ms → 10.58 ms at 200 nodes / 4× throttle (design
+ * §5). It costs nothing at small graphs and is the single largest win at large
+ * ones, so the default is the measured one and a consumer opts OUT.
+ */
+export declare const graphCanvasDefaults: {
+    readonly onlyRenderVisibleElements: true;
+    readonly fitView: true;
+    /** Below this zoom a node draws in `overview` mode. Design §5. */
+    readonly overviewZoom: 0.35;
+    /**
+     * React Flow's own default is **0.5**, which is ABOVE `overviewZoom`.
+     *
+     * Measured in Chrome on `NodeGraph/Overview` at 500 nodes: the zoom-out
+     * control bottomed out at 0.5, `fitView` clamped there and showed 50 of the
+     * 500 nodes, and the overview mode this milestone builds was unreachable —
+     * not broken, unreachable, which is worse, because every unit spec around it
+     * was green. A level of detail below a floor the user cannot cross is dead
+     * code with a passing test suite.
+     *
+     * `graphCanvasDefaults.minZoom < graphCanvasDefaults.overviewZoom` is
+     * asserted in `lod.spec.tsx`, so the two cannot drift back into that state.
+     */
+    readonly minZoom: 0.05;
+    readonly maxZoom: 2;
+};
+export interface NodeGraphWebProps<N extends NodeKindDefs, E extends EdgeKindDefs> {
+    readonly schema: GraphSchema<N, E>;
+    /** Controlled. */
+    readonly document?: GraphDocument<N, E>;
+    /** Uncontrolled seed. */
+    readonly defaultDocument?: GraphDocument<N, E>;
+    readonly onDocumentChange?: (document: GraphDocument<N, E>, command: GraphCommand<N, E>) => void;
+    readonly onConnectionRefused?: (verdict: ConnectionVerdict) => void;
+    readonly readOnly?: boolean;
+    /** Merged on top of the whole Preset chain, and carried across the bridge. */
+    readonly knobs?: Partial<Knobs>;
+    /** The name the host mounted `<Preset preset=…>` with. See `KnobEnvelope.presetName`. */
+    readonly presetName?: string;
+    readonly intent?: string | null;
+    /**
+     * Touch surface: widens the port pitch, raises the handle hit region to the
+     * 44 px press floor, and makes fields display-only.
+     *
+     * Defaults to `isTouchSurface()` (design 7.1 H3). It used to default to
+     * `false`, which meant a canvas mounted inside the WebView with nobody
+     * passing the prop painted 24 px targets and set `--mpo-graph-handle-hit`
+     * to 24 — the press floor missed by twenty pixels, silently, on the one
+     * surface the floor is for.
+     */
+    readonly coarsePointer?: boolean;
+    /**
+     * `pan` (the default) is React Flow's ordinary canvas. `select` swaps the
+     * one-finger pan for a marquee by setting `panOnDrag={false}`, which is the
+     * only value that opens the touch guard at `Pane/index.tsx:146` — design
+     * §7.3, and `lassoFlowProps` carries the reasoning.
+     *
+     * Controlled on purpose: the toolbar that flips it lives in the native shell
+     * (`GraphToolbar`), outside the WebView, so the canvas is told the mode
+     * rather than owning it.
+     */
+    readonly interactionMode?: GraphInteractionMode;
+    readonly onlyRenderVisibleElements?: boolean;
+    readonly fitView?: boolean;
+    readonly overviewZoom?: number;
+    /**
+     * Alignment snapping and the optional grid, design §7.2. Alignment is on;
+     * pass `{ alignment: false }` to turn the whole thing off, or a `grid` in
+     * flow units to compose one with it.
+     */
+    readonly snapping?: GraphSnappingOptions;
+    /**
+     * Defaults to 0.05, well under `overviewZoom`. React Flow's own 0.5 sits
+     * ABOVE it, which makes overview mode unreachable — see
+     * `graphCanvasDefaults.minZoom`. Raising this above `overviewZoom` turns the
+     * level of detail off, and that is the consumer's call to make explicitly.
+     */
+    readonly minZoom?: number;
+    readonly maxZoom?: number;
+    /** Extra node types a consumer registers alongside the built-in one. */
+    readonly nodeTypes?: NodeTypes;
+    readonly className?: string;
+    readonly style?: CSSProperties;
+    /**
+     * The one overlay that says what a connection drag is currently over
+     * (design §7.4). On by default: it exists only while a drag is in progress,
+     * and on a phone the finger occludes the port it is aiming at, which the
+     * native spike named the hardest touch item verbatim.
+     */
+    readonly connectionPuck?: boolean;
+    /** Names a node for the puck. Defaults to the node id. */
+    readonly nodeLabel?: (nodeId: string) => string | undefined;
+    /**
+     * The long press, design §7.3, INSIDE the canvas.
+     *
+     * It used to be a hook a consumer called and wired to a DOM ref of its own
+     * (`NodeGraph/Lasso` → `LongPress` did exactly that). On native that story
+     * could not mount at all — `View config getter callback for component 'div'
+     * must be a function` — because the ref hung off the React Native host tree
+     * while the pane it must intercept lives in the WebView's realm, which a
+     * host-side ref can never reach.
+     *
+     * So the gesture moved in here, where the pane exists on both platforms, and
+     * a native consumer arms it with a serializable option instead of a hook.
+     * Off by default: design §7.3 L7 says nothing changes on a fine pointer.
+     */
+    readonly longPressLasso?: boolean;
+    /**
+     * The single channel, on web.
+     *
+     * Design §9.1's `onEvent`, unwrapped: on native the same union crosses the
+     * bridge as JSON, and on web it is handed straight to the caller. One prop
+     * rather than six callbacks, for the reason the bridge has one channel —
+     * adding an event is then a change to a type and to nothing else.
+     */
+    readonly onGraphEvent?: (event: GraphEventWire) => void;
+    /**
+     * The imperative handle, design §9.1.
+     *
+     * The same eleven commands the native shell forwards across the bridge, so a
+     * toolbar written as a sibling drives the canvas identically on both
+     * platforms. That is milestone 6's whole rule: a native consumer cannot put
+     * children inside the canvas, so the handle is the surface, and a handle that
+     * existed only on native would be a surface the web story could not rehearse.
+     */
+    readonly graphRef?: Ref<NodeGraphHandle>;
+    /**
+     * The DOM shell's own slot, threaded down so `useDOMImperativeHandle` can
+     * forward into it. Consumers use `graphRef`; this is the bridge's door and it
+     * is documented so nobody mistakes it for one.
+     */
+    readonly commandSlot?: GraphCommandSlot;
+    /**
+     * Which realm this canvas is painting in. Recorded on every perf report, so a
+     * device run and a desktop run are distinguishable in the data rather than in
+     * someone's memory.
+     */
+    readonly renderer?: "react-flow-web" | "react-flow-dom";
+    /**
+     * Milliseconds from the DOM bundle's first line to now, when there is a boot
+     * record to read. Rides the `paint` event, which is what the native watchdog
+     * is measured against (design §9.4). Web has no boot record and passes none.
+     */
+    readonly readBootMs?: () => number | null;
+    /** The DOM realm stamps its boot stage here. Web passes nothing. */
+    readonly onCanvasMounted?: () => void;
+    /** `Background`, `Controls`, `MiniMap` — React Flow children. */
+    readonly children?: ReactNode;
+}
+/**
+ * `ReactFlowProvider` is mounted by the package, not asked of the consumer.
+ *
+ * `GraphNodeHost` reads the store for the live zoom and `GraphNode` calls
+ * `useUpdateNodeInternals`; both throw outside a provider. Making the consumer
+ * remember it is a failure mode with a confusing message.
+ */
+export declare function NodeGraphWeb<N extends NodeKindDefs, E extends EdgeKindDefs>(props: NodeGraphWebProps<N, E>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=NodeGraphWeb.d.ts.map

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

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

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

@@ -0,0 +1,49 @@
+/**
+ * The alignment guides, design §7.2 S10.
+ *
+ * ONE `<svg>` with at most two `<line>` children, inside React Flow's viewport
+ * transform, cleared the moment the drag ends. Never a div per guide: a guide
+ * is a hairline across the canvas, and a div layer would need its own width,
+ * its own transform, and its own rounding, all of which the viewport already
+ * did for us.
+ *
+ * **The svg is SIZED to its lines, and that is not cosmetic.** The first
+ * version was `width={0} height={0}` with `overflow: visible`, drawing in flow
+ * coordinates — structurally right, and INVISIBLE in Chrome. The DOM was
+ * correct (one svg, two lines, right coordinates, stroke resolved from the var
+ * layer) and nothing painted, because an outermost `<svg>` clips to its own
+ * viewport and a zero-sized viewport has nothing inside it. Measured on
+ * `NodeGraph/Snapping → ZoomThreshold` by forcing the stroke to 6 px and
+ * screenshotting: still nothing. So the layer takes the bounding box of the
+ * guides, plus a small pad for the stroke, and draws in LOCAL coordinates.
+ *
+ * `vector-effect: non-scaling-stroke` in `css/graph.css` is what keeps a
+ * hairline a hairline at 4x zoom rather than a 2 px bar.
+ */
+import type { SnapGuide } from "../interaction/snapAlignment";
+export declare const snapGuidesClassName = "mp-graph-guides";
+export declare const snapGuideClassName = "mp-graph-guide";
+/**
+ * Flow units of slack around the box. The stroke is centred on the line, so a
+ * box that ends exactly on it would clip half of it away; and at a pinched-out
+ * zoom the painted stroke is wider than the flow units it sits in.
+ */
+export declare const snapGuidePadding = 2;
+export interface SnapGuidesBox {
+    readonly x: number;
+    readonly y: number;
+    readonly width: number;
+    readonly height: number;
+}
+/** The padded box that holds every line. Exported because the spec asserts it. */
+export declare function snapGuidesBounds(guides: readonly SnapGuide[]): SnapGuidesBox | null;
+export interface SnapGuidesProps {
+    readonly guides: readonly SnapGuide[];
+    /**
+     * Design §7.2 S11: motion settings fade the guide, they do not turn snapping
+     * off. False under `animation: "none"` and under OS reduced motion.
+     */
+    readonly animated?: boolean;
+}
+export declare function SnapGuides({ guides, animated }: SnapGuidesProps): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=SnapGuides.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SnapGuides.d.ts","sourceRoot":"","sources":["../../src/react-flow/SnapGuides.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAG9D,eAAO,MAAM,mBAAmB,oBAAoB,CAAC;AACrD,eAAO,MAAM,kBAAkB,mBAAmB,CAAC;AAEnD;;;;GAIG;AACH,eAAO,MAAM,gBAAgB,IAAI,CAAC;AAElC,MAAM,WAAW,aAAa;IAC5B,QAAQ,CAAC,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;CACzB;AAED,kFAAkF;AAClF,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,SAAS,SAAS,EAAE,GAAG,aAAa,GAAG,IAAI,CAsBnF;AAED,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,MAAM,EAAE,SAAS,SAAS,EAAE,CAAC;IACtC;;;OAGG;IACH,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED,wBAAgB,UAAU,CAAC,EAAE,MAAM,EAAE,QAAe,EAAE,EAAE,eAAe,kDAmCtE"}

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

@@ -0,0 +1,47 @@
+/**
+ * Design §13.2's plain-div CONTROL condition, as a schema the DOM bundle can
+ * reach.
+ *
+ * The delta between this and `demoGraphSchema()` is the Tamagui cost, measured
+ * on the host in front of you instead of carried over from the web's ~10%. Same
+ * graph, same edges, same React Flow `Handle`s — only the node BODY changes,
+ * from the package's `GraphNode` frame to a bare styled `div`. The handles stay
+ * because removing them would change what React Flow itself does per node, and
+ * then the two cells would not be the same experiment.
+ *
+ * WHY IT IS HERE AND NOT IN THE STORY, which is where it was written.
+ *
+ * A `NodeKindSpec.render` is a `ComponentType`, so it cannot be JSON and cannot
+ * cross the bridge: the only string that crosses is `schemaId`, and the canvas
+ * resolves it inside the DOM bundle. `bench/Perf200.stories.tsx` runs on the
+ * Hermes side, so a schema built there is unreachable from the realm that has
+ * to render it. Measured on the iPhone 16e at m6: `Perf200 → Control` reported
+ * `render: no graph schema registered as "node-graph-demo-control"` and painted
+ * nothing, which left §13.2's mandated control condition unmeasurable on every
+ * device.
+ *
+ * Moving it into the package is only half the fix. The other half is that the
+ * app's `'use dom'` entry can now register MORE THAN ONE schema — see
+ * `NodeGraphDomRealmProps.schemas` — because an id-keyed lookup over a list is
+ * the thing that scales past the single special case the inner tree carried.
+ *
+ * The inline styles are deliberately dumb literals off the `currentColor`
+ * chain, with no token and no `useResolvedKnobs` anywhere in the subtree: a
+ * control that resolved tokens would be measuring a slice of the thing it is
+ * the control for.
+ */
+import type { GraphNodeRenderProps } from "../model/index";
+import type { BuiltinEdgeData } from "../edges/edgeKinds";
+import type { DemoNodeData } from "./fixtures";
+export declare function DemoControlBody<TData>({ ports, measure, title, }: GraphNodeRenderProps<TData> & {
+    readonly title: string;
+}): import("react/jsx-runtime").JSX.Element;
+/**
+ * The same measures, ports and rules as the demo schema, with plain bodies.
+ *
+ * `demoSchemaShape()` rather than a second kind table, for the reason that
+ * module already gives: a second copy is a second thing to keep in step, and a
+ * control whose geometry drifted from the subject would measure two graphs.
+ */
+export declare function demoControlSchema(): import("../model/schema").GraphSchema<DemoNodeData, BuiltinEdgeData>;
+//# sourceMappingURL=demoControlBody.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"demoControlBody.d.ts","sourceRoot":"","sources":["../../src/react-flow/demoControlBody.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AAEH,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAE3D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAE1D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAI/C,wBAAgB,eAAe,CAAC,KAAK,EAAE,EACrC,KAAK,EACL,OAAO,EACP,KAAK,GACN,EAAE,oBAAoB,CAAC,KAAK,CAAC,GAAG;IAAE,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;CAAE,2CA0B1D;AAED;;;;;;GAMG;AACH,wBAAgB,iBAAiB,yEAehC"}

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

@@ -0,0 +1,37 @@
+/**
+ * The node body the task-1.11 spec and the `NodeGraph/NodeGraph` story both
+ * mount.
+ *
+ * It is what a CONSUMER writes: a `NodeKindSpec.render` that composes the
+ * package's `GraphNode` frame and `GraphPort` disc. Keeping it here rather than
+ * inside the story is deliberate — the spec and the story then assert the same
+ * tree, so a story that renders cannot be a story that renders something else.
+ *
+ * Its own file, and its own NAME, because `demoNodeBody.tsx` beside a
+ * `demoNodeBody.ts` would be ONE module on macOS. See the note in
+ * `nodes/nodeMeasure.ts`.
+ */
+import type { GraphNodeRenderProps, PortSpec } from "../model/index";
+import type { BuiltinEdgeData } from "../edges/edgeKinds";
+import type { DemoNodeData } from "./fixtures";
+export declare function DemoSourceBody(props: GraphNodeRenderProps<DemoNodeData["source"]>): import("react/jsx-runtime").JSX.Element;
+export declare function DemoTransformBody(props: GraphNodeRenderProps<DemoNodeData["transform"]>): import("react/jsx-runtime").JSX.Element;
+export declare function DemoSinkBody(props: GraphNodeRenderProps<DemoNodeData["sink"]>): import("react/jsx-runtime").JSX.Element;
+/** The fixture schema with real bodies wired in. */
+export declare function demoGraphSchema(): import("../model/schema").GraphSchema<DemoNodeData, BuiltinEdgeData>;
+/**
+ * Design §13.2's control condition, re-exported so `@multiplatform.one/node-graph/demo`
+ * serves BOTH schemas from one subpath.
+ *
+ * The app's `'use dom'` entry is the only module that can hand a schema to the
+ * canvas — a `render` is a component and cannot cross the bridge — and an entry
+ * that had to reach two subpaths to register two schemas would be an entry with
+ * a second way to get one of them wrong. It is a re-export rather than a second
+ * export map entry for the same reason `NodeGraphDomInner` imports this file
+ * statically: another `import()` in the DOM subtree makes Metro emit a shared
+ * `__common` chunk, and `expo export`'s html serializer then dies while exiting
+ * 0 (design §13.2).
+ */
+export { DemoControlBody, demoControlSchema } from "./demoControlBody";
+export type { PortSpec };
+//# sourceMappingURL=demoNodeBody.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"demoNodeBody.d.ts","sourceRoot":"","sources":["../../src/react-flow/demoNodeBody.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAAE,oBAAoB,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAErE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAK1D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAmD/C,wBAAgB,cAAc,CAAC,KAAK,EAAE,oBAAoB,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC,2CAEjF;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,oBAAoB,CAAC,YAAY,CAAC,WAAW,CAAC,CAAC,2CAEvF;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,oBAAoB,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,2CAE7E;AAQD,oDAAoD;AACpD,wBAAgB,eAAe,yEAY9B;AAED;;;;;;;;;;;;GAYG;AACH,OAAO,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAEvE,YAAY,EAAE,QAAQ,EAAE,CAAC"}