@hex-core/components 1.0.1 → 1.1.1

package/dist/index.js

@@ -46,9 +46,7 @@ var buttonVariants = cva(
         secondary: [
           "bg-secondary text-secondary-foreground",
           "shadow-sm",
-          // Hover: shadow-elevation only — opacity-based bg shift would push apparent
-          // contrast below 3:1 vs --card during hover, regressing WCAG 1.4.11.
-          "hover:shadow-md"
+          "hover:bg-secondary/80 hover:shadow-md"
         ].join(" "),
         ghost: "hover:bg-accent hover:text-accent-foreground",
         link: "text-primary underline-offset-4 hover:underline"
@@ -290,9 +288,7 @@ var badgeVariants = cva3(
     variants: {
       variant: {
         default: "border-transparent bg-primary text-primary-foreground hover:bg-primary/80",
-        // Hover stays at full --secondary fill — opacity-based shift would drop the
-        // composite contrast below 3:1 against --card on hover (WCAG 1.4.11).
-        secondary: "border-transparent bg-secondary text-secondary-foreground",
+        secondary: "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",
         destructive: "border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80",
         outline: "text-foreground"
       }
@@ -732,11 +728,177 @@ ScrollBar.displayName = "ScrollBar";
 import * as AspectRatioPrimitive from "@radix-ui/react-aspect-ratio";
 var AspectRatio = AspectRatioPrimitive.Root;
 
+// src/primitives/container/container.tsx
+import { Slot as Slot2 } from "@radix-ui/react-slot";
+import { cva as cva5 } from "class-variance-authority";
+import { jsx as jsx18 } from "react/jsx-runtime";
+var containerVariants = cva5("mx-auto w-full", {
+  variants: {
+    size: {
+      sm: "max-w-[var(--container-sm,33rem)]",
+      md: "max-w-[var(--container-md,40rem)]",
+      lg: "max-w-[var(--container-lg,50rem)]",
+      xl: "max-w-[var(--container-xl,66rem)]",
+      full: "max-w-full"
+    },
+    padding: {
+      none: "",
+      sm: "px-[var(--space-3,0.75rem)]",
+      md: "px-[var(--space-4,1rem)]",
+      lg: "px-[var(--space-8,2rem)]"
+    }
+  },
+  defaultVariants: {
+    size: "lg",
+    padding: "md"
+  }
+});
+function Container({ className, size, padding, asChild = false, ...props }) {
+  const Comp = asChild ? Slot2 : "div";
+  return /* @__PURE__ */ jsx18(Comp, { className: cn(containerVariants({ size, padding }), className), ...props });
+}
+
+// src/primitives/stack/stack.tsx
+import { cva as cva6 } from "class-variance-authority";
+
+// src/primitives/_shared/layout-variants.ts
+var gapVariants = {
+  xs: "gap-[var(--gap-xs,0.25rem)]",
+  sm: "gap-[var(--gap-sm,0.5rem)]",
+  md: "gap-[var(--gap-md,1rem)]",
+  lg: "gap-[var(--gap-lg,1.5rem)]",
+  xl: "gap-[var(--gap-xl,2rem)]"
+};
+var justifyVariants = {
+  start: "justify-start",
+  center: "justify-center",
+  end: "justify-end",
+  between: "justify-between"
+};
+var flexAlignVariants = {
+  start: "items-start",
+  center: "items-center",
+  end: "items-end",
+  stretch: "items-stretch"
+};
+var clusterAlignVariants = {
+  start: "items-start",
+  center: "items-center",
+  end: "items-end",
+  stretch: "items-stretch",
+  baseline: "items-baseline"
+};
+
+// src/primitives/stack/stack.tsx
+import { jsx as jsx19 } from "react/jsx-runtime";
+var stackVariants = cva6("flex flex-col", {
+  variants: {
+    gap: gapVariants,
+    align: flexAlignVariants,
+    justify: justifyVariants
+  },
+  defaultVariants: {
+    gap: "md",
+    align: "stretch",
+    justify: "start"
+  }
+});
+function Stack({ className, gap, align, justify, ...props }) {
+  return /* @__PURE__ */ jsx19("div", { className: cn(stackVariants({ gap, align, justify }), className), ...props });
+}
+
+// src/primitives/cluster/cluster.tsx
+import { cva as cva7 } from "class-variance-authority";
+import { jsx as jsx20 } from "react/jsx-runtime";
+var clusterVariants = cva7("flex flex-wrap", {
+  variants: {
+    gap: gapVariants,
+    align: clusterAlignVariants,
+    justify: justifyVariants
+  },
+  defaultVariants: {
+    gap: "md",
+    align: "center",
+    justify: "start"
+  }
+});
+function Cluster({ className, gap, align, justify, ...props }) {
+  return /* @__PURE__ */ jsx20("div", { className: cn(clusterVariants({ gap, align, justify }), className), ...props });
+}
+
+// src/primitives/grid/grid.tsx
+import { cva as cva8 } from "class-variance-authority";
+import { jsx as jsx21 } from "react/jsx-runtime";
+var gridVariants = cva8("grid", {
+  variants: {
+    cols: {
+      1: "grid-cols-1",
+      2: "grid-cols-2",
+      3: "grid-cols-3",
+      4: "grid-cols-4",
+      6: "grid-cols-6",
+      "auto-fit": ""
+    },
+    gap: gapVariants,
+    align: flexAlignVariants
+  },
+  defaultVariants: {
+    cols: 3,
+    gap: "md",
+    align: "stretch"
+  }
+});
+function Grid({ className, cols, gap, align, minColWidth = "16rem", style, ...props }) {
+  const inlineStyle = cols === "auto-fit" ? { gridTemplateColumns: `repeat(auto-fit, minmax(${minColWidth}, 1fr))`, ...style } : style;
+  return /* @__PURE__ */ jsx21(
+    "div",
+    {
+      className: cn(gridVariants({ cols, gap, align }), className),
+      style: inlineStyle,
+      ...props
+    }
+  );
+}
+
+// src/primitives/spacer/spacer.tsx
+import { cva as cva9 } from "class-variance-authority";
+import { jsx as jsx22 } from "react/jsx-runtime";
+var spacerVariants = cva9("shrink-0", {
+  variants: {
+    size: {
+      xs: "[--spacer-size:var(--space-1,0.25rem)]",
+      sm: "[--spacer-size:var(--space-2,0.5rem)]",
+      md: "[--spacer-size:var(--space-4,1rem)]",
+      lg: "[--spacer-size:var(--space-8,2rem)]",
+      xl: "[--spacer-size:var(--space-16,4rem)]"
+    },
+    axis: {
+      vertical: "h-[var(--spacer-size)] w-0",
+      horizontal: "w-[var(--spacer-size)] h-0",
+      both: "h-[var(--spacer-size)] w-[var(--spacer-size)]"
+    }
+  },
+  defaultVariants: {
+    size: "md",
+    axis: "vertical"
+  }
+});
+function Spacer({ className, size, axis, ...props }) {
+  return /* @__PURE__ */ jsx22(
+    "div",
+    {
+      "aria-hidden": "true",
+      className: cn(spacerVariants({ size, axis }), className),
+      ...props
+    }
+  );
+}
+
 // src/components/card/card.tsx
 import * as React16 from "react";
-import { jsx as jsx18 } from "react/jsx-runtime";
+import { jsx as jsx23 } from "react/jsx-runtime";
 var Card = React16.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx18(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx23(
     "div",
     {
       ref,
@@ -752,7 +914,7 @@ var Card = React16.forwardRef(
 );
 Card.displayName = "Card";
 var CardHeader = React16.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx18(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx23(
     "div",
     {
       ref,
@@ -763,7 +925,7 @@ var CardHeader = React16.forwardRef(
 );
 CardHeader.displayName = "CardHeader";
 var CardTitle = React16.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx18(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx23(
     "h3",
     {
       ref,
@@ -773,14 +935,14 @@ var CardTitle = React16.forwardRef(
   )
 );
 CardTitle.displayName = "CardTitle";
-var CardDescription = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx18("p", { ref, className: cn("text-sm text-muted-foreground", className), ...props }));
+var CardDescription = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx23("p", { ref, className: cn("text-sm text-muted-foreground", className), ...props }));
 CardDescription.displayName = "CardDescription";
 var CardContent = React16.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx18("div", { ref, className: cn("p-[var(--space-6,1.5rem)] pt-0", className), ...props })
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx23("div", { ref, className: cn("p-[var(--space-6,1.5rem)] pt-0", className), ...props })
 );
 CardContent.displayName = "CardContent";
 var CardFooter = React16.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx18(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx23(
     "div",
     {
       ref,
@@ -794,9 +956,9 @@ CardFooter.displayName = "CardFooter";
 // src/components/tabs/tabs.tsx
 import * as React17 from "react";
 import * as TabsPrimitive from "@radix-ui/react-tabs";
-import { jsx as jsx19 } from "react/jsx-runtime";
+import { jsx as jsx24 } from "react/jsx-runtime";
 var Tabs = TabsPrimitive.Root;
-var TabsList = React17.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx19(
+var TabsList = React17.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx24(
   TabsPrimitive.List,
   {
     ref,
@@ -808,7 +970,7 @@ var TabsList = React17.forwardRef(({ className, ...props }, ref) => /* @__PURE__
   }
 ));
 TabsList.displayName = "TabsList";
-var TabsTrigger = React17.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx19(
+var TabsTrigger = React17.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx24(
   TabsPrimitive.Trigger,
   {
     ref,
@@ -825,7 +987,7 @@ var TabsTrigger = React17.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 TabsTrigger.displayName = "TabsTrigger";
-var TabsContent = React17.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx19(
+var TabsContent = React17.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx24(
   TabsPrimitive.Content,
   {
     ref,
@@ -842,11 +1004,11 @@ TabsContent.displayName = "TabsContent";
 // src/components/accordion/accordion.tsx
 import * as React18 from "react";
 import * as AccordionPrimitive from "@radix-ui/react-accordion";
-import { jsx as jsx20, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx25, jsxs as jsxs6 } from "react/jsx-runtime";
 var Accordion = AccordionPrimitive.Root;
-var AccordionItem = React18.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx20(AccordionPrimitive.Item, { ref, className: cn("border-b", className), ...props }));
+var AccordionItem = React18.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx25(AccordionPrimitive.Item, { ref, className: cn("border-b", className), ...props }));
 AccordionItem.displayName = "AccordionItem";
-var AccordionTrigger = React18.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx20(AccordionPrimitive.Header, { className: "flex", children: /* @__PURE__ */ jsxs6(
+var AccordionTrigger = React18.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx25(AccordionPrimitive.Header, { className: "flex", children: /* @__PURE__ */ jsxs6(
   AccordionPrimitive.Trigger,
   {
     ref,
@@ -860,7 +1022,7 @@ var AccordionTrigger = React18.forwardRef(({ className, children, ...props }, re
     ...props,
     children: [
       children,
-      /* @__PURE__ */ jsx20(
+      /* @__PURE__ */ jsx25(
         "svg",
         {
           xmlns: "http://www.w3.org/2000/svg",
@@ -874,20 +1036,20 @@ var AccordionTrigger = React18.forwardRef(({ className, children, ...props }, re
           strokeLinejoin: "round",
           className: "h-4 w-4 shrink-0 transition-transform duration-[var(--duration-normal,200ms)]",
           "aria-hidden": "true",
-          children: /* @__PURE__ */ jsx20("polyline", { points: "6 9 12 15 18 9" })
+          children: /* @__PURE__ */ jsx25("polyline", { points: "6 9 12 15 18 9" })
         }
       )
     ]
   }
 ) }));
 AccordionTrigger.displayName = "AccordionTrigger";
-var AccordionContent = React18.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx20(
+var AccordionContent = React18.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx25(
   AccordionPrimitive.Content,
   {
     ref,
     className: "overflow-hidden text-sm transition-all data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down",
     ...props,
-    children: /* @__PURE__ */ jsx20("div", { className: cn("pb-[var(--space-4,1rem)] pt-0", className), children })
+    children: /* @__PURE__ */ jsx25("div", { className: cn("pb-[var(--space-4,1rem)] pt-0", className), children })
   }
 ));
 AccordionContent.displayName = "AccordionContent";
@@ -895,12 +1057,12 @@ AccordionContent.displayName = "AccordionContent";
 // src/components/dialog/dialog.tsx
 import * as DialogPrimitive from "@radix-ui/react-dialog";
 import * as React19 from "react";
-import { jsx as jsx21, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx26, jsxs as jsxs7 } from "react/jsx-runtime";
 var Dialog = DialogPrimitive.Root;
 var DialogTrigger = DialogPrimitive.Trigger;
 var DialogPortal = DialogPrimitive.Portal;
 var DialogClose = DialogPrimitive.Close;
-var DialogOverlay = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx21(
+var DialogOverlay = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx26(
   DialogPrimitive.Overlay,
   {
     ref,
@@ -915,7 +1077,7 @@ var DialogOverlay = React19.forwardRef(({ className, ...props }, ref) => /* @__P
 ));
 DialogOverlay.displayName = "DialogOverlay";
 var DialogContent = React19.forwardRef(({ className, children, scrollable = true, ...props }, ref) => /* @__PURE__ */ jsxs7(DialogPortal, { children: [
-  /* @__PURE__ */ jsx21(DialogOverlay, {}),
+  /* @__PURE__ */ jsx26(DialogOverlay, {}),
   /* @__PURE__ */ jsxs7(
     DialogPrimitive.Content,
     {
@@ -930,7 +1092,7 @@ var DialogContent = React19.forwardRef(({ className, children, scrollable = true
       ),
       ...props,
       children: [
-        scrollable ? /* @__PURE__ */ jsx21("div", { className: "grid gap-[var(--gap-md,1rem)] overflow-y-auto p-[var(--space-6,1.5rem)]", children }) : children,
+        scrollable ? /* @__PURE__ */ jsx26("div", { className: "grid gap-[var(--gap-md,1rem)] overflow-y-auto p-[var(--space-6,1.5rem)]", children }) : children,
         /* @__PURE__ */ jsxs7(
           DialogPrimitive.Close,
           {
@@ -954,12 +1116,12 @@ var DialogContent = React19.forwardRef(({ className, children, scrollable = true
                   className: "h-4 w-4",
                   "aria-hidden": "true",
                   children: [
-                    /* @__PURE__ */ jsx21("path", { d: "M18 6 6 18" }),
-                    /* @__PURE__ */ jsx21("path", { d: "m6 6 12 12" })
+                    /* @__PURE__ */ jsx26("path", { d: "M18 6 6 18" }),
+                    /* @__PURE__ */ jsx26("path", { d: "m6 6 12 12" })
                   ]
                 }
               ),
-              /* @__PURE__ */ jsx21("span", { className: "sr-only", children: "Close" })
+              /* @__PURE__ */ jsx26("span", { className: "sr-only", children: "Close" })
             ]
           }
         )
@@ -969,7 +1131,7 @@ var DialogContent = React19.forwardRef(({ className, children, scrollable = true
 ] }));
 DialogContent.displayName = "DialogContent";
 function DialogHeader({ className, ...props }) {
-  return /* @__PURE__ */ jsx21(
+  return /* @__PURE__ */ jsx26(
     "div",
     {
       className: cn("flex flex-col space-y-1.5 text-center sm:text-left", className),
@@ -978,7 +1140,7 @@ function DialogHeader({ className, ...props }) {
   );
 }
 function DialogFooter({ className, ...props }) {
-  return /* @__PURE__ */ jsx21(
+  return /* @__PURE__ */ jsx26(
     "div",
     {
       className: cn(
@@ -989,7 +1151,7 @@ function DialogFooter({ className, ...props }) {
     }
   );
 }
-var DialogTitle = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx21(
+var DialogTitle = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx26(
   DialogPrimitive.Title,
   {
     ref,
@@ -998,7 +1160,7 @@ var DialogTitle = React19.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 DialogTitle.displayName = "DialogTitle";
-var DialogDescription = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx21(
+var DialogDescription = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx26(
   DialogPrimitive.Description,
   {
     ref,
@@ -1011,11 +1173,11 @@ DialogDescription.displayName = "DialogDescription";
 // src/components/alert-dialog/alert-dialog.tsx
 import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog";
 import * as React20 from "react";
-import { jsx as jsx22, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx27, jsxs as jsxs8 } from "react/jsx-runtime";
 var AlertDialog = AlertDialogPrimitive.Root;
 var AlertDialogTrigger = AlertDialogPrimitive.Trigger;
 var AlertDialogPortal = AlertDialogPrimitive.Portal;
-var AlertDialogOverlay = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
+var AlertDialogOverlay = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx27(
   AlertDialogPrimitive.Overlay,
   {
     ref,
@@ -1030,8 +1192,8 @@ var AlertDialogOverlay = React20.forwardRef(({ className, ...props }, ref) => /*
 ));
 AlertDialogOverlay.displayName = "AlertDialogOverlay";
 var AlertDialogContent = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs8(AlertDialogPortal, { children: [
-  /* @__PURE__ */ jsx22(AlertDialogOverlay, {}),
-  /* @__PURE__ */ jsx22(
+  /* @__PURE__ */ jsx27(AlertDialogOverlay, {}),
+  /* @__PURE__ */ jsx27(
     AlertDialogPrimitive.Content,
     {
       ref,
@@ -1049,7 +1211,7 @@ var AlertDialogContent = React20.forwardRef(({ className, ...props }, ref) => /*
 ] }));
 AlertDialogContent.displayName = "AlertDialogContent";
 function AlertDialogHeader({ className, ...props }) {
-  return /* @__PURE__ */ jsx22(
+  return /* @__PURE__ */ jsx27(
     "div",
     {
       className: cn("flex flex-col space-y-2 text-center sm:text-left", className),
@@ -1058,7 +1220,7 @@ function AlertDialogHeader({ className, ...props }) {
   );
 }
 function AlertDialogFooter({ className, ...props }) {
-  return /* @__PURE__ */ jsx22(
+  return /* @__PURE__ */ jsx27(
     "div",
     {
       className: cn(
@@ -1069,7 +1231,7 @@ function AlertDialogFooter({ className, ...props }) {
     }
   );
 }
-var AlertDialogTitle = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
+var AlertDialogTitle = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx27(
   AlertDialogPrimitive.Title,
   {
     ref,
@@ -1078,7 +1240,7 @@ var AlertDialogTitle = React20.forwardRef(({ className, ...props }, ref) => /* @
   }
 ));
 AlertDialogTitle.displayName = "AlertDialogTitle";
-var AlertDialogDescription = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
+var AlertDialogDescription = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx27(
   AlertDialogPrimitive.Description,
   {
     ref,
@@ -1087,7 +1249,7 @@ var AlertDialogDescription = React20.forwardRef(({ className, ...props }, ref) =
   }
 ));
 AlertDialogDescription.displayName = "AlertDialogDescription";
-var AlertDialogAction = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
+var AlertDialogAction = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx27(
   AlertDialogPrimitive.Action,
   {
     ref,
@@ -1105,7 +1267,7 @@ var AlertDialogAction = React20.forwardRef(({ className, ...props }, ref) => /*
   }
 ));
 AlertDialogAction.displayName = "AlertDialogAction";
-var AlertDialogCancel = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
+var AlertDialogCancel = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx27(
   AlertDialogPrimitive.Cancel,
   {
     ref,
@@ -1127,14 +1289,14 @@ AlertDialogCancel.displayName = "AlertDialogCancel";
 // src/components/dropdown-menu/dropdown-menu.tsx
 import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
 import * as React21 from "react";
-import { jsx as jsx23, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx28, jsxs as jsxs9 } from "react/jsx-runtime";
 var DropdownMenu = DropdownMenuPrimitive.Root;
 var DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
 var DropdownMenuGroup = DropdownMenuPrimitive.Group;
 var DropdownMenuPortal = DropdownMenuPrimitive.Portal;
 var DropdownMenuSub = DropdownMenuPrimitive.Sub;
 var DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
-var DropdownMenuContent = React21.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx23(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx23(
+var DropdownMenuContent = React21.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx28(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx28(
   DropdownMenuPrimitive.Content,
   {
     ref,
@@ -1151,7 +1313,7 @@ var DropdownMenuContent = React21.forwardRef(({ className, sideOffset = 4, ...pr
   }
 ) }));
 DropdownMenuContent.displayName = "DropdownMenuContent";
-var DropdownMenuItem = React21.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx23(
+var DropdownMenuItem = React21.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx28(
   DropdownMenuPrimitive.Item,
   {
     ref,
@@ -1181,7 +1343,7 @@ var DropdownMenuCheckboxItem = React21.forwardRef(({ className, children, checke
     checked,
     ...props,
     children: [
-      /* @__PURE__ */ jsx23("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx23(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx23(
+      /* @__PURE__ */ jsx28("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx28(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx28(
         "svg",
         {
           xmlns: "http://www.w3.org/2000/svg",
@@ -1193,7 +1355,7 @@ var DropdownMenuCheckboxItem = React21.forwardRef(({ className, children, checke
           strokeLinejoin: "round",
           className: "h-4 w-4",
           "aria-hidden": "true",
-          children: /* @__PURE__ */ jsx23("polyline", { points: "20 6 9 17 4 12" })
+          children: /* @__PURE__ */ jsx28("polyline", { points: "20 6 9 17 4 12" })
         }
       ) }) }),
       children
@@ -1214,13 +1376,13 @@ var DropdownMenuRadioItem = React21.forwardRef(({ className, children, ...props
     ),
     ...props,
     children: [
-      /* @__PURE__ */ jsx23("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx23(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx23("svg", { viewBox: "0 0 24 24", className: "h-2 w-2 fill-current", "aria-hidden": "true", children: /* @__PURE__ */ jsx23("circle", { cx: "12", cy: "12", r: "10" }) }) }) }),
+      /* @__PURE__ */ jsx28("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx28(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx28("svg", { viewBox: "0 0 24 24", className: "h-2 w-2 fill-current", "aria-hidden": "true", children: /* @__PURE__ */ jsx28("circle", { cx: "12", cy: "12", r: "10" }) }) }) }),
       children
     ]
   }
 ));
 DropdownMenuRadioItem.displayName = "DropdownMenuRadioItem";
-var DropdownMenuLabel = React21.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx23(
+var DropdownMenuLabel = React21.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx28(
   DropdownMenuPrimitive.Label,
   {
     ref,
@@ -1229,7 +1391,7 @@ var DropdownMenuLabel = React21.forwardRef(({ className, inset, ...props }, ref)
   }
 ));
 DropdownMenuLabel.displayName = "DropdownMenuLabel";
-var DropdownMenuSeparator = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx23(
+var DropdownMenuSeparator = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx28(
   DropdownMenuPrimitive.Separator,
   {
     ref,
@@ -1239,7 +1401,7 @@ var DropdownMenuSeparator = React21.forwardRef(({ className, ...props }, ref) =>
 ));
 DropdownMenuSeparator.displayName = "DropdownMenuSeparator";
 function DropdownMenuShortcut({ className, ...props }) {
-  return /* @__PURE__ */ jsx23(
+  return /* @__PURE__ */ jsx28(
     "span",
     {
       className: cn("ml-auto text-xs tracking-widest text-muted-foreground", className),
@@ -1251,11 +1413,11 @@ function DropdownMenuShortcut({ className, ...props }) {
 // src/components/popover/popover.tsx
 import * as PopoverPrimitive from "@radix-ui/react-popover";
 import * as React22 from "react";
-import { jsx as jsx24 } from "react/jsx-runtime";
+import { jsx as jsx29 } from "react/jsx-runtime";
 var Popover = PopoverPrimitive.Root;
 var PopoverTrigger = PopoverPrimitive.Trigger;
 var PopoverAnchor = PopoverPrimitive.Anchor;
-var PopoverContent = React22.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx24(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx24(
+var PopoverContent = React22.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx29(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx29(
   PopoverPrimitive.Content,
   {
     ref,
@@ -1277,11 +1439,11 @@ PopoverContent.displayName = "PopoverContent";
 // src/components/tooltip/tooltip.tsx
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
 import * as React23 from "react";
-import { jsx as jsx25 } from "react/jsx-runtime";
+import { jsx as jsx30 } from "react/jsx-runtime";
 var TooltipProvider = TooltipPrimitive.Provider;
 var Tooltip = TooltipPrimitive.Root;
 var TooltipTrigger = TooltipPrimitive.Trigger;
-var TooltipContent = React23.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx25(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsx25(
+var TooltipContent = React23.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx30(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsx30(
   TooltipPrimitive.Content,
   {
     ref,
@@ -1299,7 +1461,7 @@ var TooltipContent = React23.forwardRef(({ className, sideOffset = 4, ...props }
 TooltipContent.displayName = "TooltipContent";
 
 // src/components/form/form.tsx
-import { Slot as Slot2 } from "@radix-ui/react-slot";
+import { Slot as Slot3 } from "@radix-ui/react-slot";
 import * as React24 from "react";
 import {
   Controller,
@@ -1307,13 +1469,13 @@ import {
   useFormContext,
   useFormState
 } from "react-hook-form";
-import { jsx as jsx26 } from "react/jsx-runtime";
+import { jsx as jsx31 } from "react/jsx-runtime";
 var Form = FormProvider;
 var FormFieldContext = React24.createContext({});
 var FormField = ({
   ...props
 }) => {
-  return /* @__PURE__ */ jsx26(FormFieldContext.Provider, { value: { name: props.name }, children: /* @__PURE__ */ jsx26(Controller, { ...props }) });
+  return /* @__PURE__ */ jsx31(FormFieldContext.Provider, { value: { name: props.name }, children: /* @__PURE__ */ jsx31(Controller, { ...props }) });
 };
 var FormItemContext = React24.createContext({});
 function useFormField() {
@@ -1338,13 +1500,13 @@ function useFormField() {
 var FormItem = React24.forwardRef(
   ({ className, ...props }, ref) => {
     const id = React24.useId();
-    return /* @__PURE__ */ jsx26(FormItemContext.Provider, { value: { id }, children: /* @__PURE__ */ jsx26("div", { ref, className: cn("space-y-2", className), ...props }) });
+    return /* @__PURE__ */ jsx31(FormItemContext.Provider, { value: { id }, children: /* @__PURE__ */ jsx31("div", { ref, className: cn("space-y-2", className), ...props }) });
   }
 );
 FormItem.displayName = "FormItem";
 var FormLabel = React24.forwardRef(({ className, ...props }, ref) => {
   const { error, formItemId } = useFormField();
-  return /* @__PURE__ */ jsx26(
+  return /* @__PURE__ */ jsx31(
     Label,
     {
       ref,
@@ -1357,8 +1519,8 @@ var FormLabel = React24.forwardRef(({ className, ...props }, ref) => {
 FormLabel.displayName = "FormLabel";
 var FormControl = React24.forwardRef(({ ...props }, ref) => {
   const { error, formItemId, formDescriptionId, formMessageId } = useFormField();
-  return /* @__PURE__ */ jsx26(
-    Slot2,
+  return /* @__PURE__ */ jsx31(
+    Slot3,
     {
       ref,
       id: formItemId,
@@ -1371,7 +1533,7 @@ var FormControl = React24.forwardRef(({ ...props }, ref) => {
 FormControl.displayName = "FormControl";
 var FormDescription = React24.forwardRef(({ className, ...props }, ref) => {
   const { formDescriptionId } = useFormField();
-  return /* @__PURE__ */ jsx26(
+  return /* @__PURE__ */ jsx31(
     "p",
     {
       ref,
@@ -1386,7 +1548,7 @@ var FormMessage = React24.forwardRef(({ className, children, ...props }, ref) =>
   const { error, formMessageId } = useFormField();
   const body = error?.message ? String(error.message) : children;
   if (!body) return null;
-  return /* @__PURE__ */ jsx26(
+  return /* @__PURE__ */ jsx31(
     "p",
     {
       ref,
@@ -1400,10 +1562,10 @@ var FormMessage = React24.forwardRef(({ className, children, ...props }, ref) =>
 FormMessage.displayName = "FormMessage";
 
 // src/components/alert/alert.tsx
-import { cva as cva5 } from "class-variance-authority";
+import { cva as cva10 } from "class-variance-authority";
 import * as React25 from "react";
-import { jsx as jsx27 } from "react/jsx-runtime";
-var alertVariants = cva5(
+import { jsx as jsx32 } from "react/jsx-runtime";
+var alertVariants = cva10(
   [
     "relative w-full rounded-lg border px-[var(--space-4,1rem)] py-[var(--space-3,0.75rem)] text-sm",
     "transition-all duration-[var(--duration-normal,200ms)] ease-out",
@@ -1420,7 +1582,7 @@ var alertVariants = cva5(
     defaultVariants: { variant: "default" }
   }
 );
-var Alert = React25.forwardRef(({ className, variant, ...props }, ref) => /* @__PURE__ */ jsx27(
+var Alert = React25.forwardRef(({ className, variant, ...props }, ref) => /* @__PURE__ */ jsx32(
   "div",
   {
     ref,
@@ -1430,7 +1592,7 @@ var Alert = React25.forwardRef(({ className, variant, ...props }, ref) => /* @__
   }
 ));
 Alert.displayName = "Alert";
-var AlertTitle = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx27(
+var AlertTitle = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx32(
   "h5",
   {
     ref,
@@ -1440,15 +1602,15 @@ var AlertTitle = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE
 ));
 AlertTitle.displayName = "AlertTitle";
 var AlertDescription = React25.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx27("div", { ref, className: cn("text-sm [&_p]:leading-relaxed", className), ...props })
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx32("div", { ref, className: cn("text-sm [&_p]:leading-relaxed", className), ...props })
 );
 AlertDescription.displayName = "AlertDescription";
 
 // src/components/sonner/sonner.tsx
 import { Toaster as SonnerToaster, toast } from "sonner";
-import { jsx as jsx28 } from "react/jsx-runtime";
+import { jsx as jsx33 } from "react/jsx-runtime";
 function Toaster({ ...props }) {
-  return /* @__PURE__ */ jsx28(
+  return /* @__PURE__ */ jsx33(
     SonnerToaster,
     {
       theme: "system",
@@ -1475,10 +1637,10 @@ var CollapsibleContent2 = CollapsiblePrimitive.CollapsibleContent;
 // src/components/hover-card/hover-card.tsx
 import * as HoverCardPrimitive from "@radix-ui/react-hover-card";
 import * as React26 from "react";
-import { jsx as jsx29 } from "react/jsx-runtime";
+import { jsx as jsx34 } from "react/jsx-runtime";
 var HoverCard = HoverCardPrimitive.Root;
 var HoverCardTrigger = HoverCardPrimitive.Trigger;
-var HoverCardContent = React26.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx29(HoverCardPrimitive.Portal, { children: /* @__PURE__ */ jsx29(
+var HoverCardContent = React26.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx34(HoverCardPrimitive.Portal, { children: /* @__PURE__ */ jsx34(
   HoverCardPrimitive.Content,
   {
     ref,
@@ -1500,13 +1662,13 @@ HoverCardContent.displayName = "HoverCardContent";
 // src/components/context-menu/context-menu.tsx
 import * as ContextMenuPrimitive from "@radix-ui/react-context-menu";
 import * as React27 from "react";
-import { jsx as jsx30, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx35, jsxs as jsxs10 } from "react/jsx-runtime";
 var ContextMenu = ContextMenuPrimitive.Root;
 var ContextMenuTrigger = ContextMenuPrimitive.Trigger;
 var ContextMenuGroup = ContextMenuPrimitive.Group;
 var ContextMenuPortal = ContextMenuPrimitive.Portal;
 var ContextMenuRadioGroup = ContextMenuPrimitive.RadioGroup;
-var ContextMenuContent = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx30(ContextMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx30(
+var ContextMenuContent = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx35(ContextMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx35(
   ContextMenuPrimitive.Content,
   {
     ref,
@@ -1521,7 +1683,7 @@ var ContextMenuContent = React27.forwardRef(({ className, ...props }, ref) => /*
   }
 ) }));
 ContextMenuContent.displayName = "ContextMenuContent";
-var ContextMenuItem = React27.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx30(
+var ContextMenuItem = React27.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx35(
   ContextMenuPrimitive.Item,
   {
     ref,
@@ -1551,7 +1713,7 @@ var ContextMenuCheckboxItem = React27.forwardRef(({ className, children, checked
     checked,
     ...props,
     children: [
-      /* @__PURE__ */ jsx30("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx30(ContextMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx30(
+      /* @__PURE__ */ jsx35("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx35(ContextMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx35(
         "svg",
         {
           xmlns: "http://www.w3.org/2000/svg",
@@ -1563,7 +1725,7 @@ var ContextMenuCheckboxItem = React27.forwardRef(({ className, children, checked
           strokeLinejoin: "round",
           className: "h-4 w-4",
           "aria-hidden": "true",
-          children: /* @__PURE__ */ jsx30("polyline", { points: "20 6 9 17 4 12" })
+          children: /* @__PURE__ */ jsx35("polyline", { points: "20 6 9 17 4 12" })
         }
       ) }) }),
       children
@@ -1584,13 +1746,13 @@ var ContextMenuRadioItem = React27.forwardRef(({ className, children, ...props }
     ),
     ...props,
     children: [
-      /* @__PURE__ */ jsx30("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx30(ContextMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx30("svg", { viewBox: "0 0 24 24", className: "h-2 w-2 fill-current", "aria-hidden": "true", children: /* @__PURE__ */ jsx30("circle", { cx: "12", cy: "12", r: "10" }) }) }) }),
+      /* @__PURE__ */ jsx35("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx35(ContextMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx35("svg", { viewBox: "0 0 24 24", className: "h-2 w-2 fill-current", "aria-hidden": "true", children: /* @__PURE__ */ jsx35("circle", { cx: "12", cy: "12", r: "10" }) }) }) }),
       children
     ]
   }
 ));
 ContextMenuRadioItem.displayName = "ContextMenuRadioItem";
-var ContextMenuLabel = React27.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx30(
+var ContextMenuLabel = React27.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx35(
   ContextMenuPrimitive.Label,
   {
     ref,
@@ -1599,7 +1761,7 @@ var ContextMenuLabel = React27.forwardRef(({ className, inset, ...props }, ref)
   }
 ));
 ContextMenuLabel.displayName = "ContextMenuLabel";
-var ContextMenuSeparator = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx30(
+var ContextMenuSeparator = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx35(
   ContextMenuPrimitive.Separator,
   {
     ref,
@@ -1609,7 +1771,7 @@ var ContextMenuSeparator = React27.forwardRef(({ className, ...props }, ref) =>
 ));
 ContextMenuSeparator.displayName = "ContextMenuSeparator";
 function ContextMenuShortcut({ className, ...props }) {
-  return /* @__PURE__ */ jsx30(
+  return /* @__PURE__ */ jsx35(
     "span",
     {
       className: cn("ml-auto text-xs tracking-widest text-muted-foreground", className),
@@ -1621,8 +1783,8 @@ function ContextMenuShortcut({ className, ...props }) {
 // src/components/menubar/menubar.tsx
 import * as MenubarPrimitive from "@radix-ui/react-menubar";
 import * as React28 from "react";
-import { jsx as jsx31 } from "react/jsx-runtime";
-var Menubar = React28.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx31(
+import { jsx as jsx36 } from "react/jsx-runtime";
+var Menubar = React28.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx36(
   MenubarPrimitive.Root,
   {
     ref,
@@ -1638,7 +1800,7 @@ var MenubarMenu = MenubarPrimitive.Menu;
 var MenubarGroup = MenubarPrimitive.Group;
 var MenubarPortal = MenubarPrimitive.Portal;
 var MenubarRadioGroup = MenubarPrimitive.RadioGroup;
-var MenubarTrigger = React28.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx31(
+var MenubarTrigger = React28.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx36(
   MenubarPrimitive.Trigger,
   {
     ref,
@@ -1653,7 +1815,7 @@ var MenubarTrigger = React28.forwardRef(({ className, ...props }, ref) => /* @__
   }
 ));
 MenubarTrigger.displayName = "MenubarTrigger";
-var MenubarContent = React28.forwardRef(({ className, align = "start", alignOffset = -4, sideOffset = 8, ...props }, ref) => /* @__PURE__ */ jsx31(MenubarPrimitive.Portal, { children: /* @__PURE__ */ jsx31(
+var MenubarContent = React28.forwardRef(({ className, align = "start", alignOffset = -4, sideOffset = 8, ...props }, ref) => /* @__PURE__ */ jsx36(MenubarPrimitive.Portal, { children: /* @__PURE__ */ jsx36(
   MenubarPrimitive.Content,
   {
     ref,
@@ -1671,7 +1833,7 @@ var MenubarContent = React28.forwardRef(({ className, align = "start", alignOffs
   }
 ) }));
 MenubarContent.displayName = "MenubarContent";
-var MenubarItem = React28.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx31(
+var MenubarItem = React28.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx36(
   MenubarPrimitive.Item,
   {
     ref,
@@ -1687,7 +1849,7 @@ var MenubarItem = React28.forwardRef(({ className, inset, ...props }, ref) => /*
   }
 ));
 MenubarItem.displayName = "MenubarItem";
-var MenubarLabel = React28.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx31(
+var MenubarLabel = React28.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx36(
   MenubarPrimitive.Label,
   {
     ref,
@@ -1696,7 +1858,7 @@ var MenubarLabel = React28.forwardRef(({ className, inset, ...props }, ref) => /
   }
 ));
 MenubarLabel.displayName = "MenubarLabel";
-var MenubarSeparator = React28.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx31(
+var MenubarSeparator = React28.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx36(
   MenubarPrimitive.Separator,
   {
     ref,
@@ -1706,7 +1868,7 @@ var MenubarSeparator = React28.forwardRef(({ className, ...props }, ref) => /* @
 ));
 MenubarSeparator.displayName = "MenubarSeparator";
 function MenubarShortcut({ className, ...props }) {
-  return /* @__PURE__ */ jsx31(
+  return /* @__PURE__ */ jsx36(
     "span",
     {
       className: cn("ml-auto text-xs tracking-widest text-muted-foreground", className),
@@ -1717,9 +1879,9 @@ function MenubarShortcut({ className, ...props }) {
 
 // src/components/navigation-menu/navigation-menu.tsx
 import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu";
-import { cva as cva6 } from "class-variance-authority";
+import { cva as cva11 } from "class-variance-authority";
 import * as React29 from "react";
-import { jsx as jsx32, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx37, jsxs as jsxs11 } from "react/jsx-runtime";
 var NavigationMenu = React29.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs11(
   NavigationMenuPrimitive.Root,
   {
@@ -1728,12 +1890,12 @@ var NavigationMenu = React29.forwardRef(({ className, children, ...props }, ref)
     ...props,
     children: [
       children,
-      /* @__PURE__ */ jsx32(NavigationMenuViewport, {})
+      /* @__PURE__ */ jsx37(NavigationMenuViewport, {})
     ]
   }
 ));
 NavigationMenu.displayName = "NavigationMenu";
-var NavigationMenuList = React29.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx32(
+var NavigationMenuList = React29.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx37(
   NavigationMenuPrimitive.List,
   {
     ref,
@@ -1743,7 +1905,7 @@ var NavigationMenuList = React29.forwardRef(({ className, ...props }, ref) => /*
 ));
 NavigationMenuList.displayName = "NavigationMenuList";
 var NavigationMenuItem = NavigationMenuPrimitive.Item;
-var navigationMenuTriggerStyle = cva6(
+var navigationMenuTriggerStyle = cva11(
   "group inline-flex h-[var(--control-height-md,2.5rem)] w-max items-center justify-center rounded-md bg-background px-[var(--space-4,1rem)] py-[var(--space-2,0.5rem)] text-sm font-medium transition-all duration-[var(--duration-normal,200ms)] ease-out hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-none disabled:pointer-events-none disabled:opacity-50 data-[active]:bg-accent/50 data-[state=open]:bg-accent/50"
 );
 var NavigationMenuTrigger = React29.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs11(
@@ -1754,7 +1916,7 @@ var NavigationMenuTrigger = React29.forwardRef(({ className, children, ...props
     ...props,
     children: [
       children,
-      /* @__PURE__ */ jsx32(
+      /* @__PURE__ */ jsx37(
         "svg",
         {
           xmlns: "http://www.w3.org/2000/svg",
@@ -1766,14 +1928,14 @@ var NavigationMenuTrigger = React29.forwardRef(({ className, children, ...props
           strokeLinejoin: "round",
           className: "relative top-[1px] ml-[var(--space-1,0.25rem)] h-3 w-3 transition duration-[var(--duration-normal,200ms)] group-data-[state=open]:rotate-180",
           "aria-hidden": "true",
-          children: /* @__PURE__ */ jsx32("polyline", { points: "6 9 12 15 18 9" })
+          children: /* @__PURE__ */ jsx37("polyline", { points: "6 9 12 15 18 9" })
         }
       )
     ]
   }
 ));
 NavigationMenuTrigger.displayName = "NavigationMenuTrigger";
-var NavigationMenuContent = React29.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx32(
+var NavigationMenuContent = React29.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx37(
   NavigationMenuPrimitive.Content,
   {
     ref,
@@ -1786,7 +1948,7 @@ var NavigationMenuContent = React29.forwardRef(({ className, ...props }, ref) =>
 ));
 NavigationMenuContent.displayName = "NavigationMenuContent";
 var NavigationMenuLink = NavigationMenuPrimitive.Link;
-var NavigationMenuViewport = React29.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx32("div", { className: "absolute left-0 top-full flex justify-center", children: /* @__PURE__ */ jsx32(
+var NavigationMenuViewport = React29.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx37("div", { className: "absolute left-0 top-full flex justify-center", children: /* @__PURE__ */ jsx37(
   NavigationMenuPrimitive.Viewport,
   {
     className: cn(
@@ -1800,7 +1962,7 @@ var NavigationMenuViewport = React29.forwardRef(({ className, ...props }, ref) =
   }
 ) }));
 NavigationMenuViewport.displayName = "NavigationMenuViewport";
-var NavigationMenuIndicator = React29.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx32(
+var NavigationMenuIndicator = React29.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx37(
   NavigationMenuPrimitive.Indicator,
   {
     ref,
@@ -1809,21 +1971,21 @@ var NavigationMenuIndicator = React29.forwardRef(({ className, ...props }, ref)
       className
     ),
     ...props,
-    children: /* @__PURE__ */ jsx32("div", { className: "relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm bg-border shadow-md" })
+    children: /* @__PURE__ */ jsx37("div", { className: "relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm bg-border shadow-md" })
   }
 ));
 NavigationMenuIndicator.displayName = "NavigationMenuIndicator";
 
 // src/components/breadcrumb/breadcrumb.tsx
-import { Slot as Slot3 } from "@radix-ui/react-slot";
+import { Slot as Slot4 } from "@radix-ui/react-slot";
 import * as React30 from "react";
-import { jsx as jsx33, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx38, jsxs as jsxs12 } from "react/jsx-runtime";
 var Breadcrumb = React30.forwardRef(
-  (props, ref) => /* @__PURE__ */ jsx33("nav", { ref, "aria-label": "breadcrumb", ...props })
+  (props, ref) => /* @__PURE__ */ jsx38("nav", { ref, "aria-label": "breadcrumb", ...props })
 );
 Breadcrumb.displayName = "Breadcrumb";
 var BreadcrumbList = React30.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx33(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx38(
     "ol",
     {
       ref,
@@ -1837,7 +1999,7 @@ var BreadcrumbList = React30.forwardRef(
 );
 BreadcrumbList.displayName = "BreadcrumbList";
 var BreadcrumbItem = React30.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx33(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx38(
     "li",
     {
       ref,
@@ -1848,8 +2010,8 @@ var BreadcrumbItem = React30.forwardRef(
 );
 BreadcrumbItem.displayName = "BreadcrumbItem";
 var BreadcrumbLink = React30.forwardRef(({ asChild, className, ...props }, ref) => {
-  const Comp = asChild ? Slot3 : "a";
-  return /* @__PURE__ */ jsx33(
+  const Comp = asChild ? Slot4 : "a";
+  return /* @__PURE__ */ jsx38(
     Comp,
     {
       ref,
@@ -1860,7 +2022,7 @@ var BreadcrumbLink = React30.forwardRef(({ asChild, className, ...props }, ref)
 });
 BreadcrumbLink.displayName = "BreadcrumbLink";
 var BreadcrumbPage = React30.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx33(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx38(
     "span",
     {
       ref,
@@ -1878,7 +2040,7 @@ function BreadcrumbSeparator({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx33("li", { role: "presentation", "aria-hidden": "true", className: cn("[&>svg]:h-3.5 [&>svg]:w-3.5", className), ...props, children: children ?? /* @__PURE__ */ jsx33(
+  return /* @__PURE__ */ jsx38("li", { role: "presentation", "aria-hidden": "true", className: cn("[&>svg]:h-3.5 [&>svg]:w-3.5", className), ...props, children: children ?? /* @__PURE__ */ jsx38(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
@@ -1889,7 +2051,7 @@ function BreadcrumbSeparator({
       strokeLinecap: "round",
       strokeLinejoin: "round",
       "aria-hidden": "true",
-      children: /* @__PURE__ */ jsx33("polyline", { points: "9 18 15 12 9 6" })
+      children: /* @__PURE__ */ jsx38("polyline", { points: "9 18 15 12 9 6" })
     }
   ) });
 }
@@ -1913,13 +2075,13 @@ function BreadcrumbEllipsis({ className, ...props }) {
             className: "h-4 w-4",
             "aria-hidden": "true",
             children: [
-              /* @__PURE__ */ jsx33("circle", { cx: "12", cy: "12", r: "1" }),
-              /* @__PURE__ */ jsx33("circle", { cx: "19", cy: "12", r: "1" }),
-              /* @__PURE__ */ jsx33("circle", { cx: "5", cy: "12", r: "1" })
+              /* @__PURE__ */ jsx38("circle", { cx: "12", cy: "12", r: "1" }),
+              /* @__PURE__ */ jsx38("circle", { cx: "19", cy: "12", r: "1" }),
+              /* @__PURE__ */ jsx38("circle", { cx: "5", cy: "12", r: "1" })
             ]
           }
         ),
-        /* @__PURE__ */ jsx33("span", { className: "sr-only", children: "More pages" })
+        /* @__PURE__ */ jsx38("span", { className: "sr-only", children: "More pages" })
       ]
     }
   );
@@ -1927,9 +2089,9 @@ function BreadcrumbEllipsis({ className, ...props }) {
 
 // src/components/table/table.tsx
 import * as React31 from "react";
-import { jsx as jsx34 } from "react/jsx-runtime";
+import { jsx as jsx39 } from "react/jsx-runtime";
 var Table = React31.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx34("div", { className: "relative w-full overflow-auto", children: /* @__PURE__ */ jsx34(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx39("div", { className: "relative w-full overflow-auto", children: /* @__PURE__ */ jsx39(
     "table",
     {
       ref,
@@ -1939,11 +2101,11 @@ var Table = React31.forwardRef(
   ) })
 );
 Table.displayName = "Table";
-var TableHeader = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34("thead", { ref, className: cn("[&_tr]:border-b", className), ...props }));
+var TableHeader = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx39("thead", { ref, className: cn("[&_tr]:border-b", className), ...props }));
 TableHeader.displayName = "TableHeader";
-var TableBody = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34("tbody", { ref, className: cn("[&_tr:last-child]:border-0", className), ...props }));
+var TableBody = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx39("tbody", { ref, className: cn("[&_tr:last-child]:border-0", className), ...props }));
 TableBody.displayName = "TableBody";
-var TableFooter = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34(
+var TableFooter = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx39(
   "tfoot",
   {
     ref,
@@ -1955,7 +2117,7 @@ var TableFooter = React31.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 TableFooter.displayName = "TableFooter";
-var TableRow = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34(
+var TableRow = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx39(
   "tr",
   {
     ref,
@@ -1967,7 +2129,7 @@ var TableRow = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__
   }
 ));
 TableRow.displayName = "TableRow";
-var TableHead = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34(
+var TableHead = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx39(
   "th",
   {
     ref,
@@ -1979,7 +2141,7 @@ var TableHead = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE_
   }
 ));
 TableHead.displayName = "TableHead";
-var TableCell = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34(
+var TableCell = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx39(
   "td",
   {
     ref,
@@ -1988,7 +2150,7 @@ var TableCell = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE_
   }
 ));
 TableCell.displayName = "TableCell";
-var TableCaption = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34(
+var TableCaption = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx39(
   "caption",
   {
     ref,
@@ -2007,7 +2169,7 @@ import {
   getCoreRowModel,
   useReactTable
 } from "@tanstack/react-table";
-import { jsx as jsx35, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx40, jsxs as jsxs13 } from "react/jsx-runtime";
 function DataTable({
   columns,
   data,
@@ -2019,18 +2181,18 @@ function DataTable({
     columns,
     getCoreRowModel: getCoreRowModel()
   });
-  return /* @__PURE__ */ jsx35("div", { className: "rounded-md border", children: /* @__PURE__ */ jsxs13(Table, { "aria-label": ariaLabel, children: [
-    caption ? /* @__PURE__ */ jsx35(TableCaption, { children: caption }) : null,
-    /* @__PURE__ */ jsx35(TableHeader, { children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx35(TableRow, { children: headerGroup.headers.map((header) => /* @__PURE__ */ jsx35(TableHead, { children: header.isPlaceholder ? null : flexRender(header.column.columnDef.header, header.getContext()) }, header.id)) }, headerGroup.id)) }),
-    /* @__PURE__ */ jsx35(TableBody, { children: table.getRowModel().rows?.length ? table.getRowModel().rows.map((row) => /* @__PURE__ */ jsx35(TableRow, { "data-state": row.getIsSelected() && "selected", children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx35(TableCell, { children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id)) }, row.id)) : /* @__PURE__ */ jsx35(TableRow, { children: /* @__PURE__ */ jsx35(TableCell, { colSpan: columns.length, className: "h-24 text-center", children: "No results." }) }) })
+  return /* @__PURE__ */ jsx40("div", { className: "rounded-md border", children: /* @__PURE__ */ jsxs13(Table, { "aria-label": ariaLabel, children: [
+    caption ? /* @__PURE__ */ jsx40(TableCaption, { children: caption }) : null,
+    /* @__PURE__ */ jsx40(TableHeader, { children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx40(TableRow, { children: headerGroup.headers.map((header) => /* @__PURE__ */ jsx40(TableHead, { children: header.isPlaceholder ? null : flexRender(header.column.columnDef.header, header.getContext()) }, header.id)) }, headerGroup.id)) }),
+    /* @__PURE__ */ jsx40(TableBody, { children: table.getRowModel().rows?.length ? table.getRowModel().rows.map((row) => /* @__PURE__ */ jsx40(TableRow, { "data-state": row.getIsSelected() && "selected", children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx40(TableCell, { children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id)) }, row.id)) : /* @__PURE__ */ jsx40(TableRow, { children: /* @__PURE__ */ jsx40(TableCell, { colSpan: columns.length, className: "h-24 text-center", children: "No results." }) }) })
   ] }) });
 }
 
 // src/components/pagination/pagination.tsx
 import * as React32 from "react";
-import { jsx as jsx36, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx41, jsxs as jsxs14 } from "react/jsx-runtime";
 function Pagination({ className, ...props }) {
-  return /* @__PURE__ */ jsx36(
+  return /* @__PURE__ */ jsx41(
     "nav",
     {
       role: "navigation",
@@ -2041,7 +2203,7 @@ function Pagination({ className, ...props }) {
   );
 }
 var PaginationContent = React32.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx36(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx41(
     "ul",
     {
       ref,
@@ -2052,7 +2214,7 @@ var PaginationContent = React32.forwardRef(
 );
 PaginationContent.displayName = "PaginationContent";
 var PaginationItem = React32.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx36("li", { ref, className, ...props })
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx41("li", { ref, className, ...props })
 );
 PaginationItem.displayName = "PaginationItem";
 function PaginationLink({
@@ -2061,7 +2223,7 @@ function PaginationLink({
   size = "icon",
   ...props
 }) {
-  return /* @__PURE__ */ jsx36(
+  return /* @__PURE__ */ jsx41(
     "a",
     {
       "aria-current": isActive ? "page" : void 0,
@@ -2082,7 +2244,7 @@ function PaginationPrevious({ className, ...props }) {
       className: cn("gap-1 pl-2.5", className),
       ...props,
       children: [
-        /* @__PURE__ */ jsx36(
+        /* @__PURE__ */ jsx41(
           "svg",
           {
             xmlns: "http://www.w3.org/2000/svg",
@@ -2094,10 +2256,10 @@ function PaginationPrevious({ className, ...props }) {
             strokeLinejoin: "round",
             className: "h-4 w-4",
             "aria-hidden": "true",
-            children: /* @__PURE__ */ jsx36("polyline", { points: "15 18 9 12 15 6" })
+            children: /* @__PURE__ */ jsx41("polyline", { points: "15 18 9 12 15 6" })
           }
         ),
-        /* @__PURE__ */ jsx36("span", { children: "Previous" })
+        /* @__PURE__ */ jsx41("span", { children: "Previous" })
       ]
     }
   );
@@ -2111,8 +2273,8 @@ function PaginationNext({ className, ...props }) {
       className: cn("gap-1 pr-2.5", className),
       ...props,
       children: [
-        /* @__PURE__ */ jsx36("span", { children: "Next" }),
-        /* @__PURE__ */ jsx36(
+        /* @__PURE__ */ jsx41("span", { children: "Next" }),
+        /* @__PURE__ */ jsx41(
           "svg",
           {
             xmlns: "http://www.w3.org/2000/svg",
@@ -2124,7 +2286,7 @@ function PaginationNext({ className, ...props }) {
             strokeLinejoin: "round",
             className: "h-4 w-4",
             "aria-hidden": "true",
-            children: /* @__PURE__ */ jsx36("polyline", { points: "9 18 15 12 9 6" })
+            children: /* @__PURE__ */ jsx41("polyline", { points: "9 18 15 12 9 6" })
           }
         )
       ]
@@ -2151,13 +2313,13 @@ function PaginationEllipsis({ className, ...props }) {
             className: "h-4 w-4",
             "aria-hidden": "true",
             children: [
-              /* @__PURE__ */ jsx36("circle", { cx: "12", cy: "12", r: "1" }),
-              /* @__PURE__ */ jsx36("circle", { cx: "19", cy: "12", r: "1" }),
-              /* @__PURE__ */ jsx36("circle", { cx: "5", cy: "12", r: "1" })
+              /* @__PURE__ */ jsx41("circle", { cx: "12", cy: "12", r: "1" }),
+              /* @__PURE__ */ jsx41("circle", { cx: "19", cy: "12", r: "1" }),
+              /* @__PURE__ */ jsx41("circle", { cx: "5", cy: "12", r: "1" })
             ]
           }
         ),
-        /* @__PURE__ */ jsx36("span", { className: "sr-only", children: "More pages" })
+        /* @__PURE__ */ jsx41("span", { className: "sr-only", children: "More pages" })
       ]
     }
   );
@@ -2165,14 +2327,14 @@ function PaginationEllipsis({ className, ...props }) {
 
 // src/components/calendar/calendar.tsx
 import { DayPicker } from "react-day-picker";
-import { jsx as jsx37 } from "react/jsx-runtime";
+import { jsx as jsx42 } from "react/jsx-runtime";
 function Calendar({
   className,
   classNames,
   showOutsideDays = true,
   ...props
 }) {
-  return /* @__PURE__ */ jsx37(
+  return /* @__PURE__ */ jsx42(
     DayPicker,
     {
       showOutsideDays,
@@ -2208,7 +2370,7 @@ function Calendar({
       components: {
         Chevron: ({ orientation, className: chevronClassName }) => {
           const rotation = orientation === "left" ? "rotate-90" : orientation === "right" ? "-rotate-90" : orientation === "up" ? "rotate-180" : "";
-          return /* @__PURE__ */ jsx37(
+          return /* @__PURE__ */ jsx42(
             "svg",
             {
               xmlns: "http://www.w3.org/2000/svg",
@@ -2220,7 +2382,7 @@ function Calendar({
               strokeLinejoin: "round",
               className: cn("h-4 w-4", rotation, chevronClassName),
               "aria-hidden": "true",
-              children: /* @__PURE__ */ jsx37("polyline", { points: "6 9 12 15 18 9" })
+              children: /* @__PURE__ */ jsx42("polyline", { points: "6 9 12 15 18 9" })
             }
           );
         }
@@ -2234,7 +2396,7 @@ Calendar.displayName = "Calendar";
 // src/components/date-picker/date-picker.tsx
 import { format } from "date-fns";
 import * as React33 from "react";
-import { jsx as jsx38, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx43, jsxs as jsxs15 } from "react/jsx-runtime";
 function DatePicker({
   value,
   onChange,
@@ -2246,7 +2408,7 @@ function DatePicker({
 }) {
   const [open, setOpen] = React33.useState(false);
   return /* @__PURE__ */ jsxs15(Popover, { open, onOpenChange: setOpen, children: [
-    /* @__PURE__ */ jsx38(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs15(
+    /* @__PURE__ */ jsx43(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs15(
       "button",
       {
         type: "button",
@@ -2274,18 +2436,18 @@ function DatePicker({
               className: "h-4 w-4",
               "aria-hidden": "true",
               children: [
-                /* @__PURE__ */ jsx38("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2", ry: "2" }),
-                /* @__PURE__ */ jsx38("line", { x1: "16", y1: "2", x2: "16", y2: "6" }),
-                /* @__PURE__ */ jsx38("line", { x1: "8", y1: "2", x2: "8", y2: "6" }),
-                /* @__PURE__ */ jsx38("line", { x1: "3", y1: "10", x2: "21", y2: "10" })
+                /* @__PURE__ */ jsx43("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2", ry: "2" }),
+                /* @__PURE__ */ jsx43("line", { x1: "16", y1: "2", x2: "16", y2: "6" }),
+                /* @__PURE__ */ jsx43("line", { x1: "8", y1: "2", x2: "8", y2: "6" }),
+                /* @__PURE__ */ jsx43("line", { x1: "3", y1: "10", x2: "21", y2: "10" })
               ]
             }
           ),
-          /* @__PURE__ */ jsx38("span", { children: value ? format(value, dateFormat) : placeholder })
+          /* @__PURE__ */ jsx43("span", { children: value ? format(value, dateFormat) : placeholder })
         ]
       }
     ) }),
-    /* @__PURE__ */ jsx38(PopoverContent, { className: "w-auto p-0", align: "start", children: /* @__PURE__ */ jsx38(
+    /* @__PURE__ */ jsx43(PopoverContent, { className: "w-auto p-0", align: "start", children: /* @__PURE__ */ jsx43(
       Calendar,
       {
         mode: "single",
@@ -2304,9 +2466,9 @@ DatePicker.displayName = "DatePicker";
 // src/components/input-otp/input-otp.tsx
 import { OTPInput, OTPInputContext } from "input-otp";
 import * as React34 from "react";
-import { jsx as jsx39, jsxs as jsxs16 } from "react/jsx-runtime";
+import { jsx as jsx44, jsxs as jsxs16 } from "react/jsx-runtime";
 var InputOTP = React34.forwardRef(
-  ({ className, containerClassName, ...props }, ref) => /* @__PURE__ */ jsx39(
+  ({ className, containerClassName, ...props }, ref) => /* @__PURE__ */ jsx44(
     OTPInput,
     {
       ref,
@@ -2320,7 +2482,7 @@ var InputOTP = React34.forwardRef(
   )
 );
 InputOTP.displayName = "InputOTP";
-var InputOTPGroup = React34.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx39("div", { ref, className: cn("flex items-center", className), ...props }));
+var InputOTPGroup = React34.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx44("div", { ref, className: cn("flex items-center", className), ...props }));
 InputOTPGroup.displayName = "InputOTPGroup";
 var InputOTPSlot = React34.forwardRef(
   ({ index, className, ...props }, ref) => {
@@ -2342,14 +2504,14 @@ var InputOTPSlot = React34.forwardRef(
         ...props,
         children: [
           char,
-          hasFakeCaret && /* @__PURE__ */ jsx39("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ jsx39("div", { className: "h-4 w-px animate-pulse bg-foreground duration-1000" }) })
+          hasFakeCaret && /* @__PURE__ */ jsx44("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ jsx44("div", { className: "h-4 w-px animate-pulse bg-foreground duration-1000" }) })
         ]
       }
     );
   }
 );
 InputOTPSlot.displayName = "InputOTPSlot";
-var InputOTPSeparator = React34.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsx39("div", { ref, role: "separator", ...props, children: /* @__PURE__ */ jsx39(
+var InputOTPSeparator = React34.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsx44("div", { ref, role: "separator", ...props, children: /* @__PURE__ */ jsx44(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -2357,7 +2519,7 @@ var InputOTPSeparator = React34.forwardRef(({ ...props }, ref) => /* @__PURE__ *
     fill: "currentColor",
     className: "h-2 w-2 text-muted-foreground",
     "aria-hidden": "true",
-    children: /* @__PURE__ */ jsx39("circle", { cx: "12", cy: "12", r: "6" })
+    children: /* @__PURE__ */ jsx44("circle", { cx: "12", cy: "12", r: "6" })
   }
 ) }));
 InputOTPSeparator.displayName = "InputOTPSeparator";
@@ -2365,8 +2527,8 @@ InputOTPSeparator.displayName = "InputOTPSeparator";
 // src/components/command/command.tsx
 import { Command as CommandPrimitive } from "cmdk";
 import * as React35 from "react";
-import { jsx as jsx40, jsxs as jsxs17 } from "react/jsx-runtime";
-var Command = React35.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx40(
+import { jsx as jsx45, jsxs as jsxs17 } from "react/jsx-runtime";
+var Command = React35.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx45(
   CommandPrimitive,
   {
     ref,
@@ -2386,10 +2548,10 @@ function CommandDialog({
 }) {
   return /* @__PURE__ */ jsxs17(Dialog, { ...props, children: [
     /* @__PURE__ */ jsxs17(DialogHeader, { className: "sr-only", children: [
-      /* @__PURE__ */ jsx40(DialogTitle, { children: title }),
-      /* @__PURE__ */ jsx40(DialogDescription, { children: description })
+      /* @__PURE__ */ jsx45(DialogTitle, { children: title }),
+      /* @__PURE__ */ jsx45(DialogDescription, { children: description })
     ] }),
-    /* @__PURE__ */ jsx40(DialogContent, { className: "overflow-hidden p-0", scrollable: false, children: /* @__PURE__ */ jsx40(Command, { className: "[&_[cmdk-group-heading]]:px-[var(--space-2,0.5rem)] [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-group]]:px-[var(--space-2,0.5rem)] [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-[var(--space-2,0.5rem)] [&_[cmdk-item]]:py-[var(--space-3,0.75rem)] [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5", children }) })
+    /* @__PURE__ */ jsx45(DialogContent, { className: "overflow-hidden p-0", scrollable: false, children: /* @__PURE__ */ jsx45(Command, { className: "[&_[cmdk-group-heading]]:px-[var(--space-2,0.5rem)] [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-group]]:px-[var(--space-2,0.5rem)] [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-[var(--space-2,0.5rem)] [&_[cmdk-item]]:py-[var(--space-3,0.75rem)] [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5", children }) })
   ] });
 }
 var CommandInput = React35.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs17("div", { className: "flex items-center border-b px-[var(--space-3,0.75rem)]", "cmdk-input-wrapper": "", children: [
@@ -2406,12 +2568,12 @@ var CommandInput = React35.forwardRef(({ className, ...props }, ref) => /* @__PU
       className: "mr-[var(--space-2,0.5rem)] h-4 w-4 shrink-0 opacity-50",
       "aria-hidden": "true",
       children: [
-        /* @__PURE__ */ jsx40("circle", { cx: "11", cy: "11", r: "8" }),
-        /* @__PURE__ */ jsx40("line", { x1: "21", y1: "21", x2: "16.65", y2: "16.65" })
+        /* @__PURE__ */ jsx45("circle", { cx: "11", cy: "11", r: "8" }),
+        /* @__PURE__ */ jsx45("line", { x1: "21", y1: "21", x2: "16.65", y2: "16.65" })
       ]
     }
   ),
-  /* @__PURE__ */ jsx40(
+  /* @__PURE__ */ jsx45(
     CommandPrimitive.Input,
     {
       ref,
@@ -2424,7 +2586,7 @@ var CommandInput = React35.forwardRef(({ className, ...props }, ref) => /* @__PU
   )
 ] }));
 CommandInput.displayName = "CommandInput";
-var CommandList = React35.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx40(
+var CommandList = React35.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx45(
   CommandPrimitive.List,
   {
     ref,
@@ -2433,9 +2595,9 @@ var CommandList = React35.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 CommandList.displayName = "CommandList";
-var CommandEmpty = React35.forwardRef((props, ref) => /* @__PURE__ */ jsx40(CommandPrimitive.Empty, { ref, className: "py-[var(--space-6,1.5rem)] text-center text-sm", ...props }));
+var CommandEmpty = React35.forwardRef((props, ref) => /* @__PURE__ */ jsx45(CommandPrimitive.Empty, { ref, className: "py-[var(--space-6,1.5rem)] text-center text-sm", ...props }));
 CommandEmpty.displayName = "CommandEmpty";
-var CommandGroup = React35.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx40(
+var CommandGroup = React35.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx45(
   CommandPrimitive.Group,
   {
     ref,
@@ -2447,7 +2609,7 @@ var CommandGroup = React35.forwardRef(({ className, ...props }, ref) => /* @__PU
   }
 ));
 CommandGroup.displayName = "CommandGroup";
-var CommandSeparator = React35.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx40(
+var CommandSeparator = React35.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx45(
   "div",
   {
     ref,
@@ -2458,7 +2620,7 @@ var CommandSeparator = React35.forwardRef(({ className, ...props }, ref) => /* @
   }
 ));
 CommandSeparator.displayName = "CommandSeparator";
-var CommandItem = React35.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx40(
+var CommandItem = React35.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx45(
   CommandPrimitive.Item,
   {
     ref,
@@ -2474,7 +2636,7 @@ var CommandItem = React35.forwardRef(({ className, ...props }, ref) => /* @__PUR
 ));
 CommandItem.displayName = "CommandItem";
 function CommandShortcut({ className, ...props }) {
-  return /* @__PURE__ */ jsx40(
+  return /* @__PURE__ */ jsx45(
     "span",
     {
       className: cn(
@@ -2489,7 +2651,7 @@ CommandShortcut.displayName = "CommandShortcut";
 
 // src/components/combobox/combobox.tsx
 import * as React36 from "react";
-import { jsx as jsx41, jsxs as jsxs18 } from "react/jsx-runtime";
+import { jsx as jsx46, jsxs as jsxs18 } from "react/jsx-runtime";
 function Combobox({
   options,
   value,
@@ -2506,7 +2668,7 @@ function Combobox({
   const listboxId = React36.useId();
   const selected = options.find((o) => o.value === value);
   return /* @__PURE__ */ jsxs18(Popover, { open, onOpenChange: setOpen, children: [
-    /* @__PURE__ */ jsx41(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs18(
+    /* @__PURE__ */ jsx46(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs18(
       "button",
       {
         type: "button",
@@ -2526,8 +2688,8 @@ function Combobox({
           className
         ),
         children: [
-          /* @__PURE__ */ jsx41("span", { className: "truncate", children: selected ? selected.label : placeholder }),
-          /* @__PURE__ */ jsx41(
+          /* @__PURE__ */ jsx46("span", { className: "truncate", children: selected ? selected.label : placeholder }),
+          /* @__PURE__ */ jsx46(
             "svg",
             {
               xmlns: "http://www.w3.org/2000/svg",
@@ -2539,17 +2701,17 @@ function Combobox({
               strokeLinejoin: "round",
               className: "h-4 w-4 shrink-0 opacity-50",
               "aria-hidden": "true",
-              children: /* @__PURE__ */ jsx41("polyline", { points: "6 9 12 15 18 9" })
+              children: /* @__PURE__ */ jsx46("polyline", { points: "6 9 12 15 18 9" })
             }
           )
         ]
       }
     ) }),
-    /* @__PURE__ */ jsx41(PopoverContent, { className: "w-[240px] p-0", align: "start", children: /* @__PURE__ */ jsxs18(Command, { children: [
-      /* @__PURE__ */ jsx41(CommandInput, { placeholder: searchPlaceholder }),
+    /* @__PURE__ */ jsx46(PopoverContent, { className: "w-[240px] p-0", align: "start", children: /* @__PURE__ */ jsxs18(Command, { children: [
+      /* @__PURE__ */ jsx46(CommandInput, { placeholder: searchPlaceholder }),
       /* @__PURE__ */ jsxs18(CommandList, { id: listboxId, children: [
-        /* @__PURE__ */ jsx41(CommandEmpty, { children: emptyText }),
-        /* @__PURE__ */ jsx41(CommandGroup, { children: options.map((option) => /* @__PURE__ */ jsxs18(
+        /* @__PURE__ */ jsx46(CommandEmpty, { children: emptyText }),
+        /* @__PURE__ */ jsx46(CommandGroup, { children: options.map((option) => /* @__PURE__ */ jsxs18(
           CommandItem,
           {
             value: option.label,
@@ -2559,7 +2721,7 @@ function Combobox({
               setOpen(false);
             },
             children: [
-              /* @__PURE__ */ jsx41(
+              /* @__PURE__ */ jsx46(
                 "svg",
                 {
                   xmlns: "http://www.w3.org/2000/svg",
@@ -2574,7 +2736,7 @@ function Combobox({
                     value === option.value ? "opacity-100" : "opacity-0"
                   ),
                   "aria-hidden": "true",
-                  children: /* @__PURE__ */ jsx41("polyline", { points: "20 6 9 17 4 12" })
+                  children: /* @__PURE__ */ jsx46("polyline", { points: "20 6 9 17 4 12" })
                 }
               ),
               option.label
@@ -2590,14 +2752,14 @@ Combobox.displayName = "Combobox";
 
 // src/components/sheet/sheet.tsx
 import * as SheetPrimitive from "@radix-ui/react-dialog";
-import { cva as cva7 } from "class-variance-authority";
+import { cva as cva12 } from "class-variance-authority";
 import * as React37 from "react";
-import { jsx as jsx42, jsxs as jsxs19 } from "react/jsx-runtime";
+import { jsx as jsx47, jsxs as jsxs19 } from "react/jsx-runtime";
 var Sheet = SheetPrimitive.Root;
 var SheetTrigger = SheetPrimitive.Trigger;
 var SheetClose = SheetPrimitive.Close;
 var SheetPortal = SheetPrimitive.Portal;
-var SheetOverlay = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx42(
+var SheetOverlay = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx47(
   SheetPrimitive.Overlay,
   {
     ref,
@@ -2611,7 +2773,7 @@ var SheetOverlay = React37.forwardRef(({ className, ...props }, ref) => /* @__PU
   }
 ));
 SheetOverlay.displayName = "SheetOverlay";
-var sheetVariants = cva7(
+var sheetVariants = cva12(
   cn(
     "fixed z-50 gap-[var(--gap-md,1rem)] bg-background p-[var(--space-6,1.5rem)] shadow-lg",
     "transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out",
@@ -2632,7 +2794,7 @@ var sheetVariants = cva7(
   }
 );
 var SheetContent = React37.forwardRef(({ side = "right", className, children, ...props }, ref) => /* @__PURE__ */ jsxs19(SheetPortal, { children: [
-  /* @__PURE__ */ jsx42(SheetOverlay, {}),
+  /* @__PURE__ */ jsx47(SheetOverlay, {}),
   /* @__PURE__ */ jsxs19(
     SheetPrimitive.Content,
     {
@@ -2664,12 +2826,12 @@ var SheetContent = React37.forwardRef(({ side = "right", className, children, ..
                   className: "h-4 w-4",
                   "aria-hidden": "true",
                   children: [
-                    /* @__PURE__ */ jsx42("path", { d: "M18 6 6 18" }),
-                    /* @__PURE__ */ jsx42("path", { d: "m6 6 12 12" })
+                    /* @__PURE__ */ jsx47("path", { d: "M18 6 6 18" }),
+                    /* @__PURE__ */ jsx47("path", { d: "m6 6 12 12" })
                   ]
                 }
               ),
-              /* @__PURE__ */ jsx42("span", { className: "sr-only", children: "Close" })
+              /* @__PURE__ */ jsx47("span", { className: "sr-only", children: "Close" })
             ]
           }
         )
@@ -2679,7 +2841,7 @@ var SheetContent = React37.forwardRef(({ side = "right", className, children, ..
 ] }));
 SheetContent.displayName = "SheetContent";
 function SheetHeader({ className, ...props }) {
-  return /* @__PURE__ */ jsx42(
+  return /* @__PURE__ */ jsx47(
     "div",
     {
       className: cn("flex flex-col space-y-2 text-center sm:text-left", className),
@@ -2688,7 +2850,7 @@ function SheetHeader({ className, ...props }) {
   );
 }
 function SheetFooter({ className, ...props }) {
-  return /* @__PURE__ */ jsx42(
+  return /* @__PURE__ */ jsx47(
     "div",
     {
       className: cn(
@@ -2699,7 +2861,7 @@ function SheetFooter({ className, ...props }) {
     }
   );
 }
-var SheetTitle = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx42(
+var SheetTitle = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx47(
   SheetPrimitive.Title,
   {
     ref,
@@ -2708,7 +2870,7 @@ var SheetTitle = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE
   }
 ));
 SheetTitle.displayName = "SheetTitle";
-var SheetDescription = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx42(
+var SheetDescription = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx47(
   SheetPrimitive.Description,
   {
     ref,
@@ -2721,15 +2883,15 @@ SheetDescription.displayName = "SheetDescription";
 // src/components/drawer/drawer.tsx
 import * as React38 from "react";
 import { Drawer as DrawerPrimitive } from "vaul";
-import { jsx as jsx43, jsxs as jsxs20 } from "react/jsx-runtime";
+import { jsx as jsx48, jsxs as jsxs20 } from "react/jsx-runtime";
 function Drawer({ shouldScaleBackground = true, ...props }) {
-  return /* @__PURE__ */ jsx43(DrawerPrimitive.Root, { shouldScaleBackground, ...props });
+  return /* @__PURE__ */ jsx48(DrawerPrimitive.Root, { shouldScaleBackground, ...props });
 }
 Drawer.displayName = "Drawer";
 var DrawerTrigger = DrawerPrimitive.Trigger;
 var DrawerPortal = DrawerPrimitive.Portal;
 var DrawerClose = DrawerPrimitive.Close;
-var DrawerOverlay = React38.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx43(
+var DrawerOverlay = React38.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx48(
   DrawerPrimitive.Overlay,
   {
     ref,
@@ -2742,7 +2904,7 @@ var DrawerOverlay = React38.forwardRef(({ className, ...props }, ref) => /* @__P
 ));
 DrawerOverlay.displayName = "DrawerOverlay";
 var DrawerContent = React38.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs20(DrawerPortal, { children: [
-  /* @__PURE__ */ jsx43(DrawerOverlay, {}),
+  /* @__PURE__ */ jsx48(DrawerOverlay, {}),
   /* @__PURE__ */ jsxs20(
     DrawerPrimitive.Content,
     {
@@ -2753,7 +2915,7 @@ var DrawerContent = React38.forwardRef(({ className, children, ...props }, ref)
       ),
       ...props,
       children: [
-        /* @__PURE__ */ jsx43("div", { className: "mx-auto mt-[var(--space-4,1rem)] h-2 w-[100px] rounded-full bg-muted", "aria-hidden": "true" }),
+        /* @__PURE__ */ jsx48("div", { className: "mx-auto mt-[var(--space-4,1rem)] h-2 w-[100px] rounded-full bg-muted", "aria-hidden": "true" }),
         children
       ]
     }
@@ -2761,7 +2923,7 @@ var DrawerContent = React38.forwardRef(({ className, children, ...props }, ref)
 ] }));
 DrawerContent.displayName = "DrawerContent";
 function DrawerHeader({ className, ...props }) {
-  return /* @__PURE__ */ jsx43(
+  return /* @__PURE__ */ jsx48(
     "div",
     {
       className: cn("grid gap-1.5 p-[var(--space-4,1rem)] text-center sm:text-left", className),
@@ -2770,9 +2932,9 @@ function DrawerHeader({ className, ...props }) {
   );
 }
 function DrawerFooter({ className, ...props }) {
-  return /* @__PURE__ */ jsx43("div", { className: cn("mt-auto flex flex-col gap-[var(--gap-sm,0.5rem)] p-[var(--space-4,1rem)]", className), ...props });
+  return /* @__PURE__ */ jsx48("div", { className: cn("mt-auto flex flex-col gap-[var(--gap-sm,0.5rem)] p-[var(--space-4,1rem)]", className), ...props });
 }
-var DrawerTitle = React38.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx43(
+var DrawerTitle = React38.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx48(
   DrawerPrimitive.Title,
   {
     ref,
@@ -2781,7 +2943,7 @@ var DrawerTitle = React38.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 DrawerTitle.displayName = "DrawerTitle";
-var DrawerDescription = React38.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx43(
+var DrawerDescription = React38.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx48(
   DrawerPrimitive.Description,
   {
     ref,
@@ -2797,12 +2959,12 @@ import {
   Panel as ResizablePrimitivePanel,
   Separator as ResizablePrimitiveSeparator
 } from "react-resizable-panels";
-import { jsx as jsx44, jsxs as jsxs21 } from "react/jsx-runtime";
+import { jsx as jsx49, jsxs as jsxs21 } from "react/jsx-runtime";
 function ResizablePanelGroup({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx44(
+  return /* @__PURE__ */ jsx49(
     ResizablePrimitiveGroup,
     {
       className: cn(
@@ -2816,7 +2978,7 @@ function ResizablePanelGroup({
 ResizablePanelGroup.displayName = "ResizablePanelGroup";
 var ResizablePanel = ResizablePrimitivePanel;
 function ResizableHandle({ withHandle, className, ...props }) {
-  return /* @__PURE__ */ jsx44(
+  return /* @__PURE__ */ jsx49(
     ResizablePrimitiveSeparator,
     {
       className: cn(
@@ -2829,7 +2991,7 @@ function ResizableHandle({ withHandle, className, ...props }) {
         className
       ),
       ...props,
-      children: withHandle && /* @__PURE__ */ jsx44("div", { className: "z-10 flex h-4 w-3 items-center justify-center rounded-sm border bg-border", children: /* @__PURE__ */ jsxs21(
+      children: withHandle && /* @__PURE__ */ jsx49("div", { className: "z-10 flex h-4 w-3 items-center justify-center rounded-sm border bg-border", children: /* @__PURE__ */ jsxs21(
         "svg",
         {
           xmlns: "http://www.w3.org/2000/svg",
@@ -2838,12 +3000,12 @@ function ResizableHandle({ withHandle, className, ...props }) {
           className: "h-2.5 w-2.5",
           "aria-hidden": "true",
           children: [
-            /* @__PURE__ */ jsx44("circle", { cx: "9", cy: "5", r: "1" }),
-            /* @__PURE__ */ jsx44("circle", { cx: "9", cy: "12", r: "1" }),
-            /* @__PURE__ */ jsx44("circle", { cx: "9", cy: "19", r: "1" }),
-            /* @__PURE__ */ jsx44("circle", { cx: "15", cy: "5", r: "1" }),
-            /* @__PURE__ */ jsx44("circle", { cx: "15", cy: "12", r: "1" }),
-            /* @__PURE__ */ jsx44("circle", { cx: "15", cy: "19", r: "1" })
+            /* @__PURE__ */ jsx49("circle", { cx: "9", cy: "5", r: "1" }),
+            /* @__PURE__ */ jsx49("circle", { cx: "9", cy: "12", r: "1" }),
+            /* @__PURE__ */ jsx49("circle", { cx: "9", cy: "19", r: "1" }),
+            /* @__PURE__ */ jsx49("circle", { cx: "15", cy: "5", r: "1" }),
+            /* @__PURE__ */ jsx49("circle", { cx: "15", cy: "12", r: "1" }),
+            /* @__PURE__ */ jsx49("circle", { cx: "15", cy: "19", r: "1" })
           ]
         }
       ) })
@@ -2853,10 +3015,10 @@ function ResizableHandle({ withHandle, className, ...props }) {
 ResizableHandle.displayName = "ResizableHandle";
 
 // src/components/sidebar/sidebar.tsx
-import { Slot as Slot4 } from "@radix-ui/react-slot";
-import { cva as cva8 } from "class-variance-authority";
+import { Slot as Slot5 } from "@radix-ui/react-slot";
+import { cva as cva13 } from "class-variance-authority";
 import * as React39 from "react";
-import { Fragment as Fragment2, jsx as jsx45, jsxs as jsxs22 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx50, jsxs as jsxs22 } from "react/jsx-runtime";
 var SidebarContext = React39.createContext(null);
 function useSidebar() {
   const ctx = React39.useContext(SidebarContext);
@@ -2885,7 +3047,7 @@ function SidebarProvider({
     [isControlled, onOpenChange]
   );
   const value = React39.useMemo(() => ({ open, setOpen }), [open, setOpen]);
-  return /* @__PURE__ */ jsx45(SidebarContext.Provider, { value, children: /* @__PURE__ */ jsx45(
+  return /* @__PURE__ */ jsx50(SidebarContext.Provider, { value, children: /* @__PURE__ */ jsx50(
     "div",
     {
       "data-state": open ? "open" : "closed",
@@ -2895,7 +3057,7 @@ function SidebarProvider({
   ) });
 }
 SidebarProvider.displayName = "SidebarProvider";
-var sidebarVariants = cva8(
+var sidebarVariants = cva13(
   cn(
     "flex h-full shrink-0 flex-col border-r bg-background text-foreground",
     "transition-[width] duration-[var(--duration-normal,200ms)] ease-out"
@@ -2920,7 +3082,7 @@ var sidebarVariants = cva8(
 var Sidebar = React39.forwardRef(
   ({ className, side = "left", children, ...props }, ref) => {
     const { open } = useSidebar();
-    return /* @__PURE__ */ jsx45(
+    return /* @__PURE__ */ jsx50(
       "aside",
       {
         ref,
@@ -2938,9 +3100,9 @@ Sidebar.displayName = "Sidebar";
 var SidebarTrigger = React39.forwardRef(
   ({ asChild, className, onClick, "aria-label": ariaLabel, ...props }, ref) => {
     const { open, setOpen } = useSidebar();
-    const Comp = asChild ? Slot4 : "button";
+    const Comp = asChild ? Slot5 : "button";
     const resolvedAriaLabel = ariaLabel ?? (asChild ? void 0 : open ? "Collapse sidebar" : "Expand sidebar");
-    return /* @__PURE__ */ jsx45(
+    return /* @__PURE__ */ jsx50(
       Comp,
       {
         ref,
@@ -2974,12 +3136,12 @@ var SidebarTrigger = React39.forwardRef(
               className: "h-4 w-4",
               "aria-hidden": "true",
               children: [
-                /* @__PURE__ */ jsx45("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2", ry: "2" }),
-                /* @__PURE__ */ jsx45("line", { x1: "9", y1: "3", x2: "9", y2: "21" })
+                /* @__PURE__ */ jsx50("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2", ry: "2" }),
+                /* @__PURE__ */ jsx50("line", { x1: "9", y1: "3", x2: "9", y2: "21" })
               ]
             }
           ),
-          /* @__PURE__ */ jsx45("span", { className: "sr-only", children: "Toggle sidebar" })
+          /* @__PURE__ */ jsx50("span", { className: "sr-only", children: "Toggle sidebar" })
         ] })
       }
     );
@@ -2987,7 +3149,7 @@ var SidebarTrigger = React39.forwardRef(
 );
 SidebarTrigger.displayName = "SidebarTrigger";
 var SidebarHeader = React39.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx45(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx50(
     "div",
     {
       ref,
@@ -2998,7 +3160,7 @@ var SidebarHeader = React39.forwardRef(
 );
 SidebarHeader.displayName = "SidebarHeader";
 var SidebarContent = React39.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx45(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx50(
     "div",
     {
       ref,
@@ -3009,7 +3171,7 @@ var SidebarContent = React39.forwardRef(
 );
 SidebarContent.displayName = "SidebarContent";
 var SidebarFooter = React39.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx45(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx50(
     "div",
     {
       ref,
@@ -3021,8 +3183,8 @@ var SidebarFooter = React39.forwardRef(
 SidebarFooter.displayName = "SidebarFooter";
 var SidebarItem = React39.forwardRef(
   ({ asChild, active, className, ...props }, ref) => {
-    const Comp = asChild ? Slot4 : "button";
-    return /* @__PURE__ */ jsx45(
+    const Comp = asChild ? Slot5 : "button";
+    return /* @__PURE__ */ jsx50(
       Comp,
       {
         ref,
@@ -4847,6 +5009,535 @@ var aspectRatioSchema = {
   tags: ["aspect-ratio", "layout", "image", "video", "ratio"]
 };
 
+// src/primitives/container/container.schema.ts
+var containerSchema = {
+  name: "container",
+  displayName: "Container",
+  description: "Centered max-width wrapper that constrains content to readable widths. Sizes map to `--container-*` prose-width tokens; padding maps to `--space-*`.",
+  category: "primitive",
+  subcategory: "layout",
+  props: [
+    {
+      name: "size",
+      type: "enum",
+      required: false,
+      default: "lg",
+      description: "Max-width preset bound to `--container-*` tokens (sm=33rem, md=40rem, lg=50rem, xl=66rem, full=100%).",
+      enumValues: ["sm", "md", "lg", "xl", "full"]
+    },
+    {
+      name: "padding",
+      type: "enum",
+      required: false,
+      default: "md",
+      description: "Horizontal padding bound to `--space-*` tokens (none=0, sm=0.75rem, md=1rem, lg=2rem).",
+      enumValues: ["none", "sm", "md", "lg"]
+    },
+    {
+      name: "asChild",
+      type: "boolean",
+      required: false,
+      default: false,
+      description: "Render as a different element via Radix `Slot`. Use to render as `<main>`, `<section>`, etc. for landmark semantics."
+    }
+  ],
+  variants: [
+    {
+      name: "size",
+      description: "Max-width preset bound to `--container-*` tokens.",
+      values: [
+        { value: "sm", description: "33rem (\u2248530px) \u2014 narrow column for short content." },
+        { value: "md", description: "40rem (\u2248640px) \u2014 comfortable reading width." },
+        { value: "lg", description: "50rem (\u2248800px) \u2014 default; standard article width." },
+        { value: "xl", description: "66rem (\u22481056px) \u2014 wider canvas for dashboards or marketing." },
+        { value: "full", description: "100% \u2014 disable max-width clamp." }
+      ],
+      default: "lg"
+    },
+    {
+      name: "padding",
+      description: "Horizontal padding bound to `--space-*` tokens.",
+      values: [
+        { value: "none", description: "0 \u2014 flush to container edges." },
+        { value: "sm", description: "0.75rem \u2014 tight gutter." },
+        { value: "md", description: "1rem \u2014 default; standard reading gutter." },
+        { value: "lg", description: "2rem \u2014 generous gutter for marketing pages." }
+      ],
+      default: "md"
+    }
+  ],
+  slots: [
+    {
+      name: "children",
+      description: "Page content to constrain \u2014 typically a section, article, or grid.",
+      required: true,
+      acceptedTypes: ["ReactNode"]
+    }
+  ],
+  dependencies: {
+    npm: ["class-variance-authority", "@radix-ui/react-slot"],
+    internal: ["lib/utils"],
+    peer: ["react"]
+  },
+  tokensUsed: [
+    "--container-sm",
+    "--container-md",
+    "--container-lg",
+    "--container-xl",
+    "--space-3",
+    "--space-4",
+    "--space-8"
+  ],
+  examples: [
+    {
+      title: "Reading-width article",
+      description: "lg size (50rem) + md padding for an article body.",
+      code: '<Container size="lg" padding="md">\n  <article>...</article>\n</Container>'
+    },
+    {
+      title: "Full-width hero",
+      description: "Use size=full when you want the section to span the viewport.",
+      code: '<Container size="full" padding="none">\n  <Hero />\n</Container>'
+    }
+  ],
+  ai: {
+    whenToUse: "Use to constrain page content to readable widths. Pair with `Stack` or `Grid` inside for vertical/grid layouts. Default for any centered article, settings page, or marketing section.",
+    whenNotToUse: 'Don\'t use inside another `Container` (double-clamping). Don\'t use as a drop-in for `<main>` semantics \u2014 it\'s a layout primitive, not a landmark. For full-bleed sections (edge-to-edge banners), pass `size="full" padding="none"`.',
+    commonMistakes: [
+      "Wrapping a `Container` in another `Container` and getting an unexpectedly narrow column",
+      'Using `padding="none"` and forgetting that children still need their own gutter \u2014 the parent contributes nothing',
+      "Treating `lg` as the largest size \u2014 `xl` (66rem) and `full` are bigger"
+    ],
+    relatedComponents: ["stack", "grid", "cluster"],
+    accessibilityNotes: "Container is presentational. Wrap in a semantic landmark (`<main>`, `<section>`, `<article>`) when the page structure needs it; Container itself renders a plain `<div>`.",
+    tokenBudget: 250
+  },
+  tags: ["container", "layout", "wrapper", "max-width", "primitive"]
+};
+
+// src/primitives/stack/stack.schema.ts
+var stackSchema = {
+  name: "stack",
+  displayName: "Stack",
+  description: 'Vertical flex flow with token-bound gap. The headless equivalent of `<div className="flex flex-col gap-X">` with consistent spacing scale.',
+  category: "primitive",
+  subcategory: "layout",
+  props: [
+    {
+      name: "gap",
+      type: "enum",
+      required: false,
+      default: "md",
+      description: "Vertical spacing between children, bound to `--gap-*` tokens.",
+      enumValues: ["xs", "sm", "md", "lg", "xl"]
+    },
+    {
+      name: "align",
+      type: "enum",
+      required: false,
+      default: "stretch",
+      description: "Cross-axis alignment (CSS `align-items`).",
+      enumValues: ["start", "center", "end", "stretch"]
+    },
+    {
+      name: "justify",
+      type: "enum",
+      required: false,
+      default: "start",
+      description: "Main-axis distribution (CSS `justify-content`).",
+      enumValues: ["start", "center", "end", "between"]
+    }
+  ],
+  variants: [
+    {
+      name: "gap",
+      description: "Vertical gap between children, bound to `--gap-*` tokens.",
+      values: [
+        { value: "xs", description: "0.25rem \u2014 barely-there spacing." },
+        { value: "sm", description: "0.5rem \u2014 tight grouping." },
+        { value: "md", description: "1rem \u2014 default; standard rhythm." },
+        { value: "lg", description: "1.5rem \u2014 section-level spacing." },
+        { value: "xl", description: "2rem \u2014 major separation." }
+      ],
+      default: "md"
+    },
+    {
+      name: "align",
+      description: "Cross-axis alignment (CSS `align-items`).",
+      values: [
+        { value: "start", description: "Children align to left edge." },
+        { value: "center", description: "Children center horizontally." },
+        { value: "end", description: "Children align to right edge." },
+        { value: "stretch", description: "Default \u2014 children fill container width." }
+      ],
+      default: "stretch"
+    },
+    {
+      name: "justify",
+      description: "Main-axis distribution (CSS `justify-content`).",
+      values: [
+        { value: "start", description: "Default \u2014 children pack to top." },
+        { value: "center", description: "Children center vertically." },
+        { value: "end", description: "Children pack to bottom." },
+        { value: "between", description: "First child to top, last to bottom, even distribution." }
+      ],
+      default: "start"
+    }
+  ],
+  slots: [
+    {
+      name: "children",
+      description: "Items to stack vertically.",
+      required: true,
+      acceptedTypes: ["ReactNode"]
+    }
+  ],
+  dependencies: {
+    npm: ["class-variance-authority"],
+    internal: ["lib/utils"],
+    peer: ["react"]
+  },
+  tokensUsed: ["--gap-xs", "--gap-sm", "--gap-md", "--gap-lg", "--gap-xl"],
+  examples: [
+    {
+      title: "Form sections",
+      description: "Lg gap separates labelled groups; nested Stack with sm gap groups label+input.",
+      code: '<Stack gap="lg">\n  <Stack gap="sm"><Label>Email</Label><Input /></Stack>\n  <Stack gap="sm"><Label>Password</Label><Input type="password" /></Stack>\n  <Button>Submit</Button>\n</Stack>'
+    },
+    {
+      title: "Centered hero",
+      description: "Center children horizontally for a centered call-to-action stack.",
+      code: '<Stack gap="md" align="center">\n  <h1>Title</h1>\n  <p>Subtitle</p>\n  <Button>Get started</Button>\n</Stack>'
+    }
+  ],
+  ai: {
+    whenToUse: "Use anywhere you'd write `flex flex-col gap-X`. Default for vertical lists of dissimilar items (label + input + helper text), section bodies, sidebar items, button groups stacked vertically.",
+    whenNotToUse: "Don't use for tabular data \u2014 use `<table>` or DataTable. Don't use for grid-like layouts \u2014 use `Grid`. Don't reach for `Stack` when a single child needs no spacing \u2014 just render the child.",
+    commonMistakes: [
+      'Setting `gap="md"` then adding `mt-*` / `space-y-*` on individual children \u2014 pick one spacing system',
+      'Using `align="center"` and wondering why children expand to full width \u2014 that\'s the `stretch` default for cross-axis',
+      "Nesting Stack inside Stack with the same gap when one Stack with two children would suffice"
+    ],
+    relatedComponents: ["cluster", "grid", "container"],
+    accessibilityNotes: "Stack is presentational. Wrap stacked navigation links in a `<nav>`, stacked form fields in a `<form>`, etc. \u2014 Stack does not contribute landmark semantics.",
+    tokenBudget: 250
+  },
+  tags: ["stack", "layout", "flex", "column", "vertical", "primitive"]
+};
+
+// src/primitives/cluster/cluster.schema.ts
+var clusterSchema = {
+  name: "cluster",
+  displayName: "Cluster",
+  description: "Horizontal flex flow with wrap and token-bound gap. Use for tag lists, button rows, breadcrumbs, and any group of equally-weighted inline items.",
+  category: "primitive",
+  subcategory: "layout",
+  props: [
+    {
+      name: "gap",
+      type: "enum",
+      required: false,
+      default: "md",
+      description: "Gap between items, bound to `--gap-*` tokens. Applies to both row and column gaps when wrapping.",
+      enumValues: ["xs", "sm", "md", "lg", "xl"]
+    },
+    {
+      name: "align",
+      type: "enum",
+      required: false,
+      default: "center",
+      description: "Cross-axis alignment (CSS `align-items`). `baseline` aligns text-baselines for mixed-size siblings; `stretch` makes items fill row height (useful for wrap-card layouts).",
+      enumValues: ["start", "center", "end", "stretch", "baseline"]
+    },
+    {
+      name: "justify",
+      type: "enum",
+      required: false,
+      default: "start",
+      description: "Main-axis distribution (CSS `justify-content`).",
+      enumValues: ["start", "center", "end", "between"]
+    }
+  ],
+  variants: [
+    {
+      name: "gap",
+      description: "Gap between items, bound to `--gap-*` tokens (applies to row + column gaps when wrapping).",
+      values: [
+        { value: "xs", description: "0.25rem \u2014 barely-there spacing." },
+        { value: "sm", description: "0.5rem \u2014 tight chip group." },
+        { value: "md", description: "1rem \u2014 default; standard rhythm." },
+        { value: "lg", description: "1.5rem \u2014 generous separation." },
+        { value: "xl", description: "2rem \u2014 section-scale spacing." }
+      ],
+      default: "md"
+    },
+    {
+      name: "align",
+      description: "Cross-axis alignment (CSS `align-items`).",
+      values: [
+        { value: "start", description: "Items align to top of row." },
+        { value: "center", description: "Default \u2014 items center vertically in the row." },
+        { value: "end", description: "Items align to bottom of row." },
+        { value: "stretch", description: "Items fill row height \u2014 use for wrap layouts of equal-height cards." },
+        { value: "baseline", description: "Text-baselines align across mixed-size siblings." }
+      ],
+      default: "center"
+    },
+    {
+      name: "justify",
+      description: "Main-axis distribution (CSS `justify-content`).",
+      values: [
+        { value: "start", description: "Default \u2014 items pack to start of row." },
+        { value: "center", description: "Items center horizontally." },
+        { value: "end", description: "Items pack to end of row." },
+        { value: "between", description: "First item flush left, last flush right, even distribution." }
+      ],
+      default: "start"
+    }
+  ],
+  slots: [
+    {
+      name: "children",
+      description: "Items to lay out horizontally with wrap.",
+      required: true,
+      acceptedTypes: ["ReactNode"]
+    }
+  ],
+  dependencies: {
+    npm: ["class-variance-authority"],
+    internal: ["lib/utils"],
+    peer: ["react"]
+  },
+  tokensUsed: ["--gap-xs", "--gap-sm", "--gap-md", "--gap-lg", "--gap-xl"],
+  examples: [
+    {
+      title: "Tag chips",
+      description: "Small gap, wraps when overflowing the row.",
+      code: '<Cluster gap="sm">\n  {tags.map((t) => <Badge key={t}>{t}</Badge>)}\n</Cluster>'
+    },
+    {
+      title: "Action bar",
+      description: "Right-aligned buttons inside a panel footer.",
+      code: '<Cluster gap="sm" justify="end">\n  <Button variant="ghost">Cancel</Button>\n  <Button>Save</Button>\n</Cluster>'
+    }
+  ],
+  ai: {
+    whenToUse: "Use for any horizontal row of items that should wrap when space runs out: tag clouds, breadcrumbs, button rows, social-link icon strips, inline metadata badges. Pick `Cluster` over `flex` when you want predictable wrap + gap behavior.",
+    whenNotToUse: "Don't use for two-element rows where you need precise positional control (left/right) \u2014 use `Stack` rotated or a flex with `justify-between` directly. Don't use for grid-aligned layouts where columns must line up across rows \u2014 use `Grid`.",
+    commonMistakes: [
+      "Forgetting that `Cluster` wraps \u2014 adding `flex-nowrap` defeats the purpose; if you don't want wrap, use a flex row or `Stack` rotated",
+      "Setting `align=\"baseline\"` for icon+text rows where the icon's bbox doesn't have a baseline \u2014 use `center` instead",
+      "Reaching for `Cluster` for tabular alignment \u2014 use `Grid` or a real `<table>` when columns must line up"
+    ],
+    relatedComponents: ["stack", "grid", "container"],
+    accessibilityNotes: "Cluster is presentational. Lists of navigational items should be wrapped in `<nav>` (and ideally `<ul>` / `<li>`). Lists of tags can use a list element for screen-reader semantics; the visual wrap is independent.",
+    tokenBudget: 250
+  },
+  tags: ["cluster", "layout", "flex", "wrap", "horizontal", "primitive"]
+};
+
+// src/primitives/grid/grid.schema.ts
+var gridSchema = {
+  name: "grid",
+  displayName: "Grid",
+  description: 'CSS grid with column-count presets and token-bound gap. Pass `cols="auto-fit"` + `minColWidth` for responsive grids without media queries.',
+  category: "primitive",
+  subcategory: "layout",
+  props: [
+    {
+      name: "cols",
+      type: "enum",
+      required: false,
+      default: "3",
+      description: 'Number of fixed columns, or `"auto-fit"` for responsive tracks (use with `minColWidth`).',
+      enumValues: ["1", "2", "3", "4", "6", "auto-fit"]
+    },
+    {
+      name: "gap",
+      type: "enum",
+      required: false,
+      default: "md",
+      description: "Gap between cells, bound to `--gap-*` tokens.",
+      enumValues: ["xs", "sm", "md", "lg", "xl"]
+    },
+    {
+      name: "align",
+      type: "enum",
+      required: false,
+      default: "stretch",
+      description: "Cell vertical alignment within their grid row.",
+      enumValues: ["start", "center", "end", "stretch"]
+    },
+    {
+      name: "minColWidth",
+      type: "string",
+      required: false,
+      default: "16rem",
+      description: 'Min track size for `cols="auto-fit"` (e.g. `"20rem"`). Ignored when `cols` is a fixed integer.'
+    }
+  ],
+  variants: [
+    {
+      name: "cols",
+      description: "Column count or `auto-fit` mode.",
+      values: [
+        { value: "1", description: "Single column \u2014 items stack vertically inside the grid." },
+        { value: "2", description: "Two even columns." },
+        { value: "3", description: "Default \u2014 three even columns." },
+        { value: "4", description: "Four even columns." },
+        { value: "6", description: "Six even columns \u2014 dense layouts." },
+        { value: "auto-fit", description: "Tracks repeat to fill width, never below `minColWidth`." }
+      ],
+      default: "3"
+    },
+    {
+      name: "gap",
+      description: "Gap between cells, bound to `--gap-*` tokens.",
+      values: [
+        { value: "xs", description: "0.25rem \u2014 minimal separation." },
+        { value: "sm", description: "0.5rem \u2014 tight grid." },
+        { value: "md", description: "1rem \u2014 default; standard rhythm." },
+        { value: "lg", description: "1.5rem \u2014 generous separation." },
+        { value: "xl", description: "2rem \u2014 major separation between cards." }
+      ],
+      default: "md"
+    },
+    {
+      name: "align",
+      description: "Cell vertical alignment within their grid row.",
+      values: [
+        { value: "start", description: "Cells align to top of row." },
+        { value: "center", description: "Cells center vertically." },
+        { value: "end", description: "Cells align to bottom of row." },
+        { value: "stretch", description: "Default \u2014 cells fill row height." }
+      ],
+      default: "stretch"
+    }
+  ],
+  slots: [
+    {
+      name: "children",
+      description: "Grid cells \u2014 typically Cards, images, or any uniform block.",
+      required: true,
+      acceptedTypes: ["ReactNode"]
+    }
+  ],
+  dependencies: {
+    npm: ["class-variance-authority"],
+    internal: ["lib/utils"],
+    peer: ["react"]
+  },
+  tokensUsed: ["--gap-xs", "--gap-sm", "--gap-md", "--gap-lg", "--gap-xl"],
+  examples: [
+    {
+      title: "Three-column card grid",
+      description: "Fixed 3 columns with medium gap.",
+      code: '<Grid cols={3} gap="md">\n  {items.map((i) => <Card key={i.id}>{i.title}</Card>)}\n</Grid>'
+    },
+    {
+      title: "Responsive auto-fit",
+      description: "Tracks fit as many 20rem columns as the viewport allows; no media queries needed.",
+      code: '<Grid cols="auto-fit" minColWidth="20rem" gap="lg">\n  {items.map(...)}\n</Grid>'
+    }
+  ],
+  ai: {
+    whenToUse: 'Use for visually-aligned grids of similar items: card galleries, image walls, dashboard tiles, settings panels. Prefer `cols="auto-fit"` + `minColWidth` over hand-written breakpoints when the column count should adapt to viewport width.',
+    whenNotToUse: "Don't use for one-dimensional flows \u2014 use `Stack` (vertical) or `Cluster` (horizontal). Don't use for tabular data \u2014 use `<table>` or DataTable. Don't fight `Grid` to make uneven columns; if cells need different sizes, use a flexbox layout or a CSS grid with named tracks directly.",
+    commonMistakes: [
+      'Setting `cols={5}` and getting nothing \u2014 the preset only supports 1/2/3/4/6 (deliberate, to avoid odd visual rhythms); use `cols="auto-fit"` for arbitrary counts',
+      'Passing `cols="auto-fit"` without `minColWidth` \u2014 the default `16rem` may not match your design intent',
+      "Using `Grid` for two children when `Cluster` or `Stack` would communicate intent better"
+    ],
+    relatedComponents: ["stack", "cluster", "container", "card"],
+    accessibilityNotes: "Grid is presentational. If the grid renders a list of similar items, wrap in `<ul>`/`<li>` for screen-reader semantics \u2014 Grid only handles visual layout.",
+    tokenBudget: 300
+  },
+  tags: ["grid", "layout", "css-grid", "responsive", "auto-fit", "primitive"]
+};
+
+// src/primitives/spacer/spacer.schema.ts
+var spacerSchema = {
+  name: "spacer",
+  displayName: "Spacer",
+  description: "Declarative whitespace block bound to `--space-*` tokens. Use when sibling spacing can't come from a parent's `gap`.",
+  category: "primitive",
+  subcategory: "layout",
+  props: [
+    {
+      name: "size",
+      type: "enum",
+      required: false,
+      default: "md",
+      description: "Spacing token (xs=0.25rem, sm=0.5rem, md=1rem, lg=2rem, xl=4rem). Bound to `--space-*`.",
+      enumValues: ["xs", "sm", "md", "lg", "xl"]
+    },
+    {
+      name: "axis",
+      type: "enum",
+      required: false,
+      default: "vertical",
+      description: "Which axis to expand. Vertical = height; horizontal = width; both = square.",
+      enumValues: ["vertical", "horizontal", "both"]
+    }
+  ],
+  variants: [
+    {
+      name: "size",
+      description: "Spacer extent bound to `--space-*` tokens.",
+      values: [
+        { value: "xs", description: "0.25rem \u2014 micro-gap." },
+        { value: "sm", description: "0.5rem \u2014 tight separation." },
+        { value: "md", description: "1rem \u2014 default; standard breathing room." },
+        { value: "lg", description: "2rem \u2014 section-scale separation." },
+        { value: "xl", description: "4rem \u2014 major separation between hero areas." }
+      ],
+      default: "md"
+    },
+    {
+      name: "axis",
+      description: "Which axis the spacer extends along.",
+      values: [
+        { value: "vertical", description: "Default \u2014 fixed height, 1px width." },
+        { value: "horizontal", description: "Fixed width, 1px height \u2014 for flex rows." },
+        { value: "both", description: "Square block \u2014 rare; usually pick one axis." }
+      ],
+      default: "vertical"
+    }
+  ],
+  slots: [],
+  dependencies: {
+    npm: ["class-variance-authority"],
+    internal: ["lib/utils"],
+    peer: ["react"]
+  },
+  tokensUsed: ["--space-1", "--space-2", "--space-4", "--space-8", "--space-16"],
+  examples: [
+    {
+      title: "Vertical breathing room",
+      description: "Push two sections apart inside a parent that doesn't manage gap.",
+      code: '<>\n  <Hero />\n  <Spacer size="xl" />\n  <Features />\n</>'
+    },
+    {
+      title: "Horizontal flex spacer",
+      description: "Push siblings to opposite ends of a flex row.",
+      code: '<div className="flex items-center">\n  <Logo />\n  <Spacer axis="horizontal" size="lg" />\n  <Nav />\n</div>'
+    }
+  ],
+  ai: {
+    whenToUse: "Use as an explicit whitespace primitive when you can't (or don't want to) use `gap` on the parent \u2014 typically: pushing siblings apart inside a flex row that already has gap-0, or inserting one-off vertical breathing room between top-level sections that aren't wrapped in a Stack.",
+    whenNotToUse: "Don't use Spacer when a `Stack` or `Cluster` parent's `gap` would do the same thing \u2014 that scales better and keeps the spacing concern with the layout primitive. Don't use Spacer to flush content to one edge of a flex container \u2014 use `ml-auto` / `justify-between` directly.",
+    commonMistakes: [
+      "Using `<Spacer />` between every child in a Stack \u2014 just set the Stack's `gap` instead",
+      'Using `axis="both"` and getting a square block where you wanted a line \u2014 `both` is rare, usually you want vertical or horizontal',
+      `Setting size="lg" on a horizontal spacer and getting nothing visible because the parent isn't a flex row \u2014 Spacer reserves space, it doesn't push siblings on its own`
+    ],
+    relatedComponents: ["stack", "cluster", "separator"],
+    accessibilityNotes: 'Spacer is `aria-hidden="true"` \u2014 screen readers skip it. Don\'t use a Spacer where a `Separator` would convey meaning (a thematic break should be `Separator`, not `Spacer`).',
+    tokenBudget: 200
+  },
+  tags: ["spacer", "layout", "whitespace", "spacing", "primitive"]
+};
+
 // src/components/collapsible/collapsible.schema.ts
 var collapsibleSchema = {
   name: "collapsible",
@@ -6270,6 +6961,7 @@ export {
   CardHeader,
   CardTitle,
   Checkbox,
+  Cluster,
   Collapsible,
   CollapsibleContent2 as CollapsibleContent,
   CollapsibleTrigger2 as CollapsibleTrigger,
@@ -6283,6 +6975,7 @@ export {
   CommandList,
   CommandSeparator,
   CommandShortcut,
+  Container,
   ContextMenu,
   ContextMenuCheckboxItem,
   ContextMenuContent,
@@ -6337,6 +7030,7 @@ export {
   FormItem,
   FormLabel,
   FormMessage,
+  Grid,
   HoverCard,
   HoverCardContent,
   HoverCardTrigger,
@@ -6412,6 +7106,8 @@ export {
   SidebarTrigger,
   Skeleton,
   Slider,
+  Spacer,
+  Stack,
   Switch,
   Table,
   TableBody,
@@ -6448,10 +7144,14 @@ export {
   calendarSchema,
   cardSchema,
   checkboxSchema,
+  clusterSchema,
+  clusterVariants,
   cn,
   collapsibleSchema,
   comboboxSchema,
   commandSchema,
+  containerSchema,
+  containerVariants,
   contextMenuSchema,
   dataTableSchema,
   datePickerSchema,
@@ -6459,6 +7159,8 @@ export {
   drawerSchema,
   dropdownMenuSchema,
   formSchema,
+  gridSchema,
+  gridVariants,
   hoverCardSchema,
   inputOTPSchema,
   inputSchema,
@@ -6479,6 +7181,10 @@ export {
   skeletonSchema,
   sliderSchema,
   sonnerSchema,
+  spacerSchema,
+  spacerVariants,
+  stackSchema,
+  stackVariants,
   switchSchema,
   tableSchema,
   tabsSchema,