@bian-womp/spark-workbench 0.3.21 → 0.3.22

package/lib/cjs/src/misc/SelectionBoundOverlay.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectionBoundOverlay.d.ts","sourceRoot":"","sources":["../../../../src/misc/SelectionBoundOverlay.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,iBAAiB,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEnE,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC;IAC3C,SAAS,EAAE;QAAE,KAAK,EAAE,MAAM,EAAE,CAAC;QAAC,KAAK,EAAE,MAAM,EAAE,CAAA;KAAE,CAAC;IAChD,UAAU,EAAE,iBAAiB,CAAC,IAAI,EAAE,IAAI,CAAC,GAAG,IAAI,CAAC;IACjD,YAAY,EAAE,MAAM,CAAC;CACtB,CAgEA,CAAC"}
+{"version":3,"file":"SelectionBoundOverlay.d.ts","sourceRoot":"","sources":["../../../../src/misc/SelectionBoundOverlay.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+C,MAAM,OAAO,CAAC;AACpE,OAAO,KAAK,EAAE,iBAAiB,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEnE,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC;IAC3C,SAAS,EAAE;QAAE,KAAK,EAAE,MAAM,EAAE,CAAC;QAAC,KAAK,EAAE,MAAM,EAAE,CAAA;KAAE,CAAC;IAChD,UAAU,EAAE,iBAAiB,CAAC,IAAI,EAAE,IAAI,CAAC,GAAG,IAAI,CAAC;IACjD,YAAY,EAAE,MAAM,CAAC;CACtB,CAgGA,CAAC"}

package/lib/cjs/src/misc/WorkbenchCanvas.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WorkbenchCanvas.d.ts","sourceRoot":"","sources":["../../../../src/misc/WorkbenchCanvas.tsx"],"names":[],"mappings":"AAAA,OAAO,KAON,MAAM,OAAO,CAAC;AACf,OAAO,EAOL,iBAAiB,EACjB,IAAI,EACJ,IAAI,EACJ,KAAK,cAAc,EACpB,MAAM,eAAe,CAAC;AAEvB,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AAuB1D,MAAM,MAAM,qBAAqB,GAAG;IAClC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,WAAW,EAAE,CAAC,QAAQ,EAAE,QAAQ,KAAK,IAAI,CAAC;CAC3C,CAAC;AAEF,MAAM,WAAW,oBAAoB;IACnC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,EAAE,CAAC,MAAM,CAAC,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,OAAO,KAAK,MAAM,CAAC;IACvD,SAAS,EAAE,CAAC,MAAM,CAAC,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,OAAO,KAAK,GAAG,CAAC,OAAO,CAAC;IAC7D,kBAAkB,CAAC,EAAE,CACnB,MAAM,EAAE,MAAM,KACX;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,GAAG,SAAS,CAAC;IACnD,cAAc,CAAC,EAAE,OAAO,CACtB,IAAI,CACF,cAAc,CAAC,IAAI,EAAE,IAAI,CAAC,EACxB,OAAO,GACP,OAAO,GACP,WAAW,GACX,WAAW,GACX,yBAAyB,GACzB,QAAQ,GACR,WAAW,GACX,eAAe,GACf,eAAe,GACf,eAAe,GACf,eAAe,GACf,WAAW,CACd,CACF,GAAG;QACF,MAAM,CAAC,EAAE,CAAC,QAAQ,EAAE,iBAAiB,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,IAAI,CAAC;KAC5D,CAAC;CACH;AAED,eAAO,MAAM,wBAAwB,oGA0+BnC,CAAC;AAEH,eAAO,MAAM,eAAe,oGAA2B,CAAC"}
+{"version":3,"file":"WorkbenchCanvas.d.ts","sourceRoot":"","sources":["../../../../src/misc/WorkbenchCanvas.tsx"],"names":[],"mappings":"AAAA,OAAO,KAON,MAAM,OAAO,CAAC;AACf,OAAO,EAOL,iBAAiB,EACjB,IAAI,EACJ,IAAI,EACJ,KAAK,cAAc,EACpB,MAAM,eAAe,CAAC;AAEvB,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AAuB1D,MAAM,MAAM,qBAAqB,GAAG;IAClC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,WAAW,EAAE,CAAC,QAAQ,EAAE,QAAQ,KAAK,IAAI,CAAC;CAC3C,CAAC;AAEF,MAAM,WAAW,oBAAoB;IACnC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,EAAE,CAAC,MAAM,CAAC,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,OAAO,KAAK,MAAM,CAAC;IACvD,SAAS,EAAE,CAAC,MAAM,CAAC,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,OAAO,KAAK,GAAG,CAAC,OAAO,CAAC;IAC7D,kBAAkB,CAAC,EAAE,CACnB,MAAM,EAAE,MAAM,KACX;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,GAAG,SAAS,CAAC;IACnD,cAAc,CAAC,EAAE,OAAO,CACtB,IAAI,CACF,cAAc,CAAC,IAAI,EAAE,IAAI,CAAC,EACxB,OAAO,GACP,OAAO,GACP,WAAW,GACX,WAAW,GACX,yBAAyB,GACzB,QAAQ,GACR,WAAW,GACX,eAAe,GACf,eAAe,GACf,eAAe,GACf,eAAe,GACf,WAAW,CACd,CACF,GAAG;QACF,MAAM,CAAC,EAAE,CAAC,QAAQ,EAAE,iBAAiB,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,IAAI,CAAC;KAC5D,CAAC;CACH;AAED,eAAO,MAAM,wBAAwB,oGA6+BnC,CAAC;AAEH,eAAO,MAAM,eAAe,oGAA2B,CAAC"}

package/lib/esm/index.js

@@ -5794,9 +5794,31 @@ function useKeyboardShortcutToast() {
 }
 
 const SelectionBoundOverlay = ({ selection, rfInstance, viewportTick }) => {
+    const overlayRef = useRef(null);
+    const [parentRect, setParentRect] = useState(null);
+    useEffect(() => {
+        if (!overlayRef.current)
+            return;
+        const parent = overlayRef.current.parentElement;
+        if (!parent)
+            return;
+        const updateRect = () => {
+            setParentRect(parent.getBoundingClientRect());
+        };
+        updateRect();
+        const resizeObserver = new ResizeObserver(updateRect);
+        resizeObserver.observe(parent);
+        const scrollHandler = () => updateRect();
+        window.addEventListener("scroll", scrollHandler, true);
+        return () => {
+            resizeObserver.disconnect();
+            window.removeEventListener("scroll", scrollHandler, true);
+        };
+    }, [viewportTick]);
     const selectionBounds = useMemo(() => {
         if (typeof document === "undefined" ||
             !rfInstance ||
+            !parentRect ||
             selection.nodes.length < 2) {
             return null;
         }
@@ -5806,31 +5828,35 @@ const SelectionBoundOverlay = ({ selection, rfInstance, viewportTick }) => {
             if (!el)
                 continue;
             const rect = el.getBoundingClientRect();
+            const relativeLeft = rect.left - parentRect.left;
+            const relativeTop = rect.top - parentRect.top;
+            const relativeRight = rect.right - parentRect.left;
+            const relativeBottom = rect.bottom - parentRect.top;
             if (!bounds) {
                 bounds = {
-                    left: rect.left,
-                    top: rect.top,
-                    right: rect.right,
-                    bottom: rect.bottom,
+                    left: relativeLeft,
+                    top: relativeTop,
+                    right: relativeRight,
+                    bottom: relativeBottom,
                 };
             }
             else {
-                bounds.left = Math.min(bounds.left, rect.left);
-                bounds.top = Math.min(bounds.top, rect.top);
-                bounds.right = Math.max(bounds.right, rect.right);
-                bounds.bottom = Math.max(bounds.bottom, rect.bottom);
+                bounds.left = Math.min(bounds.left, relativeLeft);
+                bounds.top = Math.min(bounds.top, relativeTop);
+                bounds.right = Math.max(bounds.right, relativeRight);
+                bounds.bottom = Math.max(bounds.bottom, relativeBottom);
             }
         }
         return bounds;
-    }, [selection.nodes, rfInstance, viewportTick]);
+    }, [selection.nodes, rfInstance, viewportTick, parentRect]);
     if (!selectionBounds || selection.nodes.length < 2) {
-        return null;
+        return jsx("div", { ref: overlayRef, style: { display: "none" } });
     }
     const { left, top, right, bottom } = selectionBounds;
     const width = right - left;
     const height = bottom - top;
-    return (jsx("div", { style: {
-            position: "fixed",
+    return (jsx("div", { ref: overlayRef, style: {
+            position: "absolute",
             left: `${left}px`,
             top: `${top}px`,
             width: `${width}px`,
@@ -6493,7 +6519,7 @@ const WorkbenchCanvasComponent = React.forwardRef((props, ref) => {
         return () => off();
     }, [wb]);
     const { onInit: userOnInit, ...restReactFlowProps } = reactFlowProps || {};
-    return (jsxs("div", { className: "w-full h-full", onContextMenu: onContextMenu, children: [jsxs(ReactFlowProvider, { children: [jsxs(ReactFlow, { ...restReactFlowProps, nodes: throttled.nodes, edges: throttled.edges, nodeTypes: nodeTypes, edgeTypes: edgeTypes, connectionLineComponent: connectionLineRenderer, selectionOnDrag: true, onInit: (inst) => {
+    return (jsxs("div", { className: "w-full h-full relative overflow-hidden", onContextMenu: onContextMenu, children: [jsxs(ReactFlowProvider, { children: [jsxs(ReactFlow, { ...restReactFlowProps, nodes: throttled.nodes, edges: throttled.edges, nodeTypes: nodeTypes, edgeTypes: edgeTypes, connectionLineComponent: connectionLineRenderer, selectionOnDrag: true, onInit: (inst) => {
                             rfInstanceRef.current = inst;
                             const savedViewport = wb.getViewport();
                             if (savedViewport) {