@uipath/apollo-react 4.46.0 → 4.47.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/canvas/components/ButtonHandle/ButtonHandle.cjs +2 -1
- package/dist/canvas/components/ButtonHandle/ButtonHandle.d.ts.map +1 -1
- package/dist/canvas/components/ButtonHandle/ButtonHandle.js +2 -1
- package/dist/canvas/components/ButtonHandle/ButtonHandleStyleUtils.cjs +0 -33
- package/dist/canvas/components/ButtonHandle/ButtonHandleStyleUtils.d.ts +0 -2
- package/dist/canvas/components/ButtonHandle/ButtonHandleStyleUtils.d.ts.map +1 -1
- package/dist/canvas/components/ButtonHandle/ButtonHandleStyleUtils.js +1 -28
- package/dist/canvas/components/ButtonHandle/SmartHandle.cjs +2 -1
- package/dist/canvas/components/ButtonHandle/SmartHandle.d.ts.map +1 -1
- package/dist/canvas/components/ButtonHandle/SmartHandle.js +2 -1
- package/dist/canvas/styles/tailwind.canvas.css +1 -1
- package/dist/canvas/utils/handle-positioning.cjs +62 -0
- package/dist/canvas/utils/handle-positioning.d.ts +2 -0
- package/dist/canvas/utils/handle-positioning.d.ts.map +1 -0
- package/dist/canvas/utils/handle-positioning.js +28 -0
- package/dist/canvas/utils/index.cjs +21 -14
- package/dist/canvas/utils/index.d.ts +1 -0
- package/dist/canvas/utils/index.d.ts.map +1 -1
- package/dist/canvas/utils/index.js +1 -0
- package/package.json +2 -2
|
@@ -32,6 +32,7 @@ const react_cjs_namespaceObject = require("../../xyflow/react.cjs");
|
|
|
32
32
|
const external_react_namespaceObject = require("react");
|
|
33
33
|
const CanvasEventBus_cjs_namespaceObject = require("../../utils/CanvasEventBus.cjs");
|
|
34
34
|
const CssUtil_cjs_namespaceObject = require("../../utils/CssUtil.cjs");
|
|
35
|
+
const handle_positioning_cjs_namespaceObject = require("../../utils/handle-positioning.cjs");
|
|
35
36
|
const external_ButtonHandleLayoutUtils_cjs_namespaceObject = require("./ButtonHandleLayoutUtils.cjs");
|
|
36
37
|
const external_ButtonHandleStyleUtils_cjs_namespaceObject = require("./ButtonHandleStyleUtils.cjs");
|
|
37
38
|
const external_HandleButton_cjs_namespaceObject = require("./HandleButton.cjs");
|
|
@@ -68,7 +69,7 @@ const ButtonHandleBase = ({ id, nodeId, type, position, connectionPosition = pos
|
|
|
68
69
|
const positionPercent = (0, external_react_namespaceObject.useMemo)(()=>{
|
|
69
70
|
const relevantSize = isVertical ? nodeWidth : nodeHeight;
|
|
70
71
|
if (relevantSize && relevantSize > 0) {
|
|
71
|
-
const gridPositions = (0,
|
|
72
|
+
const gridPositions = (0, handle_positioning_cjs_namespaceObject.calculateGridAlignedHandlePositions)(relevantSize, total);
|
|
72
73
|
const pixelPosition = gridPositions[index] ?? relevantSize / 2;
|
|
73
74
|
return (0, external_ButtonHandleStyleUtils_cjs_namespaceObject.pixelToPercent)(pixelPosition, relevantSize);
|
|
74
75
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonHandle.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/ButtonHandle/ButtonHandle.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAU,QAAQ,EAAE,MAAM,0CAA0C,CAAC;AAE5E,OAAO,KAAK,EAAE,mCAAmC,EAAE,MAAM,qCAAqC,CAAC;
|
|
1
|
+
{"version":3,"file":"ButtonHandle.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/ButtonHandle/ButtonHandle.tsx"],"names":[],"mappings":"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"}
|
|
@@ -3,8 +3,9 @@ import { Handle, Position } from "../../xyflow/react.js";
|
|
|
3
3
|
import { memo, useCallback, useMemo, useRef, useState } from "react";
|
|
4
4
|
import { canvasEventBus } from "../../utils/CanvasEventBus.js";
|
|
5
5
|
import { cx } from "../../utils/CssUtil.js";
|
|
6
|
+
import { calculateGridAlignedHandlePositions } from "../../utils/handle-positioning.js";
|
|
6
7
|
import { getHandleActionPortal, getInwardHandleLayout } from "./ButtonHandleLayoutUtils.js";
|
|
7
|
-
import {
|
|
8
|
+
import { pixelToPercent } from "./ButtonHandleStyleUtils.js";
|
|
8
9
|
import { HandleButton, HandleHoverBridge } from "./HandleButton.js";
|
|
9
10
|
import { HandleLabel } from "./HandleLabel.js";
|
|
10
11
|
import { HandleNotch } from "./HandleNotch.js";
|
|
@@ -27,48 +27,19 @@ __webpack_require__.d(__webpack_exports__, {
|
|
|
27
27
|
leftPositionForHandle: ()=>leftPositionForHandle,
|
|
28
28
|
topPositionForHandle: ()=>topPositionForHandle,
|
|
29
29
|
transformForHandle: ()=>transformForHandle,
|
|
30
|
-
snapToGrid: ()=>snapToGrid,
|
|
31
30
|
HANDLE_CROSS_AXIS_SIZE_PX: ()=>HANDLE_CROSS_AXIS_SIZE_PX,
|
|
32
31
|
heightForHandleWithPosition: ()=>heightForHandleWithPosition,
|
|
33
32
|
HANDLE_EDGE_COVERAGE_RATIO: ()=>HANDLE_EDGE_COVERAGE_RATIO,
|
|
34
33
|
bottomPositionForHandle: ()=>bottomPositionForHandle,
|
|
35
|
-
calculateGridAlignedHandlePositions: ()=>calculateGridAlignedHandlePositions,
|
|
36
34
|
pixelToPercent: ()=>pixelToPercent,
|
|
37
35
|
rightPositionForHandle: ()=>rightPositionForHandle,
|
|
38
36
|
widthForHandleWithPosition: ()=>widthForHandleWithPosition
|
|
39
37
|
});
|
|
40
38
|
const react_cjs_namespaceObject = require("../../xyflow/react.cjs");
|
|
41
|
-
const external_constants_cjs_namespaceObject = require("../../constants.cjs");
|
|
42
39
|
const isHorizontalEdge = (position)=>position === react_cjs_namespaceObject.Position.Top || position === react_cjs_namespaceObject.Position.Bottom;
|
|
43
40
|
const isVerticalEdge = (position)=>position === react_cjs_namespaceObject.Position.Left || position === react_cjs_namespaceObject.Position.Right;
|
|
44
41
|
const HANDLE_CROSS_AXIS_SIZE_PX = 24;
|
|
45
42
|
const HANDLE_EDGE_COVERAGE_RATIO = 0.5;
|
|
46
|
-
const snapToGrid = (value, gridSize = external_constants_cjs_namespaceObject.GRID_SPACING)=>Math.round(value / gridSize) * gridSize;
|
|
47
|
-
const calculateGridAlignedHandlePositions = (nodeSize, numHandles, gridSize = external_constants_cjs_namespaceObject.GRID_SPACING)=>{
|
|
48
|
-
if (0 === numHandles) return [];
|
|
49
|
-
if (nodeSize <= 0) return [];
|
|
50
|
-
if (1 === numHandles) return [
|
|
51
|
-
snapToGrid(nodeSize / 2, gridSize)
|
|
52
|
-
];
|
|
53
|
-
const idealSpacing = nodeSize / (numHandles + 1);
|
|
54
|
-
if (nodeSize % gridSize !== 0) {
|
|
55
|
-
const positions = [];
|
|
56
|
-
for(let i = 0; i < numHandles; i++)positions.push(idealSpacing * (i + 1));
|
|
57
|
-
return positions;
|
|
58
|
-
}
|
|
59
|
-
const roundedSpacing = Math.round(idealSpacing / gridSize) * gridSize;
|
|
60
|
-
let gridAlignedSpacing = Math.max(gridSize, roundedSpacing);
|
|
61
|
-
let totalSpan = (numHandles - 1) * gridAlignedSpacing;
|
|
62
|
-
let startPosition = (nodeSize - totalSpan) / 2;
|
|
63
|
-
if (startPosition % gridSize !== 0 && gridAlignedSpacing > gridSize) {
|
|
64
|
-
gridAlignedSpacing -= gridSize;
|
|
65
|
-
totalSpan = (numHandles - 1) * gridAlignedSpacing;
|
|
66
|
-
startPosition = (nodeSize - totalSpan) / 2;
|
|
67
|
-
}
|
|
68
|
-
const positions = [];
|
|
69
|
-
for(let i = 0; i < numHandles; i++)positions.push(startPosition + i * gridAlignedSpacing);
|
|
70
|
-
return positions;
|
|
71
|
-
};
|
|
72
43
|
const pixelToPercent = (pixelPosition, nodeSize)=>{
|
|
73
44
|
if (0 === nodeSize) return 0;
|
|
74
45
|
return pixelPosition / nodeSize * 100;
|
|
@@ -141,12 +112,10 @@ const transformForHandle = ({ position, customPositionAndOffsets })=>{
|
|
|
141
112
|
exports.HANDLE_CROSS_AXIS_SIZE_PX = __webpack_exports__.HANDLE_CROSS_AXIS_SIZE_PX;
|
|
142
113
|
exports.HANDLE_EDGE_COVERAGE_RATIO = __webpack_exports__.HANDLE_EDGE_COVERAGE_RATIO;
|
|
143
114
|
exports.bottomPositionForHandle = __webpack_exports__.bottomPositionForHandle;
|
|
144
|
-
exports.calculateGridAlignedHandlePositions = __webpack_exports__.calculateGridAlignedHandlePositions;
|
|
145
115
|
exports.heightForHandleWithPosition = __webpack_exports__.heightForHandleWithPosition;
|
|
146
116
|
exports.leftPositionForHandle = __webpack_exports__.leftPositionForHandle;
|
|
147
117
|
exports.pixelToPercent = __webpack_exports__.pixelToPercent;
|
|
148
118
|
exports.rightPositionForHandle = __webpack_exports__.rightPositionForHandle;
|
|
149
|
-
exports.snapToGrid = __webpack_exports__.snapToGrid;
|
|
150
119
|
exports.topPositionForHandle = __webpack_exports__.topPositionForHandle;
|
|
151
120
|
exports.transformForHandle = __webpack_exports__.transformForHandle;
|
|
152
121
|
exports.widthForHandleWithPosition = __webpack_exports__.widthForHandleWithPosition;
|
|
@@ -154,12 +123,10 @@ for(var __rspack_i in __webpack_exports__)if (-1 === [
|
|
|
154
123
|
"HANDLE_CROSS_AXIS_SIZE_PX",
|
|
155
124
|
"HANDLE_EDGE_COVERAGE_RATIO",
|
|
156
125
|
"bottomPositionForHandle",
|
|
157
|
-
"calculateGridAlignedHandlePositions",
|
|
158
126
|
"heightForHandleWithPosition",
|
|
159
127
|
"leftPositionForHandle",
|
|
160
128
|
"pixelToPercent",
|
|
161
129
|
"rightPositionForHandle",
|
|
162
|
-
"snapToGrid",
|
|
163
130
|
"topPositionForHandle",
|
|
164
131
|
"transformForHandle",
|
|
165
132
|
"widthForHandleWithPosition"
|
|
@@ -2,8 +2,6 @@ import { Position } from '../../xyflow/react.ts';
|
|
|
2
2
|
import type { HandleConfigurationSpecificPosition } from '../../schema/node-definition/handle';
|
|
3
3
|
export declare const HANDLE_CROSS_AXIS_SIZE_PX = 24;
|
|
4
4
|
export declare const HANDLE_EDGE_COVERAGE_RATIO = 0.5;
|
|
5
|
-
export declare const snapToGrid: (value: number, gridSize?: number) => number;
|
|
6
|
-
export declare const calculateGridAlignedHandlePositions: (nodeSize: number, numHandles: number, gridSize?: number) => number[];
|
|
7
5
|
export declare const pixelToPercent: (pixelPosition: number, nodeSize: number) => number;
|
|
8
6
|
export declare const widthForHandleWithPosition: ({ position, numHandles, customWidth, }: {
|
|
9
7
|
position: Position;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonHandleStyleUtils.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/ButtonHandle/ButtonHandleStyleUtils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,0CAA0C,CAAC;
|
|
1
|
+
{"version":3,"file":"ButtonHandleStyleUtils.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/ButtonHandle/ButtonHandleStyleUtils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,0CAA0C,CAAC;AACpE,OAAO,KAAK,EAAE,mCAAmC,EAAE,MAAM,qCAAqC,CAAC;AAgB/F,eAAO,MAAM,yBAAyB,KAAK,CAAC;AAC5C,eAAO,MAAM,0BAA0B,MAAM,CAAC;AAQ9C,eAAO,MAAM,cAAc,GAAI,eAAe,MAAM,EAAE,UAAU,MAAM,KAAG,MAGxE,CAAC;AAEF,eAAO,MAAM,0BAA0B,GAAI,wCAIxC;IACD,QAAQ,EAAE,QAAQ,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,KAAG,MAQH,CAAC;AAEF,eAAO,MAAM,2BAA2B,GAAI,yCAIzC;IACD,QAAQ,EAAE,QAAQ,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,KAAG,MAQH,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAAI,uEAMlC;IACD,QAAQ,EAAE,QAAQ,CAAC;IACnB,eAAe,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,KAAG,MAyBH,CAAC;AAEF,eAAO,MAAM,uBAAuB,GAAI,uEAMrC;IACD,QAAQ,EAAE,QAAQ,CAAC;IACnB,eAAe,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,KAAG,MAsBH,CAAC;AAEF,eAAO,MAAM,qBAAqB,GAAI,sEAMnC;IACD,QAAQ,EAAE,QAAQ,CAAC;IACnB,eAAe,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,KAAG,MAyBH,CAAC;AAEF,eAAO,MAAM,sBAAsB,GAAI,sEAMpC;IACD,QAAQ,EAAE,QAAQ,CAAC;IACnB,eAAe,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,KAAG,MAsBH,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,yCAGhC;IACD,QAAQ,EAAE,QAAQ,CAAC;IACnB,wBAAwB,CAAC,EAAE,mCAAmC,CAAC;CAChE,KAAG,MAgBH,CAAC"}
|
|
@@ -1,35 +1,8 @@
|
|
|
1
1
|
import { Position } from "../../xyflow/react.js";
|
|
2
|
-
import { GRID_SPACING } from "../../constants.js";
|
|
3
2
|
const isHorizontalEdge = (position)=>position === Position.Top || position === Position.Bottom;
|
|
4
3
|
const isVerticalEdge = (position)=>position === Position.Left || position === Position.Right;
|
|
5
4
|
const HANDLE_CROSS_AXIS_SIZE_PX = 24;
|
|
6
5
|
const HANDLE_EDGE_COVERAGE_RATIO = 0.5;
|
|
7
|
-
const snapToGrid = (value, gridSize = GRID_SPACING)=>Math.round(value / gridSize) * gridSize;
|
|
8
|
-
const calculateGridAlignedHandlePositions = (nodeSize, numHandles, gridSize = GRID_SPACING)=>{
|
|
9
|
-
if (0 === numHandles) return [];
|
|
10
|
-
if (nodeSize <= 0) return [];
|
|
11
|
-
if (1 === numHandles) return [
|
|
12
|
-
snapToGrid(nodeSize / 2, gridSize)
|
|
13
|
-
];
|
|
14
|
-
const idealSpacing = nodeSize / (numHandles + 1);
|
|
15
|
-
if (nodeSize % gridSize !== 0) {
|
|
16
|
-
const positions = [];
|
|
17
|
-
for(let i = 0; i < numHandles; i++)positions.push(idealSpacing * (i + 1));
|
|
18
|
-
return positions;
|
|
19
|
-
}
|
|
20
|
-
const roundedSpacing = Math.round(idealSpacing / gridSize) * gridSize;
|
|
21
|
-
let gridAlignedSpacing = Math.max(gridSize, roundedSpacing);
|
|
22
|
-
let totalSpan = (numHandles - 1) * gridAlignedSpacing;
|
|
23
|
-
let startPosition = (nodeSize - totalSpan) / 2;
|
|
24
|
-
if (startPosition % gridSize !== 0 && gridAlignedSpacing > gridSize) {
|
|
25
|
-
gridAlignedSpacing -= gridSize;
|
|
26
|
-
totalSpan = (numHandles - 1) * gridAlignedSpacing;
|
|
27
|
-
startPosition = (nodeSize - totalSpan) / 2;
|
|
28
|
-
}
|
|
29
|
-
const positions = [];
|
|
30
|
-
for(let i = 0; i < numHandles; i++)positions.push(startPosition + i * gridAlignedSpacing);
|
|
31
|
-
return positions;
|
|
32
|
-
};
|
|
33
6
|
const pixelToPercent = (pixelPosition, nodeSize)=>{
|
|
34
7
|
if (0 === nodeSize) return 0;
|
|
35
8
|
return pixelPosition / nodeSize * 100;
|
|
@@ -99,4 +72,4 @@ const transformForHandle = ({ position, customPositionAndOffsets })=>{
|
|
|
99
72
|
const horizontalPercent = hasCustomHorizontal ? '0%' : position === Position.Right ? '50%' : '-50%';
|
|
100
73
|
return `translate(${horizontalPercent}, ${verticalPercent})`;
|
|
101
74
|
};
|
|
102
|
-
export { HANDLE_CROSS_AXIS_SIZE_PX, HANDLE_EDGE_COVERAGE_RATIO, bottomPositionForHandle,
|
|
75
|
+
export { HANDLE_CROSS_AXIS_SIZE_PX, HANDLE_EDGE_COVERAGE_RATIO, bottomPositionForHandle, heightForHandleWithPosition, leftPositionForHandle, pixelToPercent, rightPositionForHandle, topPositionForHandle, transformForHandle, widthForHandleWithPosition };
|
|
@@ -34,6 +34,7 @@ const react_namespaceObject = require("@xyflow/react");
|
|
|
34
34
|
const external_react_namespaceObject = require("react");
|
|
35
35
|
const CanvasEventBus_cjs_namespaceObject = require("../../utils/CanvasEventBus.cjs");
|
|
36
36
|
const CssUtil_cjs_namespaceObject = require("../../utils/CssUtil.cjs");
|
|
37
|
+
const handle_positioning_cjs_namespaceObject = require("../../utils/handle-positioning.cjs");
|
|
37
38
|
const external_ButtonHandleStyleUtils_cjs_namespaceObject = require("./ButtonHandleStyleUtils.cjs");
|
|
38
39
|
const external_HandleButton_cjs_namespaceObject = require("./HandleButton.cjs");
|
|
39
40
|
const external_HandleLabel_cjs_namespaceObject = require("./HandleLabel.cjs");
|
|
@@ -320,7 +321,7 @@ function SmartHandle({ type, id, defaultPosition = 'source' === type ? react_nam
|
|
|
320
321
|
if (total <= 1) return 50;
|
|
321
322
|
const relevantSize = isVertical ? nodeWidth : nodeHeight;
|
|
322
323
|
if (relevantSize && relevantSize > 0) {
|
|
323
|
-
const gridPositions = (0,
|
|
324
|
+
const gridPositions = (0, handle_positioning_cjs_namespaceObject.calculateGridAlignedHandlePositions)(relevantSize, total);
|
|
324
325
|
const pixelPosition = gridPositions[index] ?? relevantSize / 2;
|
|
325
326
|
return (0, external_ButtonHandleStyleUtils_cjs_namespaceObject.pixelToPercent)(pixelPosition, relevantSize);
|
|
326
327
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SmartHandle.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/ButtonHandle/SmartHandle.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,WAAW,EAEhB,QAAQ,EAKT,MAAM,eAAe,CAAC;
|
|
1
|
+
{"version":3,"file":"SmartHandle.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/ButtonHandle/SmartHandle.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,WAAW,EAEhB,QAAQ,EAKT,MAAM,eAAe,CAAC;AAavB,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAaxD,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,WAAW,EAAE,UAAU,CAAC;IAErE,eAAe,CAAC,EAAE,QAAQ,CAAC;IAE3B,UAAU,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,UAAU,CAAC;IAE7C,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAE5B,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE5B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAE9B,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAM9C,OAAO,CAAC,EAAE,OAAO,CAAC;IAMlB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAoED,wBAAgB,mBAAmB,CAAC,EAClC,QAAQ,EACR,SAAS,EAAE,UAAU,EACrB,UAAU,EAAE,WAAW,GACxB,EAAE;IACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,2CAiEA;AAyUD,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,EAAE,EACF,eAAoE,EACpE,UAAmD,EACnD,KAAK,EACL,SAAS,EACT,SAAS,EACT,UAAU,EACV,KAAK,EACL,SAAS,EACT,oBAAoB,EACpB,UAAkB,EAClB,QAAgB,EAChB,WAAkB,EAClB,QAAQ,EACR,OAAc,EACd,WAAW,EACX,GAAG,IAAI,EACR,EAAE,gBAAgB,2CAgMlB;AASD,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,IAAI,CAAC,gBAAgB,EAAE,MAAM,CAAC,2CAEtE;AAKD,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,IAAI,CAAC,gBAAgB,EAAE,MAAM,CAAC,2CAEtE"}
|
|
@@ -3,7 +3,8 @@ import { Handle, Position, useNodeId, useStore, useUpdateNodeInternals } from "@
|
|
|
3
3
|
import { createContext, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
|
|
4
4
|
import { canvasEventBus } from "../../utils/CanvasEventBus.js";
|
|
5
5
|
import { cx } from "../../utils/CssUtil.js";
|
|
6
|
-
import { calculateGridAlignedHandlePositions
|
|
6
|
+
import { calculateGridAlignedHandlePositions } from "../../utils/handle-positioning.js";
|
|
7
|
+
import { pixelToPercent } from "./ButtonHandleStyleUtils.js";
|
|
7
8
|
import { HandleButton } from "./HandleButton.js";
|
|
8
9
|
import { HandleLabel } from "./HandleLabel.js";
|
|
9
10
|
import { HandleNotch } from "./HandleNotch.js";
|