@akira-io/ui 1.0.0 → 1.1.1

package/dist/{chunk-5MQWJVM2.js → chunk-QHZWW55M.js}

@@ -1,276 +1,87 @@
-import { cn, elevatedSurface, nestedSurfaceReset, menuSurface, focusRing, floatingSurface, Button, Input } from './chunk-POE7OYET.js';
-import * as AvatarPrimitive from '@radix-ui/react-avatar';
+import { Separator } from './chunk-TGF54WAO.js';
+import { Input } from './chunk-XZCC6MTE.js';
+import { cn, menuSurface, focusRing, floatingSurface, Button } from './chunk-ODYCBCKS.js';
+import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
+import { CheckIcon, CircleIcon, ChevronRightIcon, ChevronRight, MoreHorizontal, XIcon, PanelLeftIcon } from 'lucide-react';
 import { jsx, jsxs } from 'react/jsx-runtime';
+import * as AvatarPrimitive from '@radix-ui/react-avatar';
 import { Slot } from '@radix-ui/react-slot';
-import { ChevronRight, MoreHorizontal, CheckIcon, CircleIcon, ChevronRightIcon, XIcon, PanelLeftIcon } from 'lucide-react';
 import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
-import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
-import * as SeparatorPrimitive from '@radix-ui/react-separator';
 import * as SheetPrimitive from '@radix-ui/react-dialog';
 import * as React2 from 'react';
 import { useState, useEffect } from 'react';
 import * as TooltipPrimitive from '@radix-ui/react-tooltip';
 import { cva } from 'class-variance-authority';
 
-function Avatar({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    AvatarPrimitive.Root,
-    {
-      "data-slot": "avatar",
-      className: cn(
-        "size-8 relative flex shrink-0 overflow-hidden rounded-full",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function AvatarImage({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    AvatarPrimitive.Image,
-    {
-      "data-slot": "avatar-image",
-      className: cn("aspect-square size-full", className),
-      ...props
-    }
-  );
-}
-function AvatarFallback({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    AvatarPrimitive.Fallback,
-    {
-      "data-slot": "avatar-fallback",
-      className: cn(
-        "flex size-full items-center justify-center rounded-full bg-muted",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function Breadcrumb({ ...props }) {
-  return /* @__PURE__ */ jsx("nav", { "aria-label": "breadcrumb", "data-slot": "breadcrumb", ...props });
-}
-function BreadcrumbList({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "ol",
-    {
-      "data-slot": "breadcrumb-list",
-      className: cn(
-        "gap-1.5 text-sm sm:gap-2.5 flex flex-wrap items-center break-words text-muted-foreground",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function BreadcrumbItem({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "li",
-    {
-      "data-slot": "breadcrumb-item",
-      className: cn("gap-1.5 inline-flex items-center", className),
-      ...props
-    }
-  );
-}
-function BreadcrumbLink({
-  asChild,
-  className,
-  ...props
-}) {
-  const Comp = asChild ? Slot : "a";
-  return /* @__PURE__ */ jsx(
-    Comp,
-    {
-      "data-slot": "breadcrumb-link",
-      className: cn("transition-colors hover:text-foreground", className),
-      ...props
-    }
-  );
-}
-function BreadcrumbPage({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "span",
-    {
-      "data-slot": "breadcrumb-page",
-      role: "link",
-      "aria-disabled": "true",
-      "aria-current": "page",
-      className: cn("font-semibold text-foreground", className),
-      ...props
-    }
-  );
-}
-function BreadcrumbSeparator({
-  children,
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    "li",
-    {
-      "data-slot": "breadcrumb-separator",
-      role: "presentation",
-      "aria-hidden": "true",
-      className: cn("[&>svg]:size-3.5", className),
-      ...props,
-      children: children ?? /* @__PURE__ */ jsx(ChevronRight, {})
-    }
-  );
-}
-function BreadcrumbEllipsis({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxs(
-    "span",
-    {
-      "data-slot": "breadcrumb-ellipsis",
-      role: "presentation",
-      "aria-hidden": "true",
-      className: cn(
-        "size-9 rounded-xl flex items-center justify-center",
-        className
-      ),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsx(MoreHorizontal, { className: "size-4" }),
-        /* @__PURE__ */ jsx("span", { className: "sr-only", children: "More" })
-      ]
-    }
-  );
-}
-function Collapsible({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    CollapsiblePrimitive.Root,
-    {
-      "data-slot": "collapsible",
-      className: cn(
-        elevatedSurface,
-        nestedSurfaceReset,
-        "p-5 bg-card",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function CollapsibleTrigger2({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    CollapsiblePrimitive.CollapsibleTrigger,
-    {
-      "data-slot": "collapsible-trigger",
-      ...props
-    }
-  );
-}
-function CollapsibleContent2({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    CollapsiblePrimitive.CollapsibleContent,
-    {
-      "data-slot": "collapsible-content",
-      ...props
-    }
-  );
-}
 function DropdownMenu({
   modal = false,
+  slotName = "dropdown-menu",
   ...props
 }) {
   return /* @__PURE__ */ jsx(
     DropdownMenuPrimitive.Root,
     {
-      "data-slot": "dropdown-menu",
       modal,
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
 function DropdownMenuPortal({
+  slotName = "dropdown-menu-portal",
   ...props
 }) {
-  return /* @__PURE__ */ jsx(
-    DropdownMenuPrimitive.Portal,
-    {
-      "data-slot": "dropdown-menu-portal",
-      ...props
-    }
-  );
+  return /* @__PURE__ */ jsx(DropdownMenuPrimitive.Portal, { ...props, "data-slot": slotName });
 }
 function DropdownMenuTrigger({
+  slotName = "dropdown-menu-trigger",
   ...props
 }) {
-  return /* @__PURE__ */ jsx(
-    DropdownMenuPrimitive.Trigger,
-    {
-      "data-slot": "dropdown-menu-trigger",
-      ...props
-    }
-  );
+  return /* @__PURE__ */ jsx(DropdownMenuPrimitive.Trigger, { ...props, "data-slot": slotName });
 }
 function DropdownMenuContent({
   className,
   sideOffset = 4,
+  slotName = "dropdown-menu-content",
   ...props
 }) {
   return /* @__PURE__ */ jsx(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(
     DropdownMenuPrimitive.Content,
     {
-      "data-slot": "dropdown-menu-content",
       sideOffset,
       className: cn(
         `${menuSurface} data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 p-1.5 z-50 min-w-[8rem] overflow-hidden`,
         className
       ),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   ) });
 }
 function DropdownMenuGroup({
+  slotName = "dropdown-menu-group",
   ...props
 }) {
-  return /* @__PURE__ */ jsx(
-    DropdownMenuPrimitive.Group,
-    {
-      "data-slot": "dropdown-menu-group",
-      ...props
-    }
-  );
+  return /* @__PURE__ */ jsx(DropdownMenuPrimitive.Group, { ...props, "data-slot": slotName });
 }
 function DropdownMenuItem({
   className,
   inset,
   variant = "default",
+  slotName = "dropdown-menu-item",
   ...props
 }) {
   return /* @__PURE__ */ jsx(
     DropdownMenuPrimitive.Item,
     {
-      "data-slot": "dropdown-menu-item",
       "data-inset": inset,
       "data-variant": variant,
       className: cn(
         "font-medium gap-2 rounded-xl px-2 py-2 text-sm data-[inset]:pl-8 [&_svg:not([class*='size-'])]:size-5 focus:font-semibold relative flex cursor-default items-center outline-hidden transition-all select-none focus:bg-primary/10 focus:text-primary data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive dark:data-[variant=destructive]:focus:bg-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='text-'])]:text-muted-foreground data-[variant=destructive]:*:[svg]:!text-destructive",
         className
       ),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
@@ -278,18 +89,19 @@ function DropdownMenuCheckboxItem({
   className,
   children,
   checked,
+  slotName = "dropdown-menu-checkbox-item",
   ...props
 }) {
   return /* @__PURE__ */ jsxs(
     DropdownMenuPrimitive.CheckboxItem,
     {
-      "data-slot": "dropdown-menu-checkbox-item",
       className: cn(
         "gap-2 py-1.5 pr-2 pl-8 text-sm [&_svg:not([class*='size-'])]:size-4 rounded-xl relative flex cursor-default items-center outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",
         className
       ),
       checked,
       ...props,
+      "data-slot": slotName,
       children: [
         /* @__PURE__ */ jsx("span", { className: "left-2 size-3.5 pointer-events-none absolute flex items-center justify-center", children: /* @__PURE__ */ jsx(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(CheckIcon, { className: "size-4" }) }) }),
         children
@@ -298,30 +110,26 @@ function DropdownMenuCheckboxItem({
   );
 }
 function DropdownMenuRadioGroup({
+  slotName = "dropdown-menu-radio-group",
   ...props
 }) {
-  return /* @__PURE__ */ jsx(
-    DropdownMenuPrimitive.RadioGroup,
-    {
-      "data-slot": "dropdown-menu-radio-group",
-      ...props
-    }
-  );
+  return /* @__PURE__ */ jsx(DropdownMenuPrimitive.RadioGroup, { ...props, "data-slot": slotName });
 }
 function DropdownMenuRadioItem({
   className,
   children,
+  slotName = "dropdown-menu-radio-item",
   ...props
 }) {
   return /* @__PURE__ */ jsxs(
     DropdownMenuPrimitive.RadioItem,
     {
-      "data-slot": "dropdown-menu-radio-item",
       className: cn(
         "gap-2 py-1.5 pr-2 pl-8 text-sm [&_svg:not([class*='size-'])]:size-4 rounded-xl relative flex cursor-default items-center outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",
         className
       ),
       ...props,
+      "data-slot": slotName,
       children: [
         /* @__PURE__ */ jsx("span", { className: "left-2 size-3.5 pointer-events-none absolute flex items-center justify-center", children: /* @__PURE__ */ jsx(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(CircleIcon, { className: "size-2 fill-current" }) }) }),
         children
@@ -332,71 +140,76 @@ function DropdownMenuRadioItem({
 function DropdownMenuLabel({
   className,
   inset,
+  slotName = "dropdown-menu-label",
   ...props
 }) {
   return /* @__PURE__ */ jsx(
     DropdownMenuPrimitive.Label,
     {
-      "data-slot": "dropdown-menu-label",
       "data-inset": inset,
       className: cn(
         "px-2 py-2 text-xs font-medium tracking-wider data-[inset]:pl-8 text-muted-foreground uppercase",
         className
       ),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
 function DropdownMenuSeparator({
   className,
+  slotName = "dropdown-menu-separator",
   ...props
 }) {
   return /* @__PURE__ */ jsx(
     DropdownMenuPrimitive.Separator,
     {
-      "data-slot": "dropdown-menu-separator",
       className: cn("-mx-1 my-1 h-px bg-border", className),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
 function DropdownMenuShortcut({
   className,
+  slotName = "dropdown-menu-shortcut",
   ...props
 }) {
   return /* @__PURE__ */ jsx(
     "span",
     {
-      "data-slot": "dropdown-menu-shortcut",
       className: cn(
         "text-xs tracking-widest ml-auto text-muted-foreground",
         className
       ),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
 function DropdownMenuSub({
+  slotName = "dropdown-menu-sub",
   ...props
 }) {
-  return /* @__PURE__ */ jsx(DropdownMenuPrimitive.Sub, { "data-slot": "dropdown-menu-sub", ...props });
+  return /* @__PURE__ */ jsx(DropdownMenuPrimitive.Sub, { ...props, "data-slot": slotName });
 }
 function DropdownMenuSubTrigger({
   className,
   inset,
   children,
+  slotName = "dropdown-menu-sub-trigger",
   ...props
 }) {
   return /* @__PURE__ */ jsxs(
     DropdownMenuPrimitive.SubTrigger,
     {
-      "data-slot": "dropdown-menu-sub-trigger",
       "data-inset": inset,
       className: cn(
         "font-medium rounded-xl px-2 py-2 text-sm data-[inset]:pl-8 focus:font-semibold data-[state=open]:font-semibold flex cursor-default items-center outline-hidden transition-all select-none focus:bg-primary/10 focus:text-primary data-[state=open]:bg-primary/10 data-[state=open]:text-primary",
         className
       ),
       ...props,
+      "data-slot": slotName,
       children: [
         children,
         /* @__PURE__ */ jsx(ChevronRightIcon, { className: "size-4 ml-auto" })
@@ -406,49 +219,220 @@ function DropdownMenuSubTrigger({
 }
 function DropdownMenuSubContent({
   className,
+  slotName = "dropdown-menu-sub-content",
   ...props
 }) {
   return /* @__PURE__ */ jsx(
     DropdownMenuPrimitive.SubContent,
     {
-      "data-slot": "dropdown-menu-sub-content",
       className: cn(
         `${menuSurface} data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 p-1.5 z-50 min-w-[8rem] overflow-hidden`,
         className
       ),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
-function Icon({ iconNode: IconComponent, className }) {
-  if (!IconComponent) {
-    return null;
-  }
-  return /* @__PURE__ */ jsx(IconComponent, { className });
+function Avatar({
+  className,
+  slotName = "avatar",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    AvatarPrimitive.Root,
+    {
+      className: cn(
+        "size-8 relative flex shrink-0 overflow-hidden rounded-full",
+        className
+      ),
+      ...props,
+      "data-slot": slotName
+    }
+  );
+}
+function AvatarImage({
+  className,
+  slotName = "avatar-image",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    AvatarPrimitive.Image,
+    {
+      className: cn("aspect-square size-full", className),
+      ...props,
+      "data-slot": slotName
+    }
+  );
+}
+function AvatarFallback({
+  className,
+  slotName = "avatar-fallback",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    AvatarPrimitive.Fallback,
+    {
+      className: cn(
+        "flex size-full items-center justify-center rounded-full bg-muted",
+        className
+      ),
+      ...props,
+      "data-slot": slotName
+    }
+  );
+}
+function Breadcrumb({
+  slotName = "breadcrumb",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx("nav", { "aria-label": "breadcrumb", ...props, "data-slot": slotName });
 }
-function Separator2({
+function BreadcrumbList({
   className,
-  orientation = "horizontal",
-  decorative = true,
+  slotName = "breadcrumb-list",
   ...props
 }) {
   return /* @__PURE__ */ jsx(
-    SeparatorPrimitive.Root,
+    "ol",
     {
-      "data-slot": "separator-root",
-      decorative,
-      orientation,
       className: cn(
-        "shrink-0 bg-border data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px",
+        "gap-1.5 text-sm sm:gap-2.5 flex flex-wrap items-center break-words text-muted-foreground",
         className
       ),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
+function BreadcrumbItem({
+  className,
+  slotName = "breadcrumb-item",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "li",
+    {
+      className: cn("gap-1.5 inline-flex items-center", className),
+      ...props,
+      "data-slot": slotName
+    }
+  );
+}
+function BreadcrumbLink({
+  asChild,
+  className,
+  slotName = "breadcrumb-link",
+  ...props
+}) {
+  const Comp = asChild ? Slot : "a";
+  return /* @__PURE__ */ jsx(
+    Comp,
+    {
+      className: cn("transition-colors hover:text-foreground", className),
+      ...props,
+      "data-slot": slotName
+    }
+  );
+}
+function BreadcrumbPage({
+  className,
+  slotName = "breadcrumb-page",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      role: "link",
+      "aria-disabled": "true",
+      "aria-current": "page",
+      className: cn("font-semibold text-foreground", className),
+      ...props,
+      "data-slot": slotName
+    }
+  );
+}
+function BreadcrumbSeparator({
+  children,
+  className,
+  slotName = "breadcrumb-separator",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "li",
+    {
+      role: "presentation",
+      "aria-hidden": "true",
+      className: cn("[&>svg]:size-3.5", className),
+      ...props,
+      "data-slot": slotName,
+      children: children ?? /* @__PURE__ */ jsx(ChevronRight, {})
+    }
+  );
+}
+function BreadcrumbEllipsis({
+  className,
+  slotName = "breadcrumb-ellipsis",
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      role: "presentation",
+      "aria-hidden": "true",
+      className: cn(
+        "size-9 rounded-xl flex items-center justify-center",
+        className
+      ),
+      ...props,
+      "data-slot": slotName,
+      children: [
+        /* @__PURE__ */ jsx(MoreHorizontal, { className: "size-4" }),
+        /* @__PURE__ */ jsx("span", { className: "sr-only", children: "More" })
+      ]
+    }
+  );
+}
+function Collapsible({
+  slotName = "collapsible",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(CollapsiblePrimitive.Root, { ...props, "data-slot": slotName });
+}
+function CollapsibleTrigger2({
+  slotName = "collapsible-trigger",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    CollapsiblePrimitive.CollapsibleTrigger,
+    {
+      ...props,
+      "data-slot": slotName
+    }
+  );
+}
+function CollapsibleContent2({
+  slotName = "collapsible-content",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    CollapsiblePrimitive.CollapsibleContent,
+    {
+      ...props,
+      "data-slot": slotName
+    }
+  );
+}
+function Icon({ iconNode: IconComponent, className }) {
+  if (!IconComponent) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(IconComponent, { className });
+}
 function Sheet({
   preserveScroll = false,
   onOpenChange: onOpenChangeProp,
+  slotName = "sheet",
   ...props
 }) {
   const scrollPosition = React2.useRef(0);
@@ -467,40 +451,44 @@ function Sheet({
   return /* @__PURE__ */ jsx(
     SheetPrimitive.Root,
     {
-      "data-slot": "sheet",
       ...props,
-      onOpenChange
+      onOpenChange,
+      "data-slot": slotName
     }
   );
 }
 function SheetTrigger({
+  slotName = "sheet-trigger",
   ...props
 }) {
-  return /* @__PURE__ */ jsx(SheetPrimitive.Trigger, { "data-slot": "sheet-trigger", ...props });
+  return /* @__PURE__ */ jsx(SheetPrimitive.Trigger, { ...props, "data-slot": slotName });
 }
 function SheetClose({
+  slotName = "sheet-close",
   ...props
 }) {
-  return /* @__PURE__ */ jsx(SheetPrimitive.Close, { "data-slot": "sheet-close", ...props });
+  return /* @__PURE__ */ jsx(SheetPrimitive.Close, { ...props, "data-slot": slotName });
 }
 function SheetPortal({
+  slotName = "sheet-portal",
   ...props
 }) {
-  return /* @__PURE__ */ jsx(SheetPrimitive.Portal, { "data-slot": "sheet-portal", ...props });
+  return /* @__PURE__ */ jsx(SheetPrimitive.Portal, { ...props, "data-slot": slotName });
 }
 function SheetOverlay({
   className,
+  slotName = "sheet-overlay",
   ...props
 }) {
   return /* @__PURE__ */ jsx(
     SheetPrimitive.Overlay,
     {
-      "data-slot": "sheet-overlay",
       className: cn(
         "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 inset-0 bg-black/60 backdrop-blur-sm fixed z-50",
         className
       ),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
@@ -508,6 +496,7 @@ function SheetContent({
   className,
   children,
   side = "right",
+  slotName = "sheet-content",
   ...props
 }) {
   return /* @__PURE__ */ jsxs(SheetPortal, { children: [
@@ -515,7 +504,6 @@ function SheetContent({
     /* @__PURE__ */ jsxs(
       SheetPrimitive.Content,
       {
-        "data-slot": "sheet-content",
         className: cn(
           `${floatingSurface} data-[state=open]:animate-in data-[state=closed]:animate-out gap-4 ease-in-out fixed z-50 flex flex-col transition data-[state=closed]:duration-300 data-[state=open]:duration-500`,
           side === "right" && "data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right inset-y-0 right-0 sm:max-w-sm rounded-l-3xl h-full w-3/4 border-l border-border",
@@ -525,6 +513,7 @@ function SheetContent({
           className
         ),
         ...props,
+        "data-slot": slotName,
         children: [
           children,
           /* @__PURE__ */ jsxs(
@@ -545,101 +534,119 @@ function SheetContent({
     )
   ] });
 }
-function SheetHeader({ className, ...props }) {
+function SheetHeader({
+  className,
+  slotName = "sheet-header",
+  ...props
+}) {
   return /* @__PURE__ */ jsx(
     "div",
     {
-      "data-slot": "sheet-header",
       className: cn("gap-1.5 p-4 flex flex-col", className),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
-function SheetFooter({ className, ...props }) {
+function SheetFooter({
+  className,
+  slotName = "sheet-footer",
+  ...props
+}) {
   return /* @__PURE__ */ jsx(
     "div",
     {
-      "data-slot": "sheet-footer",
       className: cn("gap-2 p-4 mt-auto flex flex-col", className),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
 function SheetTitle({
   className,
+  slotName = "sheet-title",
   ...props
 }) {
   return /* @__PURE__ */ jsx(
     SheetPrimitive.Title,
     {
-      "data-slot": "sheet-title",
       className: cn("font-semibold text-foreground", className),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
 function SheetDescription({
   className,
+  slotName = "sheet-description",
   ...props
 }) {
   return /* @__PURE__ */ jsx(
     SheetPrimitive.Description,
     {
-      "data-slot": "sheet-description",
       className: cn("text-sm text-muted-foreground", className),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
-function Skeleton({ className, ...props }) {
+function Skeleton({
+  className,
+  slotName = "skeleton",
+  ...props
+}) {
   return /* @__PURE__ */ jsx(
     "div",
     {
-      "data-slot": "skeleton",
       className: cn("animate-pulse rounded-xl bg-muted", className),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
 function TooltipProvider({
   delayDuration = 0,
+  slotName = "tooltip-provider",
   ...props
 }) {
   return /* @__PURE__ */ jsx(
     TooltipPrimitive.Provider,
     {
-      "data-slot": "tooltip-provider",
       delayDuration,
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
 function Tooltip({
+  slotName = "tooltip",
   ...props
 }) {
-  return /* @__PURE__ */ jsx(TooltipProvider, { children: /* @__PURE__ */ jsx(TooltipPrimitive.Root, { "data-slot": "tooltip", ...props }) });
+  return /* @__PURE__ */ jsx(TooltipProvider, { children: /* @__PURE__ */ jsx(TooltipPrimitive.Root, { ...props, "data-slot": slotName }) });
 }
 function TooltipTrigger({
+  slotName = "tooltip-trigger",
   ...props
 }) {
-  return /* @__PURE__ */ jsx(TooltipPrimitive.Trigger, { "data-slot": "tooltip-trigger", ...props });
+  return /* @__PURE__ */ jsx(TooltipPrimitive.Trigger, { ...props, "data-slot": slotName });
 }
 function TooltipContent({
   className,
   sideOffset = 4,
   children,
+  slotName = "tooltip-content",
   ...props
 }) {
   return /* @__PURE__ */ jsx(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
     TooltipPrimitive.Content,
     {
-      "data-slot": "tooltip-content",
       sideOffset,
       className: cn(
         "animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 max-w-sm px-3 py-1.5 text-xs shadow-2xl rounded-xl z-50 bg-primary text-primary-foreground",
         className
       ),
       ...props,
+      "data-slot": slotName,
       children: [
         children,
         /* @__PURE__ */ jsx(TooltipPrimitive.Arrow, { className: "size-2.5 z-50 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px] bg-primary fill-primary" })
@@ -684,6 +691,7 @@ function SidebarProvider({
   className,
   style,
   children,
+  slotName = "sidebar-wrapper",
   ...props
 }) {
   const isMobile = useIsMobile();
@@ -739,7 +747,6 @@ function SidebarProvider({
   return /* @__PURE__ */ jsx(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ jsx(
     "div",
     {
-      "data-slot": "sidebar-wrapper",
       style: {
         "--sidebar-width": SIDEBAR_WIDTH,
         "--sidebar-width-icon": SIDEBAR_WIDTH_ICON,
@@ -750,6 +757,7 @@ function SidebarProvider({
         className
       ),
       ...props,
+      "data-slot": slotName,
       children
     }
   ) }) });
@@ -760,6 +768,7 @@ function Sidebar({
   collapsible = "offcanvas",
   className,
   children,
+  slotName = "sidebar",
   ...props
 }) {
   const { isMobile, state, openMobile, setOpenMobile } = useSidebar();
@@ -767,12 +776,12 @@ function Sidebar({
     return /* @__PURE__ */ jsx(
       "div",
       {
-        "data-slot": "sidebar",
         className: cn(
           "flex h-full w-(--sidebar-width) flex-col bg-sidebar text-sidebar-foreground",
           className
         ),
         ...props,
+        "data-slot": slotName,
         children
       }
     );
@@ -794,13 +803,13 @@ function Sidebar({
             SheetContent,
             {
               "data-sidebar": "sidebar",
-              "data-slot": "sidebar",
               "data-mobile": "true",
               className: "p-0 w-(--sidebar-width) bg-sidebar text-sidebar-foreground [&>button]:hidden",
               style: {
                 "--sidebar-width": SIDEBAR_WIDTH_MOBILE
               },
               side,
+              slotName,
               children: /* @__PURE__ */ jsx("div", { className: "flex h-full w-full flex-col", children })
             }
           )
@@ -816,7 +825,7 @@ function Sidebar({
       "data-collapsible": state === "collapsed" ? collapsible : "",
       "data-variant": variant,
       "data-side": side,
-      "data-slot": "sidebar",
+      "data-slot": slotName,
       children: [
         /* @__PURE__ */ jsx(
           "div",
@@ -857,6 +866,7 @@ function Sidebar({
 function SidebarTrigger({
   className,
   onClick,
+  slotName = "sidebar-trigger",
   ...props
 }) {
   const { toggleSidebar } = useSidebar();
@@ -864,7 +874,6 @@ function SidebarTrigger({
     Button,
     {
       "data-sidebar": "trigger",
-      "data-slot": "sidebar-trigger",
       variant: "ghost",
       size: "icon",
       className: cn("h-7 w-7", className),
@@ -873,6 +882,7 @@ function SidebarTrigger({
         toggleSidebar();
       },
       ...props,
+      slotName,
       children: [
         /* @__PURE__ */ jsx(PanelLeftIcon, {}),
         /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Toggle Sidebar" })
@@ -880,13 +890,16 @@ function SidebarTrigger({
     }
   );
 }
-function SidebarRail({ className, ...props }) {
+function SidebarRail({
+  className,
+  slotName = "sidebar-rail",
+  ...props
+}) {
   const { toggleSidebar } = useSidebar();
   return /* @__PURE__ */ jsx(
     "button",
     {
       "data-sidebar": "rail",
-      "data-slot": "sidebar-rail",
       "aria-label": "Toggle Sidebar",
       tabIndex: -1,
       onClick: toggleSidebar,
@@ -900,132 +913,156 @@ function SidebarRail({ className, ...props }) {
         "[[data-side=right][data-collapsible=offcanvas]_&]:-left-2",
         className
       ),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
-function SidebarInset({ className, ...props }) {
+function SidebarInset({
+  className,
+  slotName = "sidebar-inset",
+  ...props
+}) {
   return /* @__PURE__ */ jsx(
     "main",
     {
-      "data-slot": "sidebar-inset",
       className: cn(
         "relative flex min-h-svh max-w-full flex-1 flex-col bg-background",
         "peer-data-[variant=inset]:min-h-[calc(100svh-(--spacing(4)))] md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow-sm md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ml-0",
         className
       ),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
 function SidebarInput({
   className,
+  slotName = "sidebar-input",
   ...props
 }) {
   return /* @__PURE__ */ jsx(
     Input,
     {
-      "data-slot": "sidebar-input",
       "data-sidebar": "input",
       className: cn("h-11 w-full bg-background shadow-none", className),
-      ...props
+      ...props,
+      slotName
     }
   );
 }
-function SidebarHeader({ className, ...props }) {
+function SidebarHeader({
+  className,
+  slotName = "sidebar-header",
+  ...props
+}) {
   return /* @__PURE__ */ jsx(
     "div",
     {
-      "data-slot": "sidebar-header",
       "data-sidebar": "header",
       className: cn("gap-2 p-2 flex flex-col", className),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
-function SidebarFooter({ className, ...props }) {
+function SidebarFooter({
+  className,
+  slotName = "sidebar-footer",
+  ...props
+}) {
   return /* @__PURE__ */ jsx(
     "div",
     {
-      "data-slot": "sidebar-footer",
       "data-sidebar": "footer",
       className: cn("gap-2 p-2 flex flex-col", className),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
 function SidebarSeparator({
   className,
+  slotName = "sidebar-separator",
   ...props
 }) {
   return /* @__PURE__ */ jsx(
-    Separator2,
+    Separator,
     {
-      "data-slot": "sidebar-separator",
       "data-sidebar": "separator",
       className: cn("mx-2 w-auto bg-sidebar-border", className),
-      ...props
+      ...props,
+      slotName
     }
   );
 }
-function SidebarContent({ className, ...props }) {
+function SidebarContent({
+  className,
+  slotName = "sidebar-content",
+  ...props
+}) {
   return /* @__PURE__ */ jsx(
     "div",
     {
-      "data-slot": "sidebar-content",
       "data-sidebar": "content",
       className: cn(
         "min-h-0 gap-2 flex flex-1 flex-col overflow-auto group-data-[collapsible=icon]:overflow-hidden",
         className
       ),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
-function SidebarGroup({ className, ...props }) {
+function SidebarGroup({
+  className,
+  slotName = "sidebar-group",
+  ...props
+}) {
   return /* @__PURE__ */ jsx(
     "div",
     {
-      "data-slot": "sidebar-group",
       "data-sidebar": "group",
       className: cn(
         "min-w-0 p-2 relative flex w-full flex-col",
         className
       ),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
 function SidebarGroupLabel({
   className,
   asChild = false,
+  slotName = "sidebar-group-label",
   ...props
 }) {
   const Comp = asChild ? Slot : "div";
   return /* @__PURE__ */ jsx(
     Comp,
     {
-      "data-slot": "sidebar-group-label",
       "data-sidebar": "group-label",
       className: cn(
         "h-8 rounded-xl px-2 text-xs font-medium tracking-wider [&>svg]:size-4 flex shrink-0 items-center text-sidebar-foreground/70 uppercase ring-sidebar-ring outline-hidden transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-[3px] focus-visible:ring-ring/50 [&>svg]:shrink-0",
         "group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:pointer-events-none group-data-[collapsible=icon]:opacity-0 group-data-[collapsible=icon]:select-none",
         className
       ),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
 function SidebarGroupAction({
   className,
   asChild = false,
+  slotName = "sidebar-group-action",
   ...props
 }) {
   const Comp = asChild ? Slot : "button";
   return /* @__PURE__ */ jsx(
     Comp,
     {
-      "data-slot": "sidebar-group-action",
       "data-sidebar": "group-action",
       className: cn(
         "top-3.5 right-3 w-5 p-0 [&>svg]:size-4 rounded-xl absolute flex aspect-square items-center justify-center text-sidebar-foreground ring-sidebar-ring outline-hidden transition-transform hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-[3px] focus-visible:ring-ring/50 [&>svg]:shrink-0",
@@ -1034,43 +1071,53 @@ function SidebarGroupAction({
         "group-data-[collapsible=icon]:hidden",
         className
       ),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
 function SidebarGroupContent({
   className,
+  slotName = "sidebar-group-content",
   ...props
 }) {
   return /* @__PURE__ */ jsx(
     "div",
     {
-      "data-slot": "sidebar-group-content",
       "data-sidebar": "group-content",
       className: cn("text-sm w-full", className),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
-function SidebarMenu({ className, ...props }) {
+function SidebarMenu({
+  className,
+  slotName = "sidebar-menu",
+  ...props
+}) {
   return /* @__PURE__ */ jsx(
     "ul",
     {
-      "data-slot": "sidebar-menu",
       "data-sidebar": "menu",
       className: cn("min-w-0 gap-1 flex w-full flex-col", className),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
-function SidebarMenuItem({ className, ...props }) {
+function SidebarMenuItem({
+  className,
+  slotName = "sidebar-menu-item",
+  ...props
+}) {
   return /* @__PURE__ */ jsx(
     "li",
     {
-      "data-slot": "sidebar-menu-item",
       "data-sidebar": "menu-item",
       className: cn("group/menu-item relative", className),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
@@ -1101,6 +1148,7 @@ function SidebarMenuButton({
   size = "default",
   tooltip,
   className,
+  slotName = "sidebar-menu-button",
   ...props
 }) {
   const Comp = asChild ? Slot : "button";
@@ -1108,7 +1156,6 @@ function SidebarMenuButton({
   const button = /* @__PURE__ */ jsx(
     Comp,
     {
-      "data-slot": "sidebar-menu-button",
       "data-sidebar": "menu-button",
       "data-size": size,
       "data-active": isActive,
@@ -1116,7 +1163,8 @@ function SidebarMenuButton({
         sidebarMenuButtonVariants({ variant, size }),
         className
       ),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
   if (!tooltip) {
@@ -1144,13 +1192,13 @@ function SidebarMenuAction({
   className,
   asChild = false,
   showOnHover = false,
+  slotName = "sidebar-menu-action",
   ...props
 }) {
   const Comp = asChild ? Slot : "button";
   return /* @__PURE__ */ jsx(
     Comp,
     {
-      "data-slot": "sidebar-menu-action",
       "data-sidebar": "menu-action",
       className: cn(
         "top-1.5 right-1 w-5 p-0 [&>svg]:size-4 rounded-xl absolute flex aspect-square items-center justify-center text-sidebar-foreground ring-sidebar-ring outline-hidden transition-transform peer-hover/menu-button:text-sidebar-accent-foreground hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-[3px] focus-visible:ring-ring/50 [&>svg]:shrink-0",
@@ -1163,18 +1211,19 @@ function SidebarMenuAction({
         showOnHover && "md:opacity-0 group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 peer-data-[active=true]/menu-button:text-sidebar-accent-foreground data-[state=open]:opacity-100",
         className
       ),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
 function SidebarMenuBadge({
   className,
+  slotName = "sidebar-menu-badge",
   ...props
 }) {
   return /* @__PURE__ */ jsx(
     "div",
     {
-      "data-slot": "sidebar-menu-badge",
       "data-sidebar": "menu-badge",
       className: cn(
         "right-1 h-5 min-w-5 px-1 text-xs font-medium rounded-xl pointer-events-none absolute flex items-center justify-center text-sidebar-foreground tabular-nums select-none",
@@ -1185,13 +1234,15 @@ function SidebarMenuBadge({
         "group-data-[collapsible=icon]:hidden",
         className
       ),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
 function SidebarMenuSkeleton({
   className,
   showIcon = false,
+  slotName = "sidebar-menu-skeleton",
   ...props
 }) {
   const width = React2.useMemo(() => {
@@ -1200,13 +1251,13 @@ function SidebarMenuSkeleton({
   return /* @__PURE__ */ jsxs(
     "div",
     {
-      "data-slot": "sidebar-menu-skeleton",
       "data-sidebar": "menu-skeleton",
       className: cn(
         "h-8 gap-2 px-2 rounded-xl flex items-center",
         className
       ),
       ...props,
+      "data-slot": slotName,
       children: [
         showIcon && /* @__PURE__ */ jsx(
           Skeleton,
@@ -1229,32 +1280,37 @@ function SidebarMenuSkeleton({
     }
   );
 }
-function SidebarMenuSub({ className, ...props }) {
+function SidebarMenuSub({
+  className,
+  slotName = "sidebar-menu-sub",
+  ...props
+}) {
   return /* @__PURE__ */ jsx(
     "ul",
     {
-      "data-slot": "sidebar-menu-sub",
       "data-sidebar": "menu-sub",
       className: cn(
         "mx-3.5 min-w-0 gap-1 px-2.5 py-0.5 flex translate-x-px flex-col border-l border-sidebar-border",
         "group-data-[collapsible=icon]:hidden",
         className
       ),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
 function SidebarMenuSubItem({
   className,
+  slotName = "sidebar-menu-sub-item",
   ...props
 }) {
   return /* @__PURE__ */ jsx(
     "li",
     {
-      "data-slot": "sidebar-menu-sub-item",
       "data-sidebar": "menu-sub-item",
       className: cn("group/menu-sub-item relative", className),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
@@ -1263,13 +1319,13 @@ function SidebarMenuSubButton({
   size = "md",
   isActive = false,
   className,
+  slotName = "sidebar-menu-sub-button",
   ...props
 }) {
   const Comp = asChild ? Slot : "a";
   return /* @__PURE__ */ jsx(
     Comp,
     {
-      "data-slot": "sidebar-menu-sub-button",
       "data-sidebar": "menu-sub-button",
       "data-size": size,
       "data-active": isActive,
@@ -1281,11 +1337,12 @@ function SidebarMenuSubButton({
         "group-data-[collapsible=icon]:hidden",
         className
       ),
-      ...props
+      ...props,
+      "data-slot": slotName
     }
   );
 }
 
-export { Avatar, AvatarFallback, AvatarImage, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Collapsible, CollapsibleContent2 as CollapsibleContent, CollapsibleTrigger2 as CollapsibleTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Icon, Separator2 as Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, useIsMobile, useSidebar };
-//# sourceMappingURL=chunk-5MQWJVM2.js.map
-//# sourceMappingURL=chunk-5MQWJVM2.js.map
+export { Avatar, AvatarFallback, AvatarImage, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Collapsible, CollapsibleContent2 as CollapsibleContent, CollapsibleTrigger2 as CollapsibleTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Icon, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, useIsMobile, useSidebar };
+//# sourceMappingURL=chunk-QHZWW55M.js.map
+//# sourceMappingURL=chunk-QHZWW55M.js.map