@uipath/apollo-wind 0.12.2 → 0.14.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.
@@ -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-border-subtle"
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 transition-colors hover:text-foreground",
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: icon
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-3xl border border-border bg-surface-raised px-2.5', className),
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-border-deep bg-surface-overlay p-1",
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 transition-colors', 'build' === activeMode ? 'border border-border bg-surface text-foreground' : 'text-foreground-subtle hover:text-foreground-hover'),
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: "h-5 w-5"
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 transition-colors', 'evaluate' === activeMode ? 'border border-border bg-surface text-foreground' : 'text-foreground-subtle hover:text-foreground-hover'),
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: "h-5 w-5"
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: /*#__PURE__*/ jsx(Undo2, {
57
- className: "h-5 w-5"
58
- }),
58
+ icon: Undo2,
59
59
  label: "Undo"
60
60
  }),
61
61
  /*#__PURE__*/ jsx(ToolbarButton, {
62
- icon: /*#__PURE__*/ jsx(Redo2, {
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: /*#__PURE__*/ jsx(Play, {
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: /*#__PURE__*/ jsx(Plus, {
77
- className: "h-5 w-5"
78
- }),
72
+ icon: Plus,
79
73
  label: "Add node"
80
74
  }),
81
75
  /*#__PURE__*/ jsx(ToolbarButton, {
82
- icon: /*#__PURE__*/ jsx(StickyNote, {
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, isActive, onClick }) {
33
+ function ViewButton({ icon: Icon, label, onClick }) {
34
34
  return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("button", {
35
35
  type: "button",
36
- className: (0, index_cjs_namespaceObject.cn)('flex h-8 w-8 items-center justify-center rounded-lg text-foreground-muted transition-colors hover:text-foreground', isActive && 'rounded-2xl border border-border bg-surface text-foreground'),
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: icon
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 NodeSizeIcon({ size, isActive }) {
43
- const label = {
44
- s: 'S',
45
- m: 'M',
46
- l: 'L'
47
- }[size];
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 text-xs font-bold text-foreground-muted transition-colors hover:text-foreground', isActive && 'border border-border bg-surface text-foreground'),
51
- "aria-label": `Node size ${label}`,
52
- children: label
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: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.ZoomIn, {
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: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.ZoomOut, {
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-border-subtle"
128
+ className: "h-px w-6 bg-surface-overlay"
78
129
  }),
79
130
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ViewButton, {
80
- icon: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.Maximize2, {
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: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.LayoutGrid, {
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-deep bg-surface-raised p-1",
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)(NodeSizeIcon, {
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)(NodeSizeIcon, {
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)(NodeSizeIcon, {
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, isActive, onClick }) {
5
+ function ViewButton({ icon: Icon, label, onClick }) {
6
6
  return /*#__PURE__*/ jsx("button", {
7
7
  type: "button",
8
- className: cn('flex h-8 w-8 items-center justify-center rounded-lg text-foreground-muted transition-colors hover:text-foreground', isActive && 'rounded-2xl border border-border bg-surface text-foreground'),
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: icon
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 NodeSizeIcon({ size, isActive }) {
15
- const label = {
16
- s: 'S',
17
- m: 'M',
18
- l: 'L'
19
- }[size];
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 text-xs font-bold text-foreground-muted transition-colors hover:text-foreground', isActive && 'border border-border bg-surface text-foreground'),
23
- "aria-label": `Node size ${label}`,
24
- children: label
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: /*#__PURE__*/ jsx(ZoomIn, {
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: /*#__PURE__*/ jsx(ZoomOut, {
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-border-subtle"
100
+ className: "h-px w-6 bg-surface-overlay"
50
101
  }),
51
102
  /*#__PURE__*/ jsx(ViewButton, {
52
- icon: /*#__PURE__*/ jsx(Maximize2, {
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: /*#__PURE__*/ jsx(LayoutGrid, {
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-deep bg-surface-raised p-1",
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(NodeSizeIcon, {
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(NodeSizeIcon, {
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(NodeSizeIcon, {
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
  })
@@ -27,13 +27,13 @@ var __webpack_modules__ = {
27
27
  "@/components/ui/button" (module) {
28
28
  module.exports = require("./button.cjs");
29
29
  },
30
- "@/components/ui/calendar" (module) {
30
+ "./calendar" (module) {
31
31
  module.exports = require("./calendar.cjs");
32
32
  },
33
- "@/components/ui/card" (module) {
33
+ "./card" (module) {
34
34
  module.exports = require("./card.cjs");
35
35
  },
36
- "./checkbox" (module) {
36
+ "@/components/ui/checkbox" (module) {
37
37
  module.exports = require("./checkbox.cjs");
38
38
  },
39
39
  "@/components/ui/collapsible" (module) {
@@ -63,7 +63,7 @@ var __webpack_modules__ = {
63
63
  "@/components/ui/dropdown-menu" (module) {
64
64
  module.exports = require("./dropdown-menu.cjs");
65
65
  },
66
- "@/components/ui/editable-cell" (module) {
66
+ "./editable-cell" (module) {
67
67
  module.exports = require("./editable-cell.cjs");
68
68
  },
69
69
  "./empty-state" (module) {
@@ -75,7 +75,7 @@ var __webpack_modules__ = {
75
75
  "@/components/ui/hover-card" (module) {
76
76
  module.exports = require("./hover-card.cjs");
77
77
  },
78
- "./input" (module) {
78
+ "@/components/ui/input" (module) {
79
79
  module.exports = require("./input.cjs");
80
80
  },
81
81
  "@/components/ui/label" (module) {
@@ -138,7 +138,7 @@ var __webpack_modules__ = {
138
138
  "./switch" (module) {
139
139
  module.exports = require("./switch.cjs");
140
140
  },
141
- "@/components/ui/table" (module) {
141
+ "./table" (module) {
142
142
  module.exports = require("./table.cjs");
143
143
  },
144
144
  "./tabs" (module) {
@@ -150,7 +150,7 @@ var __webpack_modules__ = {
150
150
  "./toggle-group" (module) {
151
151
  module.exports = require("./toggle-group.cjs");
152
152
  },
153
- "@/components/ui/toggle" (module) {
153
+ "./toggle" (module) {
154
154
  module.exports = require("./toggle.cjs");
155
155
  },
156
156
  "./tooltip" (module) {
@@ -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__("@/components/ui/calendar");
272
+ var _calendar__rspack_import_9 = __webpack_require__("./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__("@/components/ui/card");
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__("./checkbox");
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",
@@ -353,7 +353,7 @@ var __webpack_exports__ = {};
353
353
  "default"
354
354
  ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_dropdown_menu__rspack_import_20[__rspack_import_key];
355
355
  __webpack_require__.d(__webpack_exports__, __rspack_reexport);
356
- var _editable_cell__rspack_import_21 = __webpack_require__("@/components/ui/editable-cell");
356
+ var _editable_cell__rspack_import_21 = __webpack_require__("./editable-cell");
357
357
  var __rspack_reexport = {};
358
358
  for(const __rspack_import_key in _editable_cell__rspack_import_21)if ([
359
359
  "TreeView",
@@ -381,7 +381,7 @@ var __webpack_exports__ = {};
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__("./input");
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",
@@ -528,7 +528,7 @@ var __webpack_exports__ = {};
528
528
  "default"
529
529
  ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_switch__rspack_import_45[__rspack_import_key];
530
530
  __webpack_require__.d(__webpack_exports__, __rspack_reexport);
531
- var _table__rspack_import_46 = __webpack_require__("@/components/ui/table");
531
+ var _table__rspack_import_46 = __webpack_require__("./table");
532
532
  var __rspack_reexport = {};
533
533
  for(const __rspack_import_key in _table__rspack_import_46)if ([
534
534
  "TreeView",
@@ -549,7 +549,7 @@ var __webpack_exports__ = {};
549
549
  "default"
550
550
  ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_textarea__rspack_import_48[__rspack_import_key];
551
551
  __webpack_require__.d(__webpack_exports__, __rspack_reexport);
552
- var _toggle__rspack_import_49 = __webpack_require__("@/components/ui/toggle");
552
+ var _toggle__rspack_import_49 = __webpack_require__("./toggle");
553
553
  var __rspack_reexport = {};
554
554
  for(const __rspack_import_key in _toggle__rspack_import_49)if ([
555
555
  "TreeView",
@@ -34,14 +34,19 @@ const external_react_namespaceObject = require("react");
34
34
  const index_cjs_namespaceObject = require("../../lib/index.cjs");
35
35
  const ScrollArea = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, children, ...props }, ref)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(react_scroll_area_namespaceObject.Root, {
36
36
  ref: ref,
37
- className: (0, index_cjs_namespaceObject.cn)('relative overflow-hidden', className),
37
+ className: (0, index_cjs_namespaceObject.cn)('relative overflow-hidden overscroll-x-contain', className),
38
38
  ...props,
39
39
  children: [
40
40
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_scroll_area_namespaceObject.Viewport, {
41
41
  className: "h-full w-full rounded-[inherit]",
42
42
  children: children
43
43
  }),
44
- /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ScrollBar, {}),
44
+ /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ScrollBar, {
45
+ orientation: "vertical"
46
+ }),
47
+ /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ScrollBar, {
48
+ orientation: "horizontal"
49
+ }),
45
50
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_scroll_area_namespaceObject.Corner, {})
46
51
  ]
47
52
  }));
@@ -49,7 +54,7 @@ ScrollArea.displayName = react_scroll_area_namespaceObject.Root.displayName;
49
54
  const ScrollBar = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, orientation = 'vertical', ...props }, ref)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_scroll_area_namespaceObject.ScrollAreaScrollbar, {
50
55
  ref: ref,
51
56
  orientation: orientation,
52
- className: (0, index_cjs_namespaceObject.cn)('flex touch-none select-none transition-colors', 'vertical' === orientation && 'h-full w-2.5 border-l border-l-transparent p-[1px]', 'horizontal' === orientation && 'h-2.5 flex-col border-t border-t-transparent p-[1px]', className),
57
+ className: (0, index_cjs_namespaceObject.cn)('flex touch-none select-none transition-colors', 'vertical' === orientation && 'h-full w-2.5 border-l border-l-transparent p-px', 'horizontal' === orientation && 'h-2.5 flex-col border-t border-t-transparent p-px', className),
53
58
  ...props,
54
59
  children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_scroll_area_namespaceObject.ScrollAreaThumb, {
55
60
  className: "relative flex-1 rounded-full bg-border"
@@ -5,14 +5,19 @@ import { forwardRef } from "react";
5
5
  import { cn } from "../../lib/index.js";
6
6
  const ScrollArea = /*#__PURE__*/ forwardRef(({ className, children, ...props }, ref)=>/*#__PURE__*/ jsxs(Root, {
7
7
  ref: ref,
8
- className: cn('relative overflow-hidden', className),
8
+ className: cn('relative overflow-hidden overscroll-x-contain', className),
9
9
  ...props,
10
10
  children: [
11
11
  /*#__PURE__*/ jsx(Viewport, {
12
12
  className: "h-full w-full rounded-[inherit]",
13
13
  children: children
14
14
  }),
15
- /*#__PURE__*/ jsx(ScrollBar, {}),
15
+ /*#__PURE__*/ jsx(ScrollBar, {
16
+ orientation: "vertical"
17
+ }),
18
+ /*#__PURE__*/ jsx(ScrollBar, {
19
+ orientation: "horizontal"
20
+ }),
16
21
  /*#__PURE__*/ jsx(Corner, {})
17
22
  ]
18
23
  }));
@@ -20,7 +25,7 @@ ScrollArea.displayName = Root.displayName;
20
25
  const ScrollBar = /*#__PURE__*/ forwardRef(({ className, orientation = 'vertical', ...props }, ref)=>/*#__PURE__*/ jsx(ScrollAreaScrollbar, {
21
26
  ref: ref,
22
27
  orientation: orientation,
23
- className: cn('flex touch-none select-none transition-colors', 'vertical' === orientation && 'h-full w-2.5 border-l border-l-transparent p-[1px]', 'horizontal' === orientation && 'h-2.5 flex-col border-t border-t-transparent p-[1px]', className),
28
+ className: cn('flex touch-none select-none transition-colors', 'vertical' === orientation && 'h-full w-2.5 border-l border-l-transparent p-px', 'horizontal' === orientation && 'h-2.5 flex-col border-t border-t-transparent p-px', className),
24
29
  ...props,
25
30
  children: /*#__PURE__*/ jsx(ScrollAreaThumb, {
26
31
  className: "relative flex-1 rounded-full bg-border"