shadcn-ui-react 0.2.8 → 0.3.0

package/dist/index.js

@@ -319,11 +319,12 @@ var BreadcrumbEllipsis = (_a) => {
 };
 BreadcrumbEllipsis.displayName = "BreadcrumbElipssis";
 
-// src/components/button.tsx
+// src/components/Button/button.tsx
 import { Slot as Slot2 } from "@radix-ui/react-slot";
 import { cva as cva3 } from "class-variance-authority";
 import * as React5 from "react";
-import { jsx as jsx6 } from "react/jsx-runtime";
+import { Loader2 } from "lucide-react";
+import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
 var buttonVariants = cva3(
   "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50",
   {
@@ -351,14 +352,40 @@ var buttonVariants = cva3(
 );
 var Button = React5.forwardRef(
   (_a, ref) => {
-    var _b = _a, { className, variant, size, asChild = false } = _b, props = __objRest(_b, ["className", "variant", "size", "asChild"]);
+    var _b = _a, {
+      className,
+      variant,
+      size,
+      asChild = false,
+      loading = false,
+      loaderClassName,
+      children
+    } = _b, props = __objRest(_b, [
+      "className",
+      "variant",
+      "size",
+      "asChild",
+      "loading",
+      "loaderClassName",
+      "children"
+    ]);
     const Comp = asChild ? Slot2 : "button";
-    return /* @__PURE__ */ jsx6(
+    return /* @__PURE__ */ jsxs3(
       Comp,
-      __spreadValues({
-        className: cn(buttonVariants({ variant, size, className })),
-        ref
-      }, props)
+      __spreadProps(__spreadValues({
+        className: cn(
+          buttonVariants({ variant, size }),
+          className,
+          loading && "relative"
+        ),
+        ref,
+        disabled: loading || props.disabled
+      }, props), {
+        children: [
+          loading ? /* @__PURE__ */ jsx6(Loader2, { className: cn(loaderClassName, "animate-spin mr-2") }) : null,
+          children
+        ]
+      })
     );
   }
 );
@@ -4493,7 +4520,7 @@ CardFooter.displayName = "CardFooter";
 import { ArrowLeftIcon, ArrowRightIcon } from "@radix-ui/react-icons";
 import useEmblaCarousel from "embla-carousel-react";
 import * as React34 from "react";
-import { jsx as jsx9, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs4 } from "react/jsx-runtime";
 var CarouselContext = React34.createContext(null);
 function useCarousel() {
   const context = React34.useContext(CarouselContext);
@@ -4636,7 +4663,7 @@ CarouselItem.displayName = "CarouselItem";
 var CarouselPrevious = React34.forwardRef((_a, ref) => {
   var _b = _a, { className, variant = "outline", size = "icon" } = _b, props = __objRest(_b, ["className", "variant", "size"]);
   const { orientation, scrollPrev, canScrollPrev } = useCarousel();
-  return /* @__PURE__ */ jsxs3(
+  return /* @__PURE__ */ jsxs4(
     Button,
     __spreadProps(__spreadValues({
       ref,
@@ -4661,7 +4688,7 @@ CarouselPrevious.displayName = "CarouselPrevious";
 var CarouselNext = React34.forwardRef((_a, ref) => {
   var _b = _a, { className, variant = "outline", size = "icon" } = _b, props = __objRest(_b, ["className", "variant", "size"]);
   const { orientation, scrollNext, canScrollNext } = useCarousel();
-  return /* @__PURE__ */ jsxs3(
+  return /* @__PURE__ */ jsxs4(
     Button,
     __spreadProps(__spreadValues({
       ref,
@@ -4727,7 +4754,7 @@ import * as React37 from "react";
 import * as DialogPrimitive from "@radix-ui/react-dialog";
 import { Cross2Icon } from "@radix-ui/react-icons";
 import * as React36 from "react";
-import { jsx as jsx11, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx11, jsxs as jsxs5 } from "react/jsx-runtime";
 var Dialog = DialogPrimitive.Root;
 var DialogTrigger = DialogPrimitive.Trigger;
 var DialogPortal = DialogPrimitive.Portal;
@@ -4748,9 +4775,9 @@ var DialogOverlay = React36.forwardRef((_a, ref) => {
 DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
 var DialogContent = React36.forwardRef((_a, ref) => {
   var _b = _a, { className, children } = _b, props = __objRest(_b, ["className", "children"]);
-  return /* @__PURE__ */ jsxs4(DialogPortal, { children: [
+  return /* @__PURE__ */ jsxs5(DialogPortal, { children: [
     /* @__PURE__ */ jsx11(DialogOverlay, {}),
-    /* @__PURE__ */ jsxs4(
+    /* @__PURE__ */ jsxs5(
       DialogPrimitive.Content,
       __spreadProps(__spreadValues({
         ref,
@@ -4761,7 +4788,7 @@ var DialogContent = React36.forwardRef((_a, ref) => {
       }, props), {
         children: [
           children,
-          /* @__PURE__ */ jsxs4(DialogPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground", children: [
+          /* @__PURE__ */ jsxs5(DialogPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground", children: [
             /* @__PURE__ */ jsx11(Cross2Icon, { className: "h-4 w-4" }),
             /* @__PURE__ */ jsx11("span", { className: "sr-only", children: "Close" })
           ] })
@@ -4832,7 +4859,7 @@ var DialogDescription = React36.forwardRef((_a, ref) => {
 DialogDescription.displayName = DialogPrimitive.Description.displayName;
 
 // src/components/command.tsx
-import { jsx as jsx12, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
 var Command = React37.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
   return /* @__PURE__ */ jsx12(
@@ -4853,7 +4880,7 @@ var CommandDialog = (_a) => {
 };
 var CommandInput = React37.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsxs5("div", { className: "flex items-center border-b px-3", "cmdk-input-wrapper": "", children: [
+  return /* @__PURE__ */ jsxs6("div", { className: "flex items-center border-b px-3", "cmdk-input-wrapper": "", children: [
     /* @__PURE__ */ jsx12(MagnifyingGlassIcon, { className: "mr-2 h-4 w-4 shrink-0 opacity-50" }),
     /* @__PURE__ */ jsx12(
       CommandPrimitive.Input,
@@ -4952,7 +4979,7 @@ import {
   DotFilledIcon
 } from "@radix-ui/react-icons";
 import * as React38 from "react";
-import { jsx as jsx13, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx13, jsxs as jsxs7 } from "react/jsx-runtime";
 var ContextMenu = ContextMenuPrimitive.Root;
 var ContextMenuTrigger = ContextMenuPrimitive.Trigger;
 var ContextMenuGroup = ContextMenuPrimitive.Group;
@@ -4961,7 +4988,7 @@ var ContextMenuSub = ContextMenuPrimitive.Sub;
 var ContextMenuRadioGroup = ContextMenuPrimitive.RadioGroup;
 var ContextMenuSubTrigger = React38.forwardRef((_a, ref) => {
   var _b = _a, { className, inset, children } = _b, props = __objRest(_b, ["className", "inset", "children"]);
-  return /* @__PURE__ */ jsxs6(
+  return /* @__PURE__ */ jsxs7(
     ContextMenuPrimitive.SubTrigger,
     __spreadProps(__spreadValues({
       ref,
@@ -5024,7 +5051,7 @@ var ContextMenuItem = React38.forwardRef((_a, ref) => {
 ContextMenuItem.displayName = ContextMenuPrimitive.Item.displayName;
 var ContextMenuCheckboxItem = React38.forwardRef((_a, ref) => {
   var _b = _a, { className, children, checked } = _b, props = __objRest(_b, ["className", "children", "checked"]);
-  return /* @__PURE__ */ jsxs6(
+  return /* @__PURE__ */ jsxs7(
     ContextMenuPrimitive.CheckboxItem,
     __spreadProps(__spreadValues({
       ref,
@@ -5044,7 +5071,7 @@ var ContextMenuCheckboxItem = React38.forwardRef((_a, ref) => {
 ContextMenuCheckboxItem.displayName = ContextMenuPrimitive.CheckboxItem.displayName;
 var ContextMenuRadioItem = React38.forwardRef((_a, ref) => {
   var _b = _a, { className, children } = _b, props = __objRest(_b, ["className", "children"]);
-  return /* @__PURE__ */ jsxs6(
+  return /* @__PURE__ */ jsxs7(
     ContextMenuPrimitive.RadioItem,
     __spreadProps(__spreadValues({
       ref,
@@ -5108,7 +5135,7 @@ ContextMenuShortcut.displayName = "ContextMenuShortcut";
 // src/components/drawer.tsx
 import * as React39 from "react";
 import { Drawer as DrawerPrimitive } from "vaul";
-import { jsx as jsx14, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx14, jsxs as jsxs8 } from "react/jsx-runtime";
 var Drawer = (_a) => {
   var _b = _a, {
     shouldScaleBackground = true
@@ -5139,9 +5166,9 @@ var DrawerOverlay = React39.forwardRef((_a, ref) => {
 DrawerOverlay.displayName = DrawerPrimitive.Overlay.displayName;
 var DrawerContent = React39.forwardRef((_a, ref) => {
   var _b = _a, { className, children } = _b, props = __objRest(_b, ["className", "children"]);
-  return /* @__PURE__ */ jsxs7(DrawerPortal, { children: [
+  return /* @__PURE__ */ jsxs8(DrawerPortal, { children: [
     /* @__PURE__ */ jsx14(DrawerOverlay, {}),
-    /* @__PURE__ */ jsxs7(
+    /* @__PURE__ */ jsxs8(
       DrawerPrimitive.Content,
       __spreadProps(__spreadValues({
         ref,
@@ -5221,7 +5248,7 @@ import {
   DotFilledIcon as DotFilledIcon2
 } from "@radix-ui/react-icons";
 import * as React40 from "react";
-import { jsx as jsx15, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
 var DropdownMenu = DropdownMenuPrimitive.Root;
 var DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
 var DropdownMenuGroup = DropdownMenuPrimitive.Group;
@@ -5230,7 +5257,7 @@ var DropdownMenuSub = DropdownMenuPrimitive.Sub;
 var DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
 var DropdownMenuSubTrigger = React40.forwardRef((_a, ref) => {
   var _b = _a, { className, inset, children } = _b, props = __objRest(_b, ["className", "inset", "children"]);
-  return /* @__PURE__ */ jsxs8(
+  return /* @__PURE__ */ jsxs9(
     DropdownMenuPrimitive.SubTrigger,
     __spreadProps(__spreadValues({
       ref,
@@ -5295,7 +5322,7 @@ var DropdownMenuItem = React40.forwardRef((_a, ref) => {
 DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
 var DropdownMenuCheckboxItem = React40.forwardRef((_a, ref) => {
   var _b = _a, { className, children, checked } = _b, props = __objRest(_b, ["className", "children", "checked"]);
-  return /* @__PURE__ */ jsxs8(
+  return /* @__PURE__ */ jsxs9(
     DropdownMenuPrimitive.CheckboxItem,
     __spreadProps(__spreadValues({
       ref,
@@ -5315,7 +5342,7 @@ var DropdownMenuCheckboxItem = React40.forwardRef((_a, ref) => {
 DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
 var DropdownMenuRadioItem = React40.forwardRef((_a, ref) => {
   var _b = _a, { className, children } = _b, props = __objRest(_b, ["className", "children"]);
-  return /* @__PURE__ */ jsxs8(
+  return /* @__PURE__ */ jsxs9(
     DropdownMenuPrimitive.RadioItem,
     __spreadProps(__spreadValues({
       ref,
@@ -5441,7 +5468,7 @@ var Input = React42.forwardRef(
 Input.displayName = "Input";
 
 // src/components/Form/form-field.tsx
-import { jsx as jsx19, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx19, jsxs as jsxs10 } from "react/jsx-runtime";
 var FormFieldContext = React43.createContext(
   null
 );
@@ -5453,9 +5480,9 @@ var FormField = (_a) => {
     placeholder,
     required,
     className = "px-4 py-6 shadow-inner drop-shadow-xl",
-    classNameLabel,
-    classNameMessage,
-    classNameRequired,
+    labelClassName,
+    messageClassName,
+    requiredClassName,
     rules,
     shouldUnregister,
     defaultValue,
@@ -5467,9 +5494,9 @@ var FormField = (_a) => {
     "placeholder",
     "required",
     "className",
-    "classNameLabel",
-    "classNameMessage",
-    "classNameRequired",
+    "labelClassName",
+    "messageClassName",
+    "requiredClassName",
     "rules",
     "shouldUnregister",
     "defaultValue",
@@ -5488,10 +5515,10 @@ var FormField = (_a) => {
       rules,
       shouldUnregister,
       defaultValue,
-      render: ({ field }) => /* @__PURE__ */ jsxs9(FormItem, { children: [
-        label && /* @__PURE__ */ jsxs9(FormLabel, { className: classNameLabel, children: [
+      render: ({ field }) => /* @__PURE__ */ jsxs10(FormItem, { children: [
+        label && /* @__PURE__ */ jsxs10(FormLabel, { className: labelClassName, children: [
           label,
-          required && /* @__PURE__ */ jsx19("span", { className: cn("text-red-500", classNameRequired), children: "*" })
+          required && /* @__PURE__ */ jsx19("span", { className: cn("text-red-500", requiredClassName), children: "*" })
         ] }),
         /* @__PURE__ */ jsx19(FormControl, { children: /* @__PURE__ */ jsx19(
           Input,
@@ -5505,7 +5532,7 @@ var FormField = (_a) => {
             className
           })
         ) }),
-        fieldError && /* @__PURE__ */ jsx19(FormMessage, { className: classNameMessage, children: fieldError })
+        fieldError && /* @__PURE__ */ jsx19(FormMessage, { className: messageClassName, children: fieldError })
       ] })
     }
   ) });
@@ -5646,7 +5673,7 @@ import {
   Image as Image2,
   Laptop,
   LayoutDashboardIcon,
-  Loader2,
+  Loader2 as Loader22,
   LogIn,
   Moon,
   MoreVertical,
@@ -5666,7 +5693,7 @@ var IconsApp = __spreadValues({
   login: LogIn,
   close: X,
   profile: User2Icon,
-  spinner: Loader2,
+  spinner: Loader22,
   kanban: CircuitBoardIcon,
   chevronLeft: ChevronLeft,
   chevronRight: ChevronRight,
@@ -5695,7 +5722,7 @@ var Icons = IconsApp;
 import { DashIcon } from "@radix-ui/react-icons";
 import { OTPInput, OTPInputContext } from "input-otp";
 import * as React45 from "react";
-import { jsx as jsx21, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx21, jsxs as jsxs11 } from "react/jsx-runtime";
 var InputOTP = React45.forwardRef((_a, ref) => {
   var _b = _a, { className, containerClassName } = _b, props = __objRest(_b, ["className", "containerClassName"]);
   return /* @__PURE__ */ jsx21(
@@ -5720,7 +5747,7 @@ var InputOTPSlot = React45.forwardRef((_a, ref) => {
   var _b = _a, { index, className } = _b, props = __objRest(_b, ["index", "className"]);
   const inputOTPContext = React45.useContext(OTPInputContext);
   const { char, hasFakeCaret, isActive } = inputOTPContext.slots[index];
-  return /* @__PURE__ */ jsxs10(
+  return /* @__PURE__ */ jsxs11(
     "div",
     __spreadProps(__spreadValues({
       ref,
@@ -5752,7 +5779,7 @@ import {
 } from "@radix-ui/react-icons";
 import * as MenubarPrimitive from "@radix-ui/react-menubar";
 import * as React46 from "react";
-import { jsx as jsx22, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx22, jsxs as jsxs12 } from "react/jsx-runtime";
 var MenubarMenu = MenubarPrimitive.Menu;
 var MenubarGroup = MenubarPrimitive.Group;
 var MenubarPortal = MenubarPrimitive.Portal;
@@ -5788,7 +5815,7 @@ var MenubarTrigger = React46.forwardRef((_a, ref) => {
 MenubarTrigger.displayName = MenubarPrimitive.Trigger.displayName;
 var MenubarSubTrigger = React46.forwardRef((_a, ref) => {
   var _b = _a, { className, inset, children } = _b, props = __objRest(_b, ["className", "inset", "children"]);
-  return /* @__PURE__ */ jsxs11(
+  return /* @__PURE__ */ jsxs12(
     MenubarPrimitive.SubTrigger,
     __spreadProps(__spreadValues({
       ref,
@@ -5856,7 +5883,7 @@ var MenubarItem = React46.forwardRef((_a, ref) => {
 MenubarItem.displayName = MenubarPrimitive.Item.displayName;
 var MenubarCheckboxItem = React46.forwardRef((_a, ref) => {
   var _b = _a, { className, children, checked } = _b, props = __objRest(_b, ["className", "children", "checked"]);
-  return /* @__PURE__ */ jsxs11(
+  return /* @__PURE__ */ jsxs12(
     MenubarPrimitive.CheckboxItem,
     __spreadProps(__spreadValues({
       ref,
@@ -5876,7 +5903,7 @@ var MenubarCheckboxItem = React46.forwardRef((_a, ref) => {
 MenubarCheckboxItem.displayName = MenubarPrimitive.CheckboxItem.displayName;
 var MenubarRadioItem = React46.forwardRef((_a, ref) => {
   var _b = _a, { className, children } = _b, props = __objRest(_b, ["className", "children"]);
-  return /* @__PURE__ */ jsxs11(
+  return /* @__PURE__ */ jsxs12(
     MenubarPrimitive.RadioItem,
     __spreadProps(__spreadValues({
       ref,
@@ -5938,7 +5965,7 @@ var MenubarShortcut = (_a) => {
 MenubarShortcut.displayname = "MenubarShortcut";
 
 // src/components/modal.tsx
-import { jsx as jsx23, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx23, jsxs as jsxs13 } from "react/jsx-runtime";
 var Modal = ({
   title,
   description,
@@ -5952,8 +5979,8 @@ var Modal = ({
       onClose();
     }
   };
-  return /* @__PURE__ */ jsx23(Dialog, { open: isOpen, onOpenChange: onChange, children: /* @__PURE__ */ jsxs12(DialogContent, { className, children: [
-    /* @__PURE__ */ jsxs12(DialogHeader, { children: [
+  return /* @__PURE__ */ jsx23(Dialog, { open: isOpen, onOpenChange: onChange, children: /* @__PURE__ */ jsxs13(DialogContent, { className, children: [
+    /* @__PURE__ */ jsxs13(DialogHeader, { children: [
       /* @__PURE__ */ jsx23(DialogTitle, { children: title }),
       /* @__PURE__ */ jsx23(DialogDescription, { children: description })
     ] }),
@@ -5966,10 +5993,10 @@ import { ChevronDownIcon as ChevronDownIcon2 } from "@radix-ui/react-icons";
 import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu";
 import { cva as cva5 } from "class-variance-authority";
 import * as React47 from "react";
-import { jsx as jsx24, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx24, jsxs as jsxs14 } from "react/jsx-runtime";
 var NavigationMenu = React47.forwardRef((_a, ref) => {
   var _b = _a, { className, children } = _b, props = __objRest(_b, ["className", "children"]);
-  return /* @__PURE__ */ jsxs13(
+  return /* @__PURE__ */ jsxs14(
     NavigationMenuPrimitive.Root,
     __spreadProps(__spreadValues({
       ref,
@@ -6006,7 +6033,7 @@ var navigationMenuTriggerStyle = cva5(
 );
 var NavigationMenuTrigger = React47.forwardRef((_a, ref) => {
   var _b = _a, { className, children } = _b, props = __objRest(_b, ["className", "children"]);
-  return /* @__PURE__ */ jsxs13(
+  return /* @__PURE__ */ jsxs14(
     NavigationMenuPrimitive.Trigger,
     __spreadProps(__spreadValues({
       ref,
@@ -6081,7 +6108,7 @@ import {
 } from "@radix-ui/react-icons";
 import * as React48 from "react";
 import { ChevronLeft as ChevronLeft2, ChevronRight as ChevronRight2 } from "lucide-react";
-import { jsx as jsx25, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx25, jsxs as jsxs15 } from "react/jsx-runtime";
 var Pagination = (_a) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
   return /* @__PURE__ */ jsx25(
@@ -6141,7 +6168,7 @@ var PaginationPreviousLast = (_a) => {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ jsxs14(
+  return /* @__PURE__ */ jsxs15(
     PaginationLink,
     __spreadProps(__spreadValues({
       "aria-label": "Go to previous page",
@@ -6162,7 +6189,7 @@ var PaginationPrevious = (_a) => {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ jsxs14(
+  return /* @__PURE__ */ jsxs15(
     PaginationLink,
     __spreadProps(__spreadValues({
       "aria-label": "Go to previous page",
@@ -6183,7 +6210,7 @@ var PaginationNext = (_a) => {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ jsxs14(
+  return /* @__PURE__ */ jsxs15(
     PaginationLink,
     __spreadProps(__spreadValues({
       "aria-label": "Go to next page",
@@ -6204,7 +6231,7 @@ var PaginationNextLast = (_a) => {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ jsxs14(
+  return /* @__PURE__ */ jsxs15(
     PaginationLink,
     __spreadProps(__spreadValues({
       "aria-label": "Go to next page",
@@ -6225,7 +6252,7 @@ var PaginationEllipsis = (_a) => {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ jsxs14(
+  return /* @__PURE__ */ jsxs15(
     "span",
     __spreadProps(__spreadValues({
       "aria-hidden": true,
@@ -6370,10 +6397,10 @@ var ResizableHandle = (_a) => {
 // src/components/scroll-area.tsx
 import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
 import * as React52 from "react";
-import { jsx as jsx30, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx30, jsxs as jsxs16 } from "react/jsx-runtime";
 var ScrollArea = React52.forwardRef((_a, ref) => {
   var _b = _a, { className, children } = _b, props = __objRest(_b, ["className", "children"]);
-  return /* @__PURE__ */ jsxs15(
+  return /* @__PURE__ */ jsxs16(
     ScrollAreaPrimitive.Root,
     __spreadProps(__spreadValues({
       ref,
@@ -6453,13 +6480,13 @@ import {
 } from "@radix-ui/react-icons";
 import * as SelectPrimitive from "@radix-ui/react-select";
 import * as React54 from "react";
-import { jsx as jsx32, jsxs as jsxs16 } from "react/jsx-runtime";
+import { jsx as jsx32, jsxs as jsxs17 } from "react/jsx-runtime";
 var Select2 = SelectPrimitive.Root;
 var SelectGroup = SelectPrimitive.Group;
 var SelectValue = SelectPrimitive.Value;
 var SelectTrigger = React54.forwardRef((_a, ref) => {
   var _b = _a, { className, children } = _b, props = __objRest(_b, ["className", "children"]);
-  return /* @__PURE__ */ jsxs16(
+  return /* @__PURE__ */ jsxs17(
     SelectPrimitive.Trigger,
     __spreadProps(__spreadValues({
       ref,
@@ -6510,7 +6537,7 @@ var SelectScrollDownButton = React54.forwardRef((_a, ref) => {
 SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
 var SelectContent = React54.forwardRef((_a, ref) => {
   var _b = _a, { className, children, position = "popper" } = _b, props = __objRest(_b, ["className", "children", "position"]);
-  return /* @__PURE__ */ jsx32(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs16(
+  return /* @__PURE__ */ jsx32(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs17(
     SelectPrimitive.Content,
     __spreadProps(__spreadValues({
       ref,
@@ -6552,7 +6579,7 @@ var SelectLabel = React54.forwardRef((_a, ref) => {
 SelectLabel.displayName = SelectPrimitive.Label.displayName;
 var SelectItem = React54.forwardRef((_a, ref) => {
   var _b = _a, { className, children } = _b, props = __objRest(_b, ["className", "children"]);
-  return /* @__PURE__ */ jsxs16(
+  return /* @__PURE__ */ jsxs17(
     SelectPrimitive.Item,
     __spreadProps(__spreadValues({
       ref,
@@ -6610,7 +6637,7 @@ import * as SheetPrimitive from "@radix-ui/react-dialog";
 import { Cross2Icon as Cross2Icon2 } from "@radix-ui/react-icons";
 import { cva as cva6 } from "class-variance-authority";
 import * as React56 from "react";
-import { jsx as jsx34, jsxs as jsxs17 } from "react/jsx-runtime";
+import { jsx as jsx34, jsxs as jsxs18 } from "react/jsx-runtime";
 var Sheet = SheetPrimitive.Root;
 var SheetTrigger = SheetPrimitive.Trigger;
 var SheetClose = SheetPrimitive.Close;
@@ -6648,9 +6675,9 @@ var sheetVariants = cva6(
 );
 var SheetContent = React56.forwardRef((_a, ref) => {
   var _b = _a, { side = "right", className, children } = _b, props = __objRest(_b, ["side", "className", "children"]);
-  return /* @__PURE__ */ jsxs17(SheetPortal, { children: [
+  return /* @__PURE__ */ jsxs18(SheetPortal, { children: [
     /* @__PURE__ */ jsx34(SheetOverlay, {}),
-    /* @__PURE__ */ jsxs17(
+    /* @__PURE__ */ jsxs18(
       SheetPrimitive.Content,
       __spreadProps(__spreadValues({
         ref,
@@ -6658,7 +6685,7 @@ var SheetContent = React56.forwardRef((_a, ref) => {
       }, props), {
         children: [
           children,
-          /* @__PURE__ */ jsxs17(SheetPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary", children: [
+          /* @__PURE__ */ jsxs18(SheetPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary", children: [
             /* @__PURE__ */ jsx34(Cross2Icon2, { className: "h-4 w-4" }),
             /* @__PURE__ */ jsx34("span", { className: "sr-only", children: "Close" })
           ] })
@@ -6744,10 +6771,10 @@ function Skeleton(_a) {
 // src/components/slider.tsx
 import * as SliderPrimitive from "@radix-ui/react-slider";
 import * as React57 from "react";
-import { jsx as jsx36, jsxs as jsxs18 } from "react/jsx-runtime";
+import { jsx as jsx36, jsxs as jsxs19 } from "react/jsx-runtime";
 var Slider = React57.forwardRef((_a, ref) => {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsxs18(
+  return /* @__PURE__ */ jsxs19(
     SliderPrimitive.Root,
     __spreadProps(__spreadValues({
       ref,
@@ -7298,7 +7325,7 @@ function useToast() {
 }
 
 // src/shared/alert-modal.tsx
-import { jsx as jsx46, jsxs as jsxs19 } from "react/jsx-runtime";
+import { jsx as jsx46, jsxs as jsxs20 } from "react/jsx-runtime";
 var AlertModal = ({
   isOpen,
   onClose,
@@ -7319,7 +7346,7 @@ var AlertModal = ({
       isOpen,
       onClose,
       className,
-      children: children ? children : /* @__PURE__ */ jsxs19("div", { className: "flex w-full items-center justify-end space-x-2 pt-6", children: [
+      children: children ? children : /* @__PURE__ */ jsxs20("div", { className: "flex w-full items-center justify-end space-x-2 pt-6", children: [
         /* @__PURE__ */ jsx46(Button, { disabled: loading, variant: "outline", onClick: onClose, children: cancelText }),
         /* @__PURE__ */ jsx46(Button, { disabled: loading, variant: "destructive", onClick: onConfirm, children: confirmText })
       ] })
@@ -7330,9 +7357,9 @@ var AlertModal = ({
 // src/shared/breadcrumbs.tsx
 import { Slash } from "lucide-react";
 import { Fragment } from "react";
-import { jsx as jsx47, jsxs as jsxs20 } from "react/jsx-runtime";
+import { jsx as jsx47, jsxs as jsxs21 } from "react/jsx-runtime";
 function Breadcrumbs({ items, className, classNameList }) {
-  return /* @__PURE__ */ jsx47(Breadcrumb, { className, children: /* @__PURE__ */ jsx47(BreadcrumbList, { className: classNameList, children: items.map((item, index) => /* @__PURE__ */ jsxs20(Fragment, { children: [
+  return /* @__PURE__ */ jsx47(Breadcrumb, { className, children: /* @__PURE__ */ jsx47(BreadcrumbList, { className: classNameList, children: items.map((item, index) => /* @__PURE__ */ jsxs21(Fragment, { children: [
     index !== items.length - 1 && /* @__PURE__ */ jsx47(BreadcrumbItem, { className: item.className, children: /* @__PURE__ */ jsx47(BreadcrumbLink, { href: item.link, children: item.title }) }),
     index < items.length - 1 && /* @__PURE__ */ jsx47(BreadcrumbSeparator, { children: /* @__PURE__ */ jsx47(Slash, {}) }),
     index === items.length - 1 && /* @__PURE__ */ jsx47(BreadcrumbPage, { children: item.title })
@@ -7353,7 +7380,7 @@ import {
   useReactTable
 } from "@tanstack/react-table";
 import { ChevronLeftIcon as ChevronLeftIcon2, ChevronRightIcon as ChevronRightIcon6 } from "lucide-react";
-import { Fragment as Fragment2, jsx as jsx48, jsxs as jsxs21 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx48, jsxs as jsxs22 } from "react/jsx-runtime";
 function DataTable({
   columns,
   data,
@@ -7364,6 +7391,8 @@ function DataTable({
   rowPerPageLabel = "Rows per page",
   ofLabel = "of",
   pageLabel = "Page",
+  isRowsSelected = true,
+  rowsSelectedLabel = "row(s) selected",
   className,
   emptyData,
   bodyClassName,
@@ -7372,7 +7401,8 @@ function DataTable({
   rowClassName,
   tableClassName,
   onPageChange,
-  onClick
+  onClick,
+  onPageSizeChange
 }) {
   const [pagination, setPagination] = React67.useState({
     pageIndex: Math.max(page - 1, 0),
@@ -7397,11 +7427,11 @@ function DataTable({
   };
   useEffect4(() => {
     if (onPageChange) {
-      onPageChange(pagination.pageIndex);
+      onPageChange(pagination.pageIndex + 1);
     }
-  }, [pagination, setPagination]);
-  return /* @__PURE__ */ jsxs21(Fragment2, { children: [
-    /* @__PURE__ */ jsxs21(
+  }, [pagination]);
+  return /* @__PURE__ */ jsxs22(Fragment2, { children: [
+    /* @__PURE__ */ jsxs22(
       ScrollArea,
       {
         className: cn(
@@ -7409,7 +7439,7 @@ function DataTable({
           className
         ),
         children: [
-          /* @__PURE__ */ jsxs21(Table, { className: cn("relative", tableClassName), children: [
+          /* @__PURE__ */ jsxs22(Table, { className: cn("relative", tableClassName), children: [
             /* @__PURE__ */ jsx48(TableHeader, { className: headerClassName, children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx48(TableRow, { className: rowClassName, children: headerGroup.headers.map((header) => /* @__PURE__ */ jsx48(TableHead, { className: headerClassName, children: header.isPlaceholder ? null : flexRender(
               header.column.columnDef.header,
               header.getContext()
@@ -7439,23 +7469,30 @@ function DataTable({
         ]
       }
     ),
-    /* @__PURE__ */ jsxs21("div", { className: "flex flex-col items-center justify-end gap-2 space-x-2 py-4 sm:flex-row", children: [
-      /* @__PURE__ */ jsxs21("div", { className: "flex w-full items-center justify-between", children: [
-        /* @__PURE__ */ jsxs21("div", { className: "text-muted-foreground flex-1 text-sm", children: [
+    /* @__PURE__ */ jsxs22("div", { className: "flex flex-col items-center justify-end gap-2 space-x-2 py-4 sm:flex-row", children: [
+      /* @__PURE__ */ jsxs22("div", { className: "flex w-full items-center justify-between", children: [
+        isRowsSelected ? /* @__PURE__ */ jsxs22("div", { className: "text-muted-foreground flex-1 text-sm", children: [
           table.getFilteredSelectedRowModel().rows.length,
           " ",
           ofLabel,
           " ",
           table.getFilteredRowModel().rows.length,
-          " row(s) selected."
-        ] }),
-        /* @__PURE__ */ jsxs21("div", { className: "flex items-center space-x-2", children: [
+          " " + rowsSelectedLabel
+        ] }) : null,
+        /* @__PURE__ */ jsxs22("div", { className: "flex items-center space-x-2", children: [
           /* @__PURE__ */ jsx48("p", { className: "text-sm font-medium whitespace-nowrap", children: rowPerPageLabel }),
-          /* @__PURE__ */ jsxs21(
+          /* @__PURE__ */ jsxs22(
             Select2,
             {
               value: `${pagination.pageSize}`,
-              onValueChange: (value) => setPagination(__spreadProps(__spreadValues({}, pagination), { pageSize: Number(value) })),
+              onValueChange: (value) => {
+                const newSize = Number(value);
+                setPagination(__spreadProps(__spreadValues({}, pagination), {
+                  pageSize: newSize,
+                  pageIndex: 0
+                }));
+                if (onPageSizeChange) onPageSizeChange(newSize);
+              },
               children: [
                 /* @__PURE__ */ jsx48(SelectTrigger, { className: "h-8 w-[70px]", children: /* @__PURE__ */ jsx48(SelectValue, { placeholder: pagination.pageSize }) }),
                 /* @__PURE__ */ jsx48(SelectContent, { side: "top", children: pageSizeOptions.map((size) => /* @__PURE__ */ jsx48(SelectItem, { value: `${size}`, children: size }, size)) })
@@ -7464,8 +7501,8 @@ function DataTable({
           )
         ] })
       ] }),
-      /* @__PURE__ */ jsxs21("div", { className: "flex w-full items-center justify-between gap-2 sm:justify-end", children: [
-        /* @__PURE__ */ jsxs21("div", { className: "flex w-[100px] items-center justify-center text-sm font-medium", children: [
+      /* @__PURE__ */ jsxs22("div", { className: "flex w-full items-center justify-between gap-2 sm:justify-end", children: [
+        /* @__PURE__ */ jsxs22("div", { className: "flex w-[100px] items-center justify-center text-sm font-medium", children: [
           pageLabel,
           " ",
           pagination.pageIndex + 1,
@@ -7474,7 +7511,7 @@ function DataTable({
           " ",
           pageCount
         ] }),
-        /* @__PURE__ */ jsxs21("div", { className: "flex items-center space-x-2", children: [
+        /* @__PURE__ */ jsxs22("div", { className: "flex items-center space-x-2", children: [
           /* @__PURE__ */ jsx48(
             Button,
             {
@@ -7530,7 +7567,7 @@ function DataTable({
 }
 
 // src/shared/data-table-skeleton.tsx
-import { jsx as jsx49, jsxs as jsxs22 } from "react/jsx-runtime";
+import { jsx as jsx49, jsxs as jsxs23 } from "react/jsx-runtime";
 function DataTableSkeleton({
   columnCount,
   rowCount = 10,
@@ -7538,27 +7575,27 @@ function DataTableSkeleton({
   filterableColumnCount = 0,
   showViewOptions = true
 }) {
-  return /* @__PURE__ */ jsxs22("div", { className: "w-full space-y-3 overflow-auto", children: [
-    /* @__PURE__ */ jsxs22("div", { className: "flex w-full items-center justify-between space-x-2 overflow-auto p-1", children: [
-      /* @__PURE__ */ jsxs22("div", { className: "flex flex-1 items-center space-x-2 space-y-4", children: [
+  return /* @__PURE__ */ jsxs23("div", { className: "w-full space-y-3 overflow-auto", children: [
+    /* @__PURE__ */ jsxs23("div", { className: "flex w-full items-center justify-between space-x-2 overflow-auto p-1", children: [
+      /* @__PURE__ */ jsxs23("div", { className: "flex flex-1 items-center space-x-2 space-y-4", children: [
         searchableColumnCount > 0 ? Array.from({ length: searchableColumnCount }).map((_, i) => /* @__PURE__ */ jsx49(Skeleton, { className: "h-10 w-[150px] lg:w-[250px]" }, i)) : null,
         filterableColumnCount > 0 ? Array.from({ length: filterableColumnCount }).map((_, i) => /* @__PURE__ */ jsx49(Skeleton, { className: "h-10 w-[70px] border-dashed" }, i)) : null
       ] }),
       showViewOptions ? /* @__PURE__ */ jsx49(Skeleton, { className: "ml-auto hidden h-7 w-[70px] lg:flex" }) : null
     ] }),
-    /* @__PURE__ */ jsx49("div", { className: "rounded-md border", children: /* @__PURE__ */ jsxs22(Table, { children: [
+    /* @__PURE__ */ jsx49("div", { className: "rounded-md border", children: /* @__PURE__ */ jsxs23(Table, { children: [
       /* @__PURE__ */ jsx49(TableHeader, { children: Array.from({ length: 1 }).map((_, i) => /* @__PURE__ */ jsx49(TableRow, { className: "hover:bg-transparent", children: Array.from({ length: columnCount }).map((_2, i2) => /* @__PURE__ */ jsx49(TableHead, { children: /* @__PURE__ */ jsx49(Skeleton, { className: "h-6 w-full" }) }, i2)) }, i)) }),
       /* @__PURE__ */ jsx49(TableBody, { children: Array.from({ length: rowCount }).map((_, i) => /* @__PURE__ */ jsx49(TableRow, { className: "hover:bg-transparent", children: Array.from({ length: columnCount }).map((_2, i2) => /* @__PURE__ */ jsx49(TableCell, { children: /* @__PURE__ */ jsx49(Skeleton, { className: "h-6 w-full" }) }, i2)) }, i)) })
     ] }) }),
-    /* @__PURE__ */ jsxs22("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: [
+    /* @__PURE__ */ jsxs23("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: [
       /* @__PURE__ */ jsx49("div", { className: "flex-1", children: /* @__PURE__ */ jsx49(Skeleton, { className: "h-8 w-40" }) }),
-      /* @__PURE__ */ jsxs22("div", { className: "flex flex-col items-center gap-4 sm:flex-row sm:gap-6 lg:gap-8", children: [
-        /* @__PURE__ */ jsxs22("div", { className: "flex items-center space-x-2", children: [
+      /* @__PURE__ */ jsxs23("div", { className: "flex flex-col items-center gap-4 sm:flex-row sm:gap-6 lg:gap-8", children: [
+        /* @__PURE__ */ jsxs23("div", { className: "flex items-center space-x-2", children: [
           /* @__PURE__ */ jsx49(Skeleton, { className: "h-8 w-24" }),
           /* @__PURE__ */ jsx49(Skeleton, { className: "h-8 w-[70px]" })
         ] }),
         /* @__PURE__ */ jsx49("div", { className: "flex w-[100px] items-center justify-center text-sm font-medium", children: /* @__PURE__ */ jsx49(Skeleton, { className: "h-8 w-20" }) }),
-        /* @__PURE__ */ jsxs22("div", { className: "flex items-center space-x-2", children: [
+        /* @__PURE__ */ jsxs23("div", { className: "flex items-center space-x-2", children: [
           /* @__PURE__ */ jsx49(Skeleton, { className: "hidden size-8 lg:block" }),
           /* @__PURE__ */ jsx49(Skeleton, { className: "size-8" }),
           /* @__PURE__ */ jsx49(Skeleton, { className: "size-8" }),
@@ -7574,7 +7611,7 @@ import { AvatarIcon } from "@radix-ui/react-icons";
 import { CameraIcon } from "lucide-react";
 import { useEffect as useEffect5, useState as useState5 } from "react";
 import { useDropzone } from "react-dropzone";
-import { jsx as jsx50, jsxs as jsxs23 } from "react/jsx-runtime";
+import { jsx as jsx50, jsxs as jsxs24 } from "react/jsx-runtime";
 function FileUpload({
   onChange,
   value,
@@ -7599,10 +7636,10 @@ function FileUpload({
         "relative h-36 w-36 overflow-hidden rounded-full bg-gray-200 shadow-2xl ",
         classNameContent
       ),
-      children: /* @__PURE__ */ jsxs23("div", __spreadProps(__spreadValues({}, getRootProps({ className: "dropzone cursor-pointer" })), { children: [
+      children: /* @__PURE__ */ jsxs24("div", __spreadProps(__spreadValues({}, getRootProps({ className: "dropzone cursor-pointer" })), { children: [
         /* @__PURE__ */ jsx50("input", __spreadValues({}, getInputProps())),
         value && !!value.length ? /* @__PURE__ */ jsx50(ImagePreview, { file: value[0] }) : /* @__PURE__ */ jsx50(AvatarIcon, { className: "h-36 w-36 text-gray-100" }),
-        /* @__PURE__ */ jsxs23("p", { className: "absolute -bottom-5 left-1/2 flex w-full -translate-x-1/2 -translate-y-1/2 transform flex-col items-center justify-center bg-gray-300 bg-opacity-50 py-1 text-xs font-normal text-muted-foreground ", children: [
+        /* @__PURE__ */ jsxs24("p", { className: "absolute -bottom-5 left-1/2 flex w-full -translate-x-1/2 -translate-y-1/2 transform flex-col items-center justify-center bg-gray-300 bg-opacity-50 py-1 text-xs font-normal text-muted-foreground ", children: [
           /* @__PURE__ */ jsx50(CameraIcon, { className: "h-4 w-4 text-muted-foreground" }),
           label
         ] })
@@ -7630,9 +7667,9 @@ function ImagePreview({ file }) {
 }
 
 // src/shared/heading.tsx
-import { jsx as jsx51, jsxs as jsxs24 } from "react/jsx-runtime";
+import { jsx as jsx51, jsxs as jsxs25 } from "react/jsx-runtime";
 function Heading({ title, description, className }) {
-  return /* @__PURE__ */ jsxs24("div", { className, children: [
+  return /* @__PURE__ */ jsxs25("div", { className, children: [
     /* @__PURE__ */ jsx51("h2", { className: "text-xl font-bold tracking-tight text-primary sm:text-3xl", children: title }),
     /* @__PURE__ */ jsx51("p", { className: "text-sm text-muted-foreground", children: description })
   ] });
@@ -7640,9 +7677,9 @@ function Heading({ title, description, className }) {
 
 // src/shared/page-head.tsx
 import { Helmet } from "react-helmet-next";
-import { jsx as jsx52, jsxs as jsxs25 } from "react/jsx-runtime";
+import { jsx as jsx52, jsxs as jsxs26 } from "react/jsx-runtime";
 function PageHead({ title = "shadcn-ui-react" }) {
-  return /* @__PURE__ */ jsx52(Helmet, { children: /* @__PURE__ */ jsxs25("title", { children: [
+  return /* @__PURE__ */ jsx52(Helmet, { children: /* @__PURE__ */ jsxs26("title", { children: [
     " ",
     title,
     " "
@@ -7650,7 +7687,7 @@ function PageHead({ title = "shadcn-ui-react" }) {
 }
 
 // src/shared/pagination-section.tsx
-import { jsx as jsx53, jsxs as jsxs26 } from "react/jsx-runtime";
+import { jsx as jsx53, jsxs as jsxs27 } from "react/jsx-runtime";
 function PaginationSection({
   totalPosts,
   postsPerPage,
@@ -7720,8 +7757,8 @@ function PaginationSection({
     }
     return renderedPages;
   };
-  return /* @__PURE__ */ jsx53("div", { className: "p-4", children: /* @__PURE__ */ jsx53(Pagination, { children: /* @__PURE__ */ jsxs26(PaginationContent, { children: [
-    /* @__PURE__ */ jsxs26(PaginationItem, { children: [
+  return /* @__PURE__ */ jsx53("div", { className: "p-4", children: /* @__PURE__ */ jsx53(Pagination, { children: /* @__PURE__ */ jsxs27(PaginationContent, { children: [
+    /* @__PURE__ */ jsxs27(PaginationItem, { children: [
       /* @__PURE__ */ jsx53(
         PaginationPreviousLast,
         {
@@ -7732,7 +7769,7 @@ function PaginationSection({
       /* @__PURE__ */ jsx53(PaginationPrevious, { onClick: handlePrevPage, size: void 0 })
     ] }),
     renderPages(),
-    /* @__PURE__ */ jsxs26(PaginationItem, { children: [
+    /* @__PURE__ */ jsxs27(PaginationItem, { children: [
       /* @__PURE__ */ jsx53(PaginationNext, { onClick: handleNextPage, size: void 0 }),
       /* @__PURE__ */ jsx53(PaginationNextLast, { onClick: handleNextPageLast, size: void 0 })
     ] })