@codefast/ui 0.3.10 → 0.3.11-canary.0

package/dist/components/button-group.cjs

@@ -35,14 +35,14 @@ const tailwind_variants_namespaceObject = require("@codefast/tailwind-variants")
 const react_slot_namespaceObject = require("@radix-ui/react-slot");
 const external_separator_cjs_namespaceObject = require("./separator.cjs");
 const buttonGroupVariants = (0, tailwind_variants_namespaceObject.tv)({
-    base: (0, tailwind_variants_namespaceObject.cn)('flex w-fit items-stretch has-[>[data-slot=button-group]]:gap-2', "[&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit", '[&>*]:focus-visible:relative [&>*]:focus-visible:z-10 [&>input]:flex-1', 'has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-lg'),
+    base: (0, tailwind_variants_namespaceObject.cn)("flex w-fit items-stretch has-[>[data-slot=button-group]]:gap-2", "[&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit", "[&>*]:focus-visible:relative [&>*]:focus-visible:z-10 [&>input]:flex-1", "has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-lg"),
     defaultVariants: {
-        orientation: 'horizontal'
+        orientation: "horizontal"
     },
     variants: {
         orientation: {
-            horizontal: '[&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none',
-            vertical: 'flex-col [&>*:not(:first-child)]:rounded-t-none [&>*:not(:first-child)]:border-t-0 [&>*:not(:last-child)]:rounded-b-none'
+            horizontal: "[&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none",
+            vertical: "flex-col [&>*:not(:first-child)]:rounded-t-none [&>*:not(:first-child)]:border-t-0 [&>*:not(:last-child)]:rounded-b-none"
         }
     }
 });
@@ -58,15 +58,15 @@ function ButtonGroup({ className, orientation, ...props }) {
     });
 }
 function ButtonGroupText({ asChild = false, className, ...props }) {
-    const Component = asChild ? react_slot_namespaceObject.Slot : 'div';
+    const Component = asChild ? react_slot_namespaceObject.Slot : "div";
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(Component, {
-        className: (0, tailwind_variants_namespaceObject.cn)("bg-muted flex items-center gap-2 rounded-lg border px-4 text-sm font-medium shadow-xs [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", className),
+        className: (0, tailwind_variants_namespaceObject.cn)("flex items-center gap-2 rounded-lg border bg-muted px-4 text-sm font-medium shadow-xs [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", className),
         ...props
     });
 }
-function ButtonGroupSeparator({ className, orientation = 'vertical', ...props }) {
+function ButtonGroupSeparator({ className, orientation = "vertical", ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_separator_cjs_namespaceObject.Separator, {
-        className: (0, tailwind_variants_namespaceObject.cn)('bg-input relative !m-0 self-stretch data-[orientation=vertical]:h-auto', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("relative !m-0 self-stretch bg-input data-[orientation=vertical]:h-auto", className),
         "data-slot": "button-group-separator",
         orientation: orientation,
         ...props

package/dist/components/button-group.d.ts

@@ -1,15 +1,15 @@
-import type { VariantProps } from '@codefast/tailwind-variants';
-import type { ComponentProps, JSX } from 'react';
-import { Separator } from './separator';
+import type { VariantProps } from "@codefast/tailwind-variants";
+import type { ComponentProps, JSX } from "react";
+import { Separator } from "./separator";
 declare const buttonGroupVariants: import("@codefast/tailwind-variants").VariantFunctionType<{
     orientation: {
         horizontal: string;
         vertical: string;
     };
 }, Record<string, never>>;
-type ButtonGroupProps = ComponentProps<'div'> & VariantProps<typeof buttonGroupVariants>;
+type ButtonGroupProps = ComponentProps<"div"> & VariantProps<typeof buttonGroupVariants>;
 declare function ButtonGroup({ className, orientation, ...props }: ButtonGroupProps): JSX.Element;
-interface ButtonGroupTextProps extends ComponentProps<'div'> {
+interface ButtonGroupTextProps extends ComponentProps<"div"> {
     asChild?: boolean;
 }
 declare function ButtonGroupText({ asChild, className, ...props }: ButtonGroupTextProps): JSX.Element;

package/dist/components/button-group.js

@@ -4,14 +4,14 @@ import { cn, tv } from "@codefast/tailwind-variants";
 import { Slot } from "@radix-ui/react-slot";
 import { Separator } from "./separator.js";
 const buttonGroupVariants = tv({
-    base: cn('flex w-fit items-stretch has-[>[data-slot=button-group]]:gap-2', "[&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit", '[&>*]:focus-visible:relative [&>*]:focus-visible:z-10 [&>input]:flex-1', 'has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-lg'),
+    base: cn("flex w-fit items-stretch has-[>[data-slot=button-group]]:gap-2", "[&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit", "[&>*]:focus-visible:relative [&>*]:focus-visible:z-10 [&>input]:flex-1", "has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-lg"),
     defaultVariants: {
-        orientation: 'horizontal'
+        orientation: "horizontal"
     },
     variants: {
         orientation: {
-            horizontal: '[&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none',
-            vertical: 'flex-col [&>*:not(:first-child)]:rounded-t-none [&>*:not(:first-child)]:border-t-0 [&>*:not(:last-child)]:rounded-b-none'
+            horizontal: "[&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none",
+            vertical: "flex-col [&>*:not(:first-child)]:rounded-t-none [&>*:not(:first-child)]:border-t-0 [&>*:not(:last-child)]:rounded-b-none"
         }
     }
 });
@@ -27,15 +27,15 @@ function ButtonGroup({ className, orientation, ...props }) {
     });
 }
 function ButtonGroupText({ asChild = false, className, ...props }) {
-    const Component = asChild ? Slot : 'div';
+    const Component = asChild ? Slot : "div";
     return /*#__PURE__*/ jsx(Component, {
-        className: cn("bg-muted flex items-center gap-2 rounded-lg border px-4 text-sm font-medium shadow-xs [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", className),
+        className: cn("flex items-center gap-2 rounded-lg border bg-muted px-4 text-sm font-medium shadow-xs [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", className),
         ...props
     });
 }
-function ButtonGroupSeparator({ className, orientation = 'vertical', ...props }) {
+function ButtonGroupSeparator({ className, orientation = "vertical", ...props }) {
     return /*#__PURE__*/ jsx(Separator, {
-        className: cn('bg-input relative !m-0 self-stretch data-[orientation=vertical]:h-auto', className),
+        className: cn("relative !m-0 self-stretch bg-input data-[orientation=vertical]:h-auto", className),
         "data-slot": "button-group-separator",
         orientation: orientation,
         ...props

package/dist/components/button.cjs

@@ -31,32 +31,32 @@ const jsx_runtime_namespaceObject = require("react/jsx-runtime");
 const tailwind_variants_namespaceObject = require("@codefast/tailwind-variants");
 const react_slot_namespaceObject = require("@radix-ui/react-slot");
 const buttonVariants = (0, tailwind_variants_namespaceObject.tv)({
-    base: "focus-visible:ring-3 outline-hidden inline-flex shrink-0 select-none items-center justify-center gap-2 whitespace-nowrap rounded-lg text-sm font-medium transition disabled:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0",
+    base: "inline-flex shrink-0 items-center justify-center gap-2 rounded-lg text-sm font-medium whitespace-nowrap outline-hidden transition select-none focus-visible:ring-3 disabled:opacity-50 [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
     defaultVariants: {
-        size: 'md',
-        variant: 'default'
+        size: "md",
+        variant: "default"
     },
     variants: {
         size: {
-            'icon-sm': 'size-8',
-            icon: 'size-9',
-            'icon-lg': 'size-10',
-            sm: 'h-8 px-3 has-[>svg]:px-2.5',
-            md: 'h-9 px-4 has-[>svg]:px-3',
-            lg: 'h-10 px-6 has-[>svg]:px-4'
+            "icon-sm": "size-8",
+            icon: "size-9",
+            "icon-lg": "size-10",
+            sm: "h-8 px-3 has-[>svg]:px-2.5",
+            md: "h-9 px-4 has-[>svg]:px-3",
+            lg: "h-10 px-6 has-[>svg]:px-4"
         },
         variant: {
-            default: 'bg-primary text-primary-foreground focus-visible:ring-primary/20 dark:focus-visible:ring-primary/40 hover:not-disabled:bg-primary/80',
-            destructive: 'bg-destructive dark:bg-destructive/60 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 hover:not-disabled:bg-destructive/90 text-white',
-            ghost: 'hover:not-disabled:bg-secondary hover:not-disabled:text-secondary-foreground focus-visible:ring-ring/50 dark:hover:not-disabled:bg-secondary/50',
-            link: 'text-primary hover:not-disabled:underline focus-visible:ring-ring/50 underline-offset-4',
-            outline: 'border-input shadow-xs hover:not-disabled:bg-secondary hover:not-disabled:text-secondary-foreground focus-visible:ring-ring/50 focus-visible:border-ring aria-invalid:border-destructive dark:aria-invalid:border-destructive/70 hover:not-disabled:aria-invalid:border-destructive/60 focus-within:aria-invalid:ring-destructive/20 dark:focus-within:aria-invalid:ring-destructive/40 dark:bg-input/30 dark:hover:not-disabled:bg-input/50 hover:not-disabled:border-ring/60 border',
-            secondary: 'bg-secondary text-secondary-foreground hover:not-disabled:bg-secondary/80 focus-visible:ring-ring/50'
+            default: "bg-primary text-primary-foreground hover:not-disabled:bg-primary/80 focus-visible:ring-primary/20 dark:focus-visible:ring-primary/40",
+            destructive: "bg-destructive text-white hover:not-disabled:bg-destructive/90 focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40",
+            ghost: "hover:not-disabled:bg-secondary hover:not-disabled:text-secondary-foreground focus-visible:ring-ring/50 dark:hover:not-disabled:bg-secondary/50",
+            link: "text-primary underline-offset-4 hover:not-disabled:underline focus-visible:ring-ring/50",
+            outline: "border border-input shadow-xs hover:not-disabled:border-ring/60 hover:not-disabled:bg-secondary hover:not-disabled:text-secondary-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:border-destructive focus-within:aria-invalid:ring-destructive/20 hover:not-disabled:aria-invalid:border-destructive/60 dark:bg-input/30 dark:hover:not-disabled:bg-input/50 dark:aria-invalid:border-destructive/70 dark:focus-within:aria-invalid:ring-destructive/40",
+            secondary: "bg-secondary text-secondary-foreground hover:not-disabled:bg-secondary/80 focus-visible:ring-ring/50"
         }
     }
 });
-function Button({ asChild = false, children, className, size, type = 'button', variant, ...props }) {
-    const Comp = asChild ? react_slot_namespaceObject.Slot : 'button';
+function Button({ asChild = false, children, className, size, type = "button", variant, ...props }) {
+    const Comp = asChild ? react_slot_namespaceObject.Slot : "button";
     if (asChild) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(Comp, {
         className: buttonVariants({
             className,

package/dist/components/button.d.ts

@@ -1,10 +1,10 @@
-import type { VariantProps } from '@codefast/tailwind-variants';
-import type { ComponentProps, JSX } from 'react';
+import type { VariantProps } from "@codefast/tailwind-variants";
+import type { ComponentProps, JSX } from "react";
 declare const buttonVariants: import("@codefast/tailwind-variants").VariantFunctionType<{
     size: {
-        'icon-sm': string;
+        "icon-sm": string;
         icon: string;
-        'icon-lg': string;
+        "icon-lg": string;
         sm: string;
         md: string;
         lg: string;
@@ -18,9 +18,9 @@ declare const buttonVariants: import("@codefast/tailwind-variants").VariantFunct
         secondary: string;
     };
 }, Record<string, never>>;
-type ButtonProps = ComponentProps<'button'> & VariantProps<typeof buttonVariants> & {
+type ButtonProps = ComponentProps<"button"> & VariantProps<typeof buttonVariants> & {
     asChild?: boolean;
-    type?: ComponentProps<'button'>['type'];
+    type?: ComponentProps<"button">["type"];
 };
 declare function Button({ asChild, children, className, size, type, variant, ...props }: ButtonProps): JSX.Element;
 export { buttonVariants };

package/dist/components/button.js

@@ -2,32 +2,32 @@ import { jsx } from "react/jsx-runtime";
 import { tv } from "@codefast/tailwind-variants";
 import { Slot } from "@radix-ui/react-slot";
 const buttonVariants = tv({
-    base: "focus-visible:ring-3 outline-hidden inline-flex shrink-0 select-none items-center justify-center gap-2 whitespace-nowrap rounded-lg text-sm font-medium transition disabled:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0",
+    base: "inline-flex shrink-0 items-center justify-center gap-2 rounded-lg text-sm font-medium whitespace-nowrap outline-hidden transition select-none focus-visible:ring-3 disabled:opacity-50 [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
     defaultVariants: {
-        size: 'md',
-        variant: 'default'
+        size: "md",
+        variant: "default"
     },
     variants: {
         size: {
-            'icon-sm': 'size-8',
-            icon: 'size-9',
-            'icon-lg': 'size-10',
-            sm: 'h-8 px-3 has-[>svg]:px-2.5',
-            md: 'h-9 px-4 has-[>svg]:px-3',
-            lg: 'h-10 px-6 has-[>svg]:px-4'
+            "icon-sm": "size-8",
+            icon: "size-9",
+            "icon-lg": "size-10",
+            sm: "h-8 px-3 has-[>svg]:px-2.5",
+            md: "h-9 px-4 has-[>svg]:px-3",
+            lg: "h-10 px-6 has-[>svg]:px-4"
         },
         variant: {
-            default: 'bg-primary text-primary-foreground focus-visible:ring-primary/20 dark:focus-visible:ring-primary/40 hover:not-disabled:bg-primary/80',
-            destructive: 'bg-destructive dark:bg-destructive/60 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 hover:not-disabled:bg-destructive/90 text-white',
-            ghost: 'hover:not-disabled:bg-secondary hover:not-disabled:text-secondary-foreground focus-visible:ring-ring/50 dark:hover:not-disabled:bg-secondary/50',
-            link: 'text-primary hover:not-disabled:underline focus-visible:ring-ring/50 underline-offset-4',
-            outline: 'border-input shadow-xs hover:not-disabled:bg-secondary hover:not-disabled:text-secondary-foreground focus-visible:ring-ring/50 focus-visible:border-ring aria-invalid:border-destructive dark:aria-invalid:border-destructive/70 hover:not-disabled:aria-invalid:border-destructive/60 focus-within:aria-invalid:ring-destructive/20 dark:focus-within:aria-invalid:ring-destructive/40 dark:bg-input/30 dark:hover:not-disabled:bg-input/50 hover:not-disabled:border-ring/60 border',
-            secondary: 'bg-secondary text-secondary-foreground hover:not-disabled:bg-secondary/80 focus-visible:ring-ring/50'
+            default: "bg-primary text-primary-foreground hover:not-disabled:bg-primary/80 focus-visible:ring-primary/20 dark:focus-visible:ring-primary/40",
+            destructive: "bg-destructive text-white hover:not-disabled:bg-destructive/90 focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40",
+            ghost: "hover:not-disabled:bg-secondary hover:not-disabled:text-secondary-foreground focus-visible:ring-ring/50 dark:hover:not-disabled:bg-secondary/50",
+            link: "text-primary underline-offset-4 hover:not-disabled:underline focus-visible:ring-ring/50",
+            outline: "border border-input shadow-xs hover:not-disabled:border-ring/60 hover:not-disabled:bg-secondary hover:not-disabled:text-secondary-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:border-destructive focus-within:aria-invalid:ring-destructive/20 hover:not-disabled:aria-invalid:border-destructive/60 dark:bg-input/30 dark:hover:not-disabled:bg-input/50 dark:aria-invalid:border-destructive/70 dark:focus-within:aria-invalid:ring-destructive/40",
+            secondary: "bg-secondary text-secondary-foreground hover:not-disabled:bg-secondary/80 focus-visible:ring-ring/50"
         }
     }
 });
-function Button({ asChild = false, children, className, size, type = 'button', variant, ...props }) {
-    const Comp = asChild ? Slot : 'button';
+function Button({ asChild = false, children, className, size, type = "button", variant, ...props }) {
+    const Comp = asChild ? Slot : "button";
     if (asChild) return /*#__PURE__*/ jsx(Comp, {
         className: buttonVariants({
             className,

package/dist/components/calendar.cjs

@@ -34,41 +34,41 @@ const external_lucide_react_namespaceObject = require("lucide-react");
 const external_react_namespaceObject = require("react");
 const external_react_day_picker_namespaceObject = require("react-day-picker");
 const external_button_cjs_namespaceObject = require("./button.cjs");
-function Calendar({ buttonVariant = 'ghost', captionLayout = 'label', className, classNames, components, formatters, showOutsideDays = true, ...props }) {
+function Calendar({ buttonVariant = "ghost", captionLayout = "label", className, classNames, components, formatters, showOutsideDays = true, ...props }) {
     const defaultClassNames = (0, external_react_day_picker_namespaceObject.getDefaultClassNames)();
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_react_day_picker_namespaceObject.DayPicker, {
         captionLayout: captionLayout,
-        className: (0, tailwind_variants_namespaceObject.cn)('bg-background group/calendar p-3 [--cell-size:--spacing(8)] [[data-slot=card-content]_&]:bg-transparent [[data-slot=popover-content]_&]:bg-transparent', 'rtl:**:[.rdp-button_next>svg]:rotate-180', 'rtl:**:[.rdp-button_previous>svg]:rotate-180', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("group/calendar bg-background p-3 [--cell-size:--spacing(8)] [[data-slot=card-content]_&]:bg-transparent [[data-slot=popover-content]_&]:bg-transparent", "rtl:**:[.rdp-button_next>svg]:rotate-180", "rtl:**:[.rdp-button_previous>svg]:rotate-180", className),
         classNames: {
             button_next: (0, tailwind_variants_namespaceObject.cn)((0, external_button_cjs_namespaceObject.buttonVariants)({
                 variant: buttonVariant
-            }), 'size-(--cell-size) aria-disabled:opacity-50 p-0 select-none', defaultClassNames.button_next),
+            }), "size-(--cell-size) p-0 select-none aria-disabled:opacity-50", defaultClassNames.button_next),
             button_previous: (0, tailwind_variants_namespaceObject.cn)((0, external_button_cjs_namespaceObject.buttonVariants)({
                 variant: buttonVariant
-            }), 'size-(--cell-size) aria-disabled:opacity-50 p-0 select-none', defaultClassNames.button_previous),
-            caption_label: (0, tailwind_variants_namespaceObject.cn)('select-none font-medium', 'label' === captionLayout ? 'text-sm' : 'rounded-md pl-2 pr-1 flex items-center gap-1 text-sm h-8 [&>svg]:text-muted-foreground [&>svg]:size-3.5', defaultClassNames.caption_label),
-            day: (0, tailwind_variants_namespaceObject.cn)('relative w-full h-full p-0 text-center [&:last-child[data-selected=true]_button]:rounded-r-md group/day aspect-square select-none', props.showWeekNumber ? '[&:nth-child(2)[data-selected=true]_button]:rounded-l-md' : '[&:first-child[data-selected=true]_button]:rounded-l-md', defaultClassNames.day),
-            disabled: (0, tailwind_variants_namespaceObject.cn)('text-muted-foreground opacity-50', defaultClassNames.disabled),
-            dropdown: (0, tailwind_variants_namespaceObject.cn)('absolute bg-popover inset-0 opacity-0', defaultClassNames.dropdown),
-            dropdown_root: (0, tailwind_variants_namespaceObject.cn)('relative has-focus:border-ring border border-input shadow-xs has-focus:ring-ring/50 has-focus:ring-3 rounded-md', defaultClassNames.dropdown_root),
-            dropdowns: (0, tailwind_variants_namespaceObject.cn)('w-full flex items-center text-sm font-medium justify-center h-(--cell-size) gap-1.5', defaultClassNames.dropdowns),
-            hidden: (0, tailwind_variants_namespaceObject.cn)('invisible', defaultClassNames.hidden),
-            month: (0, tailwind_variants_namespaceObject.cn)('flex flex-col w-full gap-4', defaultClassNames.month),
-            month_caption: (0, tailwind_variants_namespaceObject.cn)('flex items-center justify-center h-(--cell-size) w-full px-(--cell-size)', defaultClassNames.month_caption),
-            months: (0, tailwind_variants_namespaceObject.cn)('flex gap-4 flex-col md:flex-row relative', defaultClassNames.months),
-            nav: (0, tailwind_variants_namespaceObject.cn)('flex items-center gap-1 w-full absolute top-0 inset-x-0 justify-between', defaultClassNames.nav),
-            outside: (0, tailwind_variants_namespaceObject.cn)('text-muted-foreground aria-selected:text-muted-foreground', defaultClassNames.outside),
-            range_end: (0, tailwind_variants_namespaceObject.cn)('rounded-r-md bg-accent', defaultClassNames.range_end),
-            range_middle: (0, tailwind_variants_namespaceObject.cn)('rounded-none', defaultClassNames.range_middle),
-            range_start: (0, tailwind_variants_namespaceObject.cn)('rounded-l-md bg-accent', defaultClassNames.range_start),
-            root: (0, tailwind_variants_namespaceObject.cn)('w-fit', defaultClassNames.root),
-            table: 'w-full border-collapse',
-            today: (0, tailwind_variants_namespaceObject.cn)('bg-accent text-accent-foreground rounded-md data-[selected=true]:rounded-none', defaultClassNames.today),
-            week: (0, tailwind_variants_namespaceObject.cn)('flex w-full mt-2', defaultClassNames.week),
-            week_number: (0, tailwind_variants_namespaceObject.cn)('text-[0.8rem] select-none text-muted-foreground', defaultClassNames.week_number),
-            week_number_header: (0, tailwind_variants_namespaceObject.cn)('select-none w-(--cell-size)', defaultClassNames.week_number_header),
-            weekday: (0, tailwind_variants_namespaceObject.cn)('text-muted-foreground rounded-md flex-1 font-normal text-[0.8rem] select-none', defaultClassNames.weekday),
-            weekdays: (0, tailwind_variants_namespaceObject.cn)('flex', defaultClassNames.weekdays),
+            }), "size-(--cell-size) p-0 select-none aria-disabled:opacity-50", defaultClassNames.button_previous),
+            caption_label: (0, tailwind_variants_namespaceObject.cn)("font-medium select-none", "label" === captionLayout ? "text-sm" : "flex h-8 items-center gap-1 rounded-md pr-1 pl-2 text-sm [&>svg]:size-3.5 [&>svg]:text-muted-foreground", defaultClassNames.caption_label),
+            day: (0, tailwind_variants_namespaceObject.cn)("group/day relative aspect-square h-full w-full p-0 text-center select-none [&:last-child[data-selected=true]_button]:rounded-r-md", props.showWeekNumber ? "[&:nth-child(2)[data-selected=true]_button]:rounded-l-md" : "[&:first-child[data-selected=true]_button]:rounded-l-md", defaultClassNames.day),
+            disabled: (0, tailwind_variants_namespaceObject.cn)("text-muted-foreground opacity-50", defaultClassNames.disabled),
+            dropdown: (0, tailwind_variants_namespaceObject.cn)("absolute inset-0 bg-popover opacity-0", defaultClassNames.dropdown),
+            dropdown_root: (0, tailwind_variants_namespaceObject.cn)("relative rounded-md border border-input shadow-xs has-focus:border-ring has-focus:ring-3 has-focus:ring-ring/50", defaultClassNames.dropdown_root),
+            dropdowns: (0, tailwind_variants_namespaceObject.cn)("flex h-(--cell-size) w-full items-center justify-center gap-1.5 text-sm font-medium", defaultClassNames.dropdowns),
+            hidden: (0, tailwind_variants_namespaceObject.cn)("invisible", defaultClassNames.hidden),
+            month: (0, tailwind_variants_namespaceObject.cn)("flex w-full flex-col gap-4", defaultClassNames.month),
+            month_caption: (0, tailwind_variants_namespaceObject.cn)("flex h-(--cell-size) w-full items-center justify-center px-(--cell-size)", defaultClassNames.month_caption),
+            months: (0, tailwind_variants_namespaceObject.cn)("relative flex flex-col gap-4 md:flex-row", defaultClassNames.months),
+            nav: (0, tailwind_variants_namespaceObject.cn)("absolute inset-x-0 top-0 flex w-full items-center justify-between gap-1", defaultClassNames.nav),
+            outside: (0, tailwind_variants_namespaceObject.cn)("text-muted-foreground aria-selected:text-muted-foreground", defaultClassNames.outside),
+            range_end: (0, tailwind_variants_namespaceObject.cn)("rounded-r-md bg-accent", defaultClassNames.range_end),
+            range_middle: (0, tailwind_variants_namespaceObject.cn)("rounded-none", defaultClassNames.range_middle),
+            range_start: (0, tailwind_variants_namespaceObject.cn)("rounded-l-md bg-accent", defaultClassNames.range_start),
+            root: (0, tailwind_variants_namespaceObject.cn)("w-fit", defaultClassNames.root),
+            table: "w-full border-collapse",
+            today: (0, tailwind_variants_namespaceObject.cn)("rounded-md bg-accent text-accent-foreground data-[selected=true]:rounded-none", defaultClassNames.today),
+            week: (0, tailwind_variants_namespaceObject.cn)("mt-2 flex w-full", defaultClassNames.week),
+            week_number: (0, tailwind_variants_namespaceObject.cn)("text-[0.8rem] text-muted-foreground select-none", defaultClassNames.week_number),
+            week_number_header: (0, tailwind_variants_namespaceObject.cn)("w-(--cell-size) select-none", defaultClassNames.week_number_header),
+            weekday: (0, tailwind_variants_namespaceObject.cn)("flex-1 rounded-md text-[0.8rem] font-normal text-muted-foreground select-none", defaultClassNames.weekday),
+            weekdays: (0, tailwind_variants_namespaceObject.cn)("flex", defaultClassNames.weekdays),
             ...classNames
         },
         components: {
@@ -79,8 +79,8 @@ function Calendar({ buttonVariant = 'ghost', captionLayout = 'label', className,
             ...components
         },
         formatters: {
-            formatMonthDropdown: (date)=>date.toLocaleString('default', {
-                    month: 'short'
+            formatMonthDropdown: (date)=>date.toLocaleString("default", {
+                    month: "short"
                 }),
             ...formatters
         },
@@ -89,16 +89,16 @@ function Calendar({ buttonVariant = 'ghost', captionLayout = 'label', className,
     });
 }
 function CalendarChevron({ className, orientation, ...props }) {
-    if ('left' === orientation) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.ChevronLeftIcon, {
-        className: (0, tailwind_variants_namespaceObject.cn)('size-4', className),
+    if ("left" === orientation) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.ChevronLeftIcon, {
+        className: (0, tailwind_variants_namespaceObject.cn)("size-4", className),
         ...props
     });
-    if ('right' === orientation) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.ChevronRightIcon, {
-        className: (0, tailwind_variants_namespaceObject.cn)('size-4', className),
+    if ("right" === orientation) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.ChevronRightIcon, {
+        className: (0, tailwind_variants_namespaceObject.cn)("size-4", className),
         ...props
     });
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.ChevronDownIcon, {
-        className: (0, tailwind_variants_namespaceObject.cn)('size-4', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("size-4", className),
         ...props
     });
 }
@@ -129,7 +129,7 @@ function CalendarDayButton({ className, day, modifiers, ...props }) {
     ]);
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_button_cjs_namespaceObject.Button, {
         ref: ref,
-        className: (0, tailwind_variants_namespaceObject.cn)('data-[selected-single=true]:bg-primary data-[selected-single=true]:text-primary-foreground data-[range-middle=true]:bg-accent data-[range-middle=true]:text-accent-foreground data-[range-start=true]:bg-primary data-[range-start=true]:text-primary-foreground data-[range-end=true]:bg-primary data-[range-end=true]:text-primary-foreground group-data-[focused=true]/day:border-ring group-data-[focused=true]/day:ring-ring/50 dark:hover:text-accent-foreground flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 leading-none font-normal group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:ring-3 data-[range-end=true]:rounded-md data-[range-end=true]:rounded-r-md data-[range-middle=true]:rounded-none data-[range-start=true]:rounded-md data-[range-start=true]:rounded-l-md [&>span]:text-xs [&>span]:opacity-70', defaultClassNames.day, className),
+        className: (0, tailwind_variants_namespaceObject.cn)("flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 leading-none font-normal group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:border-ring group-data-[focused=true]/day:ring-3 group-data-[focused=true]/day:ring-ring/50 data-[range-end=true]:rounded-md data-[range-end=true]:rounded-r-md data-[range-end=true]:bg-primary data-[range-end=true]:text-primary-foreground data-[range-middle=true]:rounded-none data-[range-middle=true]:bg-accent data-[range-middle=true]:text-accent-foreground data-[range-start=true]:rounded-md data-[range-start=true]:rounded-l-md data-[range-start=true]:bg-primary data-[range-start=true]:text-primary-foreground data-[selected-single=true]:bg-primary data-[selected-single=true]:text-primary-foreground dark:hover:text-accent-foreground [&>span]:text-xs [&>span]:opacity-70", defaultClassNames.day, className),
         "data-day": day.date.toLocaleDateString(),
         "data-range-end": modifiers.range_end,
         "data-range-middle": modifiers.range_middle,

package/dist/components/calendar.d.ts

@@ -1,9 +1,9 @@
-import type { ComponentProps, JSX } from 'react';
-import type { DayButton } from 'react-day-picker';
-import { DayPicker } from 'react-day-picker';
-import { Button } from './button';
+import type { ComponentProps, JSX } from "react";
+import type { DayButton } from "react-day-picker";
+import { DayPicker } from "react-day-picker";
+import { Button } from "./button";
 type CalendarProps = ComponentProps<typeof DayPicker> & {
-    buttonVariant?: ComponentProps<typeof Button>['variant'];
+    buttonVariant?: ComponentProps<typeof Button>["variant"];
 };
 declare function Calendar({ buttonVariant, captionLayout, className, classNames, components, formatters, showOutsideDays, ...props }: CalendarProps): JSX.Element;
 type CalendarDayButtonProps = ComponentProps<typeof DayButton>;

package/dist/components/calendar.js

@@ -5,41 +5,41 @@ import { ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon } from "lucide-react
 import { useEffect, useRef } from "react";
 import { DayPicker, getDefaultClassNames } from "react-day-picker";
 import { Button, buttonVariants } from "./button.js";
-function Calendar({ buttonVariant = 'ghost', captionLayout = 'label', className, classNames, components, formatters, showOutsideDays = true, ...props }) {
+function Calendar({ buttonVariant = "ghost", captionLayout = "label", className, classNames, components, formatters, showOutsideDays = true, ...props }) {
     const defaultClassNames = getDefaultClassNames();
     return /*#__PURE__*/ jsx(DayPicker, {
         captionLayout: captionLayout,
-        className: cn('bg-background group/calendar p-3 [--cell-size:--spacing(8)] [[data-slot=card-content]_&]:bg-transparent [[data-slot=popover-content]_&]:bg-transparent', 'rtl:**:[.rdp-button_next>svg]:rotate-180', 'rtl:**:[.rdp-button_previous>svg]:rotate-180', className),
+        className: cn("group/calendar bg-background p-3 [--cell-size:--spacing(8)] [[data-slot=card-content]_&]:bg-transparent [[data-slot=popover-content]_&]:bg-transparent", "rtl:**:[.rdp-button_next>svg]:rotate-180", "rtl:**:[.rdp-button_previous>svg]:rotate-180", className),
         classNames: {
             button_next: cn(buttonVariants({
                 variant: buttonVariant
-            }), 'size-(--cell-size) aria-disabled:opacity-50 p-0 select-none', defaultClassNames.button_next),
+            }), "size-(--cell-size) p-0 select-none aria-disabled:opacity-50", defaultClassNames.button_next),
             button_previous: cn(buttonVariants({
                 variant: buttonVariant
-            }), 'size-(--cell-size) aria-disabled:opacity-50 p-0 select-none', defaultClassNames.button_previous),
-            caption_label: cn('select-none font-medium', 'label' === captionLayout ? 'text-sm' : 'rounded-md pl-2 pr-1 flex items-center gap-1 text-sm h-8 [&>svg]:text-muted-foreground [&>svg]:size-3.5', defaultClassNames.caption_label),
-            day: cn('relative w-full h-full p-0 text-center [&:last-child[data-selected=true]_button]:rounded-r-md group/day aspect-square select-none', props.showWeekNumber ? '[&:nth-child(2)[data-selected=true]_button]:rounded-l-md' : '[&:first-child[data-selected=true]_button]:rounded-l-md', defaultClassNames.day),
-            disabled: cn('text-muted-foreground opacity-50', defaultClassNames.disabled),
-            dropdown: cn('absolute bg-popover inset-0 opacity-0', defaultClassNames.dropdown),
-            dropdown_root: cn('relative has-focus:border-ring border border-input shadow-xs has-focus:ring-ring/50 has-focus:ring-3 rounded-md', defaultClassNames.dropdown_root),
-            dropdowns: cn('w-full flex items-center text-sm font-medium justify-center h-(--cell-size) gap-1.5', defaultClassNames.dropdowns),
-            hidden: cn('invisible', defaultClassNames.hidden),
-            month: cn('flex flex-col w-full gap-4', defaultClassNames.month),
-            month_caption: cn('flex items-center justify-center h-(--cell-size) w-full px-(--cell-size)', defaultClassNames.month_caption),
-            months: cn('flex gap-4 flex-col md:flex-row relative', defaultClassNames.months),
-            nav: cn('flex items-center gap-1 w-full absolute top-0 inset-x-0 justify-between', defaultClassNames.nav),
-            outside: cn('text-muted-foreground aria-selected:text-muted-foreground', defaultClassNames.outside),
-            range_end: cn('rounded-r-md bg-accent', defaultClassNames.range_end),
-            range_middle: cn('rounded-none', defaultClassNames.range_middle),
-            range_start: cn('rounded-l-md bg-accent', defaultClassNames.range_start),
-            root: cn('w-fit', defaultClassNames.root),
-            table: 'w-full border-collapse',
-            today: cn('bg-accent text-accent-foreground rounded-md data-[selected=true]:rounded-none', defaultClassNames.today),
-            week: cn('flex w-full mt-2', defaultClassNames.week),
-            week_number: cn('text-[0.8rem] select-none text-muted-foreground', defaultClassNames.week_number),
-            week_number_header: cn('select-none w-(--cell-size)', defaultClassNames.week_number_header),
-            weekday: cn('text-muted-foreground rounded-md flex-1 font-normal text-[0.8rem] select-none', defaultClassNames.weekday),
-            weekdays: cn('flex', defaultClassNames.weekdays),
+            }), "size-(--cell-size) p-0 select-none aria-disabled:opacity-50", defaultClassNames.button_previous),
+            caption_label: cn("font-medium select-none", "label" === captionLayout ? "text-sm" : "flex h-8 items-center gap-1 rounded-md pr-1 pl-2 text-sm [&>svg]:size-3.5 [&>svg]:text-muted-foreground", defaultClassNames.caption_label),
+            day: cn("group/day relative aspect-square h-full w-full p-0 text-center select-none [&:last-child[data-selected=true]_button]:rounded-r-md", props.showWeekNumber ? "[&:nth-child(2)[data-selected=true]_button]:rounded-l-md" : "[&:first-child[data-selected=true]_button]:rounded-l-md", defaultClassNames.day),
+            disabled: cn("text-muted-foreground opacity-50", defaultClassNames.disabled),
+            dropdown: cn("absolute inset-0 bg-popover opacity-0", defaultClassNames.dropdown),
+            dropdown_root: cn("relative rounded-md border border-input shadow-xs has-focus:border-ring has-focus:ring-3 has-focus:ring-ring/50", defaultClassNames.dropdown_root),
+            dropdowns: cn("flex h-(--cell-size) w-full items-center justify-center gap-1.5 text-sm font-medium", defaultClassNames.dropdowns),
+            hidden: cn("invisible", defaultClassNames.hidden),
+            month: cn("flex w-full flex-col gap-4", defaultClassNames.month),
+            month_caption: cn("flex h-(--cell-size) w-full items-center justify-center px-(--cell-size)", defaultClassNames.month_caption),
+            months: cn("relative flex flex-col gap-4 md:flex-row", defaultClassNames.months),
+            nav: cn("absolute inset-x-0 top-0 flex w-full items-center justify-between gap-1", defaultClassNames.nav),
+            outside: cn("text-muted-foreground aria-selected:text-muted-foreground", defaultClassNames.outside),
+            range_end: cn("rounded-r-md bg-accent", defaultClassNames.range_end),
+            range_middle: cn("rounded-none", defaultClassNames.range_middle),
+            range_start: cn("rounded-l-md bg-accent", defaultClassNames.range_start),
+            root: cn("w-fit", defaultClassNames.root),
+            table: "w-full border-collapse",
+            today: cn("rounded-md bg-accent text-accent-foreground data-[selected=true]:rounded-none", defaultClassNames.today),
+            week: cn("mt-2 flex w-full", defaultClassNames.week),
+            week_number: cn("text-[0.8rem] text-muted-foreground select-none", defaultClassNames.week_number),
+            week_number_header: cn("w-(--cell-size) select-none", defaultClassNames.week_number_header),
+            weekday: cn("flex-1 rounded-md text-[0.8rem] font-normal text-muted-foreground select-none", defaultClassNames.weekday),
+            weekdays: cn("flex", defaultClassNames.weekdays),
             ...classNames
         },
         components: {
@@ -50,8 +50,8 @@ function Calendar({ buttonVariant = 'ghost', captionLayout = 'label', className,
             ...components
         },
         formatters: {
-            formatMonthDropdown: (date)=>date.toLocaleString('default', {
-                    month: 'short'
+            formatMonthDropdown: (date)=>date.toLocaleString("default", {
+                    month: "short"
                 }),
             ...formatters
         },
@@ -60,16 +60,16 @@ function Calendar({ buttonVariant = 'ghost', captionLayout = 'label', className,
     });
 }
 function CalendarChevron({ className, orientation, ...props }) {
-    if ('left' === orientation) return /*#__PURE__*/ jsx(ChevronLeftIcon, {
-        className: cn('size-4', className),
+    if ("left" === orientation) return /*#__PURE__*/ jsx(ChevronLeftIcon, {
+        className: cn("size-4", className),
         ...props
     });
-    if ('right' === orientation) return /*#__PURE__*/ jsx(ChevronRightIcon, {
-        className: cn('size-4', className),
+    if ("right" === orientation) return /*#__PURE__*/ jsx(ChevronRightIcon, {
+        className: cn("size-4", className),
         ...props
     });
     return /*#__PURE__*/ jsx(ChevronDownIcon, {
-        className: cn('size-4', className),
+        className: cn("size-4", className),
         ...props
     });
 }
@@ -100,7 +100,7 @@ function CalendarDayButton({ className, day, modifiers, ...props }) {
     ]);
     return /*#__PURE__*/ jsx(Button, {
         ref: ref,
-        className: cn('data-[selected-single=true]:bg-primary data-[selected-single=true]:text-primary-foreground data-[range-middle=true]:bg-accent data-[range-middle=true]:text-accent-foreground data-[range-start=true]:bg-primary data-[range-start=true]:text-primary-foreground data-[range-end=true]:bg-primary data-[range-end=true]:text-primary-foreground group-data-[focused=true]/day:border-ring group-data-[focused=true]/day:ring-ring/50 dark:hover:text-accent-foreground flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 leading-none font-normal group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:ring-3 data-[range-end=true]:rounded-md data-[range-end=true]:rounded-r-md data-[range-middle=true]:rounded-none data-[range-start=true]:rounded-md data-[range-start=true]:rounded-l-md [&>span]:text-xs [&>span]:opacity-70', defaultClassNames.day, className),
+        className: cn("flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 leading-none font-normal group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:border-ring group-data-[focused=true]/day:ring-3 group-data-[focused=true]/day:ring-ring/50 data-[range-end=true]:rounded-md data-[range-end=true]:rounded-r-md data-[range-end=true]:bg-primary data-[range-end=true]:text-primary-foreground data-[range-middle=true]:rounded-none data-[range-middle=true]:bg-accent data-[range-middle=true]:text-accent-foreground data-[range-start=true]:rounded-md data-[range-start=true]:rounded-l-md data-[range-start=true]:bg-primary data-[range-start=true]:text-primary-foreground data-[selected-single=true]:bg-primary data-[selected-single=true]:text-primary-foreground dark:hover:text-accent-foreground [&>span]:text-xs [&>span]:opacity-70", defaultClassNames.day, className),
         "data-day": day.date.toLocaleDateString(),
         "data-range-end": modifiers.range_end,
         "data-range-middle": modifiers.range_middle,

package/dist/components/card.cjs

@@ -36,21 +36,21 @@ const jsx_runtime_namespaceObject = require("react/jsx-runtime");
 const tailwind_variants_namespaceObject = require("@codefast/tailwind-variants");
 function Card({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-        className: (0, tailwind_variants_namespaceObject.cn)('bg-card text-card-foreground flex flex-col gap-6 overflow-auto rounded-xl border py-6 shadow-sm', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("flex flex-col gap-6 overflow-auto rounded-xl border bg-card py-6 text-card-foreground shadow-sm", className),
         "data-slot": "card",
         ...props
     });
 }
 function CardHeader({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-        className: (0, tailwind_variants_namespaceObject.cn)('@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-[data-slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-[data-slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6", className),
         "data-slot": "card-header",
         ...props
     });
 }
 function CardTitle({ children, className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-        className: (0, tailwind_variants_namespaceObject.cn)('leading-none font-semibold', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("leading-none font-semibold", className),
         "data-slot": "card-title",
         ...props,
         children: children
@@ -58,28 +58,28 @@ function CardTitle({ children, className, ...props }) {
 }
 function CardDescription({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-        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": "card-description",
         ...props
     });
 }
 function CardContent({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-        className: (0, tailwind_variants_namespaceObject.cn)('px-6', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("px-6", className),
         "data-slot": "card-content",
         ...props
     });
 }
 function CardFooter({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-        className: (0, tailwind_variants_namespaceObject.cn)('flex items-center px-6 [.border-t]:pt-6', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("flex items-center px-6 [.border-t]:pt-6", className),
         "data-slot": "card-footer",
         ...props
     });
 }
 function CardAction({ className, ...props }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-        className: (0, tailwind_variants_namespaceObject.cn)('col-start-2 row-span-2 row-start-1 self-start justify-self-end', className),
+        className: (0, tailwind_variants_namespaceObject.cn)("col-start-2 row-span-2 row-start-1 self-start justify-self-end", className),
         "data-slot": "card-action",
         ...props
     });

package/dist/components/card.d.ts

@@ -1,17 +1,17 @@
-import type { ComponentProps, JSX } from 'react';
-type CardProps = ComponentProps<'div'>;
+import type { ComponentProps, JSX } from "react";
+type CardProps = ComponentProps<"div">;
 declare function Card({ className, ...props }: CardProps): JSX.Element;
-type CardHeaderProps = ComponentProps<'div'>;
+type CardHeaderProps = ComponentProps<"div">;
 declare function CardHeader({ className, ...props }: CardHeaderProps): JSX.Element;
-type CardTitleProps = ComponentProps<'div'>;
+type CardTitleProps = ComponentProps<"div">;
 declare function CardTitle({ children, className, ...props }: CardTitleProps): JSX.Element;
-type CardDescriptionProps = ComponentProps<'div'>;
+type CardDescriptionProps = ComponentProps<"div">;
 declare function CardDescription({ className, ...props }: CardDescriptionProps): JSX.Element;
-type CardContentProps = ComponentProps<'div'>;
+type CardContentProps = ComponentProps<"div">;
 declare function CardContent({ className, ...props }: CardContentProps): JSX.Element;
-type CardFooterProps = ComponentProps<'div'>;
+type CardFooterProps = ComponentProps<"div">;
 declare function CardFooter({ className, ...props }: CardFooterProps): JSX.Element;
-type CardActionProps = ComponentProps<'div'>;
+type CardActionProps = ComponentProps<"div">;
 declare function CardAction({ className, ...props }: CardActionProps): JSX.Element;
 export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };
 export type { CardActionProps, CardContentProps, CardDescriptionProps, CardFooterProps, CardHeaderProps, CardProps, CardTitleProps, };