ai-design-system 0.1.84 → 0.1.86
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/components/ai-elements/canvas.tsx +9 -4
- package/components/blocks/WorkflowCanvas/WorkflowCanvas.tsx +4 -0
- package/components/composites/AppHeader/AppHeader.tsx +27 -33
- package/components/composites/AppHeader/interfaces.ts +2 -0
- package/components/features/NodeEditor/NodeEditor.tsx +6 -0
- package/components/features/NodeEditor/bookgeek.preview.json +120 -8
- package/dist/index.cjs +41 -8
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +87 -81
- package/dist/index.js +41 -8
- package/dist/index.js.map +1 -1
- package/lib/workflow/interfaces.ts +2 -0
- package/package.json +1 -1
|
@@ -7,16 +7,21 @@ type CanvasProps = ReactFlowProps & {
|
|
|
7
7
|
children?: ReactNode;
|
|
8
8
|
};
|
|
9
9
|
|
|
10
|
-
export const Canvas = ({
|
|
10
|
+
export const Canvas = ({
|
|
11
|
+
children,
|
|
12
|
+
panOnDrag = false,
|
|
13
|
+
selectionOnDrag,
|
|
14
|
+
...props
|
|
15
|
+
}: CanvasProps) => (
|
|
11
16
|
<ReactFlow
|
|
12
|
-
{...props}
|
|
13
17
|
deleteKeyCode={["Backspace", "Delete"]}
|
|
14
18
|
fitView
|
|
15
|
-
panOnDrag={false}
|
|
16
19
|
panOnScroll
|
|
17
20
|
proOptions={{ hideAttribution: true }}
|
|
18
|
-
selectionOnDrag={true}
|
|
19
21
|
zoomOnDoubleClick={false}
|
|
22
|
+
panOnDrag={panOnDrag}
|
|
23
|
+
selectionOnDrag={selectionOnDrag !== undefined ? selectionOnDrag : !panOnDrag}
|
|
24
|
+
{...props}
|
|
20
25
|
>
|
|
21
26
|
<Background bgColor="var(--sidebar)" />
|
|
22
27
|
<Controls />
|
|
@@ -47,6 +47,8 @@ function WorkflowCanvasInner({
|
|
|
47
47
|
onNodeClick,
|
|
48
48
|
onEdgeClick,
|
|
49
49
|
interactive = false,
|
|
50
|
+
panOnDrag = false,
|
|
51
|
+
selectionOnDrag,
|
|
50
52
|
topLeft,
|
|
51
53
|
topRight,
|
|
52
54
|
topCenter,
|
|
@@ -84,6 +86,8 @@ function WorkflowCanvasInner({
|
|
|
84
86
|
}}
|
|
85
87
|
>
|
|
86
88
|
<Canvas
|
|
89
|
+
panOnDrag={panOnDrag}
|
|
90
|
+
selectionOnDrag={selectionOnDrag}
|
|
87
91
|
className="bg-background [&_.react-flow\_\_handle]:opacity-0 [&_.react-flow\_\_handle]:pointer-events-none [&_.react-flow\_\_node:hover_.react-flow\_\_handle]:opacity-100 [&_.react-flow\_\_node:hover_.react-flow\_\_handle]:pointer-events-auto [&_.react-flow\_\_node.selected_.react-flow\_\_handle]:opacity-100 [&_.react-flow\_\_node.selected_.react-flow\_\_handle]:pointer-events-auto [&_.react-flow\_\_handle]:transition-opacity [&_.react-flow\_\_handle]:duration-150"
|
|
88
92
|
connectionLineComponent={ConnectionLine}
|
|
89
93
|
connectionMode={ConnectionMode.Strict}
|
|
@@ -11,6 +11,8 @@ export const AppHeader = React.memo<AppHeaderProps>(({
|
|
|
11
11
|
actions,
|
|
12
12
|
tabs,
|
|
13
13
|
defaultTab,
|
|
14
|
+
activeTab,
|
|
15
|
+
value,
|
|
14
16
|
onTabChange,
|
|
15
17
|
className,
|
|
16
18
|
tabsPosition = 'center',
|
|
@@ -19,6 +21,28 @@ export const AppHeader = React.memo<AppHeaderProps>(({
|
|
|
19
21
|
buttonSwitcherProps,
|
|
20
22
|
chatToggleProps
|
|
21
23
|
}) => {
|
|
24
|
+
const currentTab = activeTab ?? value;
|
|
25
|
+
|
|
26
|
+
const renderTabs = (extraClass?: string) => {
|
|
27
|
+
if (!tabs || tabs.length === 0) return null;
|
|
28
|
+
return (
|
|
29
|
+
<Tabs
|
|
30
|
+
value={currentTab}
|
|
31
|
+
defaultValue={currentTab !== undefined ? undefined : (defaultTab || tabs[0]?.value)}
|
|
32
|
+
onValueChange={onTabChange}
|
|
33
|
+
className={extraClass}
|
|
34
|
+
>
|
|
35
|
+
<TabsList>
|
|
36
|
+
{tabs.map((tab) => (
|
|
37
|
+
<TabsTrigger key={tab.value} value={tab.value}>
|
|
38
|
+
{tab.label}
|
|
39
|
+
</TabsTrigger>
|
|
40
|
+
))}
|
|
41
|
+
</TabsList>
|
|
42
|
+
</Tabs>
|
|
43
|
+
);
|
|
44
|
+
};
|
|
45
|
+
|
|
22
46
|
return (
|
|
23
47
|
<header className={`flex h-14 shrink-0 items-center gap-2 transition-[width,height] ease-linear group-has-data-[collapsible=icon]/sidebar-wrapper:h-14 ${className || ""}`}>
|
|
24
48
|
<div className="grid w-full grid-cols-[minmax(0,1fr)_auto_minmax(0,1fr)] items-center px-4 lg:px-6">
|
|
@@ -33,46 +57,16 @@ export const AppHeader = React.memo<AppHeaderProps>(({
|
|
|
33
57
|
: title
|
|
34
58
|
)}
|
|
35
59
|
{chatToggleProps && <ChatToggleButton {...chatToggleProps} />}
|
|
36
|
-
{tabsPosition === 'left' &&
|
|
37
|
-
<Tabs defaultValue={defaultTab || tabs[0]?.value} onValueChange={onTabChange} className="ml-2">
|
|
38
|
-
<TabsList>
|
|
39
|
-
{tabs.map((tab) => (
|
|
40
|
-
<TabsTrigger key={tab.value} value={tab.value}>
|
|
41
|
-
{tab.label}
|
|
42
|
-
</TabsTrigger>
|
|
43
|
-
))}
|
|
44
|
-
</TabsList>
|
|
45
|
-
</Tabs>
|
|
46
|
-
)}
|
|
60
|
+
{tabsPosition === 'left' && renderTabs("ml-2")}
|
|
47
61
|
{buttonSwitcherProps && <ButtonSwitcher {...buttonSwitcherProps} />}
|
|
48
62
|
</div>
|
|
49
63
|
|
|
50
64
|
<div className="justify-self-center">
|
|
51
|
-
{tabsPosition === 'center' &&
|
|
52
|
-
<Tabs defaultValue={defaultTab || tabs[0]?.value} onValueChange={onTabChange}>
|
|
53
|
-
<TabsList>
|
|
54
|
-
{tabs.map((tab) => (
|
|
55
|
-
<TabsTrigger key={tab.value} value={tab.value}>
|
|
56
|
-
{tab.label}
|
|
57
|
-
</TabsTrigger>
|
|
58
|
-
))}
|
|
59
|
-
</TabsList>
|
|
60
|
-
</Tabs>
|
|
61
|
-
)}
|
|
65
|
+
{tabsPosition === 'center' && renderTabs()}
|
|
62
66
|
</div>
|
|
63
67
|
|
|
64
68
|
<div className="flex min-w-0 items-center justify-end gap-2">
|
|
65
|
-
{tabsPosition === 'right' &&
|
|
66
|
-
<Tabs defaultValue={defaultTab || tabs[0]?.value} onValueChange={onTabChange}>
|
|
67
|
-
<TabsList>
|
|
68
|
-
{tabs.map((tab) => (
|
|
69
|
-
<TabsTrigger key={tab.value} value={tab.value}>
|
|
70
|
-
{tab.label}
|
|
71
|
-
</TabsTrigger>
|
|
72
|
-
))}
|
|
73
|
-
</TabsList>
|
|
74
|
-
</Tabs>
|
|
75
|
-
)}
|
|
69
|
+
{tabsPosition === 'right' && renderTabs()}
|
|
76
70
|
{actions}
|
|
77
71
|
</div>
|
|
78
72
|
</div>
|
|
@@ -12,6 +12,8 @@ export interface AppHeaderProps {
|
|
|
12
12
|
actions?: React.ReactNode;
|
|
13
13
|
tabs?: TabItem[];
|
|
14
14
|
defaultTab?: string;
|
|
15
|
+
activeTab?: string;
|
|
16
|
+
value?: string;
|
|
15
17
|
onTabChange?: (value: string) => void;
|
|
16
18
|
tabsPosition?: 'left' | 'center' | 'right';
|
|
17
19
|
className?: string;
|
|
@@ -52,6 +52,8 @@ export interface NodeEditorProps {
|
|
|
52
52
|
|
|
53
53
|
showMinimap?: boolean;
|
|
54
54
|
interactive?: boolean;
|
|
55
|
+
panOnDrag?: boolean | number[];
|
|
56
|
+
selectionOnDrag?: boolean;
|
|
55
57
|
hideDefaultActions?: boolean;
|
|
56
58
|
hideWorkflowName?: boolean;
|
|
57
59
|
className?: string;
|
|
@@ -99,6 +101,8 @@ export function NodeEditor({
|
|
|
99
101
|
extraActions,
|
|
100
102
|
showMinimap,
|
|
101
103
|
interactive = false,
|
|
104
|
+
panOnDrag = false,
|
|
105
|
+
selectionOnDrag,
|
|
102
106
|
hideDefaultActions = false,
|
|
103
107
|
hideWorkflowName = false,
|
|
104
108
|
className,
|
|
@@ -159,6 +163,8 @@ export function NodeEditor({
|
|
|
159
163
|
className="h-full w-full"
|
|
160
164
|
edges={edges}
|
|
161
165
|
interactive={interactive}
|
|
166
|
+
panOnDrag={panOnDrag}
|
|
167
|
+
selectionOnDrag={selectionOnDrag}
|
|
162
168
|
nodes={highlightedNodes}
|
|
163
169
|
showMinimap={showMinimap}
|
|
164
170
|
topLeft={
|
|
@@ -23,7 +23,23 @@
|
|
|
23
23
|
"label": "Get Started",
|
|
24
24
|
"top": 779
|
|
25
25
|
}
|
|
26
|
-
]
|
|
26
|
+
],
|
|
27
|
+
"action": {
|
|
28
|
+
"after": [
|
|
29
|
+
{
|
|
30
|
+
"stepId": "await-nav-welcome",
|
|
31
|
+
"actionType": "step/await-navigation",
|
|
32
|
+
"semantics": {
|
|
33
|
+
"label": "Await navigation from Welcome",
|
|
34
|
+
"description": "Pause and wait for user to trigger a navigation event"
|
|
35
|
+
},
|
|
36
|
+
"config": {
|
|
37
|
+
"screenId": "welcome",
|
|
38
|
+
"route": "/welcome"
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
]
|
|
42
|
+
}
|
|
27
43
|
}
|
|
28
44
|
},
|
|
29
45
|
{
|
|
@@ -61,7 +77,23 @@
|
|
|
61
77
|
"label": "Sign Up",
|
|
62
78
|
"top": 371
|
|
63
79
|
}
|
|
64
|
-
]
|
|
80
|
+
],
|
|
81
|
+
"action": {
|
|
82
|
+
"after": [
|
|
83
|
+
{
|
|
84
|
+
"stepId": "await-nav-signup",
|
|
85
|
+
"actionType": "step/await-navigation",
|
|
86
|
+
"semantics": {
|
|
87
|
+
"label": "Await navigation from Sign Up",
|
|
88
|
+
"description": "Pause and wait for user to trigger a navigation event"
|
|
89
|
+
},
|
|
90
|
+
"config": {
|
|
91
|
+
"screenId": "signup",
|
|
92
|
+
"route": "/signup"
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
]
|
|
96
|
+
}
|
|
65
97
|
}
|
|
66
98
|
},
|
|
67
99
|
{
|
|
@@ -99,7 +131,23 @@
|
|
|
99
131
|
"label": "Next",
|
|
100
132
|
"top": 791
|
|
101
133
|
}
|
|
102
|
-
]
|
|
134
|
+
],
|
|
135
|
+
"action": {
|
|
136
|
+
"after": [
|
|
137
|
+
{
|
|
138
|
+
"stepId": "await-nav-categories",
|
|
139
|
+
"actionType": "step/await-navigation",
|
|
140
|
+
"semantics": {
|
|
141
|
+
"label": "Await navigation from Categories",
|
|
142
|
+
"description": "Pause and wait for user to trigger a navigation event"
|
|
143
|
+
},
|
|
144
|
+
"config": {
|
|
145
|
+
"screenId": "categories",
|
|
146
|
+
"route": "/categories"
|
|
147
|
+
}
|
|
148
|
+
}
|
|
149
|
+
]
|
|
150
|
+
}
|
|
103
151
|
}
|
|
104
152
|
},
|
|
105
153
|
{
|
|
@@ -137,7 +185,23 @@
|
|
|
137
185
|
"label": "Done",
|
|
138
186
|
"top": 791
|
|
139
187
|
}
|
|
140
|
-
]
|
|
188
|
+
],
|
|
189
|
+
"action": {
|
|
190
|
+
"after": [
|
|
191
|
+
{
|
|
192
|
+
"stepId": "await-nav-authors",
|
|
193
|
+
"actionType": "step/await-navigation",
|
|
194
|
+
"semantics": {
|
|
195
|
+
"label": "Await navigation from Authors",
|
|
196
|
+
"description": "Pause and wait for user to trigger a navigation event"
|
|
197
|
+
},
|
|
198
|
+
"config": {
|
|
199
|
+
"screenId": "authors",
|
|
200
|
+
"route": "/authors"
|
|
201
|
+
}
|
|
202
|
+
}
|
|
203
|
+
]
|
|
204
|
+
}
|
|
141
205
|
}
|
|
142
206
|
},
|
|
143
207
|
{
|
|
@@ -160,7 +224,23 @@
|
|
|
160
224
|
"label": "Sign In",
|
|
161
225
|
"top": 307
|
|
162
226
|
}
|
|
163
|
-
]
|
|
227
|
+
],
|
|
228
|
+
"action": {
|
|
229
|
+
"after": [
|
|
230
|
+
{
|
|
231
|
+
"stepId": "await-nav-signin",
|
|
232
|
+
"actionType": "step/await-navigation",
|
|
233
|
+
"semantics": {
|
|
234
|
+
"label": "Await navigation from Sign In",
|
|
235
|
+
"description": "Pause and wait for user to trigger a navigation event"
|
|
236
|
+
},
|
|
237
|
+
"config": {
|
|
238
|
+
"screenId": "signin",
|
|
239
|
+
"route": "/signin"
|
|
240
|
+
}
|
|
241
|
+
}
|
|
242
|
+
]
|
|
243
|
+
}
|
|
164
244
|
}
|
|
165
245
|
},
|
|
166
246
|
{
|
|
@@ -183,7 +263,23 @@
|
|
|
183
263
|
"label": "Sign Up",
|
|
184
264
|
"top": 327
|
|
185
265
|
}
|
|
186
|
-
]
|
|
266
|
+
],
|
|
267
|
+
"action": {
|
|
268
|
+
"after": [
|
|
269
|
+
{
|
|
270
|
+
"stepId": "await-nav-google-signup",
|
|
271
|
+
"actionType": "step/await-navigation",
|
|
272
|
+
"semantics": {
|
|
273
|
+
"label": "Await navigation from Google Sign Up",
|
|
274
|
+
"description": "Pause and wait for user to trigger a navigation event"
|
|
275
|
+
},
|
|
276
|
+
"config": {
|
|
277
|
+
"screenId": "google-signup",
|
|
278
|
+
"route": "/google-signup"
|
|
279
|
+
}
|
|
280
|
+
}
|
|
281
|
+
]
|
|
282
|
+
}
|
|
187
283
|
}
|
|
188
284
|
},
|
|
189
285
|
{
|
|
@@ -236,7 +332,23 @@
|
|
|
236
332
|
"label": "Collection",
|
|
237
333
|
"top": 826
|
|
238
334
|
}
|
|
239
|
-
]
|
|
335
|
+
],
|
|
336
|
+
"action": {
|
|
337
|
+
"after": [
|
|
338
|
+
{
|
|
339
|
+
"stepId": "await-nav-home",
|
|
340
|
+
"actionType": "step/await-navigation",
|
|
341
|
+
"semantics": {
|
|
342
|
+
"label": "Await navigation from Home",
|
|
343
|
+
"description": "Pause and wait for user to trigger a navigation event"
|
|
344
|
+
},
|
|
345
|
+
"config": {
|
|
346
|
+
"screenId": "home",
|
|
347
|
+
"route": "/home"
|
|
348
|
+
}
|
|
349
|
+
}
|
|
350
|
+
]
|
|
351
|
+
}
|
|
240
352
|
}
|
|
241
353
|
}
|
|
242
354
|
],
|
|
@@ -308,4 +420,4 @@
|
|
|
308
420
|
"type": "straight"
|
|
309
421
|
}
|
|
310
422
|
]
|
|
311
|
-
}
|
|
423
|
+
}
|
package/dist/index.cjs
CHANGED
|
@@ -2234,6 +2234,8 @@ var AppHeader = React3__namespace.memo(({
|
|
|
2234
2234
|
actions,
|
|
2235
2235
|
tabs,
|
|
2236
2236
|
defaultTab,
|
|
2237
|
+
activeTab,
|
|
2238
|
+
value,
|
|
2237
2239
|
onTabChange,
|
|
2238
2240
|
className,
|
|
2239
2241
|
tabsPosition = "center",
|
|
@@ -2242,19 +2244,33 @@ var AppHeader = React3__namespace.memo(({
|
|
|
2242
2244
|
buttonSwitcherProps,
|
|
2243
2245
|
chatToggleProps
|
|
2244
2246
|
}) => {
|
|
2245
|
-
|
|
2247
|
+
const currentTab = activeTab != null ? activeTab : value;
|
|
2248
|
+
const renderTabs = (extraClass) => {
|
|
2249
|
+
var _a;
|
|
2250
|
+
if (!tabs || tabs.length === 0) return null;
|
|
2251
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
2252
|
+
Tabs2,
|
|
2253
|
+
{
|
|
2254
|
+
value: currentTab,
|
|
2255
|
+
defaultValue: currentTab !== void 0 ? void 0 : defaultTab || ((_a = tabs[0]) == null ? void 0 : _a.value),
|
|
2256
|
+
onValueChange: onTabChange,
|
|
2257
|
+
className: extraClass,
|
|
2258
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(TabsList, { children: tabs.map((tab) => /* @__PURE__ */ jsxRuntime.jsx(TabsTrigger, { value: tab.value, children: tab.label }, tab.value)) })
|
|
2259
|
+
}
|
|
2260
|
+
);
|
|
2261
|
+
};
|
|
2246
2262
|
return /* @__PURE__ */ jsxRuntime.jsx("header", { className: `flex h-14 shrink-0 items-center gap-2 transition-[width,height] ease-linear group-has-data-[collapsible=icon]/sidebar-wrapper:h-14 ${className || ""}`, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid w-full grid-cols-[minmax(0,1fr)_auto_minmax(0,1fr)] items-center px-4 lg:px-6", children: [
|
|
2247
2263
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex items-center gap-1 lg:gap-2", children: [
|
|
2248
2264
|
showSidebarToggle && /* @__PURE__ */ jsxRuntime.jsx(SidebarTrigger2, { className: "-ml-1" }),
|
|
2249
2265
|
showSidebarToggle && (showTitle && title || buttonSwitcherProps || chatToggleProps) && /* @__PURE__ */ jsxRuntime.jsx(Separator3, { orientation: "vertical", className: "mx-2 data-[orientation=vertical]:h-4" }),
|
|
2250
2266
|
showTitle && title && (typeof title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "max-w-[28rem] truncate text-base font-medium", children: title }) : title),
|
|
2251
2267
|
chatToggleProps && /* @__PURE__ */ jsxRuntime.jsx(ChatToggleButton, __spreadValues({}, chatToggleProps)),
|
|
2252
|
-
tabsPosition === "left" &&
|
|
2268
|
+
tabsPosition === "left" && renderTabs("ml-2"),
|
|
2253
2269
|
buttonSwitcherProps && /* @__PURE__ */ jsxRuntime.jsx(ButtonSwitcher, __spreadValues({}, buttonSwitcherProps))
|
|
2254
2270
|
] }),
|
|
2255
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "justify-self-center", children: tabsPosition === "center" &&
|
|
2271
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "justify-self-center", children: tabsPosition === "center" && renderTabs() }),
|
|
2256
2272
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 items-center justify-end gap-2", children: [
|
|
2257
|
-
tabsPosition === "right" &&
|
|
2273
|
+
tabsPosition === "right" && renderTabs(),
|
|
2258
2274
|
actions
|
|
2259
2275
|
] })
|
|
2260
2276
|
] }) });
|
|
@@ -13006,17 +13022,26 @@ var Controls = (_a) => {
|
|
|
13006
13022
|
);
|
|
13007
13023
|
};
|
|
13008
13024
|
var Canvas = (_a) => {
|
|
13009
|
-
var _b = _a, {
|
|
13025
|
+
var _b = _a, {
|
|
13026
|
+
children,
|
|
13027
|
+
panOnDrag = false,
|
|
13028
|
+
selectionOnDrag
|
|
13029
|
+
} = _b, props = __objRest(_b, [
|
|
13030
|
+
"children",
|
|
13031
|
+
"panOnDrag",
|
|
13032
|
+
"selectionOnDrag"
|
|
13033
|
+
]);
|
|
13010
13034
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
13011
13035
|
react.ReactFlow,
|
|
13012
|
-
__spreadProps(__spreadValues({
|
|
13036
|
+
__spreadProps(__spreadValues({
|
|
13013
13037
|
deleteKeyCode: ["Backspace", "Delete"],
|
|
13014
13038
|
fitView: true,
|
|
13015
|
-
panOnDrag: false,
|
|
13016
13039
|
panOnScroll: true,
|
|
13017
13040
|
proOptions: { hideAttribution: true },
|
|
13018
|
-
selectionOnDrag: true,
|
|
13019
13041
|
zoomOnDoubleClick: false,
|
|
13042
|
+
panOnDrag,
|
|
13043
|
+
selectionOnDrag: selectionOnDrag !== void 0 ? selectionOnDrag : !panOnDrag
|
|
13044
|
+
}, props), {
|
|
13020
13045
|
children: [
|
|
13021
13046
|
/* @__PURE__ */ jsxRuntime.jsx(react.Background, { bgColor: "var(--sidebar)" }),
|
|
13022
13047
|
/* @__PURE__ */ jsxRuntime.jsx(Controls, {}),
|
|
@@ -13199,6 +13224,8 @@ function WorkflowCanvasInner({
|
|
|
13199
13224
|
onNodeClick,
|
|
13200
13225
|
onEdgeClick,
|
|
13201
13226
|
interactive = false,
|
|
13227
|
+
panOnDrag = false,
|
|
13228
|
+
selectionOnDrag,
|
|
13202
13229
|
topLeft,
|
|
13203
13230
|
topRight,
|
|
13204
13231
|
topCenter,
|
|
@@ -13235,6 +13262,8 @@ function WorkflowCanvasInner({
|
|
|
13235
13262
|
children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
13236
13263
|
Canvas,
|
|
13237
13264
|
{
|
|
13265
|
+
panOnDrag,
|
|
13266
|
+
selectionOnDrag,
|
|
13238
13267
|
className: "bg-background [&_.react-flow\\_\\_handle]:opacity-0 [&_.react-flow\\_\\_handle]:pointer-events-none [&_.react-flow\\_\\_node:hover_.react-flow\\_\\_handle]:opacity-100 [&_.react-flow\\_\\_node:hover_.react-flow\\_\\_handle]:pointer-events-auto [&_.react-flow\\_\\_node.selected_.react-flow\\_\\_handle]:opacity-100 [&_.react-flow\\_\\_node.selected_.react-flow\\_\\_handle]:pointer-events-auto [&_.react-flow\\_\\_handle]:transition-opacity [&_.react-flow\\_\\_handle]:duration-150",
|
|
13239
13268
|
connectionLineComponent: Connection,
|
|
13240
13269
|
connectionMode: react.ConnectionMode.Strict,
|
|
@@ -13399,6 +13428,8 @@ function NodeEditor({
|
|
|
13399
13428
|
extraActions,
|
|
13400
13429
|
showMinimap,
|
|
13401
13430
|
interactive = false,
|
|
13431
|
+
panOnDrag = false,
|
|
13432
|
+
selectionOnDrag,
|
|
13402
13433
|
hideDefaultActions = false,
|
|
13403
13434
|
hideWorkflowName = false,
|
|
13404
13435
|
className,
|
|
@@ -13451,6 +13482,8 @@ function NodeEditor({
|
|
|
13451
13482
|
className: "h-full w-full",
|
|
13452
13483
|
edges,
|
|
13453
13484
|
interactive,
|
|
13485
|
+
panOnDrag,
|
|
13486
|
+
selectionOnDrag,
|
|
13454
13487
|
nodes: highlightedNodes,
|
|
13455
13488
|
showMinimap,
|
|
13456
13489
|
topLeft: showTopLeftToolbar ? /* @__PURE__ */ jsxRuntime.jsx(
|