@codefast/ui 0.3.11-canary.1 → 0.3.11

package/dist/components/form.js

@@ -1,97 +1,92 @@
 "use client";
-import { jsx } from "react/jsx-runtime";
+import { Label } from "./label.js";
 import { cn } from "@codefast/tailwind-variants";
-import { createContextScope } from "@radix-ui/react-context";
 import { Slot } from "@radix-ui/react-slot";
+import { jsx } from "react/jsx-runtime";
 import { useId } from "react";
+import { createContextScope } from "@radix-ui/react-context";
 import { Controller, FormProvider, useFormContext, useFormState } from "react-hook-form";
-import { Label } from "./label.js";
+//#region src/components/form.tsx
 const Form = FormProvider;
 const FORM_FIELD_NAME = "FormField";
 const [createFormFieldContext, createFormFieldScope] = createContextScope(FORM_FIELD_NAME);
 const [FormFieldContextProvider, useFormFieldContext] = createFormFieldContext(FORM_FIELD_NAME);
 function useFormItem(consumerName, scope) {
-    const { id } = useFormItemContext(consumerName, scope);
-    const { name } = useFormFieldContext(consumerName, scope);
-    const { getFieldState } = useFormContext();
-    const formState = useFormState({
-        name
-    });
-    const fieldState = getFieldState(name, formState);
-    return {
-        formDescriptionId: `form-item-description-${id}`,
-        formItemId: `form-item-${id}`,
-        formMessageId: `form-item-message-${id}`,
-        id,
-        name,
-        ...fieldState
-    };
+	const { id } = useFormItemContext(consumerName, scope);
+	const { name } = useFormFieldContext(consumerName, scope);
+	const { getFieldState } = useFormContext();
+	const fieldState = getFieldState(name, useFormState({ name }));
+	return {
+		formDescriptionId: `form-item-description-${id}`,
+		formItemId: `form-item-${id}`,
+		formMessageId: `form-item-message-${id}`,
+		id,
+		name,
+		...fieldState
+	};
 }
 function FormField(formFieldProps) {
-    const { __scopeFormField, ...props } = formFieldProps;
-    return /*#__PURE__*/ jsx(FormFieldContextProvider, {
-        name: props.name,
-        scope: __scopeFormField,
-        children: /*#__PURE__*/ jsx(Controller, {
-            ...props
-        })
-    });
+	const { __scopeFormField, ...props } = formFieldProps;
+	return /* @__PURE__ */ jsx(FormFieldContextProvider, {
+		name: props.name,
+		scope: __scopeFormField,
+		children: /* @__PURE__ */ jsx(Controller, { ...props })
+	});
 }
-const FORM_ITEM_NAME = "FormItem";
-const [FormItemContextProvider, useFormItemContext] = createFormFieldContext(FORM_ITEM_NAME);
+const [FormItemContextProvider, useFormItemContext] = createFormFieldContext("FormItem");
 function FormItem({ __scopeFormField, className, ...props }) {
-    const id = useId();
-    return /*#__PURE__*/ jsx(FormItemContextProvider, {
-        id: id,
-        scope: __scopeFormField,
-        children: /*#__PURE__*/ jsx("div", {
-            className: cn("grid gap-2", className),
-            "data-slot": "form-item",
-            ...props
-        })
-    });
+	return /* @__PURE__ */ jsx(FormItemContextProvider, {
+		id: useId(),
+		scope: __scopeFormField,
+		children: /* @__PURE__ */ jsx("div", {
+			className: cn("grid gap-2", className),
+			"data-slot": "form-item",
+			...props
+		})
+	});
 }
 const FORM_LABEL_NAME = "FormLabel";
 function FormLabel({ __scopeFormField, ...props }) {
-    const { error, formItemId } = useFormItem(FORM_LABEL_NAME, __scopeFormField);
-    return /*#__PURE__*/ jsx(Label, {
-        "data-invalid": error ? true : void 0,
-        "data-slot": "form-label",
-        htmlFor: formItemId,
-        ...props
-    });
+	const { error, formItemId } = useFormItem(FORM_LABEL_NAME, __scopeFormField);
+	return /* @__PURE__ */ jsx(Label, {
+		"data-invalid": error ? true : void 0,
+		"data-slot": "form-label",
+		htmlFor: formItemId,
+		...props
+	});
 }
 const FORM_CONTROL_NAME = "FormControl";
 function FormControl({ __scopeFormField, ...props }) {
-    const { error, formDescriptionId, formItemId, formMessageId } = useFormItem(FORM_CONTROL_NAME, __scopeFormField);
-    return /*#__PURE__*/ jsx(Slot, {
-        "aria-describedby": error ? `${formDescriptionId} ${formMessageId}` : formDescriptionId,
-        "aria-invalid": Boolean(error),
-        "data-slot": "form-control",
-        id: formItemId,
-        ...props
-    });
+	const { error, formDescriptionId, formItemId, formMessageId } = useFormItem(FORM_CONTROL_NAME, __scopeFormField);
+	return /* @__PURE__ */ jsx(Slot, {
+		"aria-describedby": error ? `${formDescriptionId} ${formMessageId}` : formDescriptionId,
+		"aria-invalid": Boolean(error),
+		"data-slot": "form-control",
+		id: formItemId,
+		...props
+	});
 }
 function FormDescription({ __scopeFormField, className, ...props }) {
-    const { formDescriptionId } = useFormItem(FORM_MESSAGE_NAME, __scopeFormField);
-    return /*#__PURE__*/ jsx("p", {
-        className: cn("text-xs text-muted-foreground", className),
-        "data-slot": "form-description",
-        id: formDescriptionId,
-        ...props
-    });
+	const { formDescriptionId } = useFormItem(FORM_MESSAGE_NAME, __scopeFormField);
+	return /* @__PURE__ */ jsx("p", {
+		className: cn("text-xs text-muted-foreground", className),
+		"data-slot": "form-description",
+		id: formDescriptionId,
+		...props
+	});
 }
 const FORM_MESSAGE_NAME = "FormMessage";
 function FormMessage({ __scopeFormField, children, className, ...props }) {
-    const { error, formMessageId } = useFormItem(FORM_MESSAGE_NAME, __scopeFormField);
-    const body = error?.message ?? children;
-    if (!body) return null;
-    return /*#__PURE__*/ jsx("p", {
-        className: cn("text-xs", error?.message ? "font-medium text-destructive" : "text-muted-foreground", className),
-        "data-slot": "form-message",
-        id: formMessageId,
-        ...props,
-        children: body
-    });
+	const { error, formMessageId } = useFormItem(FORM_MESSAGE_NAME, __scopeFormField);
+	const body = error?.message ?? children;
+	if (!body) return null;
+	return /* @__PURE__ */ jsx("p", {
+		className: cn("text-xs", error?.message ? "font-medium text-destructive" : "text-muted-foreground", className),
+		"data-slot": "form-message",
+		id: formMessageId,
+		...props,
+		children: body
+	});
 }
+//#endregion
 export { Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, createFormFieldScope };

package/dist/components/hover-card.d.ts

@@ -1,12 +1,26 @@
-import type { ComponentProps, JSX } from "react";
+import { ComponentProps, JSX } from "react";
 import * as HoverCardPrimitive from "@radix-ui/react-hover-card";
+
+//#region src/components/hover-card.d.ts
 type HoverCardProps = ComponentProps<typeof HoverCardPrimitive.Root>;
-declare function HoverCard({ ...props }: HoverCardProps): JSX.Element;
+declare function HoverCard({
+  ...props
+}: HoverCardProps): JSX.Element;
 type HoverCardTriggerProps = ComponentProps<typeof HoverCardPrimitive.Trigger>;
-declare function HoverCardTrigger({ ...props }: HoverCardTriggerProps): JSX.Element;
+declare function HoverCardTrigger({
+  ...props
+}: HoverCardTriggerProps): JSX.Element;
 type HoverCardContentProps = ComponentProps<typeof HoverCardPrimitive.Content>;
-declare function HoverCardContent({ align, className, sideOffset, ...props }: HoverCardContentProps): JSX.Element;
+declare function HoverCardContent({
+  align,
+  className,
+  sideOffset,
+  ...props
+}: HoverCardContentProps): JSX.Element;
 type HoverCardArrowProps = ComponentProps<typeof HoverCardPrimitive.Arrow>;
-declare function HoverCardArrow({ className, ...props }: HoverCardArrowProps): JSX.Element;
-export { HoverCard, HoverCardArrow, HoverCardContent, HoverCardTrigger };
-export type { HoverCardArrowProps, HoverCardContentProps, HoverCardProps, HoverCardTriggerProps };
+declare function HoverCardArrow({
+  className,
+  ...props
+}: HoverCardArrowProps): JSX.Element;
+//#endregion
+export { HoverCard, HoverCardArrow, type HoverCardArrowProps, HoverCardContent, type HoverCardContentProps, type HoverCardProps, HoverCardTrigger, type HoverCardTriggerProps };

package/dist/components/hover-card.js

@@ -1,35 +1,35 @@
 "use client";
-import { jsx } from "react/jsx-runtime";
 import { cn } from "@codefast/tailwind-variants";
-import { Arrow, Content, Portal, Root, Trigger } from "@radix-ui/react-hover-card";
+import { jsx } from "react/jsx-runtime";
+import * as HoverCardPrimitive from "@radix-ui/react-hover-card";
+//#region src/components/hover-card.tsx
 function HoverCard({ ...props }) {
-    return /*#__PURE__*/ jsx(Root, {
-        "data-slot": "hover-card",
-        ...props
-    });
+	return /* @__PURE__ */ jsx(HoverCardPrimitive.Root, {
+		"data-slot": "hover-card",
+		...props
+	});
 }
 function HoverCardTrigger({ ...props }) {
-    return /*#__PURE__*/ jsx(Trigger, {
-        "data-slot": "hover-card-trigger",
-        ...props
-    });
+	return /* @__PURE__ */ jsx(HoverCardPrimitive.Trigger, {
+		"data-slot": "hover-card-trigger",
+		...props
+	});
 }
 function HoverCardContent({ align = "center", className, sideOffset = 4, ...props }) {
-    return /*#__PURE__*/ jsx(Portal, {
-        children: /*#__PURE__*/ jsx(Content, {
-            align: align,
-            className: cn("z-50 min-w-32 origin-(--radix-hover-card-content-transform-origin) rounded-lg border bg-popover p-4 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": "hover-card-content",
-            sideOffset: sideOffset,
-            ...props
-        })
-    });
+	return /* @__PURE__ */ jsx(HoverCardPrimitive.Portal, { children: /* @__PURE__ */ jsx(HoverCardPrimitive.Content, {
+		align,
+		className: cn("z-50 min-w-32 origin-(--radix-hover-card-content-transform-origin) rounded-lg border bg-popover p-4 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": "hover-card-content",
+		sideOffset,
+		...props
+	}) });
 }
 function HoverCardArrow({ className, ...props }) {
-    return /*#__PURE__*/ jsx(Arrow, {
-        className: cn("fill-popover", className),
-        "data-slot": "hover-card-arrow",
-        ...props
-    });
+	return /* @__PURE__ */ jsx(HoverCardPrimitive.Arrow, {
+		className: cn("fill-popover", className),
+		"data-slot": "hover-card-arrow",
+		...props
+	});
 }
+//#endregion
 export { HoverCard, HoverCardArrow, HoverCardContent, HoverCardTrigger };

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

@@ -1,36 +1,61 @@
-import type { VariantProps } from "@codefast/tailwind-variants";
-import type { ComponentProps, JSX } from "react";
-import type { ButtonProps } from "./button";
-import type { InputProps } from "./input";
-import type { TextareaProps } from "./textarea";
-declare const inputGroupVariants: import("@codefast/tailwind-variants").VariantFunctionType<import("@codefast/tailwind-variants").ConfigurationSchema, Record<string, never>>;
-declare const inputGroupAddonVariants: import("@codefast/tailwind-variants").VariantFunctionType<{
-    align: {
-        "block-end": string;
-        "block-start": string;
-        "inline-end": string;
-        "inline-start": string;
-    };
+import { ButtonProps } from "./button.js";
+import { InputProps } from "./input.js";
+import { TextareaProps } from "./textarea.js";
+import * as _$_codefast_tailwind_variants0 from "@codefast/tailwind-variants";
+import { VariantProps } from "@codefast/tailwind-variants";
+import { ComponentProps, JSX } from "react";
+
+//#region src/components/input-group.d.ts
+declare const inputGroupVariants: _$_codefast_tailwind_variants0.VariantFunctionType<_$_codefast_tailwind_variants0.ConfigurationSchema, Record<string, never>>;
+declare const inputGroupAddonVariants: _$_codefast_tailwind_variants0.VariantFunctionType<{
+  align: {
+    "block-end": string;
+    "block-start": string;
+    "inline-end": string;
+    "inline-start": string;
+  };
 }, Record<string, never>>;
-declare const inputGroupButtonVariants: import("@codefast/tailwind-variants").VariantFunctionType<{
-    size: {
-        "icon-sm": string;
-        "icon-xs": string;
-        sm: string;
-        xs: string;
-    };
+declare const inputGroupButtonVariants: _$_codefast_tailwind_variants0.VariantFunctionType<{
+  size: {
+    "icon-sm": string;
+    "icon-xs": string;
+    sm: string;
+    xs: string;
+  };
 }, Record<string, never>>;
 type InputGroupProps = ComponentProps<"div">;
-declare function InputGroup({ className, ...props }: InputGroupProps): JSX.Element;
+declare function InputGroup({
+  className,
+  ...props
+}: InputGroupProps): JSX.Element;
 type InputGroupAddonProps = ComponentProps<"div"> & VariantProps<typeof inputGroupAddonVariants>;
-declare function InputGroupAddon({ align, className, ...props }: InputGroupAddonProps): JSX.Element;
+declare function InputGroupAddon({
+  align,
+  className,
+  ...props
+}: InputGroupAddonProps): JSX.Element;
 type InputGroupButtonProps = Omit<ButtonProps, "size"> & VariantProps<typeof inputGroupButtonVariants>;
-declare function InputGroupButton({ className, size, type, variant, ...props }: InputGroupButtonProps): JSX.Element;
+declare function InputGroupButton({
+  className,
+  size,
+  type,
+  variant,
+  ...props
+}: InputGroupButtonProps): JSX.Element;
 type InputGroupTextProps = ComponentProps<"span">;
-declare function InputGroupText({ className, ...props }: InputGroupTextProps): JSX.Element;
+declare function InputGroupText({
+  className,
+  ...props
+}: InputGroupTextProps): JSX.Element;
 type InputGroupInputProps = InputProps;
-declare function InputGroupInput({ className, ...props }: InputGroupInputProps): JSX.Element;
+declare function InputGroupInput({
+  className,
+  ...props
+}: InputGroupInputProps): JSX.Element;
 type InputGroupTextareaProps = TextareaProps;
-declare function InputGroupTextarea({ className, ...props }: InputGroupTextareaProps): JSX.Element;
-export { InputGroup, InputGroupAddon, inputGroupAddonVariants, InputGroupButton, inputGroupButtonVariants, InputGroupInput, InputGroupText, InputGroupTextarea, inputGroupVariants, };
-export type { InputGroupAddonProps, InputGroupButtonProps, InputGroupInputProps, InputGroupProps, InputGroupTextareaProps, InputGroupTextProps, };
+declare function InputGroupTextarea({
+  className,
+  ...props
+}: InputGroupTextareaProps): JSX.Element;
+//#endregion
+export { InputGroup, InputGroupAddon, type InputGroupAddonProps, InputGroupButton, type InputGroupButtonProps, InputGroupInput, type InputGroupInputProps, type InputGroupProps, InputGroupText, type InputGroupTextProps, InputGroupTextarea, type InputGroupTextareaProps, inputGroupAddonVariants, inputGroupButtonVariants, inputGroupVariants };

package/dist/components/input-group.js

@@ -1,98 +1,84 @@
 "use client";
-import { jsx } from "react/jsx-runtime";
-import { cn, tv } from "@codefast/tailwind-variants";
 import { Button } from "./button.js";
 import { Input } from "./input.js";
 import { Textarea } from "./textarea.js";
-const inputGroupVariants = tv({
-    base: cn("group/input-group relative flex w-full items-center rounded-lg border border-input shadow-xs transition-[color,box-shadow] outline-none dark:bg-input/30", "h-9 min-w-0 has-[>textarea]:h-auto", "has-[>[data-align=inline-start]]:[&>[data-slot=input-group-control]]:pl-2", "has-[>[data-align=inline-end]]:[&>[data-slot=input-group-control]]:pr-2", "has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>[data-align=block-start]]:[&>[data-slot=input-group-control]]:pb-3", "has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-end]]:[&>[data-slot=input-group-control]]:pt-3", "has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50", "has-[[data-slot][aria-invalid=true]]:border-destructive has-[[data-slot][aria-invalid=true]]:ring-destructive/20 dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40")
-});
+import { cn, tv } from "@codefast/tailwind-variants";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/input-group.tsx
+const inputGroupVariants = tv({ base: cn("group/input-group relative flex w-full items-center rounded-lg border border-input shadow-xs transition-[color,box-shadow] outline-none dark:bg-input/30", "h-9 min-w-0 has-[>textarea]:h-auto", "has-[>[data-align=inline-start]]:[&>[data-slot=input-group-control]]:pl-2", "has-[>[data-align=inline-end]]:[&>[data-slot=input-group-control]]:pr-2", "has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>[data-align=block-start]]:[&>[data-slot=input-group-control]]:pb-3", "has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-end]]:[&>[data-slot=input-group-control]]:pt-3", "has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50", "has-[[data-slot][aria-invalid=true]]:border-destructive has-[[data-slot][aria-invalid=true]]:ring-destructive/20 dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40") });
 const inputGroupAddonVariants = tv({
-    base: cn("flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium text-muted-foreground select-none group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4"),
-    defaultVariants: {
-        align: "inline-start"
-    },
-    variants: {
-        align: {
-            "block-end": "order-last w-full justify-start px-3 pb-3 group-has-[>input]/input-group:pb-2.5 [.border-t]:pt-3",
-            "block-start": "order-first w-full justify-start px-3 pt-3 group-has-[>input]/input-group:pt-2.5 [.border-b]:pb-3",
-            "inline-end": "order-last pr-3 has-[>button]:mr-[-0.45rem] has-[>kbd]:mr-[-0.35rem]",
-            "inline-start": "order-first pl-3 has-[>button]:ml-[-0.45rem] has-[>kbd]:ml-[-0.35rem]"
-        }
-    }
+	base: cn("flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium text-muted-foreground select-none group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4"),
+	defaultVariants: { align: "inline-start" },
+	variants: { align: {
+		"block-end": "order-last w-full justify-start px-3 pb-3 group-has-[>input]/input-group:pb-2.5 [.border-t]:pt-3",
+		"block-start": "order-first w-full justify-start px-3 pt-3 group-has-[>input]/input-group:pt-2.5 [.border-b]:pb-3",
+		"inline-end": "order-last pr-3 has-[>button]:mr-[-0.45rem] has-[>kbd]:mr-[-0.35rem]",
+		"inline-start": "order-first pl-3 has-[>button]:ml-[-0.45rem] has-[>kbd]:ml-[-0.35rem]"
+	} }
 });
 const inputGroupButtonVariants = tv({
-    base: "flex items-center gap-2 text-sm shadow-none [&>svg:not([class*='size-'])]:size-4",
-    defaultVariants: {
-        size: "xs"
-    },
-    variants: {
-        size: {
-            "icon-sm": "size-8 p-0 has-[>svg]:p-0",
-            "icon-xs": "size-6 rounded-[calc(var(--radius)-5px)] p-0 has-[>svg]:p-0",
-            sm: "h-8 gap-1.5 rounded-md px-2.5 has-[>svg]:px-2.5",
-            xs: "h-6 gap-1 rounded-[calc(var(--radius)-5px)] px-2 has-[>svg]:px-2 [&>svg]:size-3.5"
-        }
-    }
+	base: "flex items-center gap-2 text-sm shadow-none [&>svg:not([class*='size-'])]:size-4",
+	defaultVariants: { size: "xs" },
+	variants: { size: {
+		"icon-sm": "size-8 p-0 has-[>svg]:p-0",
+		"icon-xs": "size-6 rounded-[calc(var(--radius)-5px)] p-0 has-[>svg]:p-0",
+		sm: "h-8 gap-1.5 rounded-md px-2.5 has-[>svg]:px-2.5",
+		xs: "h-6 gap-1 rounded-[calc(var(--radius)-5px)] px-2 has-[>svg]:px-2 [&>svg]:size-3.5"
+	} }
 });
 function InputGroup({ className, ...props }) {
-    return /*#__PURE__*/ jsx("div", {
-        className: inputGroupVariants({
-            className
-        }),
-        "data-slot": "input-group",
-        role: "group",
-        ...props
-    });
+	return /* @__PURE__ */ jsx("div", {
+		className: inputGroupVariants({ className }),
+		"data-slot": "input-group",
+		role: "group",
+		...props
+	});
 }
 function InputGroupAddon({ align = "inline-start", className, ...props }) {
-    return /*#__PURE__*/ jsx("div", {
-        className: cn(inputGroupAddonVariants({
-            align
-        }), className),
-        "data-align": align,
-        "data-slot": "input-group-addon",
-        role: "group",
-        onPointerDown: (event)=>{
-            if (event.target.closest("button")) return;
-            event.preventDefault();
-            const control = event.currentTarget.parentElement?.querySelector("input, textarea");
-            if (control instanceof HTMLElement) control.focus();
-        },
-        ...props
-    });
+	return /* @__PURE__ */ jsx("div", {
+		className: cn(inputGroupAddonVariants({ align }), className),
+		"data-align": align,
+		"data-slot": "input-group-addon",
+		role: "group",
+		onPointerDown: (event) => {
+			if (event.target.closest("button")) return;
+			event.preventDefault();
+			const control = event.currentTarget.parentElement?.querySelector("input, textarea");
+			if (control instanceof HTMLElement) control.focus();
+		},
+		...props
+	});
 }
 function InputGroupButton({ className, size = "xs", type = "button", variant = "ghost", ...props }) {
-    return /*#__PURE__*/ jsx(Button, {
-        className: cn(inputGroupButtonVariants({
-            size
-        }), className),
-        "data-size": size,
-        "data-slot": "input-group-button",
-        type: type,
-        variant: variant,
-        ...props
-    });
+	return /* @__PURE__ */ jsx(Button, {
+		className: cn(inputGroupButtonVariants({ size }), className),
+		"data-size": size,
+		"data-slot": "input-group-button",
+		type,
+		variant,
+		...props
+	});
 }
 function InputGroupText({ className, ...props }) {
-    return /*#__PURE__*/ jsx("span", {
-        className: cn("flex items-center gap-2 text-sm text-muted-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", className),
-        "data-slot": "input-group-text",
-        ...props
-    });
+	return /* @__PURE__ */ jsx("span", {
+		className: cn("flex items-center gap-2 text-sm text-muted-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", className),
+		"data-slot": "input-group-text",
+		...props
+	});
 }
 function InputGroupInput({ className, ...props }) {
-    return /*#__PURE__*/ jsx(Input, {
-        className: cn("flex-1 rounded-none border-0 bg-transparent px-3 py-1 shadow-none focus-visible:ring-0 dark:bg-transparent", className),
-        "data-slot": "input-group-control",
-        ...props
-    });
+	return /* @__PURE__ */ jsx(Input, {
+		className: cn("flex-1 rounded-none border-0 bg-transparent px-3 py-1 shadow-none focus-visible:ring-0 dark:bg-transparent", className),
+		"data-slot": "input-group-control",
+		...props
+	});
 }
 function InputGroupTextarea({ className, ...props }) {
-    return /*#__PURE__*/ jsx(Textarea, {
-        className: cn("flex-1 resize-none rounded-none border-0 bg-transparent py-3 shadow-none focus-visible:ring-0 dark:bg-transparent", className),
-        "data-slot": "input-group-control",
-        ...props
-    });
+	return /* @__PURE__ */ jsx(Textarea, {
+		className: cn("flex-1 resize-none rounded-none border-0 bg-transparent py-3 shadow-none focus-visible:ring-0 dark:bg-transparent", className),
+		"data-slot": "input-group-control",
+		...props
+	});
 }
+//#endregion
 export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, inputGroupAddonVariants, inputGroupButtonVariants, inputGroupVariants };

package/dist/components/input-number.d.ts

@@ -1,7 +1,28 @@
-import type { ComponentProps, JSX } from "react";
-import * as InputNumberPrimitive from "../primitives/input-number";
-interface InputNumberProps extends ComponentProps<typeof InputNumberPrimitive.Field>, ComponentProps<typeof InputNumberPrimitive.Root> {
-}
-declare function InputNumber({ ariaDecrementLabel, ariaIncrementLabel, className, defaultValue, disabled, formatOptions, id, loaderPosition, loading, max, min, onChange, prefix, readOnly, spinner, step, suffix, value, ...props }: InputNumberProps): JSX.Element;
-export { InputNumber };
-export type { InputNumberProps };
+import { Field as InputNumberField, InputNumber as InputNumber$1 } from "../primitives/input-number.js";
+import { ComponentProps, JSX } from "react";
+
+//#region src/components/input-number.d.ts
+interface InputNumberProps extends ComponentProps<typeof InputNumberField>, ComponentProps<typeof InputNumber$1> {}
+declare function InputNumber({
+  ariaDecrementLabel,
+  ariaIncrementLabel,
+  className,
+  defaultValue,
+  disabled,
+  formatOptions,
+  id,
+  loaderPosition,
+  loading,
+  max,
+  min,
+  onChange,
+  prefix,
+  readOnly,
+  spinner,
+  step,
+  suffix,
+  value,
+  ...props
+}: InputNumberProps): JSX.Element;
+//#endregion
+export { InputNumber, type InputNumberProps };