@cytario/design 6.0.1 → 7.0.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/index.css +1 -1
- package/dist/index.d.ts +88 -128
- package/dist/index.js +727 -732
- package/dist/index.js.map +1 -1
- package/package.json +2 -8
- package/src/tokens/variables-dark.css +1 -1
package/dist/index.js
CHANGED
|
@@ -5,102 +5,298 @@ import { RouterProvider } from "react-aria-components";
|
|
|
5
5
|
|
|
6
6
|
// src/components/Button/Button.tsx
|
|
7
7
|
import {
|
|
8
|
-
Button as AriaButton
|
|
8
|
+
Button as AriaButton,
|
|
9
|
+
Link as AriaLink
|
|
9
10
|
} from "react-aria-components";
|
|
10
|
-
import { twMerge } from "tailwind-merge";
|
|
11
|
+
import { twMerge as twMerge3 } from "tailwind-merge";
|
|
11
12
|
|
|
12
13
|
// src/components/_shared/styles.ts
|
|
13
14
|
var sizeStyles = {
|
|
14
|
-
xs: "px-2 py-1 text-xs",
|
|
15
|
+
xs: "px-2 py-1.5 text-xs",
|
|
15
16
|
sm: "px-3 py-1.5 text-sm",
|
|
16
17
|
md: "px-4 py-2 text-base",
|
|
17
18
|
lg: "px-6 py-3 text-lg"
|
|
18
19
|
};
|
|
19
20
|
var variantStyles = {
|
|
20
|
-
primary:
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
secondary:
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
destructive:
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
success:
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
warning:
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
info:
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
neutral:
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
outline:
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
ghost:
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
21
|
+
primary: `
|
|
22
|
+
bg-primary text-primary-foreground
|
|
23
|
+
hover:bg-primary-hover
|
|
24
|
+
pressed:bg-primary-pressed
|
|
25
|
+
`,
|
|
26
|
+
secondary: `
|
|
27
|
+
bg-secondary text-secondary-foreground
|
|
28
|
+
hover:bg-secondary-hover
|
|
29
|
+
pressed:bg-secondary-pressed
|
|
30
|
+
`,
|
|
31
|
+
destructive: `
|
|
32
|
+
bg-destructive text-destructive-foreground
|
|
33
|
+
hover:bg-destructive-hover
|
|
34
|
+
pressed:bg-destructive-pressed
|
|
35
|
+
`,
|
|
36
|
+
success: `
|
|
37
|
+
bg-success text-success-foreground
|
|
38
|
+
hover:bg-success-hover
|
|
39
|
+
pressed:bg-success-pressed
|
|
40
|
+
`,
|
|
41
|
+
warning: `
|
|
42
|
+
bg-warning text-warning-foreground
|
|
43
|
+
hover:bg-warning-hover
|
|
44
|
+
pressed:bg-warning-pressed
|
|
45
|
+
`,
|
|
46
|
+
info: `
|
|
47
|
+
bg-info text-info-foreground
|
|
48
|
+
hover:bg-info-hover
|
|
49
|
+
pressed:bg-info-pressed
|
|
50
|
+
`,
|
|
51
|
+
neutral: `
|
|
52
|
+
bg-muted text-foreground
|
|
53
|
+
hover:bg-accent
|
|
54
|
+
pressed:bg-accent-pressed
|
|
55
|
+
`,
|
|
56
|
+
outline: `
|
|
57
|
+
bg-transparent text-foreground
|
|
58
|
+
border border-border
|
|
59
|
+
hover:bg-muted
|
|
60
|
+
pressed:bg-accent-pressed
|
|
61
|
+
`,
|
|
62
|
+
ghost: `
|
|
63
|
+
bg-transparent text-foreground
|
|
64
|
+
hover:bg-muted
|
|
65
|
+
pressed:bg-accent-pressed
|
|
66
|
+
`
|
|
67
|
+
};
|
|
68
|
+
var selectedStyles = {
|
|
69
|
+
primary: "selected:bg-primary-pressed",
|
|
70
|
+
secondary: "selected:bg-secondary-pressed",
|
|
71
|
+
destructive: "selected:bg-destructive-pressed",
|
|
72
|
+
success: "selected:bg-success-pressed",
|
|
73
|
+
warning: "selected:bg-warning-pressed",
|
|
74
|
+
info: "selected:bg-info-pressed",
|
|
75
|
+
neutral: "selected:bg-accent-pressed",
|
|
76
|
+
outline: "selected:bg-accent-pressed",
|
|
77
|
+
ghost: "selected:bg-accent-pressed"
|
|
78
|
+
};
|
|
79
|
+
|
|
80
|
+
// src/components/Icon/Icon.tsx
|
|
81
|
+
import { twMerge } from "tailwind-merge";
|
|
82
|
+
|
|
83
|
+
// src/components/Icon/icon-registry.ts
|
|
84
|
+
import {
|
|
85
|
+
AlertCircle,
|
|
86
|
+
AlertTriangle,
|
|
87
|
+
AlignCenter,
|
|
88
|
+
AlignLeft,
|
|
89
|
+
AlignRight,
|
|
90
|
+
Archive,
|
|
91
|
+
ArrowDown,
|
|
92
|
+
ArrowRight,
|
|
93
|
+
ArrowUp,
|
|
94
|
+
Ban,
|
|
95
|
+
Bookmark,
|
|
96
|
+
BookmarkCheck,
|
|
97
|
+
Braces,
|
|
98
|
+
Check,
|
|
99
|
+
CheckCircle,
|
|
100
|
+
CheckCircle2,
|
|
101
|
+
ChevronDown,
|
|
102
|
+
ChevronRight,
|
|
103
|
+
ChevronUp,
|
|
104
|
+
Circle,
|
|
105
|
+
CircleDot,
|
|
106
|
+
Clock,
|
|
107
|
+
Cloud,
|
|
108
|
+
Columns2,
|
|
109
|
+
Columns3,
|
|
110
|
+
Copy,
|
|
111
|
+
Download,
|
|
112
|
+
Edit,
|
|
113
|
+
EllipsisVertical,
|
|
114
|
+
ExternalLink,
|
|
115
|
+
Eye,
|
|
116
|
+
EyeOff,
|
|
117
|
+
File,
|
|
118
|
+
FileSearch,
|
|
119
|
+
FileSpreadsheet,
|
|
120
|
+
FilterX,
|
|
121
|
+
Folder,
|
|
122
|
+
FolderPlus,
|
|
123
|
+
FolderTree,
|
|
124
|
+
Fullscreen,
|
|
125
|
+
Grid2x2,
|
|
126
|
+
Grid3x3,
|
|
127
|
+
Heart,
|
|
128
|
+
Image,
|
|
129
|
+
ImageOff,
|
|
130
|
+
Inbox,
|
|
131
|
+
Info,
|
|
132
|
+
Lasso,
|
|
133
|
+
Layers,
|
|
134
|
+
Layers2,
|
|
135
|
+
LayoutGrid,
|
|
136
|
+
List,
|
|
137
|
+
ListFilter,
|
|
138
|
+
LogOut,
|
|
139
|
+
Mail,
|
|
140
|
+
MapPin,
|
|
141
|
+
Maximize,
|
|
142
|
+
Microscope,
|
|
143
|
+
Minus,
|
|
144
|
+
MoreVertical,
|
|
145
|
+
PanelLeftClose,
|
|
146
|
+
PanelLeftOpen,
|
|
147
|
+
PanelRightClose,
|
|
148
|
+
PanelRightOpen,
|
|
149
|
+
Pencil,
|
|
150
|
+
Plug,
|
|
151
|
+
Plus,
|
|
152
|
+
RotateCcw,
|
|
153
|
+
Search,
|
|
154
|
+
SearchX,
|
|
155
|
+
Send,
|
|
156
|
+
Settings,
|
|
157
|
+
Shield,
|
|
158
|
+
ShieldCheck,
|
|
159
|
+
Spline,
|
|
160
|
+
Square,
|
|
161
|
+
Star,
|
|
162
|
+
Table,
|
|
163
|
+
Tag,
|
|
164
|
+
Trash2,
|
|
165
|
+
Unplug,
|
|
166
|
+
User,
|
|
167
|
+
UserMinus,
|
|
168
|
+
UserPlus,
|
|
169
|
+
Users,
|
|
170
|
+
UsersRound,
|
|
171
|
+
X,
|
|
172
|
+
XCircle,
|
|
173
|
+
ZoomIn,
|
|
174
|
+
ZoomOut
|
|
175
|
+
} from "lucide-react";
|
|
176
|
+
var iconRegistry = {
|
|
177
|
+
AlertCircle,
|
|
178
|
+
AlertTriangle,
|
|
179
|
+
AlignCenter,
|
|
180
|
+
AlignLeft,
|
|
181
|
+
AlignRight,
|
|
182
|
+
Archive,
|
|
183
|
+
ArrowDown,
|
|
184
|
+
ArrowRight,
|
|
185
|
+
ArrowUp,
|
|
186
|
+
Ban,
|
|
187
|
+
Bookmark,
|
|
188
|
+
BookmarkCheck,
|
|
189
|
+
Braces,
|
|
190
|
+
Check,
|
|
191
|
+
CheckCircle,
|
|
192
|
+
CheckCircle2,
|
|
193
|
+
ChevronDown,
|
|
194
|
+
ChevronRight,
|
|
195
|
+
ChevronUp,
|
|
196
|
+
Circle,
|
|
197
|
+
CircleDot,
|
|
198
|
+
Clock,
|
|
199
|
+
Cloud,
|
|
200
|
+
Columns2,
|
|
201
|
+
Columns3,
|
|
202
|
+
Copy,
|
|
203
|
+
Download,
|
|
204
|
+
Edit,
|
|
205
|
+
EllipsisVertical,
|
|
206
|
+
ExternalLink,
|
|
207
|
+
Eye,
|
|
208
|
+
EyeOff,
|
|
209
|
+
File,
|
|
210
|
+
FileSearch,
|
|
211
|
+
FileSpreadsheet,
|
|
212
|
+
FilterX,
|
|
213
|
+
Folder,
|
|
214
|
+
FolderPlus,
|
|
215
|
+
FolderTree,
|
|
216
|
+
Fullscreen,
|
|
217
|
+
Grid2x2,
|
|
218
|
+
Grid3x3,
|
|
219
|
+
Heart,
|
|
220
|
+
Image,
|
|
221
|
+
ImageOff,
|
|
222
|
+
Inbox,
|
|
223
|
+
Info,
|
|
224
|
+
Lasso,
|
|
225
|
+
Layers,
|
|
226
|
+
Layers2,
|
|
227
|
+
LayoutGrid,
|
|
228
|
+
List,
|
|
229
|
+
ListFilter,
|
|
230
|
+
LogOut,
|
|
231
|
+
Mail,
|
|
232
|
+
MapPin,
|
|
233
|
+
Maximize,
|
|
234
|
+
Microscope,
|
|
235
|
+
Minus,
|
|
236
|
+
MoreVertical,
|
|
237
|
+
PanelLeftClose,
|
|
238
|
+
PanelLeftOpen,
|
|
239
|
+
PanelRightClose,
|
|
240
|
+
PanelRightOpen,
|
|
241
|
+
Pencil,
|
|
242
|
+
Plug,
|
|
243
|
+
Plus,
|
|
244
|
+
RotateCcw,
|
|
245
|
+
Search,
|
|
246
|
+
SearchX,
|
|
247
|
+
Send,
|
|
248
|
+
Settings,
|
|
249
|
+
Shield,
|
|
250
|
+
ShieldCheck,
|
|
251
|
+
Spline,
|
|
252
|
+
Square,
|
|
253
|
+
Star,
|
|
254
|
+
Table,
|
|
255
|
+
Tag,
|
|
256
|
+
Trash2,
|
|
257
|
+
Unplug,
|
|
258
|
+
User,
|
|
259
|
+
UserMinus,
|
|
260
|
+
UserPlus,
|
|
261
|
+
Users,
|
|
262
|
+
UsersRound,
|
|
263
|
+
X,
|
|
264
|
+
XCircle,
|
|
265
|
+
ZoomIn,
|
|
266
|
+
ZoomOut
|
|
66
267
|
};
|
|
67
268
|
|
|
68
269
|
// src/components/Icon/Icon.tsx
|
|
69
270
|
import { jsx } from "react/jsx-runtime";
|
|
70
271
|
var sizeMap = {
|
|
272
|
+
xs: 14,
|
|
71
273
|
sm: 16,
|
|
72
274
|
md: 20,
|
|
73
275
|
lg: 24,
|
|
74
276
|
xl: 32
|
|
75
277
|
};
|
|
76
278
|
function Icon({
|
|
77
|
-
icon
|
|
279
|
+
icon,
|
|
78
280
|
size = "md",
|
|
79
|
-
strokeWidth,
|
|
80
|
-
"aria-label": ariaLabel,
|
|
281
|
+
strokeWidth = 2,
|
|
81
282
|
className
|
|
82
283
|
}) {
|
|
83
|
-
const
|
|
284
|
+
const Component = typeof icon === "string" ? iconRegistry[icon] : icon;
|
|
84
285
|
return /* @__PURE__ */ jsx(
|
|
85
|
-
|
|
286
|
+
Component,
|
|
86
287
|
{
|
|
87
288
|
size: sizeMap[size],
|
|
88
289
|
strokeWidth,
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
className
|
|
290
|
+
"aria-hidden": "true",
|
|
291
|
+
focusable: false,
|
|
292
|
+
className: twMerge("shrink-0", className)
|
|
93
293
|
}
|
|
94
294
|
);
|
|
95
295
|
}
|
|
96
296
|
|
|
97
297
|
// src/components/Spinner/Spinner.tsx
|
|
298
|
+
import { twMerge as twMerge2 } from "tailwind-merge";
|
|
98
299
|
import { jsx as jsx2, jsxs } from "react/jsx-runtime";
|
|
99
|
-
var sizeMap2 = {
|
|
100
|
-
sm: "h-4 w-4",
|
|
101
|
-
md: "h-5 w-5",
|
|
102
|
-
lg: "h-6 w-6"
|
|
103
|
-
};
|
|
104
300
|
function Spinner({
|
|
105
301
|
size = "md",
|
|
106
302
|
"aria-label": ariaLabel,
|
|
@@ -113,9 +309,11 @@ function Spinner({
|
|
|
113
309
|
role: isDecorative ? void 0 : "status",
|
|
114
310
|
"aria-label": ariaLabel,
|
|
115
311
|
"aria-hidden": isDecorative ? "true" : void 0,
|
|
116
|
-
className:
|
|
312
|
+
className: twMerge2("animate-spin", className),
|
|
117
313
|
viewBox: "0 0 24 24",
|
|
118
314
|
fill: "none",
|
|
315
|
+
width: sizeMap[size],
|
|
316
|
+
height: sizeMap[size],
|
|
119
317
|
children: [
|
|
120
318
|
/* @__PURE__ */ jsx2(
|
|
121
319
|
"circle",
|
|
@@ -141,37 +339,19 @@ function Spinner({
|
|
|
141
339
|
);
|
|
142
340
|
}
|
|
143
341
|
|
|
144
|
-
// src/components/Form/InputGroup/InputGroupContext.ts
|
|
145
|
-
import { createContext, useContext } from "react";
|
|
146
|
-
var InputGroupContext = createContext({
|
|
147
|
-
inGroup: false,
|
|
148
|
-
position: "standalone"
|
|
149
|
-
});
|
|
150
|
-
function useInputGroup() {
|
|
151
|
-
return useContext(InputGroupContext);
|
|
152
|
-
}
|
|
153
|
-
|
|
154
342
|
// src/components/Button/Button.tsx
|
|
155
343
|
import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
156
|
-
var
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
return "rounded-none";
|
|
168
|
-
case "end":
|
|
169
|
-
return "rounded-r-md rounded-l-none";
|
|
170
|
-
default:
|
|
171
|
-
return "rounded-md";
|
|
172
|
-
}
|
|
173
|
-
}
|
|
174
|
-
function Button({
|
|
344
|
+
var buttonBaseClass = `
|
|
345
|
+
inline-flex items-center justify-center gap-2 shrink-0 cursor-pointer
|
|
346
|
+
rounded-full
|
|
347
|
+
font-medium
|
|
348
|
+
leading-tight
|
|
349
|
+
outline-none transition-colors no-underline
|
|
350
|
+
focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2
|
|
351
|
+
disabled:opacity-50 disabled:pointer-events-none
|
|
352
|
+
`;
|
|
353
|
+
function ButtonBase({
|
|
354
|
+
as: Component,
|
|
175
355
|
variant = "primary",
|
|
176
356
|
size = "md",
|
|
177
357
|
isLoading = false,
|
|
@@ -182,38 +362,25 @@ function Button({
|
|
|
182
362
|
children,
|
|
183
363
|
...props
|
|
184
364
|
}) {
|
|
185
|
-
const
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
AriaButton,
|
|
192
|
-
{
|
|
193
|
-
...props,
|
|
194
|
-
isDisabled: isDisabled || isLoading,
|
|
195
|
-
className: twMerge(
|
|
196
|
-
"inline-flex items-center justify-center gap-2 shrink-0 cursor-pointer",
|
|
197
|
-
radiusClass,
|
|
198
|
-
"font-medium",
|
|
199
|
-
"leading-tight",
|
|
200
|
-
"outline-none transition-colors",
|
|
201
|
-
focusRing,
|
|
202
|
-
"disabled:opacity-50 disabled:pointer-events-none",
|
|
203
|
-
isLoading ? "pointer-events-none" : "",
|
|
204
|
-
groupGhost || variantStyles[variant],
|
|
205
|
-
sizeStyles[size],
|
|
206
|
-
marginClass,
|
|
207
|
-
className
|
|
208
|
-
),
|
|
209
|
-
children: [
|
|
210
|
-
isLoading && /* @__PURE__ */ jsx3(Spinner, { size: iconSizeMap[size] }),
|
|
211
|
-
!isLoading && iconLeft && /* @__PURE__ */ jsx3(Icon, { icon: iconLeft, size: iconSizeMap[size] }),
|
|
212
|
-
children,
|
|
213
|
-
!isLoading && iconRight && /* @__PURE__ */ jsx3(Icon, { icon: iconRight, size: iconSizeMap[size] })
|
|
214
|
-
]
|
|
215
|
-
}
|
|
365
|
+
const cx = twMerge3(
|
|
366
|
+
buttonBaseClass,
|
|
367
|
+
isLoading ? "pointer-events-none" : "",
|
|
368
|
+
variantStyles[variant],
|
|
369
|
+
sizeStyles[size],
|
|
370
|
+
className
|
|
216
371
|
);
|
|
372
|
+
return /* @__PURE__ */ jsxs2(Component, { ...props, isDisabled: isDisabled || isLoading, className: cx, children: [
|
|
373
|
+
isLoading && /* @__PURE__ */ jsx3(Spinner, { size }),
|
|
374
|
+
!isLoading && iconLeft && /* @__PURE__ */ jsx3(Icon, { icon: iconLeft, size }),
|
|
375
|
+
children,
|
|
376
|
+
!isLoading && iconRight && /* @__PURE__ */ jsx3(Icon, { icon: iconRight, size })
|
|
377
|
+
] });
|
|
378
|
+
}
|
|
379
|
+
function Button(props) {
|
|
380
|
+
return /* @__PURE__ */ jsx3(ButtonBase, { as: AriaButton, ...props });
|
|
381
|
+
}
|
|
382
|
+
function ButtonLink(props) {
|
|
383
|
+
return /* @__PURE__ */ jsx3(ButtonBase, { as: AriaLink, ...props });
|
|
217
384
|
}
|
|
218
385
|
|
|
219
386
|
// src/components/Tooltip/Tooltip.tsx
|
|
@@ -544,80 +711,61 @@ var TruncatedText = ({ children, ellipsis = "right", copyValue }) => {
|
|
|
544
711
|
|
|
545
712
|
// src/components/IconButton/IconButton.tsx
|
|
546
713
|
import {
|
|
547
|
-
Button as AriaButton2
|
|
714
|
+
Button as AriaButton2,
|
|
715
|
+
Link as AriaLink2,
|
|
716
|
+
ToggleButton as AriaToggleButton
|
|
548
717
|
} from "react-aria-components";
|
|
718
|
+
import { twMerge as twMerge4 } from "tailwind-merge";
|
|
549
719
|
import { jsx as jsx6 } from "react/jsx-runtime";
|
|
550
720
|
var squareSizeStyles = {
|
|
551
721
|
xs: "h-7 w-7",
|
|
722
|
+
// 28px
|
|
552
723
|
sm: "h-8 w-8",
|
|
724
|
+
// 32px
|
|
553
725
|
md: "h-10 w-10",
|
|
726
|
+
// 40px
|
|
554
727
|
lg: "h-12 w-12"
|
|
728
|
+
// 48px
|
|
555
729
|
};
|
|
556
|
-
|
|
557
|
-
|
|
558
|
-
sm: "w-8",
|
|
559
|
-
md: "w-10",
|
|
560
|
-
lg: "w-12"
|
|
561
|
-
};
|
|
562
|
-
var iconSizeMap2 = {
|
|
563
|
-
xs: "sm",
|
|
564
|
-
sm: "sm",
|
|
565
|
-
md: "sm",
|
|
566
|
-
lg: "md"
|
|
567
|
-
};
|
|
568
|
-
function groupRadiusClass2(position) {
|
|
569
|
-
switch (position) {
|
|
570
|
-
case "start":
|
|
571
|
-
return "rounded-l-md rounded-r-none";
|
|
572
|
-
case "middle":
|
|
573
|
-
return "rounded-none";
|
|
574
|
-
case "end":
|
|
575
|
-
return "rounded-r-md rounded-l-none";
|
|
576
|
-
default:
|
|
577
|
-
return "rounded-md";
|
|
578
|
-
}
|
|
579
|
-
}
|
|
580
|
-
function IconButton({
|
|
730
|
+
function IconButtonBase({
|
|
731
|
+
as: Component,
|
|
581
732
|
icon,
|
|
582
|
-
|
|
733
|
+
label,
|
|
583
734
|
variant = "ghost",
|
|
584
735
|
size = "md",
|
|
585
|
-
showTooltip = true,
|
|
586
736
|
isLoading = false,
|
|
587
737
|
isDisabled,
|
|
588
738
|
className,
|
|
589
739
|
...props
|
|
590
740
|
}) {
|
|
591
|
-
const
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
741
|
+
const cx = twMerge4(
|
|
742
|
+
buttonBaseClass,
|
|
743
|
+
isLoading ? "pointer-events-none" : "",
|
|
744
|
+
variantStyles[variant],
|
|
745
|
+
// No-op unless the wrapper is a ToggleButton (react-aria sets data-selected).
|
|
746
|
+
selectedStyles[variant],
|
|
747
|
+
squareSizeStyles[size],
|
|
748
|
+
className
|
|
749
|
+
);
|
|
750
|
+
return /* @__PURE__ */ jsx6(Tooltip, { content: label, children: /* @__PURE__ */ jsx6(
|
|
751
|
+
Component,
|
|
598
752
|
{
|
|
599
753
|
...props,
|
|
600
|
-
"aria-label":
|
|
754
|
+
"aria-label": label,
|
|
601
755
|
isDisabled: isDisabled || isLoading,
|
|
602
|
-
className:
|
|
603
|
-
|
|
604
|
-
radiusClass,
|
|
605
|
-
"outline-none transition-colors",
|
|
606
|
-
focusRing,
|
|
607
|
-
"disabled:opacity-50 disabled:pointer-events-none",
|
|
608
|
-
isLoading ? "pointer-events-none" : "",
|
|
609
|
-
groupGhost || variantStyles[variant],
|
|
610
|
-
inGroup ? squareWidthOnly[size] : squareSizeStyles[size],
|
|
611
|
-
marginClass,
|
|
612
|
-
className
|
|
613
|
-
].filter(Boolean).join(" "),
|
|
614
|
-
children: isLoading ? /* @__PURE__ */ jsx6(Spinner, { size: iconSizeMap2[size] }) : /* @__PURE__ */ jsx6(Icon, { icon, size: iconSizeMap2[size] })
|
|
756
|
+
className: cx,
|
|
757
|
+
children: isLoading ? /* @__PURE__ */ jsx6(Spinner, { size }) : /* @__PURE__ */ jsx6(Icon, { icon, size })
|
|
615
758
|
}
|
|
616
|
-
);
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
}
|
|
620
|
-
|
|
759
|
+
) });
|
|
760
|
+
}
|
|
761
|
+
function IconButton(props) {
|
|
762
|
+
return /* @__PURE__ */ jsx6(IconButtonBase, { as: AriaButton2, ...props });
|
|
763
|
+
}
|
|
764
|
+
function IconButtonLink(props) {
|
|
765
|
+
return /* @__PURE__ */ jsx6(IconButtonBase, { as: AriaLink2, ...props });
|
|
766
|
+
}
|
|
767
|
+
function IconButtonToggle(props) {
|
|
768
|
+
return /* @__PURE__ */ jsx6(IconButtonBase, { as: AriaToggleButton, ...props });
|
|
621
769
|
}
|
|
622
770
|
|
|
623
771
|
// src/components/Form/Input/Input.tsx
|
|
@@ -626,7 +774,7 @@ import {
|
|
|
626
774
|
Input as AriaInput,
|
|
627
775
|
Text
|
|
628
776
|
} from "react-aria-components";
|
|
629
|
-
import { twMerge as
|
|
777
|
+
import { twMerge as twMerge5 } from "tailwind-merge";
|
|
630
778
|
|
|
631
779
|
// src/components/Form/Label/Label.tsx
|
|
632
780
|
import {
|
|
@@ -666,18 +814,6 @@ var alignClasses = {
|
|
|
666
814
|
center: "text-center",
|
|
667
815
|
right: "text-right"
|
|
668
816
|
};
|
|
669
|
-
function groupRadiusClasses(position) {
|
|
670
|
-
switch (position) {
|
|
671
|
-
case "start":
|
|
672
|
-
return "rounded-l-(--border-radius-md) rounded-r-none";
|
|
673
|
-
case "middle":
|
|
674
|
-
return "rounded-none";
|
|
675
|
-
case "end":
|
|
676
|
-
return "rounded-r-(--border-radius-md) rounded-l-none";
|
|
677
|
-
default:
|
|
678
|
-
return "rounded-md";
|
|
679
|
-
}
|
|
680
|
-
}
|
|
681
817
|
function Input({
|
|
682
818
|
as: FieldProp = TextField,
|
|
683
819
|
label,
|
|
@@ -695,10 +831,8 @@ function Input({
|
|
|
695
831
|
}) {
|
|
696
832
|
const Field = FieldProp;
|
|
697
833
|
const isInvalid = !!errorMessage;
|
|
698
|
-
const { inGroup, position } = useInputGroup();
|
|
699
834
|
const borderColor = isInvalid ? "border-destructive-border" : "border-border hover:border-border";
|
|
700
|
-
const radiusClass =
|
|
701
|
-
const marginClass = inGroup && position !== "start" && position !== "standalone" ? "-ml-px" : "";
|
|
835
|
+
const radiusClass = "rounded-md";
|
|
702
836
|
return /* @__PURE__ */ jsxs6(
|
|
703
837
|
Field,
|
|
704
838
|
{
|
|
@@ -707,18 +841,13 @@ function Input({
|
|
|
707
841
|
isDisabled,
|
|
708
842
|
isRequired,
|
|
709
843
|
isInvalid,
|
|
710
|
-
className:
|
|
711
|
-
"flex w-full flex-col gap-1",
|
|
712
|
-
inGroup ? "min-w-0 flex-1" : "",
|
|
713
|
-
marginClass,
|
|
714
|
-
className
|
|
715
|
-
),
|
|
844
|
+
className: twMerge5("flex w-full flex-col gap-1", className),
|
|
716
845
|
children: [
|
|
717
846
|
label && /* @__PURE__ */ jsx8(Label, { isRequired, children: label }),
|
|
718
847
|
prefix ? /* @__PURE__ */ jsxs6(
|
|
719
848
|
"div",
|
|
720
849
|
{
|
|
721
|
-
className:
|
|
850
|
+
className: twMerge5(
|
|
722
851
|
"flex items-center overflow-hidden",
|
|
723
852
|
radiusClass,
|
|
724
853
|
"border",
|
|
@@ -726,14 +855,13 @@ function Input({
|
|
|
726
855
|
"outline-none transition-colors",
|
|
727
856
|
borderColor,
|
|
728
857
|
"focus-within:ring-2 focus-within:ring-ring focus-within:border-ring",
|
|
729
|
-
inGroup && "focus-within:z-10",
|
|
730
858
|
isDisabled && "opacity-50 pointer-events-none"
|
|
731
859
|
),
|
|
732
860
|
children: [
|
|
733
861
|
/* @__PURE__ */ jsx8(
|
|
734
862
|
"span",
|
|
735
863
|
{
|
|
736
|
-
className:
|
|
864
|
+
className: twMerge5(
|
|
737
865
|
"self-stretch flex items-center shrink-0 select-none",
|
|
738
866
|
"bg-card",
|
|
739
867
|
"border-r border-r-border",
|
|
@@ -747,7 +875,7 @@ function Input({
|
|
|
747
875
|
AriaInput,
|
|
748
876
|
{
|
|
749
877
|
placeholder,
|
|
750
|
-
className:
|
|
878
|
+
className: twMerge5(
|
|
751
879
|
"w-full bg-transparent",
|
|
752
880
|
sizeStyles[size],
|
|
753
881
|
alignClasses[align],
|
|
@@ -763,7 +891,7 @@ function Input({
|
|
|
763
891
|
AriaInput,
|
|
764
892
|
{
|
|
765
893
|
placeholder,
|
|
766
|
-
className:
|
|
894
|
+
className: twMerge5(
|
|
767
895
|
"w-full",
|
|
768
896
|
sizeStyles[size],
|
|
769
897
|
alignClasses[align],
|
|
@@ -775,19 +903,11 @@ function Input({
|
|
|
775
903
|
"outline-none transition-colors",
|
|
776
904
|
borderColor,
|
|
777
905
|
"focus:ring-2 focus:ring-ring focus:border-ring",
|
|
778
|
-
inGroup && "focus:z-10",
|
|
779
906
|
"disabled:opacity-50 disabled:pointer-events-none"
|
|
780
907
|
)
|
|
781
908
|
}
|
|
782
909
|
),
|
|
783
|
-
description && /* @__PURE__ */ jsx8(
|
|
784
|
-
Text,
|
|
785
|
-
{
|
|
786
|
-
slot: "description",
|
|
787
|
-
className: "text-sm text-muted-foreground",
|
|
788
|
-
children: description
|
|
789
|
-
}
|
|
790
|
-
),
|
|
910
|
+
description && /* @__PURE__ */ jsx8(Text, { slot: "description", className: "text-sm text-muted-foreground", children: description }),
|
|
791
911
|
isInvalid && /* @__PURE__ */ jsx8(
|
|
792
912
|
Text,
|
|
793
913
|
{
|
|
@@ -802,8 +922,106 @@ function Input({
|
|
|
802
922
|
);
|
|
803
923
|
}
|
|
804
924
|
|
|
925
|
+
// src/components/Form/InputPassword/InputPassword.tsx
|
|
926
|
+
import { forwardRef, useId, useState as useState5 } from "react";
|
|
927
|
+
import { Eye as Eye2, EyeOff as EyeOff2 } from "lucide-react";
|
|
928
|
+
import { twMerge as twMerge6 } from "tailwind-merge";
|
|
929
|
+
import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
930
|
+
var InputPassword = forwardRef(
|
|
931
|
+
function InputPassword2({
|
|
932
|
+
label,
|
|
933
|
+
description,
|
|
934
|
+
errorMessage,
|
|
935
|
+
size = "md",
|
|
936
|
+
isRequired,
|
|
937
|
+
isDisabled,
|
|
938
|
+
isToggleDisabled,
|
|
939
|
+
showPasswordLabel = "Show password",
|
|
940
|
+
hidePasswordLabel = "Hide password",
|
|
941
|
+
id,
|
|
942
|
+
className,
|
|
943
|
+
"aria-invalid": ariaInvalidProp,
|
|
944
|
+
"aria-describedby": ariaDescribedByProp,
|
|
945
|
+
...inputProps
|
|
946
|
+
}, ref) {
|
|
947
|
+
const [visible, setVisible] = useState5(false);
|
|
948
|
+
const generatedId = useId();
|
|
949
|
+
const inputId = id ?? generatedId;
|
|
950
|
+
const isInvalid = !!errorMessage;
|
|
951
|
+
const descId = description ? `${inputId}-description` : void 0;
|
|
952
|
+
const errId = isInvalid ? `${inputId}-error` : void 0;
|
|
953
|
+
const describedBy = [descId, errId, ariaDescribedByProp].filter(Boolean).join(" ") || void 0;
|
|
954
|
+
const toggleDisabled = isToggleDisabled ?? isDisabled;
|
|
955
|
+
return /* @__PURE__ */ jsxs7("div", { className: twMerge6("flex w-full flex-col gap-1", className), children: [
|
|
956
|
+
label && /* @__PURE__ */ jsxs7(
|
|
957
|
+
"label",
|
|
958
|
+
{
|
|
959
|
+
htmlFor: inputId,
|
|
960
|
+
className: "text-sm font-medium text-foreground",
|
|
961
|
+
children: [
|
|
962
|
+
label,
|
|
963
|
+
isRequired && /* @__PURE__ */ jsx9("span", { "aria-hidden": "true", className: "ml-0.5 text-destructive", children: "*" })
|
|
964
|
+
]
|
|
965
|
+
}
|
|
966
|
+
),
|
|
967
|
+
/* @__PURE__ */ jsxs7(
|
|
968
|
+
"div",
|
|
969
|
+
{
|
|
970
|
+
className: twMerge6(
|
|
971
|
+
"flex items-center overflow-hidden rounded-md border bg-background",
|
|
972
|
+
"outline-none transition-colors",
|
|
973
|
+
isInvalid ? "border-destructive-border" : "border-border",
|
|
974
|
+
"focus-within:ring-2 focus-within:ring-ring focus-within:border-ring",
|
|
975
|
+
isDisabled && "opacity-50 pointer-events-none"
|
|
976
|
+
),
|
|
977
|
+
children: [
|
|
978
|
+
/* @__PURE__ */ jsx9(
|
|
979
|
+
"input",
|
|
980
|
+
{
|
|
981
|
+
...inputProps,
|
|
982
|
+
ref,
|
|
983
|
+
id: inputId,
|
|
984
|
+
type: visible ? "text" : "password",
|
|
985
|
+
required: isRequired,
|
|
986
|
+
disabled: isDisabled,
|
|
987
|
+
"aria-invalid": isInvalid || ariaInvalidProp,
|
|
988
|
+
"aria-describedby": describedBy,
|
|
989
|
+
className: twMerge6(
|
|
990
|
+
"w-full bg-transparent text-foreground",
|
|
991
|
+
"placeholder:text-muted-foreground",
|
|
992
|
+
"outline-none border-none",
|
|
993
|
+
sizeStyles[size]
|
|
994
|
+
)
|
|
995
|
+
}
|
|
996
|
+
),
|
|
997
|
+
/* @__PURE__ */ jsx9(
|
|
998
|
+
"button",
|
|
999
|
+
{
|
|
1000
|
+
type: "button",
|
|
1001
|
+
"aria-label": visible ? hidePasswordLabel : showPasswordLabel,
|
|
1002
|
+
disabled: toggleDisabled,
|
|
1003
|
+
tabIndex: toggleDisabled ? -1 : void 0,
|
|
1004
|
+
onClick: () => setVisible((v) => !v),
|
|
1005
|
+
className: twMerge6(
|
|
1006
|
+
"flex items-center justify-center shrink-0 self-stretch px-3 cursor-pointer",
|
|
1007
|
+
"text-muted-foreground hover:text-foreground transition-colors",
|
|
1008
|
+
"outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset",
|
|
1009
|
+
"disabled:cursor-not-allowed disabled:opacity-50"
|
|
1010
|
+
),
|
|
1011
|
+
children: /* @__PURE__ */ jsx9(Icon, { icon: visible ? EyeOff2 : Eye2, size: "sm" })
|
|
1012
|
+
}
|
|
1013
|
+
)
|
|
1014
|
+
]
|
|
1015
|
+
}
|
|
1016
|
+
),
|
|
1017
|
+
description && /* @__PURE__ */ jsx9("p", { id: descId, className: "text-sm text-muted-foreground", children: description }),
|
|
1018
|
+
isInvalid && /* @__PURE__ */ jsx9("p", { id: errId, role: "alert", className: "text-sm text-destructive", children: errorMessage })
|
|
1019
|
+
] });
|
|
1020
|
+
}
|
|
1021
|
+
);
|
|
1022
|
+
|
|
805
1023
|
// src/components/Form/Select/Select.tsx
|
|
806
|
-
import { Check, ChevronDown } from "lucide-react";
|
|
1024
|
+
import { Check as Check2, ChevronDown as ChevronDown2 } from "lucide-react";
|
|
807
1025
|
import {
|
|
808
1026
|
Button as Button2,
|
|
809
1027
|
ListBox,
|
|
@@ -813,8 +1031,8 @@ import {
|
|
|
813
1031
|
SelectValue,
|
|
814
1032
|
Text as Text2
|
|
815
1033
|
} from "react-aria-components";
|
|
816
|
-
import { twMerge as
|
|
817
|
-
import { Fragment, jsx as
|
|
1034
|
+
import { twMerge as twMerge7 } from "tailwind-merge";
|
|
1035
|
+
import { Fragment, jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
818
1036
|
function Select({
|
|
819
1037
|
label,
|
|
820
1038
|
items,
|
|
@@ -829,21 +1047,21 @@ function Select({
|
|
|
829
1047
|
...props
|
|
830
1048
|
}) {
|
|
831
1049
|
const hasError = Boolean(errorMessage);
|
|
832
|
-
return /* @__PURE__ */
|
|
1050
|
+
return /* @__PURE__ */ jsxs8(
|
|
833
1051
|
AriaSelect,
|
|
834
1052
|
{
|
|
835
1053
|
...props,
|
|
836
1054
|
isDisabled,
|
|
837
1055
|
isRequired,
|
|
838
1056
|
isInvalid: hasError,
|
|
839
|
-
className:
|
|
1057
|
+
className: twMerge7("flex flex-col gap-1", className),
|
|
840
1058
|
children: [
|
|
841
|
-
label && /* @__PURE__ */
|
|
842
|
-
/* @__PURE__ */
|
|
1059
|
+
label && /* @__PURE__ */ jsx10(Label, { isRequired, children: label }),
|
|
1060
|
+
/* @__PURE__ */ jsxs8(
|
|
843
1061
|
Button2,
|
|
844
1062
|
{
|
|
845
1063
|
"aria-required": isRequired || void 0,
|
|
846
|
-
className:
|
|
1064
|
+
className: twMerge7(
|
|
847
1065
|
`
|
|
848
1066
|
inline-flex items-center justify-between
|
|
849
1067
|
w-full rounded-md
|
|
@@ -857,10 +1075,10 @@ function Select({
|
|
|
857
1075
|
hasError ? "border-destructive-border" : "border-border"
|
|
858
1076
|
),
|
|
859
1077
|
children: [
|
|
860
|
-
/* @__PURE__ */
|
|
1078
|
+
/* @__PURE__ */ jsx10(
|
|
861
1079
|
SelectValue,
|
|
862
1080
|
{
|
|
863
|
-
className:
|
|
1081
|
+
className: twMerge7(
|
|
864
1082
|
renderItem ? "min-w-0" : "truncate",
|
|
865
1083
|
"data-placeholder:text-muted-foreground"
|
|
866
1084
|
),
|
|
@@ -871,11 +1089,11 @@ function Select({
|
|
|
871
1089
|
}
|
|
872
1090
|
}
|
|
873
1091
|
),
|
|
874
|
-
/* @__PURE__ */
|
|
875
|
-
|
|
1092
|
+
/* @__PURE__ */ jsx10(
|
|
1093
|
+
ChevronDown2,
|
|
876
1094
|
{
|
|
877
1095
|
"aria-hidden": true,
|
|
878
|
-
className:
|
|
1096
|
+
className: twMerge7(
|
|
879
1097
|
"shrink-0 text-muted-foreground",
|
|
880
1098
|
size === "sm" ? "h-3.5 w-3.5" : "h-4 w-4"
|
|
881
1099
|
)
|
|
@@ -884,8 +1102,8 @@ function Select({
|
|
|
884
1102
|
]
|
|
885
1103
|
}
|
|
886
1104
|
),
|
|
887
|
-
description && /* @__PURE__ */
|
|
888
|
-
hasError && /* @__PURE__ */
|
|
1105
|
+
description && /* @__PURE__ */ jsx10(Text2, { slot: "description", className: "text-sm text-muted-foreground", children: description }),
|
|
1106
|
+
hasError && /* @__PURE__ */ jsx10(
|
|
889
1107
|
Text2,
|
|
890
1108
|
{
|
|
891
1109
|
slot: "errorMessage",
|
|
@@ -894,10 +1112,10 @@ function Select({
|
|
|
894
1112
|
children: errorMessage
|
|
895
1113
|
}
|
|
896
1114
|
),
|
|
897
|
-
/* @__PURE__ */
|
|
1115
|
+
/* @__PURE__ */ jsx10(
|
|
898
1116
|
Popover,
|
|
899
1117
|
{
|
|
900
|
-
className:
|
|
1118
|
+
className: twMerge7(
|
|
901
1119
|
"w-(--trigger-width)",
|
|
902
1120
|
"rounded-md",
|
|
903
1121
|
"border border-border",
|
|
@@ -907,12 +1125,12 @@ function Select({
|
|
|
907
1125
|
"entering:animate-in entering:fade-in",
|
|
908
1126
|
"exiting:animate-out exiting:fade-out"
|
|
909
1127
|
),
|
|
910
|
-
children: /* @__PURE__ */
|
|
1128
|
+
children: /* @__PURE__ */ jsx10(ListBox, { className: "p-1 outline-none", items, children: (item) => /* @__PURE__ */ jsx10(
|
|
911
1129
|
ListBoxItem,
|
|
912
1130
|
{
|
|
913
1131
|
id: item.id,
|
|
914
1132
|
textValue: item.name,
|
|
915
|
-
className:
|
|
1133
|
+
className: twMerge7(
|
|
916
1134
|
`
|
|
917
1135
|
flex items-center justify-between gap-2
|
|
918
1136
|
rounded-sm
|
|
@@ -924,9 +1142,9 @@ function Select({
|
|
|
924
1142
|
`,
|
|
925
1143
|
sizeStyles[size]
|
|
926
1144
|
),
|
|
927
|
-
children: ({ isSelected }) => /* @__PURE__ */
|
|
928
|
-
/* @__PURE__ */
|
|
929
|
-
isSelected && /* @__PURE__ */
|
|
1145
|
+
children: ({ isSelected }) => /* @__PURE__ */ jsxs8(Fragment, { children: [
|
|
1146
|
+
/* @__PURE__ */ jsx10("span", { className: renderItem ? "min-w-0 flex-1" : "truncate", children: renderItem ? renderItem(item) : item.name }),
|
|
1147
|
+
isSelected && /* @__PURE__ */ jsx10(Check2, { className: "h-4 w-4 shrink-0 text-primary" })
|
|
930
1148
|
] })
|
|
931
1149
|
}
|
|
932
1150
|
) })
|
|
@@ -946,13 +1164,13 @@ import {
|
|
|
946
1164
|
TableBody as AriaTableBody,
|
|
947
1165
|
TableHeader as AriaTableHeader
|
|
948
1166
|
} from "react-aria-components";
|
|
949
|
-
import { jsx as
|
|
1167
|
+
import { jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
950
1168
|
var tableSizeClass = {
|
|
951
1169
|
compact: "[--table-row-py:theme(spacing.1)]",
|
|
952
1170
|
comfortable: "[--table-row-py:theme(spacing.3)]"
|
|
953
1171
|
};
|
|
954
|
-
function
|
|
955
|
-
return /* @__PURE__ */
|
|
1172
|
+
function Table2({ size = "comfortable", className, ...props }) {
|
|
1173
|
+
return /* @__PURE__ */ jsx11(
|
|
956
1174
|
AriaTable,
|
|
957
1175
|
{
|
|
958
1176
|
...props,
|
|
@@ -965,10 +1183,10 @@ function Table({ size = "comfortable", className, ...props }) {
|
|
|
965
1183
|
);
|
|
966
1184
|
}
|
|
967
1185
|
function TableHeader(props) {
|
|
968
|
-
return /* @__PURE__ */
|
|
1186
|
+
return /* @__PURE__ */ jsx11(AriaTableHeader, { ...props });
|
|
969
1187
|
}
|
|
970
1188
|
function Column(props) {
|
|
971
|
-
return /* @__PURE__ */
|
|
1189
|
+
return /* @__PURE__ */ jsx11(
|
|
972
1190
|
AriaColumn,
|
|
973
1191
|
{
|
|
974
1192
|
...props,
|
|
@@ -978,18 +1196,18 @@ function Column(props) {
|
|
|
978
1196
|
"cursor-default select-none outline-none",
|
|
979
1197
|
"focus-visible:outline-2 focus-visible:outline-ring focus-visible:outline-offset-[-2px]"
|
|
980
1198
|
].join(" "),
|
|
981
|
-
children: ({ allowsSorting, sortDirection }) => /* @__PURE__ */
|
|
1199
|
+
children: ({ allowsSorting, sortDirection }) => /* @__PURE__ */ jsxs9("span", { className: "inline-flex items-center gap-1", children: [
|
|
982
1200
|
props.children,
|
|
983
|
-
allowsSorting && /* @__PURE__ */
|
|
1201
|
+
allowsSorting && /* @__PURE__ */ jsx11("span", { "aria-hidden": "true", className: "text-muted-foreground", children: sortDirection === "ascending" ? "\u25B2" : sortDirection === "descending" ? "\u25BC" : "\u25B4" })
|
|
984
1202
|
] })
|
|
985
1203
|
}
|
|
986
1204
|
);
|
|
987
1205
|
}
|
|
988
1206
|
function TableBody(props) {
|
|
989
|
-
return /* @__PURE__ */
|
|
1207
|
+
return /* @__PURE__ */ jsx11(AriaTableBody, { ...props });
|
|
990
1208
|
}
|
|
991
1209
|
function Row(props) {
|
|
992
|
-
return /* @__PURE__ */
|
|
1210
|
+
return /* @__PURE__ */ jsx11(
|
|
993
1211
|
AriaRow,
|
|
994
1212
|
{
|
|
995
1213
|
...props,
|
|
@@ -1005,7 +1223,7 @@ function Row(props) {
|
|
|
1005
1223
|
);
|
|
1006
1224
|
}
|
|
1007
1225
|
function Cell(props) {
|
|
1008
|
-
return /* @__PURE__ */
|
|
1226
|
+
return /* @__PURE__ */ jsx11(
|
|
1009
1227
|
AriaCell,
|
|
1010
1228
|
{
|
|
1011
1229
|
...props,
|
|
@@ -1026,8 +1244,8 @@ import {
|
|
|
1026
1244
|
Dialog as AriaDialog,
|
|
1027
1245
|
Heading
|
|
1028
1246
|
} from "react-aria-components";
|
|
1029
|
-
import { X } from "lucide-react";
|
|
1030
|
-
import { Fragment as Fragment2, jsx as
|
|
1247
|
+
import { X as X2 } from "lucide-react";
|
|
1248
|
+
import { Fragment as Fragment2, jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
1031
1249
|
var sizeStyles2 = {
|
|
1032
1250
|
sm: "max-w-md",
|
|
1033
1251
|
md: "max-w-lg",
|
|
@@ -1043,7 +1261,7 @@ function Dialog({
|
|
|
1043
1261
|
children,
|
|
1044
1262
|
className
|
|
1045
1263
|
}) {
|
|
1046
|
-
return /* @__PURE__ */
|
|
1264
|
+
return /* @__PURE__ */ jsx12(
|
|
1047
1265
|
ModalOverlay,
|
|
1048
1266
|
{
|
|
1049
1267
|
isOpen,
|
|
@@ -1055,7 +1273,7 @@ function Dialog({
|
|
|
1055
1273
|
"entering:animate-in entering:fade-in",
|
|
1056
1274
|
"exiting:animate-out exiting:fade-out"
|
|
1057
1275
|
].join(" "),
|
|
1058
|
-
children: /* @__PURE__ */
|
|
1276
|
+
children: /* @__PURE__ */ jsx12(
|
|
1059
1277
|
Modal,
|
|
1060
1278
|
{
|
|
1061
1279
|
className: [
|
|
@@ -1066,9 +1284,9 @@ function Dialog({
|
|
|
1066
1284
|
"exiting:animate-out exiting:zoom-out-95 exiting:fade-out",
|
|
1067
1285
|
className
|
|
1068
1286
|
].filter(Boolean).join(" "),
|
|
1069
|
-
children: /* @__PURE__ */
|
|
1070
|
-
/* @__PURE__ */
|
|
1071
|
-
/* @__PURE__ */
|
|
1287
|
+
children: /* @__PURE__ */ jsx12(AriaDialog, { className: "outline-none flex flex-col max-h-[85vh]", children: ({ close }) => /* @__PURE__ */ jsxs10(Fragment2, { children: [
|
|
1288
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex items-center justify-between px-6 py-4 border-b border-border", children: [
|
|
1289
|
+
/* @__PURE__ */ jsx12(
|
|
1072
1290
|
Heading,
|
|
1073
1291
|
{
|
|
1074
1292
|
slot: "title",
|
|
@@ -1076,7 +1294,7 @@ function Dialog({
|
|
|
1076
1294
|
children: title
|
|
1077
1295
|
}
|
|
1078
1296
|
),
|
|
1079
|
-
/* @__PURE__ */
|
|
1297
|
+
/* @__PURE__ */ jsx12(
|
|
1080
1298
|
"button",
|
|
1081
1299
|
{
|
|
1082
1300
|
type: "button",
|
|
@@ -1088,11 +1306,11 @@ function Dialog({
|
|
|
1088
1306
|
"transition-colors"
|
|
1089
1307
|
].join(" "),
|
|
1090
1308
|
"aria-label": "Close",
|
|
1091
|
-
children: /* @__PURE__ */
|
|
1309
|
+
children: /* @__PURE__ */ jsx12(X2, { size: 20, "aria-hidden": "true" })
|
|
1092
1310
|
}
|
|
1093
1311
|
)
|
|
1094
1312
|
] }),
|
|
1095
|
-
/* @__PURE__ */
|
|
1313
|
+
/* @__PURE__ */ jsx12("div", { className: "px-6 py-4 overflow-y-auto", children })
|
|
1096
1314
|
] }) })
|
|
1097
1315
|
}
|
|
1098
1316
|
)
|
|
@@ -1101,21 +1319,21 @@ function Dialog({
|
|
|
1101
1319
|
}
|
|
1102
1320
|
|
|
1103
1321
|
// src/components/Dialog/DialogFooter.tsx
|
|
1104
|
-
import { jsx as
|
|
1322
|
+
import { jsx as jsx13 } from "react/jsx-runtime";
|
|
1105
1323
|
|
|
1106
1324
|
// src/components/Toast/Toast.tsx
|
|
1107
1325
|
import {
|
|
1108
|
-
createContext
|
|
1326
|
+
createContext,
|
|
1109
1327
|
useCallback as useCallback2,
|
|
1110
|
-
useContext
|
|
1328
|
+
useContext,
|
|
1111
1329
|
useEffect as useEffect2,
|
|
1112
1330
|
useRef as useRef4,
|
|
1113
|
-
useState as
|
|
1331
|
+
useState as useState6
|
|
1114
1332
|
} from "react";
|
|
1115
1333
|
import { createPortal as createPortal2 } from "react-dom";
|
|
1116
|
-
import { CheckCircle, XCircle, Info, X as
|
|
1117
|
-
import { jsx as
|
|
1118
|
-
var ToastContext =
|
|
1334
|
+
import { CheckCircle as CheckCircle3, XCircle as XCircle2, Info as Info2, X as X3 } from "lucide-react";
|
|
1335
|
+
import { jsx as jsx14, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
1336
|
+
var ToastContext = createContext(null);
|
|
1119
1337
|
var toastCounter = 0;
|
|
1120
1338
|
var defaultDuration = {
|
|
1121
1339
|
success: 5e3,
|
|
@@ -1124,22 +1342,22 @@ var defaultDuration = {
|
|
|
1124
1342
|
};
|
|
1125
1343
|
var variantConfig = {
|
|
1126
1344
|
success: {
|
|
1127
|
-
icon:
|
|
1345
|
+
icon: CheckCircle3,
|
|
1128
1346
|
containerClass: "bg-success-surface border-success-border text-success",
|
|
1129
1347
|
iconClass: "text-success"
|
|
1130
1348
|
},
|
|
1131
1349
|
error: {
|
|
1132
|
-
icon:
|
|
1350
|
+
icon: XCircle2,
|
|
1133
1351
|
containerClass: "bg-destructive-surface border-destructive-border text-destructive",
|
|
1134
1352
|
iconClass: "text-destructive"
|
|
1135
1353
|
},
|
|
1136
1354
|
info: {
|
|
1137
|
-
icon:
|
|
1355
|
+
icon: Info2,
|
|
1138
1356
|
containerClass: "bg-info-surface border-info-border text-info",
|
|
1139
1357
|
iconClass: "text-info"
|
|
1140
1358
|
}
|
|
1141
1359
|
};
|
|
1142
|
-
var PlacementContext =
|
|
1360
|
+
var PlacementContext = createContext("bottom-right");
|
|
1143
1361
|
var exitAnimationByPlacement = {
|
|
1144
1362
|
"top-center": "-translate-y-full opacity-0",
|
|
1145
1363
|
"top-right": "translate-x-full opacity-0",
|
|
@@ -1156,9 +1374,9 @@ function ToastItem({
|
|
|
1156
1374
|
toast,
|
|
1157
1375
|
onRemove
|
|
1158
1376
|
}) {
|
|
1159
|
-
const [isExiting, setIsExiting] =
|
|
1377
|
+
const [isExiting, setIsExiting] = useState6(false);
|
|
1160
1378
|
const timerRef = useRef4(null);
|
|
1161
|
-
const placement =
|
|
1379
|
+
const placement = useContext(PlacementContext);
|
|
1162
1380
|
const config = variantConfig[toast.variant];
|
|
1163
1381
|
const IconComponent = config.icon;
|
|
1164
1382
|
const dismiss = useCallback2(() => {
|
|
@@ -1172,7 +1390,7 @@ function ToastItem({
|
|
|
1172
1390
|
if (timerRef.current) clearTimeout(timerRef.current);
|
|
1173
1391
|
};
|
|
1174
1392
|
}, [toast.duration, toast.variant, dismiss]);
|
|
1175
|
-
return /* @__PURE__ */
|
|
1393
|
+
return /* @__PURE__ */ jsxs11(
|
|
1176
1394
|
"div",
|
|
1177
1395
|
{
|
|
1178
1396
|
role: "status",
|
|
@@ -1185,16 +1403,16 @@ function ToastItem({
|
|
|
1185
1403
|
config.containerClass
|
|
1186
1404
|
].join(" "),
|
|
1187
1405
|
children: [
|
|
1188
|
-
/* @__PURE__ */
|
|
1189
|
-
/* @__PURE__ */
|
|
1190
|
-
/* @__PURE__ */
|
|
1406
|
+
/* @__PURE__ */ jsx14(IconComponent, { size: 20, className: ["shrink-0 mt-0.5", config.iconClass].join(" "), "aria-hidden": "true" }),
|
|
1407
|
+
/* @__PURE__ */ jsx14("p", { className: "flex-1 text-sm font-medium", children: toast.message }),
|
|
1408
|
+
/* @__PURE__ */ jsx14(
|
|
1191
1409
|
"button",
|
|
1192
1410
|
{
|
|
1193
1411
|
type: "button",
|
|
1194
1412
|
onClick: dismiss,
|
|
1195
1413
|
className: "shrink-0 rounded-sm p-0.5 opacity-70 hover:opacity-100 transition-opacity outline-none focus-visible:ring-2 focus-visible:ring-current",
|
|
1196
1414
|
"aria-label": "Dismiss",
|
|
1197
|
-
children: /* @__PURE__ */
|
|
1415
|
+
children: /* @__PURE__ */ jsx14(X3, { size: 16, "aria-hidden": "true" })
|
|
1198
1416
|
}
|
|
1199
1417
|
)
|
|
1200
1418
|
]
|
|
@@ -1214,7 +1432,7 @@ function ToastContainer({
|
|
|
1214
1432
|
}) {
|
|
1215
1433
|
if (toasts.length === 0) return null;
|
|
1216
1434
|
return createPortal2(
|
|
1217
|
-
/* @__PURE__ */
|
|
1435
|
+
/* @__PURE__ */ jsx14(PlacementContext.Provider, { value: placement, children: /* @__PURE__ */ jsx14("div", { className: containerPositionStyles[placement], children: toasts.map((toast) => /* @__PURE__ */ jsx14(ToastItem, { toast, onRemove: removeToast }, toast.id)) }) }),
|
|
1218
1436
|
document.body
|
|
1219
1437
|
);
|
|
1220
1438
|
}
|
|
@@ -1233,7 +1451,7 @@ function createToastBridge() {
|
|
|
1233
1451
|
};
|
|
1234
1452
|
}
|
|
1235
1453
|
function ToastProvider({ children, bridge, placement = "bottom-right" }) {
|
|
1236
|
-
const [toasts, setToasts] =
|
|
1454
|
+
const [toasts, setToasts] = useState6([]);
|
|
1237
1455
|
const addToast = useCallback2((toast) => {
|
|
1238
1456
|
const id = `toast-${++toastCounter}`;
|
|
1239
1457
|
setToasts((prev) => [...prev, { ...toast, id }]);
|
|
@@ -1245,13 +1463,13 @@ function ToastProvider({ children, bridge, placement = "bottom-right" }) {
|
|
|
1245
1463
|
if (!bridge) return;
|
|
1246
1464
|
return bridge.subscribe(addToast);
|
|
1247
1465
|
}, [bridge, addToast]);
|
|
1248
|
-
return /* @__PURE__ */
|
|
1466
|
+
return /* @__PURE__ */ jsxs11(ToastContext.Provider, { value: { toasts, addToast, removeToast }, children: [
|
|
1249
1467
|
children,
|
|
1250
|
-
/* @__PURE__ */
|
|
1468
|
+
/* @__PURE__ */ jsx14(ToastContainer, { toasts, removeToast, placement })
|
|
1251
1469
|
] });
|
|
1252
1470
|
}
|
|
1253
1471
|
function useToast() {
|
|
1254
|
-
const context =
|
|
1472
|
+
const context = useContext(ToastContext);
|
|
1255
1473
|
if (!context) {
|
|
1256
1474
|
throw new Error("useToast must be used within a ToastProvider");
|
|
1257
1475
|
}
|
|
@@ -1263,7 +1481,7 @@ function useToast() {
|
|
|
1263
1481
|
}
|
|
1264
1482
|
|
|
1265
1483
|
// src/components/EmptyState/EmptyState.tsx
|
|
1266
|
-
import { jsx as
|
|
1484
|
+
import { jsx as jsx15, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
1267
1485
|
function EmptyState({
|
|
1268
1486
|
icon,
|
|
1269
1487
|
title,
|
|
@@ -1271,7 +1489,7 @@ function EmptyState({
|
|
|
1271
1489
|
action,
|
|
1272
1490
|
className
|
|
1273
1491
|
}) {
|
|
1274
|
-
return /* @__PURE__ */
|
|
1492
|
+
return /* @__PURE__ */ jsxs12(
|
|
1275
1493
|
"div",
|
|
1276
1494
|
{
|
|
1277
1495
|
className: [
|
|
@@ -1279,10 +1497,10 @@ function EmptyState({
|
|
|
1279
1497
|
className
|
|
1280
1498
|
].filter(Boolean).join(" "),
|
|
1281
1499
|
children: [
|
|
1282
|
-
icon && /* @__PURE__ */
|
|
1283
|
-
/* @__PURE__ */
|
|
1284
|
-
description && /* @__PURE__ */
|
|
1285
|
-
action && /* @__PURE__ */
|
|
1500
|
+
icon && /* @__PURE__ */ jsx15(Icon, { icon, size: "xl", className: "text-muted-foreground" }),
|
|
1501
|
+
/* @__PURE__ */ jsx15("h3", { className: "text-lg font-semibold text-foreground mt-4", children: title }),
|
|
1502
|
+
description && /* @__PURE__ */ jsx15("p", { className: "text-sm text-muted-foreground mt-2 max-w-sm", children: description }),
|
|
1503
|
+
action && /* @__PURE__ */ jsx15("div", { className: "mt-6", children: action })
|
|
1286
1504
|
]
|
|
1287
1505
|
}
|
|
1288
1506
|
);
|
|
@@ -1292,10 +1510,10 @@ function EmptyState({
|
|
|
1292
1510
|
import {
|
|
1293
1511
|
Checkbox as AriaCheckbox
|
|
1294
1512
|
} from "react-aria-components";
|
|
1295
|
-
import { Check as
|
|
1296
|
-
import { Fragment as Fragment3, jsx as
|
|
1513
|
+
import { Check as Check3 } from "lucide-react";
|
|
1514
|
+
import { Fragment as Fragment3, jsx as jsx16, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
1297
1515
|
function Checkbox({ children, className, ...props }) {
|
|
1298
|
-
return /* @__PURE__ */
|
|
1516
|
+
return /* @__PURE__ */ jsx16(
|
|
1299
1517
|
AriaCheckbox,
|
|
1300
1518
|
{
|
|
1301
1519
|
...props,
|
|
@@ -1304,8 +1522,8 @@ function Checkbox({ children, className, ...props }) {
|
|
|
1304
1522
|
"disabled:opacity-50 disabled:cursor-default",
|
|
1305
1523
|
className
|
|
1306
1524
|
].filter(Boolean).join(" "),
|
|
1307
|
-
children: ({ isSelected, isIndeterminate }) => /* @__PURE__ */
|
|
1308
|
-
/* @__PURE__ */
|
|
1525
|
+
children: ({ isSelected, isIndeterminate }) => /* @__PURE__ */ jsxs13(Fragment3, { children: [
|
|
1526
|
+
/* @__PURE__ */ jsxs13(
|
|
1309
1527
|
"div",
|
|
1310
1528
|
{
|
|
1311
1529
|
className: [
|
|
@@ -1315,12 +1533,12 @@ function Checkbox({ children, className, ...props }) {
|
|
|
1315
1533
|
isSelected || isIndeterminate ? "bg-primary border-primary" : "bg-background border-border group-hover:border-border"
|
|
1316
1534
|
].join(" "),
|
|
1317
1535
|
children: [
|
|
1318
|
-
isSelected && /* @__PURE__ */
|
|
1319
|
-
isIndeterminate && /* @__PURE__ */
|
|
1536
|
+
isSelected && /* @__PURE__ */ jsx16(Check3, { className: "w-4 h-4 text-primary-foreground", strokeWidth: 3 }),
|
|
1537
|
+
isIndeterminate && /* @__PURE__ */ jsx16("div", { className: "w-3 h-0.5 bg-primary-foreground rounded-full" })
|
|
1320
1538
|
]
|
|
1321
1539
|
}
|
|
1322
1540
|
),
|
|
1323
|
-
children && /* @__PURE__ */
|
|
1541
|
+
children && /* @__PURE__ */ jsx16("span", { children })
|
|
1324
1542
|
] })
|
|
1325
1543
|
}
|
|
1326
1544
|
);
|
|
@@ -1330,7 +1548,7 @@ function Checkbox({ children, className, ...props }) {
|
|
|
1330
1548
|
import {
|
|
1331
1549
|
Switch as AriaSwitch
|
|
1332
1550
|
} from "react-aria-components";
|
|
1333
|
-
import { Fragment as Fragment4, jsx as
|
|
1551
|
+
import { Fragment as Fragment4, jsx as jsx17, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
1334
1552
|
var trackColorMap = {
|
|
1335
1553
|
primary: "bg-primary",
|
|
1336
1554
|
success: "bg-success",
|
|
@@ -1347,7 +1565,7 @@ function Switch({
|
|
|
1347
1565
|
...props
|
|
1348
1566
|
}) {
|
|
1349
1567
|
const isPreset = isPresetColor(color);
|
|
1350
|
-
return /* @__PURE__ */
|
|
1568
|
+
return /* @__PURE__ */ jsx17(
|
|
1351
1569
|
AriaSwitch,
|
|
1352
1570
|
{
|
|
1353
1571
|
...props,
|
|
@@ -1356,8 +1574,8 @@ function Switch({
|
|
|
1356
1574
|
"disabled:opacity-50 disabled:cursor-default",
|
|
1357
1575
|
className
|
|
1358
1576
|
].filter(Boolean).join(" "),
|
|
1359
|
-
children: ({ isSelected }) => /* @__PURE__ */
|
|
1360
|
-
/* @__PURE__ */
|
|
1577
|
+
children: ({ isSelected }) => /* @__PURE__ */ jsxs14(Fragment4, { children: [
|
|
1578
|
+
/* @__PURE__ */ jsx17(
|
|
1361
1579
|
"div",
|
|
1362
1580
|
{
|
|
1363
1581
|
className: [
|
|
@@ -1366,7 +1584,7 @@ function Switch({
|
|
|
1366
1584
|
isSelected && isPreset ? trackColorMap[color] : !isSelected ? "bg-border" : ""
|
|
1367
1585
|
].join(" "),
|
|
1368
1586
|
style: isSelected && !isPreset ? { backgroundColor: color } : void 0,
|
|
1369
|
-
children: /* @__PURE__ */
|
|
1587
|
+
children: /* @__PURE__ */ jsx17(
|
|
1370
1588
|
"div",
|
|
1371
1589
|
{
|
|
1372
1590
|
className: [
|
|
@@ -1377,7 +1595,7 @@ function Switch({
|
|
|
1377
1595
|
)
|
|
1378
1596
|
}
|
|
1379
1597
|
),
|
|
1380
|
-
children && /* @__PURE__ */
|
|
1598
|
+
children && /* @__PURE__ */ jsx17("span", { children })
|
|
1381
1599
|
] })
|
|
1382
1600
|
}
|
|
1383
1601
|
);
|
|
@@ -1388,9 +1606,9 @@ import {
|
|
|
1388
1606
|
RadioGroup as AriaRadioGroup,
|
|
1389
1607
|
Radio as AriaRadio
|
|
1390
1608
|
} from "react-aria-components";
|
|
1391
|
-
import { Fragment as Fragment5, jsx as
|
|
1609
|
+
import { Fragment as Fragment5, jsx as jsx18, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
1392
1610
|
function RadioGroup({ children, className, ...props }) {
|
|
1393
|
-
return /* @__PURE__ */
|
|
1611
|
+
return /* @__PURE__ */ jsx18(
|
|
1394
1612
|
AriaRadioGroup,
|
|
1395
1613
|
{
|
|
1396
1614
|
...props,
|
|
@@ -1404,7 +1622,7 @@ function RadioGroup({ children, className, ...props }) {
|
|
|
1404
1622
|
);
|
|
1405
1623
|
}
|
|
1406
1624
|
function Radio({ children, className, ...props }) {
|
|
1407
|
-
return /* @__PURE__ */
|
|
1625
|
+
return /* @__PURE__ */ jsx18(
|
|
1408
1626
|
AriaRadio,
|
|
1409
1627
|
{
|
|
1410
1628
|
...props,
|
|
@@ -1413,8 +1631,8 @@ function Radio({ children, className, ...props }) {
|
|
|
1413
1631
|
"disabled:opacity-50 disabled:cursor-default",
|
|
1414
1632
|
className
|
|
1415
1633
|
].filter(Boolean).join(" "),
|
|
1416
|
-
children: ({ isSelected }) => /* @__PURE__ */
|
|
1417
|
-
/* @__PURE__ */
|
|
1634
|
+
children: ({ isSelected }) => /* @__PURE__ */ jsxs15(Fragment5, { children: [
|
|
1635
|
+
/* @__PURE__ */ jsx18(
|
|
1418
1636
|
"div",
|
|
1419
1637
|
{
|
|
1420
1638
|
className: [
|
|
@@ -1423,16 +1641,16 @@ function Radio({ children, className, ...props }) {
|
|
|
1423
1641
|
"group-focus-visible:ring-2 group-focus-visible:ring-ring group-focus-visible:ring-offset-2",
|
|
1424
1642
|
isSelected ? "border-primary" : "border-border group-hover:border-border"
|
|
1425
1643
|
].join(" "),
|
|
1426
|
-
children: isSelected && /* @__PURE__ */
|
|
1644
|
+
children: isSelected && /* @__PURE__ */ jsx18("div", { className: "w-2.5 h-2.5 rounded-full bg-primary" })
|
|
1427
1645
|
}
|
|
1428
1646
|
),
|
|
1429
|
-
children && /* @__PURE__ */
|
|
1647
|
+
children && /* @__PURE__ */ jsx18("span", { children })
|
|
1430
1648
|
] })
|
|
1431
1649
|
}
|
|
1432
1650
|
);
|
|
1433
1651
|
}
|
|
1434
1652
|
function RadioButton({ children, className, ...props }) {
|
|
1435
|
-
return /* @__PURE__ */
|
|
1653
|
+
return /* @__PURE__ */ jsx18(
|
|
1436
1654
|
AriaRadio,
|
|
1437
1655
|
{
|
|
1438
1656
|
...props,
|
|
@@ -1441,7 +1659,7 @@ function RadioButton({ children, className, ...props }) {
|
|
|
1441
1659
|
"disabled:opacity-50 disabled:cursor-default",
|
|
1442
1660
|
className
|
|
1443
1661
|
].filter(Boolean).join(" "),
|
|
1444
|
-
children: ({ isSelected }) => /* @__PURE__ */
|
|
1662
|
+
children: ({ isSelected }) => /* @__PURE__ */ jsx18(
|
|
1445
1663
|
"div",
|
|
1446
1664
|
{
|
|
1447
1665
|
className: [
|
|
@@ -1458,9 +1676,9 @@ function RadioButton({ children, className, ...props }) {
|
|
|
1458
1676
|
}
|
|
1459
1677
|
|
|
1460
1678
|
// src/components/Form/Fieldset/Fieldset.tsx
|
|
1461
|
-
import { jsx as
|
|
1679
|
+
import { jsx as jsx19, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
1462
1680
|
function Fieldset({ legend, children, className }) {
|
|
1463
|
-
return /* @__PURE__ */
|
|
1681
|
+
return /* @__PURE__ */ jsxs16(
|
|
1464
1682
|
"fieldset",
|
|
1465
1683
|
{
|
|
1466
1684
|
className: [
|
|
@@ -1469,7 +1687,7 @@ function Fieldset({ legend, children, className }) {
|
|
|
1469
1687
|
className
|
|
1470
1688
|
].filter(Boolean).join(" "),
|
|
1471
1689
|
children: [
|
|
1472
|
-
legend && /* @__PURE__ */
|
|
1690
|
+
legend && /* @__PURE__ */ jsx19(
|
|
1473
1691
|
"legend",
|
|
1474
1692
|
{
|
|
1475
1693
|
className: [
|
|
@@ -1487,71 +1705,9 @@ function Fieldset({ legend, children, className }) {
|
|
|
1487
1705
|
);
|
|
1488
1706
|
}
|
|
1489
1707
|
|
|
1490
|
-
// src/components/Form/InputGroup/InputGroup.tsx
|
|
1491
|
-
import React from "react";
|
|
1492
|
-
import { jsx as jsx19 } from "react/jsx-runtime";
|
|
1493
|
-
function InputGroup({ children, className }) {
|
|
1494
|
-
const childArray = React.Children.toArray(children).filter(
|
|
1495
|
-
React.isValidElement
|
|
1496
|
-
);
|
|
1497
|
-
return /* @__PURE__ */ jsx19(
|
|
1498
|
-
"div",
|
|
1499
|
-
{
|
|
1500
|
-
className: ["flex items-stretch", className].filter(Boolean).join(" "),
|
|
1501
|
-
children: childArray.map((child, index) => {
|
|
1502
|
-
const position = childArray.length === 1 ? "standalone" : index === 0 ? "start" : index === childArray.length - 1 ? "end" : "middle";
|
|
1503
|
-
return /* @__PURE__ */ jsx19(
|
|
1504
|
-
InputGroupContext.Provider,
|
|
1505
|
-
{
|
|
1506
|
-
value: { inGroup: true, position },
|
|
1507
|
-
children: child
|
|
1508
|
-
},
|
|
1509
|
-
index
|
|
1510
|
-
);
|
|
1511
|
-
})
|
|
1512
|
-
}
|
|
1513
|
-
);
|
|
1514
|
-
}
|
|
1515
|
-
|
|
1516
|
-
// src/components/Form/InputAddon/InputAddon.tsx
|
|
1517
|
-
import { jsx as jsx20 } from "react/jsx-runtime";
|
|
1518
|
-
function groupRadiusClass3(position) {
|
|
1519
|
-
switch (position) {
|
|
1520
|
-
case "start":
|
|
1521
|
-
return "rounded-l-(--border-radius-md) rounded-r-none";
|
|
1522
|
-
case "middle":
|
|
1523
|
-
return "rounded-none";
|
|
1524
|
-
case "end":
|
|
1525
|
-
return "rounded-r-(--border-radius-md) rounded-l-none";
|
|
1526
|
-
default:
|
|
1527
|
-
return "rounded-md";
|
|
1528
|
-
}
|
|
1529
|
-
}
|
|
1530
|
-
function InputAddon({ children, className }) {
|
|
1531
|
-
const { inGroup, position } = useInputGroup();
|
|
1532
|
-
const radiusClass = inGroup ? groupRadiusClass3(position) : "rounded-md";
|
|
1533
|
-
const marginClass = inGroup && position !== "start" && position !== "standalone" ? "-ml-px" : "";
|
|
1534
|
-
return /* @__PURE__ */ jsx20(
|
|
1535
|
-
"div",
|
|
1536
|
-
{
|
|
1537
|
-
className: [
|
|
1538
|
-
"flex items-center self-stretch shrink-0 select-none",
|
|
1539
|
-
"px-3 py-2 text-base",
|
|
1540
|
-
"bg-card",
|
|
1541
|
-
"text-muted-foreground",
|
|
1542
|
-
"border border-border",
|
|
1543
|
-
radiusClass,
|
|
1544
|
-
marginClass,
|
|
1545
|
-
className
|
|
1546
|
-
].filter(Boolean).join(" "),
|
|
1547
|
-
children
|
|
1548
|
-
}
|
|
1549
|
-
);
|
|
1550
|
-
}
|
|
1551
|
-
|
|
1552
1708
|
// src/components/Heading/Heading.tsx
|
|
1553
|
-
import { twMerge as
|
|
1554
|
-
import { jsx as
|
|
1709
|
+
import { twMerge as twMerge8 } from "tailwind-merge";
|
|
1710
|
+
import { jsx as jsx20 } from "react/jsx-runtime";
|
|
1555
1711
|
var defaultSizeMap = {
|
|
1556
1712
|
h1: "2xl",
|
|
1557
1713
|
h2: "xl",
|
|
@@ -1574,17 +1730,17 @@ var weightStyles = {
|
|
|
1574
1730
|
bold: "font-bold"
|
|
1575
1731
|
};
|
|
1576
1732
|
function Heading2({
|
|
1577
|
-
as:
|
|
1733
|
+
as: Tag2 = "h2",
|
|
1578
1734
|
size,
|
|
1579
1735
|
weight = "semibold",
|
|
1580
1736
|
className,
|
|
1581
1737
|
children
|
|
1582
1738
|
}) {
|
|
1583
|
-
const resolvedSize = size ?? defaultSizeMap[
|
|
1584
|
-
return /* @__PURE__ */
|
|
1585
|
-
|
|
1739
|
+
const resolvedSize = size ?? defaultSizeMap[Tag2];
|
|
1740
|
+
return /* @__PURE__ */ jsx20(
|
|
1741
|
+
Tag2,
|
|
1586
1742
|
{
|
|
1587
|
-
className:
|
|
1743
|
+
className: twMerge8(
|
|
1588
1744
|
weightStyles[weight],
|
|
1589
1745
|
"text-foreground",
|
|
1590
1746
|
sizeStyles3[resolvedSize],
|
|
@@ -1595,7 +1751,7 @@ function Heading2({
|
|
|
1595
1751
|
);
|
|
1596
1752
|
}
|
|
1597
1753
|
function H1(props) {
|
|
1598
|
-
return /* @__PURE__ */
|
|
1754
|
+
return /* @__PURE__ */ jsx20(
|
|
1599
1755
|
Heading2,
|
|
1600
1756
|
{
|
|
1601
1757
|
...props,
|
|
@@ -1606,17 +1762,17 @@ function H1(props) {
|
|
|
1606
1762
|
);
|
|
1607
1763
|
}
|
|
1608
1764
|
function H2(props) {
|
|
1609
|
-
return /* @__PURE__ */
|
|
1765
|
+
return /* @__PURE__ */ jsx20(Heading2, { ...props, as: "h2", size: props.size ?? "xl" });
|
|
1610
1766
|
}
|
|
1611
1767
|
function H3(props) {
|
|
1612
|
-
return /* @__PURE__ */
|
|
1768
|
+
return /* @__PURE__ */ jsx20(Heading2, { ...props, as: "h3", size: props.size ?? "lg" });
|
|
1613
1769
|
}
|
|
1614
1770
|
|
|
1615
1771
|
// src/components/Link/Link.tsx
|
|
1616
1772
|
import {
|
|
1617
|
-
Link as
|
|
1773
|
+
Link as AriaLink3
|
|
1618
1774
|
} from "react-aria-components";
|
|
1619
|
-
import { jsx as
|
|
1775
|
+
import { jsx as jsx21 } from "react/jsx-runtime";
|
|
1620
1776
|
var variantStyles2 = {
|
|
1621
1777
|
default: [
|
|
1622
1778
|
"text-teal-700 underline",
|
|
@@ -1632,8 +1788,8 @@ function Link({
|
|
|
1632
1788
|
className,
|
|
1633
1789
|
...props
|
|
1634
1790
|
}) {
|
|
1635
|
-
return /* @__PURE__ */
|
|
1636
|
-
|
|
1791
|
+
return /* @__PURE__ */ jsx21(
|
|
1792
|
+
AriaLink3,
|
|
1637
1793
|
{
|
|
1638
1794
|
...props,
|
|
1639
1795
|
className: [
|
|
@@ -1652,21 +1808,21 @@ import {
|
|
|
1652
1808
|
Breadcrumb as AriaBreadcrumb,
|
|
1653
1809
|
Link as Link2
|
|
1654
1810
|
} from "react-aria-components";
|
|
1655
|
-
import { ChevronRight } from "lucide-react";
|
|
1656
|
-
import { Fragment as Fragment6, jsx as
|
|
1811
|
+
import { ChevronRight as ChevronRight2 } from "lucide-react";
|
|
1812
|
+
import { Fragment as Fragment6, jsx as jsx22, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
1657
1813
|
function Breadcrumbs({ items, className }) {
|
|
1658
|
-
return /* @__PURE__ */
|
|
1814
|
+
return /* @__PURE__ */ jsx22(
|
|
1659
1815
|
"nav",
|
|
1660
1816
|
{
|
|
1661
1817
|
"aria-label": "Breadcrumb",
|
|
1662
1818
|
className,
|
|
1663
|
-
children: /* @__PURE__ */
|
|
1819
|
+
children: /* @__PURE__ */ jsx22(
|
|
1664
1820
|
AriaBreadcrumbs,
|
|
1665
1821
|
{
|
|
1666
1822
|
className: "flex items-center gap-1 text-sm min-w-0",
|
|
1667
1823
|
children: items.map((item, index) => {
|
|
1668
1824
|
const isLast = index === items.length - 1;
|
|
1669
|
-
return /* @__PURE__ */
|
|
1825
|
+
return /* @__PURE__ */ jsx22(
|
|
1670
1826
|
AriaBreadcrumb,
|
|
1671
1827
|
{
|
|
1672
1828
|
id: item.id,
|
|
@@ -1674,8 +1830,8 @@ function Breadcrumbs({ items, className }) {
|
|
|
1674
1830
|
"flex items-center gap-1",
|
|
1675
1831
|
isLast ? "min-w-0" : "shrink-0"
|
|
1676
1832
|
].join(" "),
|
|
1677
|
-
children: isLast ? /* @__PURE__ */
|
|
1678
|
-
/* @__PURE__ */
|
|
1833
|
+
children: isLast ? /* @__PURE__ */ jsx22("span", { className: "font-medium text-foreground truncate", children: item.label }) : /* @__PURE__ */ jsxs17(Fragment6, { children: [
|
|
1834
|
+
/* @__PURE__ */ jsx22(
|
|
1679
1835
|
Link2,
|
|
1680
1836
|
{
|
|
1681
1837
|
href: item.href,
|
|
@@ -1683,8 +1839,8 @@ function Breadcrumbs({ items, className }) {
|
|
|
1683
1839
|
children: item.label
|
|
1684
1840
|
}
|
|
1685
1841
|
),
|
|
1686
|
-
/* @__PURE__ */
|
|
1687
|
-
|
|
1842
|
+
/* @__PURE__ */ jsx22(
|
|
1843
|
+
ChevronRight2,
|
|
1688
1844
|
{
|
|
1689
1845
|
className: "shrink-0 text-neutral-400",
|
|
1690
1846
|
size: 16,
|
|
@@ -1702,94 +1858,13 @@ function Breadcrumbs({ items, className }) {
|
|
|
1702
1858
|
);
|
|
1703
1859
|
}
|
|
1704
1860
|
|
|
1705
|
-
// src/components/ButtonLink/ButtonLink.tsx
|
|
1706
|
-
import {
|
|
1707
|
-
Link as AriaLink2
|
|
1708
|
-
} from "react-aria-components";
|
|
1709
|
-
import { twMerge as twMerge5 } from "tailwind-merge";
|
|
1710
|
-
import { jsx as jsx24, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
1711
|
-
var iconSizeMap3 = {
|
|
1712
|
-
xs: "sm",
|
|
1713
|
-
sm: "sm",
|
|
1714
|
-
md: "sm",
|
|
1715
|
-
lg: "md"
|
|
1716
|
-
};
|
|
1717
|
-
function ButtonLink({
|
|
1718
|
-
variant = "primary",
|
|
1719
|
-
size = "md",
|
|
1720
|
-
iconLeft,
|
|
1721
|
-
iconRight,
|
|
1722
|
-
className,
|
|
1723
|
-
children,
|
|
1724
|
-
...props
|
|
1725
|
-
}) {
|
|
1726
|
-
return /* @__PURE__ */ jsxs17(
|
|
1727
|
-
AriaLink2,
|
|
1728
|
-
{
|
|
1729
|
-
...props,
|
|
1730
|
-
className: twMerge5(
|
|
1731
|
-
"inline-flex items-center justify-center gap-2 cursor-pointer",
|
|
1732
|
-
"rounded-md",
|
|
1733
|
-
"font-medium",
|
|
1734
|
-
"leading-tight",
|
|
1735
|
-
"outline-none transition-colors no-underline",
|
|
1736
|
-
"focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
|
|
1737
|
-
variantStyles[variant],
|
|
1738
|
-
sizeStyles[size],
|
|
1739
|
-
className
|
|
1740
|
-
),
|
|
1741
|
-
children: [
|
|
1742
|
-
iconLeft && /* @__PURE__ */ jsx24(Icon, { icon: iconLeft, size: iconSizeMap3[size] }),
|
|
1743
|
-
children,
|
|
1744
|
-
iconRight && /* @__PURE__ */ jsx24(Icon, { icon: iconRight, size: iconSizeMap3[size] })
|
|
1745
|
-
]
|
|
1746
|
-
}
|
|
1747
|
-
);
|
|
1748
|
-
}
|
|
1749
|
-
var squareSizeStyles2 = {
|
|
1750
|
-
sm: "h-8 w-8",
|
|
1751
|
-
md: "h-10 w-10",
|
|
1752
|
-
lg: "h-12 w-12"
|
|
1753
|
-
};
|
|
1754
|
-
function IconButtonLink({
|
|
1755
|
-
icon,
|
|
1756
|
-
"aria-label": ariaLabel,
|
|
1757
|
-
variant = "ghost",
|
|
1758
|
-
size = "md",
|
|
1759
|
-
showTooltip = true,
|
|
1760
|
-
className,
|
|
1761
|
-
...props
|
|
1762
|
-
}) {
|
|
1763
|
-
const link = /* @__PURE__ */ jsx24(
|
|
1764
|
-
AriaLink2,
|
|
1765
|
-
{
|
|
1766
|
-
...props,
|
|
1767
|
-
"aria-label": ariaLabel,
|
|
1768
|
-
className: twMerge5(
|
|
1769
|
-
"inline-flex items-center justify-center cursor-pointer",
|
|
1770
|
-
"rounded-md",
|
|
1771
|
-
"outline-none transition-colors no-underline",
|
|
1772
|
-
"focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
|
|
1773
|
-
variantStyles[variant],
|
|
1774
|
-
squareSizeStyles2[size],
|
|
1775
|
-
className
|
|
1776
|
-
),
|
|
1777
|
-
children: /* @__PURE__ */ jsx24(Icon, { icon, size: iconSizeMap3[size] })
|
|
1778
|
-
}
|
|
1779
|
-
);
|
|
1780
|
-
if (showTooltip) {
|
|
1781
|
-
return /* @__PURE__ */ jsx24(Tooltip, { content: ariaLabel, children: link });
|
|
1782
|
-
}
|
|
1783
|
-
return link;
|
|
1784
|
-
}
|
|
1785
|
-
|
|
1786
1861
|
// src/components/ToggleButton/ToggleButton.tsx
|
|
1787
1862
|
import {
|
|
1788
|
-
ToggleButton as
|
|
1863
|
+
ToggleButton as AriaToggleButton2
|
|
1789
1864
|
} from "react-aria-components";
|
|
1790
|
-
import { twMerge as
|
|
1791
|
-
import { jsx as
|
|
1792
|
-
var
|
|
1865
|
+
import { twMerge as twMerge9 } from "tailwind-merge";
|
|
1866
|
+
import { jsx as jsx23 } from "react/jsx-runtime";
|
|
1867
|
+
var squareSizeStyles2 = {
|
|
1793
1868
|
xs: "h-6 w-6 text-xs",
|
|
1794
1869
|
sm: "h-7 w-7 text-sm",
|
|
1795
1870
|
md: "h-8 w-8 text-base",
|
|
@@ -1833,11 +1908,11 @@ function ToggleButton({
|
|
|
1833
1908
|
...props
|
|
1834
1909
|
}) {
|
|
1835
1910
|
const styles = variantStyles3[variant];
|
|
1836
|
-
return /* @__PURE__ */
|
|
1837
|
-
|
|
1911
|
+
return /* @__PURE__ */ jsx23(
|
|
1912
|
+
AriaToggleButton2,
|
|
1838
1913
|
{
|
|
1839
1914
|
...props,
|
|
1840
|
-
className: ({ isSelected }) =>
|
|
1915
|
+
className: ({ isSelected }) => twMerge9(
|
|
1841
1916
|
"inline-flex items-center justify-center gap-2 cursor-pointer",
|
|
1842
1917
|
isSquare ? "rounded-none" : "rounded-md",
|
|
1843
1918
|
"font-medium",
|
|
@@ -1845,7 +1920,7 @@ function ToggleButton({
|
|
|
1845
1920
|
"outline-none transition-colors",
|
|
1846
1921
|
"focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
|
|
1847
1922
|
"disabled:opacity-50 disabled:pointer-events-none",
|
|
1848
|
-
isSquare ?
|
|
1923
|
+
isSquare ? squareSizeStyles2[size] : sizeStyles[size],
|
|
1849
1924
|
isSelected ? styles.selected : styles.base,
|
|
1850
1925
|
className
|
|
1851
1926
|
)
|
|
@@ -1853,78 +1928,6 @@ function ToggleButton({
|
|
|
1853
1928
|
);
|
|
1854
1929
|
}
|
|
1855
1930
|
|
|
1856
|
-
// src/components/ToggleButtonGroup/ToggleButtonGroup.tsx
|
|
1857
|
-
import { createContext as createContext3, useContext as useContext3 } from "react";
|
|
1858
|
-
import { twMerge as twMerge7 } from "tailwind-merge";
|
|
1859
|
-
import {
|
|
1860
|
-
RadioGroup as AriaRadioGroup2,
|
|
1861
|
-
Radio as AriaRadio2
|
|
1862
|
-
} from "react-aria-components";
|
|
1863
|
-
import { jsx as jsx26 } from "react/jsx-runtime";
|
|
1864
|
-
var ToggleButtonGroupContext = createContext3({
|
|
1865
|
-
size: "md"
|
|
1866
|
-
});
|
|
1867
|
-
var sizeStyles4 = {
|
|
1868
|
-
sm: "px-2.5 py-1 text-xs gap-1",
|
|
1869
|
-
md: "px-3 py-1.5 text-sm gap-1.5",
|
|
1870
|
-
lg: "px-4 py-2 text-base gap-2"
|
|
1871
|
-
};
|
|
1872
|
-
var iconOnlySizeStyles = {
|
|
1873
|
-
sm: "p-1",
|
|
1874
|
-
md: "p-1.5",
|
|
1875
|
-
lg: "p-2"
|
|
1876
|
-
};
|
|
1877
|
-
function ToggleButtonGroup({
|
|
1878
|
-
size = "md",
|
|
1879
|
-
className,
|
|
1880
|
-
children,
|
|
1881
|
-
...props
|
|
1882
|
-
}) {
|
|
1883
|
-
return /* @__PURE__ */ jsx26(ToggleButtonGroupContext.Provider, { value: { size }, children: /* @__PURE__ */ jsx26(
|
|
1884
|
-
AriaRadioGroup2,
|
|
1885
|
-
{
|
|
1886
|
-
...props,
|
|
1887
|
-
orientation: "horizontal",
|
|
1888
|
-
className: twMerge7(
|
|
1889
|
-
"inline-flex items-center rounded-lg border border-border bg-muted p-0.5 gap-0.5",
|
|
1890
|
-
className
|
|
1891
|
-
),
|
|
1892
|
-
children
|
|
1893
|
-
}
|
|
1894
|
-
) });
|
|
1895
|
-
}
|
|
1896
|
-
function ToggleButtonGroupItem({
|
|
1897
|
-
children,
|
|
1898
|
-
isIconOnly,
|
|
1899
|
-
className,
|
|
1900
|
-
...props
|
|
1901
|
-
}) {
|
|
1902
|
-
const { size } = useContext3(ToggleButtonGroupContext);
|
|
1903
|
-
return /* @__PURE__ */ jsx26(
|
|
1904
|
-
AriaRadio2,
|
|
1905
|
-
{
|
|
1906
|
-
...props,
|
|
1907
|
-
className: ({ isSelected, isHovered, isPressed, isDisabled }) => twMerge7(
|
|
1908
|
-
// Base layout
|
|
1909
|
-
"inline-flex items-center justify-center",
|
|
1910
|
-
"rounded-md",
|
|
1911
|
-
"font-medium",
|
|
1912
|
-
"outline-none transition-colors cursor-pointer",
|
|
1913
|
-
// Focus ring
|
|
1914
|
-
"focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1",
|
|
1915
|
-
// Disabled
|
|
1916
|
-
isDisabled && "opacity-50 pointer-events-none",
|
|
1917
|
-
// Size
|
|
1918
|
-
isIconOnly ? iconOnlySizeStyles[size] : sizeStyles4[size],
|
|
1919
|
-
// Selected state
|
|
1920
|
-
isSelected ? "bg-background text-foreground shadow-sm font-semibold" : isPressed ? "bg-card text-foreground" : isHovered ? "bg-card text-foreground" : "bg-transparent text-muted-foreground",
|
|
1921
|
-
className
|
|
1922
|
-
),
|
|
1923
|
-
children
|
|
1924
|
-
}
|
|
1925
|
-
);
|
|
1926
|
-
}
|
|
1927
|
-
|
|
1928
1931
|
// src/components/Menu/Menu.tsx
|
|
1929
1932
|
import {
|
|
1930
1933
|
MenuTrigger,
|
|
@@ -1932,7 +1935,7 @@ import {
|
|
|
1932
1935
|
MenuItem as AriaMenuItem,
|
|
1933
1936
|
Popover as Popover2
|
|
1934
1937
|
} from "react-aria-components";
|
|
1935
|
-
import { jsx as
|
|
1938
|
+
import { jsx as jsx24, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
1936
1939
|
var popoverStyles = [
|
|
1937
1940
|
"bg-background rounded-md",
|
|
1938
1941
|
"shadow-lg border border-border",
|
|
@@ -1954,11 +1957,11 @@ function Menu({
|
|
|
1954
1957
|
const selectionProps = selectionMode && selectionMode !== "none" ? { selectionMode, selectedKeys, defaultSelectedKeys, onSelectionChange } : {};
|
|
1955
1958
|
return /* @__PURE__ */ jsxs18(MenuTrigger, { children: [
|
|
1956
1959
|
children,
|
|
1957
|
-
/* @__PURE__ */
|
|
1960
|
+
/* @__PURE__ */ jsx24(
|
|
1958
1961
|
Popover2,
|
|
1959
1962
|
{
|
|
1960
1963
|
className: [popoverStyles, className].filter(Boolean).join(" "),
|
|
1961
|
-
children: items ? /* @__PURE__ */
|
|
1964
|
+
children: items ? /* @__PURE__ */ jsx24(
|
|
1962
1965
|
AriaMenu,
|
|
1963
1966
|
{
|
|
1964
1967
|
items,
|
|
@@ -1985,14 +1988,14 @@ function Menu({
|
|
|
1985
1988
|
item.isDanger ? "text-destructive" : "text-foreground"
|
|
1986
1989
|
].filter(Boolean).join(" "),
|
|
1987
1990
|
children: [
|
|
1988
|
-
item.icon && /* @__PURE__ */
|
|
1989
|
-
/* @__PURE__ */
|
|
1990
|
-
item.endContent && /* @__PURE__ */
|
|
1991
|
+
item.icon && /* @__PURE__ */ jsx24(Icon, { icon: item.icon, size: "sm" }),
|
|
1992
|
+
/* @__PURE__ */ jsx24("span", { className: "flex-1", children: item.label }),
|
|
1993
|
+
item.endContent && /* @__PURE__ */ jsx24("span", { className: "ml-auto flex items-center", children: item.endContent })
|
|
1991
1994
|
]
|
|
1992
1995
|
}
|
|
1993
1996
|
)
|
|
1994
1997
|
}
|
|
1995
|
-
) : /* @__PURE__ */
|
|
1998
|
+
) : /* @__PURE__ */ jsx24(
|
|
1996
1999
|
AriaMenu,
|
|
1997
2000
|
{
|
|
1998
2001
|
onAction: (key) => onAction?.(key),
|
|
@@ -2008,7 +2011,7 @@ function Menu({
|
|
|
2008
2011
|
|
|
2009
2012
|
// src/components/Menu/MenuItem.tsx
|
|
2010
2013
|
import { MenuItem as AriaMenuItem2 } from "react-aria-components";
|
|
2011
|
-
import { jsx as
|
|
2014
|
+
import { jsx as jsx25, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
2012
2015
|
function MenuItem({
|
|
2013
2016
|
id,
|
|
2014
2017
|
children,
|
|
@@ -2041,9 +2044,9 @@ function MenuItem({
|
|
|
2041
2044
|
className
|
|
2042
2045
|
].filter(Boolean).join(" "),
|
|
2043
2046
|
children: [
|
|
2044
|
-
icon && /* @__PURE__ */
|
|
2045
|
-
/* @__PURE__ */
|
|
2046
|
-
endContent && /* @__PURE__ */
|
|
2047
|
+
icon && /* @__PURE__ */ jsx25(Icon, { icon, size: "sm" }),
|
|
2048
|
+
/* @__PURE__ */ jsx25("span", { className: "flex-1", children }),
|
|
2049
|
+
endContent && /* @__PURE__ */ jsx25("span", { className: "ml-auto flex items-center", children: endContent })
|
|
2047
2050
|
]
|
|
2048
2051
|
}
|
|
2049
2052
|
);
|
|
@@ -2051,8 +2054,8 @@ function MenuItem({
|
|
|
2051
2054
|
|
|
2052
2055
|
// src/components/Menu/MenuCheckboxItem.tsx
|
|
2053
2056
|
import { MenuItem as AriaMenuItem3 } from "react-aria-components";
|
|
2054
|
-
import { Check as
|
|
2055
|
-
import { Fragment as Fragment7, jsx as
|
|
2057
|
+
import { Check as Check4 } from "lucide-react";
|
|
2058
|
+
import { Fragment as Fragment7, jsx as jsx26, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
2056
2059
|
function MenuCheckboxItem({
|
|
2057
2060
|
id,
|
|
2058
2061
|
children,
|
|
@@ -2060,7 +2063,7 @@ function MenuCheckboxItem({
|
|
|
2060
2063
|
isDisabled,
|
|
2061
2064
|
className
|
|
2062
2065
|
}) {
|
|
2063
|
-
return /* @__PURE__ */
|
|
2066
|
+
return /* @__PURE__ */ jsx26(
|
|
2064
2067
|
AriaMenuItem3,
|
|
2065
2068
|
{
|
|
2066
2069
|
id,
|
|
@@ -2077,8 +2080,8 @@ function MenuCheckboxItem({
|
|
|
2077
2080
|
className
|
|
2078
2081
|
].filter(Boolean).join(" "),
|
|
2079
2082
|
children: ({ isSelected }) => /* @__PURE__ */ jsxs20(Fragment7, { children: [
|
|
2080
|
-
/* @__PURE__ */
|
|
2081
|
-
/* @__PURE__ */
|
|
2083
|
+
/* @__PURE__ */ jsx26("span", { className: "flex items-center justify-center w-4 h-4 shrink-0", children: isSelected && /* @__PURE__ */ jsx26(Check4, { size: 14, className: "text-primary", "aria-hidden": "true" }) }),
|
|
2084
|
+
/* @__PURE__ */ jsx26("span", { className: "flex-1", children })
|
|
2082
2085
|
] })
|
|
2083
2086
|
}
|
|
2084
2087
|
);
|
|
@@ -2089,7 +2092,7 @@ import {
|
|
|
2089
2092
|
MenuSection as AriaMenuSection,
|
|
2090
2093
|
Header
|
|
2091
2094
|
} from "react-aria-components";
|
|
2092
|
-
import { jsx as
|
|
2095
|
+
import { jsx as jsx27, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
2093
2096
|
function MenuSection({
|
|
2094
2097
|
header,
|
|
2095
2098
|
children,
|
|
@@ -2097,7 +2100,7 @@ function MenuSection({
|
|
|
2097
2100
|
className
|
|
2098
2101
|
}) {
|
|
2099
2102
|
return /* @__PURE__ */ jsxs21(AriaMenuSection, { className, "aria-label": ariaLabel, children: [
|
|
2100
|
-
header && /* @__PURE__ */
|
|
2103
|
+
header && /* @__PURE__ */ jsx27(
|
|
2101
2104
|
Header,
|
|
2102
2105
|
{
|
|
2103
2106
|
className: [
|
|
@@ -2116,16 +2119,16 @@ function MenuSection({
|
|
|
2116
2119
|
|
|
2117
2120
|
// src/components/Menu/MenuHeader.tsx
|
|
2118
2121
|
import { Header as Header2 } from "react-aria-components";
|
|
2119
|
-
import { jsx as
|
|
2122
|
+
import { jsx as jsx28 } from "react/jsx-runtime";
|
|
2120
2123
|
function MenuHeader({ children, className }) {
|
|
2121
|
-
return /* @__PURE__ */
|
|
2124
|
+
return /* @__PURE__ */ jsx28(Header2, { className, children });
|
|
2122
2125
|
}
|
|
2123
2126
|
|
|
2124
2127
|
// src/components/Menu/MenuSeparator.tsx
|
|
2125
2128
|
import { Separator } from "react-aria-components";
|
|
2126
|
-
import { jsx as
|
|
2129
|
+
import { jsx as jsx29 } from "react/jsx-runtime";
|
|
2127
2130
|
function MenuSeparator({ className }) {
|
|
2128
|
-
return /* @__PURE__ */
|
|
2131
|
+
return /* @__PURE__ */ jsx29(
|
|
2129
2132
|
Separator,
|
|
2130
2133
|
{
|
|
2131
2134
|
className: [
|
|
@@ -2142,17 +2145,17 @@ import {
|
|
|
2142
2145
|
Popover as AriaPopover,
|
|
2143
2146
|
Button as AriaButton3
|
|
2144
2147
|
} from "react-aria-components";
|
|
2145
|
-
import { twMerge as
|
|
2146
|
-
import { jsx as
|
|
2148
|
+
import { twMerge as twMerge10 } from "tailwind-merge";
|
|
2149
|
+
import { jsx as jsx30 } from "react/jsx-runtime";
|
|
2147
2150
|
function Popover3({ children, isOpen, onOpenChange }) {
|
|
2148
|
-
return /* @__PURE__ */
|
|
2151
|
+
return /* @__PURE__ */ jsx30(DialogTrigger, { isOpen, onOpenChange, children });
|
|
2149
2152
|
}
|
|
2150
2153
|
function PopoverTrigger({ children, className }) {
|
|
2151
2154
|
const cx = `
|
|
2152
2155
|
inline-flex items-center bg-transparent border-none p-0 outline-none cursor-pointer
|
|
2153
2156
|
focus-visible:ring-2 focus-visible:ring-ring focus-visible:rounded-sm
|
|
2154
2157
|
`;
|
|
2155
|
-
return /* @__PURE__ */
|
|
2158
|
+
return /* @__PURE__ */ jsx30(AriaButton3, { className: twMerge10(cx, className), children });
|
|
2156
2159
|
}
|
|
2157
2160
|
function PopoverContent({
|
|
2158
2161
|
placement = "bottom",
|
|
@@ -2173,33 +2176,33 @@ function PopoverContent({
|
|
|
2173
2176
|
entering:placement-left:slide-in-from-right-1
|
|
2174
2177
|
entering:placement-right:slide-in-from-left-1
|
|
2175
2178
|
`;
|
|
2176
|
-
return /* @__PURE__ */
|
|
2179
|
+
return /* @__PURE__ */ jsx30(
|
|
2177
2180
|
AriaPopover,
|
|
2178
2181
|
{
|
|
2179
2182
|
...rest,
|
|
2180
2183
|
placement,
|
|
2181
2184
|
offset: offsetPx,
|
|
2182
|
-
className:
|
|
2185
|
+
className: twMerge10(cx, className),
|
|
2183
2186
|
children
|
|
2184
2187
|
}
|
|
2185
2188
|
);
|
|
2186
2189
|
}
|
|
2187
2190
|
|
|
2188
2191
|
// src/components/Tabs/Tabs.tsx
|
|
2189
|
-
import { createContext as
|
|
2190
|
-
import { twMerge as
|
|
2192
|
+
import { createContext as createContext2, useContext as useContext2 } from "react";
|
|
2193
|
+
import { twMerge as twMerge11 } from "tailwind-merge";
|
|
2191
2194
|
import {
|
|
2192
2195
|
Tabs as AriaTabs,
|
|
2193
2196
|
TabList as AriaTabList,
|
|
2194
2197
|
Tab as AriaTab,
|
|
2195
2198
|
TabPanel as AriaTabPanel
|
|
2196
2199
|
} from "react-aria-components";
|
|
2197
|
-
import { jsx as
|
|
2198
|
-
var TabsContext =
|
|
2200
|
+
import { jsx as jsx31 } from "react/jsx-runtime";
|
|
2201
|
+
var TabsContext = createContext2({
|
|
2199
2202
|
variant: "underline",
|
|
2200
2203
|
size: "md"
|
|
2201
2204
|
});
|
|
2202
|
-
var
|
|
2205
|
+
var sizeStyles4 = {
|
|
2203
2206
|
sm: "px-3 py-1.5 text-sm",
|
|
2204
2207
|
md: "px-4 py-2 text-base",
|
|
2205
2208
|
lg: "px-6 py-3 text-lg"
|
|
@@ -2212,12 +2215,12 @@ function Tabs({
|
|
|
2212
2215
|
children,
|
|
2213
2216
|
...props
|
|
2214
2217
|
}) {
|
|
2215
|
-
return /* @__PURE__ */
|
|
2218
|
+
return /* @__PURE__ */ jsx31(TabsContext.Provider, { value: { variant, size }, children: /* @__PURE__ */ jsx31(
|
|
2216
2219
|
AriaTabs,
|
|
2217
2220
|
{
|
|
2218
2221
|
...props,
|
|
2219
2222
|
orientation,
|
|
2220
|
-
className:
|
|
2223
|
+
className: twMerge11(
|
|
2221
2224
|
orientation === "vertical" ? "flex" : "",
|
|
2222
2225
|
className
|
|
2223
2226
|
),
|
|
@@ -2229,14 +2232,14 @@ function TabList({
|
|
|
2229
2232
|
className,
|
|
2230
2233
|
...props
|
|
2231
2234
|
}) {
|
|
2232
|
-
const { variant } =
|
|
2235
|
+
const { variant } = useContext2(TabsContext);
|
|
2233
2236
|
const baseStyles = variant === "unstyled" ? "flex items-center" : variant === "underline" ? "flex items-center border-b border-border" : "inline-flex items-center bg-muted rounded-lg p-1 gap-1";
|
|
2234
2237
|
const verticalStyles = variant === "unstyled" ? "flex-col" : variant === "underline" ? "flex-col border-b-0 border-r border-border" : "flex-col";
|
|
2235
|
-
return /* @__PURE__ */
|
|
2238
|
+
return /* @__PURE__ */ jsx31(
|
|
2236
2239
|
AriaTabList,
|
|
2237
2240
|
{
|
|
2238
2241
|
...props,
|
|
2239
|
-
className: ({ orientation }) =>
|
|
2242
|
+
className: ({ orientation }) => twMerge11(
|
|
2240
2243
|
baseStyles,
|
|
2241
2244
|
orientation === "vertical" ? verticalStyles : "",
|
|
2242
2245
|
className
|
|
@@ -2245,21 +2248,21 @@ function TabList({
|
|
|
2245
2248
|
);
|
|
2246
2249
|
}
|
|
2247
2250
|
function Tab({ className, ...props }) {
|
|
2248
|
-
const { variant, size } =
|
|
2249
|
-
return /* @__PURE__ */
|
|
2251
|
+
const { variant, size } = useContext2(TabsContext);
|
|
2252
|
+
return /* @__PURE__ */ jsx31(
|
|
2250
2253
|
AriaTab,
|
|
2251
2254
|
{
|
|
2252
2255
|
...props,
|
|
2253
2256
|
className: ({ isSelected, isDisabled, isHovered, isPressed }) => {
|
|
2254
2257
|
if (variant === "unstyled") {
|
|
2255
|
-
return
|
|
2258
|
+
return twMerge11(
|
|
2256
2259
|
"cursor-pointer outline-none",
|
|
2257
2260
|
"focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
|
|
2258
2261
|
isDisabled ? "opacity-50 pointer-events-none" : "",
|
|
2259
2262
|
className
|
|
2260
2263
|
);
|
|
2261
2264
|
}
|
|
2262
|
-
return
|
|
2265
|
+
return twMerge11(
|
|
2263
2266
|
// Base
|
|
2264
2267
|
"cursor-pointer outline-none transition-colors",
|
|
2265
2268
|
"font-medium",
|
|
@@ -2268,7 +2271,7 @@ function Tab({ className, ...props }) {
|
|
|
2268
2271
|
// Disabled
|
|
2269
2272
|
isDisabled ? "opacity-50 pointer-events-none" : "",
|
|
2270
2273
|
// Size
|
|
2271
|
-
|
|
2274
|
+
sizeStyles4[size],
|
|
2272
2275
|
...getTabVariantStyles(variant, {
|
|
2273
2276
|
isSelected,
|
|
2274
2277
|
isHovered,
|
|
@@ -2302,12 +2305,12 @@ function getTabVariantStyles(variant, state) {
|
|
|
2302
2305
|
];
|
|
2303
2306
|
}
|
|
2304
2307
|
function TabPanel({ className, ...props }) {
|
|
2305
|
-
const { variant } =
|
|
2306
|
-
return /* @__PURE__ */
|
|
2308
|
+
const { variant } = useContext2(TabsContext);
|
|
2309
|
+
return /* @__PURE__ */ jsx31(
|
|
2307
2310
|
AriaTabPanel,
|
|
2308
2311
|
{
|
|
2309
2312
|
...props,
|
|
2310
|
-
className:
|
|
2313
|
+
className: twMerge11(
|
|
2311
2314
|
variant === "unstyled" ? "outline-none" : "mt-4 outline-none",
|
|
2312
2315
|
className
|
|
2313
2316
|
)
|
|
@@ -2324,17 +2327,17 @@ import {
|
|
|
2324
2327
|
} from "react-aria-components";
|
|
2325
2328
|
|
|
2326
2329
|
// src/components/SegmentedControl/SegmentedControl.tsx
|
|
2327
|
-
import { createContext as
|
|
2328
|
-
import { twMerge as
|
|
2330
|
+
import { createContext as createContext3, useContext as useContext3 } from "react";
|
|
2331
|
+
import { twMerge as twMerge12 } from "tailwind-merge";
|
|
2329
2332
|
import {
|
|
2330
2333
|
ToggleButtonGroup as AriaToggleButtonGroup,
|
|
2331
|
-
ToggleButton as
|
|
2334
|
+
ToggleButton as AriaToggleButton3
|
|
2332
2335
|
} from "react-aria-components";
|
|
2333
|
-
import { jsx as
|
|
2334
|
-
var SegmentedControlContext =
|
|
2336
|
+
import { jsx as jsx32 } from "react/jsx-runtime";
|
|
2337
|
+
var SegmentedControlContext = createContext3({
|
|
2335
2338
|
size: "md"
|
|
2336
2339
|
});
|
|
2337
|
-
var
|
|
2340
|
+
var sizeStyles5 = {
|
|
2338
2341
|
sm: "px-2.5 py-1 text-xs",
|
|
2339
2342
|
md: "px-3 py-1.5 text-sm",
|
|
2340
2343
|
lg: "px-4 py-2 text-base"
|
|
@@ -2350,7 +2353,7 @@ function SegmentedControl({
|
|
|
2350
2353
|
...props
|
|
2351
2354
|
}) {
|
|
2352
2355
|
const isNoneMode = selectionMode === "none";
|
|
2353
|
-
return /* @__PURE__ */
|
|
2356
|
+
return /* @__PURE__ */ jsx32(SegmentedControlContext.Provider, { value: { size }, children: /* @__PURE__ */ jsx32(
|
|
2354
2357
|
AriaToggleButtonGroup,
|
|
2355
2358
|
{
|
|
2356
2359
|
...props,
|
|
@@ -2358,7 +2361,7 @@ function SegmentedControl({
|
|
|
2358
2361
|
selectedKeys: isNoneMode ? /* @__PURE__ */ new Set() : selectedKeys,
|
|
2359
2362
|
defaultSelectedKeys: isNoneMode ? void 0 : defaultSelectedKeys,
|
|
2360
2363
|
onSelectionChange: isNoneMode ? void 0 : onSelectionChange,
|
|
2361
|
-
className:
|
|
2364
|
+
className: twMerge12(
|
|
2362
2365
|
"inline-flex items-center rounded-lg border border-border bg-muted p-0.5 gap-0.5",
|
|
2363
2366
|
className
|
|
2364
2367
|
),
|
|
@@ -2370,12 +2373,12 @@ function SegmentedControlItem({
|
|
|
2370
2373
|
className,
|
|
2371
2374
|
...props
|
|
2372
2375
|
}) {
|
|
2373
|
-
const { size } =
|
|
2374
|
-
return /* @__PURE__ */
|
|
2375
|
-
|
|
2376
|
+
const { size } = useContext3(SegmentedControlContext);
|
|
2377
|
+
return /* @__PURE__ */ jsx32(
|
|
2378
|
+
AriaToggleButton3,
|
|
2376
2379
|
{
|
|
2377
2380
|
...props,
|
|
2378
|
-
className: ({ isSelected, isHovered, isPressed, isDisabled }) =>
|
|
2381
|
+
className: ({ isSelected, isHovered, isPressed, isDisabled }) => twMerge12(
|
|
2379
2382
|
// Base layout
|
|
2380
2383
|
"inline-flex items-center justify-center",
|
|
2381
2384
|
"rounded-md",
|
|
@@ -2386,7 +2389,7 @@ function SegmentedControlItem({
|
|
|
2386
2389
|
// Disabled
|
|
2387
2390
|
isDisabled && "opacity-50 pointer-events-none",
|
|
2388
2391
|
// Size
|
|
2389
|
-
|
|
2392
|
+
sizeStyles5[size],
|
|
2390
2393
|
// Selected state
|
|
2391
2394
|
isSelected ? "bg-background text-foreground shadow-sm font-semibold" : isPressed ? "bg-card text-foreground" : isHovered ? "bg-card text-foreground" : "bg-transparent text-muted-foreground",
|
|
2392
2395
|
className
|
|
@@ -2396,8 +2399,8 @@ function SegmentedControlItem({
|
|
|
2396
2399
|
}
|
|
2397
2400
|
|
|
2398
2401
|
// src/components/Badge/Badge.tsx
|
|
2399
|
-
import { twMerge as
|
|
2400
|
-
import { jsx as
|
|
2402
|
+
import { twMerge as twMerge13 } from "tailwind-merge";
|
|
2403
|
+
import { jsx as jsx33, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
2401
2404
|
var variantStyles4 = {
|
|
2402
2405
|
neutral: "bg-(--color-badge-neutral-bg) text-(--color-badge-neutral-text)",
|
|
2403
2406
|
purple: "bg-(--color-badge-purple-bg) text-(--color-badge-purple-text)",
|
|
@@ -2407,33 +2410,29 @@ var variantStyles4 = {
|
|
|
2407
2410
|
green: "bg-(--color-badge-green-bg) text-(--color-badge-green-text)",
|
|
2408
2411
|
amber: "bg-(--color-badge-amber-bg) text-(--color-badge-amber-text)"
|
|
2409
2412
|
};
|
|
2410
|
-
var
|
|
2413
|
+
var sizeStyles6 = {
|
|
2411
2414
|
sm: "px-1.5 py-0.5",
|
|
2412
2415
|
md: "px-2 py-0.5"
|
|
2413
2416
|
};
|
|
2414
|
-
var iconSizeMap4 = {
|
|
2415
|
-
sm: 12,
|
|
2416
|
-
md: 14
|
|
2417
|
-
};
|
|
2418
2417
|
function Badge({
|
|
2419
2418
|
children,
|
|
2420
2419
|
variant = "neutral",
|
|
2421
2420
|
size = "sm",
|
|
2422
|
-
icon
|
|
2421
|
+
icon,
|
|
2423
2422
|
className
|
|
2424
2423
|
}) {
|
|
2425
2424
|
return /* @__PURE__ */ jsxs22(
|
|
2426
2425
|
"span",
|
|
2427
2426
|
{
|
|
2428
|
-
className:
|
|
2427
|
+
className: twMerge13(
|
|
2429
2428
|
"inline-flex items-center gap-1 rounded-full",
|
|
2430
2429
|
"text-xs font-medium leading-tight",
|
|
2431
2430
|
variantStyles4[variant],
|
|
2432
|
-
|
|
2431
|
+
sizeStyles6[size],
|
|
2433
2432
|
className
|
|
2434
2433
|
),
|
|
2435
2434
|
children: [
|
|
2436
|
-
|
|
2435
|
+
icon && /* @__PURE__ */ jsx33(Icon, { icon, size: "xs" }),
|
|
2437
2436
|
children
|
|
2438
2437
|
]
|
|
2439
2438
|
}
|
|
@@ -2442,8 +2441,8 @@ function Badge({
|
|
|
2442
2441
|
|
|
2443
2442
|
// src/components/Card/Card.tsx
|
|
2444
2443
|
import { useCallback as useCallback3 } from "react";
|
|
2445
|
-
import { twMerge as
|
|
2446
|
-
import { Fragment as Fragment8, jsx as
|
|
2444
|
+
import { twMerge as twMerge14 } from "tailwind-merge";
|
|
2445
|
+
import { Fragment as Fragment8, jsx as jsx34, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
2447
2446
|
var paddingStyles = {
|
|
2448
2447
|
none: "p-0",
|
|
2449
2448
|
sm: "p-3",
|
|
@@ -2461,7 +2460,7 @@ function Card({
|
|
|
2461
2460
|
className
|
|
2462
2461
|
}) {
|
|
2463
2462
|
const isInteractive = interactive || !!href || !!onPress;
|
|
2464
|
-
const containerClass =
|
|
2463
|
+
const containerClass = twMerge14(
|
|
2465
2464
|
"bg-background border border-border rounded-lg overflow-hidden shadow-sm",
|
|
2466
2465
|
isInteractive && "transition-all hover:shadow-md hover:border-ring cursor-pointer",
|
|
2467
2466
|
(href || onPress) && "block focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 outline-none",
|
|
@@ -2477,21 +2476,21 @@ function Card({
|
|
|
2477
2476
|
[onPress]
|
|
2478
2477
|
);
|
|
2479
2478
|
const content = /* @__PURE__ */ jsxs23(Fragment8, { children: [
|
|
2480
|
-
header && /* @__PURE__ */
|
|
2479
|
+
header && /* @__PURE__ */ jsx34(
|
|
2481
2480
|
"div",
|
|
2482
2481
|
{
|
|
2483
|
-
className:
|
|
2482
|
+
className: twMerge14(
|
|
2484
2483
|
"border-b border-border",
|
|
2485
2484
|
paddingStyles[padding]
|
|
2486
2485
|
),
|
|
2487
2486
|
children: header
|
|
2488
2487
|
}
|
|
2489
2488
|
),
|
|
2490
|
-
/* @__PURE__ */
|
|
2491
|
-
footer && /* @__PURE__ */
|
|
2489
|
+
/* @__PURE__ */ jsx34("div", { className: paddingStyles[padding], children }),
|
|
2490
|
+
footer && /* @__PURE__ */ jsx34(
|
|
2492
2491
|
"div",
|
|
2493
2492
|
{
|
|
2494
|
-
className:
|
|
2493
|
+
className: twMerge14(
|
|
2495
2494
|
"border-t border-border",
|
|
2496
2495
|
paddingStyles[padding]
|
|
2497
2496
|
),
|
|
@@ -2500,10 +2499,10 @@ function Card({
|
|
|
2500
2499
|
)
|
|
2501
2500
|
] });
|
|
2502
2501
|
if (href) {
|
|
2503
|
-
return /* @__PURE__ */
|
|
2502
|
+
return /* @__PURE__ */ jsx34("a", { href, className: containerClass, children: content });
|
|
2504
2503
|
}
|
|
2505
2504
|
if (onPress) {
|
|
2506
|
-
return /* @__PURE__ */
|
|
2505
|
+
return /* @__PURE__ */ jsx34(
|
|
2507
2506
|
"div",
|
|
2508
2507
|
{
|
|
2509
2508
|
role: "button",
|
|
@@ -2515,13 +2514,13 @@ function Card({
|
|
|
2515
2514
|
}
|
|
2516
2515
|
);
|
|
2517
2516
|
}
|
|
2518
|
-
return /* @__PURE__ */
|
|
2517
|
+
return /* @__PURE__ */ jsx34("div", { className: containerClass, children: content });
|
|
2519
2518
|
}
|
|
2520
2519
|
|
|
2521
2520
|
// src/components/DeltaIndicator/DeltaIndicator.tsx
|
|
2522
|
-
import { ArrowUp, ArrowDown, Minus } from "lucide-react";
|
|
2523
|
-
import { twMerge as
|
|
2524
|
-
import { jsx as
|
|
2521
|
+
import { ArrowUp as ArrowUp2, ArrowDown as ArrowDown2, Minus as Minus2 } from "lucide-react";
|
|
2522
|
+
import { twMerge as twMerge15 } from "tailwind-merge";
|
|
2523
|
+
import { jsx as jsx35, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
2525
2524
|
function getDirection(current, previous) {
|
|
2526
2525
|
const diff = current - previous;
|
|
2527
2526
|
if (diff > 0) return "increase";
|
|
@@ -2553,9 +2552,9 @@ var reverseDirectionColors = {
|
|
|
2553
2552
|
flat: "text-(--color-delta-flat-text)"
|
|
2554
2553
|
};
|
|
2555
2554
|
var directionIcons = {
|
|
2556
|
-
increase:
|
|
2557
|
-
decrease:
|
|
2558
|
-
flat:
|
|
2555
|
+
increase: ArrowUp2,
|
|
2556
|
+
decrease: ArrowDown2,
|
|
2557
|
+
flat: Minus2
|
|
2559
2558
|
};
|
|
2560
2559
|
var directionBgColors = {
|
|
2561
2560
|
increase: "bg-(--color-delta-increase-bg)",
|
|
@@ -2577,13 +2576,13 @@ function DeltaIndicator({
|
|
|
2577
2576
|
return /* @__PURE__ */ jsxs24(
|
|
2578
2577
|
"span",
|
|
2579
2578
|
{
|
|
2580
|
-
className:
|
|
2579
|
+
className: twMerge15(
|
|
2581
2580
|
"inline-flex items-center gap-1 font-medium",
|
|
2582
2581
|
"text-muted-foreground",
|
|
2583
2582
|
className
|
|
2584
2583
|
),
|
|
2585
2584
|
children: [
|
|
2586
|
-
label && /* @__PURE__ */
|
|
2585
|
+
label && /* @__PURE__ */ jsx35("span", { className: "text-sm text-muted-foreground mr-1", children: label }),
|
|
2587
2586
|
unavailableText
|
|
2588
2587
|
]
|
|
2589
2588
|
}
|
|
@@ -2616,7 +2615,7 @@ function DeltaIndicator({
|
|
|
2616
2615
|
return /* @__PURE__ */ jsxs24(
|
|
2617
2616
|
"span",
|
|
2618
2617
|
{
|
|
2619
|
-
className:
|
|
2618
|
+
className: twMerge15(
|
|
2620
2619
|
"inline-flex items-center gap-1 font-medium",
|
|
2621
2620
|
colorStyles2,
|
|
2622
2621
|
isPill && [
|
|
@@ -2627,8 +2626,8 @@ function DeltaIndicator({
|
|
|
2627
2626
|
className
|
|
2628
2627
|
),
|
|
2629
2628
|
children: [
|
|
2630
|
-
label && /* @__PURE__ */
|
|
2631
|
-
/* @__PURE__ */
|
|
2629
|
+
label && /* @__PURE__ */ jsx35("span", { className: "text-sm text-muted-foreground mr-1", children: label }),
|
|
2630
|
+
/* @__PURE__ */ jsx35(IconComponent, { size: 14, "aria-hidden": true }),
|
|
2632
2631
|
valueText
|
|
2633
2632
|
]
|
|
2634
2633
|
}
|
|
@@ -2636,8 +2635,8 @@ function DeltaIndicator({
|
|
|
2636
2635
|
}
|
|
2637
2636
|
|
|
2638
2637
|
// src/components/ProgressBar/ProgressBar.tsx
|
|
2639
|
-
import { twMerge as
|
|
2640
|
-
import { jsx as
|
|
2638
|
+
import { twMerge as twMerge16 } from "tailwind-merge";
|
|
2639
|
+
import { jsx as jsx36, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
2641
2640
|
var fillStyles = {
|
|
2642
2641
|
brand: "bg-(--color-progress-fill)",
|
|
2643
2642
|
success: "bg-(--color-progress-fill-success)",
|
|
@@ -2645,7 +2644,7 @@ var fillStyles = {
|
|
|
2645
2644
|
danger: "bg-(--color-progress-fill-danger)",
|
|
2646
2645
|
neutral: "bg-muted-foreground"
|
|
2647
2646
|
};
|
|
2648
|
-
var
|
|
2647
|
+
var sizeStyles7 = {
|
|
2649
2648
|
sm: "h-1.5",
|
|
2650
2649
|
md: "h-3",
|
|
2651
2650
|
lg: "h-4"
|
|
@@ -2660,12 +2659,12 @@ function ProgressBar({
|
|
|
2660
2659
|
className
|
|
2661
2660
|
}) {
|
|
2662
2661
|
const clampedValue = Math.min(100, Math.max(0, value));
|
|
2663
|
-
return /* @__PURE__ */ jsxs25("div", { className:
|
|
2662
|
+
return /* @__PURE__ */ jsxs25("div", { className: twMerge16("w-full", className), children: [
|
|
2664
2663
|
(label || description || showValue) && /* @__PURE__ */ jsxs25("div", { className: "flex items-center justify-between mb-2", children: [
|
|
2665
|
-
/* @__PURE__ */
|
|
2666
|
-
/* @__PURE__ */
|
|
2664
|
+
/* @__PURE__ */ jsx36("span", { className: "text-sm font-medium text-foreground", children: label }),
|
|
2665
|
+
/* @__PURE__ */ jsx36("span", { className: "text-sm text-muted-foreground", children: description ?? (showValue ? `${clampedValue}%` : null) })
|
|
2667
2666
|
] }),
|
|
2668
|
-
/* @__PURE__ */
|
|
2667
|
+
/* @__PURE__ */ jsx36(
|
|
2669
2668
|
"div",
|
|
2670
2669
|
{
|
|
2671
2670
|
role: "progressbar",
|
|
@@ -2673,14 +2672,14 @@ function ProgressBar({
|
|
|
2673
2672
|
"aria-valuemin": 0,
|
|
2674
2673
|
"aria-valuemax": 100,
|
|
2675
2674
|
"aria-label": label ?? "Progress",
|
|
2676
|
-
className:
|
|
2675
|
+
className: twMerge16(
|
|
2677
2676
|
"w-full rounded-full bg-(--color-progress-track)",
|
|
2678
|
-
|
|
2677
|
+
sizeStyles7[size]
|
|
2679
2678
|
),
|
|
2680
|
-
children: /* @__PURE__ */
|
|
2679
|
+
children: /* @__PURE__ */ jsx36(
|
|
2681
2680
|
"div",
|
|
2682
2681
|
{
|
|
2683
|
-
className:
|
|
2682
|
+
className: twMerge16(
|
|
2684
2683
|
"h-full rounded-full transition-all duration-300",
|
|
2685
2684
|
fillStyles[variant]
|
|
2686
2685
|
),
|
|
@@ -2693,37 +2692,36 @@ function ProgressBar({
|
|
|
2693
2692
|
}
|
|
2694
2693
|
|
|
2695
2694
|
// src/components/Banner/Banner.tsx
|
|
2696
|
-
import { useState as
|
|
2695
|
+
import { useState as useState7 } from "react";
|
|
2697
2696
|
import {
|
|
2698
|
-
Info as
|
|
2699
|
-
AlertTriangle,
|
|
2700
|
-
AlertCircle,
|
|
2701
|
-
CheckCircle2
|
|
2702
|
-
X as X3
|
|
2697
|
+
Info as Info3,
|
|
2698
|
+
AlertTriangle as AlertTriangle2,
|
|
2699
|
+
AlertCircle as AlertCircle2,
|
|
2700
|
+
CheckCircle2 as CheckCircle22
|
|
2703
2701
|
} from "lucide-react";
|
|
2704
|
-
import { twMerge as
|
|
2705
|
-
import { jsx as
|
|
2702
|
+
import { twMerge as twMerge17 } from "tailwind-merge";
|
|
2703
|
+
import { jsx as jsx37, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
2706
2704
|
var variantConfig2 = {
|
|
2707
2705
|
info: {
|
|
2708
|
-
icon:
|
|
2706
|
+
icon: Info3,
|
|
2709
2707
|
containerClass: "bg-info-surface border-info-border text-info-surface-foreground",
|
|
2710
2708
|
iconClass: "text-info",
|
|
2711
2709
|
role: "status"
|
|
2712
2710
|
},
|
|
2713
2711
|
warning: {
|
|
2714
|
-
icon:
|
|
2712
|
+
icon: AlertTriangle2,
|
|
2715
2713
|
containerClass: "bg-warning-surface border-warning-border text-warning-surface-foreground",
|
|
2716
2714
|
iconClass: "text-warning",
|
|
2717
2715
|
role: "alert"
|
|
2718
2716
|
},
|
|
2719
2717
|
danger: {
|
|
2720
|
-
icon:
|
|
2718
|
+
icon: AlertCircle2,
|
|
2721
2719
|
containerClass: "bg-destructive-surface border-destructive-border text-destructive-surface-foreground",
|
|
2722
2720
|
iconClass: "text-destructive",
|
|
2723
2721
|
role: "alert"
|
|
2724
2722
|
},
|
|
2725
2723
|
success: {
|
|
2726
|
-
icon:
|
|
2724
|
+
icon: CheckCircle22,
|
|
2727
2725
|
containerClass: "bg-success-surface border-success-border text-success-surface-foreground",
|
|
2728
2726
|
iconClass: "text-success",
|
|
2729
2727
|
role: "status"
|
|
@@ -2738,10 +2736,10 @@ function Banner({
|
|
|
2738
2736
|
onDismiss,
|
|
2739
2737
|
className
|
|
2740
2738
|
}) {
|
|
2741
|
-
const [dismissed, setDismissed] =
|
|
2739
|
+
const [dismissed, setDismissed] = useState7(false);
|
|
2742
2740
|
if (dismissed) return null;
|
|
2743
2741
|
const config = variantConfig2[variant];
|
|
2744
|
-
const
|
|
2742
|
+
const resolvedIcon = icon ?? config.icon;
|
|
2745
2743
|
const handleDismiss = () => {
|
|
2746
2744
|
setDismissed(true);
|
|
2747
2745
|
onDismiss?.();
|
|
@@ -2750,19 +2748,19 @@ function Banner({
|
|
|
2750
2748
|
"div",
|
|
2751
2749
|
{
|
|
2752
2750
|
role: config.role,
|
|
2753
|
-
className:
|
|
2751
|
+
className: twMerge17(
|
|
2754
2752
|
"flex items-start gap-3 rounded-lg border px-4 py-3",
|
|
2755
2753
|
"text-sm",
|
|
2756
2754
|
config.containerClass,
|
|
2757
2755
|
className
|
|
2758
2756
|
),
|
|
2759
2757
|
children: [
|
|
2760
|
-
/* @__PURE__ */
|
|
2761
|
-
|
|
2758
|
+
/* @__PURE__ */ jsx37(
|
|
2759
|
+
Icon,
|
|
2762
2760
|
{
|
|
2763
|
-
|
|
2764
|
-
|
|
2765
|
-
"
|
|
2761
|
+
icon: resolvedIcon,
|
|
2762
|
+
size: "md",
|
|
2763
|
+
className: twMerge17("mt-0.5", config.iconClass)
|
|
2766
2764
|
}
|
|
2767
2765
|
),
|
|
2768
2766
|
/* @__PURE__ */ jsxs26("div", { className: "flex-1", children: [
|
|
@@ -2772,14 +2770,14 @@ function Banner({
|
|
|
2772
2770
|
] }),
|
|
2773
2771
|
children
|
|
2774
2772
|
] }),
|
|
2775
|
-
dismissible && /* @__PURE__ */
|
|
2773
|
+
dismissible && /* @__PURE__ */ jsx37(
|
|
2776
2774
|
"button",
|
|
2777
2775
|
{
|
|
2778
2776
|
type: "button",
|
|
2779
2777
|
onClick: handleDismiss,
|
|
2780
2778
|
className: "shrink-0 rounded-sm p-0.5 opacity-70 hover:opacity-100 transition-opacity outline-none focus-visible:ring-2 focus-visible:ring-current",
|
|
2781
2779
|
"aria-label": "Dismiss",
|
|
2782
|
-
children: /* @__PURE__ */
|
|
2780
|
+
children: /* @__PURE__ */ jsx37(Icon, { icon: "X", size: "sm" })
|
|
2783
2781
|
}
|
|
2784
2782
|
)
|
|
2785
2783
|
]
|
|
@@ -2788,8 +2786,8 @@ function Banner({
|
|
|
2788
2786
|
}
|
|
2789
2787
|
|
|
2790
2788
|
// src/components/MetricCard/MetricCard.tsx
|
|
2791
|
-
import { twMerge as
|
|
2792
|
-
import { Fragment as Fragment9, jsx as
|
|
2789
|
+
import { twMerge as twMerge18 } from "tailwind-merge";
|
|
2790
|
+
import { Fragment as Fragment9, jsx as jsx38, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
2793
2791
|
var sizeConfig = {
|
|
2794
2792
|
sm: {
|
|
2795
2793
|
padding: "p-3",
|
|
@@ -2811,35 +2809,35 @@ function MetricCard({
|
|
|
2811
2809
|
className
|
|
2812
2810
|
}) {
|
|
2813
2811
|
const config = sizeConfig[size];
|
|
2814
|
-
const containerClass =
|
|
2812
|
+
const containerClass = twMerge18(
|
|
2815
2813
|
"bg-background border border-border rounded-lg shadow-sm",
|
|
2816
2814
|
config.padding,
|
|
2817
2815
|
href && "block transition-shadow hover:shadow-md hover:border-ring focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 outline-none",
|
|
2818
2816
|
className
|
|
2819
2817
|
);
|
|
2820
2818
|
const content = /* @__PURE__ */ jsxs27(Fragment9, { children: [
|
|
2821
|
-
/* @__PURE__ */
|
|
2822
|
-
/* @__PURE__ */
|
|
2819
|
+
/* @__PURE__ */ jsx38("div", { className: twMerge18(config.labelClass, "text-muted-foreground"), children: label }),
|
|
2820
|
+
/* @__PURE__ */ jsx38(
|
|
2823
2821
|
"div",
|
|
2824
2822
|
{
|
|
2825
|
-
className:
|
|
2823
|
+
className: twMerge18(
|
|
2826
2824
|
config.valueClass,
|
|
2827
2825
|
"font-semibold text-foreground mt-1 tabular-nums"
|
|
2828
2826
|
),
|
|
2829
2827
|
children: value
|
|
2830
2828
|
}
|
|
2831
2829
|
),
|
|
2832
|
-
secondary && /* @__PURE__ */
|
|
2830
|
+
secondary && /* @__PURE__ */ jsx38("div", { className: "mt-1 text-sm", children: secondary })
|
|
2833
2831
|
] });
|
|
2834
2832
|
if (href) {
|
|
2835
|
-
return /* @__PURE__ */
|
|
2833
|
+
return /* @__PURE__ */ jsx38("a", { href, className: containerClass, children: content });
|
|
2836
2834
|
}
|
|
2837
|
-
return /* @__PURE__ */
|
|
2835
|
+
return /* @__PURE__ */ jsx38("div", { className: containerClass, children: content });
|
|
2838
2836
|
}
|
|
2839
2837
|
|
|
2840
2838
|
// src/components/SectionHeader/SectionHeader.tsx
|
|
2841
|
-
import { twMerge as
|
|
2842
|
-
import { jsx as
|
|
2839
|
+
import { twMerge as twMerge19 } from "tailwind-merge";
|
|
2840
|
+
import { jsx as jsx39, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
2843
2841
|
function SectionHeader({
|
|
2844
2842
|
title,
|
|
2845
2843
|
children,
|
|
@@ -2848,21 +2846,21 @@ function SectionHeader({
|
|
|
2848
2846
|
return /* @__PURE__ */ jsxs28(
|
|
2849
2847
|
"div",
|
|
2850
2848
|
{
|
|
2851
|
-
className:
|
|
2849
|
+
className: twMerge19(
|
|
2852
2850
|
"flex flex-wrap items-center gap-3 py-4",
|
|
2853
2851
|
className
|
|
2854
2852
|
),
|
|
2855
2853
|
children: [
|
|
2856
|
-
/* @__PURE__ */
|
|
2857
|
-
children && /* @__PURE__ */
|
|
2854
|
+
/* @__PURE__ */ jsx39(H2, { children: title }),
|
|
2855
|
+
children && /* @__PURE__ */ jsx39("div", { className: "ml-auto flex flex-wrap items-center gap-2", children })
|
|
2858
2856
|
]
|
|
2859
2857
|
}
|
|
2860
2858
|
);
|
|
2861
2859
|
}
|
|
2862
2860
|
|
|
2863
2861
|
// src/components/Pill/Pill.tsx
|
|
2864
|
-
import { twMerge as
|
|
2865
|
-
import { jsx as
|
|
2862
|
+
import { twMerge as twMerge20 } from "tailwind-merge";
|
|
2863
|
+
import { jsx as jsx40 } from "react/jsx-runtime";
|
|
2866
2864
|
var hashColors = {
|
|
2867
2865
|
purple: "bg-(--color-badge-purple-bg) text-(--color-badge-purple-text) border-(--color-badge-purple-text)/20",
|
|
2868
2866
|
teal: "bg-(--color-badge-teal-bg) text-(--color-badge-teal-text) border-(--color-badge-teal-text)/20",
|
|
@@ -2888,7 +2886,7 @@ function Pill({
|
|
|
2888
2886
|
className,
|
|
2889
2887
|
...rest
|
|
2890
2888
|
}) {
|
|
2891
|
-
const cx =
|
|
2889
|
+
const cx = twMerge20(
|
|
2892
2890
|
`
|
|
2893
2891
|
inline-flex items-center
|
|
2894
2892
|
rounded-full
|
|
@@ -2900,12 +2898,12 @@ function Pill({
|
|
|
2900
2898
|
colorStyles[color],
|
|
2901
2899
|
className
|
|
2902
2900
|
);
|
|
2903
|
-
return /* @__PURE__ */
|
|
2901
|
+
return /* @__PURE__ */ jsx40("span", { className: cx, ...rest, children });
|
|
2904
2902
|
}
|
|
2905
2903
|
|
|
2906
2904
|
// src/components/Pill/PathPill.tsx
|
|
2907
|
-
import { twMerge as
|
|
2908
|
-
import { jsx as
|
|
2905
|
+
import { twMerge as twMerge21 } from "tailwind-merge";
|
|
2906
|
+
import { jsx as jsx41 } from "react/jsx-runtime";
|
|
2909
2907
|
function PathPill({
|
|
2910
2908
|
children,
|
|
2911
2909
|
visibleCount,
|
|
@@ -2917,17 +2915,17 @@ function PathPill({
|
|
|
2917
2915
|
const effectiveVisible = visibleCount ?? segments.length;
|
|
2918
2916
|
const dotCount = Math.max(0, segments.length - effectiveVisible);
|
|
2919
2917
|
const fullPath = segments.join(" / ");
|
|
2920
|
-
return /* @__PURE__ */
|
|
2918
|
+
return /* @__PURE__ */ jsx41(
|
|
2921
2919
|
"div",
|
|
2922
2920
|
{
|
|
2923
|
-
className:
|
|
2921
|
+
className: twMerge21("relative flex", className),
|
|
2924
2922
|
"aria-label": `Path: ${fullPath}`,
|
|
2925
2923
|
children: segments.map((segment, i) => {
|
|
2926
2924
|
const isCollapsed = i < dotCount;
|
|
2927
2925
|
const isLast = i === segments.length - 1;
|
|
2928
|
-
const cx =
|
|
2926
|
+
const cx = twMerge21(!isLast && "pr-5 -mr-4", isCollapsed && "pr-3");
|
|
2929
2927
|
const color = colorFn ? colorFn(segment, i) : pillColorFromName(segment);
|
|
2930
|
-
return /* @__PURE__ */
|
|
2928
|
+
return /* @__PURE__ */ jsx41(
|
|
2931
2929
|
Pill,
|
|
2932
2930
|
{
|
|
2933
2931
|
className: cx,
|
|
@@ -2943,9 +2941,9 @@ function PathPill({
|
|
|
2943
2941
|
}
|
|
2944
2942
|
|
|
2945
2943
|
// src/components/FormWizard/FormWizard.tsx
|
|
2946
|
-
import { createContext as
|
|
2947
|
-
import { jsx as
|
|
2948
|
-
var FormWizardContext =
|
|
2944
|
+
import { createContext as createContext4, useContext as useContext4, useCallback as useCallback4, useMemo } from "react";
|
|
2945
|
+
import { jsx as jsx42 } from "react/jsx-runtime";
|
|
2946
|
+
var FormWizardContext = createContext4({
|
|
2949
2947
|
currentStep: 0,
|
|
2950
2948
|
totalSteps: 1,
|
|
2951
2949
|
canGoBack: false,
|
|
@@ -2954,7 +2952,7 @@ var FormWizardContext = createContext6({
|
|
|
2954
2952
|
isLastStep: true
|
|
2955
2953
|
});
|
|
2956
2954
|
function useFormWizard() {
|
|
2957
|
-
return
|
|
2955
|
+
return useContext4(FormWizardContext);
|
|
2958
2956
|
}
|
|
2959
2957
|
function FormWizard({
|
|
2960
2958
|
currentStep,
|
|
@@ -2979,13 +2977,13 @@ function FormWizard({
|
|
|
2979
2977
|
}),
|
|
2980
2978
|
[currentStep, totalSteps, canGoBack, goBack, isLastStep]
|
|
2981
2979
|
);
|
|
2982
|
-
return /* @__PURE__ */
|
|
2980
|
+
return /* @__PURE__ */ jsx42(FormWizardContext.Provider, { value, children });
|
|
2983
2981
|
}
|
|
2984
2982
|
|
|
2985
2983
|
// src/components/FormWizard/FormWizardProgress.tsx
|
|
2986
|
-
import { jsx as
|
|
2984
|
+
import { jsx as jsx43, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
2987
2985
|
function CheckIcon() {
|
|
2988
|
-
return /* @__PURE__ */
|
|
2986
|
+
return /* @__PURE__ */ jsx43(
|
|
2989
2987
|
"svg",
|
|
2990
2988
|
{
|
|
2991
2989
|
"aria-hidden": "true",
|
|
@@ -2996,13 +2994,13 @@ function CheckIcon() {
|
|
|
2996
2994
|
strokeWidth: "2",
|
|
2997
2995
|
strokeLinecap: "round",
|
|
2998
2996
|
strokeLinejoin: "round",
|
|
2999
|
-
children: /* @__PURE__ */
|
|
2997
|
+
children: /* @__PURE__ */ jsx43("path", { d: "M3 8.5l3.5 3.5 6.5-7" })
|
|
3000
2998
|
}
|
|
3001
2999
|
);
|
|
3002
3000
|
}
|
|
3003
3001
|
function FormWizardProgress({ labels }) {
|
|
3004
3002
|
const { currentStep, totalSteps } = useFormWizard();
|
|
3005
|
-
return /* @__PURE__ */
|
|
3003
|
+
return /* @__PURE__ */ jsx43("nav", { "aria-label": "Form progress", children: /* @__PURE__ */ jsx43("ol", { className: "flex items-start", role: "list", children: labels.map((label, index) => {
|
|
3006
3004
|
const isCompleted = index < currentStep;
|
|
3007
3005
|
const isCurrent = index === currentStep;
|
|
3008
3006
|
const isFuture = index > currentStep;
|
|
@@ -3013,7 +3011,7 @@ function FormWizardProgress({ labels }) {
|
|
|
3013
3011
|
"aria-current": isCurrent ? "step" : void 0,
|
|
3014
3012
|
children: [
|
|
3015
3013
|
/* @__PURE__ */ jsxs29("div", { className: "flex w-full items-center", children: [
|
|
3016
|
-
index > 0 ? /* @__PURE__ */
|
|
3014
|
+
index > 0 ? /* @__PURE__ */ jsx43(
|
|
3017
3015
|
"div",
|
|
3018
3016
|
{
|
|
3019
3017
|
"aria-hidden": "true",
|
|
@@ -3022,8 +3020,8 @@ function FormWizardProgress({ labels }) {
|
|
|
3022
3020
|
index <= currentStep ? "bg-primary" : "bg-border"
|
|
3023
3021
|
].join(" ")
|
|
3024
3022
|
}
|
|
3025
|
-
) : /* @__PURE__ */
|
|
3026
|
-
/* @__PURE__ */
|
|
3023
|
+
) : /* @__PURE__ */ jsx43("div", { className: "flex-1", "aria-hidden": "true" }),
|
|
3024
|
+
/* @__PURE__ */ jsx43(
|
|
3027
3025
|
"div",
|
|
3028
3026
|
{
|
|
3029
3027
|
className: [
|
|
@@ -3035,10 +3033,10 @@ function FormWizardProgress({ labels }) {
|
|
|
3035
3033
|
isFuture ? "border-2 border-border bg-background text-muted-foreground" : ""
|
|
3036
3034
|
].join(" "),
|
|
3037
3035
|
"aria-hidden": "true",
|
|
3038
|
-
children: isCompleted ? /* @__PURE__ */
|
|
3036
|
+
children: isCompleted ? /* @__PURE__ */ jsx43(CheckIcon, {}) : index + 1
|
|
3039
3037
|
}
|
|
3040
3038
|
),
|
|
3041
|
-
index < totalSteps - 1 ? /* @__PURE__ */
|
|
3039
|
+
index < totalSteps - 1 ? /* @__PURE__ */ jsx43(
|
|
3042
3040
|
"div",
|
|
3043
3041
|
{
|
|
3044
3042
|
"aria-hidden": "true",
|
|
@@ -3047,9 +3045,9 @@ function FormWizardProgress({ labels }) {
|
|
|
3047
3045
|
index < currentStep ? "bg-primary" : "bg-border"
|
|
3048
3046
|
].join(" ")
|
|
3049
3047
|
}
|
|
3050
|
-
) : /* @__PURE__ */
|
|
3048
|
+
) : /* @__PURE__ */ jsx43("div", { className: "flex-1", "aria-hidden": "true" })
|
|
3051
3049
|
] }),
|
|
3052
|
-
/* @__PURE__ */
|
|
3050
|
+
/* @__PURE__ */ jsx43(
|
|
3053
3051
|
"span",
|
|
3054
3052
|
{
|
|
3055
3053
|
className: [
|
|
@@ -3067,7 +3065,7 @@ function FormWizardProgress({ labels }) {
|
|
|
3067
3065
|
}
|
|
3068
3066
|
|
|
3069
3067
|
// src/components/FormWizard/FormWizardNav.tsx
|
|
3070
|
-
import { jsx as
|
|
3068
|
+
import { jsx as jsx44, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
3071
3069
|
function FormWizardNav({
|
|
3072
3070
|
onNext,
|
|
3073
3071
|
isSubmitting = false,
|
|
@@ -3075,7 +3073,7 @@ function FormWizardNav({
|
|
|
3075
3073
|
}) {
|
|
3076
3074
|
const { canGoBack, goBack, isLastStep } = useFormWizard();
|
|
3077
3075
|
return /* @__PURE__ */ jsxs30("div", { className: "flex items-center justify-end gap-3", children: [
|
|
3078
|
-
canGoBack && /* @__PURE__ */
|
|
3076
|
+
canGoBack && /* @__PURE__ */ jsx44(
|
|
3079
3077
|
Button,
|
|
3080
3078
|
{
|
|
3081
3079
|
variant: "secondary",
|
|
@@ -3085,7 +3083,7 @@ function FormWizardNav({
|
|
|
3085
3083
|
children: "Back"
|
|
3086
3084
|
}
|
|
3087
3085
|
),
|
|
3088
|
-
/* @__PURE__ */
|
|
3086
|
+
/* @__PURE__ */ jsx44(
|
|
3089
3087
|
Button,
|
|
3090
3088
|
{
|
|
3091
3089
|
variant: "primary",
|
|
@@ -3498,10 +3496,9 @@ export {
|
|
|
3498
3496
|
Icon,
|
|
3499
3497
|
IconButton,
|
|
3500
3498
|
IconButtonLink,
|
|
3499
|
+
IconButtonToggle,
|
|
3501
3500
|
Input,
|
|
3502
|
-
|
|
3503
|
-
InputGroup,
|
|
3504
|
-
InputGroupContext,
|
|
3501
|
+
InputPassword,
|
|
3505
3502
|
Label,
|
|
3506
3503
|
LineHeightNormal,
|
|
3507
3504
|
LineHeightRelaxed,
|
|
@@ -3542,14 +3539,12 @@ export {
|
|
|
3542
3539
|
Tab,
|
|
3543
3540
|
TabList,
|
|
3544
3541
|
TabPanel,
|
|
3545
|
-
Table,
|
|
3542
|
+
Table2 as Table,
|
|
3546
3543
|
TableBody,
|
|
3547
3544
|
TableHeader,
|
|
3548
3545
|
Tabs,
|
|
3549
3546
|
ToastProvider,
|
|
3550
3547
|
ToggleButton,
|
|
3551
|
-
ToggleButtonGroup,
|
|
3552
|
-
ToggleButtonGroupItem,
|
|
3553
3548
|
Tooltip,
|
|
3554
3549
|
TruncatedText,
|
|
3555
3550
|
Tab2 as UnstyledTab,
|
|
@@ -3557,9 +3552,9 @@ export {
|
|
|
3557
3552
|
TabPanel2 as UnstyledTabPanel,
|
|
3558
3553
|
Tabs2 as UnstyledTabs,
|
|
3559
3554
|
createToastBridge,
|
|
3555
|
+
iconRegistry,
|
|
3560
3556
|
pillColorFromName,
|
|
3561
3557
|
useFormWizard,
|
|
3562
|
-
useInputGroup,
|
|
3563
3558
|
useToast
|
|
3564
3559
|
};
|
|
3565
3560
|
//# sourceMappingURL=index.js.map
|