@codefast/ui 0.3.11-canary.1 → 0.3.11

package/dist/components/empty.js

@@ -1,61 +1,59 @@
-import { jsx } from "react/jsx-runtime";
 import { cn, tv } from "@codefast/tailwind-variants";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/empty.tsx
 const emptyMediaVariants = tv({
-    base: "mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0",
-    defaultVariants: {
-        variant: "default"
-    },
-    variants: {
-        variant: {
-            default: "bg-transparent",
-            icon: "flex size-10 shrink-0 items-center justify-center rounded-xl bg-muted text-foreground [&_svg:not([class*='size-'])]:size-6"
-        }
-    }
+	base: "mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0",
+	defaultVariants: { variant: "default" },
+	variants: { variant: {
+		default: "bg-transparent",
+		icon: "flex size-10 shrink-0 items-center justify-center rounded-xl bg-muted text-foreground [&_svg:not([class*='size-'])]:size-6"
+	} }
 });
 function Empty({ className, ...props }) {
-    return /*#__PURE__*/ jsx("div", {
-        className: cn("flex min-w-0 flex-1 flex-col items-center justify-center gap-6 rounded-xl border-dashed p-6 text-center text-balance md:p-12", className),
-        "data-slot": "empty",
-        ...props
-    });
+	return /* @__PURE__ */ jsx("div", {
+		className: cn("flex min-w-0 flex-1 flex-col items-center justify-center gap-6 rounded-xl border-dashed p-6 text-center text-balance md:p-12", className),
+		"data-slot": "empty",
+		...props
+	});
 }
 function EmptyHeader({ className, ...props }) {
-    return /*#__PURE__*/ jsx("div", {
-        className: cn("flex max-w-sm flex-col items-center gap-2 text-center", className),
-        "data-slot": "empty-header",
-        ...props
-    });
+	return /* @__PURE__ */ jsx("div", {
+		className: cn("flex max-w-sm flex-col items-center gap-2 text-center", className),
+		"data-slot": "empty-header",
+		...props
+	});
 }
 function EmptyMedia({ className, variant = "default", ...props }) {
-    return /*#__PURE__*/ jsx("div", {
-        className: emptyMediaVariants({
-            className,
-            variant
-        }),
-        "data-slot": "empty-icon",
-        "data-variant": variant,
-        ...props
-    });
+	return /* @__PURE__ */ jsx("div", {
+		className: emptyMediaVariants({
+			className,
+			variant
+		}),
+		"data-slot": "empty-icon",
+		"data-variant": variant,
+		...props
+	});
 }
 function EmptyTitle({ className, ...props }) {
-    return /*#__PURE__*/ jsx("div", {
-        className: cn("text-lg font-medium tracking-tight", className),
-        "data-slot": "empty-title",
-        ...props
-    });
+	return /* @__PURE__ */ jsx("div", {
+		className: cn("text-lg font-medium tracking-tight", className),
+		"data-slot": "empty-title",
+		...props
+	});
 }
 function EmptyDescription({ className, ...props }) {
-    return /*#__PURE__*/ jsx("p", {
-        className: cn("text-sm/relaxed text-muted-foreground [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary", className),
-        "data-slot": "empty-description",
-        ...props
-    });
+	return /* @__PURE__ */ jsx("p", {
+		className: cn("text-sm/relaxed text-muted-foreground [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary", className),
+		"data-slot": "empty-description",
+		...props
+	});
 }
 function EmptyContent({ className, ...props }) {
-    return /*#__PURE__*/ jsx("div", {
-        className: cn("flex w-full max-w-sm min-w-0 flex-col items-center gap-4 text-sm text-balance", className),
-        "data-slot": "empty-content",
-        ...props
-    });
+	return /* @__PURE__ */ jsx("div", {
+		className: cn("flex w-full max-w-sm min-w-0 flex-col items-center gap-4 text-sm text-balance", className),
+		"data-slot": "empty-content",
+		...props
+	});
 }
+//#endregion
 export { Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, emptyMediaVariants };

package/dist/components/field.d.ts

@@ -1,41 +1,79 @@
-import type { VariantProps } from "@codefast/tailwind-variants";
-import type { ComponentProps, JSX } from "react";
-import { Label } from "./label";
-declare const fieldVariants: import("@codefast/tailwind-variants").VariantFunctionType<{
-    orientation: {
-        horizontal: string;
-        responsive: string;
-        vertical: string;
-    };
+import { Label } from "./label.js";
+import * as _$_codefast_tailwind_variants0 from "@codefast/tailwind-variants";
+import { VariantProps } from "@codefast/tailwind-variants";
+import { ComponentProps, JSX } from "react";
+
+//#region src/components/field.d.ts
+declare const fieldVariants: _$_codefast_tailwind_variants0.VariantFunctionType<{
+  orientation: {
+    horizontal: string;
+    responsive: string;
+    vertical: string;
+  };
 }, Record<string, never>>;
 type FieldSetProps = ComponentProps<"fieldset">;
-declare function FieldSet({ className, ...props }: FieldSetProps): JSX.Element;
+declare function FieldSet({
+  className,
+  ...props
+}: FieldSetProps): JSX.Element;
 type FieldLegendProps = ComponentProps<"legend"> & {
-    variant?: "label" | "legend";
+  variant?: "label" | "legend";
 };
-declare function FieldLegend({ className, variant, ...props }: FieldLegendProps): JSX.Element;
+declare function FieldLegend({
+  className,
+  variant,
+  ...props
+}: FieldLegendProps): JSX.Element;
 type FieldGroupProps = ComponentProps<"div">;
-declare function FieldGroup({ className, ...props }: FieldGroupProps): JSX.Element;
+declare function FieldGroup({
+  className,
+  ...props
+}: FieldGroupProps): JSX.Element;
 type FieldProps = ComponentProps<"div"> & VariantProps<typeof fieldVariants>;
-declare function Field({ className, orientation, ...props }: FieldProps): JSX.Element;
+declare function Field({
+  className,
+  orientation,
+  ...props
+}: FieldProps): JSX.Element;
 type FieldContentProps = ComponentProps<"div">;
-declare function FieldContent({ className, ...props }: FieldContentProps): JSX.Element;
+declare function FieldContent({
+  className,
+  ...props
+}: FieldContentProps): JSX.Element;
 type FieldLabelProps = ComponentProps<typeof Label>;
-declare function FieldLabel({ className, ...props }: FieldLabelProps): JSX.Element;
+declare function FieldLabel({
+  className,
+  ...props
+}: FieldLabelProps): JSX.Element;
 type FieldTitleProps = ComponentProps<"div">;
-declare function FieldTitle({ className, ...props }: FieldTitleProps): JSX.Element;
+declare function FieldTitle({
+  className,
+  ...props
+}: FieldTitleProps): JSX.Element;
 type FieldDescriptionProps = ComponentProps<"p">;
-declare function FieldDescription({ className, ...props }: FieldDescriptionProps): JSX.Element;
+declare function FieldDescription({
+  className,
+  ...props
+}: FieldDescriptionProps): JSX.Element;
 type FieldSeparatorProps = ComponentProps<"div"> & {
-    children?: ComponentProps<"span">["children"];
+  children?: ComponentProps<"span">["children"];
 };
-declare function FieldSeparator({ children, className, ...props }: FieldSeparatorProps): JSX.Element;
+declare function FieldSeparator({
+  children,
+  className,
+  ...props
+}: FieldSeparatorProps): JSX.Element;
 interface FieldErrorMessage {
-    message?: string;
+  message?: string;
 }
 interface FieldErrorProps extends ComponentProps<"div"> {
-    errors?: (FieldErrorMessage | undefined)[];
+  errors?: (FieldErrorMessage | undefined)[];
 }
-declare function FieldError({ children, className, errors, ...props }: FieldErrorProps): JSX.Element | null;
-export { Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, fieldVariants, };
-export type { FieldContentProps, FieldDescriptionProps, FieldErrorProps, FieldGroupProps, FieldLabelProps, FieldLegendProps, FieldProps, FieldSeparatorProps, FieldSetProps, FieldTitleProps, };
+declare function FieldError({
+  children,
+  className,
+  errors,
+  ...props
+}: FieldErrorProps): JSX.Element | null;
+//#endregion
+export { Field, FieldContent, type FieldContentProps, FieldDescription, type FieldDescriptionProps, FieldError, type FieldErrorProps, FieldGroup, type FieldGroupProps, FieldLabel, type FieldLabelProps, FieldLegend, type FieldLegendProps, type FieldProps, FieldSeparator, type FieldSeparatorProps, FieldSet, type FieldSetProps, FieldTitle, type FieldTitleProps, fieldVariants };

package/dist/components/field.js

@@ -1,130 +1,114 @@
 "use client";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { Separator } from "./separator.js";
+import { Label } from "./label.js";
 import { cn, tv } from "@codefast/tailwind-variants";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { useMemo } from "react";
-import { Label } from "./label.js";
-import { Separator } from "./separator.js";
+//#region src/components/field.tsx
 const fieldVariants = tv({
-    base: "group/field flex w-full gap-3 data-[invalid=true]:text-destructive",
-    defaultVariants: {
-        orientation: "vertical"
-    },
-    variants: {
-        orientation: {
-            horizontal: cn("flex-row items-center", "[&>[data-slot=field-label]]:flex-auto", "has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px"),
-            responsive: cn("flex-col [&>*]:w-full [&>.sr-only]:w-auto", "@md/field-group:flex-row @md/field-group:items-center @md/field-group:[&>*]:w-auto", "@md/field-group:[&>[data-slot=field-label]]:flex-auto", "@md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px"),
-            vertical: "flex-col [&>*]:w-full [&>.sr-only]:w-auto"
-        }
-    }
+	base: "group/field flex w-full gap-3 data-[invalid=true]:text-destructive",
+	defaultVariants: { orientation: "vertical" },
+	variants: { orientation: {
+		horizontal: cn("flex-row items-center", "[&>[data-slot=field-label]]:flex-auto", "has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px"),
+		responsive: cn("flex-col [&>*]:w-full [&>.sr-only]:w-auto", "@md/field-group:flex-row @md/field-group:items-center @md/field-group:[&>*]:w-auto", "@md/field-group:[&>[data-slot=field-label]]:flex-auto", "@md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px"),
+		vertical: "flex-col [&>*]:w-full [&>.sr-only]:w-auto"
+	} }
 });
 function FieldSet({ className, ...props }) {
-    return /*#__PURE__*/ jsx("fieldset", {
-        className: cn("flex flex-col gap-6", "has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3", className),
-        "data-slot": "field-set",
-        ...props
-    });
+	return /* @__PURE__ */ jsx("fieldset", {
+		className: cn("flex flex-col gap-6", "has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3", className),
+		"data-slot": "field-set",
+		...props
+	});
 }
 function FieldLegend({ className, variant = "legend", ...props }) {
-    return /*#__PURE__*/ jsx("legend", {
-        className: cn("mb-3 text-base font-medium", "data-[variant=label]:text-sm", className),
-        "data-slot": "field-legend",
-        "data-variant": variant,
-        ...props
-    });
+	return /* @__PURE__ */ jsx("legend", {
+		className: cn("mb-3 text-base font-medium", "data-[variant=label]:text-sm", className),
+		"data-slot": "field-legend",
+		"data-variant": variant,
+		...props
+	});
 }
 function FieldGroup({ className, ...props }) {
-    return /*#__PURE__*/ jsx("div", {
-        className: cn("group/field-group @container/field-group flex w-full flex-col gap-7 data-[slot=checkbox-group]:gap-3 [&>[data-slot=field-group]]:gap-4", className),
-        "data-slot": "field-group",
-        ...props
-    });
+	return /* @__PURE__ */ jsx("div", {
+		className: cn("group/field-group @container/field-group flex w-full flex-col gap-7 data-[slot=checkbox-group]:gap-3 [&>[data-slot=field-group]]:gap-4", className),
+		"data-slot": "field-group",
+		...props
+	});
 }
 function Field({ className, orientation = "vertical", ...props }) {
-    return /*#__PURE__*/ jsx("div", {
-        className: fieldVariants({
-            className,
-            orientation
-        }),
-        "data-orientation": orientation,
-        "data-slot": "field",
-        role: "group",
-        ...props
-    });
+	return /* @__PURE__ */ jsx("div", {
+		className: fieldVariants({
+			className,
+			orientation
+		}),
+		"data-orientation": orientation,
+		"data-slot": "field",
+		role: "group",
+		...props
+	});
 }
 function FieldContent({ className, ...props }) {
-    return /*#__PURE__*/ jsx("div", {
-        className: cn("group/field-content flex flex-1 flex-col gap-1.5 leading-snug", className),
-        "data-slot": "field-content",
-        ...props
-    });
+	return /* @__PURE__ */ jsx("div", {
+		className: cn("group/field-content flex flex-1 flex-col gap-1.5 leading-snug", className),
+		"data-slot": "field-content",
+		...props
+	});
 }
 function FieldLabel({ className, ...props }) {
-    return /*#__PURE__*/ jsx(Label, {
-        className: cn("group/field-label peer/field-label flex w-fit gap-2 leading-snug group-data-[disabled=true]/field:opacity-50", "has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col has-[>[data-slot=field]]:rounded-lg has-[>[data-slot=field]]:border [&>*]:data-[slot=field]:p-4", "has-data-[state=checked]:border-primary has-data-[state=checked]:bg-primary/5 dark:has-data-[state=checked]:bg-primary/10", className),
-        "data-slot": "field-label",
-        ...props
-    });
+	return /* @__PURE__ */ jsx(Label, {
+		className: cn("group/field-label peer/field-label flex w-fit gap-2 leading-snug group-data-[disabled=true]/field:opacity-50", "has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col has-[>[data-slot=field]]:rounded-lg has-[>[data-slot=field]]:border [&>*]:data-[slot=field]:p-4", "has-data-[state=checked]:border-primary has-data-[state=checked]:bg-primary/5 dark:has-data-[state=checked]:bg-primary/10", className),
+		"data-slot": "field-label",
+		...props
+	});
 }
 function FieldTitle({ className, ...props }) {
-    return /*#__PURE__*/ jsx("div", {
-        className: cn("flex w-fit items-center gap-2 text-sm leading-snug font-medium group-data-[disabled=true]/field:opacity-50", className),
-        "data-slot": "field-label",
-        ...props
-    });
+	return /* @__PURE__ */ jsx("div", {
+		className: cn("flex w-fit items-center gap-2 text-sm leading-snug font-medium group-data-[disabled=true]/field:opacity-50", className),
+		"data-slot": "field-label",
+		...props
+	});
 }
 function FieldDescription({ className, ...props }) {
-    return /*#__PURE__*/ jsx("p", {
-        className: cn("text-sm leading-normal font-normal text-muted-foreground group-has-[[data-orientation=horizontal]]/field:text-balance", "last:mt-0 nth-last-2:-mt-1 [[data-variant=legend]+&]:-mt-1.5", "[&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary", className),
-        "data-slot": "field-description",
-        ...props
-    });
+	return /* @__PURE__ */ jsx("p", {
+		className: cn("text-sm leading-normal font-normal text-muted-foreground group-has-[[data-orientation=horizontal]]/field:text-balance", "last:mt-0 nth-last-2:-mt-1 [[data-variant=legend]+&]:-mt-1.5", "[&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary", className),
+		"data-slot": "field-description",
+		...props
+	});
 }
 function FieldSeparator({ children, className, ...props }) {
-    const hasContent = Boolean(children);
-    return /*#__PURE__*/ jsxs("div", {
-        className: cn("relative -my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2", className),
-        "data-content": hasContent,
-        "data-slot": "field-separator",
-        ...props,
-        children: [
-            /*#__PURE__*/ jsx(Separator, {
-                className: "absolute inset-0 top-1/2"
-            }),
-            hasContent ? /*#__PURE__*/ jsx("span", {
-                className: "relative mx-auto block w-fit bg-background px-2 text-muted-foreground",
-                "data-slot": "field-separator-content",
-                children: children
-            }) : null
-        ]
-    });
+	const hasContent = Boolean(children);
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("relative -my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2", className),
+		"data-content": hasContent,
+		"data-slot": "field-separator",
+		...props,
+		children: [/* @__PURE__ */ jsx(Separator, { className: "absolute inset-0 top-1/2" }), hasContent ? /* @__PURE__ */ jsx("span", {
+			className: "relative mx-auto block w-fit bg-background px-2 text-muted-foreground",
+			"data-slot": "field-separator-content",
+			children
+		}) : null]
+	});
 }
 function FieldError({ children, className, errors, ...props }) {
-    const fallbackContent = useMemo(()=>{
-        if (!errors?.length) return null;
-        const uniqueErrors = [
-            ...new Map(errors.map((error)=>[
-                    error?.message,
-                    error
-                ])).values()
-        ];
-        if (1 === uniqueErrors.length) return uniqueErrors[0]?.message ?? null;
-        return /*#__PURE__*/ jsx("ul", {
-            className: "ml-4 flex list-disc flex-col gap-1",
-            children: uniqueErrors.map((error)=>error?.message ? /*#__PURE__*/ jsx("li", {
-                    children: error.message
-                }, error.message) : null)
-        });
-    }, [
-        errors
-    ]);
-    const content = children ?? fallbackContent;
-    if (null == content || false === content) return null;
-    return /*#__PURE__*/ jsx("div", {
-        className: cn("text-sm font-normal text-destructive", className),
-        "data-slot": "field-error",
-        role: "alert",
-        ...props,
-        children: content
-    });
+	const fallbackContent = useMemo(() => {
+		if (!errors?.length) return null;
+		const uniqueErrors = [...new Map(errors.map((error) => [error?.message, error])).values()];
+		if (uniqueErrors.length === 1) return uniqueErrors[0]?.message ?? null;
+		return /* @__PURE__ */ jsx("ul", {
+			className: "ml-4 flex list-disc flex-col gap-1",
+			children: uniqueErrors.map((error) => error?.message ? /* @__PURE__ */ jsx("li", { children: error.message }, error.message) : null)
+		});
+	}, [errors]);
+	const content = children ?? fallbackContent;
+	if (content === null || content === void 0 || content === false) return null;
+	return /* @__PURE__ */ jsx("div", {
+		className: cn("text-sm font-normal text-destructive", className),
+		"data-slot": "field-error",
+		role: "alert",
+		...props,
+		children: content
+	});
 }
+//#endregion
 export { Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, fieldVariants };

package/dist/components/form.d.ts

@@ -1,26 +1,48 @@
-import type { Scope } from "@radix-ui/react-context";
-import type * as LabelPrimitive from "@radix-ui/react-label";
-import type { ComponentProps, JSX, ReactNode } from "react";
-import type { ControllerProps, FieldPath, FieldValues } from "react-hook-form";
 import { Slot } from "@radix-ui/react-slot";
-import { FormProvider } from "react-hook-form";
+import { ComponentProps, JSX, ReactNode } from "react";
+import * as _$_radix_ui_react_context0 from "@radix-ui/react-context";
+import { Scope } from "@radix-ui/react-context";
+import * as LabelPrimitive from "@radix-ui/react-label";
+import * as _$react_hook_form0 from "react-hook-form";
+import { ControllerProps, FieldPath, FieldValues, FormProvider } from "react-hook-form";
+
+//#region src/components/form.d.ts
 type FormProps = ComponentProps<typeof FormProvider>;
-declare const Form: <TFieldValues extends FieldValues, TContext = any, TTransformedValues = TFieldValues>(props: import("react-hook-form").FormProviderProps<TFieldValues, TContext, TTransformedValues>) => React.JSX.Element;
+declare const Form: <TFieldValues extends FieldValues, TContext = any, TTransformedValues = TFieldValues>(props: _$react_hook_form0.FormProviderProps<TFieldValues, TContext, TTransformedValues>) => React.JSX.Element;
 type ScopedProps<P> = P & {
-    __scopeFormField?: Scope;
+  __scopeFormField?: Scope;
 };
-declare const createFormFieldScope: import("@radix-ui/react-context").CreateScope;
+declare const createFormFieldScope: _$_radix_ui_react_context0.CreateScope;
 type FormFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = ControllerProps<TFieldValues, TName>;
 declare function FormField<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>(formFieldProps: ScopedProps<FormFieldProps<TFieldValues, TName>>): JSX.Element;
 type FormItemProps = ComponentProps<"div">;
-declare function FormItem({ __scopeFormField, className, ...props }: ScopedProps<FormItemProps>): JSX.Element;
+declare function FormItem({
+  __scopeFormField,
+  className,
+  ...props
+}: ScopedProps<FormItemProps>): JSX.Element;
 type FormLabelProps = ComponentProps<typeof LabelPrimitive.Root>;
-declare function FormLabel({ __scopeFormField, ...props }: ScopedProps<FormLabelProps>): JSX.Element;
+declare function FormLabel({
+  __scopeFormField,
+  ...props
+}: ScopedProps<FormLabelProps>): JSX.Element;
 type FormControlProps = ComponentProps<typeof Slot>;
-declare function FormControl({ __scopeFormField, ...props }: ScopedProps<FormControlProps>): JSX.Element;
+declare function FormControl({
+  __scopeFormField,
+  ...props
+}: ScopedProps<FormControlProps>): JSX.Element;
 type FormDescriptionProps = ComponentProps<"p">;
-declare function FormDescription({ __scopeFormField, className, ...props }: ScopedProps<FormDescriptionProps>): JSX.Element;
+declare function FormDescription({
+  __scopeFormField,
+  className,
+  ...props
+}: ScopedProps<FormDescriptionProps>): JSX.Element;
 type FormMessageProps = ComponentProps<"p">;
-declare function FormMessage({ __scopeFormField, children, className, ...props }: ScopedProps<FormMessageProps>): ReactNode;
-export type { FormControlProps, FormDescriptionProps, FormFieldProps, FormItemProps, FormLabelProps, FormMessageProps, FormProps, };
-export { createFormFieldScope, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, };
+declare function FormMessage({
+  __scopeFormField,
+  children,
+  className,
+  ...props
+}: ScopedProps<FormMessageProps>): ReactNode;
+//#endregion
+export { Form, FormControl, type FormControlProps, FormDescription, type FormDescriptionProps, FormField, type FormFieldProps, FormItem, type FormItemProps, FormLabel, type FormLabelProps, FormMessage, type FormMessageProps, type FormProps, createFormFieldScope };