@codefast/ui 0.3.10 → 0.3.11-canary.0

package/dist/components/context-menu.cjs

@@ -77,7 +77,7 @@ function ContextMenuRadioGroup({ ...props }) {
 }
 function ContextMenuSubTrigger({ children, className, inset, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(react_context_menu_namespaceObject.SubTrigger, {
-        className: (0, tailwind_variants_namespaceObject.cn)("focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center gap-x-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-inset:pl-8 [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
+        className: (0, tailwind_variants_namespaceObject.cn)("flex cursor-default items-center gap-x-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-inset:pl-8 data-[state=open]:bg-accent data-[state=open]:text-accent-foreground [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
         "data-inset": inset,
         "data-slot": "context-menu-sub-trigger",
         ...props,
@@ -92,7 +92,7 @@ function ContextMenuSubTrigger({ children, className, inset, ...props }) {
 function ContextMenuSubContent({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_context_menu_namespaceObject.Portal, {
         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_context_menu_namespaceObject.SubContent, {
-            className: (0, tailwind_variants_namespaceObject.cn)('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=open]:data-[side=top]:slide-in-from-bottom-2 data-[state=open]:data-[side=right]:slide-in-from-left-2 data-[state=open]:data-[side=bottom]:slide-in-from-top-2 data-[state=open]:data-[side=left]:slide-in-from-right-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=closed]:data-[side=top]:slide-out-to-bottom-2 data-[state=closed]:data-[side=right]:slide-out-to-left-2 data-[state=closed]:data-[side=bottom]:slide-out-to-top-2 data-[state=closed]:data-[side=left]:slide-out-to-right-2 ease-ui z-50 min-w-32 origin-(--radix-context-menu-content-transform-origin) overflow-hidden rounded-lg border p-1 shadow-lg', className),
+            className: (0, tailwind_variants_namespaceObject.cn)("z-50 min-w-32 origin-(--radix-context-menu-content-transform-origin) overflow-hidden rounded-lg border bg-popover p-1 text-popover-foreground shadow-lg ease-ui data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=closed]:data-[side=bottom]:slide-out-to-top-2 data-[state=closed]:data-[side=left]:slide-out-to-right-2 data-[state=closed]:data-[side=right]:slide-out-to-left-2 data-[state=closed]:data-[side=top]:slide-out-to-bottom-2 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=open]:data-[side=bottom]:slide-in-from-top-2 data-[state=open]:data-[side=left]:slide-in-from-right-2 data-[state=open]:data-[side=right]:slide-in-from-left-2 data-[state=open]:data-[side=top]:slide-in-from-bottom-2", className),
             "data-slot": "context-menu-sub-content",
             ...props
         })
@@ -101,7 +101,7 @@ function ContextMenuSubContent({ className, ...props }) {
 function ContextMenuContent({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_context_menu_namespaceObject.Portal, {
         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_context_menu_namespaceObject.Content, {
-            className: (0, tailwind_variants_namespaceObject.cn)('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=open]:data-[side=top]:slide-in-from-bottom-2 data-[state=open]:data-[side=right]:slide-in-from-left-2 data-[state=open]:data-[side=bottom]:slide-in-from-top-2 data-[state=open]:data-[side=left]:slide-in-from-right-2 ease-ui z-50 max-h-(--radix-context-menu-content-available-height) min-w-32 origin-(--radix-context-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-lg border p-1 shadow-lg', className),
+            className: (0, tailwind_variants_namespaceObject.cn)("z-50 max-h-(--radix-context-menu-content-available-height) min-w-32 origin-(--radix-context-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-lg border bg-popover p-1 text-popover-foreground shadow-lg ease-ui data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=open]:data-[side=bottom]:slide-in-from-top-2 data-[state=open]:data-[side=left]:slide-in-from-right-2 data-[state=open]:data-[side=right]:slide-in-from-left-2 data-[state=open]:data-[side=top]:slide-in-from-bottom-2", className),
             "data-slot": "context-menu-content",
             ...props
         })
@@ -109,7 +109,7 @@ function ContextMenuContent({ className, ...props }) {
 }
 function ContextMenuItem({ className, inset, variant, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_context_menu_namespaceObject.Item, {
-        className: (0, tailwind_variants_namespaceObject.cn)("focus:bg-accent focus:text-accent-foreground group/context-menu-item data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:[&_svg:not([class*='text-'])]:text-destructive/80 [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-x-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none aria-disabled:opacity-50 data-inset:pl-8 [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
+        className: (0, tailwind_variants_namespaceObject.cn)("group/context-menu-item relative flex cursor-default items-center gap-x-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground aria-disabled:opacity-50 data-inset:pl-8 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground data-[variant=destructive]:[&_svg:not([class*='text-'])]:text-destructive/80", className),
         "data-inset": inset,
         "data-slot": "context-menu-item",
         "data-variant": variant,
@@ -119,7 +119,7 @@ function ContextMenuItem({ className, inset, variant, ...props }) {
 function ContextMenuCheckboxItem({ checked, children, className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(react_context_menu_namespaceObject.CheckboxItem, {
         checked: checked,
-        className: (0, tailwind_variants_namespaceObject.cn)("focus:bg-accent focus:text-accent-foreground group/context-menu-item relative flex cursor-default items-center gap-x-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none aria-disabled:opacity-50 [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
+        className: (0, tailwind_variants_namespaceObject.cn)("group/context-menu-item relative flex cursor-default items-center gap-x-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground aria-disabled:opacity-50 [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
         "data-slot": "context-menu-checkbox-item",
         ...props,
         children: [
@@ -137,7 +137,7 @@ function ContextMenuCheckboxItem({ checked, children, className, ...props }) {
 }
 function ContextMenuRadioItem({ children, className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(react_context_menu_namespaceObject.RadioItem, {
-        className: (0, tailwind_variants_namespaceObject.cn)("focus:bg-accent focus:text-accent-foreground group/context-menu-item relative flex cursor-default items-center gap-x-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none aria-disabled:opacity-50 [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
+        className: (0, tailwind_variants_namespaceObject.cn)("group/context-menu-item relative flex cursor-default items-center gap-x-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground aria-disabled:opacity-50 [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
         "data-slot": "context-menu-radio-item",
         ...props,
         children: [
@@ -155,7 +155,7 @@ function ContextMenuRadioItem({ children, className, ...props }) {
 }
 function ContextMenuLabel({ className, inset, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_context_menu_namespaceObject.Label, {
-        className: (0, tailwind_variants_namespaceObject.cn)('flex items-center gap-x-2 px-2 py-1.5 text-sm font-semibold data-inset:pl-8', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("flex items-center gap-x-2 px-2 py-1.5 text-sm font-semibold data-inset:pl-8", className),
         "data-inset": inset,
         "data-slot": "context-menu-label",
         ...props
@@ -163,21 +163,21 @@ function ContextMenuLabel({ className, inset, ...props }) {
 }
 function ContextMenuSeparator({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_context_menu_namespaceObject.Separator, {
-        className: (0, tailwind_variants_namespaceObject.cn)('bg-border mx-2 my-1 h-px', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("mx-2 my-1 h-px bg-border", className),
         "data-slot": "context-menu-separator",
         ...props
     });
 }
 function ContextMenuShortcut({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
-        className: (0, tailwind_variants_namespaceObject.cn)('text-muted-foreground group-data-[variant=destructive]/context-menu-item:text-destructive/80 ml-auto text-xs tracking-widest', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("ml-auto text-xs tracking-widest text-muted-foreground group-data-[variant=destructive]/context-menu-item:text-destructive/80", className),
         "data-slot": "context-menu-shortcut",
         ...props
     });
 }
 function ContextMenuArrow({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_context_menu_namespaceObject.Arrow, {
-        className: (0, tailwind_variants_namespaceObject.cn)('fill-popover', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("fill-popover", className),
         "data-slot": "context-menu-arrow",
         ...props
     });

package/dist/components/context-menu.d.ts

@@ -1,5 +1,5 @@
-import type { ComponentProps, JSX } from 'react';
-import * as ContextMenuPrimitive from '@radix-ui/react-context-menu';
+import type { ComponentProps, JSX } from "react";
+import * as ContextMenuPrimitive from "@radix-ui/react-context-menu";
 type ContextMenuProps = ComponentProps<typeof ContextMenuPrimitive.Root>;
 declare function ContextMenu({ ...props }: ContextMenuProps): JSX.Element;
 type ContextMenuTriggerProps = ComponentProps<typeof ContextMenuPrimitive.Trigger>;
@@ -20,7 +20,7 @@ type ContextMenuContentProps = ComponentProps<typeof ContextMenuPrimitive.Conten
 declare function ContextMenuContent({ className, ...props }: ContextMenuContentProps): JSX.Element;
 interface ContextMenuItemProps extends ComponentProps<typeof ContextMenuPrimitive.Item> {
     inset?: boolean;
-    variant?: 'default' | 'destructive';
+    variant?: "default" | "destructive";
 }
 declare function ContextMenuItem({ className, inset, variant, ...props }: ContextMenuItemProps): JSX.Element;
 type ContextMenuCheckboxItemProps = ComponentProps<typeof ContextMenuPrimitive.CheckboxItem>;
@@ -33,7 +33,7 @@ interface ContextMenuLabelProps extends ComponentProps<typeof ContextMenuPrimiti
 declare function ContextMenuLabel({ className, inset, ...props }: ContextMenuLabelProps): JSX.Element;
 type ContextMenuSeparatorProps = ComponentProps<typeof ContextMenuPrimitive.Separator>;
 declare function ContextMenuSeparator({ className, ...props }: ContextMenuSeparatorProps): JSX.Element;
-type ContextMenuShortcutProps = ComponentProps<'span'>;
+type ContextMenuShortcutProps = ComponentProps<"span">;
 declare function ContextMenuShortcut({ className, ...props }: ContextMenuShortcutProps): JSX.Element;
 type ContextMenuArrowProps = ComponentProps<typeof ContextMenuPrimitive.Arrow>;
 declare function ContextMenuArrow({ className, ...props }: ContextMenuArrowProps): JSX.Element;

package/dist/components/context-menu.js

@@ -35,7 +35,7 @@ function ContextMenuRadioGroup({ ...props }) {
 }
 function ContextMenuSubTrigger({ children, className, inset, ...props }) {
     return /*#__PURE__*/ jsxs(SubTrigger, {
-        className: cn("focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center gap-x-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-inset:pl-8 [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
+        className: cn("flex cursor-default items-center gap-x-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-inset:pl-8 data-[state=open]:bg-accent data-[state=open]:text-accent-foreground [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
         "data-inset": inset,
         "data-slot": "context-menu-sub-trigger",
         ...props,
@@ -50,7 +50,7 @@ function ContextMenuSubTrigger({ children, className, inset, ...props }) {
 function ContextMenuSubContent({ className, ...props }) {
     return /*#__PURE__*/ jsx(Portal, {
         children: /*#__PURE__*/ jsx(SubContent, {
-            className: cn('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=open]:data-[side=top]:slide-in-from-bottom-2 data-[state=open]:data-[side=right]:slide-in-from-left-2 data-[state=open]:data-[side=bottom]:slide-in-from-top-2 data-[state=open]:data-[side=left]:slide-in-from-right-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=closed]:data-[side=top]:slide-out-to-bottom-2 data-[state=closed]:data-[side=right]:slide-out-to-left-2 data-[state=closed]:data-[side=bottom]:slide-out-to-top-2 data-[state=closed]:data-[side=left]:slide-out-to-right-2 ease-ui z-50 min-w-32 origin-(--radix-context-menu-content-transform-origin) overflow-hidden rounded-lg border p-1 shadow-lg', className),
+            className: cn("z-50 min-w-32 origin-(--radix-context-menu-content-transform-origin) overflow-hidden rounded-lg border bg-popover p-1 text-popover-foreground shadow-lg ease-ui data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=closed]:data-[side=bottom]:slide-out-to-top-2 data-[state=closed]:data-[side=left]:slide-out-to-right-2 data-[state=closed]:data-[side=right]:slide-out-to-left-2 data-[state=closed]:data-[side=top]:slide-out-to-bottom-2 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=open]:data-[side=bottom]:slide-in-from-top-2 data-[state=open]:data-[side=left]:slide-in-from-right-2 data-[state=open]:data-[side=right]:slide-in-from-left-2 data-[state=open]:data-[side=top]:slide-in-from-bottom-2", className),
             "data-slot": "context-menu-sub-content",
             ...props
         })
@@ -59,7 +59,7 @@ function ContextMenuSubContent({ className, ...props }) {
 function ContextMenuContent({ className, ...props }) {
     return /*#__PURE__*/ jsx(Portal, {
         children: /*#__PURE__*/ jsx(Content, {
-            className: cn('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=open]:data-[side=top]:slide-in-from-bottom-2 data-[state=open]:data-[side=right]:slide-in-from-left-2 data-[state=open]:data-[side=bottom]:slide-in-from-top-2 data-[state=open]:data-[side=left]:slide-in-from-right-2 ease-ui z-50 max-h-(--radix-context-menu-content-available-height) min-w-32 origin-(--radix-context-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-lg border p-1 shadow-lg', className),
+            className: cn("z-50 max-h-(--radix-context-menu-content-available-height) min-w-32 origin-(--radix-context-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-lg border bg-popover p-1 text-popover-foreground shadow-lg ease-ui data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=open]:data-[side=bottom]:slide-in-from-top-2 data-[state=open]:data-[side=left]:slide-in-from-right-2 data-[state=open]:data-[side=right]:slide-in-from-left-2 data-[state=open]:data-[side=top]:slide-in-from-bottom-2", className),
             "data-slot": "context-menu-content",
             ...props
         })
@@ -67,7 +67,7 @@ function ContextMenuContent({ className, ...props }) {
 }
 function ContextMenuItem({ className, inset, variant, ...props }) {
     return /*#__PURE__*/ jsx(Item, {
-        className: cn("focus:bg-accent focus:text-accent-foreground group/context-menu-item data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:[&_svg:not([class*='text-'])]:text-destructive/80 [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-x-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none aria-disabled:opacity-50 data-inset:pl-8 [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
+        className: cn("group/context-menu-item relative flex cursor-default items-center gap-x-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground aria-disabled:opacity-50 data-inset:pl-8 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground data-[variant=destructive]:[&_svg:not([class*='text-'])]:text-destructive/80", className),
         "data-inset": inset,
         "data-slot": "context-menu-item",
         "data-variant": variant,
@@ -77,7 +77,7 @@ function ContextMenuItem({ className, inset, variant, ...props }) {
 function ContextMenuCheckboxItem({ checked, children, className, ...props }) {
     return /*#__PURE__*/ jsxs(CheckboxItem, {
         checked: checked,
-        className: cn("focus:bg-accent focus:text-accent-foreground group/context-menu-item relative flex cursor-default items-center gap-x-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none aria-disabled:opacity-50 [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
+        className: cn("group/context-menu-item relative flex cursor-default items-center gap-x-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground aria-disabled:opacity-50 [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
         "data-slot": "context-menu-checkbox-item",
         ...props,
         children: [
@@ -95,7 +95,7 @@ function ContextMenuCheckboxItem({ checked, children, className, ...props }) {
 }
 function ContextMenuRadioItem({ children, className, ...props }) {
     return /*#__PURE__*/ jsxs(RadioItem, {
-        className: cn("focus:bg-accent focus:text-accent-foreground group/context-menu-item relative flex cursor-default items-center gap-x-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none aria-disabled:opacity-50 [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
+        className: cn("group/context-menu-item relative flex cursor-default items-center gap-x-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground aria-disabled:opacity-50 [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
         "data-slot": "context-menu-radio-item",
         ...props,
         children: [
@@ -113,7 +113,7 @@ function ContextMenuRadioItem({ children, className, ...props }) {
 }
 function ContextMenuLabel({ className, inset, ...props }) {
     return /*#__PURE__*/ jsx(Label, {
-        className: cn('flex items-center gap-x-2 px-2 py-1.5 text-sm font-semibold data-inset:pl-8', className),
+        className: cn("flex items-center gap-x-2 px-2 py-1.5 text-sm font-semibold data-inset:pl-8", className),
         "data-inset": inset,
         "data-slot": "context-menu-label",
         ...props
@@ -121,21 +121,21 @@ function ContextMenuLabel({ className, inset, ...props }) {
 }
 function ContextMenuSeparator({ className, ...props }) {
     return /*#__PURE__*/ jsx(Separator, {
-        className: cn('bg-border mx-2 my-1 h-px', className),
+        className: cn("mx-2 my-1 h-px bg-border", className),
         "data-slot": "context-menu-separator",
         ...props
     });
 }
 function ContextMenuShortcut({ className, ...props }) {
     return /*#__PURE__*/ jsx("span", {
-        className: cn('text-muted-foreground group-data-[variant=destructive]/context-menu-item:text-destructive/80 ml-auto text-xs tracking-widest', className),
+        className: cn("ml-auto text-xs tracking-widest text-muted-foreground group-data-[variant=destructive]/context-menu-item:text-destructive/80", className),
         "data-slot": "context-menu-shortcut",
         ...props
     });
 }
 function ContextMenuArrow({ className, ...props }) {
     return /*#__PURE__*/ jsx(Arrow, {
-        className: cn('fill-popover', className),
+        className: cn("fill-popover", className),
         "data-slot": "context-menu-arrow",
         ...props
     });

package/dist/components/dialog.cjs

@@ -56,26 +56,26 @@ function DialogContent({ children, className, classNames, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(react_dialog_namespaceObject.Portal, {
         children: [
             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_dialog_namespaceObject.Overlay, {
-                className: (0, tailwind_variants_namespaceObject.cn)('data-[state=open]:fade-in-0 data-[state=open]:animate-in data-[state=closed]:fade-out-0 data-[state=closed]:animate-out ease-ui fixed inset-0 z-50 bg-black/50', classNames?.overlay),
+                className: (0, tailwind_variants_namespaceObject.cn)("fixed inset-0 z-50 bg-black/50 ease-ui data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:animate-in data-[state=open]:fade-in-0", classNames?.overlay),
                 "data-slot": "dialog-overlay"
             }),
             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_dialog_namespaceObject.Content, {
-                className: (0, tailwind_variants_namespaceObject.cn)('data-[state=open]:animate-in max-sm:data-[state=open]:animation-duration-500 max-sm:data-[state=open]:slide-in-from-bottom sm:data-[state=open]:fade-in-0 sm:data-[state=open]:zoom-in-95 data-[state=closed]:animate-out max-sm:data-[state=closed]:animation-duration-500 max-sm:data-[state=closed]:slide-out-to-bottom sm:data-[state=closed]:fade-out-0 sm:data-[state=closed]:zoom-out-95 ease-ui fixed inset-0 z-50 grid grid-rows-[1fr_auto] justify-items-center overflow-auto sm:grid-rows-[1fr_auto_3fr] sm:p-4', classNames?.wrapper),
+                className: (0, tailwind_variants_namespaceObject.cn)("fixed inset-0 z-50 grid grid-rows-[1fr_auto] justify-items-center overflow-auto ease-ui data-[state=closed]:animate-out data-[state=open]:animate-in max-sm:data-[state=closed]:animation-duration-500 max-sm:data-[state=closed]:slide-out-to-bottom max-sm:data-[state=open]:animation-duration-500 max-sm:data-[state=open]:slide-in-from-bottom sm:grid-rows-[1fr_auto_3fr] sm:p-4 sm:data-[state=closed]:fade-out-0 sm:data-[state=closed]:zoom-out-95 sm:data-[state=open]:fade-in-0 sm:data-[state=open]:zoom-in-95", classNames?.wrapper),
                 "data-slot": "dialog-content-wrapper",
                 ...props,
                 children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
-                    className: (0, tailwind_variants_namespaceObject.cn)('bg-popover text-popover-foreground relative row-start-2 flex w-full flex-col rounded-t-2xl border shadow-lg sm:max-w-lg sm:rounded-2xl', classNames?.content, className),
+                    className: (0, tailwind_variants_namespaceObject.cn)("relative row-start-2 flex w-full flex-col rounded-t-2xl border bg-popover text-popover-foreground shadow-lg sm:max-w-lg sm:rounded-2xl", classNames?.content, className),
                     "data-slot": "dialog-content",
                     children: [
                         children,
                         /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(react_dialog_namespaceObject.Close, {
                             className: (0, external_button_cjs_namespaceObject.buttonVariants)({
                                 className: [
-                                    'absolute top-2.5 right-2.5 size-7',
+                                    "absolute top-2.5 right-2.5 size-7",
                                     classNames?.close
                                 ],
-                                size: 'icon',
-                                variant: 'ghost'
+                                size: "icon",
+                                variant: "ghost"
                             }),
                             "data-slot": "dialog-close",
                             children: [
@@ -96,40 +96,40 @@ function DialogContent({ children, className, classNames, ...props }) {
 }
 function DialogHeader({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("header", {
-        className: (0, tailwind_variants_namespaceObject.cn)('flex shrink-0 flex-col gap-1.5 px-6 pt-6 pb-2 text-center sm:text-left', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("flex shrink-0 flex-col gap-1.5 px-6 pt-6 pb-2 text-center sm:text-left", className),
         "data-slot": "dialog-header",
         ...props
     });
 }
 function DialogBody({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("main", {
-        className: (0, tailwind_variants_namespaceObject.cn)('overflow-auto px-6 py-2', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("overflow-auto px-6 py-2", className),
         "data-slot": "dialog-body",
         ...props
     });
 }
 function DialogFooter({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("footer", {
-        className: (0, tailwind_variants_namespaceObject.cn)('flex shrink-0 flex-col-reverse gap-2 px-6 pt-2 pb-6 sm:flex-row sm:justify-end', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("flex shrink-0 flex-col-reverse gap-2 px-6 pt-2 pb-6 sm:flex-row sm:justify-end", className),
         "data-slot": "dialog-footer",
         ...props
     });
 }
 function DialogTitle({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_dialog_namespaceObject.Title, {
-        className: (0, tailwind_variants_namespaceObject.cn)('text-lg leading-none font-semibold tracking-tight', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("text-lg leading-none font-semibold tracking-tight", className),
         "data-slot": "dialog-title",
         ...props
     });
 }
 function DialogDescription({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_dialog_namespaceObject.Description, {
-        className: (0, tailwind_variants_namespaceObject.cn)('text-muted-foreground text-sm', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("text-sm text-muted-foreground", className),
         "data-slot": "dialog-description",
         ...props
     });
 }
-function DialogClose({ className, size, variant = 'outline', ...props }) {
+function DialogClose({ className, size, variant = "outline", ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_dialog_namespaceObject.Close, {
         className: (0, external_button_cjs_namespaceObject.buttonVariants)({
             className,

package/dist/components/dialog.d.ts

@@ -1,7 +1,7 @@
-import type { VariantProps } from '@codefast/tailwind-variants';
-import type { ComponentProps, JSX } from 'react';
-import * as DialogPrimitive from '@radix-ui/react-dialog';
-import { buttonVariants } from './button';
+import type { VariantProps } from "@codefast/tailwind-variants";
+import type { ComponentProps, JSX } from "react";
+import * as DialogPrimitive from "@radix-ui/react-dialog";
+import { buttonVariants } from "./button";
 type DialogProps = ComponentProps<typeof DialogPrimitive.Root>;
 declare function Dialog({ ...props }: DialogProps): JSX.Element;
 type DialogTriggerProps = ComponentProps<typeof DialogPrimitive.Trigger>;
@@ -15,19 +15,19 @@ interface DialogContentProps extends ComponentProps<typeof DialogPrimitive.Conte
     };
 }
 declare function DialogContent({ children, className, classNames, ...props }: DialogContentProps): JSX.Element;
-type DialogHeaderProps = ComponentProps<'div'>;
+type DialogHeaderProps = ComponentProps<"div">;
 declare function DialogHeader({ className, ...props }: DialogHeaderProps): JSX.Element;
-type DialogBodyProps = ComponentProps<'div'>;
+type DialogBodyProps = ComponentProps<"div">;
 declare function DialogBody({ className, ...props }: DialogBodyProps): JSX.Element;
-type DialogFooterProps = ComponentProps<'div'>;
+type DialogFooterProps = ComponentProps<"div">;
 declare function DialogFooter({ className, ...props }: DialogFooterProps): JSX.Element;
 type DialogTitleProps = ComponentProps<typeof DialogPrimitive.Title>;
 declare function DialogTitle({ className, ...props }: DialogTitleProps): JSX.Element;
 type DialogDescriptionProps = ComponentProps<typeof DialogPrimitive.Description>;
 declare function DialogDescription({ className, ...props }: DialogDescriptionProps): JSX.Element;
-interface DialogCloseProps extends Omit<ComponentProps<typeof DialogPrimitive.Close>, 'ref'> {
-    size?: VariantProps<typeof buttonVariants>['size'];
-    variant?: VariantProps<typeof buttonVariants>['variant'];
+interface DialogCloseProps extends Omit<ComponentProps<typeof DialogPrimitive.Close>, "ref"> {
+    size?: VariantProps<typeof buttonVariants>["size"];
+    variant?: VariantProps<typeof buttonVariants>["variant"];
 }
 declare function DialogClose({ className, size, variant, ...props }: DialogCloseProps): JSX.Element;
 export { Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, };

package/dist/components/dialog.js

@@ -20,26 +20,26 @@ function DialogContent({ children, className, classNames, ...props }) {
     return /*#__PURE__*/ jsxs(Portal, {
         children: [
             /*#__PURE__*/ jsx(Overlay, {
-                className: cn('data-[state=open]:fade-in-0 data-[state=open]:animate-in data-[state=closed]:fade-out-0 data-[state=closed]:animate-out ease-ui fixed inset-0 z-50 bg-black/50', classNames?.overlay),
+                className: cn("fixed inset-0 z-50 bg-black/50 ease-ui data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:animate-in data-[state=open]:fade-in-0", classNames?.overlay),
                 "data-slot": "dialog-overlay"
             }),
             /*#__PURE__*/ jsx(Content, {
-                className: cn('data-[state=open]:animate-in max-sm:data-[state=open]:animation-duration-500 max-sm:data-[state=open]:slide-in-from-bottom sm:data-[state=open]:fade-in-0 sm:data-[state=open]:zoom-in-95 data-[state=closed]:animate-out max-sm:data-[state=closed]:animation-duration-500 max-sm:data-[state=closed]:slide-out-to-bottom sm:data-[state=closed]:fade-out-0 sm:data-[state=closed]:zoom-out-95 ease-ui fixed inset-0 z-50 grid grid-rows-[1fr_auto] justify-items-center overflow-auto sm:grid-rows-[1fr_auto_3fr] sm:p-4', classNames?.wrapper),
+                className: cn("fixed inset-0 z-50 grid grid-rows-[1fr_auto] justify-items-center overflow-auto ease-ui data-[state=closed]:animate-out data-[state=open]:animate-in max-sm:data-[state=closed]:animation-duration-500 max-sm:data-[state=closed]:slide-out-to-bottom max-sm:data-[state=open]:animation-duration-500 max-sm:data-[state=open]:slide-in-from-bottom sm:grid-rows-[1fr_auto_3fr] sm:p-4 sm:data-[state=closed]:fade-out-0 sm:data-[state=closed]:zoom-out-95 sm:data-[state=open]:fade-in-0 sm:data-[state=open]:zoom-in-95", classNames?.wrapper),
                 "data-slot": "dialog-content-wrapper",
                 ...props,
                 children: /*#__PURE__*/ jsxs("div", {
-                    className: cn('bg-popover text-popover-foreground relative row-start-2 flex w-full flex-col rounded-t-2xl border shadow-lg sm:max-w-lg sm:rounded-2xl', classNames?.content, className),
+                    className: cn("relative row-start-2 flex w-full flex-col rounded-t-2xl border bg-popover text-popover-foreground shadow-lg sm:max-w-lg sm:rounded-2xl", classNames?.content, className),
                     "data-slot": "dialog-content",
                     children: [
                         children,
                         /*#__PURE__*/ jsxs(Close, {
                             className: buttonVariants({
                                 className: [
-                                    'absolute top-2.5 right-2.5 size-7',
+                                    "absolute top-2.5 right-2.5 size-7",
                                     classNames?.close
                                 ],
-                                size: 'icon',
-                                variant: 'ghost'
+                                size: "icon",
+                                variant: "ghost"
                             }),
                             "data-slot": "dialog-close",
                             children: [
@@ -60,40 +60,40 @@ function DialogContent({ children, className, classNames, ...props }) {
 }
 function DialogHeader({ className, ...props }) {
     return /*#__PURE__*/ jsx("header", {
-        className: cn('flex shrink-0 flex-col gap-1.5 px-6 pt-6 pb-2 text-center sm:text-left', className),
+        className: cn("flex shrink-0 flex-col gap-1.5 px-6 pt-6 pb-2 text-center sm:text-left", className),
         "data-slot": "dialog-header",
         ...props
     });
 }
 function DialogBody({ className, ...props }) {
     return /*#__PURE__*/ jsx("main", {
-        className: cn('overflow-auto px-6 py-2', className),
+        className: cn("overflow-auto px-6 py-2", className),
         "data-slot": "dialog-body",
         ...props
     });
 }
 function DialogFooter({ className, ...props }) {
     return /*#__PURE__*/ jsx("footer", {
-        className: cn('flex shrink-0 flex-col-reverse gap-2 px-6 pt-2 pb-6 sm:flex-row sm:justify-end', className),
+        className: cn("flex shrink-0 flex-col-reverse gap-2 px-6 pt-2 pb-6 sm:flex-row sm:justify-end", className),
         "data-slot": "dialog-footer",
         ...props
     });
 }
 function DialogTitle({ className, ...props }) {
     return /*#__PURE__*/ jsx(Title, {
-        className: cn('text-lg leading-none font-semibold tracking-tight', className),
+        className: cn("text-lg leading-none font-semibold tracking-tight", className),
         "data-slot": "dialog-title",
         ...props
     });
 }
 function DialogDescription({ className, ...props }) {
     return /*#__PURE__*/ jsx(Description, {
-        className: cn('text-muted-foreground text-sm', className),
+        className: cn("text-sm text-muted-foreground", className),
         "data-slot": "dialog-description",
         ...props
     });
 }
-function DialogClose({ className, size, variant = 'outline', ...props }) {
+function DialogClose({ className, size, variant = "outline", ...props }) {
     return /*#__PURE__*/ jsx(Close, {
         className: buttonVariants({
             className,

package/dist/components/drawer.cjs

@@ -56,16 +56,16 @@ function DrawerContent({ children, className, classNames, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_vaul_namespaceObject.Drawer.Portal, {
         children: [
             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_vaul_namespaceObject.Drawer.Overlay, {
-                className: (0, tailwind_variants_namespaceObject.cn)('fixed inset-0 z-50 bg-black/50', classNames?.overlay),
+                className: (0, tailwind_variants_namespaceObject.cn)("fixed inset-0 z-50 bg-black/50", classNames?.overlay),
                 "data-slot": "drawer-overlay"
             }),
             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_vaul_namespaceObject.Drawer.Content, {
-                className: (0, tailwind_variants_namespaceObject.cn)('group/drawer-content bg-background fixed z-50 flex h-auto flex-col data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-2xl data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-2xl data-[vaul-drawer-direction=left]:sm:max-w-sm data-[vaul-drawer-direction=right]:sm:max-w-sm', classNames?.content, className),
+                className: (0, tailwind_variants_namespaceObject.cn)("group/drawer-content fixed z-50 flex h-auto flex-col bg-background data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-2xl data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-2xl data-[vaul-drawer-direction=left]:sm:max-w-sm data-[vaul-drawer-direction=right]:sm:max-w-sm", classNames?.content, className),
                 "data-slot": "drawer-content",
                 ...props,
                 children: [
                     /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-                        className: (0, tailwind_variants_namespaceObject.cn)('bg-muted mx-auto mt-4 hidden h-1.5 w-12 shrink-0 rounded-full group-data-[vaul-drawer-direction=bottom]/drawer-content:block', classNames?.handle)
+                        className: (0, tailwind_variants_namespaceObject.cn)("mx-auto mt-4 hidden h-1.5 w-12 shrink-0 rounded-full bg-muted group-data-[vaul-drawer-direction=bottom]/drawer-content:block", classNames?.handle)
                     }),
                     children
                 ]
@@ -75,40 +75,40 @@ function DrawerContent({ children, className, classNames, ...props }) {
 }
 function DrawerHeader({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-        className: (0, tailwind_variants_namespaceObject.cn)('flex flex-col gap-1.5 p-4', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("flex flex-col gap-1.5 p-4", className),
         "data-slot": "drawer-header",
         ...props
     });
 }
 function DrawerBody({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("main", {
-        className: (0, tailwind_variants_namespaceObject.cn)('overflow-auto px-4 py-2', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("overflow-auto px-4 py-2", className),
         "data-slot": "drawer-body",
         ...props
     });
 }
 function DrawerFooter({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-        className: (0, tailwind_variants_namespaceObject.cn)('mt-auto flex flex-col gap-2 p-4', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("mt-auto flex flex-col gap-2 p-4", className),
         "data-slot": "drawer-footer",
         ...props
     });
 }
 function DrawerTitle({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_vaul_namespaceObject.Drawer.Title, {
-        className: (0, tailwind_variants_namespaceObject.cn)('text-foreground font-semibold', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("font-semibold text-foreground", className),
         "data-slot": "drawer-title",
         ...props
     });
 }
 function DrawerDescription({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_vaul_namespaceObject.Drawer.Description, {
-        className: (0, tailwind_variants_namespaceObject.cn)('text-muted-foreground text-sm', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("text-sm text-muted-foreground", className),
         "data-slot": "drawer-description",
         ...props
     });
 }
-function DrawerClose({ className, size, variant = 'outline', ...props }) {
+function DrawerClose({ className, size, variant = "outline", ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_vaul_namespaceObject.Drawer.Close, {
         className: (0, external_button_cjs_namespaceObject.buttonVariants)({
             className,

package/dist/components/drawer.d.ts

@@ -1,7 +1,7 @@
-import type { VariantProps } from '@codefast/tailwind-variants';
-import type { ComponentProps, JSX } from 'react';
-import { Drawer as DrawerPrimitive } from 'vaul';
-import { buttonVariants } from './button';
+import type { VariantProps } from "@codefast/tailwind-variants";
+import type { ComponentProps, JSX } from "react";
+import { Drawer as DrawerPrimitive } from "vaul";
+import { buttonVariants } from "./button";
 type DrawerProps = ComponentProps<typeof DrawerPrimitive.Root>;
 declare function Drawer({ shouldScaleBackground, ...props }: DrawerProps): JSX.Element;
 type DrawerTriggerProps = ComponentProps<typeof DrawerPrimitive.Trigger>;
@@ -14,19 +14,19 @@ interface DrawerContentProps extends ComponentProps<typeof DrawerPrimitive.Conte
     };
 }
 declare function DrawerContent({ children, className, classNames, ...props }: DrawerContentProps): JSX.Element;
-type DrawerHeaderProps = ComponentProps<'div'>;
+type DrawerHeaderProps = ComponentProps<"div">;
 declare function DrawerHeader({ className, ...props }: DrawerHeaderProps): JSX.Element;
-type DrawerBodyProps = ComponentProps<'div'>;
+type DrawerBodyProps = ComponentProps<"div">;
 declare function DrawerBody({ className, ...props }: DrawerBodyProps): JSX.Element;
-type DrawerFooterProps = ComponentProps<'div'>;
+type DrawerFooterProps = ComponentProps<"div">;
 declare function DrawerFooter({ className, ...props }: DrawerFooterProps): JSX.Element;
 type DrawerTitleProps = ComponentProps<typeof DrawerPrimitive.Title>;
 declare function DrawerTitle({ className, ...props }: DrawerTitleProps): JSX.Element;
 type DrawerDescriptionProps = ComponentProps<typeof DrawerPrimitive.Description>;
 declare function DrawerDescription({ className, ...props }: DrawerDescriptionProps): JSX.Element;
 interface DrawerCloseProps extends ComponentProps<typeof DrawerPrimitive.Close> {
-    size?: VariantProps<typeof buttonVariants>['size'];
-    variant?: VariantProps<typeof buttonVariants>['variant'];
+    size?: VariantProps<typeof buttonVariants>["size"];
+    variant?: VariantProps<typeof buttonVariants>["variant"];
 }
 declare function DrawerClose({ className, size, variant, ...props }: DrawerCloseProps): JSX.Element;
 export { Drawer, DrawerBody, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerTitle, DrawerTrigger, };

package/dist/components/drawer.js

@@ -20,16 +20,16 @@ function DrawerContent({ children, className, classNames, ...props }) {
     return /*#__PURE__*/ jsxs(Drawer.Portal, {
         children: [
             /*#__PURE__*/ jsx(Drawer.Overlay, {
-                className: cn('fixed inset-0 z-50 bg-black/50', classNames?.overlay),
+                className: cn("fixed inset-0 z-50 bg-black/50", classNames?.overlay),
                 "data-slot": "drawer-overlay"
             }),
             /*#__PURE__*/ jsxs(Drawer.Content, {
-                className: cn('group/drawer-content bg-background fixed z-50 flex h-auto flex-col data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-2xl data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-2xl data-[vaul-drawer-direction=left]:sm:max-w-sm data-[vaul-drawer-direction=right]:sm:max-w-sm', classNames?.content, className),
+                className: cn("group/drawer-content fixed z-50 flex h-auto flex-col bg-background data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-2xl data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-2xl data-[vaul-drawer-direction=left]:sm:max-w-sm data-[vaul-drawer-direction=right]:sm:max-w-sm", classNames?.content, className),
                 "data-slot": "drawer-content",
                 ...props,
                 children: [
                     /*#__PURE__*/ jsx("div", {
-                        className: cn('bg-muted mx-auto mt-4 hidden h-1.5 w-12 shrink-0 rounded-full group-data-[vaul-drawer-direction=bottom]/drawer-content:block', classNames?.handle)
+                        className: cn("mx-auto mt-4 hidden h-1.5 w-12 shrink-0 rounded-full bg-muted group-data-[vaul-drawer-direction=bottom]/drawer-content:block", classNames?.handle)
                     }),
                     children
                 ]
@@ -39,40 +39,40 @@ function DrawerContent({ children, className, classNames, ...props }) {
 }
 function DrawerHeader({ className, ...props }) {
     return /*#__PURE__*/ jsx("div", {
-        className: cn('flex flex-col gap-1.5 p-4', className),
+        className: cn("flex flex-col gap-1.5 p-4", className),
         "data-slot": "drawer-header",
         ...props
     });
 }
 function DrawerBody({ className, ...props }) {
     return /*#__PURE__*/ jsx("main", {
-        className: cn('overflow-auto px-4 py-2', className),
+        className: cn("overflow-auto px-4 py-2", className),
         "data-slot": "drawer-body",
         ...props
     });
 }
 function DrawerFooter({ className, ...props }) {
     return /*#__PURE__*/ jsx("div", {
-        className: cn('mt-auto flex flex-col gap-2 p-4', className),
+        className: cn("mt-auto flex flex-col gap-2 p-4", className),
         "data-slot": "drawer-footer",
         ...props
     });
 }
 function DrawerTitle({ className, ...props }) {
     return /*#__PURE__*/ jsx(Drawer.Title, {
-        className: cn('text-foreground font-semibold', className),
+        className: cn("font-semibold text-foreground", className),
         "data-slot": "drawer-title",
         ...props
     });
 }
 function DrawerDescription({ className, ...props }) {
     return /*#__PURE__*/ jsx(Drawer.Description, {
-        className: cn('text-muted-foreground text-sm', className),
+        className: cn("text-sm text-muted-foreground", className),
         "data-slot": "drawer-description",
         ...props
     });
 }
-function DrawerClose({ className, size, variant = 'outline', ...props }) {
+function DrawerClose({ className, size, variant = "outline", ...props }) {
     return /*#__PURE__*/ jsx(Drawer.Close, {
         className: buttonVariants({
             className,