@codefast/ui 0.3.10 → 0.3.11-canary.1

package/dist/components/item.js

@@ -3,39 +3,39 @@ import { cn, tv } from "@codefast/tailwind-variants";
 import { Slot } from "@radix-ui/react-slot";
 import { Separator } from "./separator.js";
 const itemVariants = tv({
-    base: cn('group/item flex flex-wrap items-center rounded-lg border border-transparent text-sm transition-colors duration-100 outline-hidden', '[a]:transition-colors [a]:hover:bg-accent/50', 'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-3'),
+    base: cn("group/item flex flex-wrap items-center rounded-lg border border-transparent text-sm outline-hidden transition-colors duration-100", "[a]:transition-colors [a]:hover:bg-accent/50", "focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50"),
     defaultVariants: {
-        size: 'default',
-        variant: 'default'
+        size: "default",
+        variant: "default"
     },
     variants: {
         size: {
-            default: 'gap-4 p-4',
-            sm: 'gap-2.5 px-4 py-3'
+            default: "gap-4 p-4",
+            sm: "gap-2.5 px-4 py-3"
         },
         variant: {
-            default: 'bg-transparent',
-            muted: 'bg-muted/50',
-            outline: 'border-border'
+            default: "bg-transparent",
+            muted: "bg-muted/50",
+            outline: "border-border"
         }
     }
 });
 const itemMediaVariants = tv({
-    base: cn("group-has-[[data-slot=item-description]]/item:self-start flex shrink-0 items-center justify-center gap-2", "[&_svg]:pointer-events-none group-has-[[data-slot=item-description]]/item:translate-y-0.5"),
+    base: cn("flex shrink-0 items-center justify-center gap-2 group-has-[[data-slot=item-description]]/item:self-start", "group-has-[[data-slot=item-description]]/item:translate-y-0.5 [&_svg]:pointer-events-none"),
     defaultVariants: {
-        variant: 'default'
+        variant: "default"
     },
     variants: {
         variant: {
-            default: 'bg-transparent',
+            default: "bg-transparent",
             icon: "size-8 shrink-0 rounded-md border bg-muted [&_svg:not([class*='size-'])]:size-4",
-            image: 'size-10 shrink-0 overflow-hidden rounded-md [&_img]:size-full [&_img]:object-cover'
+            image: "size-10 shrink-0 overflow-hidden rounded-md [&_img]:size-full [&_img]:object-cover"
         }
     }
 });
 function ItemGroup({ className, ...props }) {
     return /*#__PURE__*/ jsx("div", {
-        className: cn('group/item-group flex flex-col', className),
+        className: cn("group/item-group flex flex-col", className),
         "data-slot": "item-group",
         role: "list",
         ...props
@@ -43,14 +43,14 @@ function ItemGroup({ className, ...props }) {
 }
 function ItemSeparator({ className, ...props }) {
     return /*#__PURE__*/ jsx(Separator, {
-        className: cn('my-0', className),
+        className: cn("my-0", className),
         "data-slot": "item-separator",
         orientation: "horizontal",
         ...props
     });
 }
-function Item({ asChild = false, className, size = 'default', variant = 'default', ...props }) {
-    const Component = asChild ? Slot : 'div';
+function Item({ asChild = false, className, size = "default", variant = "default", ...props }) {
+    const Component = asChild ? Slot : "div";
     return /*#__PURE__*/ jsx(Component, {
         className: itemVariants({
             className,
@@ -63,7 +63,7 @@ function Item({ asChild = false, className, size = 'default', variant = 'default
         ...props
     });
 }
-function ItemMedia({ className, variant = 'default', ...props }) {
+function ItemMedia({ className, variant = "default", ...props }) {
     return /*#__PURE__*/ jsx("div", {
         className: itemMediaVariants({
             className,
@@ -76,42 +76,42 @@ function ItemMedia({ className, variant = 'default', ...props }) {
 }
 function ItemContent({ className, ...props }) {
     return /*#__PURE__*/ jsx("div", {
-        className: cn('flex flex-1 flex-col gap-1 [&+[data-slot=item-content]]:flex-none', className),
+        className: cn("flex flex-1 flex-col gap-1 [&+[data-slot=item-content]]:flex-none", className),
         "data-slot": "item-content",
         ...props
     });
 }
 function ItemTitle({ className, ...props }) {
     return /*#__PURE__*/ jsx("div", {
-        className: cn('flex w-fit items-center gap-2 text-sm leading-snug font-medium', className),
+        className: cn("flex w-fit items-center gap-2 text-sm leading-snug font-medium", className),
         "data-slot": "item-title",
         ...props
     });
 }
 function ItemDescription({ className, ...props }) {
     return /*#__PURE__*/ jsx("p", {
-        className: cn('text-muted-foreground line-clamp-2 text-sm leading-normal font-normal text-balance', '[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4', className),
+        className: cn("line-clamp-2 text-sm leading-normal font-normal text-balance text-muted-foreground", "[&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary", className),
         "data-slot": "item-description",
         ...props
     });
 }
 function ItemActions({ className, ...props }) {
     return /*#__PURE__*/ jsx("div", {
-        className: cn('flex items-center gap-2', className),
+        className: cn("flex items-center gap-2", className),
         "data-slot": "item-actions",
         ...props
     });
 }
 function ItemHeader({ className, ...props }) {
     return /*#__PURE__*/ jsx("div", {
-        className: cn('flex basis-full items-center justify-between gap-2', className),
+        className: cn("flex basis-full items-center justify-between gap-2", className),
         "data-slot": "item-header",
         ...props
     });
 }
 function ItemFooter({ className, ...props }) {
     return /*#__PURE__*/ jsx("div", {
-        className: cn('flex basis-full items-center justify-between gap-2', className),
+        className: cn("flex basis-full items-center justify-between gap-2", className),
         "data-slot": "item-footer",
         ...props
     });

package/dist/components/kbd.d.ts

@@ -1,7 +1,7 @@
-import type { ComponentProps, JSX } from 'react';
-type KbdProps = ComponentProps<'kbd'>;
+import type { ComponentProps, JSX } from "react";
+type KbdProps = ComponentProps<"kbd">;
 declare function Kbd({ className, ...props }: KbdProps): JSX.Element;
-type KbdGroupProps = ComponentProps<'kbd'>;
+type KbdGroupProps = ComponentProps<"kbd">;
 declare function KbdGroup({ className, ...props }: KbdGroupProps): JSX.Element;
 export { Kbd, KbdGroup };
 export type { KbdGroupProps, KbdProps };

package/dist/components/kbd.js

@@ -2,14 +2,14 @@ import { jsx } from "react/jsx-runtime";
 import { cn } from "@codefast/tailwind-variants";
 function Kbd({ className, ...props }) {
     return /*#__PURE__*/ jsx("kbd", {
-        className: cn('bg-muted text-muted-foreground pointer-events-none inline-flex h-5 w-fit min-w-5 items-center justify-center gap-1 rounded-md px-1 font-sans text-xs font-medium select-none', "[&_svg:not([class*='size-'])]:size-3", '[[data-slot=tooltip-content]_&]:bg-background/20 [[data-slot=tooltip-content]_&]:text-background dark:[[data-slot=tooltip-content]_&]:bg-background/10', className),
+        className: cn("pointer-events-none inline-flex h-5 w-fit min-w-5 items-center justify-center gap-1 rounded-md bg-muted px-1 font-sans text-xs font-medium text-muted-foreground select-none", "[&_svg:not([class*='size-'])]:size-3", "[[data-slot=tooltip-content]_&]:bg-background/20 [[data-slot=tooltip-content]_&]:text-background dark:[[data-slot=tooltip-content]_&]:bg-background/10", className),
         "data-slot": "kbd",
         ...props
     });
 }
 function KbdGroup({ className, ...props }) {
     return /*#__PURE__*/ jsx("kbd", {
-        className: cn('inline-flex items-center gap-1', className),
+        className: cn("inline-flex items-center gap-1", className),
         "data-slot": "kbd-group",
         ...props
     });

package/dist/components/label.d.ts

@@ -1,5 +1,5 @@
-import type { ComponentProps, JSX } from 'react';
-import * as LabelPrimitive from '@radix-ui/react-label';
+import type { ComponentProps, JSX } from "react";
+import * as LabelPrimitive from "@radix-ui/react-label";
 type LabelProps = ComponentProps<typeof LabelPrimitive.Root>;
 declare function Label({ className, ...props }: LabelProps): JSX.Element;
 export { Label };

package/dist/components/label.js

@@ -4,7 +4,7 @@ import { cn } from "@codefast/tailwind-variants";
 import { Root } from "@radix-ui/react-label";
 function Label({ className, ...props }) {
     return /*#__PURE__*/ jsx(Root, {
-        className: cn('data-invalid:text-destructive peer-aria-invalid:text-destructive inline-block text-sm leading-none font-medium group-data-disabled:opacity-50 peer-disabled:opacity-50 peer-data-disabled:opacity-50', className),
+        className: cn("inline-block text-sm leading-none font-medium group-data-disabled:opacity-50 peer-disabled:opacity-50 peer-aria-invalid:text-destructive peer-data-disabled:opacity-50 data-invalid:text-destructive", className),
         "data-slot": "label",
         ...props
     });

package/dist/components/menubar.d.ts

@@ -1,5 +1,5 @@
-import type { ComponentProps, JSX } from 'react';
-import * as MenubarPrimitive from '@radix-ui/react-menubar';
+import type { ComponentProps, JSX } from "react";
+import * as MenubarPrimitive from "@radix-ui/react-menubar";
 type MenubarProps = ComponentProps<typeof MenubarPrimitive.Root>;
 declare function Menubar({ className, ...props }: MenubarProps): JSX.Element;
 type MenubarMenuProps = ComponentProps<typeof MenubarPrimitive.Menu>;
@@ -22,7 +22,7 @@ type MenubarContentProps = ComponentProps<typeof MenubarPrimitive.Content>;
 declare function MenubarContent({ align, alignOffset, className, sideOffset, ...props }: MenubarContentProps): JSX.Element;
 interface MenubarItemProps extends ComponentProps<typeof MenubarPrimitive.Item> {
     inset?: boolean;
-    variant?: 'default' | 'destructive';
+    variant?: "default" | "destructive";
 }
 declare function MenubarItem({ className, inset, variant, ...props }: MenubarItemProps): JSX.Element;
 type MenubarCheckboxItemProps = ComponentProps<typeof MenubarPrimitive.CheckboxItem>;
@@ -35,7 +35,7 @@ interface MenubarLabelProps extends ComponentProps<typeof MenubarPrimitive.Label
 declare function MenubarLabel({ className, inset, ...props }: MenubarLabelProps): JSX.Element;
 type MenubarSeparatorProps = ComponentProps<typeof MenubarPrimitive.Separator>;
 declare function MenubarSeparator({ className, ...props }: MenubarSeparatorProps): JSX.Element;
-type MenubarShortcutProps = ComponentProps<'span'>;
+type MenubarShortcutProps = ComponentProps<"span">;
 declare function MenubarShortcut({ className, ...props }: MenubarShortcutProps): JSX.Element;
 type MenubarArrowProps = ComponentProps<typeof MenubarPrimitive.Arrow>;
 declare function MenubarArrow({ className, ...props }: MenubarArrowProps): JSX.Element;

package/dist/components/menubar.js

@@ -5,7 +5,7 @@ import { Arrow, CheckboxItem, Content, Group, Item, ItemIndicator, Label, Menu,
 import { CheckIcon, ChevronRightIcon, DotIcon } from "lucide-react";
 function Menubar({ className, ...props }) {
     return /*#__PURE__*/ jsx(Root, {
-        className: cn('bg-background flex items-center space-x-1 rounded-lg border p-1', className),
+        className: cn("flex items-center space-x-1 rounded-lg border bg-background p-1", className),
         "data-slot": "menubar",
         ...props
     });
@@ -36,14 +36,14 @@ function MenubarRadioGroup({ ...props }) {
 }
 function MenubarTrigger({ className, ...props }) {
     return /*#__PURE__*/ jsx(Trigger, {
-        className: cn('focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex items-center gap-x-2 rounded-sm px-2 py-1.5 text-sm font-medium outline-hidden select-none', className),
+        className: cn("flex items-center gap-x-2 rounded-sm px-2 py-1.5 text-sm font-medium outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground", className),
         "data-slot": "menubar-trigger",
         ...props
     });
 }
 function MenubarSubTrigger({ 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', 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", className),
         "data-inset": inset,
         "data-slot": "menubar-sub-trigger",
         ...props,
@@ -58,18 +58,18 @@ function MenubarSubTrigger({ children, className, inset, ...props }) {
 function MenubarSubContent({ 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-menubar-content-transform-origin) overflow-hidden rounded-lg border p-1 shadow-lg', className),
+            className: cn("z-50 min-w-32 origin-(--radix-menubar-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": "menubar-sub-content",
             ...props
         })
     });
 }
-function MenubarContent({ align = 'start', alignOffset = -4, className, sideOffset = 4, ...props }) {
+function MenubarContent({ align = "start", alignOffset = -4, className, sideOffset = 4, ...props }) {
     return /*#__PURE__*/ jsx(Portal, {
         children: /*#__PURE__*/ jsx(Content, {
             align: align,
             alignOffset: alignOffset,
-            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 min-w-32 origin-(--radix-menubar-content-transform-origin) overflow-hidden rounded-lg border p-1 shadow-lg', className),
+            className: cn("z-50 min-w-32 origin-(--radix-menubar-content-transform-origin) overflow-hidden 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": "menubar-content",
             sideOffset: sideOffset,
             ...props
@@ -78,7 +78,7 @@ function MenubarContent({ align = 'start', alignOffset = -4, className, sideOffs
 }
 function MenubarItem({ className, inset, variant, ...props }) {
     return /*#__PURE__*/ jsx(Item, {
-        className: cn("focus:bg-accent focus:text-accent-foreground group/menubar-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/menubar-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": "menubar-item",
         "data-variant": variant,
@@ -88,7 +88,7 @@ function MenubarItem({ className, inset, variant, ...props }) {
 function MenubarCheckboxItem({ checked, children, className, ...props }) {
     return /*#__PURE__*/ jsxs(CheckboxItem, {
         checked: checked,
-        className: cn("focus:bg-accent focus:text-accent-foreground group/menubar-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/menubar-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": "menubar-checkbox-item",
         ...props,
         children: [
@@ -106,7 +106,7 @@ function MenubarCheckboxItem({ checked, children, className, ...props }) {
 }
 function MenubarRadioItem({ children, className, ...props }) {
     return /*#__PURE__*/ jsxs(RadioItem, {
-        className: cn("focus:bg-accent focus:text-accent-foreground group/menubar-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/menubar-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": "menubar-radio-item",
         ...props,
         children: [
@@ -124,7 +124,7 @@ function MenubarRadioItem({ children, className, ...props }) {
 }
 function MenubarLabel({ 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": "menubar-label",
         ...props
@@ -132,21 +132,21 @@ function MenubarLabel({ className, inset, ...props }) {
 }
 function MenubarSeparator({ 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": "menubar-separator",
         ...props
     });
 }
 function MenubarShortcut({ className, ...props }) {
     return /*#__PURE__*/ jsx("span", {
-        className: cn('text-muted-foreground group-data-[variant=destructive]/menubar-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]/menubar-item:text-destructive/80", className),
         "data-slot": "menubar-shortcut",
         ...props
     });
 }
 function MenubarArrow({ className, ...props }) {
     return /*#__PURE__*/ jsx(Arrow, {
-        className: cn('fill-popover', className),
+        className: cn("fill-popover", className),
         "data-slot": "menubar-arrow",
         ...props
     });

package/dist/components/native-select.d.ts

@@ -1,9 +1,9 @@
-import type { ComponentProps, JSX } from 'react';
-type NativeSelectProps = ComponentProps<'select'>;
+import type { ComponentProps, JSX } from "react";
+type NativeSelectProps = ComponentProps<"select">;
 declare function NativeSelect({ className, ...props }: NativeSelectProps): JSX.Element;
-type NativeSelectOptionProps = ComponentProps<'option'>;
+type NativeSelectOptionProps = ComponentProps<"option">;
 declare function NativeSelectOption({ ...props }: NativeSelectOptionProps): JSX.Element;
-type NativeSelectOptGroupProps = ComponentProps<'optgroup'>;
+type NativeSelectOptGroupProps = ComponentProps<"optgroup">;
 declare function NativeSelectOptGroup({ className, ...props }: NativeSelectOptGroupProps): JSX.Element;
 export { NativeSelect, NativeSelectOptGroup, NativeSelectOption };
 export type { NativeSelectOptGroupProps, NativeSelectOptionProps, NativeSelectProps };

package/dist/components/native-select.js

@@ -7,13 +7,13 @@ function NativeSelect({ className, ...props }) {
         "data-slot": "native-select-wrapper",
         children: [
             /*#__PURE__*/ jsx("select", {
-                className: cn('border-input placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 dark:hover:bg-input/50 h-9 w-full min-w-0 appearance-none rounded-lg border bg-transparent px-3 py-2 pr-9 text-sm shadow-xs transition-[color,box-shadow] outline-none disabled:pointer-events-none disabled:cursor-not-allowed', 'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-3', 'aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive', className),
+                className: cn("h-9 w-full min-w-0 appearance-none rounded-lg border border-input bg-transparent px-3 py-2 pr-9 text-sm shadow-xs transition-[color,box-shadow] outline-none selection:bg-primary selection:text-primary-foreground placeholder:text-muted-foreground disabled:pointer-events-none disabled:cursor-not-allowed dark:bg-input/30 dark:hover:bg-input/50", "focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50", "aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40", className),
                 "data-slot": "native-select",
                 ...props
             }),
             /*#__PURE__*/ jsx(ChevronDownIcon, {
                 "aria-hidden": "true",
-                className: "text-muted-foreground pointer-events-none absolute top-1/2 right-3.5 size-4 -translate-y-1/2 opacity-50 select-none",
+                className: "pointer-events-none absolute top-1/2 right-3.5 size-4 -translate-y-1/2 text-muted-foreground opacity-50 select-none",
                 "data-slot": "native-select-icon"
             })
         ]

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

@@ -1,5 +1,5 @@
-import type { ComponentProps, JSX } from 'react';
-import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
+import type { ComponentProps, JSX } from "react";
+import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu";
 declare const navigationMenuTriggerVariants: import("@codefast/tailwind-variants").VariantFunctionType<import("@codefast/tailwind-variants").ConfigurationSchema, Record<string, never>>;
 interface NavigationMenuProps extends ComponentProps<typeof NavigationMenuPrimitive.Root> {
     viewport?: boolean;

package/dist/components/navigation-menu.js

@@ -5,13 +5,13 @@ import { ChevronDownIcon } from "lucide-react";
 import { buttonVariants } from "./button.js";
 const navigationMenuTriggerVariants = tv({
     base: buttonVariants({
-        className: 'data-[state=open]:bg-secondary/50 data-[state=open]:text-secondary-foreground group/navigation-menu-trigger focus-visible:bg-secondary dark:hover:not-disabled:bg-secondary',
-        variant: 'ghost'
+        className: "data-[state=open]:bg-secondary/50 data-[state=open]:text-secondary-foreground group/navigation-menu-trigger focus-visible:bg-secondary dark:hover:not-disabled:bg-secondary",
+        variant: "ghost"
     })
 });
 function NavigationMenu({ children, className, viewport = true, ...props }) {
     return /*#__PURE__*/ jsxs(Root, {
-        className: cn('group/navigation-menu relative flex max-w-max flex-1 items-center justify-center', className),
+        className: cn("group/navigation-menu relative flex max-w-max flex-1 items-center justify-center", className),
         "data-slot": "navigation-menu",
         "data-viewport": viewport,
         ...props,
@@ -23,7 +23,7 @@ function NavigationMenu({ children, className, viewport = true, ...props }) {
 }
 function NavigationMenuList({ children, className, ...props }) {
     return /*#__PURE__*/ jsxs(List, {
-        className: cn('flex flex-1 list-none items-center justify-center gap-1', className),
+        className: cn("flex flex-1 list-none items-center justify-center gap-1", className),
         "data-slot": "navigation-menu-list",
         ...props,
         children: [
@@ -36,7 +36,7 @@ function NavigationMenuList({ children, className, ...props }) {
 }
 function NavigationMenuItem({ className, ...props }) {
     return /*#__PURE__*/ jsx(Item, {
-        className: cn('group-data-[viewport=false]/navigation-menu:relative', className),
+        className: cn("group-data-[viewport=false]/navigation-menu:relative", className),
         "data-slot": "navigation-menu-item",
         ...props
     });
@@ -59,14 +59,14 @@ function NavigationMenuTrigger({ children, className, ...props }) {
 }
 function NavigationMenuContent({ className, ...props }) {
     return /*#__PURE__*/ jsx(Content, {
-        className: cn('data-[motion^=from-]:animate-in data-[motion^=from-]:fade-in-0 data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion^=to-]:animate-out data-[motion^=to-]:fade-out-0 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:data-[state=open]:animate-in group-data-[viewport=false]/navigation-menu:data-[state=closed]:animate-out group-data-[viewport=false]/navigation-menu:data-[state=closed]:zoom-out-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:zoom-in-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:fade-in-0 group-data-[viewport=false]/navigation-menu:data-[state=closed]:fade-out-0 ease-ui top-0 left-0 w-full group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-2 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-lg group-data-[viewport=false]/navigation-menu:border group-data-[viewport=false]/navigation-menu:p-1 group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=true]/navigation-menu:p-2 md:absolute md:w-auto', className),
+        className: cn("top-0 left-0 w-full ease-ui group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-2 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-lg group-data-[viewport=false]/navigation-menu:border group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:p-1 group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=true]/navigation-menu:p-2 data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 data-[motion^=from-]:animate-in data-[motion^=from-]:fade-in-0 data-[motion^=to-]:animate-out data-[motion^=to-]:fade-out-0 group-data-[viewport=false]/navigation-menu:data-[state=closed]:animate-out group-data-[viewport=false]/navigation-menu:data-[state=closed]:fade-out-0 group-data-[viewport=false]/navigation-menu:data-[state=closed]:zoom-out-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:animate-in group-data-[viewport=false]/navigation-menu:data-[state=open]:fade-in-0 group-data-[viewport=false]/navigation-menu:data-[state=open]:zoom-in-95 md:absolute md:w-auto", className),
         "data-slot": "navigation-menu-content",
         ...props
     });
 }
 function NavigationMenuLink({ className, ...props }) {
     return /*#__PURE__*/ jsx(Link, {
-        className: cn("data-[active=true]:focus:bg-accent data-[active=true]:hover:bg-accent data-[active=true]:bg-accent/50 data-[active=true]:text-accent-foreground hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:[&_svg:not([class*='text-'])]:text-destructive/80 [&_svg:not([class*='text-'])]:text-muted-foreground flex flex-col gap-1 rounded-sm p-2 text-sm outline-hidden transition [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
+        className: cn("flex flex-col gap-1 rounded-sm p-2 text-sm outline-hidden transition hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground data-[active=true]:bg-accent/50 data-[active=true]:text-accent-foreground data-[active=true]:hover:bg-accent data-[active=true]:focus:bg-accent [&_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-slot": "navigation-menu-link",
         ...props
     });
@@ -75,7 +75,7 @@ function NavigationMenuViewport({ className, ...props }) {
     return /*#__PURE__*/ jsx("div", {
         className: "absolute top-full left-0 z-30 flex justify-center perspective-distant",
         children: /*#__PURE__*/ jsx(Viewport, {
-            className: cn('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-90 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 ease-ui relative mt-2 min-h-[calc(var(--radix-navigation-menu-viewport-height)+2px)] w-full origin-[top_center] overflow-hidden rounded-lg border shadow-lg transition-[width,height] sm:min-w-[calc(var(--radix-navigation-menu-viewport-width)+2px)]', className),
+            className: cn("relative mt-2 min-h-[calc(var(--radix-navigation-menu-viewport-height)+2px)] w-full origin-[top_center] overflow-hidden rounded-lg border bg-popover text-popover-foreground shadow-lg transition-[width,height] ease-ui data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-90 sm:min-w-[calc(var(--radix-navigation-menu-viewport-width)+2px)]", className),
             "data-slot": "navigation-menu-viewport",
             ...props
         })
@@ -83,11 +83,11 @@ function NavigationMenuViewport({ className, ...props }) {
 }
 function NavigationMenuIndicator({ className, ...props }) {
     return /*#__PURE__*/ jsx(Indicator, {
-        className: cn('data-[state=visible]:fade-in-0 ease-ui data-[state=visible]:animate-in data-[state=hidden]:fade-out-0 data-[state=hidden]:animate-out top-full z-10 flex h-2 items-center justify-center overflow-hidden', className),
+        className: cn("top-full z-10 flex h-2 items-center justify-center overflow-hidden ease-ui data-[state=hidden]:animate-out data-[state=hidden]:fade-out-0 data-[state=visible]:animate-in data-[state=visible]:fade-in-0", className),
         "data-slot": "navigation-menu-indicator",
         ...props,
         children: /*#__PURE__*/ jsx("div", {
-            className: "bg-popover text-popover-foreground relative top-[60%] size-2.5 rotate-45 rounded-tl-xs"
+            className: "relative top-[60%] size-2.5 rotate-45 rounded-tl-xs bg-popover text-popover-foreground"
         })
     });
 }

package/dist/components/pagination.d.ts

@@ -1,25 +1,25 @@
-import type { VariantProps } from '@codefast/tailwind-variants';
-import type { ComponentProps, JSX } from 'react';
-import { buttonVariants } from './button';
-type PaginationProps = ComponentProps<'nav'>;
+import type { VariantProps } from "@codefast/tailwind-variants";
+import type { ComponentProps, JSX } from "react";
+import { buttonVariants } from "./button";
+type PaginationProps = ComponentProps<"nav">;
 declare function Pagination({ className, ...props }: PaginationProps): JSX.Element;
-type PaginationContentProps = ComponentProps<'ul'>;
+type PaginationContentProps = ComponentProps<"ul">;
 declare function PaginationContent({ className, ...props }: PaginationContentProps): JSX.Element;
-type PaginationItemProps = ComponentProps<'li'>;
+type PaginationItemProps = ComponentProps<"li">;
 declare function PaginationItem(props: PaginationItemProps): JSX.Element;
-interface PaginationLinkProps extends ComponentProps<'a'>, Pick<VariantProps<typeof buttonVariants>, 'size'> {
+interface PaginationLinkProps extends ComponentProps<"a">, Pick<VariantProps<typeof buttonVariants>, "size"> {
     isActive?: boolean;
 }
 declare function PaginationLink({ children, className, isActive, size, ...props }: PaginationLinkProps): JSX.Element;
-interface PaginationPreviousProps extends ComponentProps<'a'>, Pick<VariantProps<typeof buttonVariants>, 'size'> {
+interface PaginationPreviousProps extends ComponentProps<"a">, Pick<VariantProps<typeof buttonVariants>, "size"> {
     isActive?: boolean;
 }
 declare function PaginationPrevious({ ...props }: PaginationPreviousProps): JSX.Element;
-interface PaginationNextProps extends ComponentProps<'a'>, Pick<VariantProps<typeof buttonVariants>, 'size'> {
+interface PaginationNextProps extends ComponentProps<"a">, Pick<VariantProps<typeof buttonVariants>, "size"> {
     isActive?: boolean;
 }
 declare function PaginationNext({ ...props }: PaginationNextProps): JSX.Element;
-type PaginationEllipsisProps = ComponentProps<'span'>;
+type PaginationEllipsisProps = ComponentProps<"span">;
 declare function PaginationEllipsis({ className, ...props }: PaginationEllipsisProps): JSX.Element;
 export { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, };
 export type { PaginationContentProps, PaginationEllipsisProps, PaginationItemProps, PaginationLinkProps, PaginationNextProps, PaginationPreviousProps, PaginationProps, };

package/dist/components/pagination.js

@@ -5,14 +5,14 @@ import { buttonVariants } from "./button.js";
 function Pagination({ className, ...props }) {
     return /*#__PURE__*/ jsx("nav", {
         "aria-label": "pagination",
-        className: cn('mx-auto flex w-full justify-center', className),
+        className: cn("mx-auto flex w-full justify-center", className),
         "data-slot": "pagination",
         ...props
     });
 }
 function PaginationContent({ className, ...props }) {
     return /*#__PURE__*/ jsx("ul", {
-        className: cn('flex flex-row items-center gap-1', className),
+        className: cn("flex flex-row items-center gap-1", className),
         "data-slot": "pagination-content",
         ...props
     });
@@ -23,13 +23,13 @@ function PaginationItem(props) {
         ...props
     });
 }
-function PaginationLink({ children, className, isActive, size = 'icon', ...props }) {
+function PaginationLink({ children, className, isActive, size = "icon", ...props }) {
     return /*#__PURE__*/ jsx("a", {
-        "aria-current": isActive ? 'page' : void 0,
+        "aria-current": isActive ? "page" : void 0,
         className: buttonVariants({
             className,
             size,
-            variant: isActive ? 'outline' : 'ghost'
+            variant: isActive ? "outline" : "ghost"
         }),
         "data-slot": "pagination-link",
         ...props,
@@ -69,7 +69,7 @@ function PaginationNext({ ...props }) {
 function PaginationEllipsis({ className, ...props }) {
     return /*#__PURE__*/ jsxs("span", {
         "aria-hidden": true,
-        className: cn('flex size-10 items-center justify-center', className),
+        className: cn("flex size-10 items-center justify-center", className),
         "data-slot": "pagination-ellipsis",
         ...props,
         children: [

package/dist/components/popover.d.ts

@@ -1,5 +1,5 @@
-import type { ComponentProps, JSX } from 'react';
-import * as PopoverPrimitive from '@radix-ui/react-popover';
+import type { ComponentProps, JSX } from "react";
+import * as PopoverPrimitive from "@radix-ui/react-popover";
 type PopoverProps = ComponentProps<typeof PopoverPrimitive.Root>;
 declare function Popover({ ...props }: PopoverProps): JSX.Element;
 type PopoverTriggerProps = ComponentProps<typeof PopoverPrimitive.Trigger>;
@@ -11,4 +11,4 @@ declare function PopoverContent({ align, className, sideOffset, ...props }: Popo
 type PopoverArrowProps = ComponentProps<typeof PopoverPrimitive.Arrow>;
 declare function PopoverArrow({ className, ...props }: PopoverArrowProps): JSX.Element;
 export { Popover, PopoverAnchor, PopoverArrow, PopoverContent, PopoverTrigger };
-export type { PopoverAnchorProps, PopoverArrowProps, PopoverContentProps, PopoverProps, PopoverTriggerProps };
+export type { PopoverAnchorProps, PopoverArrowProps, PopoverContentProps, PopoverProps, PopoverTriggerProps, };

package/dist/components/popover.js

@@ -20,11 +20,11 @@ function PopoverAnchor({ ...props }) {
         ...props
     });
 }
-function PopoverContent({ align = 'center', className, sideOffset = 4, ...props }) {
+function PopoverContent({ align = "center", className, sideOffset = 4, ...props }) {
     return /*#__PURE__*/ jsx(Portal, {
         children: /*#__PURE__*/ jsx(Content, {
             align: align,
-            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-popover-content-transform-origin) rounded-lg border p-4 shadow-lg outline-hidden', className),
+            className: cn("z-50 min-w-32 origin-(--radix-popover-content-transform-origin) rounded-lg border bg-popover p-4 text-popover-foreground shadow-lg outline-hidden 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": "popover-content",
             sideOffset: sideOffset,
             ...props
@@ -33,7 +33,7 @@ function PopoverContent({ align = 'center', className, sideOffset = 4, ...props
 }
 function PopoverArrow({ className, ...props }) {
     return /*#__PURE__*/ jsx(Arrow, {
-        className: cn('fill-popover', className),
+        className: cn("fill-popover", className),
         "data-slot": "popover-arrow",
         ...props
     });

package/dist/components/progress-circle.d.ts

@@ -1,6 +1,6 @@
-import type { VariantProps } from '@codefast/tailwind-variants';
-import type { ComponentProps, JSX } from 'react';
-import * as ProgressCirclePrimitive from '../primitives/progress-circle';
+import type { VariantProps } from "@codefast/tailwind-variants";
+import type { ComponentProps, JSX } from "react";
+import * as ProgressCirclePrimitive from "../primitives/progress-circle";
 declare const progressCircleVariants: import("@codefast/tailwind-variants").VariantFunctionType<{
     size: {
         sm: {
@@ -15,7 +15,7 @@ declare const progressCircleVariants: import("@codefast/tailwind-variants").Vari
         xl: {
             label: string;
         };
-        '2xl': {
+        "2xl": {
             label: string;
         };
     };
@@ -41,7 +41,7 @@ declare const progressCircleVariants: import("@codefast/tailwind-variants").Vari
     svg: string;
     track: string;
 }>;
-interface ProgressCircleProps extends Omit<ComponentProps<typeof ProgressCirclePrimitive.Provider>, 'children' | 'size'>, VariantProps<typeof progressCircleVariants> {
+interface ProgressCircleProps extends Omit<ComponentProps<typeof ProgressCirclePrimitive.Provider>, "children" | "size">, VariantProps<typeof progressCircleVariants> {
     /**
      * Enables animation effect when value changes
      */