@codefast/ui 0.3.10 → 0.3.11-canary.1

package/dist/components/chart.js

@@ -5,10 +5,10 @@ import { createContextScope } from "@radix-ui/react-context";
 import { useId, useMemo } from "react";
 import { Legend, ResponsiveContainer, Tooltip } from "recharts";
 const THEMES = {
-    dark: '.dark',
-    light: ''
+    dark: ".dark",
+    light: ""
 };
-const CHART_PROVIDER_NAME = 'ChartProvider';
+const CHART_PROVIDER_NAME = "ChartProvider";
 const [createChartContext, createChartScope] = createContextScope(CHART_PROVIDER_NAME);
 const [ChartContextProvider, useChartContext] = createChartContext(CHART_PROVIDER_NAME);
 function ChartContainer({ __scopeChart, children, className, config, id, ...props }) {
@@ -18,7 +18,7 @@ function ChartContainer({ __scopeChart, children, className, config, id, ...prop
         config: config,
         scope: __scopeChart,
         children: /*#__PURE__*/ jsxs("div", {
-            className: cn("[&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-border flex aspect-video justify-center text-xs [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-hidden [&_.recharts-sector]:outline-hidden [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-surface]:outline-hidden", className),
+            className: cn("flex aspect-video justify-center text-xs [&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-hidden [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-border [&_.recharts-sector]:outline-hidden [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-surface]:outline-hidden", className),
             "data-chart": chartId,
             "data-slot": "chart",
             ...props,
@@ -44,22 +44,22 @@ function ChartStyle({ config, id }) {
     });
 }
 const ChartTooltip = Tooltip;
-const CHART_TOOLTIP_CONTENT_NAME = 'ChartTooltipContent';
-function ChartTooltipContent({ __scopeChart, active, className, color, formatter, hideIndicator = false, hideLabel = false, indicator = 'dot', label, labelClassName, labelFormatter, labelKey, nameKey, payload = [] }) {
+const CHART_TOOLTIP_CONTENT_NAME = "ChartTooltipContent";
+function ChartTooltipContent({ __scopeChart, active, className, color, formatter, hideIndicator = false, hideLabel = false, indicator = "dot", label, labelClassName, labelFormatter, labelKey, nameKey, payload = [] }) {
     const { config } = useChartContext(CHART_TOOLTIP_CONTENT_NAME, __scopeChart);
     const tooltipLabel = useMemo(()=>{
         if (hideLabel || 0 === payload.length) return null;
         const [item] = payload;
-        const key = safeToString(labelKey ?? item.dataKey ?? item.name ?? 'value');
+        const key = safeToString(labelKey ?? item.dataKey ?? item.name ?? "value");
         const itemConfig = getPayloadConfigFromPayload(config, item, key);
-        const value = labelKey || 'string' != typeof label ? itemConfig?.label : label in config ? config[label].label ?? label : label;
+        const value = labelKey || "string" != typeof label ? itemConfig?.label : label in config ? config[label].label ?? label : label;
         if (labelFormatter) return /*#__PURE__*/ jsx("div", {
-            className: cn('font-medium', labelClassName),
+            className: cn("font-medium", labelClassName),
             children: labelFormatter(value, payload)
         });
         if (!value) return null;
         return /*#__PURE__*/ jsx("div", {
-            className: cn('font-medium', labelClassName),
+            className: cn("font-medium", labelClassName),
             children: value
         });
     }, [
@@ -72,37 +72,37 @@ function ChartTooltipContent({ __scopeChart, active, className, color, formatter
         labelKey
     ]);
     if (!active || 0 === payload.length) return null;
-    const nestLabel = 1 === payload.length && 'dot' !== indicator;
+    const nestLabel = 1 === payload.length && "dot" !== indicator;
     return /*#__PURE__*/ jsxs("div", {
-        className: cn('border-border/50 bg-background grid min-w-[8rem] items-start gap-1.5 rounded-lg border px-2.5 py-1.5 text-xs shadow-xl', className),
+        className: cn("grid min-w-[8rem] items-start gap-1.5 rounded-lg border border-border/50 bg-background px-2.5 py-1.5 text-xs shadow-xl", className),
         children: [
             nestLabel ? null : tooltipLabel,
             /*#__PURE__*/ jsx("div", {
                 className: "grid gap-1.5",
                 children: payload.map((item, index)=>{
-                    const key = safeToString(nameKey ?? item.name ?? item.dataKey ?? 'value');
+                    const key = safeToString(nameKey ?? item.name ?? item.dataKey ?? "value");
                     const itemConfig = getPayloadConfigFromPayload(config, item, key);
-                    const indicatorColor = color ?? (isRecord(item.payload) && 'fill' in item.payload && 'string' == typeof item.payload.fill ? item.payload.fill : void 0) ?? item.color;
+                    const indicatorColor = color ?? (isRecord(item.payload) && "fill" in item.payload && "string" == typeof item.payload.fill ? item.payload.fill : void 0) ?? item.color;
                     return /*#__PURE__*/ jsx("div", {
-                        className: cn('[&>svg]:text-muted-foreground flex w-full flex-wrap items-stretch gap-2 [&>svg]:size-2.5', 'dot' === indicator && 'items-center'),
+                        className: cn("flex w-full flex-wrap items-stretch gap-2 [&>svg]:size-2.5 [&>svg]:text-muted-foreground", "dot" === indicator && "items-center"),
                         children: formatter && void 0 !== item.value && item.name ? formatter(item.value, item.name, item, index, [
                             item
                         ]) : /*#__PURE__*/ jsxs(Fragment, {
                             children: [
                                 itemConfig?.icon ? /*#__PURE__*/ jsx(itemConfig.icon, {}) : !hideIndicator && /*#__PURE__*/ jsx("div", {
-                                    className: cn('shrink-0 rounded-xs border-(--color-border) bg-(--color-bg)', {
-                                        'h-2.5 w-2.5': 'dot' === indicator,
-                                        'my-0.5': nestLabel && 'dashed' === indicator,
-                                        'border-1.5 w-0 border-dashed bg-transparent': 'dashed' === indicator,
-                                        'w-1': 'line' === indicator
+                                    className: cn("shrink-0 rounded-xs border-(--color-border) bg-(--color-bg)", {
+                                        "h-2.5 w-2.5": "dot" === indicator,
+                                        "my-0.5": nestLabel && "dashed" === indicator,
+                                        "border-1.5 w-0 border-dashed bg-transparent": "dashed" === indicator,
+                                        "w-1": "line" === indicator
                                     }),
                                     style: {
-                                        '--color-bg': indicatorColor,
-                                        '--color-border': indicatorColor
+                                        "--color-bg": indicatorColor,
+                                        "--color-border": indicatorColor
                                     }
                                 }),
                                 /*#__PURE__*/ jsxs("div", {
-                                    className: cn('flex flex-1 justify-between leading-none', nestLabel ? 'items-end' : 'items-center'),
+                                    className: cn("flex flex-1 justify-between leading-none", nestLabel ? "items-end" : "items-center"),
                                     children: [
                                         /*#__PURE__*/ jsxs("div", {
                                             className: "grid gap-1.5",
@@ -115,8 +115,8 @@ function ChartTooltipContent({ __scopeChart, active, className, color, formatter
                                             ]
                                         }),
                                         null != item.value && /*#__PURE__*/ jsx("span", {
-                                            className: "text-foreground font-mono font-medium tabular-nums",
-                                            children: 'number' == typeof item.value ? item.value.toLocaleString() : safeToString(item.value)
+                                            className: "font-mono font-medium text-foreground tabular-nums",
+                                            children: "number" == typeof item.value ? item.value.toLocaleString() : safeToString(item.value)
                                         })
                                     ]
                                 })
@@ -129,19 +129,19 @@ function ChartTooltipContent({ __scopeChart, active, className, color, formatter
     });
 }
 const ChartLegend = Legend;
-const CHART_LEGEND_CONTENT_NAME = 'ChartLegendContent';
-function ChartLegendContent({ __scopeChart, className, hideIcon = false, nameKey, payload, verticalAlign = 'bottom' }) {
+const CHART_LEGEND_CONTENT_NAME = "ChartLegendContent";
+function ChartLegendContent({ __scopeChart, className, hideIcon = false, nameKey, payload, verticalAlign = "bottom" }) {
     const { config } = useChartContext(CHART_LEGEND_CONTENT_NAME, __scopeChart);
     if (!payload?.length) return null;
     return /*#__PURE__*/ jsx("div", {
-        className: cn('flex items-center justify-center gap-4', 'top' === verticalAlign ? 'pb-3' : 'pt-3', className),
+        className: cn("flex items-center justify-center gap-4", "top" === verticalAlign ? "pb-3" : "pt-3", className),
         children: payload.map((item)=>{
-            let key = 'value';
+            let key = "value";
             if (nameKey) key = nameKey;
             else if (null != item.dataKey) key = safeToString(item.dataKey);
             const itemConfig = getPayloadConfigFromPayload(config, item, key);
             return /*#__PURE__*/ jsxs("div", {
-                className: cn('[&>svg]:text-muted-foreground flex items-center gap-1.5 [&>svg]:size-3'),
+                className: cn("flex items-center gap-1.5 [&>svg]:size-3 [&>svg]:text-muted-foreground"),
                 children: [
                     itemConfig?.icon && !hideIcon ? /*#__PURE__*/ jsx(itemConfig.icon, {}) : /*#__PURE__*/ jsx("div", {
                         className: "size-2 shrink-0 rounded-md",
@@ -151,27 +151,27 @@ function ChartLegendContent({ __scopeChart, className, hideIcon = false, nameKey
                     }),
                     itemConfig?.label
                 ]
-            }, nameKey ? safeToString(itemConfig?.color ?? '') : safeToString(item.value ?? ''));
+            }, nameKey ? safeToString(itemConfig?.color ?? "") : safeToString(item.value ?? ""));
         })
     });
 }
 function isRecord(value) {
-    return 'object' == typeof value && null !== value;
+    return "object" == typeof value && null !== value;
 }
 function getStringValue(record, key) {
     if (key in record) {
         const value = record[key];
-        return 'string' == typeof value ? value : void 0;
+        return "string" == typeof value ? value : void 0;
     }
 }
 function safeToString(value) {
-    if ('string' == typeof value) return value;
-    if ('number' == typeof value) return value.toString();
-    if (null == value) return '';
-    if ('boolean' == typeof value) return value.toString();
-    if ('bigint' == typeof value) return value.toString();
-    if ('symbol' == typeof value) return value.toString();
-    return '';
+    if ("string" == typeof value) return value;
+    if ("number" == typeof value) return value.toString();
+    if (null == value) return "";
+    if ("boolean" == typeof value) return value.toString();
+    if ("bigint" == typeof value) return value.toString();
+    if ("symbol" == typeof value) return value.toString();
+    return "";
 }
 function getPayloadConfigFromPayload(config, payload, key) {
     if (!isRecord(payload)) return;
@@ -190,10 +190,10 @@ function generateCssVariable(key, itemConfig, theme) {
     return color ? `  --color-${key}: ${color};` : null;
 }
 function generateThemeStyles(theme, prefix, id, colorConfig) {
-    const cssVariables = colorConfig.map(([key, itemConfig])=>generateCssVariable(key, itemConfig, theme)).filter(Boolean).join('\n');
+    const cssVariables = colorConfig.map(([key, itemConfig])=>generateCssVariable(key, itemConfig, theme)).filter(Boolean).join("\n");
     return `${prefix} [data-chart=${id}] {\n${cssVariables}\n}`;
 }
 function generateChartStyles(id, colorConfig) {
-    return Object.entries(THEMES).map(([theme, prefix])=>generateThemeStyles(theme, prefix, id, colorConfig)).join('\n\n');
+    return Object.entries(THEMES).map(([theme, prefix])=>generateThemeStyles(theme, prefix, id, colorConfig)).join("\n\n");
 }
 export { ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, createChartScope };

package/dist/components/checkbox-cards.d.ts

@@ -1,5 +1,5 @@
-import type { ComponentProps, JSX } from 'react';
-import * as CheckboxGroupPrimitive from '../primitives/checkbox-group';
+import type { ComponentProps, JSX } from "react";
+import * as CheckboxGroupPrimitive from "../primitives/checkbox-group";
 type CheckboxCardsProps = ComponentProps<typeof CheckboxGroupPrimitive.Root>;
 declare function CheckboxCards(props: CheckboxCardsProps): JSX.Element;
 interface CheckboxCardsItemProps extends ComponentProps<typeof CheckboxGroupPrimitive.Item> {

package/dist/components/checkbox-cards.js

@@ -12,11 +12,11 @@ function CheckboxCards(props) {
 }
 function CheckboxCardsItem({ checkboxClassName, children, className, ...props }) {
     return /*#__PURE__*/ jsxs(Label, {
-        className: cn('border-input hover:not-has-disabled:not-has-aria-checked:bg-secondary has-aria-checked:bg-primary/10 has-aria-checked:border-primary has-focus-visible:border-ring flex items-start gap-3 rounded-lg border p-3 transition has-disabled:opacity-50', className),
+        className: cn("flex items-start gap-3 rounded-lg border border-input p-3 transition hover:not-has-disabled:not-has-aria-checked:bg-secondary has-focus-visible:border-ring has-disabled:opacity-50 has-aria-checked:border-primary has-aria-checked:bg-primary/10", className),
         "data-slot": "checkbox-card",
         children: [
             /*#__PURE__*/ jsx(Item, {
-                className: cn('border-input text-primary-foreground focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:aria-checked:ring-primary/20 dark:focus-visible:aria-checked:ring-primary/40 aria-checked:border-primary aria-checked:bg-primary dark:bg-input/30 peer flex size-4 shrink-0 rounded-sm border shadow-xs outline-hidden transition focus-visible:ring-3', checkboxClassName),
+                className: cn("peer flex size-4 shrink-0 rounded-sm border border-input text-primary-foreground shadow-xs outline-hidden transition focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 aria-checked:border-primary aria-checked:bg-primary focus-visible:aria-checked:ring-primary/20 dark:bg-input/30 dark:focus-visible:aria-checked:ring-primary/40", checkboxClassName),
                 "data-slot": "checkbox-card-item",
                 ...props,
                 children: /*#__PURE__*/ jsx(CheckboxGroupIndicator, {

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

@@ -1,5 +1,5 @@
-import type { ComponentProps, JSX } from 'react';
-import * as CheckboxGroupPrimitive from '../primitives/checkbox-group';
+import type { ComponentProps, JSX } from "react";
+import * as CheckboxGroupPrimitive from "../primitives/checkbox-group";
 type CheckboxGroupProps = ComponentProps<typeof CheckboxGroupPrimitive.Root>;
 declare function CheckboxGroup({ className, ...props }: CheckboxGroupProps): JSX.Element;
 type CheckboxGroupItemProps = ComponentProps<typeof CheckboxGroupPrimitive.Item>;

package/dist/components/checkbox-group.js

@@ -5,14 +5,14 @@ import { CheckIcon } from "lucide-react";
 import { CheckboxGroupIndicator, Item, Root } from "../primitives/checkbox-group.js";
 function CheckboxGroup({ className, ...props }) {
     return /*#__PURE__*/ jsx(Root, {
-        className: cn('grid gap-2', className),
+        className: cn("grid gap-2", className),
         "data-slot": "checkbox-group",
         ...props
     });
 }
 function CheckboxGroupItem({ className, ...props }) {
     return /*#__PURE__*/ jsx(Item, {
-        className: cn('border-input text-primary-foreground hover:not-disabled:not-aria-checked:border-ring/60 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:aria-checked:ring-primary/20 dark:focus-visible:aria-checked:ring-primary/40 aria-checked:border-primary aria-checked:bg-primary aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-checked:aria-invalid:bg-destructive hover:not-disabled:not-aria-checked:aria-invalid:border-destructive/60 dark:bg-input/30 peer flex size-4 shrink-0 items-center justify-center rounded-sm border shadow-xs outline-hidden transition focus-visible:ring-3 disabled:opacity-50', className),
+        className: cn("peer flex size-4 shrink-0 items-center justify-center rounded-sm border border-input text-primary-foreground shadow-xs outline-hidden transition hover:not-disabled:not-aria-checked:border-ring/60 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:opacity-50 aria-checked:border-primary aria-checked:bg-primary focus-visible:aria-checked:ring-primary/20 aria-invalid:border-destructive aria-invalid:ring-destructive/20 hover:not-disabled:not-aria-checked:aria-invalid:border-destructive/60 aria-checked:aria-invalid:bg-destructive dark:bg-input/30 dark:focus-visible:aria-checked:ring-primary/40 dark:aria-invalid:ring-destructive/40", className),
         "data-slot": "checkbox-group-item",
         ...props,
         children: /*#__PURE__*/ jsx(CheckboxGroupIndicator, {

package/dist/components/checkbox.d.ts

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

package/dist/components/checkbox.js

@@ -5,7 +5,7 @@ import { Indicator, Root } from "@radix-ui/react-checkbox";
 import { CheckIcon } from "lucide-react";
 function Checkbox({ className, ...props }) {
     return /*#__PURE__*/ jsx(Root, {
-        className: cn('border-input text-primary-foreground hover:not-disabled:not-aria-checked:border-ring/60 focus-visible:border-ring focus-visible:ring-ring/50 aria-checked:focus-visible:ring-primary/20 dark:aria-checked:focus-visible:ring-primary/40 aria-checked:border-primary aria-checked:aria-invalid:bg-destructive aria-checked:bg-primary aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 hover:not-disabled:not-aria-checked:aria-invalid:border-destructive/60 dark:bg-input/30 peer flex size-4 shrink-0 items-center justify-center rounded-sm border shadow-xs outline-hidden transition focus-visible:ring-3 disabled:opacity-50', className),
+        className: cn("peer flex size-4 shrink-0 items-center justify-center rounded-sm border border-input text-primary-foreground shadow-xs outline-hidden transition hover:not-disabled:not-aria-checked:border-ring/60 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:opacity-50 aria-checked:border-primary aria-checked:bg-primary aria-checked:focus-visible:ring-primary/20 aria-invalid:border-destructive aria-invalid:ring-destructive/20 hover:not-disabled:not-aria-checked:aria-invalid:border-destructive/60 aria-checked:aria-invalid:bg-destructive dark:bg-input/30 dark:aria-checked:focus-visible:ring-primary/40 dark:aria-invalid:ring-destructive/40", className),
         "data-slot": "checkbox",
         ...props,
         children: /*#__PURE__*/ jsx(Indicator, {

package/dist/components/collapsible.d.ts

@@ -1,5 +1,5 @@
-import type { ComponentProps, JSX } from 'react';
-import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
+import type { ComponentProps, JSX } from "react";
+import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
 type CollapsibleProps = ComponentProps<typeof CollapsiblePrimitive.Root>;
 declare function Collapsible({ ...props }: CollapsibleProps): JSX.Element;
 type CollapsibleTriggerProps = ComponentProps<typeof CollapsiblePrimitive.CollapsibleTrigger>;

package/dist/components/command.d.ts

@@ -1,6 +1,6 @@
-import type { ComponentProps, JSX } from 'react';
-import { Command as CommandPrimitive } from 'cmdk';
-import { Dialog } from './dialog';
+import type { ComponentProps, JSX } from "react";
+import { Command as CommandPrimitive } from "cmdk";
+import { Dialog } from "./dialog";
 type CommandProps = ComponentProps<typeof CommandPrimitive>;
 declare function Command({ className, ...props }: CommandProps): JSX.Element;
 type CommandDialogProps = ComponentProps<typeof Dialog>;
@@ -19,7 +19,7 @@ type CommandItemProps = ComponentProps<typeof CommandPrimitive.Item>;
 declare function CommandItem({ className, ...props }: CommandItemProps): JSX.Element;
 type CommandLoadingProps = ComponentProps<typeof CommandPrimitive.Loading>;
 declare function CommandLoading({ className, ...props }: CommandLoadingProps): JSX.Element;
-type CommandShortcutProps = ComponentProps<'span'>;
+type CommandShortcutProps = ComponentProps<"span">;
 declare function CommandShortcut({ className, ...props }: CommandShortcutProps): JSX.Element;
 export { Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandLoading, CommandSeparator, CommandShortcut, };
 export type { CommandDialogProps, CommandEmptyProps, CommandGroupProps, CommandInputProps, CommandItemProps, CommandListProps, CommandLoadingProps, CommandProps, CommandSeparatorProps, CommandShortcutProps, };

package/dist/components/command.js

@@ -7,7 +7,7 @@ import { SearchIcon } from "lucide-react";
 import { Dialog, DialogContent, DialogDescription, DialogTitle } from "./dialog.js";
 function command_Command({ className, ...props }) {
     return /*#__PURE__*/ jsx(Command, {
-        className: cn('bg-popover text-popover-foreground flex flex-col overflow-hidden rounded-[inherit] outline-hidden', className),
+        className: cn("flex flex-col overflow-hidden rounded-[inherit] bg-popover text-popover-foreground outline-hidden", className),
         "data-slot": "command",
         ...props
     });
@@ -31,7 +31,7 @@ function CommandDialog({ children, ...props }) {
                     ]
                 }),
                 /*#__PURE__*/ jsx(command_Command, {
-                    className: "[&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-input]]:h-12",
+                    className: "[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-input]]:h-12",
                     children: children
                 })
             ]
@@ -48,7 +48,7 @@ function CommandInput({ className, ...props }) {
                 className: "size-4 shrink-0 opacity-50"
             }),
             /*#__PURE__*/ jsx(Command.Input, {
-                className: cn('placeholder:text-muted-foreground flex h-10 w-full text-base outline-hidden disabled:opacity-50 md:text-sm', className),
+                className: cn("flex h-10 w-full text-base outline-hidden placeholder:text-muted-foreground disabled:opacity-50 md:text-sm", className),
                 "data-slot": "command-input",
                 ...props
             })
@@ -57,49 +57,49 @@ function CommandInput({ className, ...props }) {
 }
 function CommandList({ className, ...props }) {
     return /*#__PURE__*/ jsx(Command.List, {
-        className: cn('max-h-75 overflow-x-hidden overflow-y-auto', className),
+        className: cn("max-h-75 overflow-x-hidden overflow-y-auto", className),
         "data-slot": "command-list",
         ...props
     });
 }
 function CommandEmpty({ className, ...props }) {
     return /*#__PURE__*/ jsx(Command.Empty, {
-        className: cn('py-6 text-center text-sm', className),
+        className: cn("py-6 text-center text-sm", className),
         "data-slot": "command-empty",
         ...props
     });
 }
 function CommandGroup({ className, ...props }) {
     return /*#__PURE__*/ jsx(Command.Group, {
-        className: cn('text-foreground [&_[cmdk-group-heading]]:text-muted-foreground overflow-hidden p-1 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium', className),
+        className: cn("overflow-hidden p-1 text-foreground [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground", className),
         "data-slot": "command-group",
         ...props
     });
 }
 function CommandSeparator({ className, ...props }) {
     return /*#__PURE__*/ jsx(Command.Separator, {
-        className: cn('bg-border -mx-1 h-px', className),
+        className: cn("-mx-1 h-px bg-border", className),
         "data-slot": "command-separator",
         ...props
     });
 }
 function CommandItem({ className, ...props }) {
     return /*#__PURE__*/ jsx(Command.Item, {
-        className: cn("aria-selected:bg-accent aria-selected:text-accent-foreground group/command-item [&_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 [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
+        className: cn("group/command-item 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 aria-selected:bg-accent aria-selected:text-accent-foreground [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground", className),
         "data-slot": "command-item",
         ...props
     });
 }
 function CommandLoading({ className, ...props }) {
     return /*#__PURE__*/ jsx(Command.Loading, {
-        className: cn('flex justify-center p-2', className),
+        className: cn("flex justify-center p-2", className),
         "data-slot": "command-loading",
         ...props
     });
 }
 function CommandShortcut({ className, ...props }) {
     return /*#__PURE__*/ jsx("span", {
-        className: cn('text-muted-foreground ml-auto text-xs tracking-widest', className),
+        className: cn("ml-auto text-xs tracking-widest text-muted-foreground", className),
         "data-slot": "command-shortcut",
         ...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.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, };