@motor-hero/ui-kit 0.15.1 → 0.16.1
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/components/combobox.d.ts +21 -0
- package/dist/components/combobox.d.ts.map +1 -0
- package/dist/index.cjs +202 -100
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +2 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +203 -102
- package/dist/index.js.map +1 -1
- package/package.json +3 -1
- package/src/components/combobox.tsx +112 -0
- package/src/index.ts +2 -0
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
export interface ComboboxOption {
|
|
3
|
+
value: string;
|
|
4
|
+
label: string;
|
|
5
|
+
disabled?: boolean;
|
|
6
|
+
}
|
|
7
|
+
export interface ComboboxProps {
|
|
8
|
+
options: ComboboxOption[];
|
|
9
|
+
value?: string;
|
|
10
|
+
onChange: (value: string) => void;
|
|
11
|
+
placeholder?: string;
|
|
12
|
+
searchPlaceholder?: string;
|
|
13
|
+
emptyMessage?: string;
|
|
14
|
+
disabled?: boolean;
|
|
15
|
+
id?: string;
|
|
16
|
+
className?: string;
|
|
17
|
+
"aria-invalid"?: boolean | "true" | "false";
|
|
18
|
+
"aria-describedby"?: string;
|
|
19
|
+
}
|
|
20
|
+
export declare function Combobox({ options, value, onChange, placeholder, searchPlaceholder, emptyMessage, disabled, id, className, "aria-invalid": ariaInvalid, "aria-describedby": ariaDescribedby, }: ComboboxProps): React.JSX.Element;
|
|
21
|
+
//# sourceMappingURL=combobox.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"combobox.d.ts","sourceRoot":"","sources":["../../src/components/combobox.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,MAAM,WAAW,aAAa;IAC5B,OAAO,EAAE,cAAc,EAAE,CAAA;IACzB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,cAAc,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAA;IAC3C,kBAAkB,CAAC,EAAE,MAAM,CAAA;CAC5B;AAED,wBAAgB,QAAQ,CAAC,EACvB,OAAO,EACP,KAAK,EACL,QAAQ,EACR,WAA4B,EAC5B,iBAA+B,EAC/B,YAA6C,EAC7C,QAAQ,EACR,EAAE,EACF,SAAS,EACT,cAAc,EAAE,WAAW,EAC3B,kBAAkB,EAAE,eAAe,GACpC,EAAE,aAAa,qBAyEf"}
|
package/dist/index.cjs
CHANGED
|
@@ -32,6 +32,7 @@ var index_exports = {};
|
|
|
32
32
|
__export(index_exports, {
|
|
33
33
|
AppShell: () => AppShell,
|
|
34
34
|
AuthCard: () => AuthCard,
|
|
35
|
+
Combobox: () => Combobox,
|
|
35
36
|
ConfirmDialog: () => ConfirmDialog,
|
|
36
37
|
DataTableWrapper: () => DataTableWrapper,
|
|
37
38
|
EmptyState: () => EmptyState,
|
|
@@ -609,31 +610,131 @@ var PasswordInput = React3.forwardRef(({ containerClassName, className, ...props
|
|
|
609
610
|
});
|
|
610
611
|
PasswordInput.displayName = "PasswordInput";
|
|
611
612
|
|
|
612
|
-
// src/components/
|
|
613
|
+
// src/components/combobox.tsx
|
|
614
|
+
var PopoverPrimitive = __toESM(require("@radix-ui/react-popover"), 1);
|
|
615
|
+
var import_cmdk = require("cmdk");
|
|
616
|
+
var import_lucide_react4 = require("lucide-react");
|
|
617
|
+
var React4 = __toESM(require("react"), 1);
|
|
613
618
|
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
619
|
+
function Combobox({
|
|
620
|
+
options,
|
|
621
|
+
value,
|
|
622
|
+
onChange,
|
|
623
|
+
placeholder = "Selecione...",
|
|
624
|
+
searchPlaceholder = "Buscar...",
|
|
625
|
+
emptyMessage = "Nenhum resultado encontrado.",
|
|
626
|
+
disabled,
|
|
627
|
+
id,
|
|
628
|
+
className,
|
|
629
|
+
"aria-invalid": ariaInvalid,
|
|
630
|
+
"aria-describedby": ariaDescribedby
|
|
631
|
+
}) {
|
|
632
|
+
const [open, setOpen] = React4.useState(false);
|
|
633
|
+
const selected = options.find((option) => option.value === value);
|
|
634
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(PopoverPrimitive.Root, { open, onOpenChange: setOpen, modal: true, children: [
|
|
635
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(PopoverPrimitive.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
|
|
636
|
+
"button",
|
|
637
|
+
{
|
|
638
|
+
type: "button",
|
|
639
|
+
id,
|
|
640
|
+
role: "combobox",
|
|
641
|
+
"aria-expanded": open,
|
|
642
|
+
"aria-invalid": ariaInvalid,
|
|
643
|
+
"aria-describedby": ariaDescribedby,
|
|
644
|
+
disabled,
|
|
645
|
+
className: cn(
|
|
646
|
+
"flex h-9 w-full cursor-pointer items-center justify-between gap-2 rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:focus-visible:ring-destructive",
|
|
647
|
+
className
|
|
648
|
+
),
|
|
649
|
+
children: [
|
|
650
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
651
|
+
"span",
|
|
652
|
+
{
|
|
653
|
+
className: cn("truncate", !selected && "text-muted-foreground"),
|
|
654
|
+
children: selected ? selected.label : placeholder
|
|
655
|
+
}
|
|
656
|
+
),
|
|
657
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_lucide_react4.ChevronsUpDown, { className: "h-4 w-4 shrink-0 opacity-50" })
|
|
658
|
+
]
|
|
659
|
+
}
|
|
660
|
+
) }),
|
|
661
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(PopoverPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
662
|
+
PopoverPrimitive.Content,
|
|
663
|
+
{
|
|
664
|
+
align: "start",
|
|
665
|
+
sideOffset: 4,
|
|
666
|
+
className: "z-50 overflow-hidden rounded-md border bg-popover p-0 text-popover-foreground shadow-md",
|
|
667
|
+
style: { width: "var(--radix-popover-trigger-width)" },
|
|
668
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_cmdk.Command, { className: "flex h-full w-full flex-col overflow-hidden", children: [
|
|
669
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex items-center border-b px-3", children: [
|
|
670
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_lucide_react4.Search, { className: "mr-2 h-4 w-4 shrink-0 opacity-50" }),
|
|
671
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
672
|
+
import_cmdk.Command.Input,
|
|
673
|
+
{
|
|
674
|
+
placeholder: searchPlaceholder,
|
|
675
|
+
className: "flex h-9 w-full bg-transparent py-2 text-sm outline-none placeholder:text-muted-foreground"
|
|
676
|
+
}
|
|
677
|
+
)
|
|
678
|
+
] }),
|
|
679
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_cmdk.Command.List, { className: "max-h-60 overflow-y-auto overflow-x-hidden p-1", children: [
|
|
680
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_cmdk.Command.Empty, { className: "py-6 text-center text-sm text-muted-foreground", children: emptyMessage }),
|
|
681
|
+
options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
|
|
682
|
+
import_cmdk.Command.Item,
|
|
683
|
+
{
|
|
684
|
+
value: option.label,
|
|
685
|
+
disabled: option.disabled,
|
|
686
|
+
onSelect: () => {
|
|
687
|
+
onChange(option.value);
|
|
688
|
+
setOpen(false);
|
|
689
|
+
},
|
|
690
|
+
className: "relative flex cursor-pointer select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50",
|
|
691
|
+
children: [
|
|
692
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
693
|
+
import_lucide_react4.Check,
|
|
694
|
+
{
|
|
695
|
+
className: cn(
|
|
696
|
+
"h-4 w-4 shrink-0",
|
|
697
|
+
value === option.value ? "opacity-100" : "opacity-0"
|
|
698
|
+
)
|
|
699
|
+
}
|
|
700
|
+
),
|
|
701
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "truncate", children: option.label })
|
|
702
|
+
]
|
|
703
|
+
},
|
|
704
|
+
option.value
|
|
705
|
+
))
|
|
706
|
+
] })
|
|
707
|
+
] })
|
|
708
|
+
}
|
|
709
|
+
) })
|
|
710
|
+
] });
|
|
711
|
+
}
|
|
712
|
+
|
|
713
|
+
// src/components/stat-card.tsx
|
|
714
|
+
var import_jsx_runtime17 = require("react/jsx-runtime");
|
|
614
715
|
function StatCard({ label, value, detail, icon, isLoading }) {
|
|
615
716
|
if (isLoading) {
|
|
616
|
-
return /* @__PURE__ */ (0,
|
|
617
|
-
/* @__PURE__ */ (0,
|
|
618
|
-
/* @__PURE__ */ (0,
|
|
619
|
-
/* @__PURE__ */ (0,
|
|
717
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "rounded-lg border bg-card p-6 shadow-sm", children: [
|
|
718
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex items-center justify-between pb-2", children: [
|
|
719
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "h-4 w-24 animate-pulse rounded bg-muted" }),
|
|
720
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "h-4 w-4 animate-pulse rounded bg-muted" })
|
|
620
721
|
] }),
|
|
621
|
-
/* @__PURE__ */ (0,
|
|
622
|
-
/* @__PURE__ */ (0,
|
|
722
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "mt-2 h-7 w-16 animate-pulse rounded bg-muted" }),
|
|
723
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "mt-1 h-4 w-20 animate-pulse rounded bg-muted" })
|
|
623
724
|
] });
|
|
624
725
|
}
|
|
625
|
-
return /* @__PURE__ */ (0,
|
|
626
|
-
/* @__PURE__ */ (0,
|
|
627
|
-
/* @__PURE__ */ (0,
|
|
628
|
-
icon && /* @__PURE__ */ (0,
|
|
726
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "rounded-lg border bg-card p-6 shadow-sm", children: [
|
|
727
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex items-center justify-between pb-2", children: [
|
|
728
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "text-sm font-medium text-muted-foreground", children: label }),
|
|
729
|
+
icon && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "text-muted-foreground", children: icon })
|
|
629
730
|
] }),
|
|
630
|
-
/* @__PURE__ */ (0,
|
|
631
|
-
detail && /* @__PURE__ */ (0,
|
|
731
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "text-2xl font-bold", children: value }),
|
|
732
|
+
detail && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("p", { className: "text-xs text-muted-foreground", children: detail })
|
|
632
733
|
] });
|
|
633
734
|
}
|
|
634
735
|
|
|
635
736
|
// src/components/data-table-wrapper.tsx
|
|
636
|
-
var
|
|
737
|
+
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
637
738
|
function DataTableWrapper({
|
|
638
739
|
children,
|
|
639
740
|
isEmpty,
|
|
@@ -646,15 +747,15 @@ function DataTableWrapper({
|
|
|
646
747
|
hasNextPage = false,
|
|
647
748
|
hasPreviousPage = false
|
|
648
749
|
}) {
|
|
649
|
-
return /* @__PURE__ */ (0,
|
|
650
|
-
/* @__PURE__ */ (0,
|
|
651
|
-
!isLoading && isEmpty && /* @__PURE__ */ (0,
|
|
652
|
-
emptyIcon && /* @__PURE__ */ (0,
|
|
653
|
-
/* @__PURE__ */ (0,
|
|
654
|
-
emptyDescription && /* @__PURE__ */ (0,
|
|
750
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "space-y-4", children: [
|
|
751
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "overflow-x-auto rounded-md border", children }),
|
|
752
|
+
!isLoading && isEmpty && /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex flex-col items-center justify-center py-16 text-center", children: [
|
|
753
|
+
emptyIcon && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "mb-4 text-muted-foreground", children: emptyIcon }),
|
|
754
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)("h3", { className: "text-lg font-semibold tracking-tight", children: emptyTitle }),
|
|
755
|
+
emptyDescription && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("p", { className: "mt-1 max-w-sm text-sm text-muted-foreground", children: emptyDescription })
|
|
655
756
|
] }),
|
|
656
|
-
page !== void 0 && onPageChange && /* @__PURE__ */ (0,
|
|
657
|
-
/* @__PURE__ */ (0,
|
|
757
|
+
page !== void 0 && onPageChange && /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex items-center justify-end gap-4", children: [
|
|
758
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
658
759
|
"button",
|
|
659
760
|
{
|
|
660
761
|
type: "button",
|
|
@@ -664,11 +765,11 @@ function DataTableWrapper({
|
|
|
664
765
|
children: "Anterior"
|
|
665
766
|
}
|
|
666
767
|
),
|
|
667
|
-
/* @__PURE__ */ (0,
|
|
768
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("span", { className: "text-sm text-muted-foreground", children: [
|
|
668
769
|
"P\xE1gina ",
|
|
669
770
|
page
|
|
670
771
|
] }),
|
|
671
|
-
/* @__PURE__ */ (0,
|
|
772
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
672
773
|
"button",
|
|
673
774
|
{
|
|
674
775
|
type: "button",
|
|
@@ -684,7 +785,7 @@ function DataTableWrapper({
|
|
|
684
785
|
|
|
685
786
|
// src/components/mobile-card-list.tsx
|
|
686
787
|
var import_react3 = require("react");
|
|
687
|
-
var
|
|
788
|
+
var import_jsx_runtime19 = require("react/jsx-runtime");
|
|
688
789
|
var SCROLL_THRESHOLD = 8;
|
|
689
790
|
function MobileCardList({
|
|
690
791
|
data,
|
|
@@ -715,26 +816,26 @@ function MobileCardList({
|
|
|
715
816
|
}
|
|
716
817
|
};
|
|
717
818
|
if (isLoading) {
|
|
718
|
-
return /* @__PURE__ */ (0,
|
|
719
|
-
/* @__PURE__ */ (0,
|
|
720
|
-
/* @__PURE__ */ (0,
|
|
721
|
-
/* @__PURE__ */ (0,
|
|
819
|
+
return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: `space-y-3 ${className ?? ""}`, children: Array.from({ length: loadingCount }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "rounded-xl border p-4", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "space-y-3", children: [
|
|
820
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex justify-between", children: [
|
|
821
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "h-5 w-32 animate-pulse rounded bg-muted" }),
|
|
822
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "h-5 w-16 animate-pulse rounded bg-muted" })
|
|
722
823
|
] }),
|
|
723
|
-
/* @__PURE__ */ (0,
|
|
724
|
-
/* @__PURE__ */ (0,
|
|
725
|
-
/* @__PURE__ */ (0,
|
|
726
|
-
/* @__PURE__ */ (0,
|
|
824
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "h-4 w-48 animate-pulse rounded bg-muted" }),
|
|
825
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex justify-between", children: [
|
|
826
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "h-4 w-24 animate-pulse rounded bg-muted" }),
|
|
827
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "h-4 w-20 animate-pulse rounded bg-muted" })
|
|
727
828
|
] })
|
|
728
829
|
] }) }, i)) });
|
|
729
830
|
}
|
|
730
|
-
return /* @__PURE__ */ (0,
|
|
831
|
+
return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
731
832
|
"div",
|
|
732
833
|
{
|
|
733
834
|
className: `space-y-3 ${className ?? ""}`,
|
|
734
835
|
onTouchStart,
|
|
735
836
|
onTouchMove,
|
|
736
837
|
onClickCapture,
|
|
737
|
-
children: data.map((item, index) => /* @__PURE__ */ (0,
|
|
838
|
+
children: data.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
738
839
|
"div",
|
|
739
840
|
{
|
|
740
841
|
className: "rounded-xl border p-4 transition-all duration-150 hover:border-foreground/20 active:scale-[0.99]",
|
|
@@ -747,7 +848,7 @@ function MobileCardList({
|
|
|
747
848
|
}
|
|
748
849
|
|
|
749
850
|
// src/components/responsive-data-view.tsx
|
|
750
|
-
var
|
|
851
|
+
var import_jsx_runtime20 = require("react/jsx-runtime");
|
|
751
852
|
function ResponsiveDataView({
|
|
752
853
|
table,
|
|
753
854
|
cards,
|
|
@@ -758,13 +859,13 @@ function ResponsiveDataView({
|
|
|
758
859
|
emptyDescription,
|
|
759
860
|
pagination
|
|
760
861
|
}) {
|
|
761
|
-
return /* @__PURE__ */ (0,
|
|
762
|
-
/* @__PURE__ */ (0,
|
|
763
|
-
/* @__PURE__ */ (0,
|
|
764
|
-
!isLoading && isEmpty && /* @__PURE__ */ (0,
|
|
765
|
-
emptyIcon && /* @__PURE__ */ (0,
|
|
766
|
-
/* @__PURE__ */ (0,
|
|
767
|
-
emptyDescription && /* @__PURE__ */ (0,
|
|
862
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "space-y-4", children: [
|
|
863
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "hidden overflow-x-auto rounded-md border md:block", children: table }),
|
|
864
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "md:hidden", children: cards }),
|
|
865
|
+
!isLoading && isEmpty && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex flex-col items-center justify-center py-16 text-center", children: [
|
|
866
|
+
emptyIcon && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "mb-4 text-muted-foreground", children: emptyIcon }),
|
|
867
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)("h3", { className: "text-lg font-semibold tracking-tight", children: emptyTitle }),
|
|
868
|
+
emptyDescription && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "mt-1 max-w-sm text-sm text-muted-foreground", children: emptyDescription })
|
|
768
869
|
] }),
|
|
769
870
|
pagination
|
|
770
871
|
] });
|
|
@@ -772,10 +873,10 @@ function ResponsiveDataView({
|
|
|
772
873
|
|
|
773
874
|
// src/components/toaster.tsx
|
|
774
875
|
var import_sonner = require("sonner");
|
|
775
|
-
var
|
|
876
|
+
var import_jsx_runtime21 = require("react/jsx-runtime");
|
|
776
877
|
function Toaster(props) {
|
|
777
878
|
const { theme = "system" } = useTheme();
|
|
778
|
-
return /* @__PURE__ */ (0,
|
|
879
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
779
880
|
import_sonner.Toaster,
|
|
780
881
|
{
|
|
781
882
|
theme,
|
|
@@ -796,18 +897,18 @@ function Toaster(props) {
|
|
|
796
897
|
}
|
|
797
898
|
|
|
798
899
|
// src/components/app-shell.tsx
|
|
799
|
-
var
|
|
900
|
+
var import_lucide_react6 = require("lucide-react");
|
|
800
901
|
var import_react5 = require("react");
|
|
801
902
|
|
|
802
903
|
// src/components/sidebar-nav.tsx
|
|
803
904
|
var import_react4 = require("react");
|
|
804
905
|
|
|
805
906
|
// src/components/types.tsx
|
|
806
|
-
var
|
|
807
|
-
var defaultRenderLink = ({ children, ...props }) => /* @__PURE__ */ (0,
|
|
907
|
+
var import_jsx_runtime22 = require("react/jsx-runtime");
|
|
908
|
+
var defaultRenderLink = ({ children, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("a", { ...props, children });
|
|
808
909
|
|
|
809
910
|
// src/components/sidebar-nav.tsx
|
|
810
|
-
var
|
|
911
|
+
var import_jsx_runtime23 = require("react/jsx-runtime");
|
|
811
912
|
function defaultIsActive(item, activePath) {
|
|
812
913
|
if (item.href === "/") return activePath === "/";
|
|
813
914
|
return activePath === item.href || activePath.startsWith(item.href + "/");
|
|
@@ -822,7 +923,7 @@ function SidebarNav({
|
|
|
822
923
|
onNavigate
|
|
823
924
|
}) {
|
|
824
925
|
const visible = items.filter((item) => !item.adminOnly || isAdmin);
|
|
825
|
-
return /* @__PURE__ */ (0,
|
|
926
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("nav", { className: "flex flex-col gap-1", children: visible.map((item) => {
|
|
826
927
|
const active = isActive(item, activePath);
|
|
827
928
|
const link = renderLink({
|
|
828
929
|
href: item.href,
|
|
@@ -834,19 +935,19 @@ function SidebarNav({
|
|
|
834
935
|
active ? "bg-accent text-accent-foreground font-semibold" : "text-muted-foreground hover:bg-accent hover:text-accent-foreground",
|
|
835
936
|
isCollapsed && "justify-center px-2"
|
|
836
937
|
),
|
|
837
|
-
children: /* @__PURE__ */ (0,
|
|
838
|
-
item.icon && /* @__PURE__ */ (0,
|
|
839
|
-
!isCollapsed && /* @__PURE__ */ (0,
|
|
938
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_jsx_runtime23.Fragment, { children: [
|
|
939
|
+
item.icon && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "shrink-0", children: item.icon }),
|
|
940
|
+
!isCollapsed && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "truncate", children: item.label })
|
|
840
941
|
] })
|
|
841
942
|
});
|
|
842
|
-
return /* @__PURE__ */ (0,
|
|
943
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react4.Fragment, { children: link }, item.href);
|
|
843
944
|
}) });
|
|
844
945
|
}
|
|
845
946
|
|
|
846
947
|
// src/components/user-menu.tsx
|
|
847
948
|
var DropdownMenu2 = __toESM(require("@radix-ui/react-dropdown-menu"), 1);
|
|
848
|
-
var
|
|
849
|
-
var
|
|
949
|
+
var import_lucide_react5 = require("lucide-react");
|
|
950
|
+
var import_jsx_runtime24 = require("react/jsx-runtime");
|
|
850
951
|
function initials(user) {
|
|
851
952
|
const source = user?.name?.trim() || user?.email?.trim();
|
|
852
953
|
if (!source) return "";
|
|
@@ -864,44 +965,44 @@ function UserMenu({
|
|
|
864
965
|
align = "end"
|
|
865
966
|
}) {
|
|
866
967
|
const label = initials(user);
|
|
867
|
-
return /* @__PURE__ */ (0,
|
|
868
|
-
/* @__PURE__ */ (0,
|
|
968
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(DropdownMenu2.Root, { children: [
|
|
969
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DropdownMenu2.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
869
970
|
"button",
|
|
870
971
|
{
|
|
871
972
|
type: "button",
|
|
872
973
|
className: "inline-flex h-9 w-9 items-center justify-center overflow-hidden rounded-full border border-input bg-background text-xs font-semibold shadow-sm transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring",
|
|
873
974
|
"aria-label": "Menu do usu\xE1rio",
|
|
874
975
|
"data-testid": "user-menu",
|
|
875
|
-
children: user?.avatarUrl ? /* @__PURE__ */ (0,
|
|
976
|
+
children: user?.avatarUrl ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("img", { src: user.avatarUrl, alt: user.name ?? user.email ?? "Avatar", className: "h-full w-full object-cover" }) : label ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { children: label }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react5.User, { className: "h-4 w-4" })
|
|
876
977
|
}
|
|
877
978
|
) }),
|
|
878
|
-
/* @__PURE__ */ (0,
|
|
979
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DropdownMenu2.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
|
|
879
980
|
DropdownMenu2.Content,
|
|
880
981
|
{
|
|
881
982
|
align,
|
|
882
983
|
sideOffset: 6,
|
|
883
984
|
className: "z-50 min-w-[12rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95",
|
|
884
985
|
children: [
|
|
885
|
-
(user?.name || user?.email) && /* @__PURE__ */ (0,
|
|
886
|
-
/* @__PURE__ */ (0,
|
|
887
|
-
user.name && /* @__PURE__ */ (0,
|
|
888
|
-
user.email && /* @__PURE__ */ (0,
|
|
986
|
+
(user?.name || user?.email) && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
|
|
987
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "px-2 py-1.5", children: [
|
|
988
|
+
user.name && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { className: "truncate text-sm font-medium", children: user.name }),
|
|
989
|
+
user.email && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { className: "truncate text-xs text-muted-foreground", children: user.email })
|
|
889
990
|
] }),
|
|
890
|
-
/* @__PURE__ */ (0,
|
|
991
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DropdownMenu2.Separator, { className: "-mx-1 my-1 h-px bg-border" })
|
|
891
992
|
] }),
|
|
892
993
|
items.map(
|
|
893
|
-
(item) => item.href ? /* @__PURE__ */ (0,
|
|
994
|
+
(item) => item.href ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DropdownMenu2.Item, { asChild: true, children: renderLink({ href: item.href, className: itemClass, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
|
|
894
995
|
item.icon,
|
|
895
996
|
item.label
|
|
896
|
-
] }) }) }, item.label) : /* @__PURE__ */ (0,
|
|
997
|
+
] }) }) }, item.label) : /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(DropdownMenu2.Item, { className: itemClass, onClick: item.onClick, children: [
|
|
897
998
|
item.icon,
|
|
898
999
|
item.label
|
|
899
1000
|
] }, item.label)
|
|
900
1001
|
),
|
|
901
|
-
onLogout && /* @__PURE__ */ (0,
|
|
902
|
-
items.length > 0 && /* @__PURE__ */ (0,
|
|
903
|
-
/* @__PURE__ */ (0,
|
|
904
|
-
/* @__PURE__ */ (0,
|
|
1002
|
+
onLogout && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
|
|
1003
|
+
items.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DropdownMenu2.Separator, { className: "-mx-1 my-1 h-px bg-border" }),
|
|
1004
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(DropdownMenu2.Item, { className: cn(itemClass, "text-destructive focus:bg-destructive/10"), onClick: onLogout, children: [
|
|
1005
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react5.LogOut, { className: "h-4 w-4" }),
|
|
905
1006
|
logoutLabel
|
|
906
1007
|
] })
|
|
907
1008
|
] })
|
|
@@ -912,7 +1013,7 @@ function UserMenu({
|
|
|
912
1013
|
}
|
|
913
1014
|
|
|
914
1015
|
// src/components/app-shell.tsx
|
|
915
|
-
var
|
|
1016
|
+
var import_jsx_runtime25 = require("react/jsx-runtime");
|
|
916
1017
|
function AppShell({
|
|
917
1018
|
brand,
|
|
918
1019
|
brandCollapsed,
|
|
@@ -931,7 +1032,7 @@ function AppShell({
|
|
|
931
1032
|
}) {
|
|
932
1033
|
const [collapsed, setCollapsed] = (0, import_react5.useState)(defaultCollapsed);
|
|
933
1034
|
const [mobileOpen, setMobileOpen] = (0, import_react5.useState)(false);
|
|
934
|
-
const nav = (isCollapsed, onNavigate) => /* @__PURE__ */ (0,
|
|
1035
|
+
const nav = (isCollapsed, onNavigate) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
935
1036
|
SidebarNav,
|
|
936
1037
|
{
|
|
937
1038
|
items: navItems,
|
|
@@ -943,8 +1044,8 @@ function AppShell({
|
|
|
943
1044
|
onNavigate
|
|
944
1045
|
}
|
|
945
1046
|
);
|
|
946
|
-
return /* @__PURE__ */ (0,
|
|
947
|
-
/* @__PURE__ */ (0,
|
|
1047
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex h-screen overflow-hidden bg-background", children: [
|
|
1048
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
|
|
948
1049
|
"aside",
|
|
949
1050
|
{
|
|
950
1051
|
className: cn(
|
|
@@ -952,22 +1053,22 @@ function AppShell({
|
|
|
952
1053
|
collapsed ? "w-16" : "w-60"
|
|
953
1054
|
),
|
|
954
1055
|
children: [
|
|
955
|
-
/* @__PURE__ */ (0,
|
|
956
|
-
/* @__PURE__ */ (0,
|
|
957
|
-
collapsible && /* @__PURE__ */ (0,
|
|
1056
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "flex h-14 shrink-0 items-center border-b px-4", children: collapsed ? brandCollapsed ?? brand : brand }),
|
|
1057
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "flex-1 overflow-y-auto px-2 py-4", children: nav(collapsed) }),
|
|
1058
|
+
collapsible && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "border-t p-2", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
958
1059
|
"button",
|
|
959
1060
|
{
|
|
960
1061
|
type: "button",
|
|
961
1062
|
onClick: () => setCollapsed((v) => !v),
|
|
962
1063
|
className: "flex w-full items-center justify-center rounded-md px-2 py-2 text-muted-foreground transition-colors hover:bg-accent hover:text-accent-foreground",
|
|
963
1064
|
"aria-label": collapsed ? "Expandir menu" : "Recolher menu",
|
|
964
|
-
children: collapsed ? /* @__PURE__ */ (0,
|
|
1065
|
+
children: collapsed ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_lucide_react6.ChevronRight, { className: "h-4 w-4" }) : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_lucide_react6.ChevronLeft, { className: "h-4 w-4" })
|
|
965
1066
|
}
|
|
966
1067
|
) })
|
|
967
1068
|
]
|
|
968
1069
|
}
|
|
969
1070
|
),
|
|
970
|
-
/* @__PURE__ */ (0,
|
|
1071
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
|
|
971
1072
|
"div",
|
|
972
1073
|
{
|
|
973
1074
|
className: cn(
|
|
@@ -976,8 +1077,8 @@ function AppShell({
|
|
|
976
1077
|
),
|
|
977
1078
|
onClick: () => setMobileOpen(false),
|
|
978
1079
|
children: [
|
|
979
|
-
/* @__PURE__ */ (0,
|
|
980
|
-
/* @__PURE__ */ (0,
|
|
1080
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "absolute inset-0 bg-black/50" }),
|
|
1081
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
|
|
981
1082
|
"div",
|
|
982
1083
|
{
|
|
983
1084
|
className: cn(
|
|
@@ -986,40 +1087,40 @@ function AppShell({
|
|
|
986
1087
|
),
|
|
987
1088
|
onClick: (e) => e.stopPropagation(),
|
|
988
1089
|
children: [
|
|
989
|
-
/* @__PURE__ */ (0,
|
|
990
|
-
/* @__PURE__ */ (0,
|
|
1090
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "flex h-14 shrink-0 items-center border-b px-4", children: brand }),
|
|
1091
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "flex-1 overflow-y-auto px-2 py-4", children: nav(false, () => setMobileOpen(false)) })
|
|
991
1092
|
]
|
|
992
1093
|
}
|
|
993
1094
|
)
|
|
994
1095
|
]
|
|
995
1096
|
}
|
|
996
1097
|
),
|
|
997
|
-
/* @__PURE__ */ (0,
|
|
998
|
-
/* @__PURE__ */ (0,
|
|
999
|
-
/* @__PURE__ */ (0,
|
|
1098
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
|
|
1099
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("header", { className: "flex h-14 shrink-0 items-center gap-2 border-b bg-background px-4", children: [
|
|
1100
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
1000
1101
|
"button",
|
|
1001
1102
|
{
|
|
1002
1103
|
type: "button",
|
|
1003
1104
|
onClick: () => setMobileOpen(true),
|
|
1004
1105
|
className: "inline-flex h-9 w-9 items-center justify-center rounded-md border border-input bg-background shadow-sm transition-colors hover:bg-accent hover:text-accent-foreground md:hidden",
|
|
1005
1106
|
"aria-label": "Abrir menu",
|
|
1006
|
-
children: /* @__PURE__ */ (0,
|
|
1107
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_lucide_react6.Menu, { className: "h-4 w-4" })
|
|
1007
1108
|
}
|
|
1008
1109
|
),
|
|
1009
|
-
/* @__PURE__ */ (0,
|
|
1110
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "ml-auto flex items-center gap-2", children: [
|
|
1010
1111
|
headerActions,
|
|
1011
|
-
(user || onLogout) && /* @__PURE__ */ (0,
|
|
1112
|
+
(user || onLogout) && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(UserMenu, { user, items: userMenuItems, onLogout, renderLink })
|
|
1012
1113
|
] })
|
|
1013
1114
|
] }),
|
|
1014
|
-
/* @__PURE__ */ (0,
|
|
1115
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)("main", { className: "flex-1 overflow-y-auto", children })
|
|
1015
1116
|
] })
|
|
1016
1117
|
] });
|
|
1017
1118
|
}
|
|
1018
1119
|
|
|
1019
1120
|
// src/components/row-actions-menu.tsx
|
|
1020
1121
|
var DropdownMenu3 = __toESM(require("@radix-ui/react-dropdown-menu"), 1);
|
|
1021
|
-
var
|
|
1022
|
-
var
|
|
1122
|
+
var import_lucide_react7 = require("lucide-react");
|
|
1123
|
+
var import_jsx_runtime26 = require("react/jsx-runtime");
|
|
1023
1124
|
var itemClass2 = "flex w-full cursor-pointer select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors hover:bg-accent focus:bg-accent data-[disabled]:pointer-events-none data-[disabled]:opacity-50";
|
|
1024
1125
|
function RowActionsMenu({
|
|
1025
1126
|
actions,
|
|
@@ -1029,18 +1130,18 @@ function RowActionsMenu({
|
|
|
1029
1130
|
renderLink = defaultRenderLink
|
|
1030
1131
|
}) {
|
|
1031
1132
|
if (actions.length === 0) return null;
|
|
1032
|
-
return /* @__PURE__ */ (0,
|
|
1033
|
-
/* @__PURE__ */ (0,
|
|
1133
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(DropdownMenu3.Root, { children: [
|
|
1134
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(DropdownMenu3.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
1034
1135
|
"button",
|
|
1035
1136
|
{
|
|
1036
1137
|
type: "button",
|
|
1037
1138
|
disabled,
|
|
1038
1139
|
"aria-label": label,
|
|
1039
1140
|
className: "inline-flex h-8 w-8 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50",
|
|
1040
|
-
children: /* @__PURE__ */ (0,
|
|
1141
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_lucide_react7.MoreVertical, { className: "h-4 w-4" })
|
|
1041
1142
|
}
|
|
1042
1143
|
) }),
|
|
1043
|
-
/* @__PURE__ */ (0,
|
|
1144
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(DropdownMenu3.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
1044
1145
|
DropdownMenu3.Content,
|
|
1045
1146
|
{
|
|
1046
1147
|
align,
|
|
@@ -1048,14 +1149,14 @@ function RowActionsMenu({
|
|
|
1048
1149
|
className: "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95",
|
|
1049
1150
|
children: actions.map((action) => {
|
|
1050
1151
|
const cls = cn(itemClass2, action.destructive && "text-destructive focus:bg-destructive/10");
|
|
1051
|
-
return action.href ? /* @__PURE__ */ (0,
|
|
1152
|
+
return action.href ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(DropdownMenu3.Item, { asChild: true, disabled: action.disabled, children: renderLink({
|
|
1052
1153
|
href: action.href,
|
|
1053
1154
|
className: cls,
|
|
1054
|
-
children: /* @__PURE__ */ (0,
|
|
1155
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_jsx_runtime26.Fragment, { children: [
|
|
1055
1156
|
action.icon,
|
|
1056
1157
|
action.label
|
|
1057
1158
|
] })
|
|
1058
|
-
}) }, action.label) : /* @__PURE__ */ (0,
|
|
1159
|
+
}) }, action.label) : /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
1059
1160
|
DropdownMenu3.Item,
|
|
1060
1161
|
{
|
|
1061
1162
|
className: cls,
|
|
@@ -1122,6 +1223,7 @@ function useCustomToast() {
|
|
|
1122
1223
|
0 && (module.exports = {
|
|
1123
1224
|
AppShell,
|
|
1124
1225
|
AuthCard,
|
|
1226
|
+
Combobox,
|
|
1125
1227
|
ConfirmDialog,
|
|
1126
1228
|
DataTableWrapper,
|
|
1127
1229
|
EmptyState,
|