@work-rjkashyap/unified-ui 0.2.2 → 0.2.4
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/CHANGELOG.md +123 -6
- package/bin/cli.mjs +0 -0
- package/dist/{chunk-TESKVASH.cjs → chunk-5TP7J7T4.cjs} +57 -57
- package/dist/{chunk-2AERX4AM.mjs → chunk-AQJ7H5SF.mjs} +1153 -302
- package/dist/{chunk-YFH5JPAA.mjs → chunk-EQWESXRH.mjs} +1 -1
- package/dist/{chunk-PRQIFQRK.cjs → chunk-EUHL6H76.cjs} +1170 -298
- package/dist/{chunk-TVCJRD3S.mjs → chunk-IVZAB7BV.mjs} +9 -9
- package/dist/{chunk-QEFOXYBO.cjs → chunk-ZBGR7MUW.cjs} +9 -9
- package/dist/components.cjs +373 -289
- package/dist/components.d.cts +780 -37
- package/dist/components.d.ts +780 -37
- package/dist/components.mjs +1 -1
- package/dist/index.cjs +423 -339
- package/dist/index.d.cts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.mjs +3 -3
- package/dist/theme.cjs +32 -32
- package/dist/theme.d.cts +2 -2
- package/dist/theme.d.ts +2 -2
- package/dist/theme.mjs +2 -2
- package/dist/tokens.cjs +19 -19
- package/dist/tokens.d.cts +1 -1
- package/dist/tokens.d.ts +1 -1
- package/dist/tokens.mjs +1 -1
- package/dist/{z-index-G0PBTHL2.d.cts → z-index-Dd8IllRx.d.cts} +9 -9
- package/dist/{z-index-G0PBTHL2.d.ts → z-index-Dd8IllRx.d.ts} +9 -9
- package/package.json +2 -2
- package/styles.css +17 -14
|
@@ -775,9 +775,7 @@ var avatarVariants = classVarianceAuthority.cva(
|
|
|
775
775
|
// Typography for fallback initials
|
|
776
776
|
"font-medium leading-none select-none",
|
|
777
777
|
// Default colors for fallback state
|
|
778
|
-
"bg-muted text-muted-foreground"
|
|
779
|
-
// Border for visual separation on grouped/colored backgrounds
|
|
780
|
-
"ring-2 ring-background"
|
|
778
|
+
"bg-muted text-muted-foreground"
|
|
781
779
|
],
|
|
782
780
|
{
|
|
783
781
|
variants: {
|
|
@@ -859,15 +857,18 @@ function getInitials(name) {
|
|
|
859
857
|
return (parts[0][0] + parts[parts.length - 1][0]).toUpperCase();
|
|
860
858
|
}
|
|
861
859
|
function DefaultFallbackIcon({ className }) {
|
|
862
|
-
return /* @__PURE__ */ jsxRuntime.
|
|
860
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
863
861
|
"svg",
|
|
864
862
|
{
|
|
865
|
-
className: chunk4ON3M3OM_cjs.cn("size-
|
|
863
|
+
className: chunk4ON3M3OM_cjs.cn("size-8 translate-y-px text-current opacity-70", className),
|
|
866
864
|
xmlns: "http://www.w3.org/2000/svg",
|
|
867
865
|
viewBox: "0 0 24 24",
|
|
868
866
|
fill: "currentColor",
|
|
869
867
|
"aria-hidden": "true",
|
|
870
|
-
children:
|
|
868
|
+
children: [
|
|
869
|
+
/* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "7", r: "4" }),
|
|
870
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 14c-4.42 0-8 2.24-8 5v5h16v-5c0-2.76-3.58-5-8-5z" })
|
|
871
|
+
]
|
|
871
872
|
}
|
|
872
873
|
);
|
|
873
874
|
}
|
|
@@ -988,11 +989,11 @@ var Avatar = React.forwardRef(function Avatar2({
|
|
|
988
989
|
});
|
|
989
990
|
Avatar.displayName = "Avatar";
|
|
990
991
|
var overlapMap = {
|
|
991
|
-
xs: { tight: "-ml-
|
|
992
|
-
sm: { tight: "-ml-
|
|
993
|
-
md: { tight: "-ml-
|
|
994
|
-
lg: { tight: "-ml-
|
|
995
|
-
xl: { tight: "-ml-
|
|
992
|
+
xs: { tight: "-ml-3", default: "-ml-2.5", loose: "-ml-1.5" },
|
|
993
|
+
sm: { tight: "-ml-4", default: "-ml-3", loose: "-ml-2" },
|
|
994
|
+
md: { tight: "-ml-5", default: "-ml-4", loose: "-ml-3" },
|
|
995
|
+
lg: { tight: "-ml-6", default: "-ml-5", loose: "-ml-3.5" },
|
|
996
|
+
xl: { tight: "-ml-8", default: "-ml-6", loose: "-ml-4" }
|
|
996
997
|
};
|
|
997
998
|
var AvatarGroup = React.forwardRef(
|
|
998
999
|
function AvatarGroup2({
|
|
@@ -1028,35 +1029,53 @@ var AvatarGroup = React.forwardRef(
|
|
|
1028
1029
|
className: chunk4ON3M3OM_cjs.cn(
|
|
1029
1030
|
index > 0 && overlapClass,
|
|
1030
1031
|
// Ensure proper stacking order (first avatar on top)
|
|
1031
|
-
|
|
1032
|
+
// z-index is set via CSS var so hover:z-50! (Tailwind) can override it
|
|
1033
|
+
"relative inline-flex cursor-pointer transition-transform duration-150 ease-out",
|
|
1034
|
+
"z-(--ag-z)",
|
|
1035
|
+
"hover:z-50! hover:scale-110"
|
|
1032
1036
|
),
|
|
1033
|
-
style: {
|
|
1037
|
+
style: { "--ag-z": totalCount - index },
|
|
1034
1038
|
children: React.cloneElement(child, {
|
|
1035
1039
|
size,
|
|
1036
|
-
shape
|
|
1040
|
+
shape,
|
|
1041
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
1042
|
+
child.props?.className,
|
|
1043
|
+
"ring-2 ring-background"
|
|
1044
|
+
)
|
|
1037
1045
|
})
|
|
1038
1046
|
},
|
|
1039
1047
|
child.props?.alt ?? child.props?.name ?? index
|
|
1040
1048
|
);
|
|
1041
1049
|
}),
|
|
1042
|
-
overflowCount > 0 && /* @__PURE__ */ jsxRuntime.jsx(
|
|
1050
|
+
overflowCount > 0 && /* @__PURE__ */ jsxRuntime.jsx(
|
|
1043
1051
|
"span",
|
|
1044
1052
|
{
|
|
1045
1053
|
className: chunk4ON3M3OM_cjs.cn(
|
|
1046
|
-
|
|
1047
|
-
"
|
|
1048
|
-
"font-semibold"
|
|
1054
|
+
overlapClass,
|
|
1055
|
+
"relative inline-flex z-(--ag-z)"
|
|
1049
1056
|
),
|
|
1050
|
-
|
|
1051
|
-
|
|
1052
|
-
|
|
1053
|
-
|
|
1054
|
-
|
|
1055
|
-
|
|
1056
|
-
|
|
1057
|
-
|
|
1057
|
+
style: { "--ag-z": 0 },
|
|
1058
|
+
children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1059
|
+
"span",
|
|
1060
|
+
{
|
|
1061
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
1062
|
+
avatarVariants({ size, shape }),
|
|
1063
|
+
"ring-2 ring-background",
|
|
1064
|
+
"bg-muted text-muted-foreground",
|
|
1065
|
+
"font-semibold"
|
|
1066
|
+
),
|
|
1067
|
+
role: "img",
|
|
1068
|
+
"aria-label": `${overflowCount} more`,
|
|
1069
|
+
"data-ds": "",
|
|
1070
|
+
"data-ds-component": "avatar-overflow",
|
|
1071
|
+
children: [
|
|
1072
|
+
"+",
|
|
1073
|
+
overflowCount
|
|
1074
|
+
]
|
|
1075
|
+
}
|
|
1076
|
+
)
|
|
1058
1077
|
}
|
|
1059
|
-
)
|
|
1078
|
+
)
|
|
1060
1079
|
]
|
|
1061
1080
|
}
|
|
1062
1081
|
);
|
|
@@ -1878,7 +1897,7 @@ var Button = React.forwardRef(
|
|
|
1878
1897
|
loading && /* @__PURE__ */ jsxRuntime.jsx(ButtonSpinner, { className: size === "sm" ? "size-3.5" : "size-4" }),
|
|
1879
1898
|
loading && loadingText ? /* @__PURE__ */ jsxRuntime.jsx("span", { children: loadingText }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
1880
1899
|
!loading && iconLeft && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0", "aria-hidden": "true", children: iconLeft }),
|
|
1881
|
-
children && /* @__PURE__ */ jsxRuntime.jsx("span", { className: chunk4ON3M3OM_cjs.cn(loading && !loadingText && "invisible"), children }),
|
|
1900
|
+
children && /* @__PURE__ */ jsxRuntime.jsx("span", { className: chunk4ON3M3OM_cjs.cn("inline-flex items-center gap-[inherit]", loading && !loadingText && "invisible"), children }),
|
|
1882
1901
|
!loading && iconRight && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0", "aria-hidden": "true", children: iconRight })
|
|
1883
1902
|
] })
|
|
1884
1903
|
]
|
|
@@ -2363,21 +2382,17 @@ var CardContext = React.createContext({ padding: "compact" });
|
|
|
2363
2382
|
function useCardContext() {
|
|
2364
2383
|
return React.useContext(CardContext);
|
|
2365
2384
|
}
|
|
2366
|
-
var cardPaddingMap = {
|
|
2367
|
-
compact: "p-(--ds-padding-card)",
|
|
2368
|
-
comfortable: "p-6"
|
|
2369
|
-
};
|
|
2370
2385
|
var slotPaddingXMap = {
|
|
2371
2386
|
compact: "px-(--ds-padding-card)",
|
|
2372
2387
|
comfortable: "px-6"
|
|
2373
2388
|
};
|
|
2374
|
-
var
|
|
2375
|
-
compact: "
|
|
2376
|
-
comfortable: "
|
|
2389
|
+
var cardVerticalPaddingMap = {
|
|
2390
|
+
compact: "py-(--ds-padding-card)",
|
|
2391
|
+
comfortable: "py-6"
|
|
2377
2392
|
};
|
|
2378
|
-
var
|
|
2379
|
-
compact: "
|
|
2380
|
-
comfortable: "
|
|
2393
|
+
var cardGapMap = {
|
|
2394
|
+
compact: "gap-(--ds-gap-default,0.75rem)",
|
|
2395
|
+
comfortable: "gap-4"
|
|
2381
2396
|
};
|
|
2382
2397
|
var cardVariants = classVarianceAuthority.cva(
|
|
2383
2398
|
// Base styles — shared across all variants
|
|
@@ -2471,6 +2486,8 @@ var Card = React.forwardRef(function Card2({
|
|
|
2471
2486
|
className: chunk4ON3M3OM_cjs.cn(
|
|
2472
2487
|
"not-prose",
|
|
2473
2488
|
cardVariants({ variant, fullWidth }),
|
|
2489
|
+
cardVerticalPaddingMap[padding],
|
|
2490
|
+
cardGapMap[padding],
|
|
2474
2491
|
className
|
|
2475
2492
|
),
|
|
2476
2493
|
"data-ds": "",
|
|
@@ -2498,9 +2515,7 @@ var CardHeader = React.forwardRef(
|
|
|
2498
2515
|
className: chunk4ON3M3OM_cjs.cn(
|
|
2499
2516
|
"flex flex-col gap-1.5",
|
|
2500
2517
|
slotPaddingXMap[padding],
|
|
2501
|
-
|
|
2502
|
-
slotPaddingBottomMap[padding],
|
|
2503
|
-
bordered && "border-b border-border-muted",
|
|
2518
|
+
bordered && "pb-(--ds-padding-card) border-b border-border-muted",
|
|
2504
2519
|
className
|
|
2505
2520
|
),
|
|
2506
2521
|
"data-ds": "",
|
|
@@ -2521,7 +2536,7 @@ var CardBody = React.forwardRef(
|
|
|
2521
2536
|
ref,
|
|
2522
2537
|
className: chunk4ON3M3OM_cjs.cn(
|
|
2523
2538
|
"flex flex-col gap-2 flex-1",
|
|
2524
|
-
|
|
2539
|
+
slotPaddingXMap[padding],
|
|
2525
2540
|
className
|
|
2526
2541
|
),
|
|
2527
2542
|
"data-ds": "",
|
|
@@ -2543,9 +2558,7 @@ var CardFooter = React.forwardRef(
|
|
|
2543
2558
|
className: chunk4ON3M3OM_cjs.cn(
|
|
2544
2559
|
"flex items-center gap-2",
|
|
2545
2560
|
slotPaddingXMap[padding],
|
|
2546
|
-
|
|
2547
|
-
slotPaddingBottomMap[padding],
|
|
2548
|
-
bordered && "border-t border-border-muted",
|
|
2561
|
+
bordered && "pt-(--ds-padding-card) border-t border-border-muted",
|
|
2549
2562
|
alignMap[align],
|
|
2550
2563
|
className
|
|
2551
2564
|
),
|
|
@@ -2923,7 +2936,7 @@ var Checkbox = React.forwardRef(function Checkbox2({
|
|
|
2923
2936
|
)
|
|
2924
2937
|
}
|
|
2925
2938
|
),
|
|
2926
|
-
(label || description) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-0.5", children: [
|
|
2939
|
+
(label || description) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-0.5 flex-1 min-w-0", children: [
|
|
2927
2940
|
label && /* @__PURE__ */ jsxRuntime.jsx(
|
|
2928
2941
|
"label",
|
|
2929
2942
|
{
|
|
@@ -8549,7 +8562,7 @@ function Dropdown({
|
|
|
8549
8562
|
"div",
|
|
8550
8563
|
{
|
|
8551
8564
|
className: chunk4ON3M3OM_cjs.cn(
|
|
8552
|
-
"absolute top-full z-[var(--z-dropdown
|
|
8565
|
+
"absolute top-full z-[var(--z-dropdown)] mt-1",
|
|
8553
8566
|
align === "end" ? "right-0" : "left-0",
|
|
8554
8567
|
"min-w-[8rem] rounded-md py-1",
|
|
8555
8568
|
"border border-border bg-popover text-popover-foreground",
|
|
@@ -10323,9 +10336,9 @@ var DropdownMenuItem = React.forwardRef(function DropdownMenuItem2({ className,
|
|
|
10323
10336
|
ref,
|
|
10324
10337
|
className: chunk4ON3M3OM_cjs.cn(
|
|
10325
10338
|
...menuItemBase2,
|
|
10339
|
+
"gap-2",
|
|
10326
10340
|
variant === "danger" && "text-danger focus:bg-danger-muted focus:text-danger-muted-foreground",
|
|
10327
10341
|
variant === "default" && "text-foreground",
|
|
10328
|
-
icon && "gap-2",
|
|
10329
10342
|
className
|
|
10330
10343
|
),
|
|
10331
10344
|
"data-ds": "",
|
|
@@ -10333,7 +10346,7 @@ var DropdownMenuItem = React.forwardRef(function DropdownMenuItem2({ className,
|
|
|
10333
10346
|
...rest,
|
|
10334
10347
|
children: [
|
|
10335
10348
|
icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 [&>svg]:size-4", "aria-hidden": "true", children: icon }),
|
|
10336
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1", children }),
|
|
10349
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 flex items-center gap-2 [&>svg]:shrink-0 [&>svg]:size-4", children }),
|
|
10337
10350
|
shortcut && /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuShortcut, { children: shortcut })
|
|
10338
10351
|
]
|
|
10339
10352
|
}
|
|
@@ -10345,13 +10358,13 @@ var DropdownMenuCheckboxItem = React.forwardRef(function DropdownMenuCheckboxIte
|
|
|
10345
10358
|
radixUi.DropdownMenu.CheckboxItem,
|
|
10346
10359
|
{
|
|
10347
10360
|
ref,
|
|
10348
|
-
className: chunk4ON3M3OM_cjs.cn(...menuItemBase2, "pl-8", className),
|
|
10361
|
+
className: chunk4ON3M3OM_cjs.cn(...menuItemBase2, "gap-2 pl-8", className),
|
|
10349
10362
|
"data-ds": "",
|
|
10350
10363
|
"data-ds-component": "dropdown-menu-checkbox-item",
|
|
10351
10364
|
...rest,
|
|
10352
10365
|
children: [
|
|
10353
10366
|
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute left-2 flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(radixUi.DropdownMenu.ItemIndicator, { children: /* @__PURE__ */ jsxRuntime.jsx(CheckIcon6, { className: "size-4" }) }) }),
|
|
10354
|
-
children
|
|
10367
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 flex items-center gap-2 [&>svg]:shrink-0 [&>svg]:size-4", children })
|
|
10355
10368
|
]
|
|
10356
10369
|
}
|
|
10357
10370
|
);
|
|
@@ -10366,13 +10379,13 @@ var DropdownMenuRadioItem = React.forwardRef(function DropdownMenuRadioItem2({ c
|
|
|
10366
10379
|
radixUi.DropdownMenu.RadioItem,
|
|
10367
10380
|
{
|
|
10368
10381
|
ref,
|
|
10369
|
-
className: chunk4ON3M3OM_cjs.cn(...menuItemBase2, "pl-8", className),
|
|
10382
|
+
className: chunk4ON3M3OM_cjs.cn(...menuItemBase2, "gap-2 pl-8", className),
|
|
10370
10383
|
"data-ds": "",
|
|
10371
10384
|
"data-ds-component": "dropdown-menu-radio-item",
|
|
10372
10385
|
...rest,
|
|
10373
10386
|
children: [
|
|
10374
10387
|
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute left-2 flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(radixUi.DropdownMenu.ItemIndicator, { children: /* @__PURE__ */ jsxRuntime.jsx(DotIcon2, { className: "size-4" }) }) }),
|
|
10375
|
-
children
|
|
10388
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 flex items-center gap-2 [&>svg]:shrink-0 [&>svg]:size-4", children })
|
|
10376
10389
|
]
|
|
10377
10390
|
}
|
|
10378
10391
|
);
|
|
@@ -10420,8 +10433,7 @@ var DropdownMenuSubTrigger = React.forwardRef(function DropdownMenuSubTrigger2({
|
|
|
10420
10433
|
ref,
|
|
10421
10434
|
className: chunk4ON3M3OM_cjs.cn(
|
|
10422
10435
|
...menuItemBase2,
|
|
10423
|
-
"data-[state=open]:bg-muted",
|
|
10424
|
-
icon && "gap-2",
|
|
10436
|
+
"gap-2 data-[state=open]:bg-muted",
|
|
10425
10437
|
inset && "pl-8",
|
|
10426
10438
|
className
|
|
10427
10439
|
),
|
|
@@ -10430,7 +10442,7 @@ var DropdownMenuSubTrigger = React.forwardRef(function DropdownMenuSubTrigger2({
|
|
|
10430
10442
|
...rest,
|
|
10431
10443
|
children: [
|
|
10432
10444
|
icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 [&>svg]:size-4", "aria-hidden": "true", children: icon }),
|
|
10433
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1", children }),
|
|
10445
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 flex items-center gap-2 [&>svg]:shrink-0 [&>svg]:size-4", children }),
|
|
10434
10446
|
/* @__PURE__ */ jsxRuntime.jsx(ChevronRightIcon4, { className: "ml-auto size-4 text-muted-foreground" })
|
|
10435
10447
|
]
|
|
10436
10448
|
}
|
|
@@ -13483,18 +13495,7 @@ var stripedStyle = {
|
|
|
13483
13495
|
backgroundSize: "1rem 1rem"
|
|
13484
13496
|
};
|
|
13485
13497
|
var PROGRESS_STYLE_ID = "unified-ui-progress-keyframes";
|
|
13486
|
-
|
|
13487
|
-
if (typeof document !== "undefined") {
|
|
13488
|
-
if (document.getElementById(PROGRESS_STYLE_ID)) {
|
|
13489
|
-
return null;
|
|
13490
|
-
}
|
|
13491
|
-
}
|
|
13492
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
13493
|
-
"style",
|
|
13494
|
-
{
|
|
13495
|
-
id: PROGRESS_STYLE_ID,
|
|
13496
|
-
dangerouslySetInnerHTML: {
|
|
13497
|
-
__html: `
|
|
13498
|
+
var PROGRESS_KEYFRAMES_CSS = `
|
|
13498
13499
|
@keyframes unified-ui-progress-indeterminate {
|
|
13499
13500
|
0% { transform: translateX(-100%); width: 50%; }
|
|
13500
13501
|
50% { transform: translateX(50%); width: 30%; }
|
|
@@ -13504,10 +13505,17 @@ function ProgressKeyframes() {
|
|
|
13504
13505
|
0% { background-position: 1rem 0; }
|
|
13505
13506
|
100% { background-position: 0 0; }
|
|
13506
13507
|
}
|
|
13507
|
-
|
|
13508
|
-
|
|
13508
|
+
`;
|
|
13509
|
+
function useProgressKeyframes() {
|
|
13510
|
+
React.useEffect(() => {
|
|
13511
|
+
if (document.getElementById(PROGRESS_STYLE_ID)) {
|
|
13512
|
+
return;
|
|
13509
13513
|
}
|
|
13510
|
-
|
|
13514
|
+
const style = document.createElement("style");
|
|
13515
|
+
style.id = PROGRESS_STYLE_ID;
|
|
13516
|
+
style.textContent = PROGRESS_KEYFRAMES_CSS;
|
|
13517
|
+
document.head.appendChild(style);
|
|
13518
|
+
}, []);
|
|
13511
13519
|
}
|
|
13512
13520
|
var Progress = React.forwardRef(
|
|
13513
13521
|
function Progress2({
|
|
@@ -13528,6 +13536,7 @@ var Progress = React.forwardRef(
|
|
|
13528
13536
|
indicatorClassName,
|
|
13529
13537
|
...rest
|
|
13530
13538
|
}, ref) {
|
|
13539
|
+
useProgressKeyframes();
|
|
13531
13540
|
const clampedValue = Math.max(min2, Math.min(value, max2));
|
|
13532
13541
|
const range = max2 - min2;
|
|
13533
13542
|
const percentage = range > 0 ? (clampedValue - min2) / range * 100 : 0;
|
|
@@ -13567,7 +13576,6 @@ var Progress = React.forwardRef(
|
|
|
13567
13576
|
"data-ds-size": size,
|
|
13568
13577
|
...indeterminate ? { "data-ds-indeterminate": "" } : {},
|
|
13569
13578
|
children: [
|
|
13570
|
-
/* @__PURE__ */ jsxRuntime.jsx(ProgressKeyframes, {}),
|
|
13571
13579
|
showLabel && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between mb-1.5", children: [
|
|
13572
13580
|
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-medium leading-4 text-foreground", children: label ?? "" }),
|
|
13573
13581
|
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-medium leading-4 text-muted-foreground tabular-nums", children: typeof label === "string" || !label ? labelFormatter(clampedValue, max2) : "" })
|
|
@@ -13784,7 +13792,7 @@ var RadioGroupItem = React.forwardRef(function RadioGroupItem2({ value, label, d
|
|
|
13784
13792
|
)
|
|
13785
13793
|
}
|
|
13786
13794
|
),
|
|
13787
|
-
(label || description) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-0.5 min-w-0", children: [
|
|
13795
|
+
(label || description) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-0.5 min-w-0 flex-1", children: [
|
|
13788
13796
|
label && /* @__PURE__ */ jsxRuntime.jsx(
|
|
13789
13797
|
"label",
|
|
13790
13798
|
{
|
|
@@ -14601,6 +14609,168 @@ var SelectSeparator = React.forwardRef(function SelectSeparator2({ className, ..
|
|
|
14601
14609
|
);
|
|
14602
14610
|
});
|
|
14603
14611
|
SelectSeparator.displayName = "SelectSeparator";
|
|
14612
|
+
var separatorVariants = classVarianceAuthority.cva(
|
|
14613
|
+
// Base styles — shared across all variants
|
|
14614
|
+
"shrink-0 bg-border",
|
|
14615
|
+
{
|
|
14616
|
+
variants: {
|
|
14617
|
+
/**
|
|
14618
|
+
* Visual variant of the separator line.
|
|
14619
|
+
*/
|
|
14620
|
+
variant: {
|
|
14621
|
+
/**
|
|
14622
|
+
* Default — solid line using the border token color.
|
|
14623
|
+
*/
|
|
14624
|
+
default: "",
|
|
14625
|
+
/**
|
|
14626
|
+
* Muted — lighter separator using the muted-foreground color at
|
|
14627
|
+
* reduced opacity. Useful for less prominent divisions.
|
|
14628
|
+
*/
|
|
14629
|
+
muted: "bg-muted-foreground/20",
|
|
14630
|
+
/**
|
|
14631
|
+
* Dashed — renders a dashed border instead of a solid background.
|
|
14632
|
+
* Uses border-style rather than background.
|
|
14633
|
+
*/
|
|
14634
|
+
dashed: "bg-transparent !h-auto !w-auto",
|
|
14635
|
+
/**
|
|
14636
|
+
* Gradient — fades in from transparent at both ends.
|
|
14637
|
+
* Creates a more elegant, subtle divider.
|
|
14638
|
+
*/
|
|
14639
|
+
gradient: "bg-transparent"
|
|
14640
|
+
},
|
|
14641
|
+
/**
|
|
14642
|
+
* Orientation of the separator.
|
|
14643
|
+
*/
|
|
14644
|
+
orientation: {
|
|
14645
|
+
horizontal: "h-px w-full",
|
|
14646
|
+
vertical: "h-full w-px"
|
|
14647
|
+
}
|
|
14648
|
+
},
|
|
14649
|
+
compoundVariants: [
|
|
14650
|
+
// Dashed + horizontal
|
|
14651
|
+
{
|
|
14652
|
+
variant: "dashed",
|
|
14653
|
+
orientation: "horizontal",
|
|
14654
|
+
class: "border-b border-dashed border-border w-full"
|
|
14655
|
+
},
|
|
14656
|
+
// Dashed + vertical
|
|
14657
|
+
{
|
|
14658
|
+
variant: "dashed",
|
|
14659
|
+
orientation: "vertical",
|
|
14660
|
+
class: "border-l border-dashed border-border h-full"
|
|
14661
|
+
}
|
|
14662
|
+
],
|
|
14663
|
+
defaultVariants: {
|
|
14664
|
+
variant: "default",
|
|
14665
|
+
orientation: "horizontal"
|
|
14666
|
+
}
|
|
14667
|
+
}
|
|
14668
|
+
);
|
|
14669
|
+
var spacingYMap = {
|
|
14670
|
+
0: "my-0",
|
|
14671
|
+
1: "my-1",
|
|
14672
|
+
2: "my-2",
|
|
14673
|
+
3: "my-3",
|
|
14674
|
+
4: "my-4",
|
|
14675
|
+
5: "my-5",
|
|
14676
|
+
6: "my-6",
|
|
14677
|
+
8: "my-8",
|
|
14678
|
+
10: "my-10",
|
|
14679
|
+
12: "my-12"
|
|
14680
|
+
};
|
|
14681
|
+
var spacingXMap = {
|
|
14682
|
+
0: "mx-0",
|
|
14683
|
+
1: "mx-1",
|
|
14684
|
+
2: "mx-2",
|
|
14685
|
+
3: "mx-3",
|
|
14686
|
+
4: "mx-4",
|
|
14687
|
+
5: "mx-5",
|
|
14688
|
+
6: "mx-6",
|
|
14689
|
+
8: "mx-8",
|
|
14690
|
+
10: "mx-10",
|
|
14691
|
+
12: "mx-12"
|
|
14692
|
+
};
|
|
14693
|
+
var gradientHorizontal = "bg-gradient-to-r from-transparent via-border to-transparent";
|
|
14694
|
+
var gradientVertical = "bg-gradient-to-b from-transparent via-border to-transparent";
|
|
14695
|
+
var Separator2 = React.forwardRef(function Separator3({
|
|
14696
|
+
variant = "default",
|
|
14697
|
+
orientation = "horizontal",
|
|
14698
|
+
decorative = true,
|
|
14699
|
+
spacing = 4,
|
|
14700
|
+
label,
|
|
14701
|
+
className,
|
|
14702
|
+
...rest
|
|
14703
|
+
}, ref) {
|
|
14704
|
+
const isVertical = orientation === "vertical";
|
|
14705
|
+
const spacingClass = isVertical ? spacingXMap[spacing] ?? "mx-4" : spacingYMap[spacing] ?? "my-4";
|
|
14706
|
+
const gradientClass = variant === "gradient" ? isVertical ? gradientVertical : gradientHorizontal : void 0;
|
|
14707
|
+
if (label && !isVertical) {
|
|
14708
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
14709
|
+
"div",
|
|
14710
|
+
{
|
|
14711
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
14712
|
+
"flex items-center w-full",
|
|
14713
|
+
spacingClass,
|
|
14714
|
+
className
|
|
14715
|
+
),
|
|
14716
|
+
role: decorative ? "none" : "separator",
|
|
14717
|
+
"aria-orientation": decorative ? void 0 : orientation,
|
|
14718
|
+
"data-ds": "",
|
|
14719
|
+
"data-ds-component": "separator",
|
|
14720
|
+
"data-ds-variant": variant,
|
|
14721
|
+
"data-ds-orientation": orientation,
|
|
14722
|
+
"data-ds-labeled": "",
|
|
14723
|
+
children: [
|
|
14724
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
14725
|
+
radixUi.Separator.Root,
|
|
14726
|
+
{
|
|
14727
|
+
decorative: true,
|
|
14728
|
+
orientation,
|
|
14729
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
14730
|
+
separatorVariants({ variant, orientation }),
|
|
14731
|
+
gradientClass,
|
|
14732
|
+
"flex-1"
|
|
14733
|
+
)
|
|
14734
|
+
}
|
|
14735
|
+
),
|
|
14736
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "px-3 text-xs text-muted-foreground font-medium select-none shrink-0", children: label }),
|
|
14737
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
14738
|
+
radixUi.Separator.Root,
|
|
14739
|
+
{
|
|
14740
|
+
decorative: true,
|
|
14741
|
+
orientation,
|
|
14742
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
14743
|
+
separatorVariants({ variant, orientation }),
|
|
14744
|
+
gradientClass,
|
|
14745
|
+
"flex-1"
|
|
14746
|
+
)
|
|
14747
|
+
}
|
|
14748
|
+
)
|
|
14749
|
+
]
|
|
14750
|
+
}
|
|
14751
|
+
);
|
|
14752
|
+
}
|
|
14753
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
14754
|
+
radixUi.Separator.Root,
|
|
14755
|
+
{
|
|
14756
|
+
ref,
|
|
14757
|
+
decorative,
|
|
14758
|
+
orientation,
|
|
14759
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
14760
|
+
separatorVariants({ variant, orientation }),
|
|
14761
|
+
gradientClass,
|
|
14762
|
+
spacingClass,
|
|
14763
|
+
className
|
|
14764
|
+
),
|
|
14765
|
+
"data-ds": "",
|
|
14766
|
+
"data-ds-component": "separator",
|
|
14767
|
+
"data-ds-variant": variant,
|
|
14768
|
+
"data-ds-orientation": orientation,
|
|
14769
|
+
...rest
|
|
14770
|
+
}
|
|
14771
|
+
);
|
|
14772
|
+
});
|
|
14773
|
+
Separator2.displayName = "Separator";
|
|
14604
14774
|
var sheetContentVariants = classVarianceAuthority.cva(
|
|
14605
14775
|
[
|
|
14606
14776
|
// Layout
|
|
@@ -15169,51 +15339,14 @@ var DrawerClose = React.forwardRef(function DrawerClose2({ className, ...rest },
|
|
|
15169
15339
|
);
|
|
15170
15340
|
});
|
|
15171
15341
|
DrawerClose.displayName = "DrawerClose";
|
|
15172
|
-
var
|
|
15173
|
-
|
|
15174
|
-
|
|
15175
|
-
|
|
15176
|
-
|
|
15177
|
-
|
|
15178
|
-
|
|
15179
|
-
|
|
15180
|
-
});
|
|
15181
|
-
function useSidebarContext() {
|
|
15182
|
-
return React.useContext(SidebarContext);
|
|
15183
|
-
}
|
|
15184
|
-
function SidebarProvider({
|
|
15185
|
-
defaultCollapsed = false,
|
|
15186
|
-
collapsed: controlledCollapsed,
|
|
15187
|
-
onCollapsedChange,
|
|
15188
|
-
children
|
|
15189
|
-
}) {
|
|
15190
|
-
const [internalCollapsed, setInternalCollapsed] = React.useState(defaultCollapsed);
|
|
15191
|
-
const [mobileOpen, setMobileOpen] = React.useState(false);
|
|
15192
|
-
const collapsed = controlledCollapsed !== void 0 ? controlledCollapsed : internalCollapsed;
|
|
15193
|
-
const setCollapsed = React.useCallback(
|
|
15194
|
-
(v) => {
|
|
15195
|
-
if (controlledCollapsed === void 0) setInternalCollapsed(v);
|
|
15196
|
-
onCollapsedChange?.(v);
|
|
15197
|
-
},
|
|
15198
|
-
[controlledCollapsed, onCollapsedChange]
|
|
15199
|
-
);
|
|
15200
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
15201
|
-
SidebarContext.Provider,
|
|
15202
|
-
{
|
|
15203
|
-
value: {
|
|
15204
|
-
collapsed,
|
|
15205
|
-
setCollapsed,
|
|
15206
|
-
isMobile: false,
|
|
15207
|
-
mobileOpen,
|
|
15208
|
-
setMobileOpen
|
|
15209
|
-
},
|
|
15210
|
-
children
|
|
15211
|
-
}
|
|
15212
|
-
);
|
|
15213
|
-
}
|
|
15214
|
-
SidebarProvider.displayName = "SidebarProvider";
|
|
15215
|
-
function ChevronLeftIcon3({ className }) {
|
|
15216
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
15342
|
+
var SIDEBAR_COOKIE_NAME = "sidebar:state";
|
|
15343
|
+
var SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
|
|
15344
|
+
var SIDEBAR_WIDTH = "16rem";
|
|
15345
|
+
var SIDEBAR_WIDTH_MOBILE = "18rem";
|
|
15346
|
+
var SIDEBAR_WIDTH_ICON = "3rem";
|
|
15347
|
+
var SIDEBAR_KEYBOARD_SHORTCUT = "b";
|
|
15348
|
+
function PanelLeftIcon({ className }) {
|
|
15349
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
15217
15350
|
"svg",
|
|
15218
15351
|
{
|
|
15219
15352
|
className,
|
|
@@ -15225,162 +15358,893 @@ function ChevronLeftIcon3({ className }) {
|
|
|
15225
15358
|
strokeLinecap: "round",
|
|
15226
15359
|
strokeLinejoin: "round",
|
|
15227
15360
|
"aria-hidden": "true",
|
|
15228
|
-
children:
|
|
15361
|
+
children: [
|
|
15362
|
+
/* @__PURE__ */ jsxRuntime.jsx("rect", { width: "18", height: "18", x: "3", y: "3", rx: "2" }),
|
|
15363
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9 3v18" })
|
|
15364
|
+
]
|
|
15229
15365
|
}
|
|
15230
15366
|
);
|
|
15231
15367
|
}
|
|
15232
|
-
|
|
15233
|
-
|
|
15234
|
-
|
|
15235
|
-
|
|
15236
|
-
|
|
15237
|
-
|
|
15238
|
-
|
|
15239
|
-
|
|
15240
|
-
|
|
15241
|
-
|
|
15242
|
-
|
|
15243
|
-
|
|
15244
|
-
|
|
15245
|
-
|
|
15246
|
-
|
|
15247
|
-
|
|
15368
|
+
var SidebarContext = React.createContext({
|
|
15369
|
+
state: "expanded",
|
|
15370
|
+
open: true,
|
|
15371
|
+
setOpen: () => {
|
|
15372
|
+
},
|
|
15373
|
+
openMobile: false,
|
|
15374
|
+
setOpenMobile: () => {
|
|
15375
|
+
},
|
|
15376
|
+
isMobile: false,
|
|
15377
|
+
toggleSidebar: () => {
|
|
15378
|
+
},
|
|
15379
|
+
variant: "default",
|
|
15380
|
+
collapsible: "offcanvas",
|
|
15381
|
+
side: "left"
|
|
15382
|
+
});
|
|
15383
|
+
function useSidebar() {
|
|
15384
|
+
const context = React.useContext(SidebarContext);
|
|
15385
|
+
if (!context) {
|
|
15386
|
+
throw new Error("useSidebar must be used within a <SidebarProvider>");
|
|
15387
|
+
}
|
|
15388
|
+
return context;
|
|
15248
15389
|
}
|
|
15249
|
-
var
|
|
15250
|
-
|
|
15251
|
-
|
|
15252
|
-
|
|
15253
|
-
|
|
15254
|
-
|
|
15255
|
-
|
|
15256
|
-
|
|
15257
|
-
|
|
15258
|
-
|
|
15259
|
-
|
|
15260
|
-
|
|
15261
|
-
|
|
15262
|
-
|
|
15263
|
-
|
|
15264
|
-
|
|
15265
|
-
|
|
15266
|
-
|
|
15267
|
-
|
|
15268
|
-
|
|
15390
|
+
var useSidebarContext = useSidebar;
|
|
15391
|
+
var MOBILE_BREAKPOINT = 768;
|
|
15392
|
+
function useIsMobile() {
|
|
15393
|
+
const [isMobile, setIsMobile] = React.useState(false);
|
|
15394
|
+
React.useEffect(() => {
|
|
15395
|
+
const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
|
|
15396
|
+
const onChange = () => setIsMobile(mql.matches);
|
|
15397
|
+
mql.addEventListener("change", onChange);
|
|
15398
|
+
setIsMobile(mql.matches);
|
|
15399
|
+
return () => mql.removeEventListener("change", onChange);
|
|
15400
|
+
}, []);
|
|
15401
|
+
return isMobile;
|
|
15402
|
+
}
|
|
15403
|
+
var SidebarProvider = React.forwardRef(
|
|
15404
|
+
function SidebarProvider2({
|
|
15405
|
+
defaultOpen = true,
|
|
15406
|
+
open: openProp,
|
|
15407
|
+
onOpenChange: setOpenProp,
|
|
15408
|
+
variant = "default",
|
|
15409
|
+
collapsible = "offcanvas",
|
|
15410
|
+
side = "left",
|
|
15411
|
+
className,
|
|
15412
|
+
style,
|
|
15413
|
+
children,
|
|
15414
|
+
...rest
|
|
15415
|
+
}, ref) {
|
|
15416
|
+
const isMobile = useIsMobile();
|
|
15417
|
+
const [openMobile, setOpenMobile] = React.useState(false);
|
|
15418
|
+
const isControlled = openProp !== void 0;
|
|
15419
|
+
const [_open, _setOpen] = React.useState(defaultOpen);
|
|
15420
|
+
const open = isControlled ? openProp : _open;
|
|
15421
|
+
const setOpen = React.useCallback(
|
|
15422
|
+
(value) => {
|
|
15423
|
+
const openState = typeof value === "function" ? value(open) : value;
|
|
15424
|
+
if (setOpenProp) {
|
|
15425
|
+
setOpenProp(openState);
|
|
15426
|
+
} else {
|
|
15427
|
+
_setOpen(openState);
|
|
15428
|
+
}
|
|
15429
|
+
try {
|
|
15430
|
+
document.cookie = `${SIDEBAR_COOKIE_NAME}=${openState}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`;
|
|
15431
|
+
} catch {
|
|
15432
|
+
}
|
|
15269
15433
|
},
|
|
15270
|
-
|
|
15271
|
-
|
|
15272
|
-
|
|
15273
|
-
|
|
15274
|
-
|
|
15275
|
-
|
|
15276
|
-
|
|
15277
|
-
);
|
|
15278
|
-
});
|
|
15279
|
-
Sidebar.displayName = "Sidebar";
|
|
15280
|
-
var SidebarToggle = React.forwardRef(
|
|
15281
|
-
function SidebarToggle2({ className, children, ...rest }, ref) {
|
|
15282
|
-
const { collapsed, setCollapsed } = useSidebarContext();
|
|
15283
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
15284
|
-
"button",
|
|
15285
|
-
{
|
|
15286
|
-
ref,
|
|
15287
|
-
type: "button",
|
|
15288
|
-
onClick: () => setCollapsed(!collapsed),
|
|
15289
|
-
"aria-label": collapsed ? "Expand sidebar" : "Collapse sidebar",
|
|
15290
|
-
"aria-expanded": !collapsed,
|
|
15291
|
-
className: chunk4ON3M3OM_cjs.cn(
|
|
15292
|
-
"inline-flex items-center justify-center size-8 rounded-md",
|
|
15293
|
-
"text-muted-foreground hover:text-foreground hover:bg-accent",
|
|
15294
|
-
"transition-colors duration-fast",
|
|
15295
|
-
chunk3EHT6IOA_cjs.focusRingClasses,
|
|
15296
|
-
className
|
|
15297
|
-
),
|
|
15298
|
-
"data-ds-component": "sidebar-toggle",
|
|
15299
|
-
...rest,
|
|
15300
|
-
children: children ?? (collapsed ? /* @__PURE__ */ jsxRuntime.jsx(ChevronRightIcon7, { className: "size-4" }) : /* @__PURE__ */ jsxRuntime.jsx(ChevronLeftIcon3, { className: "size-4" }))
|
|
15434
|
+
[setOpenProp, open]
|
|
15435
|
+
);
|
|
15436
|
+
const toggleSidebar = React.useCallback(() => {
|
|
15437
|
+
if (isMobile) {
|
|
15438
|
+
setOpenMobile((prev) => !prev);
|
|
15439
|
+
} else {
|
|
15440
|
+
setOpen((prev) => !prev);
|
|
15301
15441
|
}
|
|
15442
|
+
}, [isMobile, setOpen]);
|
|
15443
|
+
React.useEffect(() => {
|
|
15444
|
+
const handleKeyDown = (e) => {
|
|
15445
|
+
if (e.key === SIDEBAR_KEYBOARD_SHORTCUT && (e.metaKey || e.ctrlKey)) {
|
|
15446
|
+
e.preventDefault();
|
|
15447
|
+
toggleSidebar();
|
|
15448
|
+
}
|
|
15449
|
+
};
|
|
15450
|
+
window.addEventListener("keydown", handleKeyDown);
|
|
15451
|
+
return () => window.removeEventListener("keydown", handleKeyDown);
|
|
15452
|
+
}, [toggleSidebar]);
|
|
15453
|
+
const state = open ? "expanded" : "collapsed";
|
|
15454
|
+
const contextValue = React.useMemo(
|
|
15455
|
+
() => ({
|
|
15456
|
+
state,
|
|
15457
|
+
open,
|
|
15458
|
+
setOpen,
|
|
15459
|
+
openMobile,
|
|
15460
|
+
setOpenMobile,
|
|
15461
|
+
isMobile,
|
|
15462
|
+
toggleSidebar,
|
|
15463
|
+
variant,
|
|
15464
|
+
collapsible,
|
|
15465
|
+
side
|
|
15466
|
+
}),
|
|
15467
|
+
[
|
|
15468
|
+
state,
|
|
15469
|
+
open,
|
|
15470
|
+
setOpen,
|
|
15471
|
+
openMobile,
|
|
15472
|
+
setOpenMobile,
|
|
15473
|
+
isMobile,
|
|
15474
|
+
toggleSidebar,
|
|
15475
|
+
variant,
|
|
15476
|
+
collapsible,
|
|
15477
|
+
side
|
|
15478
|
+
]
|
|
15302
15479
|
);
|
|
15303
|
-
|
|
15304
|
-
);
|
|
15305
|
-
SidebarToggle.displayName = "SidebarToggle";
|
|
15306
|
-
var SidebarHeader = React.forwardRef(
|
|
15307
|
-
function SidebarHeader2({ className, children, ...rest }, ref) {
|
|
15308
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
15480
|
+
return /* @__PURE__ */ jsxRuntime.jsx(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsx(radixUi.Tooltip.Provider, { delayDuration: 0, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
15309
15481
|
"div",
|
|
15310
15482
|
{
|
|
15311
15483
|
ref,
|
|
15312
15484
|
className: chunk4ON3M3OM_cjs.cn(
|
|
15313
|
-
"
|
|
15485
|
+
"group/sidebar-wrapper flex min-h-svh w-full",
|
|
15486
|
+
"has-data-[variant=inset]:bg-sidebar",
|
|
15314
15487
|
className
|
|
15315
15488
|
),
|
|
15316
|
-
|
|
15317
|
-
|
|
15318
|
-
|
|
15319
|
-
|
|
15320
|
-
|
|
15321
|
-
|
|
15322
|
-
|
|
15323
|
-
SidebarHeader.displayName = "SidebarHeader";
|
|
15324
|
-
var SidebarContent = React.forwardRef(
|
|
15325
|
-
function SidebarContent2({ className, children, ...rest }, ref) {
|
|
15326
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
15327
|
-
"div",
|
|
15328
|
-
{
|
|
15329
|
-
ref,
|
|
15330
|
-
className: chunk4ON3M3OM_cjs.cn("flex-1 overflow-y-auto py-2", className),
|
|
15331
|
-
"data-ds-component": "sidebar-content",
|
|
15489
|
+
style: {
|
|
15490
|
+
"--sidebar-width": SIDEBAR_WIDTH,
|
|
15491
|
+
"--sidebar-width-icon": SIDEBAR_WIDTH_ICON,
|
|
15492
|
+
...style
|
|
15493
|
+
},
|
|
15494
|
+
"data-ds": "",
|
|
15495
|
+
"data-ds-component": "sidebar-provider",
|
|
15332
15496
|
...rest,
|
|
15333
15497
|
children
|
|
15334
15498
|
}
|
|
15335
|
-
);
|
|
15499
|
+
) }) });
|
|
15336
15500
|
}
|
|
15337
15501
|
);
|
|
15338
|
-
|
|
15339
|
-
var
|
|
15340
|
-
function
|
|
15341
|
-
|
|
15342
|
-
|
|
15343
|
-
|
|
15344
|
-
|
|
15345
|
-
|
|
15346
|
-
|
|
15347
|
-
|
|
15348
|
-
|
|
15502
|
+
SidebarProvider.displayName = "SidebarProvider";
|
|
15503
|
+
var Sidebar = React.forwardRef(
|
|
15504
|
+
function Sidebar2({
|
|
15505
|
+
side: sideProp,
|
|
15506
|
+
variant: variantProp,
|
|
15507
|
+
collapsible: collapsibleProp,
|
|
15508
|
+
className,
|
|
15509
|
+
children,
|
|
15510
|
+
...rest
|
|
15511
|
+
}, ref) {
|
|
15512
|
+
const ctx = useSidebar();
|
|
15513
|
+
const side = sideProp ?? ctx.side;
|
|
15514
|
+
const variant = variantProp ?? ctx.variant;
|
|
15515
|
+
const collapsible = collapsibleProp ?? ctx.collapsible;
|
|
15516
|
+
const shouldReduce = framerMotion.useReducedMotion();
|
|
15517
|
+
if (collapsible === "none") {
|
|
15518
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
15519
|
+
"div",
|
|
15520
|
+
{
|
|
15521
|
+
ref,
|
|
15522
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
15523
|
+
"flex h-full w-[--sidebar-width] flex-col bg-sidebar text-sidebar-foreground",
|
|
15524
|
+
className
|
|
15525
|
+
),
|
|
15526
|
+
"data-ds": "",
|
|
15527
|
+
"data-ds-component": "sidebar",
|
|
15528
|
+
...rest,
|
|
15529
|
+
children
|
|
15530
|
+
}
|
|
15531
|
+
);
|
|
15532
|
+
}
|
|
15533
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
15534
|
+
ctx.isMobile && /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children: ctx.openMobile && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
15535
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
15536
|
+
framerMotion.motion.div,
|
|
15537
|
+
{
|
|
15538
|
+
className: "fixed inset-0 z-50 bg-black/50 backdrop-blur-sm",
|
|
15539
|
+
variants: shouldReduce ? void 0 : chunkF4JJFWWU_cjs.overlayBackdrop.variants,
|
|
15540
|
+
initial: shouldReduce ? { opacity: 0 } : "initial",
|
|
15541
|
+
animate: shouldReduce ? { opacity: 1 } : "animate",
|
|
15542
|
+
exit: shouldReduce ? { opacity: 0 } : "exit",
|
|
15543
|
+
transition: shouldReduce ? { duration: 0.15 } : chunkF4JJFWWU_cjs.overlayBackdrop.transition,
|
|
15544
|
+
onClick: () => ctx.setOpenMobile(false),
|
|
15545
|
+
"data-ds-animated": ""
|
|
15546
|
+
}
|
|
15547
|
+
),
|
|
15548
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
15549
|
+
framerMotion.motion.div,
|
|
15550
|
+
{
|
|
15551
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
15552
|
+
"fixed inset-y-0 z-50 flex w-[--sidebar-width-mobile] flex-col bg-sidebar text-sidebar-foreground",
|
|
15553
|
+
"p-0 shadow-lg",
|
|
15554
|
+
side === "left" ? "left-0 border-r border-sidebar-border" : "right-0 border-l border-sidebar-border",
|
|
15555
|
+
className
|
|
15556
|
+
),
|
|
15557
|
+
style: {
|
|
15558
|
+
"--sidebar-width-mobile": SIDEBAR_WIDTH_MOBILE
|
|
15559
|
+
},
|
|
15560
|
+
initial: {
|
|
15561
|
+
x: side === "left" ? "-100%" : "100%",
|
|
15562
|
+
opacity: shouldReduce ? 0 : 1
|
|
15563
|
+
},
|
|
15564
|
+
animate: {
|
|
15565
|
+
x: 0,
|
|
15566
|
+
opacity: 1
|
|
15567
|
+
},
|
|
15568
|
+
exit: {
|
|
15569
|
+
x: side === "left" ? "-100%" : "100%",
|
|
15570
|
+
opacity: shouldReduce ? 0 : 1
|
|
15571
|
+
},
|
|
15572
|
+
transition: shouldReduce ? { duration: 0.15 } : {
|
|
15573
|
+
type: "spring",
|
|
15574
|
+
stiffness: 300,
|
|
15575
|
+
damping: 30,
|
|
15576
|
+
mass: 0.8
|
|
15577
|
+
},
|
|
15578
|
+
"data-ds": "",
|
|
15579
|
+
"data-ds-component": "sidebar",
|
|
15580
|
+
"data-variant": variant,
|
|
15581
|
+
"data-side": side,
|
|
15582
|
+
"data-mobile": "",
|
|
15583
|
+
"data-ds-animated": "",
|
|
15584
|
+
children
|
|
15585
|
+
}
|
|
15586
|
+
)
|
|
15587
|
+
] }) }),
|
|
15588
|
+
!ctx.isMobile && /* @__PURE__ */ jsxRuntime.jsxs(
|
|
15589
|
+
"div",
|
|
15590
|
+
{
|
|
15591
|
+
ref,
|
|
15592
|
+
className: "group peer hidden md:block text-sidebar-foreground",
|
|
15593
|
+
"data-state": ctx.state,
|
|
15594
|
+
"data-collapsible": ctx.state === "collapsed" ? collapsible : "",
|
|
15595
|
+
"data-variant": variant,
|
|
15596
|
+
"data-side": side,
|
|
15597
|
+
children: [
|
|
15598
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
15599
|
+
framerMotion.motion.div,
|
|
15600
|
+
{
|
|
15601
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
15602
|
+
"relative h-svh bg-transparent",
|
|
15603
|
+
"duration-200 ease-linear",
|
|
15604
|
+
variant === "floating" || variant === "inset" ? "w-[calc(var(--sidebar-width)+(--spacing(4)))]" : "w-[--sidebar-width]"
|
|
15605
|
+
),
|
|
15606
|
+
animate: {
|
|
15607
|
+
width: ctx.state === "collapsed" ? collapsible === "offcanvas" ? "0px" : variant === "floating" || variant === "inset" ? "calc(var(--sidebar-width-icon) + theme(spacing.4) + 2px)" : "var(--sidebar-width-icon)" : variant === "floating" || variant === "inset" ? "calc(var(--sidebar-width) + theme(spacing.4))" : "var(--sidebar-width)"
|
|
15608
|
+
},
|
|
15609
|
+
transition: shouldReduce ? { duration: 0 } : { duration: 0.2, ease: [0.25, 0.1, 0.25, 1] }
|
|
15610
|
+
}
|
|
15611
|
+
),
|
|
15612
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
15613
|
+
framerMotion.motion.div,
|
|
15614
|
+
{
|
|
15615
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
15616
|
+
"fixed inset-y-0 z-10 hidden h-svh md:flex flex-col",
|
|
15617
|
+
side === "left" ? "left-0" : "right-0",
|
|
15618
|
+
// Variant styles
|
|
15619
|
+
variant === "floating" && "m-2 rounded-lg border border-sidebar-border shadow-lg overflow-hidden",
|
|
15620
|
+
variant === "inset" && "m-2 rounded-lg overflow-hidden",
|
|
15621
|
+
variant === "default" && chunk4ON3M3OM_cjs.cn(
|
|
15622
|
+
"border-sidebar-border",
|
|
15623
|
+
side === "left" ? "border-r" : "border-l"
|
|
15624
|
+
),
|
|
15625
|
+
"bg-sidebar text-sidebar-foreground",
|
|
15626
|
+
className
|
|
15627
|
+
),
|
|
15628
|
+
animate: {
|
|
15629
|
+
width: ctx.state === "collapsed" ? collapsible === "offcanvas" ? "0px" : "var(--sidebar-width-icon)" : "var(--sidebar-width)"
|
|
15630
|
+
},
|
|
15631
|
+
transition: shouldReduce ? { duration: 0 } : { duration: 0.2, ease: [0.25, 0.1, 0.25, 1] },
|
|
15632
|
+
"data-ds": "",
|
|
15633
|
+
"data-ds-component": "sidebar",
|
|
15634
|
+
"data-variant": variant,
|
|
15635
|
+
"data-side": side,
|
|
15636
|
+
"data-state": ctx.state,
|
|
15637
|
+
"data-collapsible": ctx.state === "collapsed" ? collapsible : "",
|
|
15638
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
15639
|
+
"div",
|
|
15640
|
+
{
|
|
15641
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
15642
|
+
"flex h-full w-full flex-col",
|
|
15643
|
+
"group-data-[collapsible=offcanvas]:opacity-0 group-data-[collapsible=offcanvas]:pointer-events-none"
|
|
15644
|
+
),
|
|
15645
|
+
"data-sidebar": "content-wrapper",
|
|
15646
|
+
children
|
|
15647
|
+
}
|
|
15648
|
+
)
|
|
15649
|
+
}
|
|
15650
|
+
)
|
|
15651
|
+
]
|
|
15652
|
+
}
|
|
15653
|
+
)
|
|
15654
|
+
] });
|
|
15655
|
+
}
|
|
15656
|
+
);
|
|
15657
|
+
Sidebar.displayName = "Sidebar";
|
|
15658
|
+
var SidebarTrigger = React.forwardRef(function SidebarTrigger2({ className, onClick, children, ...rest }, ref) {
|
|
15659
|
+
const { toggleSidebar, state, isMobile } = useSidebar();
|
|
15660
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
15661
|
+
"button",
|
|
15662
|
+
{
|
|
15663
|
+
ref,
|
|
15664
|
+
type: "button",
|
|
15665
|
+
onClick: (e) => {
|
|
15666
|
+
onClick?.(e);
|
|
15667
|
+
toggleSidebar();
|
|
15668
|
+
},
|
|
15669
|
+
"aria-label": state === "expanded" ? "Collapse sidebar" : "Expand sidebar",
|
|
15670
|
+
"aria-expanded": state === "expanded",
|
|
15671
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
15672
|
+
"inline-flex items-center justify-center size-8 shrink-0 rounded-md",
|
|
15673
|
+
"text-muted-foreground hover:text-foreground hover:bg-accent",
|
|
15674
|
+
"transition-colors duration-fast",
|
|
15675
|
+
chunk3EHT6IOA_cjs.focusRingClasses,
|
|
15676
|
+
className
|
|
15677
|
+
),
|
|
15678
|
+
"data-ds": "",
|
|
15679
|
+
"data-ds-component": "sidebar-trigger",
|
|
15680
|
+
...rest,
|
|
15681
|
+
children: [
|
|
15682
|
+
children ?? /* @__PURE__ */ jsxRuntime.jsx(PanelLeftIcon, { className: "size-4" }),
|
|
15683
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Toggle Sidebar" })
|
|
15684
|
+
]
|
|
15685
|
+
}
|
|
15686
|
+
);
|
|
15687
|
+
});
|
|
15688
|
+
SidebarTrigger.displayName = "SidebarTrigger";
|
|
15689
|
+
var SidebarToggle = SidebarTrigger;
|
|
15690
|
+
var SidebarRail = React.forwardRef(
|
|
15691
|
+
function SidebarRail2({ className, ...rest }, ref) {
|
|
15692
|
+
const { toggleSidebar, side } = useSidebar();
|
|
15693
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
15694
|
+
"button",
|
|
15695
|
+
{
|
|
15696
|
+
ref,
|
|
15697
|
+
type: "button",
|
|
15698
|
+
tabIndex: -1,
|
|
15699
|
+
"aria-label": "Toggle Sidebar",
|
|
15700
|
+
onClick: toggleSidebar,
|
|
15701
|
+
title: "Toggle Sidebar",
|
|
15702
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
15703
|
+
"absolute inset-y-0 z-20 hidden w-4 -translate-x-1/2 md:flex items-center justify-center",
|
|
15704
|
+
"after:absolute after:inset-y-0 after:left-1/2 after:w-0.5",
|
|
15705
|
+
"hover:after:bg-sidebar-border",
|
|
15706
|
+
"transition-all duration-fast ease-linear",
|
|
15707
|
+
"group-data-[side=left]:right-0 group-data-[side=right]:left-0",
|
|
15708
|
+
side === "left" ? "cursor-w-resize group-data-[state=collapsed]:cursor-e-resize" : "cursor-e-resize group-data-[state=collapsed]:cursor-w-resize",
|
|
15709
|
+
"[[data-side=left][data-state=collapsed]_&]:cursor-e-resize",
|
|
15710
|
+
"[[data-side=right][data-state=collapsed]_&]:cursor-w-resize",
|
|
15711
|
+
className
|
|
15712
|
+
),
|
|
15713
|
+
"data-ds": "",
|
|
15714
|
+
"data-ds-component": "sidebar-rail",
|
|
15715
|
+
...rest
|
|
15716
|
+
}
|
|
15717
|
+
);
|
|
15718
|
+
}
|
|
15719
|
+
);
|
|
15720
|
+
SidebarRail.displayName = "SidebarRail";
|
|
15721
|
+
var SidebarInset = React.forwardRef(
|
|
15722
|
+
function SidebarInset2({ className, children, ...rest }, ref) {
|
|
15723
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
15724
|
+
"main",
|
|
15725
|
+
{
|
|
15726
|
+
ref,
|
|
15727
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
15728
|
+
"relative flex min-h-svh flex-1 flex-col bg-background",
|
|
15729
|
+
"peer-data-[variant=inset]:min-h-[calc(100svh-(--spacing(4)))]",
|
|
15730
|
+
"md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0",
|
|
15731
|
+
"md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow-sm",
|
|
15732
|
+
className
|
|
15733
|
+
),
|
|
15734
|
+
"data-ds": "",
|
|
15735
|
+
"data-ds-component": "sidebar-inset",
|
|
15736
|
+
...rest,
|
|
15737
|
+
children
|
|
15738
|
+
}
|
|
15739
|
+
);
|
|
15740
|
+
}
|
|
15741
|
+
);
|
|
15742
|
+
SidebarInset.displayName = "SidebarInset";
|
|
15743
|
+
var SidebarHeader = React.forwardRef(
|
|
15744
|
+
function SidebarHeader2({ className, children, ...rest }, ref) {
|
|
15745
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
15746
|
+
"div",
|
|
15747
|
+
{
|
|
15748
|
+
ref,
|
|
15749
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
15750
|
+
"flex flex-col gap-2 p-2",
|
|
15751
|
+
"group-data-[collapsible=icon]:items-center group-data-[collapsible=icon]:px-1.5",
|
|
15752
|
+
className
|
|
15753
|
+
),
|
|
15754
|
+
"data-ds": "",
|
|
15755
|
+
"data-ds-component": "sidebar-header",
|
|
15756
|
+
"data-sidebar": "header",
|
|
15757
|
+
...rest,
|
|
15758
|
+
children
|
|
15759
|
+
}
|
|
15760
|
+
);
|
|
15761
|
+
}
|
|
15762
|
+
);
|
|
15763
|
+
SidebarHeader.displayName = "SidebarHeader";
|
|
15764
|
+
var SidebarContent = React.forwardRef(
|
|
15765
|
+
function SidebarContent2({ className, children, ...rest }, ref) {
|
|
15766
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
15767
|
+
"div",
|
|
15768
|
+
{
|
|
15769
|
+
ref,
|
|
15770
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
15771
|
+
"flex min-h-0 flex-1 flex-col gap-2 overflow-y-auto overflow-x-hidden",
|
|
15772
|
+
"group-data-[collapsible=icon]:items-center",
|
|
15773
|
+
className
|
|
15774
|
+
),
|
|
15775
|
+
"data-ds": "",
|
|
15776
|
+
"data-ds-component": "sidebar-content",
|
|
15777
|
+
"data-sidebar": "content",
|
|
15778
|
+
...rest,
|
|
15779
|
+
children
|
|
15780
|
+
}
|
|
15781
|
+
);
|
|
15782
|
+
}
|
|
15783
|
+
);
|
|
15784
|
+
SidebarContent.displayName = "SidebarContent";
|
|
15785
|
+
var SidebarFooter = React.forwardRef(
|
|
15786
|
+
function SidebarFooter2({ className, children, ...rest }, ref) {
|
|
15787
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
15788
|
+
"div",
|
|
15789
|
+
{
|
|
15790
|
+
ref,
|
|
15791
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
15792
|
+
"flex flex-col gap-2 p-2",
|
|
15793
|
+
"group-data-[collapsible=icon]:items-center group-data-[collapsible=icon]:px-1.5",
|
|
15794
|
+
className
|
|
15795
|
+
),
|
|
15796
|
+
"data-ds": "",
|
|
15797
|
+
"data-ds-component": "sidebar-footer",
|
|
15798
|
+
"data-sidebar": "footer",
|
|
15799
|
+
...rest,
|
|
15800
|
+
children
|
|
15349
15801
|
}
|
|
15350
15802
|
);
|
|
15351
15803
|
}
|
|
15352
15804
|
);
|
|
15353
15805
|
SidebarFooter.displayName = "SidebarFooter";
|
|
15354
|
-
var
|
|
15355
|
-
|
|
15356
|
-
|
|
15357
|
-
|
|
15806
|
+
var SidebarSeparator = React.forwardRef(function SidebarSeparator2({ className, ...rest }, ref) {
|
|
15807
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
15808
|
+
"hr",
|
|
15809
|
+
{
|
|
15810
|
+
ref,
|
|
15811
|
+
className: chunk4ON3M3OM_cjs.cn("mx-2 w-auto border-sidebar-border", className),
|
|
15812
|
+
"data-ds": "",
|
|
15813
|
+
"data-ds-component": "sidebar-separator",
|
|
15814
|
+
"data-sidebar": "separator",
|
|
15815
|
+
...rest
|
|
15816
|
+
}
|
|
15817
|
+
);
|
|
15818
|
+
});
|
|
15819
|
+
SidebarSeparator.displayName = "SidebarSeparator";
|
|
15820
|
+
var SidebarInput = React.forwardRef(
|
|
15821
|
+
function SidebarInput2({ className, ...rest }, ref) {
|
|
15822
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
15823
|
+
"input",
|
|
15824
|
+
{
|
|
15825
|
+
ref,
|
|
15826
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
15827
|
+
"h-8 w-full rounded-md border border-sidebar-border bg-background px-3",
|
|
15828
|
+
"text-sm text-sidebar-foreground placeholder:text-sidebar-foreground/50",
|
|
15829
|
+
"transition-[border-color,box-shadow] duration-fast",
|
|
15830
|
+
"focus:border-sidebar-ring focus:outline-none focus:ring-2 focus:ring-sidebar-ring/20",
|
|
15831
|
+
className
|
|
15832
|
+
),
|
|
15833
|
+
"data-ds": "",
|
|
15834
|
+
"data-ds-component": "sidebar-input",
|
|
15835
|
+
"data-sidebar": "input",
|
|
15836
|
+
...rest
|
|
15837
|
+
}
|
|
15838
|
+
);
|
|
15839
|
+
}
|
|
15840
|
+
);
|
|
15841
|
+
SidebarInput.displayName = "SidebarInput";
|
|
15842
|
+
var SidebarGroup = React.forwardRef(
|
|
15843
|
+
function SidebarGroup2({ className, children, ...rest }, ref) {
|
|
15844
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
15358
15845
|
"div",
|
|
15359
15846
|
{
|
|
15360
15847
|
ref,
|
|
15361
|
-
className: chunk4ON3M3OM_cjs.cn(
|
|
15362
|
-
|
|
15848
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
15849
|
+
"relative flex w-full min-w-0 flex-col p-2",
|
|
15850
|
+
"group-data-[collapsible=icon]:items-center group-data-[collapsible=icon]:px-1.5",
|
|
15851
|
+
className
|
|
15852
|
+
),
|
|
15853
|
+
"data-ds": "",
|
|
15854
|
+
"data-ds-component": "sidebar-group",
|
|
15855
|
+
"data-sidebar": "group",
|
|
15363
15856
|
...rest,
|
|
15364
|
-
children
|
|
15365
|
-
|
|
15366
|
-
|
|
15367
|
-
|
|
15368
|
-
|
|
15369
|
-
|
|
15370
|
-
|
|
15371
|
-
|
|
15372
|
-
|
|
15373
|
-
|
|
15374
|
-
|
|
15375
|
-
|
|
15376
|
-
|
|
15377
|
-
|
|
15378
|
-
|
|
15857
|
+
children
|
|
15858
|
+
}
|
|
15859
|
+
);
|
|
15860
|
+
}
|
|
15861
|
+
);
|
|
15862
|
+
SidebarGroup.displayName = "SidebarGroup";
|
|
15863
|
+
var SidebarGroupLabel = React.forwardRef(function SidebarGroupLabel2({ className, asChild = false, children, ...rest }, ref) {
|
|
15864
|
+
const { state } = useSidebar();
|
|
15865
|
+
const classes = chunk4ON3M3OM_cjs.cn(
|
|
15866
|
+
"flex h-8 shrink-0 items-center rounded-md px-2",
|
|
15867
|
+
"text-xs font-medium text-sidebar-foreground/70",
|
|
15868
|
+
"outline-none ring-sidebar-ring",
|
|
15869
|
+
"transition-[margin,opacity,padding] duration-200 ease-linear",
|
|
15870
|
+
// When collapsed to icon mode, hide label
|
|
15871
|
+
state === "collapsed" && "opacity-0 overflow-hidden h-0 p-0 m-0",
|
|
15872
|
+
className
|
|
15873
|
+
);
|
|
15874
|
+
if (asChild) {
|
|
15875
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
15876
|
+
"div",
|
|
15877
|
+
{
|
|
15878
|
+
ref,
|
|
15879
|
+
className: classes,
|
|
15880
|
+
"data-ds": "",
|
|
15881
|
+
"data-ds-component": "sidebar-group-label",
|
|
15882
|
+
"data-sidebar": "group-label",
|
|
15883
|
+
...rest,
|
|
15884
|
+
children
|
|
15885
|
+
}
|
|
15886
|
+
);
|
|
15887
|
+
}
|
|
15888
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
15889
|
+
"div",
|
|
15890
|
+
{
|
|
15891
|
+
ref,
|
|
15892
|
+
className: classes,
|
|
15893
|
+
"data-ds": "",
|
|
15894
|
+
"data-ds-component": "sidebar-group-label",
|
|
15895
|
+
"data-sidebar": "group-label",
|
|
15896
|
+
...rest,
|
|
15897
|
+
children
|
|
15898
|
+
}
|
|
15899
|
+
);
|
|
15900
|
+
});
|
|
15901
|
+
SidebarGroupLabel.displayName = "SidebarGroupLabel";
|
|
15902
|
+
var SidebarGroupAction = React.forwardRef(function SidebarGroupAction2({ className, children, ...rest }, ref) {
|
|
15903
|
+
const { state } = useSidebar();
|
|
15904
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
15905
|
+
"button",
|
|
15906
|
+
{
|
|
15907
|
+
ref,
|
|
15908
|
+
type: "button",
|
|
15909
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
15910
|
+
"absolute right-3 top-3.5 flex items-center justify-center",
|
|
15911
|
+
"size-5 rounded-md p-0",
|
|
15912
|
+
"text-sidebar-foreground/70 ring-sidebar-ring",
|
|
15913
|
+
"outline-none",
|
|
15914
|
+
"hover:bg-sidebar-accent hover:text-sidebar-accent-foreground",
|
|
15915
|
+
"transition-transform duration-200",
|
|
15916
|
+
chunk3EHT6IOA_cjs.focusRingClasses,
|
|
15917
|
+
"[&>svg]:size-4 [&>svg]:shrink-0",
|
|
15918
|
+
// When icon-collapsed, hide
|
|
15919
|
+
state === "collapsed" && "hidden",
|
|
15920
|
+
className
|
|
15921
|
+
),
|
|
15922
|
+
"data-ds": "",
|
|
15923
|
+
"data-ds-component": "sidebar-group-action",
|
|
15924
|
+
"data-sidebar": "group-action",
|
|
15925
|
+
...rest,
|
|
15926
|
+
children
|
|
15927
|
+
}
|
|
15928
|
+
);
|
|
15929
|
+
});
|
|
15930
|
+
SidebarGroupAction.displayName = "SidebarGroupAction";
|
|
15931
|
+
var SidebarGroupContent = React.forwardRef(function SidebarGroupContent2({ className, children, ...rest }, ref) {
|
|
15932
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
15933
|
+
"div",
|
|
15934
|
+
{
|
|
15935
|
+
ref,
|
|
15936
|
+
className: chunk4ON3M3OM_cjs.cn("w-full text-sm", className),
|
|
15937
|
+
"data-ds": "",
|
|
15938
|
+
"data-ds-component": "sidebar-group-content",
|
|
15939
|
+
"data-sidebar": "group-content",
|
|
15940
|
+
...rest,
|
|
15941
|
+
children
|
|
15942
|
+
}
|
|
15943
|
+
);
|
|
15944
|
+
});
|
|
15945
|
+
SidebarGroupContent.displayName = "SidebarGroupContent";
|
|
15946
|
+
var SidebarMenu = React.forwardRef(
|
|
15947
|
+
function SidebarMenu2({ className, children, ...rest }, ref) {
|
|
15948
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
15949
|
+
"ul",
|
|
15950
|
+
{
|
|
15951
|
+
ref,
|
|
15952
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
15953
|
+
"flex w-full min-w-0 flex-col gap-1 list-none m-0 p-0",
|
|
15954
|
+
"group-data-[collapsible=icon]:items-center",
|
|
15955
|
+
className
|
|
15956
|
+
),
|
|
15957
|
+
"data-ds": "",
|
|
15958
|
+
"data-ds-component": "sidebar-menu",
|
|
15959
|
+
"data-sidebar": "menu",
|
|
15960
|
+
...rest,
|
|
15961
|
+
children
|
|
15379
15962
|
}
|
|
15380
15963
|
);
|
|
15381
15964
|
}
|
|
15382
15965
|
);
|
|
15383
|
-
|
|
15966
|
+
SidebarMenu.displayName = "SidebarMenu";
|
|
15967
|
+
var SidebarMenuItem = React.forwardRef(function SidebarMenuItem2({ className, children, ...rest }, ref) {
|
|
15968
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
15969
|
+
"li",
|
|
15970
|
+
{
|
|
15971
|
+
ref,
|
|
15972
|
+
className: chunk4ON3M3OM_cjs.cn("group/menu-item relative list-none m-0 p-0", className),
|
|
15973
|
+
"data-ds": "",
|
|
15974
|
+
"data-ds-component": "sidebar-menu-item",
|
|
15975
|
+
"data-sidebar": "menu-item",
|
|
15976
|
+
...rest,
|
|
15977
|
+
children
|
|
15978
|
+
}
|
|
15979
|
+
);
|
|
15980
|
+
});
|
|
15981
|
+
SidebarMenuItem.displayName = "SidebarMenuItem";
|
|
15982
|
+
var SidebarMenuButton = React.forwardRef(function SidebarMenuButton2({
|
|
15983
|
+
isActive = false,
|
|
15984
|
+
size = "default",
|
|
15985
|
+
variant = "default",
|
|
15986
|
+
tooltip,
|
|
15987
|
+
asChild = false,
|
|
15988
|
+
className,
|
|
15989
|
+
children,
|
|
15990
|
+
...rest
|
|
15991
|
+
}, ref) {
|
|
15992
|
+
const { state, isMobile, collapsible } = useSidebar();
|
|
15993
|
+
const isCollapsed = state === "collapsed" && collapsible === "icon";
|
|
15994
|
+
const lgExpandedLayout = !isCollapsed ? [
|
|
15995
|
+
"[&>*:nth-child(2)]:flex-1 [&>*:nth-child(2)]:min-w-0",
|
|
15996
|
+
"[&>*:nth-child(2)]:grid [&>*:nth-child(2)]:text-left [&>*:nth-child(2)]:text-sm [&>*:nth-child(2)]:leading-tight",
|
|
15997
|
+
"[&>*:nth-child(2)_span]:truncate",
|
|
15998
|
+
"[&>svg:last-child]:ml-auto [&>svg:last-child]:shrink-0"
|
|
15999
|
+
].join(" ") : "";
|
|
16000
|
+
const sizeClasses3 = {
|
|
16001
|
+
sm: "h-7 text-xs",
|
|
16002
|
+
default: "h-8 text-sm",
|
|
16003
|
+
lg: [
|
|
16004
|
+
"h-12 text-sm",
|
|
16005
|
+
lgExpandedLayout,
|
|
16006
|
+
// lg collapsed: shrink height to match default buttons and scale
|
|
16007
|
+
// the first-child wrapper (logo div, Avatar) to 24px so it fits
|
|
16008
|
+
// neatly inside the 32px collapsed button.
|
|
16009
|
+
"group-data-[collapsible=icon]:!h-8",
|
|
16010
|
+
"group-data-[collapsible=icon]:[&>:first-child]:!size-6",
|
|
16011
|
+
"group-data-[collapsible=icon]:[&>:first-child]:shrink-0",
|
|
16012
|
+
"group-data-[collapsible=icon]:[&>:first-child]:overflow-hidden",
|
|
16013
|
+
"group-data-[collapsible=icon]:[&>:first-child]:rounded-md"
|
|
16014
|
+
].join(" ")
|
|
16015
|
+
};
|
|
16016
|
+
const buttonClasses = chunk4ON3M3OM_cjs.cn(
|
|
16017
|
+
// Base
|
|
16018
|
+
"peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2",
|
|
16019
|
+
"outline-none ring-sidebar-ring",
|
|
16020
|
+
"transition-[width,height,padding] duration-200 ease-linear",
|
|
16021
|
+
chunk3EHT6IOA_cjs.focusRingClasses,
|
|
16022
|
+
// Active & hover states
|
|
16023
|
+
"hover:bg-sidebar-accent hover:text-sidebar-accent-foreground",
|
|
16024
|
+
"active:bg-sidebar-accent active:text-sidebar-accent-foreground",
|
|
16025
|
+
// Size
|
|
16026
|
+
sizeClasses3[size],
|
|
16027
|
+
// Variant
|
|
16028
|
+
variant === "outline" && "bg-background shadow-[0_0_0_1px_var(--sidebar-border)] hover:shadow-[0_0_0_1px_var(--sidebar-accent)]",
|
|
16029
|
+
// Active
|
|
16030
|
+
isActive && "bg-sidebar-accent text-sidebar-accent-foreground font-medium",
|
|
16031
|
+
// Icon collapse — fixed 32px button, no padding, center the icon,
|
|
16032
|
+
// hide everything except the first child (icon/avatar).
|
|
16033
|
+
// Plain <svg> icons stay at size-4 (16px); lg wrapper divs are
|
|
16034
|
+
// handled separately by the lg sizeClass above.
|
|
16035
|
+
isCollapsed && "!size-8 !p-0 !gap-0 justify-center [&>*:not(:first-child)]:hidden [&>svg]:size-4",
|
|
16036
|
+
// Disabled
|
|
16037
|
+
"disabled:pointer-events-none disabled:opacity-50",
|
|
16038
|
+
// Icon sizing
|
|
16039
|
+
"[&>svg]:size-4 [&>svg]:shrink-0",
|
|
16040
|
+
className
|
|
16041
|
+
);
|
|
16042
|
+
const button = asChild ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
16043
|
+
"span",
|
|
16044
|
+
{
|
|
16045
|
+
ref,
|
|
16046
|
+
className: buttonClasses,
|
|
16047
|
+
"data-ds": "",
|
|
16048
|
+
"data-ds-component": "sidebar-menu-button",
|
|
16049
|
+
"data-sidebar": "menu-button",
|
|
16050
|
+
"data-size": size,
|
|
16051
|
+
"data-active": isActive ? "" : void 0,
|
|
16052
|
+
children
|
|
16053
|
+
}
|
|
16054
|
+
) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
16055
|
+
"button",
|
|
16056
|
+
{
|
|
16057
|
+
ref,
|
|
16058
|
+
type: "button",
|
|
16059
|
+
className: buttonClasses,
|
|
16060
|
+
"aria-current": isActive ? "page" : void 0,
|
|
16061
|
+
"data-ds": "",
|
|
16062
|
+
"data-ds-component": "sidebar-menu-button",
|
|
16063
|
+
"data-sidebar": "menu-button",
|
|
16064
|
+
"data-size": size,
|
|
16065
|
+
"data-active": isActive ? "" : void 0,
|
|
16066
|
+
...rest,
|
|
16067
|
+
children
|
|
16068
|
+
}
|
|
16069
|
+
);
|
|
16070
|
+
if (!tooltip || isMobile) {
|
|
16071
|
+
return button;
|
|
16072
|
+
}
|
|
16073
|
+
if (!isCollapsed) {
|
|
16074
|
+
return button;
|
|
16075
|
+
}
|
|
16076
|
+
const tooltipContent = typeof tooltip === "string" ? tooltip : tooltip;
|
|
16077
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(radixUi.Tooltip.Root, { children: [
|
|
16078
|
+
/* @__PURE__ */ jsxRuntime.jsx(radixUi.Tooltip.Trigger, { asChild: true, children: button }),
|
|
16079
|
+
/* @__PURE__ */ jsxRuntime.jsx(radixUi.Tooltip.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
16080
|
+
radixUi.Tooltip.Content,
|
|
16081
|
+
{
|
|
16082
|
+
side: "right",
|
|
16083
|
+
align: "center",
|
|
16084
|
+
sideOffset: 4,
|
|
16085
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
16086
|
+
"z-(--z-tooltip,9999)",
|
|
16087
|
+
"overflow-hidden rounded-md px-3 py-1.5",
|
|
16088
|
+
"bg-sidebar-primary text-sidebar-primary-foreground",
|
|
16089
|
+
"text-xs font-medium",
|
|
16090
|
+
"animate-in fade-in-0 zoom-in-95",
|
|
16091
|
+
"data-[side=right]:slide-in-from-left-2"
|
|
16092
|
+
),
|
|
16093
|
+
children: tooltipContent
|
|
16094
|
+
}
|
|
16095
|
+
) })
|
|
16096
|
+
] });
|
|
16097
|
+
});
|
|
16098
|
+
SidebarMenuButton.displayName = "SidebarMenuButton";
|
|
16099
|
+
var SidebarMenuAction = React.forwardRef(function SidebarMenuAction2({ showOnHover = false, className, children, ...rest }, ref) {
|
|
16100
|
+
const { state } = useSidebar();
|
|
16101
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
16102
|
+
"button",
|
|
16103
|
+
{
|
|
16104
|
+
ref,
|
|
16105
|
+
type: "button",
|
|
16106
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
16107
|
+
"absolute right-1 top-1.5 flex items-center justify-center",
|
|
16108
|
+
"size-5 rounded-md p-0",
|
|
16109
|
+
"text-sidebar-foreground/70 outline-none ring-sidebar-ring",
|
|
16110
|
+
"hover:bg-sidebar-accent hover:text-sidebar-accent-foreground",
|
|
16111
|
+
"transition-opacity duration-fast",
|
|
16112
|
+
chunk3EHT6IOA_cjs.focusRingClasses,
|
|
16113
|
+
"[&>svg]:size-4 [&>svg]:shrink-0",
|
|
16114
|
+
// Show on hover only
|
|
16115
|
+
showOnHover && "opacity-0 group-hover/menu-item:opacity-100 group-focus-within/menu-item:opacity-100 peer-data-active/menu-button:text-sidebar-accent-foreground",
|
|
16116
|
+
// Hide when collapsed to icon mode
|
|
16117
|
+
state === "collapsed" && "hidden",
|
|
16118
|
+
className
|
|
16119
|
+
),
|
|
16120
|
+
"data-ds": "",
|
|
16121
|
+
"data-ds-component": "sidebar-menu-action",
|
|
16122
|
+
"data-sidebar": "menu-action",
|
|
16123
|
+
...rest,
|
|
16124
|
+
children
|
|
16125
|
+
}
|
|
16126
|
+
);
|
|
16127
|
+
});
|
|
16128
|
+
SidebarMenuAction.displayName = "SidebarMenuAction";
|
|
16129
|
+
var SidebarMenuBadge = React.forwardRef(function SidebarMenuBadge2({ className, children, ...rest }, ref) {
|
|
16130
|
+
const { state } = useSidebar();
|
|
16131
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
16132
|
+
"div",
|
|
16133
|
+
{
|
|
16134
|
+
ref,
|
|
16135
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
16136
|
+
"absolute right-1 flex h-5 min-w-5 items-center justify-center rounded-md px-1",
|
|
16137
|
+
"text-xs font-medium tabular-nums text-sidebar-foreground",
|
|
16138
|
+
"select-none pointer-events-none",
|
|
16139
|
+
// Hide when collapsed
|
|
16140
|
+
state === "collapsed" && "hidden",
|
|
16141
|
+
className
|
|
16142
|
+
),
|
|
16143
|
+
"data-ds": "",
|
|
16144
|
+
"data-ds-component": "sidebar-menu-badge",
|
|
16145
|
+
"data-sidebar": "menu-badge",
|
|
16146
|
+
...rest,
|
|
16147
|
+
children
|
|
16148
|
+
}
|
|
16149
|
+
);
|
|
16150
|
+
});
|
|
16151
|
+
SidebarMenuBadge.displayName = "SidebarMenuBadge";
|
|
16152
|
+
var SidebarMenuSkeleton = React.forwardRef(function SidebarMenuSkeleton2({ className, showIcon = false, ...rest }, ref) {
|
|
16153
|
+
const width = React.useMemo(() => {
|
|
16154
|
+
return `${Math.floor(Math.random() * 40) + 50}%`;
|
|
16155
|
+
}, []);
|
|
16156
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
16157
|
+
"div",
|
|
16158
|
+
{
|
|
16159
|
+
ref,
|
|
16160
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
16161
|
+
"flex h-8 items-center gap-2 rounded-md px-2",
|
|
16162
|
+
className
|
|
16163
|
+
),
|
|
16164
|
+
"data-ds": "",
|
|
16165
|
+
"data-ds-component": "sidebar-menu-skeleton",
|
|
16166
|
+
"data-sidebar": "menu-skeleton",
|
|
16167
|
+
...rest,
|
|
16168
|
+
children: [
|
|
16169
|
+
showIcon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "size-4 rounded-md bg-sidebar-accent animate-pulse" }),
|
|
16170
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
16171
|
+
"div",
|
|
16172
|
+
{
|
|
16173
|
+
className: "h-4 max-w-[--skeleton-width] flex-1 rounded-md bg-sidebar-accent animate-pulse",
|
|
16174
|
+
style: { "--skeleton-width": width }
|
|
16175
|
+
}
|
|
16176
|
+
)
|
|
16177
|
+
]
|
|
16178
|
+
}
|
|
16179
|
+
);
|
|
16180
|
+
});
|
|
16181
|
+
SidebarMenuSkeleton.displayName = "SidebarMenuSkeleton";
|
|
16182
|
+
var SidebarMenuSub = React.forwardRef(function SidebarMenuSub2({ className, children, ...rest }, ref) {
|
|
16183
|
+
const { state } = useSidebar();
|
|
16184
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
16185
|
+
"ul",
|
|
16186
|
+
{
|
|
16187
|
+
ref,
|
|
16188
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
16189
|
+
"mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 list-none m-0 p-0",
|
|
16190
|
+
"border-l border-sidebar-border pl-2.5 py-0.5",
|
|
16191
|
+
// Hide when collapsed to icon
|
|
16192
|
+
state === "collapsed" && "hidden",
|
|
16193
|
+
className
|
|
16194
|
+
),
|
|
16195
|
+
"data-ds": "",
|
|
16196
|
+
"data-ds-component": "sidebar-menu-sub",
|
|
16197
|
+
"data-sidebar": "menu-sub",
|
|
16198
|
+
...rest,
|
|
16199
|
+
children
|
|
16200
|
+
}
|
|
16201
|
+
);
|
|
16202
|
+
});
|
|
16203
|
+
SidebarMenuSub.displayName = "SidebarMenuSub";
|
|
16204
|
+
var SidebarMenuSubItem = React.forwardRef(function SidebarMenuSubItem2({ className, children, ...rest }, ref) {
|
|
16205
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
16206
|
+
"li",
|
|
16207
|
+
{
|
|
16208
|
+
ref,
|
|
16209
|
+
className: chunk4ON3M3OM_cjs.cn("list-none m-0 p-0", className),
|
|
16210
|
+
"data-ds": "",
|
|
16211
|
+
"data-ds-component": "sidebar-menu-sub-item",
|
|
16212
|
+
"data-sidebar": "menu-sub-item",
|
|
16213
|
+
...rest,
|
|
16214
|
+
children
|
|
16215
|
+
}
|
|
16216
|
+
);
|
|
16217
|
+
});
|
|
16218
|
+
SidebarMenuSubItem.displayName = "SidebarMenuSubItem";
|
|
16219
|
+
var SidebarMenuSubButton = React.forwardRef(function SidebarMenuSubButton2({ isActive = false, size = "md", className, children, ...rest }, ref) {
|
|
16220
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
16221
|
+
"a",
|
|
16222
|
+
{
|
|
16223
|
+
ref,
|
|
16224
|
+
className: chunk4ON3M3OM_cjs.cn(
|
|
16225
|
+
"flex min-w-0 items-center gap-2 overflow-hidden rounded-md px-2 no-underline",
|
|
16226
|
+
"text-sidebar-foreground/70 outline-none ring-sidebar-ring",
|
|
16227
|
+
"transition-colors duration-fast",
|
|
16228
|
+
"hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:no-underline",
|
|
16229
|
+
chunk3EHT6IOA_cjs.focusRingClasses,
|
|
16230
|
+
size === "sm" ? "h-6 text-xs" : "h-7 text-xs",
|
|
16231
|
+
isActive && "bg-sidebar-accent text-sidebar-accent-foreground font-medium",
|
|
16232
|
+
"disabled:pointer-events-none disabled:opacity-50",
|
|
16233
|
+
"[&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:text-sidebar-accent-foreground",
|
|
16234
|
+
className
|
|
16235
|
+
),
|
|
16236
|
+
"aria-current": isActive ? "page" : void 0,
|
|
16237
|
+
"data-ds": "",
|
|
16238
|
+
"data-ds-component": "sidebar-menu-sub-button",
|
|
16239
|
+
"data-sidebar": "menu-sub-button",
|
|
16240
|
+
"data-active": isActive ? "" : void 0,
|
|
16241
|
+
...rest,
|
|
16242
|
+
children
|
|
16243
|
+
}
|
|
16244
|
+
);
|
|
16245
|
+
});
|
|
16246
|
+
SidebarMenuSubButton.displayName = "SidebarMenuSubButton";
|
|
16247
|
+
var SidebarSection = SidebarGroup;
|
|
15384
16248
|
var SidebarItem = React.forwardRef(
|
|
15385
16249
|
function SidebarItem2({
|
|
15386
16250
|
icon,
|
|
@@ -15392,12 +16256,14 @@ var SidebarItem = React.forwardRef(
|
|
|
15392
16256
|
className,
|
|
15393
16257
|
children,
|
|
15394
16258
|
...rest
|
|
15395
|
-
},
|
|
15396
|
-
const {
|
|
16259
|
+
}, ref) {
|
|
16260
|
+
const { state } = useSidebar();
|
|
16261
|
+
const isCollapsed = state === "collapsed";
|
|
15397
16262
|
const Tag3 = href ? "a" : "button";
|
|
15398
16263
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
15399
16264
|
Tag3,
|
|
15400
16265
|
{
|
|
16266
|
+
ref,
|
|
15401
16267
|
href,
|
|
15402
16268
|
type: href ? void 0 : "button",
|
|
15403
16269
|
disabled,
|
|
@@ -15408,17 +16274,18 @@ var SidebarItem = React.forwardRef(
|
|
|
15408
16274
|
"transition-colors duration-fast",
|
|
15409
16275
|
"disabled:pointer-events-none disabled:opacity-50",
|
|
15410
16276
|
chunk3EHT6IOA_cjs.focusRingClasses,
|
|
15411
|
-
active ? "bg-accent text-accent-foreground" : "text-
|
|
15412
|
-
|
|
16277
|
+
active ? "bg-sidebar-accent text-sidebar-accent-foreground" : "text-sidebar-foreground/70 hover:text-sidebar-foreground hover:bg-sidebar-accent/60",
|
|
16278
|
+
isCollapsed && "justify-center",
|
|
15413
16279
|
className
|
|
15414
16280
|
),
|
|
15415
|
-
title:
|
|
16281
|
+
title: isCollapsed && typeof label === "string" ? label : void 0,
|
|
16282
|
+
"data-ds": "",
|
|
15416
16283
|
"data-ds-component": "sidebar-item",
|
|
15417
16284
|
"data-ds-active": active ? "" : void 0,
|
|
15418
16285
|
...rest,
|
|
15419
16286
|
children: [
|
|
15420
16287
|
icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 size-5 flex items-center justify-center", children: icon }),
|
|
15421
|
-
/* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children: !
|
|
16288
|
+
/* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children: !isCollapsed && (label || children) && /* @__PURE__ */ jsxRuntime.jsx(
|
|
15422
16289
|
framerMotion.motion.span,
|
|
15423
16290
|
{
|
|
15424
16291
|
className: "flex-1 truncate",
|
|
@@ -15430,32 +16297,15 @@ var SidebarItem = React.forwardRef(
|
|
|
15430
16297
|
children: label ?? children
|
|
15431
16298
|
}
|
|
15432
16299
|
) }),
|
|
15433
|
-
badge && !
|
|
16300
|
+
badge && !isCollapsed && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0", children: badge })
|
|
15434
16301
|
]
|
|
15435
16302
|
}
|
|
15436
16303
|
);
|
|
15437
16304
|
}
|
|
15438
16305
|
);
|
|
15439
16306
|
SidebarItem.displayName = "SidebarItem";
|
|
15440
|
-
function SidebarMobileOverlay(
|
|
15441
|
-
|
|
15442
|
-
const shouldReduce = framerMotion.useReducedMotion();
|
|
15443
|
-
return /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children: mobileOpen && /* @__PURE__ */ jsxRuntime.jsx(
|
|
15444
|
-
framerMotion.motion.div,
|
|
15445
|
-
{
|
|
15446
|
-
className: chunk4ON3M3OM_cjs.cn(
|
|
15447
|
-
"fixed inset-0 z-overlay bg-black/50 backdrop-blur-sm md:hidden",
|
|
15448
|
-
className
|
|
15449
|
-
),
|
|
15450
|
-
variants: shouldReduce ? void 0 : chunkF4JJFWWU_cjs.overlayBackdrop.variants,
|
|
15451
|
-
initial: shouldReduce ? { opacity: 0 } : "initial",
|
|
15452
|
-
animate: shouldReduce ? { opacity: 1 } : "animate",
|
|
15453
|
-
exit: shouldReduce ? { opacity: 0 } : "exit",
|
|
15454
|
-
transition: shouldReduce ? { duration: 0.15 } : chunkF4JJFWWU_cjs.overlayBackdrop.transition,
|
|
15455
|
-
onClick: () => setMobileOpen(false),
|
|
15456
|
-
"data-ds-animated": ""
|
|
15457
|
-
}
|
|
15458
|
-
) });
|
|
16307
|
+
function SidebarMobileOverlay(_props) {
|
|
16308
|
+
return null;
|
|
15459
16309
|
}
|
|
15460
16310
|
SidebarMobileOverlay.displayName = "SidebarMobileOverlay";
|
|
15461
16311
|
var skeletonVariants = classVarianceAuthority.cva(
|
|
@@ -16563,11 +17413,11 @@ var Switch = React.forwardRef(function Switch2({
|
|
|
16563
17413
|
const [internalChecked, setInternalChecked] = React.useState(
|
|
16564
17414
|
checked ?? defaultChecked ?? false
|
|
16565
17415
|
);
|
|
16566
|
-
React.
|
|
16567
|
-
|
|
16568
|
-
|
|
16569
|
-
|
|
16570
|
-
}
|
|
17416
|
+
const [prevChecked, setPrevChecked] = React.useState(checked);
|
|
17417
|
+
if (isControlled && checked !== prevChecked) {
|
|
17418
|
+
setPrevChecked(checked);
|
|
17419
|
+
setInternalChecked(checked);
|
|
17420
|
+
}
|
|
16571
17421
|
const handleCheckedChange = React.useCallback(
|
|
16572
17422
|
(value) => {
|
|
16573
17423
|
if (!isControlled) {
|
|
@@ -16599,7 +17449,7 @@ var Switch = React.forwardRef(function Switch2({
|
|
|
16599
17449
|
if (!label) {
|
|
16600
17450
|
return switchElement;
|
|
16601
17451
|
}
|
|
16602
|
-
const labelBlock = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-0.5", children: [
|
|
17452
|
+
const labelBlock = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-0.5 flex-1 min-w-0", children: [
|
|
16603
17453
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
16604
17454
|
"label",
|
|
16605
17455
|
{
|
|
@@ -16631,7 +17481,7 @@ var Switch = React.forwardRef(function Switch2({
|
|
|
16631
17481
|
"div",
|
|
16632
17482
|
{
|
|
16633
17483
|
className: chunk4ON3M3OM_cjs.cn(
|
|
16634
|
-
"
|
|
17484
|
+
"flex items-center gap-3",
|
|
16635
17485
|
// Reverse order when label is on the left
|
|
16636
17486
|
labelPosition === "left" ? "flex-row" : "flex-row-reverse",
|
|
16637
17487
|
// Align to start when description is present
|
|
@@ -17082,20 +17932,17 @@ var Textarea = React.forwardRef(
|
|
|
17082
17932
|
...rest
|
|
17083
17933
|
}, ref) {
|
|
17084
17934
|
const internalRef = React.useRef(null);
|
|
17085
|
-
const [
|
|
17086
|
-
|
|
17087
|
-
|
|
17088
|
-
|
|
17089
|
-
});
|
|
17090
|
-
const adjustHeight = useAutoResize(internalRef, autoResize, maxHeight);
|
|
17091
|
-
React.useEffect(() => {
|
|
17092
|
-
if (value !== void 0) {
|
|
17093
|
-
setCharCount(String(value).length);
|
|
17935
|
+
const [uncontrolledCharCount, setUncontrolledCharCount] = React.useState(
|
|
17936
|
+
() => {
|
|
17937
|
+
if (defaultValue !== void 0) return String(defaultValue).length;
|
|
17938
|
+
return 0;
|
|
17094
17939
|
}
|
|
17095
|
-
|
|
17940
|
+
);
|
|
17941
|
+
const charCount = value !== void 0 ? String(value).length : uncontrolledCharCount;
|
|
17942
|
+
const adjustHeight = useAutoResize(internalRef, autoResize, maxHeight);
|
|
17096
17943
|
const handleChange = React.useCallback(
|
|
17097
17944
|
(e) => {
|
|
17098
|
-
|
|
17945
|
+
setUncontrolledCharCount(e.target.value.length);
|
|
17099
17946
|
adjustHeight();
|
|
17100
17947
|
onChange?.(e);
|
|
17101
17948
|
},
|
|
@@ -18430,13 +19277,15 @@ var ColorPicker = React.forwardRef(
|
|
|
18430
19277
|
const [hue, setHue] = React.useState(hsl.h);
|
|
18431
19278
|
const [sat, setSat] = React.useState(hsl.s);
|
|
18432
19279
|
const [lit, setLit] = React.useState(hsl.l);
|
|
18433
|
-
React.
|
|
19280
|
+
const [prevValue, setPrevValue] = React.useState(currentValue);
|
|
19281
|
+
if (currentValue !== prevValue) {
|
|
19282
|
+
setPrevValue(currentValue);
|
|
18434
19283
|
const parsed = hexToHsl(currentValue);
|
|
18435
19284
|
setHue(parsed.h);
|
|
18436
19285
|
setSat(parsed.s);
|
|
18437
19286
|
setLit(parsed.l);
|
|
18438
19287
|
setHexInput(currentValue);
|
|
18439
|
-
}
|
|
19288
|
+
}
|
|
18440
19289
|
const updateColor = React.useCallback(
|
|
18441
19290
|
(hex) => {
|
|
18442
19291
|
if (!value) setInternalValue(hex);
|
|
@@ -18733,7 +19582,7 @@ var SonnerToaster = React.forwardRef(
|
|
|
18733
19582
|
}
|
|
18734
19583
|
);
|
|
18735
19584
|
SonnerToaster.displayName = "SonnerToaster";
|
|
18736
|
-
function
|
|
19585
|
+
function ChevronRightIcon7({ className }) {
|
|
18737
19586
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
18738
19587
|
"svg",
|
|
18739
19588
|
{
|
|
@@ -18961,7 +19810,7 @@ function TreeItem({ node, depth }) {
|
|
|
18961
19810
|
tabIndex: node.disabled ? -1 : 0,
|
|
18962
19811
|
children: [
|
|
18963
19812
|
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex size-4 items-center justify-center shrink-0", children: hasChildren && /* @__PURE__ */ jsxRuntime.jsx(
|
|
18964
|
-
|
|
19813
|
+
ChevronRightIcon7,
|
|
18965
19814
|
{
|
|
18966
19815
|
className: chunk4ON3M3OM_cjs.cn(
|
|
18967
19816
|
"size-3.5 text-muted-foreground transition-transform duration-fast",
|
|
@@ -19283,7 +20132,7 @@ function XIcon6({ className }) {
|
|
|
19283
20132
|
}
|
|
19284
20133
|
);
|
|
19285
20134
|
}
|
|
19286
|
-
function
|
|
20135
|
+
function ChevronLeftIcon3({ className }) {
|
|
19287
20136
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
19288
20137
|
"svg",
|
|
19289
20138
|
{
|
|
@@ -19300,7 +20149,7 @@ function ChevronLeftIcon4({ className }) {
|
|
|
19300
20149
|
}
|
|
19301
20150
|
);
|
|
19302
20151
|
}
|
|
19303
|
-
function
|
|
20152
|
+
function ChevronRightIcon8({ className }) {
|
|
19304
20153
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
19305
20154
|
"svg",
|
|
19306
20155
|
{
|
|
@@ -19451,7 +20300,7 @@ function Lightbox({
|
|
|
19451
20300
|
onClick: prev,
|
|
19452
20301
|
className: "absolute left-3 z-10 inline-flex size-10 items-center justify-center rounded-full bg-black/50 text-white/80 hover:bg-black/70 hover:text-white transition-colors",
|
|
19453
20302
|
"aria-label": "Previous image",
|
|
19454
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
20303
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(ChevronLeftIcon3, { className: "size-5" })
|
|
19455
20304
|
}
|
|
19456
20305
|
),
|
|
19457
20306
|
/* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { mode: "wait", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -19479,7 +20328,7 @@ function Lightbox({
|
|
|
19479
20328
|
onClick: next,
|
|
19480
20329
|
className: "absolute right-3 z-10 inline-flex size-10 items-center justify-center rounded-full bg-black/50 text-white/80 hover:bg-black/70 hover:text-white transition-colors",
|
|
19481
20330
|
"aria-label": "Next image",
|
|
19482
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
20331
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(ChevronRightIcon8, { className: "size-5" })
|
|
19483
20332
|
}
|
|
19484
20333
|
)
|
|
19485
20334
|
] }),
|
|
@@ -20230,10 +21079,12 @@ var DataTableToolbar = React.forwardRef(function DataTableToolbar2({
|
|
|
20230
21079
|
className
|
|
20231
21080
|
}, ref) {
|
|
20232
21081
|
const [localSearch, setLocalSearch] = React.useState(searchValue);
|
|
20233
|
-
const
|
|
20234
|
-
|
|
21082
|
+
const [prevSearchValue, setPrevSearchValue] = React.useState(searchValue);
|
|
21083
|
+
if (searchValue !== prevSearchValue) {
|
|
21084
|
+
setPrevSearchValue(searchValue);
|
|
20235
21085
|
setLocalSearch(searchValue);
|
|
20236
|
-
}
|
|
21086
|
+
}
|
|
21087
|
+
const debounceTimer = React.useRef(null);
|
|
20237
21088
|
const handleSearchChange = React.useCallback(
|
|
20238
21089
|
(value) => {
|
|
20239
21090
|
setLocalSearch(value);
|
|
@@ -20835,6 +21686,7 @@ exports.SelectScrollUpButton = SelectScrollUpButton;
|
|
|
20835
21686
|
exports.SelectSeparator = SelectSeparator;
|
|
20836
21687
|
exports.SelectTrigger = SelectTrigger;
|
|
20837
21688
|
exports.SelectValue = SelectValue;
|
|
21689
|
+
exports.Separator = Separator2;
|
|
20838
21690
|
exports.Sheet = Sheet;
|
|
20839
21691
|
exports.SheetClose = SheetClose;
|
|
20840
21692
|
exports.SheetContent = SheetContent;
|
|
@@ -20846,12 +21698,30 @@ exports.SheetTrigger = SheetTrigger;
|
|
|
20846
21698
|
exports.Sidebar = Sidebar;
|
|
20847
21699
|
exports.SidebarContent = SidebarContent;
|
|
20848
21700
|
exports.SidebarFooter = SidebarFooter;
|
|
21701
|
+
exports.SidebarGroup = SidebarGroup;
|
|
21702
|
+
exports.SidebarGroupAction = SidebarGroupAction;
|
|
21703
|
+
exports.SidebarGroupContent = SidebarGroupContent;
|
|
21704
|
+
exports.SidebarGroupLabel = SidebarGroupLabel;
|
|
20849
21705
|
exports.SidebarHeader = SidebarHeader;
|
|
21706
|
+
exports.SidebarInput = SidebarInput;
|
|
21707
|
+
exports.SidebarInset = SidebarInset;
|
|
20850
21708
|
exports.SidebarItem = SidebarItem;
|
|
21709
|
+
exports.SidebarMenu = SidebarMenu;
|
|
21710
|
+
exports.SidebarMenuAction = SidebarMenuAction;
|
|
21711
|
+
exports.SidebarMenuBadge = SidebarMenuBadge;
|
|
21712
|
+
exports.SidebarMenuButton = SidebarMenuButton;
|
|
21713
|
+
exports.SidebarMenuItem = SidebarMenuItem;
|
|
21714
|
+
exports.SidebarMenuSkeleton = SidebarMenuSkeleton;
|
|
21715
|
+
exports.SidebarMenuSub = SidebarMenuSub;
|
|
21716
|
+
exports.SidebarMenuSubButton = SidebarMenuSubButton;
|
|
21717
|
+
exports.SidebarMenuSubItem = SidebarMenuSubItem;
|
|
20851
21718
|
exports.SidebarMobileOverlay = SidebarMobileOverlay;
|
|
20852
21719
|
exports.SidebarProvider = SidebarProvider;
|
|
21720
|
+
exports.SidebarRail = SidebarRail;
|
|
20853
21721
|
exports.SidebarSection = SidebarSection;
|
|
21722
|
+
exports.SidebarSeparator = SidebarSeparator;
|
|
20854
21723
|
exports.SidebarToggle = SidebarToggle;
|
|
21724
|
+
exports.SidebarTrigger = SidebarTrigger;
|
|
20855
21725
|
exports.Skeleton = Skeleton;
|
|
20856
21726
|
exports.SkeletonCircle = SkeletonCircle;
|
|
20857
21727
|
exports.SkeletonRect = SkeletonRect;
|
|
@@ -20927,6 +21797,7 @@ exports.scrollbarThumbVariants = scrollbarThumbVariants;
|
|
|
20927
21797
|
exports.scrollbarVariants = scrollbarVariants;
|
|
20928
21798
|
exports.searchInputVariants = searchInputVariants;
|
|
20929
21799
|
exports.selectTriggerVariants = selectTriggerVariants;
|
|
21800
|
+
exports.separatorVariants = separatorVariants;
|
|
20930
21801
|
exports.sheetContentVariants = sheetContentVariants;
|
|
20931
21802
|
exports.skeletonVariants = skeletonVariants;
|
|
20932
21803
|
exports.sliderRangeVariants = sliderRangeVariants;
|
|
@@ -20949,6 +21820,7 @@ exports.useCarouselContext = useCarouselContext;
|
|
|
20949
21820
|
exports.useCheckboxGroupContext = useCheckboxGroupContext;
|
|
20950
21821
|
exports.useCollapsibleContext = useCollapsibleContext;
|
|
20951
21822
|
exports.useDataTable = useDataTable;
|
|
21823
|
+
exports.useSidebar = useSidebar;
|
|
20952
21824
|
exports.useSidebarContext = useSidebarContext;
|
|
20953
21825
|
exports.useToast = useToast;
|
|
20954
21826
|
exports.useToggleGroupContext = useToggleGroupContext;
|