shadcn-ui-react 0.1.1 → 0.2.0

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 CHANGED
@@ -64,6 +64,7 @@ __export(index_exports, {
64
64
  AccordionTrigger: () => AccordionTrigger,
65
65
  Alert: () => Alert,
66
66
  AlertDescription: () => AlertDescription,
67
+ AlertModal: () => AlertModal,
67
68
  AlertTitle: () => AlertTitle,
68
69
  AspectRatio: () => AspectRatio,
69
70
  Avatar: () => Avatar,
@@ -77,6 +78,7 @@ __export(index_exports, {
77
78
  BreadcrumbList: () => BreadcrumbList,
78
79
  BreadcrumbPage: () => BreadcrumbPage,
79
80
  BreadcrumbSeparator: () => BreadcrumbSeparator,
81
+ Breadcrumbs: () => Breadcrumbs,
80
82
  Button: () => Button,
81
83
  Calendar: () => Calendar,
82
84
  Card: () => Card,
@@ -118,6 +120,7 @@ __export(index_exports, {
118
120
  ContextMenuSubContent: () => ContextMenuSubContent,
119
121
  ContextMenuSubTrigger: () => ContextMenuSubTrigger,
120
122
  ContextMenuTrigger: () => ContextMenuTrigger,
123
+ DataTableSkeleton: () => DataTableSkeleton,
121
124
  Dialog: () => Dialog,
122
125
  DialogClose: () => DialogClose,
123
126
  DialogContent: () => DialogContent,
@@ -187,6 +190,7 @@ __export(index_exports, {
187
190
  MenubarSubTrigger: () => MenubarSubTrigger,
188
191
  MenubarTrigger: () => MenubarTrigger,
189
192
  Modal: () => Modal,
193
+ ModeToggle: () => ModeToggle,
190
194
  NavigationMenu: () => NavigationMenu,
191
195
  NavigationMenuContent: () => NavigationMenuContent,
192
196
  NavigationMenuIndicator: () => NavigationMenuIndicator,
@@ -8991,6 +8995,124 @@ function useToast() {
8991
8995
  dismiss: (toastId) => dispatch({ type: "DISMISS_TOAST", toastId })
8992
8996
  });
8993
8997
  }
8998
+
8999
+ // src/shared/alert-modal.tsx
9000
+ var import_jsx_runtime44 = require("react/jsx-runtime");
9001
+ var AlertModal = ({
9002
+ isOpen,
9003
+ onClose,
9004
+ onConfirm,
9005
+ loading,
9006
+ title = "Are you sure?",
9007
+ description = "Are you sure you want to continue?",
9008
+ cancelText = "Cancel",
9009
+ confirmText = "Confirm",
9010
+ className,
9011
+ children
9012
+ }) => {
9013
+ return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
9014
+ Modal,
9015
+ {
9016
+ title,
9017
+ description,
9018
+ isOpen,
9019
+ onClose,
9020
+ className,
9021
+ children: children ? children : /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: "flex w-full items-center justify-end space-x-2 pt-6", children: [
9022
+ /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Button, { disabled: loading, variant: "outline", onClick: onClose, children: cancelText }),
9023
+ /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Button, { disabled: loading, variant: "destructive", onClick: onConfirm, children: confirmText })
9024
+ ] })
9025
+ }
9026
+ );
9027
+ };
9028
+
9029
+ // src/shared/breadcrumbs.tsx
9030
+ var import_lucide_react3 = require("lucide-react");
9031
+ var import_react34 = require("react");
9032
+ var import_jsx_runtime45 = require("react/jsx-runtime");
9033
+ function Breadcrumbs({ items, className, classNameList }) {
9034
+ return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(Breadcrumb, { className, children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(BreadcrumbList, { className: classNameList, children: items.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(import_react34.Fragment, { children: [
9035
+ index !== items.length - 1 && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(BreadcrumbItem, { className: item.className, children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(BreadcrumbLink, { href: item.link, children: item.title }) }),
9036
+ index < items.length - 1 && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(BreadcrumbSeparator, { children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_lucide_react3.Slash, {}) }),
9037
+ index === items.length - 1 && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(BreadcrumbPage, { children: item.title })
9038
+ ] }, item.title)) }) });
9039
+ }
9040
+
9041
+ // src/shared/data-table-skeleton.tsx
9042
+ var import_jsx_runtime46 = require("react/jsx-runtime");
9043
+ function DataTableSkeleton({
9044
+ columnCount,
9045
+ rowCount = 10,
9046
+ searchableColumnCount = 0,
9047
+ filterableColumnCount = 0,
9048
+ showViewOptions = true
9049
+ }) {
9050
+ return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "w-full space-y-3 overflow-auto", children: [
9051
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "flex w-full items-center justify-between space-x-2 overflow-auto p-1", children: [
9052
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "flex flex-1 items-center space-x-2 space-y-4", children: [
9053
+ searchableColumnCount > 0 ? Array.from({ length: searchableColumnCount }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Skeleton, { className: "h-10 w-[150px] lg:w-[250px]" }, i)) : null,
9054
+ filterableColumnCount > 0 ? Array.from({ length: filterableColumnCount }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Skeleton, { className: "h-10 w-[70px] border-dashed" }, i)) : null
9055
+ ] }),
9056
+ showViewOptions ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Skeleton, { className: "ml-auto hidden h-7 w-[70px] lg:flex" }) : null
9057
+ ] }),
9058
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: "rounded-md border", children: /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(Table, { children: [
9059
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(TableHeader, { children: Array.from({ length: 1 }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(TableRow, { className: "hover:bg-transparent", children: Array.from({ length: columnCount }).map((_2, i2) => /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(TableHead, { children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Skeleton, { className: "h-6 w-full" }) }, i2)) }, i)) }),
9060
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(TableBody, { children: Array.from({ length: rowCount }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(TableRow, { className: "hover:bg-transparent", children: Array.from({ length: columnCount }).map((_2, i2) => /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(TableCell, { children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Skeleton, { className: "h-6 w-full" }) }, i2)) }, i)) })
9061
+ ] }) }),
9062
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "flex w-full flex-col items-center justify-between gap-4 overflow-auto px-2 py-1 sm:flex-row sm:gap-8", children: [
9063
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: "flex-1", children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Skeleton, { className: "h-8 w-40" }) }),
9064
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "flex flex-col items-center gap-4 sm:flex-row sm:gap-6 lg:gap-8", children: [
9065
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "flex items-center space-x-2", children: [
9066
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Skeleton, { className: "h-8 w-24" }),
9067
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Skeleton, { className: "h-8 w-[70px]" })
9068
+ ] }),
9069
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: "flex w-[100px] items-center justify-center text-sm font-medium", children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Skeleton, { className: "h-8 w-20" }) }),
9070
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "flex items-center space-x-2", children: [
9071
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Skeleton, { className: "hidden size-8 lg:block" }),
9072
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Skeleton, { className: "size-8" }),
9073
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Skeleton, { className: "size-8" }),
9074
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Skeleton, { className: "hidden size-8 lg:block" })
9075
+ ] })
9076
+ ] })
9077
+ ] })
9078
+ ] });
9079
+ }
9080
+
9081
+ // src/shared/theme-toggle.tsx
9082
+ var import_lucide_react4 = require("lucide-react");
9083
+
9084
+ // src/providers/theme-provider.tsx
9085
+ var import_react35 = require("react");
9086
+ var import_jsx_runtime47 = require("react/jsx-runtime");
9087
+ var initialState = {
9088
+ theme: "system",
9089
+ setTheme: () => null
9090
+ };
9091
+ var ThemeProviderContext = (0, import_react35.createContext)(initialState);
9092
+ var useTheme2 = () => {
9093
+ const context = (0, import_react35.useContext)(ThemeProviderContext);
9094
+ if (context === void 0)
9095
+ throw new Error("useTheme must be used within a ThemeProvider");
9096
+ return context;
9097
+ };
9098
+
9099
+ // src/shared/theme-toggle.tsx
9100
+ var import_jsx_runtime48 = require("react/jsx-runtime");
9101
+ function ModeToggle() {
9102
+ const { setTheme } = useTheme2();
9103
+ return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(DropdownMenu, { children: [
9104
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(Button, { variant: "outline", size: "icon", children: [
9105
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_lucide_react4.Sun, { className: "h-[1.2rem] w-[1.2rem] rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" }),
9106
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_lucide_react4.Moon, { className: "absolute h-[1.2rem] w-[1.2rem] rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" }),
9107
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("span", { className: "sr-only", children: "Toggle theme" })
9108
+ ] }) }),
9109
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(DropdownMenuContent, { align: "end", children: [
9110
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(DropdownMenuItem, { onClick: () => setTheme("light"), children: "Light" }),
9111
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(DropdownMenuItem, { onClick: () => setTheme("dark"), children: "Dark" }),
9112
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(DropdownMenuItem, { onClick: () => setTheme("system"), children: "System" })
9113
+ ] })
9114
+ ] });
9115
+ }
8994
9116
  // Annotate the CommonJS export names for ESM import in node:
8995
9117
  0 && (module.exports = {
8996
9118
  Accordion,
@@ -8999,6 +9121,7 @@ function useToast() {
8999
9121
  AccordionTrigger,
9000
9122
  Alert,
9001
9123
  AlertDescription,
9124
+ AlertModal,
9002
9125
  AlertTitle,
9003
9126
  AspectRatio,
9004
9127
  Avatar,
@@ -9012,6 +9135,7 @@ function useToast() {
9012
9135
  BreadcrumbList,
9013
9136
  BreadcrumbPage,
9014
9137
  BreadcrumbSeparator,
9138
+ Breadcrumbs,
9015
9139
  Button,
9016
9140
  Calendar,
9017
9141
  Card,
@@ -9053,6 +9177,7 @@ function useToast() {
9053
9177
  ContextMenuSubContent,
9054
9178
  ContextMenuSubTrigger,
9055
9179
  ContextMenuTrigger,
9180
+ DataTableSkeleton,
9056
9181
  Dialog,
9057
9182
  DialogClose,
9058
9183
  DialogContent,
@@ -9122,6 +9247,7 @@ function useToast() {
9122
9247
  MenubarSubTrigger,
9123
9248
  MenubarTrigger,
9124
9249
  Modal,
9250
+ ModeToggle,
9125
9251
  NavigationMenu,
9126
9252
  NavigationMenuContent,
9127
9253
  NavigationMenuIndicator,
package/dist/index.d.cts CHANGED
@@ -649,6 +649,54 @@ declare function useToast(): {
649
649
  toasts: ToasterToast[];
650
650
  };
651
651
 
652
+ type TAlertModalProps = {
653
+ isOpen: boolean;
654
+ onClose: () => void;
655
+ onConfirm: () => void;
656
+ loading: boolean;
657
+ title?: string;
658
+ description?: string;
659
+ className?: string;
660
+ cancelText?: string;
661
+ confirmText?: string;
662
+ children?: React.ReactNode;
663
+ };
664
+ declare const AlertModal: ({ isOpen, onClose, onConfirm, loading, title, description, cancelText, confirmText, className, children, }: TAlertModalProps) => react_jsx_runtime.JSX.Element;
665
+
666
+ type BreadcrumbItemProps = {
667
+ title: string;
668
+ link: string;
669
+ className?: string;
670
+ };
671
+ type BreadcrumbsProps = {
672
+ items: BreadcrumbItemProps[];
673
+ className?: string;
674
+ classNameList?: string;
675
+ separator?: React.ReactNode;
676
+ };
677
+ declare function Breadcrumbs({ items, className, classNameList }: BreadcrumbsProps): react_jsx_runtime.JSX.Element;
678
+
679
+ interface NavItem {
680
+ title: string;
681
+ href: string;
682
+ disabled?: boolean;
683
+ external?: boolean;
684
+ icon?: keyof typeof Icons;
685
+ label?: string;
686
+ description?: string;
687
+ }
688
+
689
+ type DataTableSkeletonProps = {
690
+ columnCount: number;
691
+ rowCount?: number;
692
+ searchableColumnCount?: number;
693
+ filterableColumnCount?: number;
694
+ showViewOptions?: boolean;
695
+ };
696
+ declare function DataTableSkeleton({ columnCount, rowCount, searchableColumnCount, filterableColumnCount, showViewOptions }: DataTableSkeletonProps): react_jsx_runtime.JSX.Element;
697
+
698
+ declare function ModeToggle(): react_jsx_runtime.JSX.Element;
699
+
652
700
  declare function cn(...inputs: ClassValue[]): string;
653
701
 
654
- export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertTitle, AspectRatio, Avatar, AvatarFallback, AvatarImage, Badge, type BadgeProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, type ButtonProps, Calendar, type CalendarProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, type CarouselApi, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, HoverCard, HoverCardContent, HoverCardTrigger, Icons, Input, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, type InputProps, Label, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, Modal, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationNextLast, PaginationPrevious, PaginationPreviousLast, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Skeleton, Slider, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, type TextareaProps, Toast$1 as Toast, ToastAction, type ToastActionElement, ToastClose, ToastDescription, type ToastProps, ToastProvider, ToastTitle, ToastViewport, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buttonVariants, cn, navigationMenuTriggerStyle, reducer, toast, toggleVariants, useFormField, useToast };
702
+ export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertModal, AlertTitle, AspectRatio, Avatar, AvatarFallback, AvatarImage, Badge, type BadgeProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Breadcrumbs, Button, type ButtonProps, Calendar, type CalendarProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, type CarouselApi, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, DataTableSkeleton, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, HoverCard, HoverCardContent, HoverCardTrigger, Icons, Input, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, type InputProps, Label, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, Modal, ModeToggle, type NavItem, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationNextLast, PaginationPrevious, PaginationPreviousLast, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Skeleton, Slider, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, type TextareaProps, Toast$1 as Toast, ToastAction, type ToastActionElement, ToastClose, ToastDescription, type ToastProps, ToastProvider, ToastTitle, ToastViewport, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buttonVariants, cn, navigationMenuTriggerStyle, reducer, toast, toggleVariants, useFormField, useToast };
package/dist/index.d.ts CHANGED
@@ -649,6 +649,54 @@ declare function useToast(): {
649
649
  toasts: ToasterToast[];
650
650
  };
651
651
 
652
+ type TAlertModalProps = {
653
+ isOpen: boolean;
654
+ onClose: () => void;
655
+ onConfirm: () => void;
656
+ loading: boolean;
657
+ title?: string;
658
+ description?: string;
659
+ className?: string;
660
+ cancelText?: string;
661
+ confirmText?: string;
662
+ children?: React.ReactNode;
663
+ };
664
+ declare const AlertModal: ({ isOpen, onClose, onConfirm, loading, title, description, cancelText, confirmText, className, children, }: TAlertModalProps) => react_jsx_runtime.JSX.Element;
665
+
666
+ type BreadcrumbItemProps = {
667
+ title: string;
668
+ link: string;
669
+ className?: string;
670
+ };
671
+ type BreadcrumbsProps = {
672
+ items: BreadcrumbItemProps[];
673
+ className?: string;
674
+ classNameList?: string;
675
+ separator?: React.ReactNode;
676
+ };
677
+ declare function Breadcrumbs({ items, className, classNameList }: BreadcrumbsProps): react_jsx_runtime.JSX.Element;
678
+
679
+ interface NavItem {
680
+ title: string;
681
+ href: string;
682
+ disabled?: boolean;
683
+ external?: boolean;
684
+ icon?: keyof typeof Icons;
685
+ label?: string;
686
+ description?: string;
687
+ }
688
+
689
+ type DataTableSkeletonProps = {
690
+ columnCount: number;
691
+ rowCount?: number;
692
+ searchableColumnCount?: number;
693
+ filterableColumnCount?: number;
694
+ showViewOptions?: boolean;
695
+ };
696
+ declare function DataTableSkeleton({ columnCount, rowCount, searchableColumnCount, filterableColumnCount, showViewOptions }: DataTableSkeletonProps): react_jsx_runtime.JSX.Element;
697
+
698
+ declare function ModeToggle(): react_jsx_runtime.JSX.Element;
699
+
652
700
  declare function cn(...inputs: ClassValue[]): string;
653
701
 
654
- export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertTitle, AspectRatio, Avatar, AvatarFallback, AvatarImage, Badge, type BadgeProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, type ButtonProps, Calendar, type CalendarProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, type CarouselApi, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, HoverCard, HoverCardContent, HoverCardTrigger, Icons, Input, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, type InputProps, Label, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, Modal, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationNextLast, PaginationPrevious, PaginationPreviousLast, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Skeleton, Slider, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, type TextareaProps, Toast$1 as Toast, ToastAction, type ToastActionElement, ToastClose, ToastDescription, type ToastProps, ToastProvider, ToastTitle, ToastViewport, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buttonVariants, cn, navigationMenuTriggerStyle, reducer, toast, toggleVariants, useFormField, useToast };
702
+ export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertModal, AlertTitle, AspectRatio, Avatar, AvatarFallback, AvatarImage, Badge, type BadgeProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Breadcrumbs, Button, type ButtonProps, Calendar, type CalendarProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, type CarouselApi, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, DataTableSkeleton, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, HoverCard, HoverCardContent, HoverCardTrigger, Icons, Input, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, type InputProps, Label, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, Modal, ModeToggle, type NavItem, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationNextLast, PaginationPrevious, PaginationPreviousLast, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Skeleton, Slider, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, type TextareaProps, Toast$1 as Toast, ToastAction, type ToastActionElement, ToastClose, ToastDescription, type ToastProps, ToastProvider, ToastTitle, ToastViewport, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buttonVariants, cn, navigationMenuTriggerStyle, reducer, toast, toggleVariants, useFormField, useToast };
package/dist/index.js CHANGED
@@ -8794,6 +8794,124 @@ function useToast() {
8794
8794
  dismiss: (toastId) => dispatch({ type: "DISMISS_TOAST", toastId })
8795
8795
  });
8796
8796
  }
8797
+
8798
+ // src/shared/alert-modal.tsx
8799
+ import { jsx as jsx44, jsxs as jsxs18 } from "react/jsx-runtime";
8800
+ var AlertModal = ({
8801
+ isOpen,
8802
+ onClose,
8803
+ onConfirm,
8804
+ loading,
8805
+ title = "Are you sure?",
8806
+ description = "Are you sure you want to continue?",
8807
+ cancelText = "Cancel",
8808
+ confirmText = "Confirm",
8809
+ className,
8810
+ children
8811
+ }) => {
8812
+ return /* @__PURE__ */ jsx44(
8813
+ Modal,
8814
+ {
8815
+ title,
8816
+ description,
8817
+ isOpen,
8818
+ onClose,
8819
+ className,
8820
+ children: children ? children : /* @__PURE__ */ jsxs18("div", { className: "flex w-full items-center justify-end space-x-2 pt-6", children: [
8821
+ /* @__PURE__ */ jsx44(Button, { disabled: loading, variant: "outline", onClick: onClose, children: cancelText }),
8822
+ /* @__PURE__ */ jsx44(Button, { disabled: loading, variant: "destructive", onClick: onConfirm, children: confirmText })
8823
+ ] })
8824
+ }
8825
+ );
8826
+ };
8827
+
8828
+ // src/shared/breadcrumbs.tsx
8829
+ import { Slash } from "lucide-react";
8830
+ import { Fragment } from "react";
8831
+ import { jsx as jsx45, jsxs as jsxs19 } from "react/jsx-runtime";
8832
+ function Breadcrumbs({ items, className, classNameList }) {
8833
+ return /* @__PURE__ */ jsx45(Breadcrumb, { className, children: /* @__PURE__ */ jsx45(BreadcrumbList, { className: classNameList, children: items.map((item, index) => /* @__PURE__ */ jsxs19(Fragment, { children: [
8834
+ index !== items.length - 1 && /* @__PURE__ */ jsx45(BreadcrumbItem, { className: item.className, children: /* @__PURE__ */ jsx45(BreadcrumbLink, { href: item.link, children: item.title }) }),
8835
+ index < items.length - 1 && /* @__PURE__ */ jsx45(BreadcrumbSeparator, { children: /* @__PURE__ */ jsx45(Slash, {}) }),
8836
+ index === items.length - 1 && /* @__PURE__ */ jsx45(BreadcrumbPage, { children: item.title })
8837
+ ] }, item.title)) }) });
8838
+ }
8839
+
8840
+ // src/shared/data-table-skeleton.tsx
8841
+ import { jsx as jsx46, jsxs as jsxs20 } from "react/jsx-runtime";
8842
+ function DataTableSkeleton({
8843
+ columnCount,
8844
+ rowCount = 10,
8845
+ searchableColumnCount = 0,
8846
+ filterableColumnCount = 0,
8847
+ showViewOptions = true
8848
+ }) {
8849
+ return /* @__PURE__ */ jsxs20("div", { className: "w-full space-y-3 overflow-auto", children: [
8850
+ /* @__PURE__ */ jsxs20("div", { className: "flex w-full items-center justify-between space-x-2 overflow-auto p-1", children: [
8851
+ /* @__PURE__ */ jsxs20("div", { className: "flex flex-1 items-center space-x-2 space-y-4", children: [
8852
+ searchableColumnCount > 0 ? Array.from({ length: searchableColumnCount }).map((_, i) => /* @__PURE__ */ jsx46(Skeleton, { className: "h-10 w-[150px] lg:w-[250px]" }, i)) : null,
8853
+ filterableColumnCount > 0 ? Array.from({ length: filterableColumnCount }).map((_, i) => /* @__PURE__ */ jsx46(Skeleton, { className: "h-10 w-[70px] border-dashed" }, i)) : null
8854
+ ] }),
8855
+ showViewOptions ? /* @__PURE__ */ jsx46(Skeleton, { className: "ml-auto hidden h-7 w-[70px] lg:flex" }) : null
8856
+ ] }),
8857
+ /* @__PURE__ */ jsx46("div", { className: "rounded-md border", children: /* @__PURE__ */ jsxs20(Table, { children: [
8858
+ /* @__PURE__ */ jsx46(TableHeader, { children: Array.from({ length: 1 }).map((_, i) => /* @__PURE__ */ jsx46(TableRow, { className: "hover:bg-transparent", children: Array.from({ length: columnCount }).map((_2, i2) => /* @__PURE__ */ jsx46(TableHead, { children: /* @__PURE__ */ jsx46(Skeleton, { className: "h-6 w-full" }) }, i2)) }, i)) }),
8859
+ /* @__PURE__ */ jsx46(TableBody, { children: Array.from({ length: rowCount }).map((_, i) => /* @__PURE__ */ jsx46(TableRow, { className: "hover:bg-transparent", children: Array.from({ length: columnCount }).map((_2, i2) => /* @__PURE__ */ jsx46(TableCell, { children: /* @__PURE__ */ jsx46(Skeleton, { className: "h-6 w-full" }) }, i2)) }, i)) })
8860
+ ] }) }),
8861
+ /* @__PURE__ */ jsxs20("div", { className: "flex w-full flex-col items-center justify-between gap-4 overflow-auto px-2 py-1 sm:flex-row sm:gap-8", children: [
8862
+ /* @__PURE__ */ jsx46("div", { className: "flex-1", children: /* @__PURE__ */ jsx46(Skeleton, { className: "h-8 w-40" }) }),
8863
+ /* @__PURE__ */ jsxs20("div", { className: "flex flex-col items-center gap-4 sm:flex-row sm:gap-6 lg:gap-8", children: [
8864
+ /* @__PURE__ */ jsxs20("div", { className: "flex items-center space-x-2", children: [
8865
+ /* @__PURE__ */ jsx46(Skeleton, { className: "h-8 w-24" }),
8866
+ /* @__PURE__ */ jsx46(Skeleton, { className: "h-8 w-[70px]" })
8867
+ ] }),
8868
+ /* @__PURE__ */ jsx46("div", { className: "flex w-[100px] items-center justify-center text-sm font-medium", children: /* @__PURE__ */ jsx46(Skeleton, { className: "h-8 w-20" }) }),
8869
+ /* @__PURE__ */ jsxs20("div", { className: "flex items-center space-x-2", children: [
8870
+ /* @__PURE__ */ jsx46(Skeleton, { className: "hidden size-8 lg:block" }),
8871
+ /* @__PURE__ */ jsx46(Skeleton, { className: "size-8" }),
8872
+ /* @__PURE__ */ jsx46(Skeleton, { className: "size-8" }),
8873
+ /* @__PURE__ */ jsx46(Skeleton, { className: "hidden size-8 lg:block" })
8874
+ ] })
8875
+ ] })
8876
+ ] })
8877
+ ] });
8878
+ }
8879
+
8880
+ // src/shared/theme-toggle.tsx
8881
+ import { Moon as Moon2, Sun } from "lucide-react";
8882
+
8883
+ // src/providers/theme-provider.tsx
8884
+ import { createContext as createContext5, useContext as useContext6, useEffect as useEffect5, useState as useState5 } from "react";
8885
+ import { jsx as jsx47 } from "react/jsx-runtime";
8886
+ var initialState = {
8887
+ theme: "system",
8888
+ setTheme: () => null
8889
+ };
8890
+ var ThemeProviderContext = createContext5(initialState);
8891
+ var useTheme2 = () => {
8892
+ const context = useContext6(ThemeProviderContext);
8893
+ if (context === void 0)
8894
+ throw new Error("useTheme must be used within a ThemeProvider");
8895
+ return context;
8896
+ };
8897
+
8898
+ // src/shared/theme-toggle.tsx
8899
+ import { jsx as jsx48, jsxs as jsxs21 } from "react/jsx-runtime";
8900
+ function ModeToggle() {
8901
+ const { setTheme } = useTheme2();
8902
+ return /* @__PURE__ */ jsxs21(DropdownMenu, { children: [
8903
+ /* @__PURE__ */ jsx48(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs21(Button, { variant: "outline", size: "icon", children: [
8904
+ /* @__PURE__ */ jsx48(Sun, { className: "h-[1.2rem] w-[1.2rem] rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" }),
8905
+ /* @__PURE__ */ jsx48(Moon2, { className: "absolute h-[1.2rem] w-[1.2rem] rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" }),
8906
+ /* @__PURE__ */ jsx48("span", { className: "sr-only", children: "Toggle theme" })
8907
+ ] }) }),
8908
+ /* @__PURE__ */ jsxs21(DropdownMenuContent, { align: "end", children: [
8909
+ /* @__PURE__ */ jsx48(DropdownMenuItem, { onClick: () => setTheme("light"), children: "Light" }),
8910
+ /* @__PURE__ */ jsx48(DropdownMenuItem, { onClick: () => setTheme("dark"), children: "Dark" }),
8911
+ /* @__PURE__ */ jsx48(DropdownMenuItem, { onClick: () => setTheme("system"), children: "System" })
8912
+ ] })
8913
+ ] });
8914
+ }
8797
8915
  export {
8798
8916
  Accordion,
8799
8917
  AccordionContent,
@@ -8801,6 +8919,7 @@ export {
8801
8919
  AccordionTrigger,
8802
8920
  Alert,
8803
8921
  AlertDescription,
8922
+ AlertModal,
8804
8923
  AlertTitle,
8805
8924
  AspectRatio,
8806
8925
  Avatar,
@@ -8814,6 +8933,7 @@ export {
8814
8933
  BreadcrumbList,
8815
8934
  BreadcrumbPage,
8816
8935
  BreadcrumbSeparator,
8936
+ Breadcrumbs,
8817
8937
  Button,
8818
8938
  Calendar,
8819
8939
  Card,
@@ -8855,6 +8975,7 @@ export {
8855
8975
  ContextMenuSubContent,
8856
8976
  ContextMenuSubTrigger,
8857
8977
  ContextMenuTrigger,
8978
+ DataTableSkeleton,
8858
8979
  Dialog,
8859
8980
  DialogClose,
8860
8981
  DialogContent,
@@ -8924,6 +9045,7 @@ export {
8924
9045
  MenubarSubTrigger,
8925
9046
  MenubarTrigger,
8926
9047
  Modal,
9048
+ ModeToggle,
8927
9049
  NavigationMenu,
8928
9050
  NavigationMenuContent,
8929
9051
  NavigationMenuIndicator,