@uipath/apollo-react 4.45.1 → 4.47.0

package/dist/canvas/components/Edges/shared/hooks/useEdgeGeometry.js

@@ -0,0 +1,69 @@
+import { useMemo } from "react";
+import { useEdgePath } from "../../../../hooks/index.js";
+import { ARROW_ANGLE_MAP, ARROW_OFFSETS, EDGE_CONSTANTS } from "../constants.js";
+import { buildPathVertices, createRoundedPath, extractSegments, getPathArcMidpoint } from "../geometry.js";
+const EMPTY_VERTICES = [];
+const EMPTY_SEGMENTS = [];
+function useEdgeGeometry(args) {
+    const { routing, sourceNodeId, targetNodeId, sourceHandleId, targetHandleId, sourceX, sourceY, sourcePosition, targetX, targetY, targetPosition, waypoints, enableSegments = true, hideArrowHead = false } = args;
+    const arrowOffset = ARROW_OFFSETS[targetPosition];
+    const isWaypoint = 'waypoint' === routing;
+    const isHandle = 'handle' === routing;
+    const pathPoints = useMemo(()=>isWaypoint ? buildPathVertices(sourceX, sourceY, sourcePosition, targetX, targetY, targetPosition, waypoints) : EMPTY_VERTICES, [
+        isWaypoint,
+        sourceX,
+        sourceY,
+        sourcePosition,
+        targetX,
+        targetY,
+        targetPosition,
+        waypoints
+    ]);
+    const segments = useMemo(()=>enableSegments ? extractSegments(pathPoints) : EMPTY_SEGMENTS, [
+        enableSegments,
+        pathPoints
+    ]);
+    const waypointPath = useMemo(()=>createRoundedPath(pathPoints, EDGE_CONSTANTS.BORDER_RADIUS), [
+        pathPoints
+    ]);
+    const handle = useEdgePath({
+        sourceNodeId: isHandle ? sourceNodeId : '',
+        targetNodeId: isHandle ? targetNodeId : '',
+        sourceHandleId: isHandle ? sourceHandleId : null,
+        targetHandleId: isHandle ? targetHandleId : null,
+        sourceX: isHandle ? sourceX : 0,
+        sourceY: isHandle ? sourceY : 0,
+        sourcePosition,
+        targetX: isHandle ? hideArrowHead ? targetX + arrowOffset.x : targetX : 0,
+        targetY: isHandle ? hideArrowHead ? targetY + arrowOffset.y : targetY : 0,
+        targetPosition
+    });
+    const labelPoint = useMemo(()=>isHandle ? {
+            x: handle.labelX,
+            y: handle.labelY
+        } : getPathArcMidpoint(pathPoints), [
+        isHandle,
+        handle.labelX,
+        handle.labelY,
+        pathPoints
+    ]);
+    const arrow = {
+        angle: ARROW_ANGLE_MAP[targetPosition],
+        offset: arrowOffset
+    };
+    if (isHandle) return {
+        edgePath: handle.edgePath,
+        pathPoints: EMPTY_VERTICES,
+        segments: EMPTY_SEGMENTS,
+        labelPoint,
+        arrow
+    };
+    return {
+        edgePath: waypointPath,
+        pathPoints,
+        segments,
+        labelPoint,
+        arrow
+    };
+}
+export { useEdgeGeometry };

package/dist/canvas/components/Edges/shared/hooks/useEdgeWaypointWriter.cjs

@@ -0,0 +1,69 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    useEdgeWaypointWriter: ()=>useEdgeWaypointWriter
+});
+const react_cjs_namespaceObject = require("../../../../xyflow/react.cjs");
+const external_react_namespaceObject = require("react");
+const external_waypoints_cjs_namespaceObject = require("../waypoints.cjs");
+function useEdgeWaypointWriter(edgeId, onChange) {
+    const { setEdges } = (0, react_cjs_namespaceObject.useReactFlow)();
+    const onChangeRef = (0, external_react_namespaceObject.useRef)(onChange);
+    (0, external_react_namespaceObject.useEffect)(()=>{
+        onChangeRef.current = onChange;
+    });
+    return (0, external_react_namespaceObject.useCallback)((next)=>{
+        const consumer = onChangeRef.current;
+        if (consumer) return void consumer(next);
+        setEdges((edges)=>{
+            let changed = false;
+            const updated = edges.map((edge)=>{
+                if (edge.id !== edgeId) return edge;
+                const current = edge.data?.waypoints ?? [];
+                if ((0, external_waypoints_cjs_namespaceObject.waypointsEqual)(current, next)) return edge;
+                changed = true;
+                return {
+                    ...edge,
+                    data: {
+                        ...edge.data,
+                        waypoints: next
+                    }
+                };
+            });
+            return changed ? updated : edges;
+        });
+    }, [
+        edgeId,
+        setEdges
+    ]);
+}
+exports.useEdgeWaypointWriter = __webpack_exports__.useEdgeWaypointWriter;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "useEdgeWaypointWriter"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/canvas/components/Edges/shared/hooks/useEdgeWaypointWriter.d.ts

@@ -0,0 +1,3 @@
+import type { Waypoint } from '../types';
+export declare function useEdgeWaypointWriter(edgeId: string, onChange?: (next: Waypoint[]) => void): (next: Waypoint[]) => void;
+//# sourceMappingURL=useEdgeWaypointWriter.d.ts.map

package/dist/canvas/components/Edges/shared/hooks/useEdgeWaypointWriter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useEdgeWaypointWriter.d.ts","sourceRoot":"","sources":["../../../../../../src/canvas/components/Edges/shared/hooks/useEdgeWaypointWriter.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AAYzC,wBAAgB,qBAAqB,CACnC,MAAM,EAAE,MAAM,EACd,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,IAAI,GACpC,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,IAAI,CA4B5B"}

package/dist/canvas/components/Edges/shared/hooks/useEdgeWaypointWriter.js

@@ -0,0 +1,35 @@
+import { useReactFlow } from "../../../../xyflow/react.js";
+import { useCallback, useEffect, useRef } from "react";
+import { waypointsEqual } from "../waypoints.js";
+function useEdgeWaypointWriter(edgeId, onChange) {
+    const { setEdges } = useReactFlow();
+    const onChangeRef = useRef(onChange);
+    useEffect(()=>{
+        onChangeRef.current = onChange;
+    });
+    return useCallback((next)=>{
+        const consumer = onChangeRef.current;
+        if (consumer) return void consumer(next);
+        setEdges((edges)=>{
+            let changed = false;
+            const updated = edges.map((edge)=>{
+                if (edge.id !== edgeId) return edge;
+                const current = edge.data?.waypoints ?? [];
+                if (waypointsEqual(current, next)) return edge;
+                changed = true;
+                return {
+                    ...edge,
+                    data: {
+                        ...edge.data,
+                        waypoints: next
+                    }
+                };
+            });
+            return changed ? updated : edges;
+        });
+    }, [
+        edgeId,
+        setEdges
+    ]);
+}
+export { useEdgeWaypointWriter };

package/dist/canvas/components/Edges/shared/hooks/useExecutionEdge.cjs

@@ -0,0 +1,57 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    useExecutionEdge: ()=>useExecutionEdge
+});
+const external_react_namespaceObject = require("react");
+const index_cjs_namespaceObject = require("../../../../hooks/index.cjs");
+const external_EdgeUtils_cjs_namespaceObject = require("../../EdgeUtils.cjs");
+function resolveStatus(executionState, validation) {
+    if (executionState) return executionState?.status ?? executionState;
+    return validation?.validationStatus;
+}
+function useExecutionEdge(args) {
+    const { edgeId, target, edgePath, enabled } = args;
+    const executionState = (0, index_cjs_namespaceObject.useEdgeExecutionState)(edgeId, target);
+    const validation = (0, index_cjs_namespaceObject.useElementValidationStatus)(edgeId);
+    const status = enabled ? resolveStatus(executionState, validation) : void 0;
+    const statusColor = status ? external_EdgeUtils_cjs_namespaceObject.edgeTargetStatusToEdgeColor[status] : void 0;
+    const animation = (0, external_react_namespaceObject.useMemo)(()=>(0, external_EdgeUtils_cjs_namespaceObject.getStatusAnimation)(status, edgePath), [
+        status,
+        edgePath
+    ]);
+    return {
+        statusColor,
+        animation
+    };
+}
+exports.useExecutionEdge = __webpack_exports__.useExecutionEdge;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "useExecutionEdge"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/canvas/components/Edges/shared/hooks/useExecutionEdge.d.ts

@@ -0,0 +1,13 @@
+import { type ReactNode } from 'react';
+export type UseExecutionEdgeArgs = {
+    edgeId: string;
+    target: string;
+    edgePath: string;
+    enabled: boolean;
+};
+export type ExecutionEdge = {
+    statusColor: string | undefined;
+    animation: ReactNode;
+};
+export declare function useExecutionEdge(args: UseExecutionEdgeArgs): ExecutionEdge;
+//# sourceMappingURL=useExecutionEdge.d.ts.map

package/dist/canvas/components/Edges/shared/hooks/useExecutionEdge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useExecutionEdge.d.ts","sourceRoot":"","sources":["../../../../../../src/canvas/components/Edges/shared/hooks/useExecutionEdge.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAW,MAAM,OAAO,CAAC;AAMhD,MAAM,MAAM,oBAAoB,GAAG;IACjC,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IAEf,QAAQ,EAAE,MAAM,CAAC;IAEjB,OAAO,EAAE,OAAO,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG;IAC1B,WAAW,EAAE,MAAM,GAAG,SAAS,CAAC;IAChC,SAAS,EAAE,SAAS,CAAC;CACtB,CAAC;AAeF,wBAAgB,gBAAgB,CAAC,IAAI,EAAE,oBAAoB,GAAG,aAAa,CAW1E"}

package/dist/canvas/components/Edges/shared/hooks/useExecutionEdge.js

@@ -0,0 +1,23 @@
+import { useMemo } from "react";
+import { useEdgeExecutionState, useElementValidationStatus } from "../../../../hooks/index.js";
+import { edgeTargetStatusToEdgeColor, getStatusAnimation } from "../../EdgeUtils.js";
+function resolveStatus(executionState, validation) {
+    if (executionState) return executionState?.status ?? executionState;
+    return validation?.validationStatus;
+}
+function useExecutionEdge(args) {
+    const { edgeId, target, edgePath, enabled } = args;
+    const executionState = useEdgeExecutionState(edgeId, target);
+    const validation = useElementValidationStatus(edgeId);
+    const status = enabled ? resolveStatus(executionState, validation) : void 0;
+    const statusColor = status ? edgeTargetStatusToEdgeColor[status] : void 0;
+    const animation = useMemo(()=>getStatusAnimation(status, edgePath), [
+        status,
+        edgePath
+    ]);
+    return {
+        statusColor,
+        animation
+    };
+}
+export { useExecutionEdge };

package/dist/canvas/components/Edges/shared/hooks/useNodeDragRebalance.cjs

@@ -0,0 +1,98 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    useNodeDragRebalance: ()=>useNodeDragRebalance
+});
+const react_cjs_namespaceObject = require("../../../../xyflow/react.cjs");
+const external_react_namespaceObject = require("react");
+const external_waypoints_cjs_namespaceObject = require("../waypoints.cjs");
+const external_useEdgeWaypointWriter_cjs_namespaceObject = require("./useEdgeWaypointWriter.cjs");
+function useNodeDragRebalance(args) {
+    const { edgeId, source, target, sourceX, sourceY, sourcePosition, targetX, targetY, targetPosition, waypoints, enabled, onChange } = args;
+    const dragging = (0, react_cjs_namespaceObject.useStore)((state)=>enabled && !!(state.nodeLookup.get(source)?.dragging || state.nodeLookup.get(target)?.dragging));
+    const write = (0, external_useEdgeWaypointWriter_cjs_namespaceObject.useEdgeWaypointWriter)(edgeId, onChange);
+    const baselineRef = (0, external_react_namespaceObject.useRef)({
+        s: {
+            x: sourceX,
+            y: sourceY
+        },
+        t: {
+            x: targetX,
+            y: targetY
+        },
+        waypoints
+    });
+    const lastRebalancedRef = (0, external_react_namespaceObject.useRef)(null);
+    const prevDraggingRef = (0, external_react_namespaceObject.useRef)(false);
+    const active = enabled && dragging && waypoints.length > 0;
+    if (!dragging) baselineRef.current = {
+        s: {
+            x: sourceX,
+            y: sourceY
+        },
+        t: {
+            x: targetX,
+            y: targetY
+        },
+        waypoints
+    };
+    let display = waypoints;
+    if (active) {
+        const { s, t, waypoints: w0 } = baselineRef.current;
+        display = (0, external_waypoints_cjs_namespaceObject.rebalanceWaypoints)(w0, {
+            position: sourcePosition,
+            from: s,
+            to: {
+                x: sourceX,
+                y: sourceY
+            }
+        }, {
+            position: targetPosition,
+            from: t,
+            to: {
+                x: targetX,
+                y: targetY
+            }
+        });
+        lastRebalancedRef.current = display;
+    }
+    (0, external_react_namespaceObject.useLayoutEffect)(()=>{
+        const wasDragging = prevDraggingRef.current;
+        prevDraggingRef.current = dragging;
+        if (!wasDragging || dragging) return;
+        const final = lastRebalancedRef.current;
+        lastRebalancedRef.current = null;
+        if (enabled && final && !(0, external_waypoints_cjs_namespaceObject.waypointsEqual)(waypoints, final)) write(final);
+    });
+    return display;
+}
+exports.useNodeDragRebalance = __webpack_exports__.useNodeDragRebalance;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "useNodeDragRebalance"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/canvas/components/Edges/shared/hooks/useNodeDragRebalance.d.ts

@@ -0,0 +1,18 @@
+import { type Position } from '../../../../xyflow/react.ts';
+import type { Waypoint } from '../types';
+export type UseNodeDragRebalanceArgs = {
+    edgeId: string;
+    source: string;
+    target: string;
+    sourceX: number;
+    sourceY: number;
+    sourcePosition: Position;
+    targetX: number;
+    targetY: number;
+    targetPosition: Position;
+    waypoints: Waypoint[];
+    enabled: boolean;
+    onChange?: (next: Waypoint[]) => void;
+};
+export declare function useNodeDragRebalance(args: UseNodeDragRebalanceArgs): Waypoint[];
+//# sourceMappingURL=useNodeDragRebalance.d.ts.map

package/dist/canvas/components/Edges/shared/hooks/useNodeDragRebalance.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useNodeDragRebalance.d.ts","sourceRoot":"","sources":["../../../../../../src/canvas/components/Edges/shared/hooks/useNodeDragRebalance.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,QAAQ,EAGd,MAAM,0CAA0C,CAAC;AAElD,OAAO,KAAK,EAAS,QAAQ,EAAE,MAAM,UAAU,CAAC;AAIhD,MAAM,MAAM,wBAAwB,GAAG;IACrC,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IAEf,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,cAAc,EAAE,QAAQ,CAAC;IACzB,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,cAAc,EAAE,QAAQ,CAAC;IACzB,SAAS,EAAE,QAAQ,EAAE,CAAC;IAEtB,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,IAAI,CAAC;CACvC,CAAC;AAYF,wBAAgB,oBAAoB,CAAC,IAAI,EAAE,wBAAwB,GAAG,QAAQ,EAAE,CA2E/E"}

package/dist/canvas/components/Edges/shared/hooks/useNodeDragRebalance.js

@@ -0,0 +1,64 @@
+import { useStore } from "../../../../xyflow/react.js";
+import { useLayoutEffect, useRef } from "react";
+import { rebalanceWaypoints, waypointsEqual } from "../waypoints.js";
+import { useEdgeWaypointWriter } from "./useEdgeWaypointWriter.js";
+function useNodeDragRebalance(args) {
+    const { edgeId, source, target, sourceX, sourceY, sourcePosition, targetX, targetY, targetPosition, waypoints, enabled, onChange } = args;
+    const dragging = useStore((state)=>enabled && !!(state.nodeLookup.get(source)?.dragging || state.nodeLookup.get(target)?.dragging));
+    const write = useEdgeWaypointWriter(edgeId, onChange);
+    const baselineRef = useRef({
+        s: {
+            x: sourceX,
+            y: sourceY
+        },
+        t: {
+            x: targetX,
+            y: targetY
+        },
+        waypoints
+    });
+    const lastRebalancedRef = useRef(null);
+    const prevDraggingRef = useRef(false);
+    const active = enabled && dragging && waypoints.length > 0;
+    if (!dragging) baselineRef.current = {
+        s: {
+            x: sourceX,
+            y: sourceY
+        },
+        t: {
+            x: targetX,
+            y: targetY
+        },
+        waypoints
+    };
+    let display = waypoints;
+    if (active) {
+        const { s, t, waypoints: w0 } = baselineRef.current;
+        display = rebalanceWaypoints(w0, {
+            position: sourcePosition,
+            from: s,
+            to: {
+                x: sourceX,
+                y: sourceY
+            }
+        }, {
+            position: targetPosition,
+            from: t,
+            to: {
+                x: targetX,
+                y: targetY
+            }
+        });
+        lastRebalancedRef.current = display;
+    }
+    useLayoutEffect(()=>{
+        const wasDragging = prevDraggingRef.current;
+        prevDraggingRef.current = dragging;
+        if (!wasDragging || dragging) return;
+        const final = lastRebalancedRef.current;
+        lastRebalancedRef.current = null;
+        if (enabled && final && !waypointsEqual(waypoints, final)) write(final);
+    });
+    return display;
+}
+export { useNodeDragRebalance };

package/dist/canvas/components/Edges/shared/hooks/useWaypointEditor.cjs

@@ -0,0 +1,184 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    useWaypointEditor: ()=>useWaypointEditor
+});
+const react_cjs_namespaceObject = require("../../../../xyflow/react.cjs");
+const external_react_namespaceObject = require("react");
+const external_geometry_cjs_namespaceObject = require("../geometry.cjs");
+const external_waypoints_cjs_namespaceObject = require("../waypoints.cjs");
+const external_useEdgeWaypointWriter_cjs_namespaceObject = require("./useEdgeWaypointWriter.cjs");
+function useWaypointEditor(args) {
+    const { edgeId, waypoints, pathPoints, enabled, onChange } = args;
+    const { screenToFlowPosition } = (0, react_cjs_namespaceObject.useReactFlow)();
+    const writeWaypoints = (0, external_useEdgeWaypointWriter_cjs_namespaceObject.useEdgeWaypointWriter)(edgeId, onChange);
+    const [dragState, setDragState] = (0, external_react_namespaceObject.useState)({
+        type: 'none'
+    });
+    const dragStartRef = (0, external_react_namespaceObject.useRef)(null);
+    const rafRef = (0, external_react_namespaceObject.useRef)(null);
+    const waypointsRef = (0, external_react_namespaceObject.useRef)(waypoints);
+    const pathPointsRef = (0, external_react_namespaceObject.useRef)(pathPoints);
+    (0, external_react_namespaceObject.useEffect)(()=>{
+        waypointsRef.current = waypoints;
+        pathPointsRef.current = pathPoints;
+    });
+    const updateWaypoints = (0, external_react_namespaceObject.useCallback)((next)=>{
+        if ((0, external_waypoints_cjs_namespaceObject.waypointsEqual)(waypointsRef.current, next)) return;
+        writeWaypoints(next);
+    }, [
+        writeWaypoints
+    ]);
+    (0, external_react_namespaceObject.useEffect)(()=>{
+        if (!enabled || 'none' === dragState.type) return;
+        const handleMouseMove = (e)=>{
+            if (!dragStartRef.current) return;
+            if (null !== rafRef.current) cancelAnimationFrame(rafRef.current);
+            rafRef.current = requestAnimationFrame(()=>{
+                const start = screenToFlowPosition(dragStartRef.current, {
+                    snapToGrid: false
+                });
+                const current = screenToFlowPosition({
+                    x: e.clientX,
+                    y: e.clientY
+                }, {
+                    snapToGrid: false
+                });
+                const delta = {
+                    x: current.x - start.x,
+                    y: current.y - start.y
+                };
+                if ('waypoint' === dragState.type) {
+                    const initial = dragState.initialWaypoints[dragState.waypointIndex];
+                    if (!initial) return;
+                    updateWaypoints((0, external_waypoints_cjs_namespaceObject.moveWaypoint)(dragState.initialWaypoints, dragState.waypointIndex, {
+                        x: initial.x + delta.x,
+                        y: initial.y + delta.y
+                    }));
+                } else if ('segment' === dragState.type) updateWaypoints((0, external_waypoints_cjs_namespaceObject.moveSegmentByDelta)(dragState.initialWaypoints, dragState.segment, delta, dragState.initialPathPoints));
+            });
+        };
+        const handleMouseUp = ()=>{
+            if (null !== rafRef.current) {
+                cancelAnimationFrame(rafRef.current);
+                rafRef.current = null;
+            }
+            setDragState({
+                type: 'none'
+            });
+            dragStartRef.current = null;
+        };
+        window.addEventListener('mousemove', handleMouseMove);
+        window.addEventListener('mouseup', handleMouseUp);
+        return ()=>{
+            window.removeEventListener('mousemove', handleMouseMove);
+            window.removeEventListener('mouseup', handleMouseUp);
+            if (null !== rafRef.current) cancelAnimationFrame(rafRef.current);
+        };
+    }, [
+        enabled,
+        dragState,
+        updateWaypoints,
+        screenToFlowPosition
+    ]);
+    const waypointHandlers = (0, external_react_namespaceObject.useMemo)(()=>({
+            onMouseDown: (index, e)=>{
+                if (!enabled) return;
+                e.stopPropagation();
+                e.preventDefault();
+                dragStartRef.current = {
+                    x: e.clientX,
+                    y: e.clientY
+                };
+                setDragState({
+                    type: 'waypoint',
+                    waypointIndex: index,
+                    initialWaypoints: [
+                        ...waypointsRef.current
+                    ]
+                });
+            },
+            onDoubleClick: (index)=>{
+                if (!enabled) return;
+                updateWaypoints((0, external_waypoints_cjs_namespaceObject.removeWaypoint)(waypointsRef.current, index));
+            }
+        }), [
+        enabled,
+        updateWaypoints
+    ]);
+    const segmentHandlers = (0, external_react_namespaceObject.useMemo)(()=>({
+            onMouseDown: (segment, e)=>{
+                if (!enabled) return;
+                e.stopPropagation();
+                e.preventDefault();
+                dragStartRef.current = {
+                    x: e.clientX,
+                    y: e.clientY
+                };
+                const materialized = (0, external_waypoints_cjs_namespaceObject.materializePathWaypoints)(pathPointsRef.current, waypointsRef.current);
+                setDragState({
+                    type: 'segment',
+                    segment,
+                    initialWaypoints: materialized,
+                    initialPathPoints: [
+                        ...pathPointsRef.current
+                    ]
+                });
+            },
+            onDoubleClick: (segmentIndex, e)=>{
+                if (!enabled) return;
+                e.stopPropagation();
+                e.preventDefault();
+                const flowPoint = screenToFlowPosition({
+                    x: e.clientX,
+                    y: e.clientY
+                });
+                const snapped = (0, external_geometry_cjs_namespaceObject.snapPointToGrid)(flowPoint);
+                updateWaypoints((0, external_waypoints_cjs_namespaceObject.insertWaypoint)(pathPointsRef.current, waypointsRef.current, segmentIndex, snapped));
+            }
+        }), [
+        enabled,
+        screenToFlowPosition,
+        updateWaypoints
+    ]);
+    const isDragging = enabled && 'none' !== dragState.type;
+    return (0, external_react_namespaceObject.useMemo)(()=>({
+            isDragging,
+            waypointHandlers,
+            segmentHandlers
+        }), [
+        isDragging,
+        waypointHandlers,
+        segmentHandlers
+    ]);
+}
+exports.useWaypointEditor = __webpack_exports__.useWaypointEditor;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "useWaypointEditor"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/canvas/components/Edges/shared/hooks/useWaypointEditor.d.ts

@@ -0,0 +1,23 @@
+import type { PathVertex, Segment, Waypoint } from '../types';
+export type UseWaypointEditorArgs = {
+    edgeId: string;
+    waypoints: Waypoint[];
+    pathPoints: PathVertex[];
+    enabled: boolean;
+    onChange?: (next: Waypoint[]) => void;
+};
+export type WaypointHandlers = {
+    onMouseDown: (index: number, e: React.MouseEvent) => void;
+    onDoubleClick: (index: number) => void;
+};
+export type SegmentHandlers = {
+    onMouseDown: (segment: Segment, e: React.MouseEvent) => void;
+    onDoubleClick: (segmentIndex: number, e: React.MouseEvent) => void;
+};
+export type WaypointEditor = {
+    isDragging: boolean;
+    waypointHandlers: WaypointHandlers;
+    segmentHandlers: SegmentHandlers;
+};
+export declare function useWaypointEditor(args: UseWaypointEditorArgs): WaypointEditor;
+//# sourceMappingURL=useWaypointEditor.d.ts.map