@juv/codego-react-ui 1.0.2 → 1.0.5
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/README.md +160 -0
- package/dist/index.cjs +488 -336
- package/dist/index.d.cts +27 -5
- package/dist/index.d.ts +27 -5
- package/dist/index.global.js +14850 -0
- package/dist/index.js +477 -328
- package/package.json +8 -5
package/dist/index.cjs
CHANGED
|
@@ -71,6 +71,9 @@ __export(index_exports, {
|
|
|
71
71
|
NotificationPanel: () => NotificationPanel,
|
|
72
72
|
OtpInput: () => OtpInput,
|
|
73
73
|
Pagination: () => Pagination,
|
|
74
|
+
Panel: () => Panel,
|
|
75
|
+
PanelSidebarGroup: () => PanelSidebarGroup,
|
|
76
|
+
PanelSidebarItem: () => PanelSidebarItem,
|
|
74
77
|
Popover: () => Popover,
|
|
75
78
|
Progress: () => Progress,
|
|
76
79
|
RadioGroup: () => RadioGroup,
|
|
@@ -3895,6 +3898,8 @@ function Select({
|
|
|
3895
3898
|
const [search, setSearch] = React23.useState("");
|
|
3896
3899
|
const [isSearching, setIsSearching] = React23.useState(false);
|
|
3897
3900
|
const containerRef = React23.useRef(null);
|
|
3901
|
+
const getKey = (opt) => String(Object.keys(opt)[0]);
|
|
3902
|
+
const getLabel = (opt) => Object.values(opt)[0];
|
|
3898
3903
|
const selectedValues = React23.useMemo(() => {
|
|
3899
3904
|
if (multiple && Array.isArray(value)) {
|
|
3900
3905
|
return value;
|
|
@@ -3904,10 +3909,10 @@ function Select({
|
|
|
3904
3909
|
return [];
|
|
3905
3910
|
}, [value, multiple]);
|
|
3906
3911
|
const selectedOptions = React23.useMemo(() => {
|
|
3907
|
-
return options.filter((opt) => selectedValues.includes(opt
|
|
3912
|
+
return options.filter((opt) => selectedValues.includes(getKey(opt)));
|
|
3908
3913
|
}, [options, selectedValues]);
|
|
3909
3914
|
const filteredOptions = searchable ? options.filter(
|
|
3910
|
-
(opt) => opt.
|
|
3915
|
+
(opt) => getLabel(opt).toLowerCase().includes(search.toLowerCase())
|
|
3911
3916
|
) : options;
|
|
3912
3917
|
React23.useEffect(() => {
|
|
3913
3918
|
const handleClickOutside = (event) => {
|
|
@@ -3971,23 +3976,23 @@ function Select({
|
|
|
3971
3976
|
{
|
|
3972
3977
|
className: "inline-flex items-center gap-1 rounded-sm bg-primary/15 text-primary px-2 py-0.5 text-xs",
|
|
3973
3978
|
children: [
|
|
3974
|
-
opt
|
|
3979
|
+
getLabel(opt),
|
|
3975
3980
|
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
3976
3981
|
"button",
|
|
3977
3982
|
{
|
|
3978
3983
|
type: "button",
|
|
3979
3984
|
disabled,
|
|
3980
|
-
onClick: () => onChange?.(selectedValues.filter((v) => v !== opt
|
|
3985
|
+
onClick: () => onChange?.(selectedValues.filter((v) => v !== getKey(opt))),
|
|
3981
3986
|
className: "hover:text-destructive",
|
|
3982
3987
|
children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_lucide_react16.X, { className: "h-3 w-3" })
|
|
3983
3988
|
}
|
|
3984
3989
|
)
|
|
3985
3990
|
]
|
|
3986
3991
|
},
|
|
3987
|
-
opt
|
|
3992
|
+
getKey(opt)
|
|
3988
3993
|
)) }),
|
|
3989
3994
|
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "max-h-48 overflow-y-auto p-1", children: options.map((option) => {
|
|
3990
|
-
const checked = selectedValues.includes(option
|
|
3995
|
+
const checked = selectedValues.includes(getKey(option));
|
|
3991
3996
|
return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
|
|
3992
3997
|
"label",
|
|
3993
3998
|
{
|
|
@@ -4008,15 +4013,15 @@ function Select({
|
|
|
4008
4013
|
checked,
|
|
4009
4014
|
disabled,
|
|
4010
4015
|
onChange: () => {
|
|
4011
|
-
const newValues = checked ? selectedValues.filter((v) => v !== option
|
|
4016
|
+
const newValues = checked ? selectedValues.filter((v) => v !== getKey(option)) : [...selectedValues, getKey(option)];
|
|
4012
4017
|
onChange?.(newValues);
|
|
4013
4018
|
}
|
|
4014
4019
|
}
|
|
4015
4020
|
),
|
|
4016
|
-
option
|
|
4021
|
+
getLabel(option)
|
|
4017
4022
|
]
|
|
4018
4023
|
},
|
|
4019
|
-
option
|
|
4024
|
+
getKey(option)
|
|
4020
4025
|
);
|
|
4021
4026
|
}) })
|
|
4022
4027
|
] })
|
|
@@ -4034,7 +4039,7 @@ function Select({
|
|
|
4034
4039
|
className: "w-full appearance-none rounded-xl border border-slate-900/30 bg-background/50 backdrop-blur-sm px-4 py-2 pr-10 h-10 text-sm text-foreground transition-colors hover:bg-background/80 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
|
|
4035
4040
|
children: [
|
|
4036
4041
|
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("option", { value: "", disabled: true, children: placeholder }),
|
|
4037
|
-
options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("option", { value: option
|
|
4042
|
+
options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("option", { value: getKey(option), children: getLabel(option) }, getKey(option)))
|
|
4038
4043
|
]
|
|
4039
4044
|
}
|
|
4040
4045
|
),
|
|
@@ -4070,20 +4075,20 @@ function Select({
|
|
|
4070
4075
|
),
|
|
4071
4076
|
children: [
|
|
4072
4077
|
reorderable && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_lucide_react16.GripVertical, { className: "h-3 w-3 opacity-50" }),
|
|
4073
|
-
option
|
|
4078
|
+
getLabel(option),
|
|
4074
4079
|
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
4075
4080
|
"button",
|
|
4076
4081
|
{
|
|
4077
4082
|
type: "button",
|
|
4078
|
-
onClick: (e) => handleRemove(option
|
|
4083
|
+
onClick: (e) => handleRemove(getKey(option), e),
|
|
4079
4084
|
className: "ml-1 hover:text-destructive",
|
|
4080
4085
|
children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_lucide_react16.X, { className: "h-3 w-3" })
|
|
4081
4086
|
}
|
|
4082
4087
|
)
|
|
4083
4088
|
]
|
|
4084
4089
|
},
|
|
4085
|
-
option
|
|
4086
|
-
)) }) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: cn("truncate flex-1 text-left", !selectedOptions.length && "text-muted-foreground"), children: selectedOptions.length > 0 ? selectedOptions.map((opt) => opt
|
|
4090
|
+
getKey(option)
|
|
4091
|
+
)) }) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: cn("truncate flex-1 text-left", !selectedOptions.length && "text-muted-foreground"), children: selectedOptions.length > 0 ? selectedOptions.map((opt) => getLabel(opt)).join(", ") : placeholder })
|
|
4087
4092
|
}
|
|
4088
4093
|
),
|
|
4089
4094
|
!suffixIcon && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "absolute right-3 top-1/2 -translate-y-1/2 z-10 pointer-events-none", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_lucide_react16.ChevronDown, { className: "h-4 w-4 opacity-50" }) }),
|
|
@@ -4123,15 +4128,15 @@ function Select({
|
|
|
4123
4128
|
{
|
|
4124
4129
|
className: cn(
|
|
4125
4130
|
"relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none hover:bg-accent hover:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
|
|
4126
|
-
(multiple ? selectedValues.includes(option
|
|
4131
|
+
(multiple ? selectedValues.includes(getKey(option)) : value === getKey(option)) && "bg-accent text-accent-foreground"
|
|
4127
4132
|
),
|
|
4128
|
-
onClick: () => handleSelect(option
|
|
4133
|
+
onClick: () => handleSelect(getKey(option)),
|
|
4129
4134
|
children: [
|
|
4130
|
-
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: (multiple ? selectedValues.includes(option
|
|
4131
|
-
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "truncate", children: option
|
|
4135
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: (multiple ? selectedValues.includes(getKey(option)) : value === getKey(option)) && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_lucide_react16.Check, { className: "h-4 w-4" }) }),
|
|
4136
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "truncate", children: getLabel(option) })
|
|
4132
4137
|
]
|
|
4133
4138
|
},
|
|
4134
|
-
option
|
|
4139
|
+
getKey(option)
|
|
4135
4140
|
)),
|
|
4136
4141
|
createOptionForm && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "border-t border-white/10 mt-1 pt-1", children: createOptionForm })
|
|
4137
4142
|
] }) })
|
|
@@ -5325,9 +5330,198 @@ function Repeater({
|
|
|
5325
5330
|
] });
|
|
5326
5331
|
}
|
|
5327
5332
|
|
|
5328
|
-
// src/components/ui/
|
|
5333
|
+
// src/components/ui/panel.tsx
|
|
5334
|
+
var React31 = __toESM(require("react"), 1);
|
|
5335
|
+
var import_lucide_react21 = require("lucide-react");
|
|
5336
|
+
|
|
5337
|
+
// src/components/ui/tooltip.tsx
|
|
5329
5338
|
var React30 = __toESM(require("react"), 1);
|
|
5339
|
+
var ReactDOM = __toESM(require("react-dom"), 1);
|
|
5330
5340
|
var import_jsx_runtime37 = require("react/jsx-runtime");
|
|
5341
|
+
function Tooltip({
|
|
5342
|
+
content,
|
|
5343
|
+
children,
|
|
5344
|
+
side = "right",
|
|
5345
|
+
className,
|
|
5346
|
+
enabled = true
|
|
5347
|
+
}) {
|
|
5348
|
+
const [visible, setVisible] = React30.useState(false);
|
|
5349
|
+
const [coords, setCoords] = React30.useState({ top: 0, left: 0 });
|
|
5350
|
+
const ref = React30.useRef(null);
|
|
5351
|
+
if (!enabled) return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_jsx_runtime37.Fragment, { children });
|
|
5352
|
+
function calcCoords() {
|
|
5353
|
+
const r = ref.current?.getBoundingClientRect();
|
|
5354
|
+
if (!r) return;
|
|
5355
|
+
const GAP = 8;
|
|
5356
|
+
switch (side) {
|
|
5357
|
+
case "right":
|
|
5358
|
+
setCoords({ top: r.top + r.height / 2, left: r.right + GAP });
|
|
5359
|
+
break;
|
|
5360
|
+
case "left":
|
|
5361
|
+
setCoords({ top: r.top + r.height / 2, left: r.left - GAP });
|
|
5362
|
+
break;
|
|
5363
|
+
case "top":
|
|
5364
|
+
setCoords({ top: r.top - GAP, left: r.left + r.width / 2 });
|
|
5365
|
+
break;
|
|
5366
|
+
case "bottom":
|
|
5367
|
+
setCoords({ top: r.bottom + GAP, left: r.left + r.width / 2 });
|
|
5368
|
+
break;
|
|
5369
|
+
}
|
|
5370
|
+
}
|
|
5371
|
+
const transformClass = {
|
|
5372
|
+
right: "-translate-y-1/2",
|
|
5373
|
+
left: "-translate-y-1/2 -translate-x-full",
|
|
5374
|
+
top: "-translate-x-1/2 -translate-y-full",
|
|
5375
|
+
bottom: "-translate-x-1/2"
|
|
5376
|
+
}[side];
|
|
5377
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
|
|
5378
|
+
"div",
|
|
5379
|
+
{
|
|
5380
|
+
ref,
|
|
5381
|
+
className: "relative inline-flex",
|
|
5382
|
+
onMouseEnter: () => {
|
|
5383
|
+
calcCoords();
|
|
5384
|
+
setVisible(true);
|
|
5385
|
+
},
|
|
5386
|
+
onMouseLeave: () => setVisible(false),
|
|
5387
|
+
onFocus: () => {
|
|
5388
|
+
calcCoords();
|
|
5389
|
+
setVisible(true);
|
|
5390
|
+
},
|
|
5391
|
+
onBlur: () => setVisible(false),
|
|
5392
|
+
children: [
|
|
5393
|
+
children,
|
|
5394
|
+
visible && ReactDOM.createPortal(
|
|
5395
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
5396
|
+
"div",
|
|
5397
|
+
{
|
|
5398
|
+
role: "tooltip",
|
|
5399
|
+
style: { top: coords.top, left: coords.left },
|
|
5400
|
+
className: cn(
|
|
5401
|
+
"fixed z-[9999] whitespace-nowrap rounded-md bg-foreground px-2.5 py-1 text-xs font-medium text-background shadow-lg pointer-events-none",
|
|
5402
|
+
transformClass,
|
|
5403
|
+
className
|
|
5404
|
+
),
|
|
5405
|
+
children: content
|
|
5406
|
+
}
|
|
5407
|
+
),
|
|
5408
|
+
document.body
|
|
5409
|
+
)
|
|
5410
|
+
]
|
|
5411
|
+
}
|
|
5412
|
+
);
|
|
5413
|
+
}
|
|
5414
|
+
|
|
5415
|
+
// src/components/ui/panel.tsx
|
|
5416
|
+
var import_jsx_runtime38 = require("react/jsx-runtime");
|
|
5417
|
+
var PanelCollapsedContext = React31.createContext(false);
|
|
5418
|
+
function Panel({
|
|
5419
|
+
sidebar,
|
|
5420
|
+
sidebarHeader,
|
|
5421
|
+
sidebarFooter,
|
|
5422
|
+
sidebarWidth = "w-56",
|
|
5423
|
+
topbar,
|
|
5424
|
+
topbarTrailing,
|
|
5425
|
+
defaultCollapsed = false,
|
|
5426
|
+
collapsible = false,
|
|
5427
|
+
height = "h-[520px]",
|
|
5428
|
+
children,
|
|
5429
|
+
className
|
|
5430
|
+
}) {
|
|
5431
|
+
const [collapsed, setCollapsed] = React31.useState(defaultCollapsed);
|
|
5432
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(PanelCollapsedContext.Provider, { value: collapsed, children: /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
|
|
5433
|
+
"div",
|
|
5434
|
+
{
|
|
5435
|
+
className: cn(
|
|
5436
|
+
"flex overflow-hidden rounded-xl border border-border glass shadow-lg",
|
|
5437
|
+
height,
|
|
5438
|
+
className
|
|
5439
|
+
),
|
|
5440
|
+
children: [
|
|
5441
|
+
sidebar && /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
|
|
5442
|
+
"aside",
|
|
5443
|
+
{
|
|
5444
|
+
className: cn(
|
|
5445
|
+
"flex flex-col shrink-0 border-r border-border transition-all duration-200",
|
|
5446
|
+
collapsed ? "w-14" : sidebarWidth
|
|
5447
|
+
),
|
|
5448
|
+
children: [
|
|
5449
|
+
sidebarHeader && !collapsed && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "shrink-0 border-b border-border px-4 py-3 text-sm font-semibold", children: sidebarHeader }),
|
|
5450
|
+
sidebarHeader && collapsed && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "shrink-0 border-b border-border flex items-center justify-center py-3", children: sidebarHeader }),
|
|
5451
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "flex-1 overflow-y-auto py-2", children: sidebar }),
|
|
5452
|
+
sidebarFooter && !collapsed && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "shrink-0 border-t border-border px-4 py-3", children: sidebarFooter })
|
|
5453
|
+
]
|
|
5454
|
+
}
|
|
5455
|
+
),
|
|
5456
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex flex-1 min-w-0 flex-col", children: [
|
|
5457
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("header", { className: "flex h-12 shrink-0 items-center justify-between border-b border-border px-4 gap-2", children: [
|
|
5458
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex items-center gap-2", children: [
|
|
5459
|
+
collapsible && sidebar && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
5460
|
+
Tooltip,
|
|
5461
|
+
{
|
|
5462
|
+
content: collapsed ? "Expand sidebar" : "Collapse sidebar",
|
|
5463
|
+
side: "bottom",
|
|
5464
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
5465
|
+
"button",
|
|
5466
|
+
{
|
|
5467
|
+
type: "button",
|
|
5468
|
+
onClick: () => setCollapsed((c) => !c),
|
|
5469
|
+
className: "text-muted-foreground hover:text-foreground transition-colors",
|
|
5470
|
+
"aria-label": collapsed ? "Expand sidebar" : "Collapse sidebar",
|
|
5471
|
+
children: collapsed ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react21.PanelLeftOpen, { className: "h-4 w-4" }) : /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react21.PanelLeftClose, { className: "h-4 w-4" })
|
|
5472
|
+
}
|
|
5473
|
+
)
|
|
5474
|
+
}
|
|
5475
|
+
),
|
|
5476
|
+
topbar && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "flex items-center gap-2", children: topbar })
|
|
5477
|
+
] }),
|
|
5478
|
+
topbarTrailing && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "flex items-center gap-2", children: topbarTrailing })
|
|
5479
|
+
] }),
|
|
5480
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("main", { className: "flex-1 overflow-y-auto p-4", children })
|
|
5481
|
+
] })
|
|
5482
|
+
]
|
|
5483
|
+
}
|
|
5484
|
+
) });
|
|
5485
|
+
}
|
|
5486
|
+
function PanelSidebarItem({
|
|
5487
|
+
icon: Icon,
|
|
5488
|
+
label,
|
|
5489
|
+
active,
|
|
5490
|
+
onClick
|
|
5491
|
+
}) {
|
|
5492
|
+
const collapsed = React31.useContext(PanelCollapsedContext);
|
|
5493
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Tooltip, { content: label, side: "right", enabled: collapsed, children: /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
|
|
5494
|
+
"button",
|
|
5495
|
+
{
|
|
5496
|
+
type: "button",
|
|
5497
|
+
onClick,
|
|
5498
|
+
className: cn(
|
|
5499
|
+
"flex w-full items-center rounded-md text-sm font-medium transition-colors",
|
|
5500
|
+
collapsed ? "justify-center h-9 w-9 mx-auto px-0" : "gap-2 px-3 py-2",
|
|
5501
|
+
active ? "bg-primary text-primary-foreground" : "text-muted-foreground hover:bg-primary/20 hover:text-primary cursor-pointer"
|
|
5502
|
+
),
|
|
5503
|
+
children: [
|
|
5504
|
+
Icon && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Icon, { className: "h-4 w-4 shrink-0" }),
|
|
5505
|
+
!collapsed && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: "truncate", children: label })
|
|
5506
|
+
]
|
|
5507
|
+
}
|
|
5508
|
+
) });
|
|
5509
|
+
}
|
|
5510
|
+
function PanelSidebarGroup({
|
|
5511
|
+
title,
|
|
5512
|
+
children
|
|
5513
|
+
}) {
|
|
5514
|
+
const collapsed = React31.useContext(PanelCollapsedContext);
|
|
5515
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "px-2 py-1", children: [
|
|
5516
|
+
title && !collapsed && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("p", { className: "mb-1 px-2 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground", children: title }),
|
|
5517
|
+
title && collapsed && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "mx-1 mb-1 h-px bg-border" }),
|
|
5518
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "space-y-0.5", children })
|
|
5519
|
+
] });
|
|
5520
|
+
}
|
|
5521
|
+
|
|
5522
|
+
// src/components/ui/resizable-panels.tsx
|
|
5523
|
+
var React32 = __toESM(require("react"), 1);
|
|
5524
|
+
var import_jsx_runtime39 = require("react/jsx-runtime");
|
|
5331
5525
|
function ResizablePanels({
|
|
5332
5526
|
children,
|
|
5333
5527
|
orientation = "horizontal",
|
|
@@ -5337,15 +5531,15 @@ function ResizablePanels({
|
|
|
5337
5531
|
handleClassName,
|
|
5338
5532
|
className
|
|
5339
5533
|
}) {
|
|
5340
|
-
const [size, setSize] =
|
|
5341
|
-
const [dragging, setDragging] =
|
|
5342
|
-
const containerRef =
|
|
5534
|
+
const [size, setSize] = React32.useState(defaultSize);
|
|
5535
|
+
const [dragging, setDragging] = React32.useState(false);
|
|
5536
|
+
const containerRef = React32.useRef(null);
|
|
5343
5537
|
const isHorizontal = orientation === "horizontal";
|
|
5344
5538
|
function onMouseDown(e) {
|
|
5345
5539
|
e.preventDefault();
|
|
5346
5540
|
setDragging(true);
|
|
5347
5541
|
}
|
|
5348
|
-
|
|
5542
|
+
React32.useEffect(() => {
|
|
5349
5543
|
if (!dragging) return;
|
|
5350
5544
|
function onMove(e) {
|
|
5351
5545
|
const container = containerRef.current;
|
|
@@ -5364,7 +5558,7 @@ function ResizablePanels({
|
|
|
5364
5558
|
document.removeEventListener("mouseup", onUp);
|
|
5365
5559
|
};
|
|
5366
5560
|
}, [dragging, isHorizontal, minSize, maxSize]);
|
|
5367
|
-
return /* @__PURE__ */ (0,
|
|
5561
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
|
|
5368
5562
|
"div",
|
|
5369
5563
|
{
|
|
5370
5564
|
ref: containerRef,
|
|
@@ -5375,7 +5569,7 @@ function ResizablePanels({
|
|
|
5375
5569
|
className
|
|
5376
5570
|
),
|
|
5377
5571
|
children: [
|
|
5378
|
-
/* @__PURE__ */ (0,
|
|
5572
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
5379
5573
|
"div",
|
|
5380
5574
|
{
|
|
5381
5575
|
className: "overflow-auto",
|
|
@@ -5383,7 +5577,7 @@ function ResizablePanels({
|
|
|
5383
5577
|
children: children[0]
|
|
5384
5578
|
}
|
|
5385
5579
|
),
|
|
5386
|
-
/* @__PURE__ */ (0,
|
|
5580
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
5387
5581
|
"div",
|
|
5388
5582
|
{
|
|
5389
5583
|
onMouseDown,
|
|
@@ -5393,13 +5587,13 @@ function ResizablePanels({
|
|
|
5393
5587
|
dragging && (isHorizontal ? "w-1.5 bg-primary/60" : "h-1.5 bg-primary/60"),
|
|
5394
5588
|
handleClassName
|
|
5395
5589
|
),
|
|
5396
|
-
children: /* @__PURE__ */ (0,
|
|
5590
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: cn(
|
|
5397
5591
|
"rounded-full bg-muted-foreground/40",
|
|
5398
5592
|
isHorizontal ? "h-8 w-0.5" : "w-8 h-0.5"
|
|
5399
5593
|
) })
|
|
5400
5594
|
}
|
|
5401
5595
|
),
|
|
5402
|
-
/* @__PURE__ */ (0,
|
|
5596
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
5403
5597
|
"div",
|
|
5404
5598
|
{
|
|
5405
5599
|
className: "flex-1 overflow-auto",
|
|
@@ -5413,26 +5607,26 @@ function ResizablePanels({
|
|
|
5413
5607
|
}
|
|
5414
5608
|
|
|
5415
5609
|
// src/components/ui/rich-text-editor.tsx
|
|
5416
|
-
var
|
|
5417
|
-
var
|
|
5418
|
-
var
|
|
5610
|
+
var React33 = __toESM(require("react"), 1);
|
|
5611
|
+
var import_lucide_react22 = require("lucide-react");
|
|
5612
|
+
var import_jsx_runtime40 = require("react/jsx-runtime");
|
|
5419
5613
|
var TOOLBAR = [
|
|
5420
|
-
{ icon: /* @__PURE__ */ (0,
|
|
5421
|
-
{ icon: /* @__PURE__ */ (0,
|
|
5614
|
+
{ icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react22.Undo, { className: "h-3.5 w-3.5" }), command: "undo", title: "Undo" },
|
|
5615
|
+
{ icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react22.Redo, { className: "h-3.5 w-3.5" }), command: "redo", title: "Redo" },
|
|
5422
5616
|
"divider",
|
|
5423
|
-
{ icon: /* @__PURE__ */ (0,
|
|
5424
|
-
{ icon: /* @__PURE__ */ (0,
|
|
5617
|
+
{ icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react22.Heading2, { className: "h-3.5 w-3.5" }), command: "formatBlock", value: "h2", title: "Heading 2" },
|
|
5618
|
+
{ icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react22.Heading3, { className: "h-3.5 w-3.5" }), command: "formatBlock", value: "h3", title: "Heading 3" },
|
|
5425
5619
|
"divider",
|
|
5426
|
-
{ icon: /* @__PURE__ */ (0,
|
|
5427
|
-
{ icon: /* @__PURE__ */ (0,
|
|
5428
|
-
{ icon: /* @__PURE__ */ (0,
|
|
5429
|
-
{ icon: /* @__PURE__ */ (0,
|
|
5620
|
+
{ icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react22.Bold, { className: "h-3.5 w-3.5" }), command: "bold", title: "Bold" },
|
|
5621
|
+
{ icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react22.Italic, { className: "h-3.5 w-3.5" }), command: "italic", title: "Italic" },
|
|
5622
|
+
{ icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react22.Underline, { className: "h-3.5 w-3.5" }), command: "underline", title: "Underline" },
|
|
5623
|
+
{ icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react22.Code, { className: "h-3.5 w-3.5" }), command: "formatBlock", value: "pre", title: "Code block" },
|
|
5430
5624
|
"divider",
|
|
5431
|
-
{ icon: /* @__PURE__ */ (0,
|
|
5432
|
-
{ icon: /* @__PURE__ */ (0,
|
|
5433
|
-
{ icon: /* @__PURE__ */ (0,
|
|
5625
|
+
{ icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react22.List, { className: "h-3.5 w-3.5" }), command: "insertUnorderedList", title: "Bullet list" },
|
|
5626
|
+
{ icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react22.ListOrdered, { className: "h-3.5 w-3.5" }), command: "insertOrderedList", title: "Numbered list" },
|
|
5627
|
+
{ icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react22.Quote, { className: "h-3.5 w-3.5" }), command: "formatBlock", value: "blockquote", title: "Quote" },
|
|
5434
5628
|
"divider",
|
|
5435
|
-
{ icon: /* @__PURE__ */ (0,
|
|
5629
|
+
{ icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react22.Link, { className: "h-3.5 w-3.5" }), command: "createLink", title: "Insert link" }
|
|
5436
5630
|
];
|
|
5437
5631
|
function RichTextEditor({
|
|
5438
5632
|
value: controlled,
|
|
@@ -5443,17 +5637,17 @@ function RichTextEditor({
|
|
|
5443
5637
|
disabled = false,
|
|
5444
5638
|
className
|
|
5445
5639
|
}) {
|
|
5446
|
-
const editorRef =
|
|
5447
|
-
const [focused, setFocused] =
|
|
5448
|
-
const [isEmpty, setIsEmpty] =
|
|
5449
|
-
|
|
5640
|
+
const editorRef = React33.useRef(null);
|
|
5641
|
+
const [focused, setFocused] = React33.useState(false);
|
|
5642
|
+
const [isEmpty, setIsEmpty] = React33.useState(!defaultValue);
|
|
5643
|
+
React33.useEffect(() => {
|
|
5450
5644
|
if (editorRef.current && controlled !== void 0) {
|
|
5451
5645
|
if (editorRef.current.innerHTML !== controlled) {
|
|
5452
5646
|
editorRef.current.innerHTML = controlled;
|
|
5453
5647
|
}
|
|
5454
5648
|
}
|
|
5455
5649
|
}, [controlled]);
|
|
5456
|
-
|
|
5650
|
+
React33.useEffect(() => {
|
|
5457
5651
|
if (editorRef.current && defaultValue) {
|
|
5458
5652
|
editorRef.current.innerHTML = defaultValue;
|
|
5459
5653
|
setIsEmpty(false);
|
|
@@ -5481,14 +5675,14 @@ function RichTextEditor({
|
|
|
5481
5675
|
return false;
|
|
5482
5676
|
}
|
|
5483
5677
|
}
|
|
5484
|
-
return /* @__PURE__ */ (0,
|
|
5678
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: cn(
|
|
5485
5679
|
"rounded-xl border border-border overflow-hidden transition-colors",
|
|
5486
5680
|
focused && "ring-2 ring-ring border-primary",
|
|
5487
5681
|
disabled && "opacity-50 pointer-events-none",
|
|
5488
5682
|
className
|
|
5489
5683
|
), children: [
|
|
5490
|
-
/* @__PURE__ */ (0,
|
|
5491
|
-
(item, i) => item === "divider" ? /* @__PURE__ */ (0,
|
|
5684
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "flex flex-wrap items-center gap-0.5 border-b border-border bg-muted/30 px-2 py-1.5", children: TOOLBAR.map(
|
|
5685
|
+
(item, i) => item === "divider" ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "mx-1 h-4 w-px bg-border" }, i) : /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
5492
5686
|
"button",
|
|
5493
5687
|
{
|
|
5494
5688
|
type: "button",
|
|
@@ -5506,9 +5700,9 @@ function RichTextEditor({
|
|
|
5506
5700
|
i
|
|
5507
5701
|
)
|
|
5508
5702
|
) }),
|
|
5509
|
-
/* @__PURE__ */ (0,
|
|
5510
|
-
isEmpty && !focused && /* @__PURE__ */ (0,
|
|
5511
|
-
/* @__PURE__ */ (0,
|
|
5703
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "relative", children: [
|
|
5704
|
+
isEmpty && !focused && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "absolute top-3 left-4 text-sm text-muted-foreground pointer-events-none select-none", children: placeholder }),
|
|
5705
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
5512
5706
|
"div",
|
|
5513
5707
|
{
|
|
5514
5708
|
ref: editorRef,
|
|
@@ -5535,7 +5729,7 @@ function RichTextEditor({
|
|
|
5535
5729
|
}
|
|
5536
5730
|
|
|
5537
5731
|
// src/components/ui/scroll-area.tsx
|
|
5538
|
-
var
|
|
5732
|
+
var import_jsx_runtime41 = require("react/jsx-runtime");
|
|
5539
5733
|
function ScrollArea({
|
|
5540
5734
|
maxHeight,
|
|
5541
5735
|
maxWidth,
|
|
@@ -5550,7 +5744,7 @@ function ScrollArea({
|
|
|
5550
5744
|
horizontal: "overflow-x-auto overflow-y-hidden",
|
|
5551
5745
|
both: "overflow-auto"
|
|
5552
5746
|
}[orientation];
|
|
5553
|
-
return /* @__PURE__ */ (0,
|
|
5747
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
5554
5748
|
"div",
|
|
5555
5749
|
{
|
|
5556
5750
|
className: cn(
|
|
@@ -5570,9 +5764,9 @@ function ScrollArea({
|
|
|
5570
5764
|
}
|
|
5571
5765
|
|
|
5572
5766
|
// src/components/ui/section.tsx
|
|
5573
|
-
var
|
|
5574
|
-
var
|
|
5575
|
-
var
|
|
5767
|
+
var React34 = __toESM(require("react"), 1);
|
|
5768
|
+
var import_lucide_react23 = require("lucide-react");
|
|
5769
|
+
var import_jsx_runtime42 = require("react/jsx-runtime");
|
|
5576
5770
|
var variantWrap = {
|
|
5577
5771
|
default: "",
|
|
5578
5772
|
card: "rounded-xl glass shadow-lg overflow-hidden",
|
|
@@ -5604,9 +5798,9 @@ function SectionBlock({
|
|
|
5604
5798
|
className,
|
|
5605
5799
|
contentClassName
|
|
5606
5800
|
}) {
|
|
5607
|
-
const [open, setOpen] =
|
|
5608
|
-
return /* @__PURE__ */ (0,
|
|
5609
|
-
(title || description || action) && /* @__PURE__ */ (0,
|
|
5801
|
+
const [open, setOpen] = React34.useState(defaultOpen);
|
|
5802
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: cn(variantWrap[variant], className), children: [
|
|
5803
|
+
(title || description || action) && /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
|
|
5610
5804
|
"div",
|
|
5611
5805
|
{
|
|
5612
5806
|
className: cn(
|
|
@@ -5617,17 +5811,17 @@ function SectionBlock({
|
|
|
5617
5811
|
),
|
|
5618
5812
|
onClick: collapsible ? () => setOpen((o) => !o) : void 0,
|
|
5619
5813
|
children: [
|
|
5620
|
-
/* @__PURE__ */ (0,
|
|
5621
|
-
icon && /* @__PURE__ */ (0,
|
|
5622
|
-
/* @__PURE__ */ (0,
|
|
5623
|
-
title && /* @__PURE__ */ (0,
|
|
5624
|
-
description && /* @__PURE__ */ (0,
|
|
5814
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "flex items-start gap-3 min-w-0", children: [
|
|
5815
|
+
icon && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "mt-0.5 shrink-0 text-primary", children: icon }),
|
|
5816
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "min-w-0", children: [
|
|
5817
|
+
title && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("h3", { className: "text-base font-semibold leading-tight", children: title }),
|
|
5818
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("p", { className: "mt-0.5 text-sm text-muted-foreground", children: description })
|
|
5625
5819
|
] })
|
|
5626
5820
|
] }),
|
|
5627
|
-
/* @__PURE__ */ (0,
|
|
5628
|
-
action && /* @__PURE__ */ (0,
|
|
5629
|
-
collapsible && /* @__PURE__ */ (0,
|
|
5630
|
-
|
|
5821
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "flex shrink-0 items-center gap-2", children: [
|
|
5822
|
+
action && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { onClick: (e) => e.stopPropagation(), children: action }),
|
|
5823
|
+
collapsible && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
5824
|
+
import_lucide_react23.ChevronDown,
|
|
5631
5825
|
{
|
|
5632
5826
|
className: cn(
|
|
5633
5827
|
"h-4 w-4 text-muted-foreground transition-transform duration-200",
|
|
@@ -5639,17 +5833,17 @@ function SectionBlock({
|
|
|
5639
5833
|
]
|
|
5640
5834
|
}
|
|
5641
5835
|
),
|
|
5642
|
-
(!collapsible || open) && /* @__PURE__ */ (0,
|
|
5836
|
+
(!collapsible || open) && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: cn(variantBody[variant], contentClassName), children })
|
|
5643
5837
|
] });
|
|
5644
5838
|
}
|
|
5645
5839
|
|
|
5646
5840
|
// src/components/ui/skeleton.tsx
|
|
5647
|
-
var
|
|
5841
|
+
var import_jsx_runtime43 = require("react/jsx-runtime");
|
|
5648
5842
|
function Skeleton({
|
|
5649
5843
|
className,
|
|
5650
5844
|
...props
|
|
5651
5845
|
}) {
|
|
5652
|
-
return /* @__PURE__ */ (0,
|
|
5846
|
+
return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
|
|
5653
5847
|
"div",
|
|
5654
5848
|
{
|
|
5655
5849
|
className: cn("animate-pulse rounded-md bg-white/5 backdrop-blur-sm", className),
|
|
@@ -5659,8 +5853,8 @@ function Skeleton({
|
|
|
5659
5853
|
}
|
|
5660
5854
|
|
|
5661
5855
|
// src/components/ui/slider.tsx
|
|
5662
|
-
var
|
|
5663
|
-
var
|
|
5856
|
+
var React35 = __toESM(require("react"), 1);
|
|
5857
|
+
var import_jsx_runtime44 = require("react/jsx-runtime");
|
|
5664
5858
|
function pct(val, min, max) {
|
|
5665
5859
|
return (val - min) / (max - min) * 100;
|
|
5666
5860
|
}
|
|
@@ -5679,8 +5873,8 @@ function Slider({
|
|
|
5679
5873
|
showValue = false,
|
|
5680
5874
|
className
|
|
5681
5875
|
}) {
|
|
5682
|
-
const [internal, setInternal] =
|
|
5683
|
-
const [hovering, setHovering] =
|
|
5876
|
+
const [internal, setInternal] = React35.useState(defaultValue);
|
|
5877
|
+
const [hovering, setHovering] = React35.useState(false);
|
|
5684
5878
|
const val = controlled ?? internal;
|
|
5685
5879
|
function handleChange(e) {
|
|
5686
5880
|
const v = Number(e.target.value);
|
|
@@ -5688,20 +5882,20 @@ function Slider({
|
|
|
5688
5882
|
onChange?.(v);
|
|
5689
5883
|
}
|
|
5690
5884
|
const p = pct(val, min, max);
|
|
5691
|
-
return /* @__PURE__ */ (0,
|
|
5692
|
-
(label || showValue) && /* @__PURE__ */ (0,
|
|
5693
|
-
label && /* @__PURE__ */ (0,
|
|
5694
|
-
showValue && /* @__PURE__ */ (0,
|
|
5885
|
+
return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: cn("w-full space-y-2", className), children: [
|
|
5886
|
+
(label || showValue) && /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: "flex items-center justify-between text-sm", children: [
|
|
5887
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: "font-medium", children: label }),
|
|
5888
|
+
showValue && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: "text-muted-foreground tabular-nums", children: val })
|
|
5695
5889
|
] }),
|
|
5696
|
-
/* @__PURE__ */ (0,
|
|
5890
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
|
|
5697
5891
|
"div",
|
|
5698
5892
|
{
|
|
5699
5893
|
className: "relative flex items-center h-5",
|
|
5700
5894
|
onMouseEnter: () => setHovering(true),
|
|
5701
5895
|
onMouseLeave: () => setHovering(false),
|
|
5702
5896
|
children: [
|
|
5703
|
-
/* @__PURE__ */ (0,
|
|
5704
|
-
showTooltip && hovering && !disabled && /* @__PURE__ */ (0,
|
|
5897
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: "absolute w-full h-1.5 rounded-full bg-muted overflow-hidden", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: "h-full rounded-full bg-primary", style: { width: `${p}%` } }) }),
|
|
5898
|
+
showTooltip && hovering && !disabled && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
|
|
5705
5899
|
"div",
|
|
5706
5900
|
{
|
|
5707
5901
|
className: "absolute -top-8 -translate-x-1/2 bg-foreground text-background text-xs font-medium px-2 py-0.5 rounded-md pointer-events-none",
|
|
@@ -5709,7 +5903,7 @@ function Slider({
|
|
|
5709
5903
|
children: val
|
|
5710
5904
|
}
|
|
5711
5905
|
),
|
|
5712
|
-
/* @__PURE__ */ (0,
|
|
5906
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
|
|
5713
5907
|
"input",
|
|
5714
5908
|
{
|
|
5715
5909
|
type: "range",
|
|
@@ -5725,7 +5919,7 @@ function Slider({
|
|
|
5725
5919
|
)
|
|
5726
5920
|
}
|
|
5727
5921
|
),
|
|
5728
|
-
/* @__PURE__ */ (0,
|
|
5922
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
|
|
5729
5923
|
"div",
|
|
5730
5924
|
{
|
|
5731
5925
|
className: cn(
|
|
@@ -5738,9 +5932,9 @@ function Slider({
|
|
|
5738
5932
|
]
|
|
5739
5933
|
}
|
|
5740
5934
|
),
|
|
5741
|
-
(showMarks || marks) && /* @__PURE__ */ (0,
|
|
5742
|
-
/* @__PURE__ */ (0,
|
|
5743
|
-
m.label && /* @__PURE__ */ (0,
|
|
5935
|
+
(showMarks || marks) && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: "relative w-full flex justify-between px-0", children: (marks ?? [{ value: min }, { value: max }]).map((m) => /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: "flex flex-col items-center gap-0.5", style: { position: "absolute", left: `${pct(m.value, min, max)}%`, transform: "translateX(-50%)" }, children: [
|
|
5936
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: "h-1 w-0.5 bg-border" }),
|
|
5937
|
+
m.label && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: "text-[10px] text-muted-foreground", children: m.label })
|
|
5744
5938
|
] }, m.value)) })
|
|
5745
5939
|
] });
|
|
5746
5940
|
}
|
|
@@ -5757,8 +5951,8 @@ function RangeSlider({
|
|
|
5757
5951
|
showValue = false,
|
|
5758
5952
|
className
|
|
5759
5953
|
}) {
|
|
5760
|
-
const [internal, setInternal] =
|
|
5761
|
-
const [active, setActive] =
|
|
5954
|
+
const [internal, setInternal] = React35.useState(defaultValue);
|
|
5955
|
+
const [active, setActive] = React35.useState(null);
|
|
5762
5956
|
const val = controlled ?? internal;
|
|
5763
5957
|
function handleChange(idx, e) {
|
|
5764
5958
|
const v = Number(e.target.value);
|
|
@@ -5768,21 +5962,21 @@ function RangeSlider({
|
|
|
5768
5962
|
}
|
|
5769
5963
|
const p0 = pct(val[0], min, max);
|
|
5770
5964
|
const p1 = pct(val[1], min, max);
|
|
5771
|
-
return /* @__PURE__ */ (0,
|
|
5772
|
-
(label || showValue) && /* @__PURE__ */ (0,
|
|
5773
|
-
label && /* @__PURE__ */ (0,
|
|
5774
|
-
showValue && /* @__PURE__ */ (0,
|
|
5965
|
+
return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: cn("w-full space-y-2", className), children: [
|
|
5966
|
+
(label || showValue) && /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: "flex items-center justify-between text-sm", children: [
|
|
5967
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: "font-medium", children: label }),
|
|
5968
|
+
showValue && /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("span", { className: "text-muted-foreground tabular-nums", children: [
|
|
5775
5969
|
val[0],
|
|
5776
5970
|
" \u2013 ",
|
|
5777
5971
|
val[1]
|
|
5778
5972
|
] })
|
|
5779
5973
|
] }),
|
|
5780
|
-
/* @__PURE__ */ (0,
|
|
5781
|
-
/* @__PURE__ */ (0,
|
|
5974
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: "relative flex items-center h-5", children: [
|
|
5975
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: "absolute w-full h-1.5 rounded-full bg-muted", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: "absolute h-full rounded-full bg-primary", style: { left: `${p0}%`, width: `${p1 - p0}%` } }) }),
|
|
5782
5976
|
[0, 1].map((idx) => {
|
|
5783
5977
|
const p = idx === 0 ? p0 : p1;
|
|
5784
|
-
return /* @__PURE__ */ (0,
|
|
5785
|
-
showTooltip && active === idx && !disabled && /* @__PURE__ */ (0,
|
|
5978
|
+
return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(React35.Fragment, { children: [
|
|
5979
|
+
showTooltip && active === idx && !disabled && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
|
|
5786
5980
|
"div",
|
|
5787
5981
|
{
|
|
5788
5982
|
className: "absolute -top-8 -translate-x-1/2 bg-foreground text-background text-xs font-medium px-2 py-0.5 rounded-md pointer-events-none z-10",
|
|
@@ -5790,7 +5984,7 @@ function RangeSlider({
|
|
|
5790
5984
|
children: val[idx]
|
|
5791
5985
|
}
|
|
5792
5986
|
),
|
|
5793
|
-
/* @__PURE__ */ (0,
|
|
5987
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
|
|
5794
5988
|
"input",
|
|
5795
5989
|
{
|
|
5796
5990
|
type: "range",
|
|
@@ -5806,7 +6000,7 @@ function RangeSlider({
|
|
|
5806
6000
|
style: { zIndex: idx === 1 ? 2 : 1 }
|
|
5807
6001
|
}
|
|
5808
6002
|
),
|
|
5809
|
-
/* @__PURE__ */ (0,
|
|
6003
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
|
|
5810
6004
|
"div",
|
|
5811
6005
|
{
|
|
5812
6006
|
className: "absolute h-4 w-4 rounded-full border-2 border-primary bg-background shadow-md pointer-events-none",
|
|
@@ -5820,8 +6014,8 @@ function RangeSlider({
|
|
|
5820
6014
|
}
|
|
5821
6015
|
|
|
5822
6016
|
// src/components/ui/stat-card.tsx
|
|
5823
|
-
var
|
|
5824
|
-
var
|
|
6017
|
+
var import_lucide_react24 = require("lucide-react");
|
|
6018
|
+
var import_jsx_runtime45 = require("react/jsx-runtime");
|
|
5825
6019
|
function Sparkline2({ data, trend }) {
|
|
5826
6020
|
if (data.length < 2) return null;
|
|
5827
6021
|
const min = Math.min(...data);
|
|
@@ -5835,7 +6029,7 @@ function Sparkline2({ data, trend }) {
|
|
|
5835
6029
|
return `${x},${y}`;
|
|
5836
6030
|
}).join(" ");
|
|
5837
6031
|
const color = trend === "up" ? "stroke-success" : trend === "down" ? "stroke-danger" : "stroke-primary";
|
|
5838
|
-
return /* @__PURE__ */ (0,
|
|
6032
|
+
return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("svg", { width: w, height: h, className: "overflow-visible", children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
|
|
5839
6033
|
"polyline",
|
|
5840
6034
|
{
|
|
5841
6035
|
points: pts,
|
|
@@ -5860,41 +6054,41 @@ function StatCard({
|
|
|
5860
6054
|
className
|
|
5861
6055
|
}) {
|
|
5862
6056
|
const autoTrend = trend ?? (change === void 0 ? "neutral" : change > 0 ? "up" : change < 0 ? "down" : "neutral");
|
|
5863
|
-
const TrendIcon = autoTrend === "up" ?
|
|
6057
|
+
const TrendIcon = autoTrend === "up" ? import_lucide_react24.TrendingUp : autoTrend === "down" ? import_lucide_react24.TrendingDown : import_lucide_react24.Minus;
|
|
5864
6058
|
const trendColor = autoTrend === "up" ? "text-success" : autoTrend === "down" ? "text-danger" : "text-muted-foreground";
|
|
5865
6059
|
if (loading) {
|
|
5866
|
-
return /* @__PURE__ */ (0,
|
|
5867
|
-
/* @__PURE__ */ (0,
|
|
5868
|
-
/* @__PURE__ */ (0,
|
|
5869
|
-
/* @__PURE__ */ (0,
|
|
6060
|
+
return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: cn("rounded-xl glass p-5 space-y-3 animate-pulse", className), children: [
|
|
6061
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: "h-3 w-24 rounded bg-muted" }),
|
|
6062
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: "h-7 w-32 rounded bg-muted" }),
|
|
6063
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: "h-3 w-16 rounded bg-muted" })
|
|
5870
6064
|
] });
|
|
5871
6065
|
}
|
|
5872
|
-
return /* @__PURE__ */ (0,
|
|
5873
|
-
/* @__PURE__ */ (0,
|
|
5874
|
-
/* @__PURE__ */ (0,
|
|
5875
|
-
icon && /* @__PURE__ */ (0,
|
|
6066
|
+
return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: cn("rounded-xl glass p-5 space-y-3", className), children: [
|
|
6067
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: "flex items-start justify-between gap-2", children: [
|
|
6068
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsx)("p", { className: "text-sm text-muted-foreground font-medium", children: title }),
|
|
6069
|
+
icon && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("span", { className: "flex h-9 w-9 items-center justify-center rounded-lg bg-primary/10 text-primary shrink-0", children: icon })
|
|
5876
6070
|
] }),
|
|
5877
|
-
/* @__PURE__ */ (0,
|
|
5878
|
-
/* @__PURE__ */ (0,
|
|
5879
|
-
sparkline && /* @__PURE__ */ (0,
|
|
6071
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: "flex items-end justify-between gap-2", children: [
|
|
6072
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsx)("p", { className: "text-3xl font-bold tracking-tight", children: value }),
|
|
6073
|
+
sparkline && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(Sparkline2, { data: sparkline, trend: autoTrend })
|
|
5880
6074
|
] }),
|
|
5881
|
-
/* @__PURE__ */ (0,
|
|
5882
|
-
change !== void 0 && /* @__PURE__ */ (0,
|
|
5883
|
-
/* @__PURE__ */ (0,
|
|
6075
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: "flex items-center gap-1.5", children: [
|
|
6076
|
+
change !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("span", { className: cn("flex items-center gap-0.5 text-xs font-semibold", trendColor), children: [
|
|
6077
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsx)(TrendIcon, { className: "h-3.5 w-3.5" }),
|
|
5884
6078
|
change > 0 ? "+" : "",
|
|
5885
6079
|
change,
|
|
5886
6080
|
"%"
|
|
5887
6081
|
] }),
|
|
5888
|
-
changeLabel && /* @__PURE__ */ (0,
|
|
5889
|
-
description && !changeLabel && /* @__PURE__ */ (0,
|
|
6082
|
+
changeLabel && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("span", { className: "text-xs text-muted-foreground", children: changeLabel }),
|
|
6083
|
+
description && !changeLabel && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("span", { className: "text-xs text-muted-foreground", children: description })
|
|
5890
6084
|
] })
|
|
5891
6085
|
] });
|
|
5892
6086
|
}
|
|
5893
6087
|
|
|
5894
6088
|
// src/components/ui/stepper.tsx
|
|
5895
|
-
var
|
|
5896
|
-
var
|
|
5897
|
-
var
|
|
6089
|
+
var React36 = __toESM(require("react"), 1);
|
|
6090
|
+
var import_lucide_react25 = require("lucide-react");
|
|
6091
|
+
var import_jsx_runtime46 = require("react/jsx-runtime");
|
|
5898
6092
|
function getStatus(idx, current) {
|
|
5899
6093
|
if (idx < current) return "complete";
|
|
5900
6094
|
if (idx === current) return "current";
|
|
@@ -5915,7 +6109,7 @@ function Stepper({
|
|
|
5915
6109
|
clickable = false,
|
|
5916
6110
|
className
|
|
5917
6111
|
}) {
|
|
5918
|
-
const [internal, setInternal] =
|
|
6112
|
+
const [internal, setInternal] = React36.useState(defaultCurrent);
|
|
5919
6113
|
const current = controlled ?? internal;
|
|
5920
6114
|
function go(idx) {
|
|
5921
6115
|
if (!clickable) return;
|
|
@@ -5923,20 +6117,20 @@ function Stepper({
|
|
|
5923
6117
|
onChange?.(idx);
|
|
5924
6118
|
}
|
|
5925
6119
|
const isHorizontal = orientation === "horizontal";
|
|
5926
|
-
return /* @__PURE__ */ (0,
|
|
5927
|
-
/* @__PURE__ */ (0,
|
|
6120
|
+
return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: cn("w-full", className), children: [
|
|
6121
|
+
/* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: cn(
|
|
5928
6122
|
"flex",
|
|
5929
6123
|
isHorizontal ? "flex-row items-start" : "flex-col gap-0"
|
|
5930
6124
|
), children: steps.map((step, i) => {
|
|
5931
6125
|
const status = getStatus(i, current);
|
|
5932
6126
|
const isLast = i === steps.length - 1;
|
|
5933
|
-
return /* @__PURE__ */ (0,
|
|
6127
|
+
return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(React36.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: cn(
|
|
5934
6128
|
"flex",
|
|
5935
6129
|
isHorizontal ? "flex-col items-center flex-1" : "flex-row gap-4"
|
|
5936
6130
|
), children: [
|
|
5937
|
-
/* @__PURE__ */ (0,
|
|
5938
|
-
isHorizontal && i > 0 && /* @__PURE__ */ (0,
|
|
5939
|
-
/* @__PURE__ */ (0,
|
|
6131
|
+
/* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: cn("flex items-center", isHorizontal ? "w-full" : "flex-col"), children: [
|
|
6132
|
+
isHorizontal && i > 0 && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: cn("flex-1 h-0.5 transition-colors", i <= current ? "bg-primary" : "bg-border") }),
|
|
6133
|
+
/* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
|
|
5940
6134
|
"button",
|
|
5941
6135
|
{
|
|
5942
6136
|
type: "button",
|
|
@@ -5948,35 +6142,35 @@ function Stepper({
|
|
|
5948
6142
|
clickable && "cursor-pointer hover:scale-110",
|
|
5949
6143
|
!clickable && "cursor-default"
|
|
5950
6144
|
),
|
|
5951
|
-
children: status === "complete" ? /* @__PURE__ */ (0,
|
|
6145
|
+
children: status === "complete" ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_lucide_react25.Check, { className: "h-4 w-4" }) : status === "error" ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_lucide_react25.X, { className: "h-4 w-4" }) : step.icon ?? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { children: i + 1 })
|
|
5952
6146
|
}
|
|
5953
6147
|
),
|
|
5954
|
-
isHorizontal && !isLast && /* @__PURE__ */ (0,
|
|
5955
|
-
!isHorizontal && !isLast && /* @__PURE__ */ (0,
|
|
6148
|
+
isHorizontal && !isLast && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: cn("flex-1 h-0.5 transition-colors", i < current ? "bg-primary" : "bg-border") }),
|
|
6149
|
+
!isHorizontal && !isLast && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: cn("w-0.5 flex-1 min-h-8 transition-colors mt-1", i < current ? "bg-primary" : "bg-border") })
|
|
5956
6150
|
] }),
|
|
5957
|
-
/* @__PURE__ */ (0,
|
|
6151
|
+
/* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: cn(
|
|
5958
6152
|
isHorizontal ? "mt-2 text-center px-1" : "pb-6 min-w-0"
|
|
5959
6153
|
), children: [
|
|
5960
|
-
/* @__PURE__ */ (0,
|
|
6154
|
+
/* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("p", { className: cn(
|
|
5961
6155
|
"text-sm font-medium leading-tight",
|
|
5962
6156
|
status === "current" ? "text-primary" : status === "complete" ? "text-foreground" : "text-muted-foreground"
|
|
5963
6157
|
), children: [
|
|
5964
6158
|
step.label,
|
|
5965
|
-
step.optional && /* @__PURE__ */ (0,
|
|
6159
|
+
step.optional && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { className: "ml-1 text-xs text-muted-foreground", children: "(optional)" })
|
|
5966
6160
|
] }),
|
|
5967
|
-
step.description && /* @__PURE__ */ (0,
|
|
5968
|
-
!isHorizontal && step.content && i === current && /* @__PURE__ */ (0,
|
|
6161
|
+
step.description && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("p", { className: "text-xs text-muted-foreground mt-0.5", children: step.description }),
|
|
6162
|
+
!isHorizontal && step.content && i === current && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: "mt-3", children: step.content })
|
|
5969
6163
|
] })
|
|
5970
6164
|
] }) }, i);
|
|
5971
6165
|
}) }),
|
|
5972
|
-
isHorizontal && steps[current]?.content && /* @__PURE__ */ (0,
|
|
6166
|
+
isHorizontal && steps[current]?.content && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: "mt-6", children: steps[current].content })
|
|
5973
6167
|
] });
|
|
5974
6168
|
}
|
|
5975
6169
|
|
|
5976
6170
|
// src/components/ui/table.tsx
|
|
5977
|
-
var
|
|
5978
|
-
var
|
|
5979
|
-
var
|
|
6171
|
+
var React37 = __toESM(require("react"), 1);
|
|
6172
|
+
var import_lucide_react26 = require("lucide-react");
|
|
6173
|
+
var import_jsx_runtime47 = require("react/jsx-runtime");
|
|
5980
6174
|
var BADGE_COLORS = {
|
|
5981
6175
|
active: "bg-success/10 text-success border-success/20",
|
|
5982
6176
|
inactive: "bg-muted text-muted-foreground border-border",
|
|
@@ -5999,11 +6193,11 @@ function Table({
|
|
|
5999
6193
|
idKey = "id",
|
|
6000
6194
|
className
|
|
6001
6195
|
}) {
|
|
6002
|
-
const [search, setSearch] =
|
|
6003
|
-
const [currentPage, setCurrentPage] =
|
|
6004
|
-
const [selectedIds, setSelectedIds] =
|
|
6005
|
-
const [sortKey, setSortKey] =
|
|
6006
|
-
const [sortDir, setSortDir] =
|
|
6196
|
+
const [search, setSearch] = React37.useState("");
|
|
6197
|
+
const [currentPage, setCurrentPage] = React37.useState(1);
|
|
6198
|
+
const [selectedIds, setSelectedIds] = React37.useState([]);
|
|
6199
|
+
const [sortKey, setSortKey] = React37.useState(null);
|
|
6200
|
+
const [sortDir, setSortDir] = React37.useState(null);
|
|
6007
6201
|
const handleSort = (key) => {
|
|
6008
6202
|
if (sortKey !== key) {
|
|
6009
6203
|
setSortKey(key);
|
|
@@ -6017,7 +6211,7 @@ function Table({
|
|
|
6017
6211
|
setSortKey(null);
|
|
6018
6212
|
setSortDir(null);
|
|
6019
6213
|
};
|
|
6020
|
-
const filteredData =
|
|
6214
|
+
const filteredData = React37.useMemo(() => {
|
|
6021
6215
|
let d = search ? data.filter(
|
|
6022
6216
|
(item) => Object.values(item).some(
|
|
6023
6217
|
(val) => val && typeof val === "string" && val.toLowerCase().includes(search.toLowerCase())
|
|
@@ -6035,18 +6229,18 @@ function Table({
|
|
|
6035
6229
|
}, [data, search, sortKey, sortDir]);
|
|
6036
6230
|
const totalPages = Math.max(1, Math.ceil(filteredData.length / itemsPerPage));
|
|
6037
6231
|
const safePage = Math.min(currentPage, totalPages);
|
|
6038
|
-
const paginatedData =
|
|
6232
|
+
const paginatedData = React37.useMemo(() => {
|
|
6039
6233
|
if (!pagination) return filteredData;
|
|
6040
6234
|
const start = (safePage - 1) * itemsPerPage;
|
|
6041
6235
|
return filteredData.slice(start, start + itemsPerPage);
|
|
6042
6236
|
}, [filteredData, pagination, safePage, itemsPerPage]);
|
|
6043
|
-
|
|
6237
|
+
React37.useEffect(() => {
|
|
6044
6238
|
setCurrentPage(1);
|
|
6045
6239
|
}, [search]);
|
|
6046
6240
|
const handleSelectAll = (checked) => setSelectedIds(checked ? paginatedData.map((item) => String(item[idKey])) : []);
|
|
6047
6241
|
const handleSelect = (id, checked) => setSelectedIds((prev) => checked ? [...prev, id] : prev.filter((i) => i !== id));
|
|
6048
6242
|
const allSelected = paginatedData.length > 0 && selectedIds.length === paginatedData.length;
|
|
6049
|
-
const pagePills =
|
|
6243
|
+
const pagePills = React37.useMemo(() => {
|
|
6050
6244
|
if (totalPages <= 5) return Array.from({ length: totalPages }, (_, i) => i + 1);
|
|
6051
6245
|
if (safePage <= 3) return [1, 2, 3, 4, 5];
|
|
6052
6246
|
if (safePage >= totalPages - 2) return [totalPages - 4, totalPages - 3, totalPages - 2, totalPages - 1, totalPages];
|
|
@@ -6054,14 +6248,14 @@ function Table({
|
|
|
6054
6248
|
}, [totalPages, safePage]);
|
|
6055
6249
|
const SortIcon = ({ col }) => {
|
|
6056
6250
|
if (!col.sortable) return null;
|
|
6057
|
-
if (sortKey !== String(col.key)) return /* @__PURE__ */ (0,
|
|
6058
|
-
return sortDir === "asc" ? /* @__PURE__ */ (0,
|
|
6251
|
+
if (sortKey !== String(col.key)) return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_lucide_react26.ChevronsUpDown, { className: "ml-1.5 h-3.5 w-3.5 opacity-40" });
|
|
6252
|
+
return sortDir === "asc" ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_lucide_react26.ChevronUp, { className: "ml-1.5 h-3.5 w-3.5 text-primary" }) : /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_lucide_react26.ChevronDown, { className: "ml-1.5 h-3.5 w-3.5 text-primary" });
|
|
6059
6253
|
};
|
|
6060
|
-
return /* @__PURE__ */ (0,
|
|
6061
|
-
/* @__PURE__ */ (0,
|
|
6062
|
-
searchable && /* @__PURE__ */ (0,
|
|
6063
|
-
/* @__PURE__ */ (0,
|
|
6064
|
-
/* @__PURE__ */ (0,
|
|
6254
|
+
return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: cn("w-full space-y-3", className), children: [
|
|
6255
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "flex items-center justify-between gap-3 flex-wrap", children: [
|
|
6256
|
+
searchable && /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "relative w-72", children: [
|
|
6257
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_lucide_react26.Search, { className: "absolute text-primary left-3 top-1/2 -translate-y-1/2 h-4 w-4 z-10" }),
|
|
6258
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
|
|
6065
6259
|
"input",
|
|
6066
6260
|
{
|
|
6067
6261
|
placeholder: searchPlaceholder,
|
|
@@ -6070,17 +6264,17 @@ function Table({
|
|
|
6070
6264
|
className: "h-9 w-full rounded-xl border border-border bg-background/50 backdrop-blur-sm pl-9 pr-8 text-sm placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 transition-colors hover:bg-background/80"
|
|
6071
6265
|
}
|
|
6072
6266
|
),
|
|
6073
|
-
search && /* @__PURE__ */ (0,
|
|
6267
|
+
search && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
|
|
6074
6268
|
"button",
|
|
6075
6269
|
{
|
|
6076
6270
|
onClick: () => setSearch(""),
|
|
6077
6271
|
className: "absolute right-2.5 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground transition-colors",
|
|
6078
|
-
children: /* @__PURE__ */ (0,
|
|
6272
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_lucide_react26.X, { className: "h-3.5 w-3.5" })
|
|
6079
6273
|
}
|
|
6080
6274
|
)
|
|
6081
6275
|
] }),
|
|
6082
|
-
/* @__PURE__ */ (0,
|
|
6083
|
-
selectable && onBulkDelete && selectedIds.length > 0 && /* @__PURE__ */ (0,
|
|
6276
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "flex items-center gap-2 ml-auto", children: [
|
|
6277
|
+
selectable && onBulkDelete && selectedIds.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(
|
|
6084
6278
|
"button",
|
|
6085
6279
|
{
|
|
6086
6280
|
onClick: () => {
|
|
@@ -6089,14 +6283,14 @@ function Table({
|
|
|
6089
6283
|
},
|
|
6090
6284
|
className: "inline-flex items-center gap-1.5 rounded-lg bg-danger/10 border border-danger/20 px-3 py-1.5 text-xs font-medium text-danger hover:bg-danger/20 transition-colors",
|
|
6091
6285
|
children: [
|
|
6092
|
-
/* @__PURE__ */ (0,
|
|
6286
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_lucide_react26.Trash2, { className: "h-3.5 w-3.5" }),
|
|
6093
6287
|
"Delete ",
|
|
6094
6288
|
selectedIds.length,
|
|
6095
6289
|
" selected"
|
|
6096
6290
|
]
|
|
6097
6291
|
}
|
|
6098
6292
|
),
|
|
6099
|
-
/* @__PURE__ */ (0,
|
|
6293
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("span", { className: "text-xs text-muted-foreground", children: [
|
|
6100
6294
|
filteredData.length,
|
|
6101
6295
|
" ",
|
|
6102
6296
|
filteredData.length === 1 ? "row" : "rows",
|
|
@@ -6104,16 +6298,16 @@ function Table({
|
|
|
6104
6298
|
] })
|
|
6105
6299
|
] })
|
|
6106
6300
|
] }),
|
|
6107
|
-
/* @__PURE__ */ (0,
|
|
6108
|
-
/* @__PURE__ */ (0,
|
|
6109
|
-
selectable && /* @__PURE__ */ (0,
|
|
6301
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: "rounded-xl border border-border overflow-hidden bg-card/50 backdrop-blur-sm shadow-sm", children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: "w-full overflow-auto", children: /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("table", { className: "w-full caption-bottom text-sm", children: [
|
|
6302
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("tr", { className: "border-b border-border bg-muted/40", children: [
|
|
6303
|
+
selectable && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("th", { className: "h-11 w-[46px] px-4 text-left align-middle", children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
|
|
6110
6304
|
Checkbox,
|
|
6111
6305
|
{
|
|
6112
6306
|
checked: allSelected,
|
|
6113
6307
|
onChange: (e) => handleSelectAll(e.target.checked)
|
|
6114
6308
|
}
|
|
6115
6309
|
) }),
|
|
6116
|
-
columns.map((col) => /* @__PURE__ */ (0,
|
|
6310
|
+
columns.map((col) => /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
|
|
6117
6311
|
"th",
|
|
6118
6312
|
{
|
|
6119
6313
|
onClick: () => col.sortable && handleSort(String(col.key)),
|
|
@@ -6121,29 +6315,29 @@ function Table({
|
|
|
6121
6315
|
"h-11 px-4 text-left align-middle text-xs font-semibold uppercase tracking-wider text-muted-foreground select-none whitespace-nowrap",
|
|
6122
6316
|
col.sortable && "cursor-pointer hover:text-foreground transition-colors"
|
|
6123
6317
|
),
|
|
6124
|
-
children: /* @__PURE__ */ (0,
|
|
6318
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("span", { className: "inline-flex items-center", children: [
|
|
6125
6319
|
col.title,
|
|
6126
|
-
/* @__PURE__ */ (0,
|
|
6320
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsx)(SortIcon, { col })
|
|
6127
6321
|
] })
|
|
6128
6322
|
},
|
|
6129
6323
|
String(col.key)
|
|
6130
6324
|
))
|
|
6131
6325
|
] }) }),
|
|
6132
|
-
/* @__PURE__ */ (0,
|
|
6326
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsx)("tbody", { children: paginatedData.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
|
|
6133
6327
|
"td",
|
|
6134
6328
|
{
|
|
6135
6329
|
colSpan: columns.length + (selectable ? 1 : 0),
|
|
6136
6330
|
className: "h-32 text-center align-middle",
|
|
6137
|
-
children: /* @__PURE__ */ (0,
|
|
6138
|
-
/* @__PURE__ */ (0,
|
|
6139
|
-
/* @__PURE__ */ (0,
|
|
6140
|
-
search && /* @__PURE__ */ (0,
|
|
6331
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "flex flex-col items-center gap-1 text-muted-foreground", children: [
|
|
6332
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_lucide_react26.Search, { className: "h-8 w-8 opacity-20" }),
|
|
6333
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { className: "text-sm", children: "No results found" }),
|
|
6334
|
+
search && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("button", { onClick: () => setSearch(""), className: "text-xs text-primary hover:underline", children: "Clear search" })
|
|
6141
6335
|
] })
|
|
6142
6336
|
}
|
|
6143
6337
|
) }) : paginatedData.map((item, i) => {
|
|
6144
6338
|
const id = String(item[idKey] || i);
|
|
6145
6339
|
const isSelected = selectedIds.includes(id);
|
|
6146
|
-
return /* @__PURE__ */ (0,
|
|
6340
|
+
return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(
|
|
6147
6341
|
"tr",
|
|
6148
6342
|
{
|
|
6149
6343
|
className: cn(
|
|
@@ -6151,38 +6345,38 @@ function Table({
|
|
|
6151
6345
|
isSelected ? "bg-primary/5 hover:bg-primary/8" : "hover:bg-muted/30"
|
|
6152
6346
|
),
|
|
6153
6347
|
children: [
|
|
6154
|
-
selectable && /* @__PURE__ */ (0,
|
|
6348
|
+
selectable && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("td", { className: "px-4 py-3 align-middle", children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
|
|
6155
6349
|
Checkbox,
|
|
6156
6350
|
{
|
|
6157
6351
|
checked: isSelected,
|
|
6158
6352
|
onChange: (e) => handleSelect(id, e.target.checked)
|
|
6159
6353
|
}
|
|
6160
6354
|
) }),
|
|
6161
|
-
columns.map((col) => /* @__PURE__ */ (0,
|
|
6355
|
+
columns.map((col) => /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("td", { className: "px-4 py-3 align-middle", children: col.render ? col.render(item) : col.type === "image" ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
|
|
6162
6356
|
"img",
|
|
6163
6357
|
{
|
|
6164
6358
|
src: item[col.key],
|
|
6165
6359
|
alt: item[col.key],
|
|
6166
6360
|
className: "h-9 w-9 rounded-lg object-cover ring-1 ring-border"
|
|
6167
6361
|
}
|
|
6168
|
-
) : col.type === "badge" ? /* @__PURE__ */ (0,
|
|
6362
|
+
) : col.type === "badge" ? /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("span", { className: cn(
|
|
6169
6363
|
"inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-medium",
|
|
6170
6364
|
badgeClass(String(item[col.key]))
|
|
6171
6365
|
), children: [
|
|
6172
|
-
/* @__PURE__ */ (0,
|
|
6366
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { className: cn(
|
|
6173
6367
|
"mr-1.5 h-1.5 w-1.5 rounded-full",
|
|
6174
6368
|
badgeClass(String(item[col.key])).includes("success") ? "bg-success" : badgeClass(String(item[col.key])).includes("warning") ? "bg-warning" : badgeClass(String(item[col.key])).includes("danger") ? "bg-danger" : badgeClass(String(item[col.key])).includes("info") ? "bg-info" : "bg-primary"
|
|
6175
6369
|
) }),
|
|
6176
6370
|
item[col.key]
|
|
6177
|
-
] }) : col.type === "stack" ? /* @__PURE__ */ (0,
|
|
6371
|
+
] }) : col.type === "stack" ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(AvatarStack, { images: Array.isArray(item[col.key]) ? item[col.key] : [], ...col.stackProps ?? {} }) : col.type === "icon" ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { className: "flex items-center", children: item[col.key] }) : col.type === "select" ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
|
|
6178
6372
|
"select",
|
|
6179
6373
|
{
|
|
6180
6374
|
value: item[col.key],
|
|
6181
6375
|
onChange: (e) => col.onChange?.(item, e.target.value),
|
|
6182
6376
|
className: "h-8 rounded-lg border border-border bg-background/50 px-2 text-xs text-foreground focus:outline-none focus:ring-2 focus:ring-ring transition-colors",
|
|
6183
|
-
children: (col.selectOptions ?? []).map((opt) => /* @__PURE__ */ (0,
|
|
6377
|
+
children: (col.selectOptions ?? []).map((opt) => /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("option", { value: opt, children: opt }, opt))
|
|
6184
6378
|
}
|
|
6185
|
-
) : col.type === "toggle" ? /* @__PURE__ */ (0,
|
|
6379
|
+
) : col.type === "toggle" ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
|
|
6186
6380
|
"button",
|
|
6187
6381
|
{
|
|
6188
6382
|
role: "switch",
|
|
@@ -6192,13 +6386,13 @@ function Table({
|
|
|
6192
6386
|
"relative inline-flex h-5 w-9 shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
|
|
6193
6387
|
item[col.key] ? "bg-primary" : "bg-muted"
|
|
6194
6388
|
),
|
|
6195
|
-
children: /* @__PURE__ */ (0,
|
|
6389
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { className: cn(
|
|
6196
6390
|
"pointer-events-none inline-block h-4 w-4 rounded-full bg-white shadow-sm transition-transform",
|
|
6197
6391
|
item[col.key] ? "translate-x-4" : "translate-x-0"
|
|
6198
6392
|
) })
|
|
6199
6393
|
}
|
|
6200
|
-
) : col.type === "color" ? /* @__PURE__ */ (0,
|
|
6201
|
-
/* @__PURE__ */ (0,
|
|
6394
|
+
) : col.type === "color" ? /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "flex items-center gap-2", children: [
|
|
6395
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
|
|
6202
6396
|
"input",
|
|
6203
6397
|
{
|
|
6204
6398
|
type: "color",
|
|
@@ -6207,22 +6401,22 @@ function Table({
|
|
|
6207
6401
|
className: "h-7 w-7 cursor-pointer rounded border border-border bg-transparent p-0.5"
|
|
6208
6402
|
}
|
|
6209
6403
|
),
|
|
6210
|
-
/* @__PURE__ */ (0,
|
|
6211
|
-
] }) : col.type === "checkbox" ? /* @__PURE__ */ (0,
|
|
6404
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { className: "text-xs text-muted-foreground font-mono", children: item[col.key] })
|
|
6405
|
+
] }) : col.type === "checkbox" ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
|
|
6212
6406
|
Checkbox,
|
|
6213
6407
|
{
|
|
6214
6408
|
checked: !!item[col.key],
|
|
6215
6409
|
onChange: (e) => col.onChange?.(item, e.target.checked)
|
|
6216
6410
|
}
|
|
6217
|
-
) : /* @__PURE__ */ (0,
|
|
6411
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { className: "text-foreground/90", children: item[col.key] }) }, String(col.key)))
|
|
6218
6412
|
]
|
|
6219
6413
|
},
|
|
6220
6414
|
id
|
|
6221
6415
|
);
|
|
6222
6416
|
}) })
|
|
6223
6417
|
] }) }) }),
|
|
6224
|
-
pagination && totalPages > 1 && /* @__PURE__ */ (0,
|
|
6225
|
-
/* @__PURE__ */ (0,
|
|
6418
|
+
pagination && totalPages > 1 && /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "flex items-center justify-between gap-2 flex-wrap", children: [
|
|
6419
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("span", { className: "text-xs text-muted-foreground", children: [
|
|
6226
6420
|
"Showing ",
|
|
6227
6421
|
(safePage - 1) * itemsPerPage + 1,
|
|
6228
6422
|
"\u2013",
|
|
@@ -6230,21 +6424,21 @@ function Table({
|
|
|
6230
6424
|
" of ",
|
|
6231
6425
|
filteredData.length
|
|
6232
6426
|
] }),
|
|
6233
|
-
/* @__PURE__ */ (0,
|
|
6234
|
-
/* @__PURE__ */ (0,
|
|
6427
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "flex items-center gap-1", children: [
|
|
6428
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
|
|
6235
6429
|
"button",
|
|
6236
6430
|
{
|
|
6237
6431
|
onClick: () => setCurrentPage((p) => Math.max(1, p - 1)),
|
|
6238
6432
|
disabled: safePage === 1,
|
|
6239
6433
|
className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
|
|
6240
|
-
children: /* @__PURE__ */ (0,
|
|
6434
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_lucide_react26.ChevronLeft, { className: "h-4 w-4" })
|
|
6241
6435
|
}
|
|
6242
6436
|
),
|
|
6243
|
-
pagePills[0] > 1 && /* @__PURE__ */ (0,
|
|
6244
|
-
/* @__PURE__ */ (0,
|
|
6245
|
-
pagePills[0] > 2 && /* @__PURE__ */ (0,
|
|
6437
|
+
pagePills[0] > 1 && /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_jsx_runtime47.Fragment, { children: [
|
|
6438
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsx)("button", { onClick: () => setCurrentPage(1), className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-xs text-muted-foreground hover:bg-muted transition-colors", children: "1" }),
|
|
6439
|
+
pagePills[0] > 2 && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { className: "px-1 text-muted-foreground text-xs", children: "\u2026" })
|
|
6246
6440
|
] }),
|
|
6247
|
-
pagePills.map((p) => /* @__PURE__ */ (0,
|
|
6441
|
+
pagePills.map((p) => /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
|
|
6248
6442
|
"button",
|
|
6249
6443
|
{
|
|
6250
6444
|
onClick: () => setCurrentPage(p),
|
|
@@ -6256,17 +6450,17 @@ function Table({
|
|
|
6256
6450
|
},
|
|
6257
6451
|
p
|
|
6258
6452
|
)),
|
|
6259
|
-
pagePills[pagePills.length - 1] < totalPages && /* @__PURE__ */ (0,
|
|
6260
|
-
pagePills[pagePills.length - 1] < totalPages - 1 && /* @__PURE__ */ (0,
|
|
6261
|
-
/* @__PURE__ */ (0,
|
|
6453
|
+
pagePills[pagePills.length - 1] < totalPages && /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_jsx_runtime47.Fragment, { children: [
|
|
6454
|
+
pagePills[pagePills.length - 1] < totalPages - 1 && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { className: "px-1 text-muted-foreground text-xs", children: "\u2026" }),
|
|
6455
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsx)("button", { onClick: () => setCurrentPage(totalPages), className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-xs text-muted-foreground hover:bg-muted transition-colors", children: totalPages })
|
|
6262
6456
|
] }),
|
|
6263
|
-
/* @__PURE__ */ (0,
|
|
6457
|
+
/* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
|
|
6264
6458
|
"button",
|
|
6265
6459
|
{
|
|
6266
6460
|
onClick: () => setCurrentPage((p) => Math.min(totalPages, p + 1)),
|
|
6267
6461
|
disabled: safePage === totalPages,
|
|
6268
6462
|
className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
|
|
6269
|
-
children: /* @__PURE__ */ (0,
|
|
6463
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_lucide_react26.ChevronRight, { className: "h-4 w-4" })
|
|
6270
6464
|
}
|
|
6271
6465
|
)
|
|
6272
6466
|
] })
|
|
@@ -6275,8 +6469,8 @@ function Table({
|
|
|
6275
6469
|
}
|
|
6276
6470
|
|
|
6277
6471
|
// src/components/ui/tabs.tsx
|
|
6278
|
-
var
|
|
6279
|
-
var
|
|
6472
|
+
var React38 = __toESM(require("react"), 1);
|
|
6473
|
+
var import_jsx_runtime48 = require("react/jsx-runtime");
|
|
6280
6474
|
var sizeMap = {
|
|
6281
6475
|
sm: "px-3 py-1.5 text-xs",
|
|
6282
6476
|
md: "px-4 py-2 text-sm",
|
|
@@ -6326,15 +6520,15 @@ function Tabs({
|
|
|
6326
6520
|
fullWidth = false,
|
|
6327
6521
|
className
|
|
6328
6522
|
}) {
|
|
6329
|
-
const [internal, setInternal] =
|
|
6523
|
+
const [internal, setInternal] = React38.useState(defaultValue ?? items[0]?.value ?? "");
|
|
6330
6524
|
const active = controlledValue ?? internal;
|
|
6331
6525
|
const select = (v) => {
|
|
6332
6526
|
if (!controlledValue) setInternal(v);
|
|
6333
6527
|
onChange?.(v);
|
|
6334
6528
|
};
|
|
6335
6529
|
const activeItem = items.find((i) => i.value === active);
|
|
6336
|
-
return /* @__PURE__ */ (0,
|
|
6337
|
-
/* @__PURE__ */ (0,
|
|
6530
|
+
return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: cn("w-full", className), children: [
|
|
6531
|
+
/* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: cn("flex", fullWidth && "w-full", variantTrack[variant]), children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(
|
|
6338
6532
|
"button",
|
|
6339
6533
|
{
|
|
6340
6534
|
type: "button",
|
|
@@ -6345,20 +6539,20 @@ function Tabs({
|
|
|
6345
6539
|
fullWidth && "flex-1 justify-center"
|
|
6346
6540
|
),
|
|
6347
6541
|
children: [
|
|
6348
|
-
item.icon && /* @__PURE__ */ (0,
|
|
6542
|
+
item.icon && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("span", { className: "shrink-0", children: item.icon }),
|
|
6349
6543
|
item.label,
|
|
6350
|
-
item.badge && /* @__PURE__ */ (0,
|
|
6544
|
+
item.badge && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("span", { className: "shrink-0", children: item.badge })
|
|
6351
6545
|
]
|
|
6352
6546
|
},
|
|
6353
6547
|
item.value
|
|
6354
6548
|
)) }),
|
|
6355
|
-
activeItem?.content && /* @__PURE__ */ (0,
|
|
6549
|
+
activeItem?.content && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "mt-4", children: activeItem.content })
|
|
6356
6550
|
] });
|
|
6357
6551
|
}
|
|
6358
6552
|
|
|
6359
6553
|
// src/components/ui/tag-input.tsx
|
|
6360
|
-
var
|
|
6361
|
-
var
|
|
6554
|
+
var React39 = __toESM(require("react"), 1);
|
|
6555
|
+
var import_jsx_runtime49 = require("react/jsx-runtime");
|
|
6362
6556
|
function TagInput({
|
|
6363
6557
|
value: controlled,
|
|
6364
6558
|
defaultValue = [],
|
|
@@ -6369,9 +6563,9 @@ function TagInput({
|
|
|
6369
6563
|
disabled = false,
|
|
6370
6564
|
className
|
|
6371
6565
|
}) {
|
|
6372
|
-
const [internal, setInternal] =
|
|
6373
|
-
const [input, setInput] =
|
|
6374
|
-
const inputRef =
|
|
6566
|
+
const [internal, setInternal] = React39.useState(defaultValue);
|
|
6567
|
+
const [input, setInput] = React39.useState("");
|
|
6568
|
+
const inputRef = React39.useRef(null);
|
|
6375
6569
|
const tags = controlled ?? internal;
|
|
6376
6570
|
function addTag(raw) {
|
|
6377
6571
|
const tag = raw.trim();
|
|
@@ -6396,7 +6590,7 @@ function TagInput({
|
|
|
6396
6590
|
removeTag(tags.length - 1);
|
|
6397
6591
|
}
|
|
6398
6592
|
}
|
|
6399
|
-
return /* @__PURE__ */ (0,
|
|
6593
|
+
return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(
|
|
6400
6594
|
"div",
|
|
6401
6595
|
{
|
|
6402
6596
|
className: cn(
|
|
@@ -6407,8 +6601,8 @@ function TagInput({
|
|
|
6407
6601
|
),
|
|
6408
6602
|
onClick: () => inputRef.current?.focus(),
|
|
6409
6603
|
children: [
|
|
6410
|
-
tags.map((tag, i) => /* @__PURE__ */ (0,
|
|
6411
|
-
/* @__PURE__ */ (0,
|
|
6604
|
+
tags.map((tag, i) => /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(Badge, { variant: "default", size: "sm", removable: true, onRemove: () => removeTag(i), children: tag }, i)),
|
|
6605
|
+
/* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
6412
6606
|
"input",
|
|
6413
6607
|
{
|
|
6414
6608
|
ref: inputRef,
|
|
@@ -6427,8 +6621,8 @@ function TagInput({
|
|
|
6427
6621
|
}
|
|
6428
6622
|
|
|
6429
6623
|
// src/components/ui/timeline.tsx
|
|
6430
|
-
var
|
|
6431
|
-
var
|
|
6624
|
+
var import_lucide_react27 = require("lucide-react");
|
|
6625
|
+
var import_jsx_runtime50 = require("react/jsx-runtime");
|
|
6432
6626
|
var DOT_COLOR = {
|
|
6433
6627
|
default: "bg-primary border-primary/30",
|
|
6434
6628
|
success: "bg-success border-success/30",
|
|
@@ -6444,41 +6638,41 @@ var ICON_COLOR = {
|
|
|
6444
6638
|
info: "text-info"
|
|
6445
6639
|
};
|
|
6446
6640
|
var DEFAULT_ICON = {
|
|
6447
|
-
default: /* @__PURE__ */ (0,
|
|
6448
|
-
success: /* @__PURE__ */ (0,
|
|
6449
|
-
error: /* @__PURE__ */ (0,
|
|
6450
|
-
warning: /* @__PURE__ */ (0,
|
|
6451
|
-
info: /* @__PURE__ */ (0,
|
|
6641
|
+
default: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_lucide_react27.Circle, { className: "h-3 w-3" }),
|
|
6642
|
+
success: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_lucide_react27.CheckCircle, { className: "h-3.5 w-3.5" }),
|
|
6643
|
+
error: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_lucide_react27.XCircle, { className: "h-3.5 w-3.5" }),
|
|
6644
|
+
warning: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_lucide_react27.AlertTriangle, { className: "h-3.5 w-3.5" }),
|
|
6645
|
+
info: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_lucide_react27.Info, { className: "h-3.5 w-3.5" })
|
|
6452
6646
|
};
|
|
6453
6647
|
function Timeline({ items, align = "left", className }) {
|
|
6454
|
-
return /* @__PURE__ */ (0,
|
|
6648
|
+
return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: cn("relative", className), children: items.map((item, i) => {
|
|
6455
6649
|
const variant = item.variant ?? "default";
|
|
6456
6650
|
const isLast = i === items.length - 1;
|
|
6457
6651
|
const isRight = align === "alternate" && i % 2 === 1;
|
|
6458
|
-
return /* @__PURE__ */ (0,
|
|
6459
|
-
/* @__PURE__ */ (0,
|
|
6460
|
-
/* @__PURE__ */ (0,
|
|
6652
|
+
return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: cn("relative flex gap-4", align === "alternate" && "justify-center", isRight && "flex-row-reverse"), children: [
|
|
6653
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "flex flex-col items-center", children: [
|
|
6654
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: cn(
|
|
6461
6655
|
"flex h-8 w-8 shrink-0 items-center justify-center rounded-full border-2 z-10",
|
|
6462
6656
|
item.icon ? "bg-background border-border" : DOT_COLOR[variant]
|
|
6463
|
-
), children: /* @__PURE__ */ (0,
|
|
6464
|
-
!isLast && /* @__PURE__ */ (0,
|
|
6657
|
+
), children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: cn("shrink-0", item.icon ? ICON_COLOR[variant] : "text-white"), children: item.icon ?? DEFAULT_ICON[variant] }) }),
|
|
6658
|
+
!isLast && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "w-0.5 flex-1 bg-border mt-1 mb-1 min-h-4" })
|
|
6465
6659
|
] }),
|
|
6466
|
-
/* @__PURE__ */ (0,
|
|
6467
|
-
/* @__PURE__ */ (0,
|
|
6468
|
-
/* @__PURE__ */ (0,
|
|
6469
|
-
item.time && /* @__PURE__ */ (0,
|
|
6660
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: cn("flex-1 pb-6 min-w-0", isRight && "text-right"), children: [
|
|
6661
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: cn("flex items-start justify-between gap-2", isRight && "flex-row-reverse"), children: [
|
|
6662
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)("p", { className: "text-sm font-semibold leading-tight", children: item.title }),
|
|
6663
|
+
item.time && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "shrink-0 text-xs text-muted-foreground whitespace-nowrap", children: item.time })
|
|
6470
6664
|
] }),
|
|
6471
|
-
item.description && /* @__PURE__ */ (0,
|
|
6472
|
-
item.content && /* @__PURE__ */ (0,
|
|
6665
|
+
item.description && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("p", { className: "mt-0.5 text-xs text-muted-foreground leading-snug", children: item.description }),
|
|
6666
|
+
item.content && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "mt-2", children: item.content })
|
|
6473
6667
|
] })
|
|
6474
6668
|
] }, item.id ?? i);
|
|
6475
6669
|
}) });
|
|
6476
6670
|
}
|
|
6477
6671
|
|
|
6478
6672
|
// src/components/ui/toggle-switch.tsx
|
|
6479
|
-
var
|
|
6480
|
-
var
|
|
6481
|
-
var ToggleSwitch =
|
|
6673
|
+
var React40 = __toESM(require("react"), 1);
|
|
6674
|
+
var import_jsx_runtime51 = require("react/jsx-runtime");
|
|
6675
|
+
var ToggleSwitch = React40.forwardRef(
|
|
6482
6676
|
({
|
|
6483
6677
|
className,
|
|
6484
6678
|
inline = false,
|
|
@@ -6496,10 +6690,10 @@ var ToggleSwitch = React38.forwardRef(
|
|
|
6496
6690
|
disabled,
|
|
6497
6691
|
...props
|
|
6498
6692
|
}, ref) => {
|
|
6499
|
-
const toggleId = id ??
|
|
6693
|
+
const toggleId = id ?? React40.useId();
|
|
6500
6694
|
const trackW = width ? typeof width === "number" ? `${width}px` : width : "2.75rem";
|
|
6501
6695
|
const trackH = height ? typeof height === "number" ? `${height}px` : height : "1.5rem";
|
|
6502
|
-
const [internalChecked, setInternalChecked] =
|
|
6696
|
+
const [internalChecked, setInternalChecked] = React40.useState(defaultChecked ?? false);
|
|
6503
6697
|
const isControlled = checked !== void 0;
|
|
6504
6698
|
const isOn = accepted ? true : declined ? false : isControlled ? checked : internalChecked;
|
|
6505
6699
|
const stateColor = accepted ? acceptedColor ?? "#22c55e" : declined ? declinedColor ?? "#ef4444" : isOn ? void 0 : void 0;
|
|
@@ -6508,13 +6702,13 @@ var ToggleSwitch = React38.forwardRef(
|
|
|
6508
6702
|
if (!isControlled) setInternalChecked(e.target.checked);
|
|
6509
6703
|
onChange?.(e);
|
|
6510
6704
|
};
|
|
6511
|
-
const toggle = /* @__PURE__ */ (0,
|
|
6705
|
+
const toggle = /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
|
|
6512
6706
|
"label",
|
|
6513
6707
|
{
|
|
6514
6708
|
htmlFor: toggleId,
|
|
6515
6709
|
className: cn("relative inline-flex items-center cursor-pointer", disabled && "opacity-50 cursor-not-allowed"),
|
|
6516
6710
|
children: [
|
|
6517
|
-
/* @__PURE__ */ (0,
|
|
6711
|
+
/* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
|
|
6518
6712
|
"input",
|
|
6519
6713
|
{
|
|
6520
6714
|
type: "checkbox",
|
|
@@ -6527,7 +6721,7 @@ var ToggleSwitch = React38.forwardRef(
|
|
|
6527
6721
|
...props
|
|
6528
6722
|
}
|
|
6529
6723
|
),
|
|
6530
|
-
/* @__PURE__ */ (0,
|
|
6724
|
+
/* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
|
|
6531
6725
|
"div",
|
|
6532
6726
|
{
|
|
6533
6727
|
className: cn(
|
|
@@ -6540,7 +6734,7 @@ var ToggleSwitch = React38.forwardRef(
|
|
|
6540
6734
|
height: trackH,
|
|
6541
6735
|
...stateColor ? { backgroundColor: stateColor } : {}
|
|
6542
6736
|
},
|
|
6543
|
-
children: /* @__PURE__ */ (0,
|
|
6737
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
|
|
6544
6738
|
"span",
|
|
6545
6739
|
{
|
|
6546
6740
|
className: `absolute top-[1px] ${isOn ? "bg-slate-50/40" : "bg-primary"} rounded-full border border-slate-300/50 shadow transition-transform duration-200`,
|
|
@@ -6558,9 +6752,9 @@ var ToggleSwitch = React38.forwardRef(
|
|
|
6558
6752
|
}
|
|
6559
6753
|
);
|
|
6560
6754
|
if (inline && label) {
|
|
6561
|
-
return /* @__PURE__ */ (0,
|
|
6755
|
+
return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "inline-flex items-center gap-2 select-none", children: [
|
|
6562
6756
|
toggle,
|
|
6563
|
-
/* @__PURE__ */ (0,
|
|
6757
|
+
/* @__PURE__ */ (0, import_jsx_runtime51.jsx)("label", { htmlFor: toggleId, className: cn("text-sm cursor-pointer", disabled && "opacity-50 cursor-not-allowed"), children: label })
|
|
6564
6758
|
] });
|
|
6565
6759
|
}
|
|
6566
6760
|
return toggle;
|
|
@@ -6568,62 +6762,17 @@ var ToggleSwitch = React38.forwardRef(
|
|
|
6568
6762
|
);
|
|
6569
6763
|
ToggleSwitch.displayName = "ToggleSwitch";
|
|
6570
6764
|
|
|
6571
|
-
// src/components/ui/tooltip.tsx
|
|
6572
|
-
var React39 = __toESM(require("react"), 1);
|
|
6573
|
-
var import_jsx_runtime50 = require("react/jsx-runtime");
|
|
6574
|
-
function Tooltip({
|
|
6575
|
-
content,
|
|
6576
|
-
children,
|
|
6577
|
-
side = "right",
|
|
6578
|
-
className,
|
|
6579
|
-
enabled = true
|
|
6580
|
-
}) {
|
|
6581
|
-
const [visible, setVisible] = React39.useState(false);
|
|
6582
|
-
if (!enabled) return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_jsx_runtime50.Fragment, { children });
|
|
6583
|
-
const sideClasses = {
|
|
6584
|
-
right: "left-full top-1/2 -translate-y-1/2 ml-2",
|
|
6585
|
-
left: "right-full top-1/2 -translate-y-1/2 mr-2",
|
|
6586
|
-
top: "bottom-full left-1/2 -translate-x-1/2 mb-2",
|
|
6587
|
-
bottom: "top-full left-1/2 -translate-x-1/2 mt-2"
|
|
6588
|
-
};
|
|
6589
|
-
return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
|
|
6590
|
-
"div",
|
|
6591
|
-
{
|
|
6592
|
-
className: "relative inline-flex",
|
|
6593
|
-
onMouseEnter: () => setVisible(true),
|
|
6594
|
-
onMouseLeave: () => setVisible(false),
|
|
6595
|
-
onFocus: () => setVisible(true),
|
|
6596
|
-
onBlur: () => setVisible(false),
|
|
6597
|
-
children: [
|
|
6598
|
-
children,
|
|
6599
|
-
visible && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
6600
|
-
"div",
|
|
6601
|
-
{
|
|
6602
|
-
role: "tooltip",
|
|
6603
|
-
className: cn(
|
|
6604
|
-
"absolute z-50 whitespace-nowrap rounded-md bg-foreground px-2.5 py-1 text-xs font-medium text-background shadow-lg pointer-events-none",
|
|
6605
|
-
sideClasses[side],
|
|
6606
|
-
className
|
|
6607
|
-
),
|
|
6608
|
-
children: content
|
|
6609
|
-
}
|
|
6610
|
-
)
|
|
6611
|
-
]
|
|
6612
|
-
}
|
|
6613
|
-
);
|
|
6614
|
-
}
|
|
6615
|
-
|
|
6616
6765
|
// src/components/ui/tree-view.tsx
|
|
6617
|
-
var
|
|
6618
|
-
var
|
|
6619
|
-
var
|
|
6766
|
+
var React41 = __toESM(require("react"), 1);
|
|
6767
|
+
var import_lucide_react28 = require("lucide-react");
|
|
6768
|
+
var import_jsx_runtime52 = require("react/jsx-runtime");
|
|
6620
6769
|
function TreeNodeItem({ node, depth, selected, expanded, onToggleExpand, onSelect, multiple }) {
|
|
6621
6770
|
const hasChildren = !!node.children?.length;
|
|
6622
6771
|
const isExpanded = expanded.includes(node.id);
|
|
6623
6772
|
const isSelected = selected.includes(node.id);
|
|
6624
|
-
const defaultIcon = hasChildren ? isExpanded ? /* @__PURE__ */ (0,
|
|
6625
|
-
return /* @__PURE__ */ (0,
|
|
6626
|
-
/* @__PURE__ */ (0,
|
|
6773
|
+
const defaultIcon = hasChildren ? isExpanded ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_lucide_react28.FolderOpen, { className: "h-4 w-4 text-warning" }) : /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_lucide_react28.Folder, { className: "h-4 w-4 text-warning" }) : /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_lucide_react28.File, { className: "h-4 w-4 text-muted-foreground" });
|
|
6774
|
+
return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { children: [
|
|
6775
|
+
/* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
|
|
6627
6776
|
"div",
|
|
6628
6777
|
{
|
|
6629
6778
|
className: cn(
|
|
@@ -6637,13 +6786,13 @@ function TreeNodeItem({ node, depth, selected, expanded, onToggleExpand, onSelec
|
|
|
6637
6786
|
onSelect(node.id);
|
|
6638
6787
|
},
|
|
6639
6788
|
children: [
|
|
6640
|
-
hasChildren ? /* @__PURE__ */ (0,
|
|
6641
|
-
/* @__PURE__ */ (0,
|
|
6642
|
-
/* @__PURE__ */ (0,
|
|
6789
|
+
hasChildren ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_lucide_react28.ChevronRight, { className: cn("h-3.5 w-3.5 shrink-0 text-muted-foreground transition-transform", isExpanded && "rotate-90") }) : /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "w-3.5 shrink-0" }),
|
|
6790
|
+
/* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "shrink-0", children: node.icon ?? defaultIcon }),
|
|
6791
|
+
/* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "truncate", children: node.label })
|
|
6643
6792
|
]
|
|
6644
6793
|
}
|
|
6645
6794
|
),
|
|
6646
|
-
hasChildren && isExpanded && /* @__PURE__ */ (0,
|
|
6795
|
+
hasChildren && isExpanded && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { children: node.children.map((child) => /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
|
|
6647
6796
|
TreeNodeItem,
|
|
6648
6797
|
{
|
|
6649
6798
|
node: child,
|
|
@@ -6668,8 +6817,8 @@ function TreeView({
|
|
|
6668
6817
|
className
|
|
6669
6818
|
}) {
|
|
6670
6819
|
const init = defaultSelected ? Array.isArray(defaultSelected) ? defaultSelected : [defaultSelected] : [];
|
|
6671
|
-
const [internal, setInternal] =
|
|
6672
|
-
const [expanded, setExpanded] =
|
|
6820
|
+
const [internal, setInternal] = React41.useState(init);
|
|
6821
|
+
const [expanded, setExpanded] = React41.useState(defaultExpanded);
|
|
6673
6822
|
const selected = controlled ? Array.isArray(controlled) ? controlled : [controlled] : internal;
|
|
6674
6823
|
function handleSelect(id) {
|
|
6675
6824
|
let next;
|
|
@@ -6684,7 +6833,7 @@ function TreeView({
|
|
|
6684
6833
|
function toggleExpand(id) {
|
|
6685
6834
|
setExpanded((prev) => prev.includes(id) ? prev.filter((v) => v !== id) : [...prev, id]);
|
|
6686
6835
|
}
|
|
6687
|
-
return /* @__PURE__ */ (0,
|
|
6836
|
+
return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: cn("w-full", className), children: nodes.map((node) => /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
|
|
6688
6837
|
TreeNodeItem,
|
|
6689
6838
|
{
|
|
6690
6839
|
node,
|
|
@@ -6700,8 +6849,8 @@ function TreeView({
|
|
|
6700
6849
|
}
|
|
6701
6850
|
|
|
6702
6851
|
// src/components/ui/widget.tsx
|
|
6703
|
-
var
|
|
6704
|
-
var
|
|
6852
|
+
var React42 = __toESM(require("react"), 1);
|
|
6853
|
+
var import_jsx_runtime53 = require("react/jsx-runtime");
|
|
6705
6854
|
var iconColorMap = {
|
|
6706
6855
|
primary: "bg-primary/10 text-primary",
|
|
6707
6856
|
info: "bg-info/10 text-info",
|
|
@@ -6729,8 +6878,8 @@ var variantMap = {
|
|
|
6729
6878
|
outline: "bg-transparent border-2"
|
|
6730
6879
|
};
|
|
6731
6880
|
function useCountUp(target, enabled, duration = 1e3) {
|
|
6732
|
-
const [display, setDisplay] =
|
|
6733
|
-
|
|
6881
|
+
const [display, setDisplay] = React42.useState(enabled ? 0 : target);
|
|
6882
|
+
React42.useEffect(() => {
|
|
6734
6883
|
if (!enabled) {
|
|
6735
6884
|
setDisplay(target);
|
|
6736
6885
|
return;
|
|
@@ -6773,7 +6922,7 @@ function Widget({
|
|
|
6773
6922
|
const counted = useCountUp(isNumeric ? value : 0, animate && isNumeric);
|
|
6774
6923
|
const displayValue = animate && isNumeric ? counted : value;
|
|
6775
6924
|
const s = sizeMap2[size];
|
|
6776
|
-
return /* @__PURE__ */ (0,
|
|
6925
|
+
return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
|
|
6777
6926
|
Card,
|
|
6778
6927
|
{
|
|
6779
6928
|
className: cn(
|
|
@@ -6784,27 +6933,27 @@ function Widget({
|
|
|
6784
6933
|
),
|
|
6785
6934
|
onClick,
|
|
6786
6935
|
...props,
|
|
6787
|
-
children: /* @__PURE__ */ (0,
|
|
6788
|
-
/* @__PURE__ */ (0,
|
|
6789
|
-
/* @__PURE__ */ (0,
|
|
6790
|
-
/* @__PURE__ */ (0,
|
|
6791
|
-
/* @__PURE__ */ (0,
|
|
6792
|
-
badge && /* @__PURE__ */ (0,
|
|
6936
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(CardContent, { className: s.card, children: [
|
|
6937
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "flex items-start justify-between gap-3", children: [
|
|
6938
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "min-w-0 flex-1 space-y-1", children: [
|
|
6939
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "flex items-center gap-2", children: [
|
|
6940
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)("p", { className: "text-sm font-medium text-muted-foreground truncate", children: title }),
|
|
6941
|
+
badge && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "shrink-0", children: badge })
|
|
6793
6942
|
] }),
|
|
6794
|
-
loading ? /* @__PURE__ */ (0,
|
|
6795
|
-
description && /* @__PURE__ */ (0,
|
|
6943
|
+
loading ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "h-8 w-24 animate-pulse rounded-md bg-muted" }) : /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: cn("font-bold tabular-nums", s.value), children: displayValue }),
|
|
6944
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("p", { className: "text-xs text-muted-foreground", children: description })
|
|
6796
6945
|
] }),
|
|
6797
|
-
icon && /* @__PURE__ */ (0,
|
|
6946
|
+
icon && /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: cn(
|
|
6798
6947
|
"relative flex shrink-0 items-center justify-center rounded-full",
|
|
6799
6948
|
s.icon,
|
|
6800
6949
|
iconColorMap[iconColor]
|
|
6801
6950
|
), children: [
|
|
6802
|
-
pulse && /* @__PURE__ */ (0,
|
|
6803
|
-
/* @__PURE__ */ (0,
|
|
6951
|
+
pulse && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "absolute inset-0 rounded-full animate-ping opacity-30 bg-current" }),
|
|
6952
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: s.iconSize, children: icon })
|
|
6804
6953
|
] })
|
|
6805
6954
|
] }),
|
|
6806
|
-
trendValue && !loading && /* @__PURE__ */ (0,
|
|
6807
|
-
/* @__PURE__ */ (0,
|
|
6955
|
+
trendValue && !loading && /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "mt-3 flex items-center gap-1.5 text-sm", children: [
|
|
6956
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("span", { className: cn(
|
|
6808
6957
|
"font-medium",
|
|
6809
6958
|
trend === "up" && "text-success",
|
|
6810
6959
|
trend === "down" && "text-danger",
|
|
@@ -6814,21 +6963,21 @@ function Widget({
|
|
|
6814
6963
|
trend === "down" && "\u2193 ",
|
|
6815
6964
|
trendValue
|
|
6816
6965
|
] }),
|
|
6817
|
-
previousValue !== void 0 && /* @__PURE__ */ (0,
|
|
6966
|
+
previousValue !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("span", { className: "text-muted-foreground", children: [
|
|
6818
6967
|
"vs ",
|
|
6819
6968
|
previousValue
|
|
6820
6969
|
] }),
|
|
6821
|
-
/* @__PURE__ */ (0,
|
|
6970
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "text-muted-foreground", children: trendLabel })
|
|
6822
6971
|
] }),
|
|
6823
|
-
progress !== void 0 && /* @__PURE__ */ (0,
|
|
6824
|
-
/* @__PURE__ */ (0,
|
|
6825
|
-
/* @__PURE__ */ (0,
|
|
6826
|
-
/* @__PURE__ */ (0,
|
|
6972
|
+
progress !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "mt-4 space-y-1", children: [
|
|
6973
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "flex justify-between text-xs text-muted-foreground", children: [
|
|
6974
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { children: "Progress" }),
|
|
6975
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("span", { children: [
|
|
6827
6976
|
Math.min(100, Math.max(0, progress)),
|
|
6828
6977
|
"%"
|
|
6829
6978
|
] })
|
|
6830
6979
|
] }),
|
|
6831
|
-
/* @__PURE__ */ (0,
|
|
6980
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "h-1.5 w-full rounded-full bg-muted overflow-hidden", children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
|
|
6832
6981
|
"div",
|
|
6833
6982
|
{
|
|
6834
6983
|
className: cn("h-full rounded-full transition-all duration-700", progressColorMap[progressColor]),
|
|
@@ -6836,7 +6985,7 @@ function Widget({
|
|
|
6836
6985
|
}
|
|
6837
6986
|
) })
|
|
6838
6987
|
] }),
|
|
6839
|
-
footer && /* @__PURE__ */ (0,
|
|
6988
|
+
footer && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "mt-4 border-t pt-3 text-sm text-muted-foreground", children: footer })
|
|
6840
6989
|
] })
|
|
6841
6990
|
}
|
|
6842
6991
|
);
|
|
@@ -6885,6 +7034,9 @@ function Widget({
|
|
|
6885
7034
|
NotificationPanel,
|
|
6886
7035
|
OtpInput,
|
|
6887
7036
|
Pagination,
|
|
7037
|
+
Panel,
|
|
7038
|
+
PanelSidebarGroup,
|
|
7039
|
+
PanelSidebarItem,
|
|
6888
7040
|
Popover,
|
|
6889
7041
|
Progress,
|
|
6890
7042
|
RadioGroup,
|