@doscientos/ui 0.1.8 → 0.1.10
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.cjs +232 -103
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +50 -27
- package/dist/index.d.ts +50 -27
- package/dist/index.js +226 -93
- package/dist/index.js.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -33,6 +33,8 @@ __export(index_exports, {
|
|
|
33
33
|
AppShellContent: () => AppShellContent,
|
|
34
34
|
AppShellHeader: () => AppShellHeader,
|
|
35
35
|
AppShellMain: () => AppShellMain,
|
|
36
|
+
AppShellMobileHeader: () => AppShellMobileHeader,
|
|
37
|
+
AppShellSidebar: () => AppShellSidebar,
|
|
36
38
|
AutocompleteCombobox: () => AutocompleteCombobox,
|
|
37
39
|
Avatar: () => Avatar,
|
|
38
40
|
AvatarBadge: () => AvatarBadge,
|
|
@@ -68,13 +70,6 @@ __export(index_exports, {
|
|
|
68
70
|
CommandItem: () => CommandItem,
|
|
69
71
|
CommandList: () => CommandList,
|
|
70
72
|
ConfirmDialog: () => ConfirmDialog,
|
|
71
|
-
Dialog: () => Dialog,
|
|
72
|
-
DialogClose: () => DialogClose,
|
|
73
|
-
DialogContent: () => DialogContent,
|
|
74
|
-
DialogDescription: () => DialogDescription,
|
|
75
|
-
DialogFooter: () => DialogFooter,
|
|
76
|
-
DialogHeader: () => DialogHeader,
|
|
77
|
-
DialogTitle: () => DialogTitle,
|
|
78
73
|
Drawer: () => Drawer,
|
|
79
74
|
DrawerDescription: () => DrawerDescription,
|
|
80
75
|
DrawerFooter: () => DrawerFooter,
|
|
@@ -111,6 +106,7 @@ __export(index_exports, {
|
|
|
111
106
|
MenuContent: () => MenuContent,
|
|
112
107
|
MenuItem: () => MenuItem,
|
|
113
108
|
MenuTrigger: () => MenuTrigger,
|
|
109
|
+
ModalDialog: () => ModalDialog,
|
|
114
110
|
PageHeader: () => PageHeader,
|
|
115
111
|
PageHeaderActions: () => PageHeaderActions,
|
|
116
112
|
PageHeaderDescription: () => PageHeaderDescription,
|
|
@@ -368,32 +364,106 @@ function AlertAction({ className, children, ...props }) {
|
|
|
368
364
|
|
|
369
365
|
// src/ui/app-shell/app-shell.tsx
|
|
370
366
|
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
371
|
-
function AppShell({
|
|
372
|
-
|
|
367
|
+
function AppShell({
|
|
368
|
+
className,
|
|
369
|
+
sidebarBreakpoint = "md",
|
|
370
|
+
...props
|
|
371
|
+
}) {
|
|
372
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
373
|
+
"div",
|
|
374
|
+
{
|
|
375
|
+
"data-slot": "app-shell",
|
|
376
|
+
"data-sidebar-breakpoint": sidebarBreakpoint,
|
|
377
|
+
className: cn("bg-background text-foreground", className),
|
|
378
|
+
...props
|
|
379
|
+
}
|
|
380
|
+
);
|
|
381
|
+
}
|
|
382
|
+
function AppShellSidebar({ className, ...props }) {
|
|
383
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
384
|
+
"aside",
|
|
385
|
+
{
|
|
386
|
+
"data-slot": "app-shell-sidebar",
|
|
387
|
+
className: cn("w-56 shrink-0 border-r border-border bg-card text-foreground", className),
|
|
388
|
+
...props
|
|
389
|
+
}
|
|
390
|
+
);
|
|
373
391
|
}
|
|
374
392
|
function AppShellMain({ className, ...props }) {
|
|
375
|
-
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("main", { "data-slot": "app-shell-main", className: cn("
|
|
393
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("main", { "data-slot": "app-shell-main", className: cn("bg-background", className), ...props });
|
|
376
394
|
}
|
|
377
395
|
function AppShellHeader({ className, ...props }) {
|
|
378
|
-
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
396
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
397
|
+
"header",
|
|
398
|
+
{
|
|
399
|
+
"data-slot": "app-shell-header",
|
|
400
|
+
className: cn("border-b border-border bg-background px-4", className),
|
|
401
|
+
...props
|
|
402
|
+
}
|
|
403
|
+
);
|
|
404
|
+
}
|
|
405
|
+
function AppShellMobileHeader({
|
|
406
|
+
className,
|
|
407
|
+
...props
|
|
408
|
+
}) {
|
|
409
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
410
|
+
"header",
|
|
411
|
+
{
|
|
412
|
+
"data-slot": "app-shell-mobile-header",
|
|
413
|
+
className: cn("h-14 shrink-0 items-center gap-2 border-b border-border bg-background px-3", className),
|
|
414
|
+
...props
|
|
415
|
+
}
|
|
416
|
+
);
|
|
379
417
|
}
|
|
380
|
-
function AppShellContent({
|
|
381
|
-
|
|
418
|
+
function AppShellContent({
|
|
419
|
+
className,
|
|
420
|
+
size = "wide",
|
|
421
|
+
padded = true,
|
|
422
|
+
scrollable = true,
|
|
423
|
+
...props
|
|
424
|
+
}) {
|
|
425
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
426
|
+
"div",
|
|
427
|
+
{
|
|
428
|
+
"data-slot": "app-shell-content",
|
|
429
|
+
"data-size": size,
|
|
430
|
+
"data-padded": padded || void 0,
|
|
431
|
+
"data-scrollable": scrollable || void 0,
|
|
432
|
+
className,
|
|
433
|
+
...props
|
|
434
|
+
}
|
|
435
|
+
);
|
|
382
436
|
}
|
|
383
437
|
|
|
384
438
|
// src/ui/avatar/avatar.tsx
|
|
385
439
|
var import_react4 = require("react");
|
|
386
440
|
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
387
441
|
var sizes = { xs: "size-5 text-[10px]", sm: "size-6 text-xs", default: "size-8 text-sm", lg: "size-10 text-base" };
|
|
388
|
-
|
|
389
|
-
|
|
442
|
+
var AvatarContext = (0, import_react4.createContext)(null);
|
|
443
|
+
function Avatar({ className, size = "default", children, ...props }) {
|
|
444
|
+
const [status, setStatus] = (0, import_react4.useState)("idle");
|
|
445
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(AvatarContext.Provider, { value: { status, setStatus }, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { "data-slot": "avatar", "data-size": size, className: cn("group/avatar relative flex shrink-0 overflow-hidden rounded-full bg-muted text-muted-foreground", sizes[size], className), ...props, children }) });
|
|
390
446
|
}
|
|
391
|
-
function AvatarImage({ className, ...props }) {
|
|
447
|
+
function AvatarImage({ className, src, onError, onLoad, ...props }) {
|
|
448
|
+
const avatar = (0, import_react4.useContext)(AvatarContext);
|
|
392
449
|
const [failed, setFailed] = (0, import_react4.useState)(false);
|
|
393
|
-
|
|
394
|
-
|
|
450
|
+
(0, import_react4.useEffect)(() => {
|
|
451
|
+
setFailed(false);
|
|
452
|
+
avatar?.setStatus(src ? "loading" : "idle");
|
|
453
|
+
}, [avatar?.setStatus, src]);
|
|
454
|
+
if (failed || avatar?.status === "error") return null;
|
|
455
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("img", { "data-slot": "avatar-image", src, className: cn("aspect-square size-full object-cover", className), onLoad: (event) => {
|
|
456
|
+
avatar?.setStatus("loaded");
|
|
457
|
+
onLoad?.(event);
|
|
458
|
+
}, onError: (event) => {
|
|
459
|
+
setFailed(true);
|
|
460
|
+
avatar?.setStatus("error");
|
|
461
|
+
onError?.(event);
|
|
462
|
+
}, ...props });
|
|
395
463
|
}
|
|
396
464
|
function AvatarFallback({ className, ...props }) {
|
|
465
|
+
const avatar = (0, import_react4.useContext)(AvatarContext);
|
|
466
|
+
if (avatar?.status === "loaded") return null;
|
|
397
467
|
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { "data-slot": "avatar-fallback", className: cn("flex size-full items-center justify-center font-medium", className), ...props });
|
|
398
468
|
}
|
|
399
469
|
function AvatarBadge({ className, ...props }) {
|
|
@@ -446,10 +516,19 @@ function BreadcrumbSeparator({ children = "/", className, ...props }) {
|
|
|
446
516
|
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { "data-slot": "breadcrumb-separator", "aria-hidden": "true", className: cn("text-muted-foreground/60", className), ...props, children });
|
|
447
517
|
}
|
|
448
518
|
|
|
519
|
+
// src/ui/button-group/button-group.tsx
|
|
520
|
+
var import_jsx_runtime7 = require("react/jsx-runtime");
|
|
521
|
+
function ButtonGroup({ className, ...props }) {
|
|
522
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { role: "group", "data-slot": "button-group", className: cn("inline-flex items-center gap-2", className), ...props });
|
|
523
|
+
}
|
|
524
|
+
function ButtonGroupText({ className, ...props }) {
|
|
525
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { "data-slot": "button-group-text", className: cn("text-sm text-muted-foreground", className), ...props });
|
|
526
|
+
}
|
|
527
|
+
|
|
449
528
|
// src/ui/button/button.tsx
|
|
450
529
|
var import_class_variance_authority2 = require("class-variance-authority");
|
|
451
530
|
var import_react_aria_components3 = require("react-aria-components");
|
|
452
|
-
var
|
|
531
|
+
var import_jsx_runtime8 = require("react/jsx-runtime");
|
|
453
532
|
var buttonVariants = (0, import_class_variance_authority2.cva)(
|
|
454
533
|
"inline-flex shrink-0 cursor-pointer items-center justify-center gap-1.5 rounded-lg border border-transparent text-sm font-medium whitespace-nowrap transition-[background-color,border-color,color,box-shadow,transform] duration-150 outline-none focus-visible:ring-3 focus-visible:ring-ring/50 data-pressed:scale-[0.98] disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 motion-reduce:transition-none motion-reduce:data-pressed:transform-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
|
455
534
|
{
|
|
@@ -474,16 +553,7 @@ var buttonVariants = (0, import_class_variance_authority2.cva)(
|
|
|
474
553
|
}
|
|
475
554
|
);
|
|
476
555
|
function Button2({ className, variant, size, ...props }) {
|
|
477
|
-
return /* @__PURE__ */ (0,
|
|
478
|
-
}
|
|
479
|
-
|
|
480
|
-
// src/ui/button-group/button-group.tsx
|
|
481
|
-
var import_jsx_runtime8 = require("react/jsx-runtime");
|
|
482
|
-
function ButtonGroup({ className, ...props }) {
|
|
483
|
-
return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { role: "group", "data-slot": "button-group", className: cn("inline-flex items-center gap-2", className), ...props });
|
|
484
|
-
}
|
|
485
|
-
function ButtonGroupText({ className, ...props }) {
|
|
486
|
-
return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { "data-slot": "button-group-text", className: cn("text-sm text-muted-foreground", className), ...props });
|
|
556
|
+
return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_aria_components3.Button, { "data-slot": "button", className: cn(buttonVariants({ variant, size }), className), ...props });
|
|
487
557
|
}
|
|
488
558
|
|
|
489
559
|
// src/ui/card/card.tsx
|
|
@@ -596,54 +666,117 @@ function CommandItem({ className, ...props }) {
|
|
|
596
666
|
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react_aria_components6.ListBoxItem, { "data-slot": "command-item", className: cn("flex cursor-default items-center rounded-md px-2 py-1.5 text-sm outline-none data-focused:bg-muted data-disabled:pointer-events-none data-disabled:opacity-50", className), ...props });
|
|
597
667
|
}
|
|
598
668
|
|
|
599
|
-
// src/ui/dialog/dialog.tsx
|
|
600
|
-
var import_react6 = require("react");
|
|
669
|
+
// src/ui/modal-dialog/modal-dialog.tsx
|
|
601
670
|
var import_lucide_react3 = require("lucide-react");
|
|
602
671
|
var import_react_aria_components7 = require("react-aria-components");
|
|
603
672
|
var import_jsx_runtime13 = require("react/jsx-runtime");
|
|
604
|
-
var
|
|
605
|
-
|
|
606
|
-
|
|
607
|
-
|
|
608
|
-
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
|
|
614
|
-
|
|
615
|
-
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
|
|
622
|
-
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
|
|
629
|
-
|
|
630
|
-
|
|
631
|
-
|
|
673
|
+
var sizeClasses = {
|
|
674
|
+
sm: "w-[min(calc(100dvw-2rem),24rem)]",
|
|
675
|
+
md: "w-[min(calc(100dvw-2rem),28rem)]",
|
|
676
|
+
lg: "w-[min(calc(100dvw-2rem),36rem)]"
|
|
677
|
+
};
|
|
678
|
+
function ModalDialog({
|
|
679
|
+
open,
|
|
680
|
+
onOpenChange,
|
|
681
|
+
title,
|
|
682
|
+
description,
|
|
683
|
+
children,
|
|
684
|
+
footer,
|
|
685
|
+
size = "sm",
|
|
686
|
+
showCloseButton = true,
|
|
687
|
+
className,
|
|
688
|
+
footerClassName,
|
|
689
|
+
...props
|
|
690
|
+
}) {
|
|
691
|
+
const layoutClass = children ? footer ? "grid-rows-[auto_minmax(0,1fr)_auto]" : "grid-rows-[auto_minmax(0,1fr)]" : "grid-rows-[auto_auto]";
|
|
692
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
693
|
+
import_react_aria_components7.ModalOverlay,
|
|
694
|
+
{
|
|
695
|
+
isOpen: open,
|
|
696
|
+
onOpenChange,
|
|
697
|
+
className: "fixed inset-0 z-50 grid place-items-center bg-black/20 p-4 backdrop-blur-[1px] motion-safe:data-entering:animate-ui-overlay-in motion-safe:data-exiting:animate-ui-overlay-out",
|
|
698
|
+
...props,
|
|
699
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
700
|
+
import_react_aria_components7.Modal,
|
|
701
|
+
{
|
|
702
|
+
className: cn(
|
|
703
|
+
"max-h-[calc(100dvh-2rem)] outline-none motion-safe:data-entering:animate-ui-surface-in motion-safe:data-exiting:animate-ui-surface-out",
|
|
704
|
+
sizeClasses[size],
|
|
705
|
+
className
|
|
706
|
+
),
|
|
707
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
708
|
+
import_react_aria_components7.Dialog,
|
|
709
|
+
{
|
|
710
|
+
className: cn(
|
|
711
|
+
"grid max-h-[calc(100dvh-2rem)] overflow-hidden rounded-xl bg-background text-foreground shadow-xl outline-none",
|
|
712
|
+
layoutClass
|
|
713
|
+
),
|
|
714
|
+
children: ({ close }) => /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_jsx_runtime13.Fragment, { children: [
|
|
715
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("header", { "data-slot": "modal-dialog-header", className: "flex items-start gap-3 border-b border-border px-5 py-4", children: [
|
|
716
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "min-w-0 flex-1", children: [
|
|
717
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_react_aria_components7.Heading, { slot: "title", className: "font-heading text-base leading-none font-medium", children: title }),
|
|
718
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_react_aria_components7.Text, { slot: "description", className: "mt-2 text-sm text-muted-foreground", children: description }) : null
|
|
719
|
+
] }),
|
|
720
|
+
showCloseButton ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
721
|
+
Button2,
|
|
722
|
+
{
|
|
723
|
+
"aria-label": "Cerrar di\xE1logo",
|
|
724
|
+
variant: "ghost",
|
|
725
|
+
size: "icon",
|
|
726
|
+
className: "-mr-2 -mt-1",
|
|
727
|
+
onPress: close,
|
|
728
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_lucide_react3.X, { "aria-hidden": "true", className: "size-4" })
|
|
729
|
+
}
|
|
730
|
+
) : null
|
|
731
|
+
] }),
|
|
732
|
+
children ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { "data-slot": "modal-dialog-body", className: "min-h-0 overflow-y-auto px-5 py-4", children }) : null,
|
|
733
|
+
footer ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
734
|
+
"footer",
|
|
735
|
+
{
|
|
736
|
+
"data-slot": "modal-dialog-footer",
|
|
737
|
+
className: cn(
|
|
738
|
+
"flex flex-col-reverse gap-2 border-t border-border bg-muted/50 px-5 py-4 sm:flex-row sm:flex-wrap sm:justify-end",
|
|
739
|
+
footerClassName
|
|
740
|
+
),
|
|
741
|
+
children: footer
|
|
742
|
+
}
|
|
743
|
+
) : null
|
|
744
|
+
] })
|
|
745
|
+
}
|
|
746
|
+
)
|
|
747
|
+
}
|
|
748
|
+
)
|
|
749
|
+
}
|
|
750
|
+
);
|
|
632
751
|
}
|
|
633
752
|
|
|
634
753
|
// src/ui/confirm-dialog/confirm-dialog.tsx
|
|
635
754
|
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
636
|
-
function ConfirmDialog({
|
|
637
|
-
|
|
638
|
-
|
|
639
|
-
|
|
640
|
-
|
|
641
|
-
|
|
642
|
-
|
|
643
|
-
|
|
644
|
-
|
|
645
|
-
|
|
646
|
-
|
|
755
|
+
function ConfirmDialog({
|
|
756
|
+
open,
|
|
757
|
+
onOpenChange,
|
|
758
|
+
title,
|
|
759
|
+
description,
|
|
760
|
+
confirmLabel = "Confirmar",
|
|
761
|
+
cancelLabel = "Cancelar",
|
|
762
|
+
destructive = false,
|
|
763
|
+
pending = false,
|
|
764
|
+
onConfirm
|
|
765
|
+
}) {
|
|
766
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
767
|
+
ModalDialog,
|
|
768
|
+
{
|
|
769
|
+
open,
|
|
770
|
+
onOpenChange,
|
|
771
|
+
title,
|
|
772
|
+
description,
|
|
773
|
+
showCloseButton: false,
|
|
774
|
+
footer: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
|
|
775
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button2, { variant: "outline", isDisabled: pending, onPress: () => onOpenChange(false), children: cancelLabel }),
|
|
776
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button2, { variant: destructive ? "destructive" : "default", isDisabled: pending, onPress: onConfirm, children: confirmLabel })
|
|
777
|
+
] })
|
|
778
|
+
}
|
|
779
|
+
);
|
|
647
780
|
}
|
|
648
781
|
|
|
649
782
|
// src/ui/drawer/drawer.tsx
|
|
@@ -694,10 +827,10 @@ function EmptyStateDescription({ className, ...props }) {
|
|
|
694
827
|
}
|
|
695
828
|
|
|
696
829
|
// src/ui/label/label.tsx
|
|
697
|
-
var
|
|
830
|
+
var import_react6 = require("react");
|
|
698
831
|
var import_react_aria_components10 = require("react-aria-components");
|
|
699
832
|
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
700
|
-
var Label2 = (0,
|
|
833
|
+
var Label2 = (0, import_react6.forwardRef)(function Label3({ className, ...props }, ref) {
|
|
701
834
|
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react_aria_components10.Label, { ref, "data-slot": "label", className: cn("flex items-center gap-2 text-sm font-medium leading-none select-none", className), ...props });
|
|
702
835
|
});
|
|
703
836
|
|
|
@@ -718,32 +851,32 @@ function FieldError2({ className, children, ...props }) {
|
|
|
718
851
|
}
|
|
719
852
|
|
|
720
853
|
// src/ui/form-feedback/form-feedback.tsx
|
|
721
|
-
var
|
|
854
|
+
var import_react7 = require("react");
|
|
722
855
|
var import_lucide_react4 = require("lucide-react");
|
|
723
856
|
var import_jsx_runtime20 = require("react/jsx-runtime");
|
|
724
857
|
function useFormFeedback(options) {
|
|
725
858
|
const resetMs = options?.successResetMs ?? 2500;
|
|
726
|
-
const [state, setState] = (0,
|
|
727
|
-
const timer = (0,
|
|
728
|
-
const clearTimer = (0,
|
|
859
|
+
const [state, setState] = (0, import_react7.useState)({ status: "idle" });
|
|
860
|
+
const timer = (0, import_react7.useRef)(null);
|
|
861
|
+
const clearTimer = (0, import_react7.useCallback)(() => {
|
|
729
862
|
if (timer.current) clearTimeout(timer.current);
|
|
730
863
|
timer.current = null;
|
|
731
864
|
}, []);
|
|
732
|
-
(0,
|
|
733
|
-
const setPending = (0,
|
|
865
|
+
(0, import_react7.useEffect)(() => () => clearTimer(), [clearTimer]);
|
|
866
|
+
const setPending = (0, import_react7.useCallback)(() => {
|
|
734
867
|
clearTimer();
|
|
735
868
|
setState({ status: "pending" });
|
|
736
869
|
}, [clearTimer]);
|
|
737
|
-
const setSuccess = (0,
|
|
870
|
+
const setSuccess = (0, import_react7.useCallback)((message) => {
|
|
738
871
|
clearTimer();
|
|
739
872
|
setState({ status: "success", message });
|
|
740
873
|
if (resetMs > 0) timer.current = setTimeout(() => setState({ status: "idle" }), resetMs);
|
|
741
874
|
}, [clearTimer, resetMs]);
|
|
742
|
-
const setError = (0,
|
|
875
|
+
const setError = (0, import_react7.useCallback)((message) => {
|
|
743
876
|
clearTimer();
|
|
744
877
|
setState({ status: "error", message });
|
|
745
878
|
}, [clearTimer]);
|
|
746
|
-
const reset = (0,
|
|
879
|
+
const reset = (0, import_react7.useCallback)(() => {
|
|
747
880
|
clearTimer();
|
|
748
881
|
setState({ status: "idle" });
|
|
749
882
|
}, [clearTimer]);
|
|
@@ -832,23 +965,23 @@ function IconButton({
|
|
|
832
965
|
] });
|
|
833
966
|
}
|
|
834
967
|
|
|
968
|
+
// src/ui/input-group/input-group.tsx
|
|
969
|
+
var import_class_variance_authority3 = require("class-variance-authority");
|
|
970
|
+
|
|
835
971
|
// src/ui/input/input.tsx
|
|
836
|
-
var
|
|
972
|
+
var import_react8 = require("react");
|
|
837
973
|
var import_react_aria_components13 = require("react-aria-components");
|
|
838
974
|
var import_jsx_runtime24 = require("react/jsx-runtime");
|
|
839
|
-
var InputImpl = (0,
|
|
975
|
+
var InputImpl = (0, import_react8.forwardRef)(function Input2({ className, type, ...props }, ref) {
|
|
840
976
|
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_aria_components13.Input, { ref, type, "data-slot": "input", className: cn("h-8 w-full min-w-0 rounded-lg border border-border bg-background px-2.5 py-1 text-sm text-foreground outline-none placeholder:text-muted-foreground focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive", className), ...props });
|
|
841
977
|
});
|
|
842
978
|
var Input3 = InputImpl;
|
|
843
979
|
|
|
844
|
-
// src/ui/input-group/input-group.tsx
|
|
845
|
-
var import_class_variance_authority3 = require("class-variance-authority");
|
|
846
|
-
|
|
847
980
|
// src/ui/textarea/textarea.tsx
|
|
848
|
-
var
|
|
981
|
+
var import_react9 = require("react");
|
|
849
982
|
var import_react_aria_components14 = require("react-aria-components");
|
|
850
983
|
var import_jsx_runtime25 = require("react/jsx-runtime");
|
|
851
|
-
var TextareaImpl = (0,
|
|
984
|
+
var TextareaImpl = (0, import_react9.forwardRef)(function Textarea({ className, ...props }, ref) {
|
|
852
985
|
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react_aria_components14.TextArea, { ref, "data-slot": "textarea", className: cn("min-h-20 w-full rounded-lg border border-border bg-background px-2.5 py-2 text-sm text-foreground outline-none placeholder:text-muted-foreground focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive", className), ...props });
|
|
853
986
|
});
|
|
854
987
|
var Textarea2 = TextareaImpl;
|
|
@@ -1037,12 +1170,12 @@ function Separator({ className, orientation = "horizontal", ...props }) {
|
|
|
1037
1170
|
|
|
1038
1171
|
// src/ui/sidebar/sidebar.tsx
|
|
1039
1172
|
var import_lucide_react10 = require("lucide-react");
|
|
1040
|
-
var
|
|
1173
|
+
var import_react10 = require("react");
|
|
1041
1174
|
var import_react_aria_components21 = require("react-aria-components");
|
|
1042
1175
|
var import_jsx_runtime37 = require("react/jsx-runtime");
|
|
1043
|
-
var SidebarContext = (0,
|
|
1176
|
+
var SidebarContext = (0, import_react10.createContext)(null);
|
|
1044
1177
|
function useSidebar() {
|
|
1045
|
-
const context = (0,
|
|
1178
|
+
const context = (0, import_react10.useContext)(SidebarContext);
|
|
1046
1179
|
if (!context)
|
|
1047
1180
|
throw new Error("useSidebar must be used inside SidebarProvider");
|
|
1048
1181
|
return context;
|
|
@@ -1051,8 +1184,8 @@ function SidebarProvider({
|
|
|
1051
1184
|
defaultCollapsed = false,
|
|
1052
1185
|
children
|
|
1053
1186
|
}) {
|
|
1054
|
-
const [collapsed, setCollapsed] = (0,
|
|
1055
|
-
const value = (0,
|
|
1187
|
+
const [collapsed, setCollapsed] = (0, import_react10.useState)(defaultCollapsed);
|
|
1188
|
+
const value = (0, import_react10.useMemo)(
|
|
1056
1189
|
() => ({
|
|
1057
1190
|
collapsed,
|
|
1058
1191
|
setCollapsed,
|
|
@@ -1393,7 +1526,7 @@ function TabsContent({ className, ...props }) {
|
|
|
1393
1526
|
}
|
|
1394
1527
|
|
|
1395
1528
|
// src/ui/toast/toast.tsx
|
|
1396
|
-
var
|
|
1529
|
+
var import_react11 = require("react");
|
|
1397
1530
|
var import_lucide_react12 = require("lucide-react");
|
|
1398
1531
|
var import_jsx_runtime43 = require("react/jsx-runtime");
|
|
1399
1532
|
var records = [];
|
|
@@ -1457,12 +1590,12 @@ function Toaster({ position = "bottom-right" }) {
|
|
|
1457
1590
|
return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_jsx_runtime43.Fragment, { children: Object.keys(positionClasses).map((item) => /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(ToastViewport, { position: item, visiblePosition: position }, item)) });
|
|
1458
1591
|
}
|
|
1459
1592
|
function ToastViewport({ position, visiblePosition, className }) {
|
|
1460
|
-
const toasts = (0,
|
|
1593
|
+
const toasts = (0, import_react11.useSyncExternalStore)(subscribe, snapshot, snapshot).filter((item) => item.position === position);
|
|
1461
1594
|
if (visiblePosition && position !== visiblePosition && toasts.length === 0) return null;
|
|
1462
1595
|
return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { "aria-label": `Notificaciones ${position}`, className: cn("pointer-events-none fixed z-50 flex w-[min(24rem,calc(100vw-2rem))] flex-col gap-2", positionClasses[position], className), children: toasts.map((item) => /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Toast, { ...item, onDismiss: () => dismiss(item.id) }, item.id)) });
|
|
1463
1596
|
}
|
|
1464
1597
|
function Toast({ id, title, description, variant = "default", action, state = "open", duration = 0, onDismiss }) {
|
|
1465
|
-
(0,
|
|
1598
|
+
(0, import_react11.useEffect)(() => {
|
|
1466
1599
|
if (state !== "open" || duration <= 0) return;
|
|
1467
1600
|
const timeout = window.setTimeout(() => dismiss(id), duration);
|
|
1468
1601
|
return () => window.clearTimeout(timeout);
|
|
@@ -1504,6 +1637,8 @@ function ToolbarSpacer({ className, ...props }) {
|
|
|
1504
1637
|
AppShellContent,
|
|
1505
1638
|
AppShellHeader,
|
|
1506
1639
|
AppShellMain,
|
|
1640
|
+
AppShellMobileHeader,
|
|
1641
|
+
AppShellSidebar,
|
|
1507
1642
|
AutocompleteCombobox,
|
|
1508
1643
|
Avatar,
|
|
1509
1644
|
AvatarBadge,
|
|
@@ -1539,13 +1674,6 @@ function ToolbarSpacer({ className, ...props }) {
|
|
|
1539
1674
|
CommandItem,
|
|
1540
1675
|
CommandList,
|
|
1541
1676
|
ConfirmDialog,
|
|
1542
|
-
Dialog,
|
|
1543
|
-
DialogClose,
|
|
1544
|
-
DialogContent,
|
|
1545
|
-
DialogDescription,
|
|
1546
|
-
DialogFooter,
|
|
1547
|
-
DialogHeader,
|
|
1548
|
-
DialogTitle,
|
|
1549
1677
|
Drawer,
|
|
1550
1678
|
DrawerDescription,
|
|
1551
1679
|
DrawerFooter,
|
|
@@ -1582,6 +1710,7 @@ function ToolbarSpacer({ className, ...props }) {
|
|
|
1582
1710
|
MenuContent,
|
|
1583
1711
|
MenuItem,
|
|
1584
1712
|
MenuTrigger,
|
|
1713
|
+
ModalDialog,
|
|
1585
1714
|
PageHeader,
|
|
1586
1715
|
PageHeaderActions,
|
|
1587
1716
|
PageHeaderDescription,
|