@realflow/react 0.1.0

package/dist/NodeRenderer.d.ts

@@ -0,0 +1,13 @@
+/** Renders one node (and its children), subscribed only to its own topic. */
+export declare const NodeView: import("react").NamedExoticComponent<{
+    id: string;
+}>;
+/** Mounts the visible root nodes (viewport culling built in). */
+export declare const NodesLayer: import("react").NamedExoticComponent<object>;
+export declare const builtinNodeTypes: {
+    default: import("react").NamedExoticComponent<import("./types.js").NodeProps<Record<string, unknown>>>;
+    input: import("react").NamedExoticComponent<import("./types.js").NodeProps<Record<string, unknown>>>;
+    output: import("react").NamedExoticComponent<import("./types.js").NodeProps<Record<string, unknown>>>;
+    group: import("react").NamedExoticComponent<import("./types.js").NodeProps<Record<string, unknown>>>;
+};
+//# sourceMappingURL=NodeRenderer.d.ts.map

package/dist/NodeRenderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NodeRenderer.d.ts","sourceRoot":"","sources":["../src/NodeRenderer.tsx"],"names":[],"mappings":"AAWA,6EAA6E;AAC7E,eAAO,MAAM,QAAQ;QAAwC,MAAM;EAuLjE,CAAC;AAUH,iEAAiE;AACjE,eAAO,MAAM,UAAU,8CA0BrB,CAAC;AAEH,eAAO,MAAM,gBAAgB;;;;;CAK5B,CAAC"}

package/dist/NodeRenderer.js

@@ -0,0 +1,194 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo, useEffect, useMemo, useRef } from 'react';
+import { useFlowStore, NodeIdContext } from './context.js';
+import { useConfig } from './config.js';
+import { useFlowSelector } from './hooks.js';
+import { useMeasurer } from './measure.js';
+import { DefaultNode, GroupNode, InputNode, OutputNode } from './DefaultNode.js';
+const NO_DRAG_SELECTOR = '.rf-handle, .rf-nodrag, input, textarea, select, button, a, [contenteditable="true"]';
+/** Renders one node (and its children), subscribed only to its own topic. */
+export const NodeView = memo(function NodeView({ id }) {
+    const store = useFlowStore();
+    const config = useConfig();
+    const node = useFlowSelector([`node:${id}`], () => store.nodes.get(id));
+    const contentRef = useRef(null);
+    const dragState = useRef(null);
+    // Measure real size so edges/minimap/culling stay exact. Nodes with an
+    // explicit width AND height skip observation entirely (big win when
+    // mounting thousands of fixed-size nodes).
+    const measurer = useMeasurer();
+    const hasFixedSize = node != null && node.width != null && node.height != null;
+    useEffect(() => {
+        const el = contentRef.current;
+        if (!el || !measurer || hasFixedSize)
+            return;
+        measurer.observe(el, id);
+        return () => measurer.unobserve(el);
+    }, [measurer, id, hasFixedSize]);
+    const childIds = useChildIds(id);
+    if (!node || node.hidden)
+        return null;
+    const type = node.type ?? 'default';
+    const Comp = config.nodeTypes[type] ?? config.nodeTypes.default ?? DefaultNode;
+    const onPointerDown = (e) => {
+        if (e.button !== 0 || config.readOnly)
+            return;
+        if (e.target.closest(NO_DRAG_SELECTOR))
+            return;
+        e.stopPropagation();
+        const current = store.getNode(id);
+        if (!current || current.selectable === false)
+            return;
+        // Selection on press (drag keeps the selection group together).
+        if (!current.selected) {
+            if (e.shiftKey || e.metaKey || e.ctrlKey)
+                store.addToSelection([id]);
+            else
+                store.setSelection([id]);
+        }
+        if (current.draggable === false)
+            return;
+        const el = e.currentTarget;
+        try {
+            el.setPointerCapture(e.pointerId);
+        }
+        catch {
+            /* synthetic events or lost pointers */
+        }
+        dragState.current = {
+            pointerId: e.pointerId,
+            startX: e.clientX,
+            startY: e.clientY,
+            dragging: false,
+            raf: null,
+            dx: 0,
+            dy: 0,
+        };
+    };
+    const onPointerMove = (e) => {
+        const s = dragState.current;
+        if (!s || e.pointerId !== s.pointerId)
+            return;
+        const dx = e.clientX - s.startX;
+        const dy = e.clientY - s.startY;
+        if (!s.dragging) {
+            if (Math.hypot(dx, dy) < 3)
+                return;
+            s.dragging = true;
+            const sel = store.getNode(id)?.selected
+                ? [...store.selectedNodes]
+                : [id];
+            store.startDrag(sel);
+        }
+        const zoom = store.viewport.zoom || 1;
+        s.dx = dx / zoom;
+        s.dy = dy / zoom;
+        if (s.raf == null) {
+            s.raf = requestAnimationFrame(() => {
+                s.raf = null;
+                if (dragState.current === s)
+                    store.dragBy({ x: s.dx, y: s.dy });
+            });
+        }
+    };
+    const onPointerUp = (e) => {
+        const s = dragState.current;
+        if (!s || e.pointerId !== s.pointerId)
+            return;
+        dragState.current = null;
+        if (s.raf != null)
+            cancelAnimationFrame(s.raf);
+        try {
+            e.currentTarget.releasePointerCapture(e.pointerId);
+        }
+        catch {
+            /* already released */
+        }
+        if (s.dragging) {
+            store.dragBy({ x: s.dx, y: s.dy });
+            store.endDrag();
+        }
+        else if (e.shiftKey || e.metaKey || e.ctrlKey) {
+            // Click (no drag) with modifier on an already-selected node: toggle off.
+            const current = store.getNode(id);
+            if (current?.selected)
+                store.toggleSelection(id);
+        }
+    };
+    const onClick = (e) => {
+        e.stopPropagation();
+        const current = store.getNode(id);
+        if (current)
+            config.onNodeClick?.(e, current);
+    };
+    const onDoubleClick = (e) => {
+        e.stopPropagation();
+        const current = store.getNode(id);
+        if (current)
+            config.onNodeDoubleClick?.(e, current);
+    };
+    const onContextMenu = (e) => {
+        const current = store.getNode(id);
+        if (current && config.onNodeContextMenu) {
+            e.stopPropagation();
+            config.onNodeContextMenu(e, current);
+        }
+    };
+    const style = {
+        transform: `translate(${node.position.x}px, ${node.position.y}px)`,
+        zIndex: node.zIndex ?? (node.selected ? 10 : undefined),
+    };
+    const contentStyle = {
+        width: node.width,
+        height: node.height,
+        ...node.style,
+    };
+    const label = node.ariaLabel ?? node.data?.label ?? `node ${id}`;
+    return (_jsxs("div", { className: `rf-node${node.selected ? ' rf-selected' : ''}${node.draggable === false ? '' : ' rf-draggable'}${node.className ? ` ${node.className}` : ''}`, "data-id": id, "data-type": type, style: style, 
+        // Accessibility: nodes are focusable and announce themselves. Focusing
+        // selects; arrow keys move the selection (handled by the pane).
+        tabIndex: config.readOnly ? -1 : 0, role: "button", "aria-label": label, "aria-selected": !!node.selected, "aria-roledescription": "node", onPointerDown: onPointerDown, onPointerMove: onPointerMove, onPointerUp: onPointerUp, onClick: onClick, onDoubleClick: onDoubleClick, onContextMenu: onContextMenu, onFocus: (e) => {
+            // Only react to focus on the node itself, not bubbled from children.
+            if (e.target !== e.currentTarget)
+                return;
+            const cur = store.getNode(id);
+            if (cur && !cur.selected && cur.selectable !== false)
+                store.setSelection([id]);
+        }, children: [_jsx("div", { ref: contentRef, className: "rf-node-content", style: contentStyle, children: _jsx(NodeIdContext.Provider, { value: id, children: _jsx(Comp, { id: id, data: node.data, node: node, selected: !!node.selected, dragging: false }) }) }), childIds.map((cid) => (_jsx(NodeView, { id: cid }, cid)))] }));
+});
+/** Reactive list of a node's direct children (stable while unchanged). */
+const useChildIds = (id) => {
+    const store = useFlowStore();
+    const version = useFlowSelector(['nodes'], () => store.nodesVersion);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    return useMemo(() => store.childrenOf(id), [store, id, version]);
+};
+/** Mounts the visible root nodes (viewport culling built in). */
+export const NodesLayer = memo(function NodesLayer() {
+    const store = useFlowStore();
+    const cache = useRef({
+        roots: new Set(),
+        version: -1,
+        ids: [],
+    });
+    const ids = useFlowSelector(['visible', 'nodes'], () => {
+        const c = cache.current;
+        if (c.roots !== store.visibleRoots || c.version !== store.nodesVersion) {
+            const next = [];
+            for (const id of store.nodeOrder) {
+                if (store.visibleRoots.has(id) && !store.nodes.get(id)?.parentId)
+                    next.push(id);
+            }
+            cache.current = { roots: store.visibleRoots, version: store.nodesVersion, ids: next };
+        }
+        return cache.current.ids;
+    });
+    return (_jsx("div", { className: "rf-nodes", children: ids.map((id) => (_jsx(NodeView, { id: id }, id))) }));
+});
+export const builtinNodeTypes = {
+    default: DefaultNode,
+    input: InputNode,
+    output: OutputNode,
+    group: GroupNode,
+};
+//# sourceMappingURL=NodeRenderer.js.map

package/dist/NodeRenderer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NodeRenderer.js","sourceRoot":"","sources":["../src/NodeRenderer.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAEzD,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AACxD,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AACrC,OAAO,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAC1C,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAE9E,MAAM,gBAAgB,GACpB,sFAAsF,CAAC;AAEzF,6EAA6E;AAC7E,MAAM,CAAC,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,QAAQ,CAAC,EAAE,EAAE,EAAkB;IACnE,MAAM,KAAK,GAAG,YAAY,EAAE,CAAC;IAC7B,MAAM,MAAM,GAAG,SAAS,EAAE,CAAC;IAC3B,MAAM,IAAI,GAAG,eAAe,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC;IACxE,MAAM,UAAU,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAChD,MAAM,SAAS,GAAG,MAAM,CAQd,IAAI,CAAC,CAAC;IAEhB,uEAAuE;IACvE,oEAAoE;IACpE,2CAA2C;IAC3C,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAC/B,MAAM,YAAY,GAAG,IAAI,IAAI,IAAI,IAAI,IAAI,CAAC,KAAK,IAAI,IAAI,IAAI,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC;IAC/E,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,EAAE,GAAG,UAAU,CAAC,OAAO,CAAC;QAC9B,IAAI,CAAC,EAAE,IAAI,CAAC,QAAQ,IAAI,YAAY;YAAE,OAAO;QAC7C,QAAQ,CAAC,OAAO,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC;QACzB,OAAO,GAAG,EAAE,CAAC,QAAQ,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC;IACtC,CAAC,EAAE,CAAC,QAAQ,EAAE,EAAE,EAAE,YAAY,CAAC,CAAC,CAAC;IAEjC,MAAM,QAAQ,GAAG,WAAW,CAAC,EAAE,CAAC,CAAC;IAEjC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,MAAM;QAAE,OAAO,IAAI,CAAC;IAEtC,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,IAAI,SAAS,CAAC;IACpC,MAAM,IAAI,GAAG,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,MAAM,CAAC,SAAS,CAAC,OAAO,IAAI,WAAW,CAAC;IAE/E,MAAM,aAAa,GAAG,CAAC,CAAoC,EAAQ,EAAE;QACnE,IAAI,CAAC,CAAC,MAAM,KAAK,CAAC,IAAI,MAAM,CAAC,QAAQ;YAAE,OAAO;QAC9C,IAAK,CAAC,CAAC,MAAkB,CAAC,OAAO,CAAC,gBAAgB,CAAC;YAAE,OAAO;QAC5D,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;QAClC,IAAI,CAAC,OAAO,IAAI,OAAO,CAAC,UAAU,KAAK,KAAK;YAAE,OAAO;QAErD,gEAAgE;QAChE,IAAI,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC;YACtB,IAAI,CAAC,CAAC,QAAQ,IAAI,CAAC,CAAC,OAAO,IAAI,CAAC,CAAC,OAAO;gBAAE,KAAK,CAAC,cAAc,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;;gBAChE,KAAK,CAAC,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;QAChC,CAAC;QAED,IAAI,OAAO,CAAC,SAAS,KAAK,KAAK;YAAE,OAAO;QACxC,MAAM,EAAE,GAAG,CAAC,CAAC,aAAa,CAAC;QAC3B,IAAI,CAAC;YACH,EAAE,CAAC,iBAAiB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;QACpC,CAAC;QAAC,MAAM,CAAC;YACP,uCAAuC;QACzC,CAAC;QACD,SAAS,CAAC,OAAO,GAAG;YAClB,SAAS,EAAE,CAAC,CAAC,SAAS;YACtB,MAAM,EAAE,CAAC,CAAC,OAAO;YACjB,MAAM,EAAE,CAAC,CAAC,OAAO;YACjB,QAAQ,EAAE,KAAK;YACf,GAAG,EAAE,IAAI;YACT,EAAE,EAAE,CAAC;YACL,EAAE,EAAE,CAAC;SACN,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,aAAa,GAAG,CAAC,CAAoC,EAAQ,EAAE;QACnE,MAAM,CAAC,GAAG,SAAS,CAAC,OAAO,CAAC;QAC5B,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,SAAS,KAAK,CAAC,CAAC,SAAS;YAAE,OAAO;QAC9C,MAAM,EAAE,GAAG,CAAC,CAAC,OAAO,GAAG,CAAC,CAAC,MAAM,CAAC;QAChC,MAAM,EAAE,GAAG,CAAC,CAAC,OAAO,GAAG,CAAC,CAAC,MAAM,CAAC;QAChC,IAAI,CAAC,CAAC,CAAC,QAAQ,EAAE,CAAC;YAChB,IAAI,IAAI,CAAC,KAAK,CAAC,EAAE,EAAE,EAAE,CAAC,GAAG,CAAC;gBAAE,OAAO;YACnC,CAAC,CAAC,QAAQ,GAAG,IAAI,CAAC;YAClB,MAAM,GAAG,GAAG,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE,QAAQ;gBACrC,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC;gBAC1B,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;YACT,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC;QACvB,CAAC;QACD,MAAM,IAAI,GAAG,KAAK,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,CAAC;QACtC,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC;QACjB,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC;QACjB,IAAI,CAAC,CAAC,GAAG,IAAI,IAAI,EAAE,CAAC;YAClB,CAAC,CAAC,GAAG,GAAG,qBAAqB,CAAC,GAAG,EAAE;gBACjC,CAAC,CAAC,GAAG,GAAG,IAAI,CAAC;gBACb,IAAI,SAAS,CAAC,OAAO,KAAK,CAAC;oBAAE,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;YAClE,CAAC,CAAC,CAAC;QACL,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,WAAW,GAAG,CAAC,CAAoC,EAAQ,EAAE;QACjE,MAAM,CAAC,GAAG,SAAS,CAAC,OAAO,CAAC;QAC5B,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,SAAS,KAAK,CAAC,CAAC,SAAS;YAAE,OAAO;QAC9C,SAAS,CAAC,OAAO,GAAG,IAAI,CAAC;QACzB,IAAI,CAAC,CAAC,GAAG,IAAI,IAAI;YAAE,oBAAoB,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC;QAC/C,IAAI,CAAC;YACH,CAAC,CAAC,aAAa,CAAC,qBAAqB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;QACrD,CAAC;QAAC,MAAM,CAAC;YACP,sBAAsB;QACxB,CAAC;QACD,IAAI,CAAC,CAAC,QAAQ,EAAE,CAAC;YACf,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;YACnC,KAAK,CAAC,OAAO,EAAE,CAAC;QAClB,CAAC;aAAM,IAAI,CAAC,CAAC,QAAQ,IAAI,CAAC,CAAC,OAAO,IAAI,CAAC,CAAC,OAAO,EAAE,CAAC;YAChD,yEAAyE;YACzE,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;YAClC,IAAI,OAAO,EAAE,QAAQ;gBAAE,KAAK,CAAC,eAAe,CAAC,EAAE,CAAC,CAAC;QACnD,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,OAAO,GAAG,CAAC,CAAkB,EAAQ,EAAE;QAC3C,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;QAClC,IAAI,OAAO;YAAE,MAAM,CAAC,WAAW,EAAE,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC;IAChD,CAAC,CAAC;IAEF,MAAM,aAAa,GAAG,CAAC,CAAkB,EAAQ,EAAE;QACjD,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;QAClC,IAAI,OAAO;YAAE,MAAM,CAAC,iBAAiB,EAAE,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC;IACtD,CAAC,CAAC;IAEF,MAAM,aAAa,GAAG,CAAC,CAAkB,EAAQ,EAAE;QACjD,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;QAClC,IAAI,OAAO,IAAI,MAAM,CAAC,iBAAiB,EAAE,CAAC;YACxC,CAAC,CAAC,eAAe,EAAE,CAAC;YACpB,MAAM,CAAC,iBAAiB,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC;QACvC,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,KAAK,GAAkB;QAC3B,SAAS,EAAE,aAAa,IAAI,CAAC,QAAQ,CAAC,CAAC,OAAO,IAAI,CAAC,QAAQ,CAAC,CAAC,KAAK;QAClE,MAAM,EAAE,IAAI,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC;KACxD,CAAC;IACF,MAAM,YAAY,GAAkB;QAClC,KAAK,EAAE,IAAI,CAAC,KAAK;QACjB,MAAM,EAAE,IAAI,CAAC,MAAM;QACnB,GAAI,IAAI,CAAC,KAAuB;KACjC,CAAC;IAEF,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,IAAK,IAAI,CAAC,IAA2B,EAAE,KAAK,IAAI,QAAQ,EAAE,EAAE,CAAC;IAEzF,OAAO,CACL,eACE,SAAS,EAAE,UAAU,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,GACtD,IAAI,CAAC,SAAS,KAAK,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,eAClC,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE,aACtC,EAAE,eACA,IAAI,EACf,KAAK,EAAE,KAAK;QACZ,uEAAuE;QACvE,gEAAgE;QAChE,QAAQ,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAClC,IAAI,EAAC,QAAQ,gBACD,KAAK,mBACF,CAAC,CAAC,IAAI,CAAC,QAAQ,0BACT,MAAM,EAC3B,aAAa,EAAE,aAAa,EAC5B,aAAa,EAAE,aAAa,EAC5B,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,OAAO,EAChB,aAAa,EAAE,aAAa,EAC5B,aAAa,EAAE,aAAa,EAC5B,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;YACb,qEAAqE;YACrE,IAAI,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,aAAa;gBAAE,OAAO;YACzC,MAAM,GAAG,GAAG,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;YAC9B,IAAI,GAAG,IAAI,CAAC,GAAG,CAAC,QAAQ,IAAI,GAAG,CAAC,UAAU,KAAK,KAAK;gBAAE,KAAK,CAAC,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;QACjF,CAAC,aAED,cACE,GAAG,EAAE,UAAU,EACf,SAAS,EAAC,iBAAiB,EAC3B,KAAK,EAAE,YAAY,YAEnB,KAAC,aAAa,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,YAC/B,KAAC,IAAI,IAAC,EAAE,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,EAAE,QAAQ,EAAE,KAAK,GAAI,GAClE,GACrB,EACL,QAAQ,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CACrB,KAAC,QAAQ,IAAW,EAAE,EAAE,GAAG,IAAZ,GAAG,CAAa,CAChC,CAAC,IACE,CACP,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,0EAA0E;AAC1E,MAAM,WAAW,GAAG,CAAC,EAAU,EAAY,EAAE;IAC3C,MAAM,KAAK,GAAG,YAAY,EAAE,CAAC;IAC7B,MAAM,OAAO,GAAG,eAAe,CAAC,CAAC,OAAO,CAAC,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC;IACrE,uDAAuD;IACvD,OAAO,OAAO,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,UAAU,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,EAAE,EAAE,EAAE,OAAO,CAAC,CAAC,CAAC;AACnE,CAAC,CAAC;AAEF,iEAAiE;AACjE,MAAM,CAAC,MAAM,UAAU,GAAG,IAAI,CAAC,SAAS,UAAU;IAChD,MAAM,KAAK,GAAG,YAAY,EAAE,CAAC;IAC7B,MAAM,KAAK,GAAG,MAAM,CAAyD;QAC3E,KAAK,EAAE,IAAI,GAAG,EAAE;QAChB,OAAO,EAAE,CAAC,CAAC;QACX,GAAG,EAAE,EAAE;KACR,CAAC,CAAC;IACH,MAAM,GAAG,GAAG,eAAe,CAAC,CAAC,SAAS,EAAE,OAAO,CAAC,EAAE,GAAG,EAAE;QACrD,MAAM,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC;QACxB,IAAI,CAAC,CAAC,KAAK,KAAK,KAAK,CAAC,YAAY,IAAI,CAAC,CAAC,OAAO,KAAK,KAAK,CAAC,YAAY,EAAE,CAAC;YACvE,MAAM,IAAI,GAAa,EAAE,CAAC;YAC1B,KAAK,MAAM,EAAE,IAAI,KAAK,CAAC,SAAS,EAAE,CAAC;gBACjC,IAAI,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,QAAQ;oBAAE,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;YAClF,CAAC;YACD,KAAK,CAAC,OAAO,GAAG,EAAE,KAAK,EAAE,KAAK,CAAC,YAAY,EAAE,OAAO,EAAE,KAAK,CAAC,YAAY,EAAE,GAAG,EAAE,IAAI,EAAE,CAAC;QACxF,CAAC;QACD,OAAO,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC;IAC3B,CAAC,CAAC,CAAC;IAEH,OAAO,CACL,cAAK,SAAS,EAAC,UAAU,YACtB,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,CACf,KAAC,QAAQ,IAAU,EAAE,EAAE,EAAE,IAAV,EAAE,CAAY,CAC9B,CAAC,GACE,CACP,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,gBAAgB,GAAG;IAC9B,OAAO,EAAE,WAAW;IACpB,KAAK,EAAE,SAAS;IAChB,MAAM,EAAE,UAAU;IAClB,KAAK,EAAE,SAAS;CACjB,CAAC"}

package/dist/NodeResizer.d.ts

@@ -0,0 +1,29 @@
+export interface NodeResizerProps {
+    nodeId?: string;
+    /** Only render while the node is selected. Default true. */
+    isVisible?: boolean;
+    minWidth?: number;
+    minHeight?: number;
+    maxWidth?: number;
+    maxHeight?: number;
+    /** Preserve aspect ratio while resizing. */
+    keepAspectRatio?: boolean;
+    color?: string;
+    /** Fired continuously during resize. */
+    onResize?: (size: {
+        width: number;
+        height: number;
+    }) => void;
+    /** Fired once when resizing ends (a single undo entry is recorded). */
+    onResizeEnd?: (size: {
+        width: number;
+        height: number;
+    }) => void;
+}
+/**
+ * Drag-to-resize handles around a node (8 grips). Updates the node's
+ * width/height (and position for top/left grips) live, and records a single
+ * undo entry per resize gesture. Counter-scaled so grips stay grabbable.
+ */
+export declare const NodeResizer: import("react").NamedExoticComponent<NodeResizerProps>;
+//# sourceMappingURL=NodeResizer.d.ts.map

package/dist/NodeResizer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NodeResizer.d.ts","sourceRoot":"","sources":["../src/NodeResizer.tsx"],"names":[],"mappings":"AAKA,MAAM,WAAW,gBAAgB;IAC/B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,4DAA4D;IAC5D,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,4CAA4C;IAC5C,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,wCAAwC;IACxC,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC7D,uEAAuE;IACvE,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;CACjE;AASD;;;;GAIG;AACH,eAAO,MAAM,WAAW,wDAsItB,CAAC"}

package/dist/NodeResizer.js

@@ -0,0 +1,120 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo, useRef } from 'react';
+import { useFlowStore, useNodeId } from './context.js';
+import { useFlowSelector, useViewport } from './hooks.js';
+const HANDLES = ['nw', 'n', 'ne', 'e', 'se', 's', 'sw', 'w'];
+const CURSOR = {
+    nw: 'nwse-resize', n: 'ns-resize', ne: 'nesw-resize', e: 'ew-resize',
+    se: 'nwse-resize', s: 'ns-resize', sw: 'nesw-resize', w: 'ew-resize',
+};
+/**
+ * Drag-to-resize handles around a node (8 grips). Updates the node's
+ * width/height (and position for top/left grips) live, and records a single
+ * undo entry per resize gesture. Counter-scaled so grips stay grabbable.
+ */
+export const NodeResizer = memo(function NodeResizer({ nodeId, isVisible, minWidth = 40, minHeight = 30, maxWidth = Infinity, maxHeight = Infinity, keepAspectRatio = false, color, onResize, onResizeEnd, }) {
+    const store = useFlowStore();
+    const ctxId = useNodeId();
+    const id = nodeId ?? ctxId;
+    const { zoom } = useViewport();
+    const node = useFlowSelector([`node:${id}`], () => store.nodes.get(id));
+    const drag = useRef(null);
+    if (!node || node.hidden)
+        return null;
+    const show = isVisible ?? !!node.selected;
+    if (!show)
+        return null;
+    const size = store.nodeSize(id);
+    const inv = 1 / zoom;
+    const onPointerDown = (h) => (e) => {
+        if (e.button !== 0)
+            return;
+        e.stopPropagation();
+        e.preventDefault();
+        e.currentTarget.setPointerCapture?.(e.pointerId);
+        const cur = store.getNode(id);
+        const s = store.nodeSize(id);
+        drag.current = {
+            pointerId: e.pointerId,
+            startX: e.clientX,
+            startY: e.clientY,
+            startW: s.width,
+            startH: s.height,
+            startPX: cur.position.x,
+            startPY: cur.position.y,
+            handle: h,
+            ratio: s.width / s.height,
+        };
+    };
+    const onPointerMove = (e) => {
+        const d = drag.current;
+        if (!d || e.pointerId !== d.pointerId)
+            return;
+        e.stopPropagation();
+        const dx = (e.clientX - d.startX) / zoom;
+        const dy = (e.clientY - d.startY) / zoom;
+        const h = d.handle;
+        let w = d.startW;
+        let ht = d.startH;
+        let px = d.startPX;
+        let py = d.startPY;
+        const east = h.includes('e');
+        const west = h.includes('w');
+        const south = h.includes('s');
+        const north = h.includes('n');
+        if (east)
+            w = d.startW + dx;
+        if (west)
+            w = d.startW - dx;
+        if (south)
+            ht = d.startH + dy;
+        if (north)
+            ht = d.startH - dy;
+        w = Math.max(minWidth, Math.min(maxWidth, w));
+        ht = Math.max(minHeight, Math.min(maxHeight, ht));
+        if (keepAspectRatio) {
+            if (east || west)
+                ht = w / d.ratio;
+            else
+                w = ht * d.ratio;
+        }
+        // West/north grips move the origin so the opposite edge stays put.
+        if (west)
+            px = d.startPX + (d.startW - w);
+        if (north)
+            py = d.startPY + (d.startH - ht);
+        store.updateNode(id, { width: w, height: ht, position: { x: px, y: py } });
+        onResize?.({ width: w, height: ht });
+    };
+    const onPointerUp = (e) => {
+        const d = drag.current;
+        if (!d || e.pointerId !== d.pointerId)
+            return;
+        drag.current = null;
+        const s = store.nodeSize(id);
+        onResizeEnd?.({ width: s.width, height: s.height });
+    };
+    const style = color ? ({ ['--rf-resizer']: color }) : undefined;
+    return (_jsxs(_Fragment, { children: [_jsx("div", { className: "rf-resizer-outline", style: style }), HANDLES.map((h) => {
+                const pos = { position: 'absolute' };
+                if (h.includes('n'))
+                    pos.top = 0;
+                if (h.includes('s'))
+                    pos.top = size.height;
+                if (h.includes('w'))
+                    pos.left = 0;
+                if (h.includes('e'))
+                    pos.left = size.width;
+                if (h === 'n' || h === 's')
+                    pos.left = size.width / 2;
+                if (h === 'e' || h === 'w')
+                    pos.top = size.height / 2;
+                return (_jsx("div", { className: `rf-resizer-handle rf-resizer-${h}`, style: {
+                        ...pos,
+                        transform: `translate(-50%, -50%) scale(${inv})`,
+                        cursor: CURSOR[h],
+                        ...style,
+                    }, onPointerDown: onPointerDown(h), onPointerMove: onPointerMove, onPointerUp: onPointerUp, role: "slider", "aria-label": `resize ${h}` }, h));
+            })] }));
+});
+//# sourceMappingURL=NodeResizer.js.map

package/dist/NodeResizer.js.map

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

package/dist/NodeToolbar.d.ts

@@ -0,0 +1,23 @@
+import type { CSSProperties, ReactNode } from 'react';
+import type { Side } from '@realflow/core';
+export interface NodeToolbarProps {
+    /** Node to attach to. Defaults to the enclosing node. */
+    nodeId?: string;
+    /** Which side of the node to float on. Default 'top'. */
+    position?: Side;
+    /** Only show while the node is selected. Default true. */
+    isVisible?: boolean;
+    /** Gap between node and toolbar, in screen px. Default 8. */
+    offset?: number;
+    align?: 'start' | 'center' | 'end';
+    className?: string;
+    style?: CSSProperties;
+    children?: ReactNode;
+}
+/**
+ * A floating toolbar anchored to a node. Rendered inside the node but
+ * counter-scaled by 1/zoom so it stays a constant, readable size at any zoom
+ * level. Shows on selection by default — perfect for per-node actions.
+ */
+export declare const NodeToolbar: import("react").NamedExoticComponent<NodeToolbarProps>;
+//# sourceMappingURL=NodeToolbar.d.ts.map

package/dist/NodeToolbar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NodeToolbar.d.ts","sourceRoot":"","sources":["../src/NodeToolbar.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACtD,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AAI3C,MAAM,WAAW,gBAAgB;IAC/B,yDAAyD;IACzD,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,yDAAyD;IACzD,QAAQ,CAAC,EAAE,IAAI,CAAC;IAChB,0DAA0D;IAC1D,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,6DAA6D;IAC7D,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;GAIG;AACH,eAAO,MAAM,WAAW,wDAyEtB,CAAC"}

package/dist/NodeToolbar.js

@@ -0,0 +1,65 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { memo } from 'react';
+import { useFlowStore, useNodeId } from './context.js';
+import { useFlowSelector, useViewport } from './hooks.js';
+/**
+ * A floating toolbar anchored to a node. Rendered inside the node but
+ * counter-scaled by 1/zoom so it stays a constant, readable size at any zoom
+ * level. Shows on selection by default — perfect for per-node actions.
+ */
+export const NodeToolbar = memo(function NodeToolbar({ nodeId, position = 'top', isVisible, offset = 8, align = 'center', className, style, children, }) {
+    const store = useFlowStore();
+    const ctxId = useNodeId();
+    const id = nodeId ?? ctxId;
+    const { zoom } = useViewport(); // re-render on zoom to keep counter-scale exact
+    const node = useFlowSelector([`node:${id}`], () => store.nodes.get(id));
+    if (!node || node.hidden)
+        return null;
+    const show = isVisible ?? !!node.selected;
+    if (!show)
+        return null;
+    const size = store.nodeSize(id);
+    const gap = offset / zoom; // screen px → local units
+    const inv = 1 / zoom;
+    // Anchor point in node-local coords + which corner of the toolbar pins to it.
+    let left = 0;
+    let top = 0;
+    let tx = '0';
+    let ty = '0';
+    if (position === 'top' || position === 'bottom') {
+        left = align === 'start' ? 0 : align === 'end' ? size.width : size.width / 2;
+        tx = align === 'start' ? '0' : align === 'end' ? '-100%' : '-50%';
+        if (position === 'top') {
+            top = -gap;
+            ty = '-100%';
+        }
+        else {
+            top = size.height + gap;
+            ty = '0';
+        }
+    }
+    else {
+        top = size.height / 2;
+        ty = '-50%';
+        if (position === 'left') {
+            left = -gap;
+            tx = '-100%';
+        }
+        else {
+            left = size.width + gap;
+            tx = '0';
+        }
+    }
+    return (_jsx("div", { className: `rf-node-toolbar${className ? ` ${className}` : ''}`, style: {
+            position: 'absolute',
+            left,
+            top,
+            // Counter-scale so the toolbar is screen-constant size, then pin the
+            // correct corner to the anchor.
+            transform: `scale(${inv}) translate(${tx}, ${ty})`,
+            transformOrigin: `${tx === '-100%' ? '100%' : tx === '-50%' ? '50%' : '0'} ${ty === '-100%' ? '100%' : ty === '-50%' ? '50%' : '0'}`,
+            zIndex: 20,
+            ...style,
+        }, onPointerDown: (e) => e.stopPropagation(), onClick: (e) => e.stopPropagation(), children: children }));
+});
+//# sourceMappingURL=NodeToolbar.js.map

package/dist/NodeToolbar.js.map

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

package/dist/Panel.d.ts

@@ -0,0 +1,12 @@
+import type { CSSProperties, ReactNode } from 'react';
+export type PanelPosition = 'top-left' | 'top-center' | 'top-right' | 'bottom-left' | 'bottom-center' | 'bottom-right';
+export interface PanelProps {
+    position?: PanelPosition;
+    className?: string;
+    style?: CSSProperties;
+    children?: ReactNode;
+}
+/** Floating overlay container; swallows pointer events so the pane below
+ *  doesn't pan/zoom while interacting with it. */
+export declare const Panel: import("react").NamedExoticComponent<PanelProps>;
+//# sourceMappingURL=Panel.d.ts.map

package/dist/Panel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Panel.d.ts","sourceRoot":"","sources":["../src/Panel.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEtD,MAAM,MAAM,aAAa,GACrB,UAAU,GACV,YAAY,GACZ,WAAW,GACX,aAAa,GACb,eAAe,GACf,cAAc,CAAC;AAEnB,MAAM,WAAW,UAAU;IACzB,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;kDACkD;AAClD,eAAO,MAAM,KAAK,kDAmBhB,CAAC"}

package/dist/Panel.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { memo } from 'react';
+/** Floating overlay container; swallows pointer events so the pane below
+ *  doesn't pan/zoom while interacting with it. */
+export const Panel = memo(function Panel({ position = 'top-left', className, style, children, }) {
+    return (_jsx("div", { className: `rf-panel rf-panel-${position}${className ? ` ${className}` : ''}`, style: style, onPointerDown: (e) => e.stopPropagation(), onClick: (e) => e.stopPropagation(), onDoubleClick: (e) => e.stopPropagation(), onWheel: (e) => e.stopPropagation(), onContextMenu: (e) => e.stopPropagation(), children: children }));
+});
+//# sourceMappingURL=Panel.js.map

package/dist/Panel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Panel.js","sourceRoot":"","sources":["../src/Panel.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AAkB7B;kDACkD;AAClD,MAAM,CAAC,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,KAAK,CAAC,EACvC,QAAQ,GAAG,UAAU,EACrB,SAAS,EACT,KAAK,EACL,QAAQ,GACG;IACX,OAAO,CACL,cACE,SAAS,EAAE,qBAAqB,QAAQ,GAAG,SAAS,CAAC,CAAC,CAAC,IAAI,SAAS,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE,EAC7E,KAAK,EAAE,KAAK,EACZ,aAAa,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE,EACzC,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE,EACnC,aAAa,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE,EACzC,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE,EACnC,aAAa,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE,YAExC,QAAQ,GACL,CACP,CAAC;AACJ,CAAC,CAAC,CAAC"}

package/dist/ReFlow.d.ts

@@ -0,0 +1,12 @@
+import type { ReactNode } from 'react';
+import type { ReFlowProps } from './types.js';
+/**
+ * Standalone provider for using ReFlow hooks outside the <ReFlow> canvas
+ * (toolbars, sidebars, inspectors).
+ */
+export declare const ReFlowProvider: ({ children }: {
+    children: ReactNode;
+}) => React.JSX.Element;
+/** The ReFlow canvas. */
+export declare const ReFlow: import("react").NamedExoticComponent<ReFlowProps>;
+//# sourceMappingURL=ReFlow.d.ts.map

package/dist/ReFlow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReFlow.d.ts","sourceRoot":"","sources":["../src/ReFlow.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAIV,SAAS,EACV,MAAM,OAAO,CAAC;AASf,OAAO,KAAK,EAAc,WAAW,EAAE,MAAM,SAAS,CAAC;AAevD;;;GAGG;AACH,eAAO,MAAM,cAAc,GAAI,cAAc;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,KAAG,KAAK,CAAC,GAAG,CAAC,OAGhF,CAAC;AAEF,yBAAyB;AACzB,eAAO,MAAM,MAAM,mDAghBjB,CAAC"}