@prediktif/ui 0.1.6 → 0.1.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +60 -1
- package/dist/index.d.ts +60 -1
- package/dist/index.js +771 -2
- package/dist/index.mjs +746 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -148,26 +148,195 @@ var buttonVariants = cva(
|
|
|
148
148
|
}
|
|
149
149
|
}
|
|
150
150
|
);
|
|
151
|
+
function Button(_a) {
|
|
152
|
+
var _b = _a, {
|
|
153
|
+
className,
|
|
154
|
+
variant = "default",
|
|
155
|
+
size = "default"
|
|
156
|
+
} = _b, props = __objRest(_b, [
|
|
157
|
+
"className",
|
|
158
|
+
"variant",
|
|
159
|
+
"size"
|
|
160
|
+
]);
|
|
161
|
+
return /* @__PURE__ */ jsx3(
|
|
162
|
+
ButtonPrimitive,
|
|
163
|
+
__spreadValues({
|
|
164
|
+
"data-slot": "button",
|
|
165
|
+
className: cn2(buttonVariants({ variant, size, className }))
|
|
166
|
+
}, props)
|
|
167
|
+
);
|
|
168
|
+
}
|
|
151
169
|
|
|
152
170
|
// src/components/ui/input.tsx
|
|
153
171
|
import { Input as InputPrimitive } from "@base-ui/react/input";
|
|
154
172
|
import { cn as cn3 } from "cn";
|
|
155
173
|
import { jsx as jsx4 } from "react/jsx-runtime";
|
|
174
|
+
function Input(_a) {
|
|
175
|
+
var _b = _a, { className, type } = _b, props = __objRest(_b, ["className", "type"]);
|
|
176
|
+
return /* @__PURE__ */ jsx4(
|
|
177
|
+
InputPrimitive,
|
|
178
|
+
__spreadValues({
|
|
179
|
+
type,
|
|
180
|
+
"data-slot": "input",
|
|
181
|
+
className: cn3(
|
|
182
|
+
"h-7 w-full min-w-0 rounded-md border border-input bg-input/20 px-2 py-0.5 text-sm transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-xs/relaxed file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/30 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-2 aria-invalid:ring-destructive/20 md:text-xs/relaxed dark:bg-input/30 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40",
|
|
183
|
+
className
|
|
184
|
+
)
|
|
185
|
+
}, props)
|
|
186
|
+
);
|
|
187
|
+
}
|
|
156
188
|
|
|
157
189
|
// src/components/ui/separator.tsx
|
|
158
190
|
import { Separator as SeparatorPrimitive } from "@base-ui/react/separator";
|
|
159
191
|
import { cn as cn4 } from "cn";
|
|
160
192
|
import { jsx as jsx5 } from "react/jsx-runtime";
|
|
193
|
+
function Separator(_a) {
|
|
194
|
+
var _b = _a, {
|
|
195
|
+
className,
|
|
196
|
+
orientation = "horizontal"
|
|
197
|
+
} = _b, props = __objRest(_b, [
|
|
198
|
+
"className",
|
|
199
|
+
"orientation"
|
|
200
|
+
]);
|
|
201
|
+
return /* @__PURE__ */ jsx5(
|
|
202
|
+
SeparatorPrimitive,
|
|
203
|
+
__spreadValues({
|
|
204
|
+
"data-slot": "separator",
|
|
205
|
+
orientation,
|
|
206
|
+
className: cn4(
|
|
207
|
+
"shrink-0 bg-border data-horizontal:h-px data-horizontal:w-full data-vertical:w-px data-vertical:self-stretch",
|
|
208
|
+
className
|
|
209
|
+
)
|
|
210
|
+
}, props)
|
|
211
|
+
);
|
|
212
|
+
}
|
|
161
213
|
|
|
162
214
|
// src/components/ui/sheet.tsx
|
|
163
215
|
import { Dialog as SheetPrimitive } from "@base-ui/react/dialog";
|
|
164
216
|
import { cn as cn5 } from "cn";
|
|
165
217
|
import { XIcon } from "lucide-react";
|
|
166
218
|
import { jsx as jsx6, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
219
|
+
function Sheet(_a) {
|
|
220
|
+
var props = __objRest(_a, []);
|
|
221
|
+
return /* @__PURE__ */ jsx6(SheetPrimitive.Root, __spreadValues({ "data-slot": "sheet" }, props));
|
|
222
|
+
}
|
|
223
|
+
function SheetPortal(_a) {
|
|
224
|
+
var props = __objRest(_a, []);
|
|
225
|
+
return /* @__PURE__ */ jsx6(SheetPrimitive.Portal, __spreadValues({ "data-slot": "sheet-portal" }, props));
|
|
226
|
+
}
|
|
227
|
+
function SheetOverlay(_a) {
|
|
228
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
229
|
+
return /* @__PURE__ */ jsx6(
|
|
230
|
+
SheetPrimitive.Backdrop,
|
|
231
|
+
__spreadValues({
|
|
232
|
+
"data-slot": "sheet-overlay",
|
|
233
|
+
className: cn5(
|
|
234
|
+
"fixed inset-0 z-50 bg-black/80 transition-opacity duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0 supports-backdrop-filter:backdrop-blur-xs",
|
|
235
|
+
className
|
|
236
|
+
)
|
|
237
|
+
}, props)
|
|
238
|
+
);
|
|
239
|
+
}
|
|
240
|
+
function SheetContent(_a) {
|
|
241
|
+
var _b = _a, {
|
|
242
|
+
className,
|
|
243
|
+
children,
|
|
244
|
+
side = "right",
|
|
245
|
+
showCloseButton = true
|
|
246
|
+
} = _b, props = __objRest(_b, [
|
|
247
|
+
"className",
|
|
248
|
+
"children",
|
|
249
|
+
"side",
|
|
250
|
+
"showCloseButton"
|
|
251
|
+
]);
|
|
252
|
+
return /* @__PURE__ */ jsxs2(SheetPortal, { children: [
|
|
253
|
+
/* @__PURE__ */ jsx6(SheetOverlay, {}),
|
|
254
|
+
/* @__PURE__ */ jsxs2(
|
|
255
|
+
SheetPrimitive.Popup,
|
|
256
|
+
__spreadProps(__spreadValues({
|
|
257
|
+
"data-slot": "sheet-content",
|
|
258
|
+
"data-side": side,
|
|
259
|
+
className: cn5(
|
|
260
|
+
"fixed z-50 flex flex-col bg-popover bg-clip-padding text-xs/relaxed text-popover-foreground shadow-lg transition duration-200 ease-in-out data-ending-style:opacity-0 data-starting-style:opacity-0 data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-0 data-[side=bottom]:h-auto data-[side=bottom]:border-t data-[side=bottom]:data-ending-style:translate-y-[2.5rem] data-[side=bottom]:data-starting-style:translate-y-[2.5rem] data-[side=left]:inset-y-0 data-[side=left]:left-0 data-[side=left]:h-full data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=left]:data-ending-style:translate-x-[-2.5rem] data-[side=left]:data-starting-style:translate-x-[-2.5rem] data-[side=right]:inset-y-0 data-[side=right]:right-0 data-[side=right]:h-full data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=right]:data-ending-style:translate-x-[2.5rem] data-[side=right]:data-starting-style:translate-x-[2.5rem] data-[side=top]:inset-x-0 data-[side=top]:top-0 data-[side=top]:h-auto data-[side=top]:border-b data-[side=top]:data-ending-style:translate-y-[-2.5rem] data-[side=top]:data-starting-style:translate-y-[-2.5rem] data-[side=left]:sm:max-w-sm data-[side=right]:sm:max-w-sm",
|
|
261
|
+
className
|
|
262
|
+
)
|
|
263
|
+
}, props), {
|
|
264
|
+
children: [
|
|
265
|
+
children,
|
|
266
|
+
showCloseButton && /* @__PURE__ */ jsxs2(
|
|
267
|
+
SheetPrimitive.Close,
|
|
268
|
+
{
|
|
269
|
+
"data-slot": "sheet-close",
|
|
270
|
+
render: /* @__PURE__ */ jsx6(
|
|
271
|
+
Button,
|
|
272
|
+
{
|
|
273
|
+
variant: "ghost",
|
|
274
|
+
className: "absolute top-4 right-4",
|
|
275
|
+
size: "icon-sm"
|
|
276
|
+
}
|
|
277
|
+
),
|
|
278
|
+
children: [
|
|
279
|
+
/* @__PURE__ */ jsx6(XIcon, {}),
|
|
280
|
+
/* @__PURE__ */ jsx6("span", { className: "sr-only", children: "Close" })
|
|
281
|
+
]
|
|
282
|
+
}
|
|
283
|
+
)
|
|
284
|
+
]
|
|
285
|
+
})
|
|
286
|
+
)
|
|
287
|
+
] });
|
|
288
|
+
}
|
|
289
|
+
function SheetHeader(_a) {
|
|
290
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
291
|
+
return /* @__PURE__ */ jsx6(
|
|
292
|
+
"div",
|
|
293
|
+
__spreadValues({
|
|
294
|
+
"data-slot": "sheet-header",
|
|
295
|
+
className: cn5("flex flex-col gap-1.5 p-6", className)
|
|
296
|
+
}, props)
|
|
297
|
+
);
|
|
298
|
+
}
|
|
299
|
+
function SheetTitle(_a) {
|
|
300
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
301
|
+
return /* @__PURE__ */ jsx6(
|
|
302
|
+
SheetPrimitive.Title,
|
|
303
|
+
__spreadValues({
|
|
304
|
+
"data-slot": "sheet-title",
|
|
305
|
+
className: cn5(
|
|
306
|
+
"font-heading text-sm font-medium text-foreground",
|
|
307
|
+
className
|
|
308
|
+
)
|
|
309
|
+
}, props)
|
|
310
|
+
);
|
|
311
|
+
}
|
|
312
|
+
function SheetDescription(_a) {
|
|
313
|
+
var _b = _a, {
|
|
314
|
+
className
|
|
315
|
+
} = _b, props = __objRest(_b, [
|
|
316
|
+
"className"
|
|
317
|
+
]);
|
|
318
|
+
return /* @__PURE__ */ jsx6(
|
|
319
|
+
SheetPrimitive.Description,
|
|
320
|
+
__spreadValues({
|
|
321
|
+
"data-slot": "sheet-description",
|
|
322
|
+
className: cn5("text-xs/relaxed text-muted-foreground", className)
|
|
323
|
+
}, props)
|
|
324
|
+
);
|
|
325
|
+
}
|
|
167
326
|
|
|
168
327
|
// src/components/ui/skeleton.tsx
|
|
169
328
|
import { cn as cn6 } from "cn";
|
|
170
329
|
import { jsx as jsx7 } from "react/jsx-runtime";
|
|
330
|
+
function Skeleton(_a) {
|
|
331
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
332
|
+
return /* @__PURE__ */ jsx7(
|
|
333
|
+
"div",
|
|
334
|
+
__spreadValues({
|
|
335
|
+
"data-slot": "skeleton",
|
|
336
|
+
className: cn6("animate-pulse rounded-md bg-muted", className)
|
|
337
|
+
}, props)
|
|
338
|
+
);
|
|
339
|
+
}
|
|
171
340
|
|
|
172
341
|
// src/components/ui/tooltip.tsx
|
|
173
342
|
import { Tooltip as TooltipPrimitive } from "@base-ui/react/tooltip";
|
|
@@ -226,10 +395,31 @@ function TooltipContent(_a) {
|
|
|
226
395
|
|
|
227
396
|
// src/hooks/use-mobile.ts
|
|
228
397
|
import * as React from "react";
|
|
398
|
+
var MOBILE_BREAKPOINT = 768;
|
|
399
|
+
function useIsMobile() {
|
|
400
|
+
const [isMobile, setIsMobile] = React.useState(
|
|
401
|
+
void 0
|
|
402
|
+
);
|
|
403
|
+
React.useEffect(() => {
|
|
404
|
+
const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
|
|
405
|
+
const onChange = () => {
|
|
406
|
+
setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
|
|
407
|
+
};
|
|
408
|
+
mql.addEventListener("change", onChange);
|
|
409
|
+
setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
|
|
410
|
+
return () => mql.removeEventListener("change", onChange);
|
|
411
|
+
}, []);
|
|
412
|
+
return !!isMobile;
|
|
413
|
+
}
|
|
229
414
|
|
|
230
415
|
// src/components/ui/sidebar.tsx
|
|
231
416
|
import { jsx as jsx9, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
417
|
+
var SIDEBAR_COOKIE_NAME = "sidebar_state";
|
|
232
418
|
var SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
|
|
419
|
+
var SIDEBAR_WIDTH = "16rem";
|
|
420
|
+
var SIDEBAR_WIDTH_MOBILE = "18rem";
|
|
421
|
+
var SIDEBAR_WIDTH_ICON = "3rem";
|
|
422
|
+
var SIDEBAR_KEYBOARD_SHORTCUT = "b";
|
|
233
423
|
var SidebarContext = React2.createContext(null);
|
|
234
424
|
function useSidebar() {
|
|
235
425
|
const context = React2.useContext(SidebarContext);
|
|
@@ -238,6 +428,279 @@ function useSidebar() {
|
|
|
238
428
|
}
|
|
239
429
|
return context;
|
|
240
430
|
}
|
|
431
|
+
function SidebarProvider(_a) {
|
|
432
|
+
var _b = _a, {
|
|
433
|
+
defaultOpen = true,
|
|
434
|
+
open: openProp,
|
|
435
|
+
onOpenChange: setOpenProp,
|
|
436
|
+
className,
|
|
437
|
+
style,
|
|
438
|
+
children
|
|
439
|
+
} = _b, props = __objRest(_b, [
|
|
440
|
+
"defaultOpen",
|
|
441
|
+
"open",
|
|
442
|
+
"onOpenChange",
|
|
443
|
+
"className",
|
|
444
|
+
"style",
|
|
445
|
+
"children"
|
|
446
|
+
]);
|
|
447
|
+
const isMobile = useIsMobile();
|
|
448
|
+
const [openMobile, setOpenMobile] = React2.useState(false);
|
|
449
|
+
const [_open, _setOpen] = React2.useState(defaultOpen);
|
|
450
|
+
const open = openProp != null ? openProp : _open;
|
|
451
|
+
const setOpen = React2.useCallback(
|
|
452
|
+
(value) => {
|
|
453
|
+
const openState = typeof value === "function" ? value(open) : value;
|
|
454
|
+
if (setOpenProp) {
|
|
455
|
+
setOpenProp(openState);
|
|
456
|
+
} else {
|
|
457
|
+
_setOpen(openState);
|
|
458
|
+
}
|
|
459
|
+
document.cookie = `${SIDEBAR_COOKIE_NAME}=${openState}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`;
|
|
460
|
+
},
|
|
461
|
+
[setOpenProp, open]
|
|
462
|
+
);
|
|
463
|
+
const toggleSidebar = React2.useCallback(() => {
|
|
464
|
+
return isMobile ? setOpenMobile((open2) => !open2) : setOpen((open2) => !open2);
|
|
465
|
+
}, [isMobile, setOpen]);
|
|
466
|
+
React2.useEffect(() => {
|
|
467
|
+
const handleKeyDown = (event) => {
|
|
468
|
+
if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
|
|
469
|
+
event.preventDefault();
|
|
470
|
+
toggleSidebar();
|
|
471
|
+
}
|
|
472
|
+
};
|
|
473
|
+
window.addEventListener("keydown", handleKeyDown);
|
|
474
|
+
return () => window.removeEventListener("keydown", handleKeyDown);
|
|
475
|
+
}, [toggleSidebar]);
|
|
476
|
+
const state = open ? "expanded" : "collapsed";
|
|
477
|
+
const contextValue = React2.useMemo(
|
|
478
|
+
() => ({
|
|
479
|
+
state,
|
|
480
|
+
open,
|
|
481
|
+
setOpen,
|
|
482
|
+
isMobile,
|
|
483
|
+
openMobile,
|
|
484
|
+
setOpenMobile,
|
|
485
|
+
toggleSidebar
|
|
486
|
+
}),
|
|
487
|
+
[state, open, setOpen, isMobile, openMobile, toggleSidebar]
|
|
488
|
+
);
|
|
489
|
+
return /* @__PURE__ */ jsx9(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx9(
|
|
490
|
+
"div",
|
|
491
|
+
__spreadProps(__spreadValues({
|
|
492
|
+
"data-slot": "sidebar-wrapper",
|
|
493
|
+
style: __spreadValues({
|
|
494
|
+
"--sidebar-width": SIDEBAR_WIDTH,
|
|
495
|
+
"--sidebar-width-icon": SIDEBAR_WIDTH_ICON
|
|
496
|
+
}, style),
|
|
497
|
+
className: cn8(
|
|
498
|
+
"group/sidebar-wrapper flex min-h-svh w-full has-data-[variant=inset]:bg-sidebar",
|
|
499
|
+
className
|
|
500
|
+
)
|
|
501
|
+
}, props), {
|
|
502
|
+
children
|
|
503
|
+
})
|
|
504
|
+
) });
|
|
505
|
+
}
|
|
506
|
+
function Sidebar(_a) {
|
|
507
|
+
var _b = _a, {
|
|
508
|
+
side = "left",
|
|
509
|
+
variant = "sidebar",
|
|
510
|
+
collapsible = "offcanvas",
|
|
511
|
+
className,
|
|
512
|
+
children,
|
|
513
|
+
dir
|
|
514
|
+
} = _b, props = __objRest(_b, [
|
|
515
|
+
"side",
|
|
516
|
+
"variant",
|
|
517
|
+
"collapsible",
|
|
518
|
+
"className",
|
|
519
|
+
"children",
|
|
520
|
+
"dir"
|
|
521
|
+
]);
|
|
522
|
+
const { isMobile, state, openMobile, setOpenMobile } = useSidebar();
|
|
523
|
+
if (collapsible === "none") {
|
|
524
|
+
return /* @__PURE__ */ jsx9(
|
|
525
|
+
"div",
|
|
526
|
+
__spreadProps(__spreadValues({
|
|
527
|
+
"data-slot": "sidebar",
|
|
528
|
+
className: cn8(
|
|
529
|
+
"flex h-full w-(--sidebar-width) flex-col bg-sidebar text-sidebar-foreground",
|
|
530
|
+
className
|
|
531
|
+
)
|
|
532
|
+
}, props), {
|
|
533
|
+
children
|
|
534
|
+
})
|
|
535
|
+
);
|
|
536
|
+
}
|
|
537
|
+
if (isMobile) {
|
|
538
|
+
return /* @__PURE__ */ jsx9(Sheet, __spreadProps(__spreadValues({ open: openMobile, onOpenChange: setOpenMobile }, props), { children: /* @__PURE__ */ jsxs4(
|
|
539
|
+
SheetContent,
|
|
540
|
+
{
|
|
541
|
+
dir,
|
|
542
|
+
"data-sidebar": "sidebar",
|
|
543
|
+
"data-slot": "sidebar",
|
|
544
|
+
"data-mobile": "true",
|
|
545
|
+
className: "w-(--sidebar-width) bg-sidebar p-0 text-sidebar-foreground [&>button]:hidden",
|
|
546
|
+
style: {
|
|
547
|
+
"--sidebar-width": SIDEBAR_WIDTH_MOBILE
|
|
548
|
+
},
|
|
549
|
+
side,
|
|
550
|
+
children: [
|
|
551
|
+
/* @__PURE__ */ jsxs4(SheetHeader, { className: "sr-only", children: [
|
|
552
|
+
/* @__PURE__ */ jsx9(SheetTitle, { children: "Sidebar" }),
|
|
553
|
+
/* @__PURE__ */ jsx9(SheetDescription, { children: "Displays the mobile sidebar." })
|
|
554
|
+
] }),
|
|
555
|
+
/* @__PURE__ */ jsx9("div", { className: "flex h-full w-full flex-col", children })
|
|
556
|
+
]
|
|
557
|
+
}
|
|
558
|
+
) }));
|
|
559
|
+
}
|
|
560
|
+
return /* @__PURE__ */ jsxs4(
|
|
561
|
+
"div",
|
|
562
|
+
{
|
|
563
|
+
className: "group peer hidden text-sidebar-foreground md:block",
|
|
564
|
+
"data-state": state,
|
|
565
|
+
"data-collapsible": state === "collapsed" ? collapsible : "",
|
|
566
|
+
"data-variant": variant,
|
|
567
|
+
"data-side": side,
|
|
568
|
+
"data-slot": "sidebar",
|
|
569
|
+
children: [
|
|
570
|
+
/* @__PURE__ */ jsx9(
|
|
571
|
+
"div",
|
|
572
|
+
{
|
|
573
|
+
"data-slot": "sidebar-gap",
|
|
574
|
+
className: cn8(
|
|
575
|
+
"relative w-(--sidebar-width) bg-transparent transition-[width] duration-200 ease-linear",
|
|
576
|
+
"group-data-[collapsible=offcanvas]:w-0",
|
|
577
|
+
"group-data-[side=right]:rotate-180",
|
|
578
|
+
variant === "floating" || variant === "inset" ? "group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]" : "group-data-[collapsible=icon]:w-(--sidebar-width-icon)"
|
|
579
|
+
)
|
|
580
|
+
}
|
|
581
|
+
),
|
|
582
|
+
/* @__PURE__ */ jsx9(
|
|
583
|
+
"div",
|
|
584
|
+
__spreadProps(__spreadValues({
|
|
585
|
+
"data-slot": "sidebar-container",
|
|
586
|
+
"data-side": side,
|
|
587
|
+
className: cn8(
|
|
588
|
+
"fixed inset-y-0 z-10 hidden h-svh w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear data-[side=left]:left-0 data-[side=left]:group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)] data-[side=right]:right-0 data-[side=right]:group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)] md:flex",
|
|
589
|
+
// Adjust the padding for floating and inset variants.
|
|
590
|
+
variant === "floating" || variant === "inset" ? "p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+2px)]" : "group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l",
|
|
591
|
+
className
|
|
592
|
+
)
|
|
593
|
+
}, props), {
|
|
594
|
+
children: /* @__PURE__ */ jsx9(
|
|
595
|
+
"div",
|
|
596
|
+
{
|
|
597
|
+
"data-sidebar": "sidebar",
|
|
598
|
+
"data-slot": "sidebar-inner",
|
|
599
|
+
className: "flex size-full flex-col bg-sidebar group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:shadow-sm group-data-[variant=floating]:ring-1 group-data-[variant=floating]:ring-sidebar-border",
|
|
600
|
+
children
|
|
601
|
+
}
|
|
602
|
+
)
|
|
603
|
+
})
|
|
604
|
+
)
|
|
605
|
+
]
|
|
606
|
+
}
|
|
607
|
+
);
|
|
608
|
+
}
|
|
609
|
+
function SidebarTrigger(_a) {
|
|
610
|
+
var _b = _a, {
|
|
611
|
+
className,
|
|
612
|
+
onClick
|
|
613
|
+
} = _b, props = __objRest(_b, [
|
|
614
|
+
"className",
|
|
615
|
+
"onClick"
|
|
616
|
+
]);
|
|
617
|
+
const { toggleSidebar } = useSidebar();
|
|
618
|
+
return /* @__PURE__ */ jsxs4(
|
|
619
|
+
Button,
|
|
620
|
+
__spreadProps(__spreadValues({
|
|
621
|
+
"data-sidebar": "trigger",
|
|
622
|
+
"data-slot": "sidebar-trigger",
|
|
623
|
+
variant: "ghost",
|
|
624
|
+
size: "icon-sm",
|
|
625
|
+
className: cn8(className),
|
|
626
|
+
onClick: (event) => {
|
|
627
|
+
onClick == null ? void 0 : onClick(event);
|
|
628
|
+
toggleSidebar();
|
|
629
|
+
}
|
|
630
|
+
}, props), {
|
|
631
|
+
children: [
|
|
632
|
+
/* @__PURE__ */ jsx9(PanelLeftIcon, {}),
|
|
633
|
+
/* @__PURE__ */ jsx9("span", { className: "sr-only", children: "Toggle Sidebar" })
|
|
634
|
+
]
|
|
635
|
+
})
|
|
636
|
+
);
|
|
637
|
+
}
|
|
638
|
+
function SidebarRail(_a) {
|
|
639
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
640
|
+
const { toggleSidebar } = useSidebar();
|
|
641
|
+
return /* @__PURE__ */ jsx9(
|
|
642
|
+
"button",
|
|
643
|
+
__spreadValues({
|
|
644
|
+
"data-sidebar": "rail",
|
|
645
|
+
"data-slot": "sidebar-rail",
|
|
646
|
+
"aria-label": "Toggle Sidebar",
|
|
647
|
+
tabIndex: -1,
|
|
648
|
+
onClick: toggleSidebar,
|
|
649
|
+
title: "Toggle Sidebar",
|
|
650
|
+
className: cn8(
|
|
651
|
+
"absolute inset-y-0 z-20 hidden w-4 transition-all ease-linear group-data-[side=left]:-right-4 group-data-[side=right]:left-0 after:absolute after:inset-y-0 after:start-1/2 after:w-[2px] hover:after:bg-sidebar-border sm:flex ltr:-translate-x-1/2 rtl:-translate-x-1/2",
|
|
652
|
+
"in-data-[side=left]:cursor-w-resize in-data-[side=right]:cursor-e-resize",
|
|
653
|
+
"[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize",
|
|
654
|
+
"group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full hover:group-data-[collapsible=offcanvas]:bg-sidebar",
|
|
655
|
+
"[[data-side=left][data-collapsible=offcanvas]_&]:-right-2",
|
|
656
|
+
"[[data-side=right][data-collapsible=offcanvas]_&]:-left-2",
|
|
657
|
+
className
|
|
658
|
+
)
|
|
659
|
+
}, props)
|
|
660
|
+
);
|
|
661
|
+
}
|
|
662
|
+
function SidebarInset(_a) {
|
|
663
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
664
|
+
return /* @__PURE__ */ jsx9(
|
|
665
|
+
"main",
|
|
666
|
+
__spreadValues({
|
|
667
|
+
"data-slot": "sidebar-inset",
|
|
668
|
+
className: cn8(
|
|
669
|
+
"relative flex w-full flex-1 flex-col bg-background md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow-sm md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ml-2",
|
|
670
|
+
className
|
|
671
|
+
)
|
|
672
|
+
}, props)
|
|
673
|
+
);
|
|
674
|
+
}
|
|
675
|
+
function SidebarInput(_a) {
|
|
676
|
+
var _b = _a, {
|
|
677
|
+
className
|
|
678
|
+
} = _b, props = __objRest(_b, [
|
|
679
|
+
"className"
|
|
680
|
+
]);
|
|
681
|
+
return /* @__PURE__ */ jsx9(
|
|
682
|
+
Input,
|
|
683
|
+
__spreadValues({
|
|
684
|
+
"data-slot": "sidebar-input",
|
|
685
|
+
"data-sidebar": "input",
|
|
686
|
+
className: cn8(
|
|
687
|
+
"h-8 w-full border-input bg-muted/20 dark:bg-muted/30",
|
|
688
|
+
className
|
|
689
|
+
)
|
|
690
|
+
}, props)
|
|
691
|
+
);
|
|
692
|
+
}
|
|
693
|
+
function SidebarHeader(_a) {
|
|
694
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
695
|
+
return /* @__PURE__ */ jsx9(
|
|
696
|
+
"div",
|
|
697
|
+
__spreadValues({
|
|
698
|
+
"data-slot": "sidebar-header",
|
|
699
|
+
"data-sidebar": "header",
|
|
700
|
+
className: cn8("flex flex-col gap-2 p-2", className)
|
|
701
|
+
}, props)
|
|
702
|
+
);
|
|
703
|
+
}
|
|
241
704
|
function SidebarFooter(_a) {
|
|
242
705
|
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
243
706
|
return /* @__PURE__ */ jsx9(
|
|
@@ -249,6 +712,116 @@ function SidebarFooter(_a) {
|
|
|
249
712
|
}, props)
|
|
250
713
|
);
|
|
251
714
|
}
|
|
715
|
+
function SidebarSeparator(_a) {
|
|
716
|
+
var _b = _a, {
|
|
717
|
+
className
|
|
718
|
+
} = _b, props = __objRest(_b, [
|
|
719
|
+
"className"
|
|
720
|
+
]);
|
|
721
|
+
return /* @__PURE__ */ jsx9(
|
|
722
|
+
Separator,
|
|
723
|
+
__spreadValues({
|
|
724
|
+
"data-slot": "sidebar-separator",
|
|
725
|
+
"data-sidebar": "separator",
|
|
726
|
+
className: cn8("mx-2 w-auto bg-sidebar-border", className)
|
|
727
|
+
}, props)
|
|
728
|
+
);
|
|
729
|
+
}
|
|
730
|
+
function SidebarContent(_a) {
|
|
731
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
732
|
+
return /* @__PURE__ */ jsx9(
|
|
733
|
+
"div",
|
|
734
|
+
__spreadValues({
|
|
735
|
+
"data-slot": "sidebar-content",
|
|
736
|
+
"data-sidebar": "content",
|
|
737
|
+
className: cn8(
|
|
738
|
+
"no-scrollbar flex min-h-0 flex-1 flex-col gap-0 overflow-auto group-data-[collapsible=icon]:overflow-hidden",
|
|
739
|
+
className
|
|
740
|
+
)
|
|
741
|
+
}, props)
|
|
742
|
+
);
|
|
743
|
+
}
|
|
744
|
+
function SidebarGroup(_a) {
|
|
745
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
746
|
+
return /* @__PURE__ */ jsx9(
|
|
747
|
+
"div",
|
|
748
|
+
__spreadValues({
|
|
749
|
+
"data-slot": "sidebar-group",
|
|
750
|
+
"data-sidebar": "group",
|
|
751
|
+
className: cn8(
|
|
752
|
+
"relative flex w-full min-w-0 flex-col px-2 py-1",
|
|
753
|
+
className
|
|
754
|
+
)
|
|
755
|
+
}, props)
|
|
756
|
+
);
|
|
757
|
+
}
|
|
758
|
+
function SidebarGroupLabel(_a) {
|
|
759
|
+
var _b = _a, {
|
|
760
|
+
className,
|
|
761
|
+
render
|
|
762
|
+
} = _b, props = __objRest(_b, [
|
|
763
|
+
"className",
|
|
764
|
+
"render"
|
|
765
|
+
]);
|
|
766
|
+
return useRender({
|
|
767
|
+
defaultTagName: "div",
|
|
768
|
+
props: mergeProps(
|
|
769
|
+
{
|
|
770
|
+
className: cn8(
|
|
771
|
+
"flex h-8 shrink-0 items-center rounded-md px-2 text-xs text-sidebar-foreground/70 ring-sidebar-ring outline-hidden transition-[margin,opacity] duration-200 ease-linear group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0 focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
|
|
772
|
+
className
|
|
773
|
+
)
|
|
774
|
+
},
|
|
775
|
+
props
|
|
776
|
+
),
|
|
777
|
+
render,
|
|
778
|
+
state: {
|
|
779
|
+
slot: "sidebar-group-label",
|
|
780
|
+
sidebar: "group-label"
|
|
781
|
+
}
|
|
782
|
+
});
|
|
783
|
+
}
|
|
784
|
+
function SidebarGroupAction(_a) {
|
|
785
|
+
var _b = _a, {
|
|
786
|
+
className,
|
|
787
|
+
render
|
|
788
|
+
} = _b, props = __objRest(_b, [
|
|
789
|
+
"className",
|
|
790
|
+
"render"
|
|
791
|
+
]);
|
|
792
|
+
return useRender({
|
|
793
|
+
defaultTagName: "button",
|
|
794
|
+
props: mergeProps(
|
|
795
|
+
{
|
|
796
|
+
className: cn8(
|
|
797
|
+
"absolute top-3.5 right-3 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground ring-sidebar-ring outline-hidden transition-transform group-data-[collapsible=icon]:hidden after:absolute after:-inset-2 hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 md:after:hidden [&>svg]:size-4 [&>svg]:shrink-0",
|
|
798
|
+
className
|
|
799
|
+
)
|
|
800
|
+
},
|
|
801
|
+
props
|
|
802
|
+
),
|
|
803
|
+
render,
|
|
804
|
+
state: {
|
|
805
|
+
slot: "sidebar-group-action",
|
|
806
|
+
sidebar: "group-action"
|
|
807
|
+
}
|
|
808
|
+
});
|
|
809
|
+
}
|
|
810
|
+
function SidebarGroupContent(_a) {
|
|
811
|
+
var _b = _a, {
|
|
812
|
+
className
|
|
813
|
+
} = _b, props = __objRest(_b, [
|
|
814
|
+
"className"
|
|
815
|
+
]);
|
|
816
|
+
return /* @__PURE__ */ jsx9(
|
|
817
|
+
"div",
|
|
818
|
+
__spreadValues({
|
|
819
|
+
"data-slot": "sidebar-group-content",
|
|
820
|
+
"data-sidebar": "group-content",
|
|
821
|
+
className: cn8("w-full text-xs", className)
|
|
822
|
+
}, props)
|
|
823
|
+
);
|
|
824
|
+
}
|
|
252
825
|
function SidebarMenu(_a) {
|
|
253
826
|
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
254
827
|
return /* @__PURE__ */ jsx9(
|
|
@@ -344,6 +917,154 @@ function SidebarMenuButton(_a) {
|
|
|
344
917
|
)
|
|
345
918
|
] });
|
|
346
919
|
}
|
|
920
|
+
function SidebarMenuAction(_a) {
|
|
921
|
+
var _b = _a, {
|
|
922
|
+
className,
|
|
923
|
+
render,
|
|
924
|
+
showOnHover = false
|
|
925
|
+
} = _b, props = __objRest(_b, [
|
|
926
|
+
"className",
|
|
927
|
+
"render",
|
|
928
|
+
"showOnHover"
|
|
929
|
+
]);
|
|
930
|
+
return useRender({
|
|
931
|
+
defaultTagName: "button",
|
|
932
|
+
props: mergeProps(
|
|
933
|
+
{
|
|
934
|
+
className: cn8(
|
|
935
|
+
"absolute top-1.5 right-1 flex aspect-square w-5 items-center justify-center rounded-[calc(var(--radius-sm)-2px)] p-0 text-sidebar-foreground ring-sidebar-ring outline-hidden transition-transform group-data-[collapsible=icon]:hidden peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[size=default]/menu-button:top-1.5 peer-data-[size=lg]/menu-button:top-2.5 peer-data-[size=sm]/menu-button:top-1 after:absolute after:-inset-2 hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 md:after:hidden [&>svg]:size-4 [&>svg]:shrink-0",
|
|
936
|
+
showOnHover && "group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 peer-data-active/menu-button:text-sidebar-accent-foreground aria-expanded:opacity-100 md:opacity-0",
|
|
937
|
+
className
|
|
938
|
+
)
|
|
939
|
+
},
|
|
940
|
+
props
|
|
941
|
+
),
|
|
942
|
+
render,
|
|
943
|
+
state: {
|
|
944
|
+
slot: "sidebar-menu-action",
|
|
945
|
+
sidebar: "menu-action"
|
|
946
|
+
}
|
|
947
|
+
});
|
|
948
|
+
}
|
|
949
|
+
function SidebarMenuBadge(_a) {
|
|
950
|
+
var _b = _a, {
|
|
951
|
+
className
|
|
952
|
+
} = _b, props = __objRest(_b, [
|
|
953
|
+
"className"
|
|
954
|
+
]);
|
|
955
|
+
return /* @__PURE__ */ jsx9(
|
|
956
|
+
"div",
|
|
957
|
+
__spreadValues({
|
|
958
|
+
"data-slot": "sidebar-menu-badge",
|
|
959
|
+
"data-sidebar": "menu-badge",
|
|
960
|
+
className: cn8(
|
|
961
|
+
"pointer-events-none absolute right-1 flex h-5 min-w-5 items-center justify-center rounded-[calc(var(--radius-sm)-2px)] px-1 text-xs font-medium text-sidebar-foreground tabular-nums select-none group-data-[collapsible=icon]:hidden peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[size=default]/menu-button:top-1.5 peer-data-[size=lg]/menu-button:top-2.5 peer-data-[size=sm]/menu-button:top-1 peer-data-active/menu-button:text-sidebar-accent-foreground",
|
|
962
|
+
className
|
|
963
|
+
)
|
|
964
|
+
}, props)
|
|
965
|
+
);
|
|
966
|
+
}
|
|
967
|
+
function SidebarMenuSkeleton(_a) {
|
|
968
|
+
var _b = _a, {
|
|
969
|
+
className,
|
|
970
|
+
showIcon = false
|
|
971
|
+
} = _b, props = __objRest(_b, [
|
|
972
|
+
"className",
|
|
973
|
+
"showIcon"
|
|
974
|
+
]);
|
|
975
|
+
const [width] = React2.useState(() => {
|
|
976
|
+
return `${Math.floor(Math.random() * 40) + 50}%`;
|
|
977
|
+
});
|
|
978
|
+
return /* @__PURE__ */ jsxs4(
|
|
979
|
+
"div",
|
|
980
|
+
__spreadProps(__spreadValues({
|
|
981
|
+
"data-slot": "sidebar-menu-skeleton",
|
|
982
|
+
"data-sidebar": "menu-skeleton",
|
|
983
|
+
className: cn8("flex h-8 items-center gap-2 rounded-md px-2", className)
|
|
984
|
+
}, props), {
|
|
985
|
+
children: [
|
|
986
|
+
showIcon && /* @__PURE__ */ jsx9(
|
|
987
|
+
Skeleton,
|
|
988
|
+
{
|
|
989
|
+
className: "size-4 rounded-md",
|
|
990
|
+
"data-sidebar": "menu-skeleton-icon"
|
|
991
|
+
}
|
|
992
|
+
),
|
|
993
|
+
/* @__PURE__ */ jsx9(
|
|
994
|
+
Skeleton,
|
|
995
|
+
{
|
|
996
|
+
className: "h-4 max-w-(--skeleton-width) flex-1",
|
|
997
|
+
"data-sidebar": "menu-skeleton-text",
|
|
998
|
+
style: {
|
|
999
|
+
"--skeleton-width": width
|
|
1000
|
+
}
|
|
1001
|
+
}
|
|
1002
|
+
)
|
|
1003
|
+
]
|
|
1004
|
+
})
|
|
1005
|
+
);
|
|
1006
|
+
}
|
|
1007
|
+
function SidebarMenuSub(_a) {
|
|
1008
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
1009
|
+
return /* @__PURE__ */ jsx9(
|
|
1010
|
+
"ul",
|
|
1011
|
+
__spreadValues({
|
|
1012
|
+
"data-slot": "sidebar-menu-sub",
|
|
1013
|
+
"data-sidebar": "menu-sub",
|
|
1014
|
+
className: cn8(
|
|
1015
|
+
"mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 border-l border-sidebar-border px-2.5 py-0.5 group-data-[collapsible=icon]:hidden",
|
|
1016
|
+
className
|
|
1017
|
+
)
|
|
1018
|
+
}, props)
|
|
1019
|
+
);
|
|
1020
|
+
}
|
|
1021
|
+
function SidebarMenuSubItem(_a) {
|
|
1022
|
+
var _b = _a, {
|
|
1023
|
+
className
|
|
1024
|
+
} = _b, props = __objRest(_b, [
|
|
1025
|
+
"className"
|
|
1026
|
+
]);
|
|
1027
|
+
return /* @__PURE__ */ jsx9(
|
|
1028
|
+
"li",
|
|
1029
|
+
__spreadValues({
|
|
1030
|
+
"data-slot": "sidebar-menu-sub-item",
|
|
1031
|
+
"data-sidebar": "menu-sub-item",
|
|
1032
|
+
className: cn8("group/menu-sub-item relative", className)
|
|
1033
|
+
}, props)
|
|
1034
|
+
);
|
|
1035
|
+
}
|
|
1036
|
+
function SidebarMenuSubButton(_a) {
|
|
1037
|
+
var _b = _a, {
|
|
1038
|
+
render,
|
|
1039
|
+
size = "md",
|
|
1040
|
+
isActive = false,
|
|
1041
|
+
className
|
|
1042
|
+
} = _b, props = __objRest(_b, [
|
|
1043
|
+
"render",
|
|
1044
|
+
"size",
|
|
1045
|
+
"isActive",
|
|
1046
|
+
"className"
|
|
1047
|
+
]);
|
|
1048
|
+
return useRender({
|
|
1049
|
+
defaultTagName: "a",
|
|
1050
|
+
props: mergeProps(
|
|
1051
|
+
{
|
|
1052
|
+
className: cn8(
|
|
1053
|
+
"flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-md px-2 text-sidebar-foreground ring-sidebar-ring outline-hidden group-data-[collapsible=icon]:hidden hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[size=md]:text-xs data-[size=sm]:text-xs data-active:bg-sidebar-accent data-active:text-sidebar-accent-foreground [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:text-sidebar-accent-foreground",
|
|
1054
|
+
className
|
|
1055
|
+
)
|
|
1056
|
+
},
|
|
1057
|
+
props
|
|
1058
|
+
),
|
|
1059
|
+
render,
|
|
1060
|
+
state: {
|
|
1061
|
+
slot: "sidebar-menu-sub-button",
|
|
1062
|
+
sidebar: "menu-sub-button",
|
|
1063
|
+
size,
|
|
1064
|
+
active: isActive
|
|
1065
|
+
}
|
|
1066
|
+
});
|
|
1067
|
+
}
|
|
347
1068
|
|
|
348
1069
|
// src/components/composed/nav-user.tsx
|
|
349
1070
|
import { jsx as jsx10, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
@@ -367,5 +1088,29 @@ var NavUser = memo2(function NavUser2({
|
|
|
367
1088
|
});
|
|
368
1089
|
export {
|
|
369
1090
|
HeaderTitle,
|
|
370
|
-
NavUser
|
|
1091
|
+
NavUser,
|
|
1092
|
+
Sidebar,
|
|
1093
|
+
SidebarContent,
|
|
1094
|
+
SidebarFooter,
|
|
1095
|
+
SidebarGroup,
|
|
1096
|
+
SidebarGroupAction,
|
|
1097
|
+
SidebarGroupContent,
|
|
1098
|
+
SidebarGroupLabel,
|
|
1099
|
+
SidebarHeader,
|
|
1100
|
+
SidebarInput,
|
|
1101
|
+
SidebarInset,
|
|
1102
|
+
SidebarMenu,
|
|
1103
|
+
SidebarMenuAction,
|
|
1104
|
+
SidebarMenuBadge,
|
|
1105
|
+
SidebarMenuButton,
|
|
1106
|
+
SidebarMenuItem,
|
|
1107
|
+
SidebarMenuSkeleton,
|
|
1108
|
+
SidebarMenuSub,
|
|
1109
|
+
SidebarMenuSubButton,
|
|
1110
|
+
SidebarMenuSubItem,
|
|
1111
|
+
SidebarProvider,
|
|
1112
|
+
SidebarRail,
|
|
1113
|
+
SidebarSeparator,
|
|
1114
|
+
SidebarTrigger,
|
|
1115
|
+
useSidebar
|
|
371
1116
|
};
|