@uipath/apollo-wind 0.13.0 → 0.14.0-pr352.9e7328c
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/components/custom/chat-composer.cjs +49 -17
- package/dist/components/custom/chat-composer.d.ts +1 -2
- package/dist/components/custom/chat-composer.js +50 -18
- package/dist/components/custom/chat-prompt-suggestions.cjs +1 -1
- package/dist/components/custom/chat-prompt-suggestions.js +1 -1
- package/dist/components/custom/panel-delegate.cjs +54 -53
- package/dist/components/custom/panel-delegate.js +54 -53
- package/dist/components/custom/panel-flow.cjs +238 -83
- package/dist/components/custom/panel-flow.d.ts +17 -3
- package/dist/components/custom/panel-flow.js +239 -84
- package/dist/components/custom/toolbar-canvas.cjs +17 -25
- package/dist/components/custom/toolbar-canvas.js +17 -25
- package/dist/components/custom/toolbar-view.cjs +84 -34
- package/dist/components/custom/toolbar-view.d.ts +3 -1
- package/dist/components/custom/toolbar-view.js +85 -35
- package/dist/components/ui/button.cjs +1 -0
- package/dist/components/ui/button.js +1 -0
- package/dist/components/ui/index.cjs +16 -16
- package/dist/styles.css +244 -78
- package/dist/tailwind.css +151 -104
- package/package.json +1 -1
|
@@ -4,32 +4,34 @@ import { ListChecks, Play, Plus, Redo2, StickyNote, Undo2, Workflow } from "luci
|
|
|
4
4
|
import { cn } from "../../lib/index.js";
|
|
5
5
|
function ToolbarSeparator() {
|
|
6
6
|
return /*#__PURE__*/ jsx("div", {
|
|
7
|
-
className: "h-8 w-px bg-
|
|
7
|
+
className: "h-8 w-px bg-surface-overlay"
|
|
8
8
|
});
|
|
9
9
|
}
|
|
10
|
-
function ToolbarButton({ icon, label, onClick }) {
|
|
10
|
+
function ToolbarButton({ icon: Icon, label, onClick }) {
|
|
11
11
|
return /*#__PURE__*/ jsx("button", {
|
|
12
12
|
type: "button",
|
|
13
|
-
className: "flex h-8 w-8 items-center justify-center rounded-lg text-foreground-muted
|
|
13
|
+
className: "group flex h-8 w-8 items-center justify-center rounded-lg text-foreground-muted hover:bg-surface-hover hover:text-foreground",
|
|
14
14
|
onClick: onClick,
|
|
15
15
|
"aria-label": label,
|
|
16
|
-
children:
|
|
16
|
+
children: /*#__PURE__*/ jsx(Icon, {
|
|
17
|
+
className: "h-5 w-5 group-hover:h-6 group-hover:w-6"
|
|
18
|
+
})
|
|
17
19
|
});
|
|
18
20
|
}
|
|
19
21
|
function FlowCanvasToolbar({ className, activeMode = 'build', onModeChange }) {
|
|
20
22
|
return /*#__PURE__*/ jsxs("div", {
|
|
21
|
-
className: cn('flex h-[60px] items-center gap-2 rounded-
|
|
23
|
+
className: cn('flex h-[60px] items-center gap-2 rounded-[24px] border border-surface-overlay bg-surface-raised px-2.5', className),
|
|
22
24
|
children: [
|
|
23
25
|
/*#__PURE__*/ jsxs("div", {
|
|
24
|
-
className: "flex h-10 items-center rounded-xl border border-
|
|
26
|
+
className: "flex h-10 items-center gap-1 rounded-xl border border-surface-overlay p-1",
|
|
25
27
|
children: [
|
|
26
28
|
/*#__PURE__*/ jsxs("button", {
|
|
27
29
|
type: "button",
|
|
28
|
-
className: cn('flex h-8 items-center gap-2 rounded-[10px] px-3 py-2 text-sm font-medium leading-5
|
|
30
|
+
className: cn('flex h-8 items-center gap-2 rounded-[10px] px-3 py-2 text-sm font-medium leading-5', 'build' === activeMode ? 'border border-surface-hover bg-foreground-inverse text-foreground shadow-[0px_4px_4px_0px_rgba(0,0,0,0.05)] hover:border-transparent hover:bg-surface-hover hover:shadow-none' : 'text-foreground-muted hover:bg-surface-hover hover:text-foreground'),
|
|
29
31
|
onClick: ()=>onModeChange?.('build'),
|
|
30
32
|
children: [
|
|
31
33
|
/*#__PURE__*/ jsx(Workflow, {
|
|
32
|
-
className:
|
|
34
|
+
className: cn('h-5 w-5', 'build' === activeMode ? 'text-foreground-accent' : '')
|
|
33
35
|
}),
|
|
34
36
|
/*#__PURE__*/ jsx("span", {
|
|
35
37
|
children: "Build"
|
|
@@ -38,11 +40,11 @@ function FlowCanvasToolbar({ className, activeMode = 'build', onModeChange }) {
|
|
|
38
40
|
}),
|
|
39
41
|
/*#__PURE__*/ jsxs("button", {
|
|
40
42
|
type: "button",
|
|
41
|
-
className: cn('flex h-8 items-center gap-2 rounded-[10px] px-3 py-2 text-sm font-medium leading-5
|
|
43
|
+
className: cn('flex h-8 items-center gap-2 rounded-[10px] px-3 py-2 text-sm font-medium leading-5', 'evaluate' === activeMode ? 'border border-surface-hover bg-foreground-inverse text-foreground shadow-[0px_4px_4px_0px_rgba(0,0,0,0.05)] hover:border-transparent hover:bg-surface-hover hover:shadow-none' : 'text-foreground-muted hover:bg-surface-hover hover:text-foreground'),
|
|
42
44
|
onClick: ()=>onModeChange?.('evaluate'),
|
|
43
45
|
children: [
|
|
44
46
|
/*#__PURE__*/ jsx(ListChecks, {
|
|
45
|
-
className:
|
|
47
|
+
className: cn('h-5 w-5', 'evaluate' === activeMode ? 'text-foreground-accent' : '')
|
|
46
48
|
}),
|
|
47
49
|
/*#__PURE__*/ jsx("span", {
|
|
48
50
|
children: "Evaluate"
|
|
@@ -53,35 +55,25 @@ function FlowCanvasToolbar({ className, activeMode = 'build', onModeChange }) {
|
|
|
53
55
|
}),
|
|
54
56
|
/*#__PURE__*/ jsx(ToolbarSeparator, {}),
|
|
55
57
|
/*#__PURE__*/ jsx(ToolbarButton, {
|
|
56
|
-
icon:
|
|
57
|
-
className: "h-5 w-5"
|
|
58
|
-
}),
|
|
58
|
+
icon: Undo2,
|
|
59
59
|
label: "Undo"
|
|
60
60
|
}),
|
|
61
61
|
/*#__PURE__*/ jsx(ToolbarButton, {
|
|
62
|
-
icon:
|
|
63
|
-
className: "h-5 w-5"
|
|
64
|
-
}),
|
|
62
|
+
icon: Redo2,
|
|
65
63
|
label: "Redo"
|
|
66
64
|
}),
|
|
67
65
|
/*#__PURE__*/ jsx(ToolbarSeparator, {}),
|
|
68
66
|
/*#__PURE__*/ jsx(ToolbarButton, {
|
|
69
|
-
icon:
|
|
70
|
-
className: "h-5 w-5"
|
|
71
|
-
}),
|
|
67
|
+
icon: Play,
|
|
72
68
|
label: "Run"
|
|
73
69
|
}),
|
|
74
70
|
/*#__PURE__*/ jsx(ToolbarSeparator, {}),
|
|
75
71
|
/*#__PURE__*/ jsx(ToolbarButton, {
|
|
76
|
-
icon:
|
|
77
|
-
className: "h-5 w-5"
|
|
78
|
-
}),
|
|
72
|
+
icon: Plus,
|
|
79
73
|
label: "Add node"
|
|
80
74
|
}),
|
|
81
75
|
/*#__PURE__*/ jsx(ToolbarButton, {
|
|
82
|
-
icon:
|
|
83
|
-
className: "h-5 w-5"
|
|
84
|
-
}),
|
|
76
|
+
icon: StickyNote,
|
|
85
77
|
label: "Add note"
|
|
86
78
|
})
|
|
87
79
|
]
|
|
@@ -30,82 +30,132 @@ const jsx_runtime_namespaceObject = require("react/jsx-runtime");
|
|
|
30
30
|
require("react");
|
|
31
31
|
const external_lucide_react_namespaceObject = require("lucide-react");
|
|
32
32
|
const index_cjs_namespaceObject = require("../../lib/index.cjs");
|
|
33
|
-
function ViewButton({ icon, label,
|
|
33
|
+
function ViewButton({ icon: Icon, label, onClick }) {
|
|
34
34
|
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("button", {
|
|
35
35
|
type: "button",
|
|
36
|
-
className:
|
|
36
|
+
className: "group flex h-8 w-8 items-center justify-center rounded-lg text-foreground-muted hover:bg-surface-hover hover:text-foreground",
|
|
37
37
|
onClick: onClick,
|
|
38
38
|
"aria-label": label,
|
|
39
|
-
children:
|
|
39
|
+
children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(Icon, {
|
|
40
|
+
className: "h-5 w-5 group-hover:h-6 group-hover:w-6"
|
|
41
|
+
})
|
|
40
42
|
});
|
|
41
43
|
}
|
|
42
|
-
function
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
44
|
+
function NodeSIcon() {
|
|
45
|
+
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.GitCommitHorizontal, {
|
|
46
|
+
className: "h-5 w-5"
|
|
47
|
+
});
|
|
48
|
+
}
|
|
49
|
+
function NodeMIcon() {
|
|
50
|
+
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("svg", {
|
|
51
|
+
viewBox: "0 0 20 20",
|
|
52
|
+
className: "h-5 w-5",
|
|
53
|
+
fill: "none",
|
|
54
|
+
"aria-hidden": "true",
|
|
55
|
+
children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("rect", {
|
|
56
|
+
x: "3",
|
|
57
|
+
y: "5",
|
|
58
|
+
width: "14",
|
|
59
|
+
height: "10",
|
|
60
|
+
rx: "2.5",
|
|
61
|
+
stroke: "currentColor",
|
|
62
|
+
strokeWidth: "1.5"
|
|
63
|
+
})
|
|
64
|
+
});
|
|
65
|
+
}
|
|
66
|
+
function NodeLIcon() {
|
|
67
|
+
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("svg", {
|
|
68
|
+
viewBox: "0 0 20 20",
|
|
69
|
+
className: "h-5 w-5",
|
|
70
|
+
fill: "none",
|
|
71
|
+
"aria-hidden": "true",
|
|
72
|
+
children: [
|
|
73
|
+
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("rect", {
|
|
74
|
+
x: "3",
|
|
75
|
+
y: "4",
|
|
76
|
+
width: "14",
|
|
77
|
+
height: "12",
|
|
78
|
+
rx: "2.5",
|
|
79
|
+
stroke: "currentColor",
|
|
80
|
+
strokeWidth: "1.5"
|
|
81
|
+
}),
|
|
82
|
+
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("path", {
|
|
83
|
+
d: "M3 8.5h14",
|
|
84
|
+
stroke: "currentColor",
|
|
85
|
+
strokeWidth: "1.5"
|
|
86
|
+
})
|
|
87
|
+
]
|
|
88
|
+
});
|
|
89
|
+
}
|
|
90
|
+
const nodeSizeIcons = {
|
|
91
|
+
s: NodeSIcon,
|
|
92
|
+
m: NodeMIcon,
|
|
93
|
+
l: NodeLIcon
|
|
94
|
+
};
|
|
95
|
+
const nodeSizeLabels = {
|
|
96
|
+
s: 'Small nodes',
|
|
97
|
+
m: 'Medium nodes',
|
|
98
|
+
l: 'Large nodes'
|
|
99
|
+
};
|
|
100
|
+
function NodeSizeButton({ size, isActive, onClick }) {
|
|
101
|
+
const Icon = nodeSizeIcons[size];
|
|
48
102
|
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("button", {
|
|
49
103
|
type: "button",
|
|
50
|
-
className: (0, index_cjs_namespaceObject.cn)('flex h-8 w-8 items-center justify-center rounded-2xl
|
|
51
|
-
|
|
52
|
-
|
|
104
|
+
className: (0, index_cjs_namespaceObject.cn)('flex h-8 w-8 items-center justify-center rounded-2xl', isActive ? 'border border-surface-hover bg-surface text-foreground-accent shadow-[0px_4px_4px_0px_rgba(0,0,0,0.05)] hover:border-transparent hover:bg-surface-hover hover:text-foreground hover:shadow-none' : 'text-foreground-muted hover:bg-surface-hover hover:text-foreground'),
|
|
105
|
+
onClick: onClick,
|
|
106
|
+
"aria-label": nodeSizeLabels[size],
|
|
107
|
+
children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(Icon, {})
|
|
53
108
|
});
|
|
54
109
|
}
|
|
55
|
-
function FlowViewToolbar({ className, activeNodeSize = 's', onAction }) {
|
|
110
|
+
function FlowViewToolbar({ className, activeNodeSize = 's', onNodeSizeChange, onAction }) {
|
|
56
111
|
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
|
|
57
112
|
className: (0, index_cjs_namespaceObject.cn)('flex flex-col gap-4', className),
|
|
58
113
|
children: [
|
|
59
114
|
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
|
|
60
|
-
className: "flex w-10 flex-col items-center gap-1 rounded-xl bg-surface-raised p-1",
|
|
115
|
+
className: "flex w-10 flex-col items-center gap-1 rounded-xl border border-border-subtle bg-surface-raised p-1",
|
|
61
116
|
children: [
|
|
62
117
|
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ViewButton, {
|
|
63
|
-
icon:
|
|
64
|
-
className: "h-5 w-5"
|
|
65
|
-
}),
|
|
118
|
+
icon: external_lucide_react_namespaceObject.ZoomIn,
|
|
66
119
|
label: "Zoom in",
|
|
67
120
|
onClick: ()=>onAction?.('zoom-in')
|
|
68
121
|
}),
|
|
69
122
|
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ViewButton, {
|
|
70
|
-
icon:
|
|
71
|
-
className: "h-5 w-5"
|
|
72
|
-
}),
|
|
123
|
+
icon: external_lucide_react_namespaceObject.ZoomOut,
|
|
73
124
|
label: "Zoom out",
|
|
74
125
|
onClick: ()=>onAction?.('zoom-out')
|
|
75
126
|
}),
|
|
76
127
|
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
|
|
77
|
-
className: "h-px w-6 bg-
|
|
128
|
+
className: "h-px w-6 bg-surface-overlay"
|
|
78
129
|
}),
|
|
79
130
|
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ViewButton, {
|
|
80
|
-
icon:
|
|
81
|
-
className: "h-5 w-5"
|
|
82
|
-
}),
|
|
131
|
+
icon: external_lucide_react_namespaceObject.Maximize2,
|
|
83
132
|
label: "Fit to screen",
|
|
84
133
|
onClick: ()=>onAction?.('fit')
|
|
85
134
|
}),
|
|
86
135
|
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ViewButton, {
|
|
87
|
-
icon:
|
|
88
|
-
className: "h-5 w-5"
|
|
89
|
-
}),
|
|
136
|
+
icon: external_lucide_react_namespaceObject.LayoutGrid,
|
|
90
137
|
label: "Toggle grid",
|
|
91
138
|
onClick: ()=>onAction?.('grid')
|
|
92
139
|
})
|
|
93
140
|
]
|
|
94
141
|
}),
|
|
95
142
|
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
|
|
96
|
-
className: "flex w-10 flex-col items-center gap-2 rounded-[20px] border border-border-
|
|
143
|
+
className: "flex w-10 flex-col items-center gap-2 rounded-[20px] border border-border-subtle bg-surface-raised p-1",
|
|
97
144
|
children: [
|
|
98
|
-
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(
|
|
145
|
+
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(NodeSizeButton, {
|
|
99
146
|
size: "s",
|
|
100
|
-
isActive: 's' === activeNodeSize
|
|
147
|
+
isActive: 's' === activeNodeSize,
|
|
148
|
+
onClick: ()=>onNodeSizeChange?.('s')
|
|
101
149
|
}),
|
|
102
|
-
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(
|
|
150
|
+
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(NodeSizeButton, {
|
|
103
151
|
size: "m",
|
|
104
|
-
isActive: 'm' === activeNodeSize
|
|
152
|
+
isActive: 'm' === activeNodeSize,
|
|
153
|
+
onClick: ()=>onNodeSizeChange?.('m')
|
|
105
154
|
}),
|
|
106
|
-
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(
|
|
155
|
+
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(NodeSizeButton, {
|
|
107
156
|
size: "l",
|
|
108
|
-
isActive: 'l' === activeNodeSize
|
|
157
|
+
isActive: 'l' === activeNodeSize,
|
|
158
|
+
onClick: ()=>onNodeSizeChange?.('l')
|
|
109
159
|
})
|
|
110
160
|
]
|
|
111
161
|
})
|
|
@@ -2,6 +2,8 @@ export interface ViewToolbarProps {
|
|
|
2
2
|
className?: string;
|
|
3
3
|
/** Active node size: 's' | 'm' | 'l' */
|
|
4
4
|
activeNodeSize?: 's' | 'm' | 'l';
|
|
5
|
+
/** Callback when node size changes */
|
|
6
|
+
onNodeSizeChange?: (size: 's' | 'm' | 'l') => void;
|
|
5
7
|
/** Callback for zoom/view actions */
|
|
6
8
|
onAction?: (action: string) => void;
|
|
7
9
|
}
|
|
@@ -11,4 +13,4 @@ export interface ViewToolbarProps {
|
|
|
11
13
|
* Contains zoom in/out, fit-to-screen, grid toggle, and node size selector.
|
|
12
14
|
* Anchored to bottom-right via absolute positioning in the parent layout.
|
|
13
15
|
*/
|
|
14
|
-
export declare function FlowViewToolbar({ className, activeNodeSize, onAction, }: ViewToolbarProps): import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
export declare function FlowViewToolbar({ className, activeNodeSize, onNodeSizeChange, onAction, }: ViewToolbarProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,83 +1,133 @@
|
|
|
1
1
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
2
|
import "react";
|
|
3
|
-
import { LayoutGrid, Maximize2, ZoomIn, ZoomOut } from "lucide-react";
|
|
3
|
+
import { GitCommitHorizontal, LayoutGrid, Maximize2, ZoomIn, ZoomOut } from "lucide-react";
|
|
4
4
|
import { cn } from "../../lib/index.js";
|
|
5
|
-
function ViewButton({ icon, label,
|
|
5
|
+
function ViewButton({ icon: Icon, label, onClick }) {
|
|
6
6
|
return /*#__PURE__*/ jsx("button", {
|
|
7
7
|
type: "button",
|
|
8
|
-
className:
|
|
8
|
+
className: "group flex h-8 w-8 items-center justify-center rounded-lg text-foreground-muted hover:bg-surface-hover hover:text-foreground",
|
|
9
9
|
onClick: onClick,
|
|
10
10
|
"aria-label": label,
|
|
11
|
-
children:
|
|
11
|
+
children: /*#__PURE__*/ jsx(Icon, {
|
|
12
|
+
className: "h-5 w-5 group-hover:h-6 group-hover:w-6"
|
|
13
|
+
})
|
|
12
14
|
});
|
|
13
15
|
}
|
|
14
|
-
function
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
16
|
+
function NodeSIcon() {
|
|
17
|
+
return /*#__PURE__*/ jsx(GitCommitHorizontal, {
|
|
18
|
+
className: "h-5 w-5"
|
|
19
|
+
});
|
|
20
|
+
}
|
|
21
|
+
function NodeMIcon() {
|
|
22
|
+
return /*#__PURE__*/ jsx("svg", {
|
|
23
|
+
viewBox: "0 0 20 20",
|
|
24
|
+
className: "h-5 w-5",
|
|
25
|
+
fill: "none",
|
|
26
|
+
"aria-hidden": "true",
|
|
27
|
+
children: /*#__PURE__*/ jsx("rect", {
|
|
28
|
+
x: "3",
|
|
29
|
+
y: "5",
|
|
30
|
+
width: "14",
|
|
31
|
+
height: "10",
|
|
32
|
+
rx: "2.5",
|
|
33
|
+
stroke: "currentColor",
|
|
34
|
+
strokeWidth: "1.5"
|
|
35
|
+
})
|
|
36
|
+
});
|
|
37
|
+
}
|
|
38
|
+
function NodeLIcon() {
|
|
39
|
+
return /*#__PURE__*/ jsxs("svg", {
|
|
40
|
+
viewBox: "0 0 20 20",
|
|
41
|
+
className: "h-5 w-5",
|
|
42
|
+
fill: "none",
|
|
43
|
+
"aria-hidden": "true",
|
|
44
|
+
children: [
|
|
45
|
+
/*#__PURE__*/ jsx("rect", {
|
|
46
|
+
x: "3",
|
|
47
|
+
y: "4",
|
|
48
|
+
width: "14",
|
|
49
|
+
height: "12",
|
|
50
|
+
rx: "2.5",
|
|
51
|
+
stroke: "currentColor",
|
|
52
|
+
strokeWidth: "1.5"
|
|
53
|
+
}),
|
|
54
|
+
/*#__PURE__*/ jsx("path", {
|
|
55
|
+
d: "M3 8.5h14",
|
|
56
|
+
stroke: "currentColor",
|
|
57
|
+
strokeWidth: "1.5"
|
|
58
|
+
})
|
|
59
|
+
]
|
|
60
|
+
});
|
|
61
|
+
}
|
|
62
|
+
const nodeSizeIcons = {
|
|
63
|
+
s: NodeSIcon,
|
|
64
|
+
m: NodeMIcon,
|
|
65
|
+
l: NodeLIcon
|
|
66
|
+
};
|
|
67
|
+
const nodeSizeLabels = {
|
|
68
|
+
s: 'Small nodes',
|
|
69
|
+
m: 'Medium nodes',
|
|
70
|
+
l: 'Large nodes'
|
|
71
|
+
};
|
|
72
|
+
function NodeSizeButton({ size, isActive, onClick }) {
|
|
73
|
+
const Icon = nodeSizeIcons[size];
|
|
20
74
|
return /*#__PURE__*/ jsx("button", {
|
|
21
75
|
type: "button",
|
|
22
|
-
className: cn('flex h-8 w-8 items-center justify-center rounded-2xl
|
|
23
|
-
|
|
24
|
-
|
|
76
|
+
className: cn('flex h-8 w-8 items-center justify-center rounded-2xl', isActive ? 'border border-surface-hover bg-surface text-foreground-accent shadow-[0px_4px_4px_0px_rgba(0,0,0,0.05)] hover:border-transparent hover:bg-surface-hover hover:text-foreground hover:shadow-none' : 'text-foreground-muted hover:bg-surface-hover hover:text-foreground'),
|
|
77
|
+
onClick: onClick,
|
|
78
|
+
"aria-label": nodeSizeLabels[size],
|
|
79
|
+
children: /*#__PURE__*/ jsx(Icon, {})
|
|
25
80
|
});
|
|
26
81
|
}
|
|
27
|
-
function FlowViewToolbar({ className, activeNodeSize = 's', onAction }) {
|
|
82
|
+
function FlowViewToolbar({ className, activeNodeSize = 's', onNodeSizeChange, onAction }) {
|
|
28
83
|
return /*#__PURE__*/ jsxs("div", {
|
|
29
84
|
className: cn('flex flex-col gap-4', className),
|
|
30
85
|
children: [
|
|
31
86
|
/*#__PURE__*/ jsxs("div", {
|
|
32
|
-
className: "flex w-10 flex-col items-center gap-1 rounded-xl bg-surface-raised p-1",
|
|
87
|
+
className: "flex w-10 flex-col items-center gap-1 rounded-xl border border-border-subtle bg-surface-raised p-1",
|
|
33
88
|
children: [
|
|
34
89
|
/*#__PURE__*/ jsx(ViewButton, {
|
|
35
|
-
icon:
|
|
36
|
-
className: "h-5 w-5"
|
|
37
|
-
}),
|
|
90
|
+
icon: ZoomIn,
|
|
38
91
|
label: "Zoom in",
|
|
39
92
|
onClick: ()=>onAction?.('zoom-in')
|
|
40
93
|
}),
|
|
41
94
|
/*#__PURE__*/ jsx(ViewButton, {
|
|
42
|
-
icon:
|
|
43
|
-
className: "h-5 w-5"
|
|
44
|
-
}),
|
|
95
|
+
icon: ZoomOut,
|
|
45
96
|
label: "Zoom out",
|
|
46
97
|
onClick: ()=>onAction?.('zoom-out')
|
|
47
98
|
}),
|
|
48
99
|
/*#__PURE__*/ jsx("div", {
|
|
49
|
-
className: "h-px w-6 bg-
|
|
100
|
+
className: "h-px w-6 bg-surface-overlay"
|
|
50
101
|
}),
|
|
51
102
|
/*#__PURE__*/ jsx(ViewButton, {
|
|
52
|
-
icon:
|
|
53
|
-
className: "h-5 w-5"
|
|
54
|
-
}),
|
|
103
|
+
icon: Maximize2,
|
|
55
104
|
label: "Fit to screen",
|
|
56
105
|
onClick: ()=>onAction?.('fit')
|
|
57
106
|
}),
|
|
58
107
|
/*#__PURE__*/ jsx(ViewButton, {
|
|
59
|
-
icon:
|
|
60
|
-
className: "h-5 w-5"
|
|
61
|
-
}),
|
|
108
|
+
icon: LayoutGrid,
|
|
62
109
|
label: "Toggle grid",
|
|
63
110
|
onClick: ()=>onAction?.('grid')
|
|
64
111
|
})
|
|
65
112
|
]
|
|
66
113
|
}),
|
|
67
114
|
/*#__PURE__*/ jsxs("div", {
|
|
68
|
-
className: "flex w-10 flex-col items-center gap-2 rounded-[20px] border border-border-
|
|
115
|
+
className: "flex w-10 flex-col items-center gap-2 rounded-[20px] border border-border-subtle bg-surface-raised p-1",
|
|
69
116
|
children: [
|
|
70
|
-
/*#__PURE__*/ jsx(
|
|
117
|
+
/*#__PURE__*/ jsx(NodeSizeButton, {
|
|
71
118
|
size: "s",
|
|
72
|
-
isActive: 's' === activeNodeSize
|
|
119
|
+
isActive: 's' === activeNodeSize,
|
|
120
|
+
onClick: ()=>onNodeSizeChange?.('s')
|
|
73
121
|
}),
|
|
74
|
-
/*#__PURE__*/ jsx(
|
|
122
|
+
/*#__PURE__*/ jsx(NodeSizeButton, {
|
|
75
123
|
size: "m",
|
|
76
|
-
isActive: 'm' === activeNodeSize
|
|
124
|
+
isActive: 'm' === activeNodeSize,
|
|
125
|
+
onClick: ()=>onNodeSizeChange?.('m')
|
|
77
126
|
}),
|
|
78
|
-
/*#__PURE__*/ jsx(
|
|
127
|
+
/*#__PURE__*/ jsx(NodeSizeButton, {
|
|
79
128
|
size: "l",
|
|
80
|
-
isActive: 'l' === activeNodeSize
|
|
129
|
+
isActive: 'l' === activeNodeSize,
|
|
130
|
+
onClick: ()=>onNodeSizeChange?.('l')
|
|
81
131
|
})
|
|
82
132
|
]
|
|
83
133
|
})
|
|
@@ -24,16 +24,16 @@ var __webpack_modules__ = {
|
|
|
24
24
|
"./button-group" (module) {
|
|
25
25
|
module.exports = require("./button-group.cjs");
|
|
26
26
|
},
|
|
27
|
-
"
|
|
27
|
+
"@/components/ui/button" (module) {
|
|
28
28
|
module.exports = require("./button.cjs");
|
|
29
29
|
},
|
|
30
|
-
"
|
|
30
|
+
"@/components/ui/calendar" (module) {
|
|
31
31
|
module.exports = require("./calendar.cjs");
|
|
32
32
|
},
|
|
33
|
-
"
|
|
33
|
+
"./card" (module) {
|
|
34
34
|
module.exports = require("./card.cjs");
|
|
35
35
|
},
|
|
36
|
-
"
|
|
36
|
+
"@/components/ui/checkbox" (module) {
|
|
37
37
|
module.exports = require("./checkbox.cjs");
|
|
38
38
|
},
|
|
39
39
|
"@/components/ui/collapsible" (module) {
|
|
@@ -45,7 +45,7 @@ var __webpack_modules__ = {
|
|
|
45
45
|
"@/components/ui/command" (module) {
|
|
46
46
|
module.exports = require("./command.cjs");
|
|
47
47
|
},
|
|
48
|
-
"
|
|
48
|
+
"./context-menu" (module) {
|
|
49
49
|
module.exports = require("./context-menu.cjs");
|
|
50
50
|
},
|
|
51
51
|
"./data-table" (module) {
|
|
@@ -72,10 +72,10 @@ var __webpack_modules__ = {
|
|
|
72
72
|
"./file-upload" (module) {
|
|
73
73
|
module.exports = require("./file-upload.cjs");
|
|
74
74
|
},
|
|
75
|
-
"
|
|
75
|
+
"./hover-card" (module) {
|
|
76
76
|
module.exports = require("./hover-card.cjs");
|
|
77
77
|
},
|
|
78
|
-
"
|
|
78
|
+
"@/components/ui/input" (module) {
|
|
79
79
|
module.exports = require("./input.cjs");
|
|
80
80
|
},
|
|
81
81
|
"@/components/ui/label" (module) {
|
|
@@ -90,7 +90,7 @@ var __webpack_modules__ = {
|
|
|
90
90
|
"./pagination" (module) {
|
|
91
91
|
module.exports = require("./pagination.cjs");
|
|
92
92
|
},
|
|
93
|
-
"
|
|
93
|
+
"@/components/ui/popover" (module) {
|
|
94
94
|
module.exports = require("./popover.cjs");
|
|
95
95
|
},
|
|
96
96
|
"./progress" (module) {
|
|
@@ -255,7 +255,7 @@ var __webpack_exports__ = {};
|
|
|
255
255
|
"default"
|
|
256
256
|
].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_breadcrumb__rspack_import_6[__rspack_import_key];
|
|
257
257
|
__webpack_require__.d(__webpack_exports__, __rspack_reexport);
|
|
258
|
-
var _button__rspack_import_7 = __webpack_require__("
|
|
258
|
+
var _button__rspack_import_7 = __webpack_require__("@/components/ui/button");
|
|
259
259
|
var __rspack_reexport = {};
|
|
260
260
|
for(const __rspack_import_key in _button__rspack_import_7)if ([
|
|
261
261
|
"TreeView",
|
|
@@ -269,21 +269,21 @@ var __webpack_exports__ = {};
|
|
|
269
269
|
"default"
|
|
270
270
|
].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_button_group__rspack_import_8[__rspack_import_key];
|
|
271
271
|
__webpack_require__.d(__webpack_exports__, __rspack_reexport);
|
|
272
|
-
var _calendar__rspack_import_9 = __webpack_require__("
|
|
272
|
+
var _calendar__rspack_import_9 = __webpack_require__("@/components/ui/calendar");
|
|
273
273
|
var __rspack_reexport = {};
|
|
274
274
|
for(const __rspack_import_key in _calendar__rspack_import_9)if ([
|
|
275
275
|
"TreeView",
|
|
276
276
|
"default"
|
|
277
277
|
].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_calendar__rspack_import_9[__rspack_import_key];
|
|
278
278
|
__webpack_require__.d(__webpack_exports__, __rspack_reexport);
|
|
279
|
-
var _card__rspack_import_10 = __webpack_require__("
|
|
279
|
+
var _card__rspack_import_10 = __webpack_require__("./card");
|
|
280
280
|
var __rspack_reexport = {};
|
|
281
281
|
for(const __rspack_import_key in _card__rspack_import_10)if ([
|
|
282
282
|
"TreeView",
|
|
283
283
|
"default"
|
|
284
284
|
].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_card__rspack_import_10[__rspack_import_key];
|
|
285
285
|
__webpack_require__.d(__webpack_exports__, __rspack_reexport);
|
|
286
|
-
var _checkbox__rspack_import_11 = __webpack_require__("
|
|
286
|
+
var _checkbox__rspack_import_11 = __webpack_require__("@/components/ui/checkbox");
|
|
287
287
|
var __rspack_reexport = {};
|
|
288
288
|
for(const __rspack_import_key in _checkbox__rspack_import_11)if ([
|
|
289
289
|
"TreeView",
|
|
@@ -311,7 +311,7 @@ var __webpack_exports__ = {};
|
|
|
311
311
|
"default"
|
|
312
312
|
].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_command__rspack_import_14[__rspack_import_key];
|
|
313
313
|
__webpack_require__.d(__webpack_exports__, __rspack_reexport);
|
|
314
|
-
var _context_menu__rspack_import_15 = __webpack_require__("
|
|
314
|
+
var _context_menu__rspack_import_15 = __webpack_require__("./context-menu");
|
|
315
315
|
var __rspack_reexport = {};
|
|
316
316
|
for(const __rspack_import_key in _context_menu__rspack_import_15)if ([
|
|
317
317
|
"TreeView",
|
|
@@ -374,14 +374,14 @@ var __webpack_exports__ = {};
|
|
|
374
374
|
"default"
|
|
375
375
|
].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_file_upload__rspack_import_23[__rspack_import_key];
|
|
376
376
|
__webpack_require__.d(__webpack_exports__, __rspack_reexport);
|
|
377
|
-
var _hover_card__rspack_import_24 = __webpack_require__("
|
|
377
|
+
var _hover_card__rspack_import_24 = __webpack_require__("./hover-card");
|
|
378
378
|
var __rspack_reexport = {};
|
|
379
379
|
for(const __rspack_import_key in _hover_card__rspack_import_24)if ([
|
|
380
380
|
"TreeView",
|
|
381
381
|
"default"
|
|
382
382
|
].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_hover_card__rspack_import_24[__rspack_import_key];
|
|
383
383
|
__webpack_require__.d(__webpack_exports__, __rspack_reexport);
|
|
384
|
-
var _input__rspack_import_25 = __webpack_require__("
|
|
384
|
+
var _input__rspack_import_25 = __webpack_require__("@/components/ui/input");
|
|
385
385
|
var __rspack_reexport = {};
|
|
386
386
|
for(const __rspack_import_key in _input__rspack_import_25)if ([
|
|
387
387
|
"TreeView",
|
|
@@ -416,7 +416,7 @@ var __webpack_exports__ = {};
|
|
|
416
416
|
"default"
|
|
417
417
|
].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_pagination__rspack_import_29[__rspack_import_key];
|
|
418
418
|
__webpack_require__.d(__webpack_exports__, __rspack_reexport);
|
|
419
|
-
var _popover__rspack_import_30 = __webpack_require__("
|
|
419
|
+
var _popover__rspack_import_30 = __webpack_require__("@/components/ui/popover");
|
|
420
420
|
var __rspack_reexport = {};
|
|
421
421
|
for(const __rspack_import_key in _popover__rspack_import_30)if ([
|
|
422
422
|
"TreeView",
|