@dilipod/ui 0.2.15 → 0.3.0

package/dist/index.mjs

@@ -1,17 +1,23 @@
-import * as React25 from 'react';
+import * as React27 from 'react';
 import { Slot, createSlot } from '@radix-ui/react-slot';
 import { cva } from 'class-variance-authority';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
-import { jsxs, jsx } from 'react/jsx-runtime';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import * as SheetPrimitive from '@radix-ui/react-dialog';
 import * as react_star from '@phosphor-icons/react';
-import { X, Info, WarningCircle, Check } from '@phosphor-icons/react';
+import { X, Circle, CaretLeft, DotsThree, CaretRight, Check, House, Info, WarningCircle } from '@phosphor-icons/react';
 import 'react-dom';
+import * as SwitchPrimitive from '@radix-ui/react-switch';
+import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
 import * as AccordionPrimitive from '@radix-ui/react-accordion';
 import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
 import * as AvatarPrimitive from '@radix-ui/react-avatar';
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
+import * as TabsPrimitive from '@radix-ui/react-tabs';
+import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
+import * as PopoverPrimitive from '@radix-ui/react-popover';
+import * as TooltipPrimitive from '@radix-ui/react-tooltip';
 import * as ToastPrimitives from '@radix-ui/react-toast';
 
 var __defProp = Object.defineProperty;
@@ -40,10 +46,23 @@ __export(index_exports, {
   AccordionItem: () => AccordionItem,
   AccordionTrigger: () => AccordionTrigger,
   Alert: () => Alert,
+  AlertDialog: () => AlertDialog,
+  AlertDialogAction: () => AlertDialogAction,
+  AlertDialogCancel: () => AlertDialogCancel,
+  AlertDialogContent: () => AlertDialogContent,
+  AlertDialogDescription: () => AlertDialogDescription,
+  AlertDialogFooter: () => AlertDialogFooter,
+  AlertDialogHeader: () => AlertDialogHeader,
+  AlertDialogOverlay: () => AlertDialogOverlay,
+  AlertDialogPortal: () => AlertDialogPortal,
+  AlertDialogTitle: () => AlertDialogTitle,
+  AlertDialogTrigger: () => AlertDialogTrigger,
   Avatar: () => Avatar,
   AvatarFallback: () => AvatarFallback,
   AvatarImage: () => AvatarImage,
   Badge: () => Badge,
+  BreadcrumbLink: () => BreadcrumbLink,
+  Breadcrumbs: () => Breadcrumbs,
   Button: () => Button,
   Card: () => Card,
   CardContent: () => CardContent,
@@ -53,6 +72,9 @@ __export(index_exports, {
   CardTitle: () => CardTitle,
   Checkbox: () => Checkbox,
   CodeBlock: () => CodeBlock,
+  ConfirmDialog: () => ConfirmDialog,
+  DateRangePicker: () => DateRangePicker,
+  DateRangeSelect: () => DateRangeSelect,
   Dialog: () => Dialog,
   DialogClose: () => DialogClose,
   DialogContent: () => DialogContent,
@@ -84,6 +106,7 @@ __export(index_exports, {
   IconBox: () => IconBox,
   Input: () => Input,
   Label: () => Label2,
+  LabeledSwitch: () => LabeledSwitch,
   Logo: () => Logo,
   MetricCard: () => MetricCard,
   NavigationMenu: () => NavigationMenu,
@@ -94,9 +117,22 @@ __export(index_exports, {
   NavigationMenuList: () => NavigationMenuList,
   NavigationMenuTrigger: () => NavigationMenuTrigger,
   NavigationMenuViewport: () => NavigationMenuViewport,
+  Pagination: () => Pagination,
+  Popover: () => Popover,
+  PopoverAnchor: () => PopoverAnchor,
+  PopoverArrow: () => PopoverArrow,
+  PopoverClose: () => PopoverClose,
+  PopoverContent: () => PopoverContent,
+  PopoverTrigger: () => PopoverTrigger,
   Progress: () => Progress,
+  RadioGroup: () => RadioGroup,
+  RadioGroupCard: () => RadioGroupCard,
+  RadioGroupItem: () => RadioGroupItem,
+  RadioGroupOption: () => RadioGroupOption,
   Select: () => Select,
   Separator: () => Separator2,
+  SettingsNav: () => SettingsNav,
+  SettingsNavLink: () => SettingsNavLink,
   Sheet: () => Sheet,
   SheetClose: () => SheetClose,
   SheetContent: () => SheetContent,
@@ -109,7 +145,15 @@ __export(index_exports, {
   SheetTrigger: () => SheetTrigger,
   Sidebar: () => Sidebar,
   SidebarNavItem: () => SidebarNavItem,
+  SimplePagination: () => SimplePagination,
+  SimpleTooltip: () => SimpleTooltip,
+  Skeleton: () => Skeleton,
+  SkeletonCard: () => SkeletonCard,
+  SkeletonText: () => SkeletonText,
   Stat: () => Stat,
+  StepDots: () => StepDots,
+  StepProgress: () => StepProgress,
+  Switch: () => Switch,
   Table: () => Table,
   TableBody: () => TableBody,
   TableCaption: () => TableCaption,
@@ -118,6 +162,12 @@ __export(index_exports, {
   TableHead: () => TableHead,
   TableHeader: () => TableHeader,
   TableRow: () => TableRow,
+  Tabs: () => Tabs,
+  TabsContent: () => TabsContent,
+  TabsList: () => TabsList,
+  TabsListUnderline: () => TabsListUnderline,
+  TabsTrigger: () => TabsTrigger,
+  TabsTriggerUnderline: () => TabsTriggerUnderline,
   Tag: () => Tag,
   Textarea: () => Textarea,
   Toast: () => Toast,
@@ -129,12 +179,18 @@ __export(index_exports, {
   ToastTitle: () => ToastTitle,
   ToastViewport: () => ToastViewport,
   Toaster: () => Toaster,
+  Tooltip: () => Tooltip,
+  TooltipArrow: () => TooltipArrow,
+  TooltipContent: () => TooltipContent,
+  TooltipProvider: () => TooltipProvider,
+  TooltipTrigger: () => TooltipTrigger,
   UsageBar: () => UsageBar,
   UsageChart: () => UsageChart,
   alertVariants: () => alertVariants,
   badgeVariants: () => badgeVariants,
   buttonVariants: () => buttonVariants,
   cn: () => cn,
+  getDateRangeFromPreset: () => getDateRangeFromPreset,
   iconBoxVariants: () => iconBoxVariants,
   metricCardVariants: () => metricCardVariants,
   navigationMenuTriggerStyle: () => navigationMenuTriggerStyle,
@@ -175,7 +231,7 @@ var buttonVariants = cva(
     }
   }
 );
-var Button = React25.forwardRef(
+var Button = React27.forwardRef(
   ({ className, variant, size, asChild = false, loading, loadingText, children, disabled, ...props }, ref) => {
     const Comp = asChild ? Slot : "button";
     const isDisabled = disabled || loading;
@@ -228,7 +284,7 @@ var Sheet = SheetPrimitive.Root;
 var SheetTrigger = SheetPrimitive.Trigger;
 var SheetClose = SheetPrimitive.Close;
 var SheetPortal = SheetPrimitive.Portal;
-var SheetOverlay = React25.forwardRef(({ className, ...props }, ref) => (
+var SheetOverlay = React27.forwardRef(({ className, ...props }, ref) => (
   // @ts-ignore - Radix Dialog Overlay accepts className at runtime
   /* @__PURE__ */ jsx(
     SheetPrimitive.Overlay,
@@ -259,7 +315,7 @@ var sheetVariants = cva(
     }
   }
 );
-var SheetContent = React25.forwardRef(({ side = "right", className, children, ...props }, ref) => /* @__PURE__ */ jsxs(SheetPortal, { children: [
+var SheetContent = React27.forwardRef(({ side = "right", className, children, ...props }, ref) => /* @__PURE__ */ jsxs(SheetPortal, { children: [
   /* @__PURE__ */ jsx(SheetOverlay, {}),
   /* @__PURE__ */ jsxs(
     SheetPrimitive.Content,
@@ -306,7 +362,7 @@ var SheetFooter = ({
   }
 );
 SheetFooter.displayName = "SheetFooter";
-var SheetTitle = React25.forwardRef(({ className, ...props }, ref) => (
+var SheetTitle = React27.forwardRef(({ className, ...props }, ref) => (
   // @ts-ignore - Radix Dialog Title accepts className at runtime
   /* @__PURE__ */ jsx(
     SheetPrimitive.Title,
@@ -318,7 +374,7 @@ var SheetTitle = React25.forwardRef(({ className, ...props }, ref) => (
   )
 ));
 SheetTitle.displayName = SheetPrimitive.Title.displayName;
-var SheetDescription = React25.forwardRef(({ className, ...props }, ref) => (
+var SheetDescription = React27.forwardRef(({ className, ...props }, ref) => (
   // @ts-ignore - Radix Dialog Description accepts className at runtime
   /* @__PURE__ */ jsx(
     SheetPrimitive.Description,
@@ -418,7 +474,7 @@ var badgeVariants = cva(
     }
   }
 );
-var Badge = React25.forwardRef(
+var Badge = React27.forwardRef(
   ({ className, variant, size, pulse, pulseColor: pulseColorProp, children, ...props }, ref) => {
     const getPulseColorClass = () => {
       const color = pulseColorProp || variant || "default";
@@ -472,7 +528,7 @@ var Badge = React25.forwardRef(
   }
 );
 Badge.displayName = "Badge";
-var Card = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var Card = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "div",
   {
     ref,
@@ -484,7 +540,7 @@ var Card = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */
   }
 ));
 Card.displayName = "Card";
-var CardHeader = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var CardHeader = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "div",
   {
     ref,
@@ -493,7 +549,7 @@ var CardHeader = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE
   }
 ));
 CardHeader.displayName = "CardHeader";
-var CardTitle = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var CardTitle = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "h3",
   {
     ref,
@@ -505,7 +561,7 @@ var CardTitle = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE_
   }
 ));
 CardTitle.displayName = "CardTitle";
-var CardDescription = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var CardDescription = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "p",
   {
     ref,
@@ -514,9 +570,9 @@ var CardDescription = React25.forwardRef(({ className, ...props }, ref) => /* @_
   }
 ));
 CardDescription.displayName = "CardDescription";
-var CardContent = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("p-6 pt-0", className), ...props }));
+var CardContent = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("p-6 pt-0", className), ...props }));
 CardContent.displayName = "CardContent";
-var CardFooter = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var CardFooter = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "div",
   {
     ref,
@@ -539,7 +595,7 @@ var progressVariants = cva("h-full rounded-full transition-all duration-300", {
     variant: "default"
   }
 });
-var Progress = React25.forwardRef(
+var Progress = React27.forwardRef(
   ({ className, value, variant, showLabel, label = "Progress", size = "default", ...props }, ref) => {
     const clampedValue = Math.min(100, Math.max(0, value));
     const heightClass = {
@@ -606,7 +662,7 @@ var iconBoxVariants = cva(
     }
   }
 );
-var IconBox = React25.forwardRef(
+var IconBox = React27.forwardRef(
   ({ className, variant, size, rounded, children, ...props }, ref) => {
     return /* @__PURE__ */ jsx(
       "div",
@@ -642,7 +698,7 @@ var tagVariants = cva(
     }
   }
 );
-var Tag = React25.forwardRef(
+var Tag = React27.forwardRef(
   ({ className, variant, size, icon, children, ...props }, ref) => {
     return /* @__PURE__ */ jsxs(
       "span",
@@ -696,7 +752,7 @@ var valueVariants = cva("font-bold", {
     color: "default"
   }
 });
-var Stat = React25.forwardRef(
+var Stat = React27.forwardRef(
   ({
     className,
     variant,
@@ -778,7 +834,7 @@ var iconVariants = cva("h-5 w-5", {
     color: "cyan"
   }
 });
-var MetricCard = React25.forwardRef(
+var MetricCard = React27.forwardRef(
   ({
     className,
     variant,
@@ -837,7 +893,7 @@ var progressColorVariants = cva("", {
     color: "cyan"
   }
 });
-var UsageBar = React25.forwardRef(
+var UsageBar = React27.forwardRef(
   ({
     className,
     size,
@@ -909,7 +965,7 @@ var UsageBar = React25.forwardRef(
   }
 );
 UsageBar.displayName = "UsageBar";
-var UsageChart = React25.forwardRef(
+var UsageChart = React27.forwardRef(
   ({
     className,
     data,
@@ -920,8 +976,8 @@ var UsageChart = React25.forwardRef(
     formatValue = (v) => v.toLocaleString(),
     ...props
   }, ref) => {
-    const [hoveredIndex, setHoveredIndex] = React25.useState(null);
-    const maxValue = React25.useMemo(() => {
+    const [hoveredIndex, setHoveredIndex] = React27.useState(null);
+    const maxValue = React27.useMemo(() => {
       return Math.max(
         ...data.map((d) => d.value + (d.secondaryValue || 0)),
         1
@@ -1048,7 +1104,7 @@ var UsageChart = React25.forwardRef(
   }
 );
 UsageChart.displayName = "UsageChart";
-var Input = React25.forwardRef(
+var Input = React27.forwardRef(
   ({ className, type, error, ...props }, ref) => {
     return /* @__PURE__ */ jsx(
       "input",
@@ -1088,7 +1144,7 @@ var NODES = [
 ];
 var Primitive = NODES.reduce((primitive, node) => {
   const Slot2 = createSlot(`Primitive.${node}`);
-  const Node = React25.forwardRef((props, forwardedRef) => {
+  const Node = React27.forwardRef((props, forwardedRef) => {
     const { asChild, ...primitiveProps } = props;
     const Comp = asChild ? Slot2 : node;
     if (typeof window !== "undefined") {
@@ -1100,7 +1156,7 @@ var Primitive = NODES.reduce((primitive, node) => {
   return { ...primitive, [node]: Node };
 }, {});
 var NAME = "Label";
-var Label = React25.forwardRef((props, forwardedRef) => {
+var Label = React27.forwardRef((props, forwardedRef) => {
   return /* @__PURE__ */ jsx(
     Primitive.label,
     {
@@ -1120,7 +1176,7 @@ var Root2 = Label;
 var labelVariants = cva(
   "text-sm font-medium leading-none text-[var(--black)] peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
 );
-var Label2 = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var Label2 = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   Root2,
   {
     ref,
@@ -1129,7 +1185,7 @@ var Label2 = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ *
   }
 ));
 Label2.displayName = Root2.displayName;
-var Textarea = React25.forwardRef(
+var Textarea = React27.forwardRef(
   ({ className, error, ...props }, ref) => {
     return /* @__PURE__ */ jsx(
       "textarea",
@@ -1147,7 +1203,7 @@ var Textarea = React25.forwardRef(
   }
 );
 Textarea.displayName = "Textarea";
-var Select = React25.forwardRef(
+var Select = React27.forwardRef(
   ({ className, error, children, ...props }, ref) => {
     return /* @__PURE__ */ jsx(
       "select",
@@ -1174,7 +1230,7 @@ Select.displayName = "Select";
 // src/icons.ts
 var icons_exports = {};
 __reExport(icons_exports, react_star);
-var Checkbox = React25.forwardRef(
+var Checkbox = React27.forwardRef(
   ({ className, checked, onCheckedChange, ...props }, ref) => {
     return /* @__PURE__ */ jsxs("label", { className: "relative inline-flex items-center cursor-pointer", children: [
       /* @__PURE__ */ jsx(
@@ -1205,8 +1261,150 @@ var Checkbox = React25.forwardRef(
   }
 );
 Checkbox.displayName = "Checkbox";
+var Switch = React27.forwardRef(({ className, size = "default", ...props }, ref) => {
+  const sizeStyles = {
+    sm: {
+      root: "h-4 w-7",
+      thumb: "h-3 w-3 data-[state=checked]:translate-x-3"
+    },
+    default: {
+      root: "h-5 w-9",
+      thumb: "h-4 w-4 data-[state=checked]:translate-x-4"
+    },
+    lg: {
+      root: "h-6 w-11",
+      thumb: "h-5 w-5 data-[state=checked]:translate-x-5"
+    }
+  };
+  return /* @__PURE__ */ jsx(
+    SwitchPrimitive.Root,
+    {
+      className: cn(
+        "peer inline-flex shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-[var(--cyan)] data-[state=unchecked]:bg-input",
+        sizeStyles[size].root,
+        className
+      ),
+      ...props,
+      ref,
+      children: /* @__PURE__ */ jsx(
+        SwitchPrimitive.Thumb,
+        {
+          className: cn(
+            "pointer-events-none block rounded-full bg-white shadow-lg ring-0 transition-transform data-[state=unchecked]:translate-x-0",
+            sizeStyles[size].thumb
+          )
+        }
+      )
+    }
+  );
+});
+Switch.displayName = SwitchPrimitive.Root.displayName;
+var LabeledSwitch = React27.forwardRef(({ label, description, labelPosition = "right", className, id, ...props }, ref) => {
+  const switchId = id || React27.useId();
+  const labelContent = /* @__PURE__ */ jsxs("div", { className: "space-y-0.5", children: [
+    /* @__PURE__ */ jsx(
+      "label",
+      {
+        htmlFor: switchId,
+        className: "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70 cursor-pointer",
+        children: label
+      }
+    ),
+    description && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: description })
+  ] });
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "flex items-center gap-3",
+        labelPosition === "left" && "flex-row-reverse justify-end",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx(Switch, { ref, id: switchId, ...props }),
+        labelContent
+      ]
+    }
+  );
+});
+LabeledSwitch.displayName = "LabeledSwitch";
+var RadioGroup = React27.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx(
+    RadioGroupPrimitive.Root,
+    {
+      className: cn("grid gap-2", className),
+      ...props,
+      ref
+    }
+  );
+});
+RadioGroup.displayName = RadioGroupPrimitive.Root.displayName;
+var RadioGroupItem = React27.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx(
+    RadioGroupPrimitive.Item,
+    {
+      ref,
+      className: cn(
+        "aspect-square h-4 w-4 rounded-full border border-primary text-primary shadow focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsx(RadioGroupPrimitive.Indicator, { className: "flex items-center justify-center", children: /* @__PURE__ */ jsx(Circle, { weight: "fill", className: "h-2.5 w-2.5 fill-current" }) })
+    }
+  );
+});
+RadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName;
+var RadioGroupOption = React27.forwardRef(({ label, description, className, id, ...props }, ref) => {
+  const optionId = id || React27.useId();
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex items-start gap-3", className), children: [
+    /* @__PURE__ */ jsx(RadioGroupItem, { ref, id: optionId, ...props }),
+    /* @__PURE__ */ jsxs("div", { className: "space-y-0.5", children: [
+      /* @__PURE__ */ jsx(
+        "label",
+        {
+          htmlFor: optionId,
+          className: "text-sm font-medium leading-none cursor-pointer peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
+          children: label
+        }
+      ),
+      description && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: description })
+    ] })
+  ] });
+});
+RadioGroupOption.displayName = "RadioGroupOption";
+var RadioGroupCard = React27.forwardRef(({ label, description, children, className, id, ...props }, ref) => {
+  const cardId = id || React27.useId();
+  return /* @__PURE__ */ jsx(
+    RadioGroupPrimitive.Item,
+    {
+      ref,
+      id: cardId,
+      className: cn(
+        "relative flex cursor-pointer rounded-lg border bg-background p-4 transition-all hover:border-[var(--cyan)]/50 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 data-[state=checked]:border-[var(--cyan)] data-[state=checked]:ring-1 data-[state=checked]:ring-[var(--cyan)] disabled:cursor-not-allowed disabled:opacity-50",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsxs("div", { className: "flex w-full items-start gap-3", children: [
+        /* @__PURE__ */ jsx("div", { className: "flex h-5 items-center", children: /* @__PURE__ */ jsx("div", { className: "aspect-square h-4 w-4 rounded-full border border-primary text-primary shadow", children: /* @__PURE__ */ jsx(RadioGroupPrimitive.Indicator, { className: "flex items-center justify-center h-full", children: /* @__PURE__ */ jsx(Circle, { weight: "fill", className: "h-2.5 w-2.5 fill-[var(--cyan)]" }) }) }) }),
+        /* @__PURE__ */ jsxs("div", { className: "flex-1 space-y-1", children: [
+          /* @__PURE__ */ jsx(
+            "label",
+            {
+              htmlFor: cardId,
+              className: "text-sm font-medium leading-none cursor-pointer",
+              children: label
+            }
+          ),
+          description && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: description }),
+          children
+        ] })
+      ] })
+    }
+  );
+});
+RadioGroupCard.displayName = "RadioGroupCard";
 var Accordion = AccordionPrimitive.Root;
-var AccordionItem = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var AccordionItem = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   AccordionPrimitive.Item,
   {
     ref,
@@ -1215,7 +1413,7 @@ var AccordionItem = React25.forwardRef(({ className, ...props }, ref) => /* @__P
   }
 ));
 AccordionItem.displayName = "AccordionItem";
-var AccordionTrigger = React25.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(AccordionPrimitive.Header, { className: "flex", children: /* @__PURE__ */ jsxs(
+var AccordionTrigger = React27.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(AccordionPrimitive.Header, { className: "flex", children: /* @__PURE__ */ jsxs(
   AccordionPrimitive.Trigger,
   {
     ref,
@@ -1231,7 +1429,7 @@ var AccordionTrigger = React25.forwardRef(({ className, children, ...props }, re
   }
 ) }));
 AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;
-var AccordionContent = React25.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
+var AccordionContent = React27.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
   AccordionPrimitive.Content,
   {
     ref,
@@ -1262,7 +1460,7 @@ var NODES2 = [
 ];
 var Primitive2 = NODES2.reduce((primitive, node) => {
   const Slot2 = createSlot(`Primitive.${node}`);
-  const Node = React25.forwardRef((props, forwardedRef) => {
+  const Node = React27.forwardRef((props, forwardedRef) => {
     const { asChild, ...primitiveProps } = props;
     const Comp = asChild ? Slot2 : node;
     if (typeof window !== "undefined") {
@@ -1276,7 +1474,7 @@ var Primitive2 = NODES2.reduce((primitive, node) => {
 var NAME2 = "Separator";
 var DEFAULT_ORIENTATION = "horizontal";
 var ORIENTATIONS = ["horizontal", "vertical"];
-var Separator = React25.forwardRef((props, forwardedRef) => {
+var Separator = React27.forwardRef((props, forwardedRef) => {
   const { decorative, orientation: orientationProp = DEFAULT_ORIENTATION, ...domProps } = props;
   const orientation = isValidOrientation(orientationProp) ? orientationProp : DEFAULT_ORIENTATION;
   const ariaOrientation = orientation === "vertical" ? orientation : void 0;
@@ -1295,10 +1493,10 @@ Separator.displayName = NAME2;
 function isValidOrientation(orientation) {
   return ORIENTATIONS.includes(orientation);
 }
-var Root4 = Separator;
-var Separator2 = React25.forwardRef(
+var Root6 = Separator;
+var Separator2 = React27.forwardRef(
   ({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ jsx(
-    Root4,
+    Root6,
     {
       ref,
       decorative,
@@ -1312,8 +1510,8 @@ var Separator2 = React25.forwardRef(
     }
   )
 );
-Separator2.displayName = Root4.displayName;
-var NavigationMenu = React25.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+Separator2.displayName = Root6.displayName;
+var NavigationMenu = React27.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
   NavigationMenuPrimitive.Root,
   {
     ref,
@@ -1329,7 +1527,7 @@ var NavigationMenu = React25.forwardRef(({ className, children, ...props }, ref)
   }
 ));
 NavigationMenu.displayName = NavigationMenuPrimitive.Root.displayName;
-var NavigationMenuList = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var NavigationMenuList = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   NavigationMenuPrimitive.List,
   {
     ref,
@@ -1345,7 +1543,7 @@ var NavigationMenuItem = NavigationMenuPrimitive.Item;
 var navigationMenuTriggerStyle = cva(
   "group inline-flex h-10 w-max items-center justify-center rounded-md bg-white px-4 py-2 text-sm font-medium text-[var(--black)] transition-colors hover:bg-gray-100 hover:text-[var(--black)] focus:bg-gray-100 focus:text-[var(--black)] focus:outline-none disabled:pointer-events-none disabled:opacity-50 data-[state=open]:text-[var(--black)] data-[state=open]:bg-gray-100/50 data-[state=open]:hover:bg-gray-100 data-[state=open]:focus:bg-gray-100"
 );
-var NavigationMenuTrigger = React25.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+var NavigationMenuTrigger = React27.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
   NavigationMenuPrimitive.Trigger,
   {
     ref,
@@ -1365,7 +1563,7 @@ var NavigationMenuTrigger = React25.forwardRef(({ className, children, ...props
   }
 ));
 NavigationMenuTrigger.displayName = NavigationMenuPrimitive.Trigger.displayName;
-var NavigationMenuContent = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var NavigationMenuContent = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   NavigationMenuPrimitive.Content,
   {
     ref,
@@ -1378,7 +1576,7 @@ var NavigationMenuContent = React25.forwardRef(({ className, ...props }, ref) =>
 ));
 NavigationMenuContent.displayName = NavigationMenuPrimitive.Content.displayName;
 var NavigationMenuLink = NavigationMenuPrimitive.Link;
-var NavigationMenuViewport = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { className: cn("absolute left-0 top-full flex justify-center"), children: /* @__PURE__ */ jsx(
+var NavigationMenuViewport = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { className: cn("absolute left-0 top-full flex justify-center"), children: /* @__PURE__ */ jsx(
   NavigationMenuPrimitive.Viewport,
   {
     className: cn(
@@ -1390,7 +1588,7 @@ var NavigationMenuViewport = React25.forwardRef(({ className, ...props }, ref) =
   }
 ) }));
 NavigationMenuViewport.displayName = NavigationMenuPrimitive.Viewport.displayName;
-var NavigationMenuIndicator = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var NavigationMenuIndicator = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   NavigationMenuPrimitive.Indicator,
   {
     ref,
@@ -1403,7 +1601,7 @@ var NavigationMenuIndicator = React25.forwardRef(({ className, ...props }, ref)
   }
 ));
 NavigationMenuIndicator.displayName = NavigationMenuPrimitive.Indicator.displayName;
-var Avatar = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var Avatar = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   AvatarPrimitive.Root,
   {
     ref,
@@ -1415,7 +1613,7 @@ var Avatar = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ *
   }
 ));
 Avatar.displayName = AvatarPrimitive.Root.displayName;
-var AvatarImage = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var AvatarImage = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   AvatarPrimitive.Image,
   {
     ref,
@@ -1424,7 +1622,7 @@ var AvatarImage = React25.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 AvatarImage.displayName = AvatarPrimitive.Image.displayName;
-var AvatarFallback = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var AvatarFallback = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   AvatarPrimitive.Fallback,
   {
     ref,
@@ -1442,7 +1640,7 @@ var DropdownMenuGroup = DropdownMenuPrimitive.Group;
 var DropdownMenuPortal = DropdownMenuPrimitive.Portal;
 var DropdownMenuSub = DropdownMenuPrimitive.Sub;
 var DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
-var DropdownMenuSubTrigger = React25.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+var DropdownMenuSubTrigger = React27.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs(
   DropdownMenuPrimitive.SubTrigger,
   {
     ref,
@@ -1459,7 +1657,7 @@ var DropdownMenuSubTrigger = React25.forwardRef(({ className, inset, children, .
   }
 ));
 DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
-var DropdownMenuSubContent = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var DropdownMenuSubContent = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   DropdownMenuPrimitive.SubContent,
   {
     ref,
@@ -1471,7 +1669,7 @@ var DropdownMenuSubContent = React25.forwardRef(({ className, ...props }, ref) =
   }
 ));
 DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
-var DropdownMenuContent = React25.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(
+var DropdownMenuContent = React27.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(
   DropdownMenuPrimitive.Content,
   {
     ref,
@@ -1484,7 +1682,7 @@ var DropdownMenuContent = React25.forwardRef(({ className, sideOffset = 4, ...pr
   }
 ) }));
 DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
-var DropdownMenuItem = React25.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx(
+var DropdownMenuItem = React27.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx(
   DropdownMenuPrimitive.Item,
   {
     ref,
@@ -1497,7 +1695,7 @@ var DropdownMenuItem = React25.forwardRef(({ className, inset, ...props }, ref)
   }
 ));
 DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
-var DropdownMenuCheckboxItem = React25.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs(
+var DropdownMenuCheckboxItem = React27.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs(
   DropdownMenuPrimitive.CheckboxItem,
   {
     ref,
@@ -1514,7 +1712,7 @@ var DropdownMenuCheckboxItem = React25.forwardRef(({ className, children, checke
   }
 ));
 DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
-var DropdownMenuRadioItem = React25.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+var DropdownMenuRadioItem = React27.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
   DropdownMenuPrimitive.RadioItem,
   {
     ref,
@@ -1530,7 +1728,7 @@ var DropdownMenuRadioItem = React25.forwardRef(({ className, children, ...props
   }
 ));
 DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
-var DropdownMenuLabel = React25.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx(
+var DropdownMenuLabel = React27.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx(
   DropdownMenuPrimitive.Label,
   {
     ref,
@@ -1543,7 +1741,7 @@ var DropdownMenuLabel = React25.forwardRef(({ className, inset, ...props }, ref)
   }
 ));
 DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
-var DropdownMenuSeparator = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var DropdownMenuSeparator = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   DropdownMenuPrimitive.Separator,
   {
     ref,
@@ -1565,7 +1763,7 @@ var DropdownMenuShortcut = ({
   );
 };
 DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
-var SidebarNavItem = React25.forwardRef(
+var SidebarNavItem = React27.forwardRef(
   ({ item, isActive, className, LinkComponent, ...props }, ref) => {
     const Icon = item.icon;
     const baseClassName = cn(
@@ -1605,7 +1803,7 @@ var SidebarNavItem = React25.forwardRef(
   }
 );
 SidebarNavItem.displayName = "SidebarNavItem";
-var Sidebar = React25.forwardRef(
+var Sidebar = React27.forwardRef(
   ({
     mainNav = [],
     bottomNav = [],
@@ -1715,7 +1913,7 @@ var alertVariants = cva(
     }
   }
 );
-var Alert = React25.forwardRef(
+var Alert = React27.forwardRef(
   ({ className, variant, icon, title, action, children, ...props }, ref) => {
     return /* @__PURE__ */ jsx(
       "div",
@@ -1738,7 +1936,7 @@ var Alert = React25.forwardRef(
   }
 );
 Alert.displayName = "Alert";
-var EmptyState = React25.forwardRef(
+var EmptyState = React27.forwardRef(
   ({ className, icon, title, description, action, size = "default", ...props }, ref) => {
     const paddingClass = {
       sm: "p-8",
@@ -1766,7 +1964,7 @@ var EmptyState = React25.forwardRef(
   }
 );
 EmptyState.displayName = "EmptyState";
-var CodeBlock = React25.forwardRef(
+var CodeBlock = React27.forwardRef(
   ({ className, children, language, ...props }, ref) => {
     return /* @__PURE__ */ jsx(
       "pre",
@@ -1784,15 +1982,15 @@ var CodeBlock = React25.forwardRef(
   }
 );
 CodeBlock.displayName = "CodeBlock";
-var FormField = React25.forwardRef(
+var FormField = React27.forwardRef(
   ({ label, error, helperText, hint, required, id, className, children, ...props }, ref) => {
-    const fieldId = id || React25.useId();
+    const fieldId = id || React27.useId();
     const errorId = `${fieldId}-error`;
     const helperId = `${fieldId}-helper`;
-    const enhancedChildren = React25.Children.map(children, (child) => {
-      if (React25.isValidElement(child)) {
+    const enhancedChildren = React27.Children.map(children, (child) => {
+      if (React27.isValidElement(child)) {
         const childProps = child.props;
-        return React25.cloneElement(child, {
+        return React27.cloneElement(child, {
           id: fieldId,
           "aria-invalid": error ? "true" : void 0,
           "aria-describedby": error ? errorId : helperText ? helperId : void 0,
@@ -1816,7 +2014,7 @@ var FormField = React25.forwardRef(
   }
 );
 FormField.displayName = "FormField";
-var Table = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsx(
+var Table = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsx(
   "table",
   {
     ref,
@@ -1825,11 +2023,11 @@ var Table = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */
   }
 ) }));
 Table.displayName = "Table";
-var TableHeader = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("thead", { ref, className: cn("", className), ...props }));
+var TableHeader = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("thead", { ref, className: cn("", className), ...props }));
 TableHeader.displayName = "TableHeader";
-var TableBody = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("tbody", { ref, className: cn("", className), ...props }));
+var TableBody = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("tbody", { ref, className: cn("", className), ...props }));
 TableBody.displayName = "TableBody";
-var TableFooter = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var TableFooter = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "tfoot",
   {
     ref,
@@ -1838,7 +2036,7 @@ var TableFooter = React25.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 TableFooter.displayName = "TableFooter";
-var TableRow = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var TableRow = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "tr",
   {
     ref,
@@ -1847,7 +2045,7 @@ var TableRow = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__
   }
 ));
 TableRow.displayName = "TableRow";
-var TableHead = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var TableHead = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "th",
   {
     ref,
@@ -1859,7 +2057,7 @@ var TableHead = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE_
   }
 ));
 TableHead.displayName = "TableHead";
-var TableCell = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var TableCell = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "td",
   {
     ref,
@@ -1868,7 +2066,7 @@ var TableCell = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE_
   }
 ));
 TableCell.displayName = "TableCell";
-var TableCaption = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var TableCaption = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "caption",
   {
     ref,
@@ -1877,7 +2075,7 @@ var TableCaption = React25.forwardRef(({ className, ...props }, ref) => /* @__PU
   }
 ));
 TableCaption.displayName = "TableCaption";
-var Divider = React25.forwardRef(
+var Divider = React27.forwardRef(
   ({ className, text, orientation = "horizontal", ...props }, ref) => {
     if (orientation === "vertical") {
       return /* @__PURE__ */ jsx(
@@ -1915,11 +2113,72 @@ var Divider = React25.forwardRef(
   }
 );
 Divider.displayName = "Divider";
+var Tabs = TabsPrimitive.Root;
+var TabsList = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  TabsPrimitive.List,
+  {
+    ref,
+    className: cn(
+      "inline-flex h-10 items-center justify-center rounded-sm bg-muted p-1 text-muted-foreground",
+      className
+    ),
+    ...props
+  }
+));
+TabsList.displayName = TabsPrimitive.List.displayName;
+var TabsTrigger = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  TabsPrimitive.Trigger,
+  {
+    ref,
+    className: cn(
+      "inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm",
+      className
+    ),
+    ...props
+  }
+));
+TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
+var TabsContent = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  TabsPrimitive.Content,
+  {
+    ref,
+    className: cn(
+      "mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+      className
+    ),
+    ...props
+  }
+));
+TabsContent.displayName = TabsPrimitive.Content.displayName;
+var TabsListUnderline = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  TabsPrimitive.List,
+  {
+    ref,
+    className: cn(
+      "inline-flex items-center justify-start border-b border-border",
+      className
+    ),
+    ...props
+  }
+));
+TabsListUnderline.displayName = "TabsListUnderline";
+var TabsTriggerUnderline = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  TabsPrimitive.Trigger,
+  {
+    ref,
+    className: cn(
+      "inline-flex items-center justify-center whitespace-nowrap px-4 py-2 text-sm font-medium text-muted-foreground transition-colors hover:text-foreground border-b-2 border-transparent -mb-px data-[state=active]:text-foreground data-[state=active]:border-[var(--cyan)] disabled:pointer-events-none disabled:opacity-50",
+      className
+    ),
+    ...props
+  }
+));
+TabsTriggerUnderline.displayName = "TabsTriggerUnderline";
 var Dialog = SheetPrimitive.Root;
 var DialogTrigger = SheetPrimitive.Trigger;
 var DialogPortal = SheetPrimitive.Portal;
 var DialogClose = SheetPrimitive.Close;
-var DialogOverlay = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var DialogOverlay = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   SheetPrimitive.Overlay,
   {
     ref,
@@ -1931,7 +2190,7 @@ var DialogOverlay = React25.forwardRef(({ className, ...props }, ref) => /* @__P
   }
 ));
 DialogOverlay.displayName = SheetPrimitive.Overlay.displayName;
-var DialogContent = React25.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(DialogPortal, { children: [
+var DialogContent = React27.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(DialogPortal, { children: [
   /* @__PURE__ */ jsx(DialogOverlay, {}),
   /* @__PURE__ */ jsxs(
     SheetPrimitive.Content,
@@ -1981,7 +2240,7 @@ var DialogFooter = ({
   }
 );
 DialogFooter.displayName = "DialogFooter";
-var DialogTitle = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var DialogTitle = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   SheetPrimitive.Title,
   {
     ref,
@@ -1993,7 +2252,7 @@ var DialogTitle = React25.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 DialogTitle.displayName = SheetPrimitive.Title.displayName;
-var DialogDescription = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var DialogDescription = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   SheetPrimitive.Description,
   {
     ref,
@@ -2002,8 +2261,214 @@ var DialogDescription = React25.forwardRef(({ className, ...props }, ref) => /*
   }
 ));
 DialogDescription.displayName = SheetPrimitive.Description.displayName;
+var AlertDialog = AlertDialogPrimitive.Root;
+var AlertDialogTrigger = AlertDialogPrimitive.Trigger;
+var AlertDialogPortal = AlertDialogPrimitive.Portal;
+var AlertDialogOverlay = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  AlertDialogPrimitive.Overlay,
+  {
+    className: cn(
+      "fixed inset-0 z-50 bg-black/60 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+      className
+    ),
+    ...props,
+    ref
+  }
+));
+AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName;
+var AlertDialogContent = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs(AlertDialogPortal, { children: [
+  /* @__PURE__ */ jsx(AlertDialogOverlay, {}),
+  /* @__PURE__ */ jsx(
+    AlertDialogPrimitive.Content,
+    {
+      ref,
+      className: cn(
+        "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] rounded-sm",
+        className
+      ),
+      ...props
+    }
+  )
+] }));
+AlertDialogContent.displayName = AlertDialogPrimitive.Content.displayName;
+var AlertDialogHeader = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    className: cn(
+      "flex flex-col space-y-2 text-center sm:text-left",
+      className
+    ),
+    ...props
+  }
+);
+AlertDialogHeader.displayName = "AlertDialogHeader";
+var AlertDialogFooter = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    className: cn(
+      "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
+      className
+    ),
+    ...props
+  }
+);
+AlertDialogFooter.displayName = "AlertDialogFooter";
+var AlertDialogTitle = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  AlertDialogPrimitive.Title,
+  {
+    ref,
+    className: cn("text-lg font-semibold text-[var(--black)]", className),
+    ...props
+  }
+));
+AlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName;
+var AlertDialogDescription = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  AlertDialogPrimitive.Description,
+  {
+    ref,
+    className: cn("text-sm text-muted-foreground", className),
+    ...props
+  }
+));
+AlertDialogDescription.displayName = AlertDialogPrimitive.Description.displayName;
+var AlertDialogAction = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  AlertDialogPrimitive.Action,
+  {
+    ref,
+    className: cn(buttonVariants(), className),
+    ...props
+  }
+));
+AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName;
+var AlertDialogCancel = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  AlertDialogPrimitive.Cancel,
+  {
+    ref,
+    className: cn(
+      buttonVariants({ variant: "outline" }),
+      "mt-2 sm:mt-0",
+      className
+    ),
+    ...props
+  }
+));
+AlertDialogCancel.displayName = AlertDialogPrimitive.Cancel.displayName;
+function ConfirmDialog({
+  open,
+  onOpenChange,
+  title,
+  description,
+  confirmText = "Confirm",
+  cancelText = "Cancel",
+  onConfirm,
+  onCancel,
+  variant = "default",
+  loading = false
+}) {
+  return /* @__PURE__ */ jsx(AlertDialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs(AlertDialogContent, { children: [
+    /* @__PURE__ */ jsxs(AlertDialogHeader, { children: [
+      /* @__PURE__ */ jsx(AlertDialogTitle, { children: title }),
+      description && /* @__PURE__ */ jsx(AlertDialogDescription, { children: description })
+    ] }),
+    /* @__PURE__ */ jsxs(AlertDialogFooter, { children: [
+      /* @__PURE__ */ jsx(
+        AlertDialogCancel,
+        {
+          onClick: () => {
+            onCancel?.();
+            onOpenChange(false);
+          },
+          children: cancelText
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        AlertDialogAction,
+        {
+          onClick: () => {
+            onConfirm();
+          },
+          className: cn(
+            variant === "destructive" && "bg-destructive text-destructive-foreground hover:bg-destructive/90"
+          ),
+          disabled: loading,
+          children: loading ? "Loading..." : confirmText
+        }
+      )
+    ] })
+  ] }) });
+}
+var Popover = PopoverPrimitive.Root;
+var PopoverTrigger = PopoverPrimitive.Trigger;
+var PopoverAnchor = PopoverPrimitive.Anchor;
+var PopoverClose = PopoverPrimitive.Close;
+var PopoverContent = React27.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx(
+  PopoverPrimitive.Content,
+  {
+    ref,
+    align,
+    sideOffset,
+    className: cn(
+      "z-50 w-72 rounded-sm border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+      className
+    ),
+    ...props
+  }
+) }));
+PopoverContent.displayName = PopoverPrimitive.Content.displayName;
+var PopoverArrow = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  PopoverPrimitive.Arrow,
+  {
+    ref,
+    className: cn("fill-popover", className),
+    ...props
+  }
+));
+PopoverArrow.displayName = PopoverPrimitive.Arrow.displayName;
+var TooltipProvider = TooltipPrimitive.Provider;
+var Tooltip = TooltipPrimitive.Root;
+var TooltipTrigger = TooltipPrimitive.Trigger;
+var TooltipContent = React27.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsx(
+  TooltipPrimitive.Content,
+  {
+    ref,
+    sideOffset,
+    className: cn(
+      "z-50 overflow-hidden rounded-sm bg-[var(--black)] px-3 py-1.5 text-xs text-white animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+      className
+    ),
+    ...props
+  }
+) }));
+TooltipContent.displayName = TooltipPrimitive.Content.displayName;
+var TooltipArrow = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  TooltipPrimitive.Arrow,
+  {
+    ref,
+    className: cn("fill-[var(--black)]", className),
+    ...props
+  }
+));
+TooltipArrow.displayName = TooltipPrimitive.Arrow.displayName;
+function SimpleTooltip({
+  content,
+  children,
+  side = "top",
+  align = "center",
+  delayDuration = 200
+}) {
+  return /* @__PURE__ */ jsx(TooltipProvider, { delayDuration, children: /* @__PURE__ */ jsxs(Tooltip, { children: [
+    /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children }),
+    /* @__PURE__ */ jsx(TooltipContent, { side, align, children: content })
+  ] }) });
+}
 var ToastProvider = ToastPrimitives.Provider;
-var ToastViewport = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var ToastViewport = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   ToastPrimitives.Viewport,
   {
     ref,
@@ -2032,7 +2497,7 @@ var toastVariants = cva(
     }
   }
 );
-var Toast = React25.forwardRef(({ className, variant, ...props }, ref) => {
+var Toast = React27.forwardRef(({ className, variant, ...props }, ref) => {
   return /* @__PURE__ */ jsx(
     ToastPrimitives.Root,
     {
@@ -2043,7 +2508,7 @@ var Toast = React25.forwardRef(({ className, variant, ...props }, ref) => {
   );
 });
 Toast.displayName = ToastPrimitives.Root.displayName;
-var ToastAction = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var ToastAction = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   ToastPrimitives.Action,
   {
     ref,
@@ -2055,7 +2520,7 @@ var ToastAction = React25.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 ToastAction.displayName = ToastPrimitives.Action.displayName;
-var ToastClose = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var ToastClose = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   ToastPrimitives.Close,
   {
     ref,
@@ -2069,7 +2534,7 @@ var ToastClose = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE
   }
 ));
 ToastClose.displayName = ToastPrimitives.Close.displayName;
-var ToastTitle = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var ToastTitle = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   ToastPrimitives.Title,
   {
     ref,
@@ -2078,7 +2543,7 @@ var ToastTitle = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE
   }
 ));
 ToastTitle.displayName = ToastPrimitives.Title.displayName;
-var ToastDescription = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var ToastDescription = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   ToastPrimitives.Description,
   {
     ref,
@@ -2217,8 +2682,8 @@ function toast({ ...props }) {
   };
 }
 function useToast() {
-  const [state, setState] = React25.useState(memoryState);
-  React25.useEffect(() => {
+  const [state, setState] = React27.useState(memoryState);
+  React27.useEffect(() => {
     listeners.push(setState);
     return () => {
       const index = listeners.indexOf(setState);
@@ -2253,10 +2718,665 @@ function Toaster() {
     /* @__PURE__ */ jsx(ToastViewport, {})
   ] });
 }
+var Skeleton = React27.forwardRef(
+  ({ className, variant = "default", width, height, animate = true, style, ...props }, ref) => {
+    const variantStyles = {
+      default: "rounded-sm",
+      circular: "rounded-full",
+      rounded: "rounded-md"
+    };
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn(
+          "bg-muted",
+          animate && "animate-pulse",
+          variantStyles[variant],
+          className
+        ),
+        style: {
+          width: typeof width === "number" ? `${width}px` : width,
+          height: typeof height === "number" ? `${height}px` : height,
+          ...style
+        },
+        ...props
+      }
+    );
+  }
+);
+Skeleton.displayName = "Skeleton";
+var SkeletonText = React27.forwardRef(
+  ({ lines = 3, gap = 8, className, ...props }, ref) => {
+    return /* @__PURE__ */ jsx("div", { ref, className: cn("space-y-2", className), style: { gap }, children: Array.from({ length: lines }).map((_, i) => /* @__PURE__ */ jsx(
+      Skeleton,
+      {
+        height: 16,
+        width: i === lines - 1 ? "70%" : "100%",
+        ...props
+      },
+      i
+    )) });
+  }
+);
+SkeletonText.displayName = "SkeletonText";
+var SkeletonCard = React27.forwardRef(
+  ({ hasHeader = true, hasAvatar = false, className, ...props }, ref) => {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn("rounded-lg border p-6 space-y-4", className),
+        ...props,
+        children: [
+          hasHeader && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4", children: [
+            hasAvatar && /* @__PURE__ */ jsx(Skeleton, { variant: "circular", width: 40, height: 40 }),
+            /* @__PURE__ */ jsxs("div", { className: "space-y-2 flex-1", children: [
+              /* @__PURE__ */ jsx(Skeleton, { height: 20, width: "50%" }),
+              /* @__PURE__ */ jsx(Skeleton, { height: 14, width: "30%" })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx(SkeletonText, { lines: 3 })
+        ]
+      }
+    );
+  }
+);
+SkeletonCard.displayName = "SkeletonCard";
+function generatePagination(currentPage, totalPages, siblingCount) {
+  const totalPageNumbers = siblingCount * 2 + 5;
+  if (totalPageNumbers >= totalPages) {
+    return Array.from({ length: totalPages }, (_, i) => i + 1);
+  }
+  const leftSiblingIndex = Math.max(currentPage - siblingCount, 1);
+  const rightSiblingIndex = Math.min(currentPage + siblingCount, totalPages);
+  const showLeftDots = leftSiblingIndex > 2;
+  const showRightDots = rightSiblingIndex < totalPages - 1;
+  if (!showLeftDots && showRightDots) {
+    const leftRange = Array.from(
+      { length: 3 + siblingCount * 2 },
+      (_, i) => i + 1
+    );
+    return [...leftRange, "ellipsis", totalPages];
+  }
+  if (showLeftDots && !showRightDots) {
+    const rightRange = Array.from(
+      { length: 3 + siblingCount * 2 },
+      (_, i) => totalPages - (3 + siblingCount * 2) + i + 1
+    );
+    return [1, "ellipsis", ...rightRange];
+  }
+  const middleRange = Array.from(
+    { length: siblingCount * 2 + 1 },
+    (_, i) => leftSiblingIndex + i
+  );
+  return [1, "ellipsis", ...middleRange, "ellipsis", totalPages];
+}
+var Pagination = React27.forwardRef(
+  ({
+    currentPage,
+    totalPages,
+    onPageChange,
+    siblingCount = 1,
+    showBoundaryPages = true,
+    size = "default",
+    className
+  }, ref) => {
+    const pages = generatePagination(currentPage, totalPages, siblingCount);
+    const buttonSize = size === "sm" ? "sm" : size === "lg" ? "lg" : "default";
+    const iconSize = size === "sm" ? 14 : size === "lg" ? 20 : 16;
+    if (totalPages <= 1) {
+      return null;
+    }
+    return /* @__PURE__ */ jsxs(
+      "nav",
+      {
+        ref,
+        role: "navigation",
+        "aria-label": "Pagination",
+        className: cn("flex items-center gap-1", className),
+        children: [
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "outline",
+              size: buttonSize,
+              onClick: () => onPageChange(currentPage - 1),
+              disabled: currentPage <= 1,
+              "aria-label": "Go to previous page",
+              children: /* @__PURE__ */ jsx(CaretLeft, { size: iconSize })
+            }
+          ),
+          /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1", children: pages.map((page, index) => {
+            if (page === "ellipsis") {
+              return /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: "flex h-9 w-9 items-center justify-center text-muted-foreground",
+                  children: /* @__PURE__ */ jsx(DotsThree, { size: iconSize })
+                },
+                `ellipsis-${index}`
+              );
+            }
+            const isCurrentPage = page === currentPage;
+            return /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: isCurrentPage ? "default" : "outline",
+                size: buttonSize,
+                onClick: () => onPageChange(page),
+                "aria-label": `Go to page ${page}`,
+                "aria-current": isCurrentPage ? "page" : void 0,
+                children: page
+              },
+              page
+            );
+          }) }),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "outline",
+              size: buttonSize,
+              onClick: () => onPageChange(currentPage + 1),
+              disabled: currentPage >= totalPages,
+              "aria-label": "Go to next page",
+              children: /* @__PURE__ */ jsx(CaretRight, { size: iconSize })
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+Pagination.displayName = "Pagination";
+var SimplePagination = React27.forwardRef(
+  ({
+    currentPage,
+    totalPages,
+    onPageChange,
+    size = "default",
+    className,
+    showPageInfo = true
+  }, ref) => {
+    const buttonSize = size === "sm" ? "sm" : size === "lg" ? "lg" : "default";
+    const iconSize = size === "sm" ? 14 : size === "lg" ? 20 : 16;
+    if (totalPages <= 1) {
+      return null;
+    }
+    return /* @__PURE__ */ jsxs(
+      "nav",
+      {
+        ref,
+        role: "navigation",
+        "aria-label": "Pagination",
+        className: cn("flex items-center gap-2", className),
+        children: [
+          /* @__PURE__ */ jsxs(
+            Button,
+            {
+              variant: "outline",
+              size: buttonSize,
+              onClick: () => onPageChange(currentPage - 1),
+              disabled: currentPage <= 1,
+              "aria-label": "Go to previous page",
+              children: [
+                /* @__PURE__ */ jsx(CaretLeft, { size: iconSize }),
+                /* @__PURE__ */ jsx("span", { className: "ml-1", children: "Previous" })
+              ]
+            }
+          ),
+          showPageInfo && /* @__PURE__ */ jsxs("span", { className: "text-sm text-muted-foreground px-2", children: [
+            "Page ",
+            currentPage,
+            " of ",
+            totalPages
+          ] }),
+          /* @__PURE__ */ jsxs(
+            Button,
+            {
+              variant: "outline",
+              size: buttonSize,
+              onClick: () => onPageChange(currentPage + 1),
+              disabled: currentPage >= totalPages,
+              "aria-label": "Go to next page",
+              children: [
+                /* @__PURE__ */ jsx("span", { className: "mr-1", children: "Next" }),
+                /* @__PURE__ */ jsx(CaretRight, { size: iconSize })
+              ]
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+SimplePagination.displayName = "SimplePagination";
+var StepProgress = React27.forwardRef(
+  ({
+    steps,
+    currentStep,
+    onStepClick,
+    orientation = "horizontal",
+    size = "default",
+    showLabels = true,
+    className
+  }, ref) => {
+    const sizeStyles = {
+      sm: {
+        indicator: "w-6 h-6 text-xs",
+        icon: 12,
+        label: "text-xs",
+        connector: orientation === "horizontal" ? "h-0.5" : "w-0.5",
+        connectorLength: orientation === "horizontal" ? "w-4 sm:w-8" : "h-6"
+      },
+      default: {
+        indicator: "w-7 h-7 text-xs",
+        icon: 14,
+        label: "text-sm",
+        connector: orientation === "horizontal" ? "h-0.5" : "w-0.5",
+        connectorLength: orientation === "horizontal" ? "w-6 sm:w-10 md:w-14" : "h-8"
+      },
+      lg: {
+        indicator: "w-8 h-8 text-sm",
+        icon: 16,
+        label: "text-sm",
+        connector: orientation === "horizontal" ? "h-0.5" : "w-0.5",
+        connectorLength: orientation === "horizontal" ? "w-8 sm:w-12 md:w-16" : "h-10"
+      }
+    };
+    const styles = sizeStyles[size];
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn(
+          "flex",
+          orientation === "horizontal" ? "flex-row items-center" : "flex-col",
+          className
+        ),
+        children: steps.map((step, index) => {
+          const isCompleted = step.id < currentStep;
+          const isCurrent = step.id === currentStep;
+          const isClickable = onStepClick && step.id < currentStep;
+          return /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: cn(
+                "flex",
+                orientation === "horizontal" ? "flex-row items-center" : "flex-col items-start"
+              ),
+              children: [
+                /* @__PURE__ */ jsxs(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => isClickable && onStepClick(step.id),
+                    disabled: !isClickable,
+                    className: cn(
+                      "flex items-center gap-2 px-2 py-1.5 rounded-sm transition-colors",
+                      isClickable ? "cursor-pointer hover:bg-gray-50" : "cursor-default",
+                      orientation === "vertical" && "flex-row"
+                    ),
+                    children: [
+                      /* @__PURE__ */ jsx(
+                        "span",
+                        {
+                          className: cn(
+                            "rounded-sm flex items-center justify-center font-bold transition-colors",
+                            styles.indicator,
+                            isCompleted ? "bg-[var(--cyan)] text-white" : isCurrent ? "bg-[var(--black)] text-white" : "bg-gray-100 text-gray-400"
+                          ),
+                          children: isCompleted ? /* @__PURE__ */ jsx(Check, { size: styles.icon, weight: "bold" }) : step.id
+                        }
+                      ),
+                      showLabels && /* @__PURE__ */ jsxs("div", { className: cn(
+                        orientation === "horizontal" && "hidden sm:block",
+                        "text-left"
+                      ), children: [
+                        /* @__PURE__ */ jsx(
+                          "span",
+                          {
+                            className: cn(
+                              "font-medium transition-colors whitespace-nowrap",
+                              styles.label,
+                              isCompleted ? "text-[var(--cyan)]" : isCurrent ? "text-[var(--black)]" : "text-gray-400"
+                            ),
+                            children: step.label
+                          }
+                        ),
+                        step.description && orientation === "vertical" && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground mt-0.5", children: step.description })
+                      ] })
+                    ]
+                  }
+                ),
+                index < steps.length - 1 && /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    className: cn(
+                      "transition-colors",
+                      styles.connector,
+                      styles.connectorLength,
+                      isCompleted ? "bg-[var(--cyan)]" : "bg-gray-200",
+                      orientation === "vertical" && "ml-[13px] my-1"
+                    )
+                  }
+                )
+              ]
+            },
+            step.id
+          );
+        })
+      }
+    );
+  }
+);
+StepProgress.displayName = "StepProgress";
+var StepDots = React27.forwardRef(
+  ({ totalSteps, currentStep, onStepClick, className }, ref) => {
+    return /* @__PURE__ */ jsx("div", { ref, className: cn("flex items-center gap-2", className), children: Array.from({ length: totalSteps }, (_, i) => i + 1).map((step) => {
+      const isCompleted = step < currentStep;
+      const isCurrent = step === currentStep;
+      const isClickable = onStepClick && step < currentStep;
+      return /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => isClickable && onStepClick(step),
+          disabled: !isClickable,
+          className: cn(
+            "w-2 h-2 rounded-full transition-colors",
+            isClickable && "cursor-pointer",
+            !isClickable && "cursor-default",
+            isCompleted || isCurrent ? "bg-[var(--cyan)]" : "bg-gray-200"
+          ),
+          "aria-label": `Step ${step}`
+        },
+        step
+      );
+    }) });
+  }
+);
+StepDots.displayName = "StepDots";
+var Breadcrumbs = React27.forwardRef(
+  ({
+    items,
+    LinkComponent,
+    separator,
+    showHomeIcon = false,
+    maxItems,
+    size = "default",
+    className,
+    ...props
+  }, ref) => {
+    const sizeStyles = {
+      sm: "text-xs gap-1",
+      default: "text-sm gap-1.5"
+    };
+    const iconSize = size === "sm" ? 10 : 12;
+    let displayItems = items;
+    if (maxItems && items.length > maxItems) {
+      displayItems = [
+        items[0],
+        { label: "...", href: void 0 },
+        ...items.slice(-(maxItems - 2))
+      ];
+    }
+    const defaultSeparator = /* @__PURE__ */ jsx(CaretRight, { size: iconSize, className: "text-gray-400" });
+    return /* @__PURE__ */ jsx(
+      "nav",
+      {
+        ref,
+        "aria-label": "Breadcrumb",
+        className: cn("flex items-center text-gray-500", sizeStyles[size], className),
+        ...props,
+        children: /* @__PURE__ */ jsx("ol", { className: cn("flex items-center", sizeStyles[size]), children: displayItems.map((item, index) => {
+          const isFirst = index === 0;
+          const isLast = index === displayItems.length - 1;
+          const isEllipsis = item.label === "...";
+          return /* @__PURE__ */ jsxs("li", { className: cn("flex items-center", sizeStyles[size]), children: [
+            index > 0 && /* @__PURE__ */ jsx("span", { className: "mx-1 text-gray-400", children: separator || defaultSeparator }),
+            isEllipsis ? /* @__PURE__ */ jsx("span", { className: "text-gray-400", children: item.label }) : item.href && !isLast ? LinkComponent ? /* @__PURE__ */ jsxs(
+              LinkComponent,
+              {
+                href: item.href,
+                className: "flex items-center gap-1 hover:text-[var(--black)] transition-colors",
+                children: [
+                  isFirst && showHomeIcon && /* @__PURE__ */ jsx(House, { size: iconSize + 2, weight: "fill" }),
+                  item.icon,
+                  /* @__PURE__ */ jsx("span", { children: item.label })
+                ]
+              }
+            ) : /* @__PURE__ */ jsxs(
+              "a",
+              {
+                href: item.href,
+                className: "flex items-center gap-1 hover:text-[var(--black)] transition-colors",
+                children: [
+                  isFirst && showHomeIcon && /* @__PURE__ */ jsx(House, { size: iconSize + 2, weight: "fill" }),
+                  item.icon,
+                  /* @__PURE__ */ jsx("span", { children: item.label })
+                ]
+              }
+            ) : /* @__PURE__ */ jsxs(
+              "span",
+              {
+                className: cn(
+                  "flex items-center gap-1",
+                  isLast && "text-[var(--black)] font-medium"
+                ),
+                "aria-current": isLast ? "page" : void 0,
+                children: [
+                  isFirst && showHomeIcon && /* @__PURE__ */ jsx(House, { size: iconSize + 2, weight: "fill" }),
+                  item.icon,
+                  /* @__PURE__ */ jsx("span", { children: item.label })
+                ]
+              }
+            )
+          ] }, index);
+        }) })
+      }
+    );
+  }
+);
+Breadcrumbs.displayName = "Breadcrumbs";
+var BreadcrumbLink = React27.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+    "a",
+    {
+      ref,
+      className: cn(
+        "hover:text-[var(--black)] transition-colors",
+        className
+      ),
+      ...props
+    }
+  )
+);
+BreadcrumbLink.displayName = "BreadcrumbLink";
+var presetLabels = {
+  "today": "Today",
+  "yesterday": "Yesterday",
+  "7d": "Last 7 days",
+  "30d": "Last 30 days",
+  "90d": "Last 90 days",
+  "this-week": "This week",
+  "this-month": "This month",
+  "this-year": "This year",
+  "custom": "Custom"
+};
+var DateRangePicker = React27.forwardRef(
+  ({
+    value,
+    onChange,
+    customStart = "",
+    customEnd = "",
+    onCustomChange,
+    presets = ["7d", "30d", "90d", "custom"],
+    size = "default",
+    className,
+    inlineCustom = true
+  }, ref) => {
+    const buttonSize = size === "sm" ? "sm" : "default";
+    return /* @__PURE__ */ jsxs("div", { ref, className: cn("flex flex-wrap items-center gap-2", className), children: [
+      presets.map((preset) => /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: value === preset ? "default" : "outline",
+          size: buttonSize,
+          onClick: () => onChange(preset),
+          children: presetLabels[preset]
+        },
+        preset
+      )),
+      value === "custom" && inlineCustom && onCustomChange && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+          /* @__PURE__ */ jsx(Label2, { htmlFor: "start-date", className: "text-xs sr-only", children: "Start" }),
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              id: "start-date",
+              type: "date",
+              value: customStart,
+              onChange: (e) => onCustomChange(e.target.value, customEnd),
+              className: cn(size === "sm" ? "h-8 text-xs" : "h-9"),
+              "aria-label": "Start date"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "to" }),
+        /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+          /* @__PURE__ */ jsx(Label2, { htmlFor: "end-date", className: "text-xs sr-only", children: "End" }),
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              id: "end-date",
+              type: "date",
+              value: customEnd,
+              onChange: (e) => onCustomChange(customStart, e.target.value),
+              className: cn(size === "sm" ? "h-8 text-xs" : "h-9"),
+              "aria-label": "End date"
+            }
+          )
+        ] })
+      ] })
+    ] });
+  }
+);
+DateRangePicker.displayName = "DateRangePicker";
+var DateRangeSelect = React27.forwardRef(
+  ({ value, onChange, presets = ["7d", "30d", "90d"], className }, ref) => {
+    return /* @__PURE__ */ jsx(
+      "select",
+      {
+        ref,
+        value,
+        onChange: (e) => onChange(e.target.value),
+        className: cn(
+          "h-9 rounded-sm border border-input bg-background px-3 text-sm ring-offset-background focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
+          className
+        ),
+        children: presets.map((preset) => /* @__PURE__ */ jsx("option", { value: preset, children: presetLabels[preset] }, preset))
+      }
+    );
+  }
+);
+DateRangeSelect.displayName = "DateRangeSelect";
+function getDateRangeFromPreset(preset) {
+  const now = /* @__PURE__ */ new Date();
+  const end = new Date(now);
+  end.setHours(23, 59, 59, 999);
+  let start = new Date(now);
+  start.setHours(0, 0, 0, 0);
+  switch (preset) {
+    case "today":
+      break;
+    case "yesterday":
+      start.setDate(start.getDate() - 1);
+      end.setDate(end.getDate() - 1);
+      break;
+    case "7d":
+      start.setDate(start.getDate() - 7);
+      break;
+    case "30d":
+      start.setDate(start.getDate() - 30);
+      break;
+    case "90d":
+      start.setDate(start.getDate() - 90);
+      break;
+    case "this-week":
+      start.setDate(start.getDate() - start.getDay());
+      break;
+    case "this-month":
+      start.setDate(1);
+      break;
+    case "this-year":
+      start.setMonth(0, 1);
+      break;
+  }
+  return { start, end };
+}
+var SettingsNav = React27.forwardRef(
+  ({ groups, LinkComponent, className, ...props }, ref) => {
+    const Link2 = LinkComponent || "a";
+    return /* @__PURE__ */ jsx("div", { ref, className: cn("space-y-8", className), ...props, children: groups.map((group) => /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("h2", { className: "text-sm font-medium text-muted-foreground uppercase tracking-wide mb-3 px-1", children: group.title }),
+      /* @__PURE__ */ jsx("div", { className: "space-y-1", children: group.items.map((item) => /* @__PURE__ */ jsxs(
+        Link2,
+        {
+          href: item.href,
+          className: "group flex items-center gap-4 p-4 rounded-sm transition-all hover:bg-gray-50 border border-transparent hover:border-gray-200",
+          children: [
+            /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center w-10 h-10 rounded-sm bg-gray-100 group-hover:bg-[var(--cyan)]/10 transition-colors", children: /* @__PURE__ */ jsx("span", { className: "text-gray-600 group-hover:text-[var(--cyan)] transition-colors [&>svg]:w-5 [&>svg]:h-5", children: item.icon }) }),
+            /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
+              /* @__PURE__ */ jsx("h3", { className: "font-medium text-[var(--black)] group-hover:text-[var(--cyan)] transition-colors", children: item.title }),
+              /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: item.description })
+            ] }),
+            /* @__PURE__ */ jsx(
+              CaretRight,
+              {
+                size: 18,
+                className: "text-gray-300 group-hover:text-[var(--cyan)] group-hover:translate-x-0.5 transition-all shrink-0"
+              }
+            )
+          ]
+        },
+        item.href
+      )) })
+    ] }, group.title)) });
+  }
+);
+SettingsNav.displayName = "SettingsNav";
+var SettingsNavLink = React27.forwardRef(
+  ({ title, description, icon, href, LinkComponent, className, ...props }, ref) => {
+    const content = /* @__PURE__ */ jsxs(Fragment, { children: [
+      icon && /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center w-10 h-10 rounded-sm bg-gray-100 group-hover:bg-[var(--cyan)]/10 transition-colors", children: /* @__PURE__ */ jsx("span", { className: "text-gray-600 group-hover:text-[var(--cyan)] transition-colors [&>svg]:w-5 [&>svg]:h-5", children: icon }) }),
+      /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
+        /* @__PURE__ */ jsx("h3", { className: "font-medium text-[var(--black)] group-hover:text-[var(--cyan)] transition-colors", children: title }),
+        description && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: description })
+      ] }),
+      /* @__PURE__ */ jsx(
+        CaretRight,
+        {
+          size: 18,
+          className: "text-gray-300 group-hover:text-[var(--cyan)] group-hover:translate-x-0.5 transition-all shrink-0"
+        }
+      )
+    ] });
+    const linkClassName = cn(
+      "group flex items-center gap-4 p-4 rounded-sm transition-all hover:bg-gray-50 border border-transparent hover:border-gray-200",
+      className
+    );
+    if (LinkComponent && href) {
+      return /* @__PURE__ */ jsx(LinkComponent, { href, className: linkClassName, children: content });
+    }
+    return /* @__PURE__ */ jsx("a", { ref, href, className: linkClassName, ...props, children: content });
+  }
+);
+SettingsNavLink.displayName = "SettingsNavLink";
 
 // src/index.ts
 __reExport(index_exports, icons_exports);
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, Avatar, AvatarFallback, AvatarImage, Badge, Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, CodeBlock, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Divider, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, FormField, IconBox, Input, Label2 as Label, Logo, MetricCard, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, Progress, Select, Separator2 as Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SidebarNavItem, Stat, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tag, Textarea, Toast, ToastAction, ToastClose, ToastDescription, ToastIcon, ToastProvider, ToastTitle, ToastViewport, Toaster, UsageBar, UsageChart, alertVariants, badgeVariants, buttonVariants, cn, iconBoxVariants, metricCardVariants, navigationMenuTriggerStyle, progressVariants, statVariants, tagVariants, toast, usageBarVariants, useToast, valueVariants };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, Avatar, AvatarFallback, AvatarImage, Badge, BreadcrumbLink, Breadcrumbs, Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, CodeBlock, ConfirmDialog, DateRangePicker, DateRangeSelect, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Divider, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, FormField, IconBox, Input, Label2 as Label, LabeledSwitch, Logo, MetricCard, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, Pagination, Popover, PopoverAnchor, PopoverArrow, PopoverClose, PopoverContent, PopoverTrigger, Progress, RadioGroup, RadioGroupCard, RadioGroupItem, RadioGroupOption, Select, Separator2 as Separator, SettingsNav, SettingsNavLink, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SidebarNavItem, SimplePagination, SimpleTooltip, Skeleton, SkeletonCard, SkeletonText, Stat, StepDots, StepProgress, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsListUnderline, TabsTrigger, TabsTriggerUnderline, Tag, Textarea, Toast, ToastAction, ToastClose, ToastDescription, ToastIcon, ToastProvider, ToastTitle, ToastViewport, Toaster, Tooltip, TooltipArrow, TooltipContent, TooltipProvider, TooltipTrigger, UsageBar, UsageChart, alertVariants, badgeVariants, buttonVariants, cn, getDateRangeFromPreset, iconBoxVariants, metricCardVariants, navigationMenuTriggerStyle, progressVariants, statVariants, tagVariants, toast, usageBarVariants, useToast, valueVariants };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map