@codefast/ui 0.2.46-canary.1 → 0.2.46-canary.2

package/dist/cjs/components/form.cjs

@@ -0,0 +1,152 @@
+"use client";
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ('undefined' != typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    FormMessage: ()=>FormMessage,
+    FormDescription: ()=>FormDescription,
+    FormControl: ()=>FormControl,
+    FormLabel: ()=>FormLabel,
+    FormItem: ()=>FormItem,
+    Form: ()=>Form,
+    FormField: ()=>FormField,
+    createFormFieldScope: ()=>createFormFieldScope
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const react_context_namespaceObject = require("@radix-ui/react-context");
+const react_slot_namespaceObject = require("@radix-ui/react-slot");
+const external_react_namespaceObject = require("react");
+const external_react_hook_form_namespaceObject = require("react-hook-form");
+const external_label_cjs_namespaceObject = require("./label.cjs");
+const utils_cjs_namespaceObject = require("../lib/utils.cjs");
+const Form = external_react_hook_form_namespaceObject.FormProvider;
+const FORM_FIELD_NAME = "FormField";
+const [createFormFieldContext, createFormFieldScope] = (0, react_context_namespaceObject.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 } = (0, external_react_hook_form_namespaceObject.useFormContext)();
+    const formState = (0, external_react_hook_form_namespaceObject.useFormState)({
+        name
+    });
+    const fieldState = getFieldState(name, formState);
+    return {
+        id,
+        name,
+        formDescriptionId: `form-item-description-${id}`,
+        formItemId: `form-item-${id}`,
+        formMessageId: `form-item-message-${id}`,
+        ...fieldState
+    };
+}
+function FormField(formFieldProps) {
+    const { __scopeFormField, ...props } = formFieldProps;
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormFieldContextProvider, {
+        name: props.name,
+        scope: __scopeFormField,
+        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_react_hook_form_namespaceObject.Controller, {
+            ...props
+        })
+    });
+}
+const FORM_ITEM_NAME = "FormItem";
+const [FormItemContextProvider, useFormItemContext] = createFormFieldContext(FORM_ITEM_NAME);
+function FormItem({ __scopeFormField, className, ...props }) {
+    const id = (0, external_react_namespaceObject.useId)();
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormItemContextProvider, {
+        id: id,
+        scope: __scopeFormField,
+        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+            className: (0, utils_cjs_namespaceObject.cn)("grid gap-2", className),
+            "data-slot": "form-item",
+            ...props
+        })
+    });
+}
+const FORM_LABEL_NAME = "FormLabel";
+function FormLabel({ __scopeFormField, ...props }) {
+    const { formItemId, error } = useFormItem(FORM_LABEL_NAME, __scopeFormField);
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_label_cjs_namespaceObject.Label, {
+        "data-invalid": error ? true : void 0,
+        "data-slot": "form-label",
+        htmlFor: formItemId,
+        ...props
+    });
+}
+const FORM_CONTROL_NAME = "FormControl";
+function FormControl({ __scopeFormField, ...props }) {
+    const { formDescriptionId, formItemId, formMessageId, error } = useFormItem(FORM_CONTROL_NAME, __scopeFormField);
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_slot_namespaceObject.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__*/ (0, jsx_runtime_namespaceObject.jsx)("p", {
+        className: (0, utils_cjs_namespaceObject.cn)("text-muted-foreground text-xs", className),
+        "data-slot": "form-description",
+        id: formDescriptionId,
+        ...props
+    });
+}
+const FORM_MESSAGE_NAME = "FormMessage";
+function FormMessage({ __scopeFormField, children, className, ...props }) {
+    const { formMessageId, error } = useFormItem(FORM_MESSAGE_NAME, __scopeFormField);
+    const body = error?.message ? String(error.message) : children;
+    if (!body) return null;
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("p", {
+        className: (0, utils_cjs_namespaceObject.cn)("text-xs", error?.message ? "text-destructive font-medium" : "text-muted-foreground", className),
+        "data-slot": "form-message",
+        id: formMessageId,
+        ...props,
+        children: body
+    });
+}
+exports.Form = __webpack_exports__.Form;
+exports.FormControl = __webpack_exports__.FormControl;
+exports.FormDescription = __webpack_exports__.FormDescription;
+exports.FormField = __webpack_exports__.FormField;
+exports.FormItem = __webpack_exports__.FormItem;
+exports.FormLabel = __webpack_exports__.FormLabel;
+exports.FormMessage = __webpack_exports__.FormMessage;
+exports.createFormFieldScope = __webpack_exports__.createFormFieldScope;
+for(var __webpack_i__ in __webpack_exports__)if (-1 === [
+    "Form",
+    "FormControl",
+    "FormDescription",
+    "FormField",
+    "FormItem",
+    "FormLabel",
+    "FormMessage",
+    "createFormFieldScope"
+].indexOf(__webpack_i__)) exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/cjs/components/heading.cjs

@@ -0,0 +1,44 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ('undefined' != typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    Heading: ()=>Heading
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const react_slot_namespaceObject = require("@radix-ui/react-slot");
+function Heading({ as: Tag = "h1", asChild, ...props }) {
+    const Component = asChild ? react_slot_namespaceObject.Slot : Tag;
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(Component, {
+        "data-slot": "heading",
+        ...props
+    });
+}
+exports.Heading = __webpack_exports__.Heading;
+for(var __webpack_i__ in __webpack_exports__)if (-1 === [
+    "Heading"
+].indexOf(__webpack_i__)) exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/cjs/components/hover-card.cjs

@@ -0,0 +1,77 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ('undefined' != typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    HoverCardArrow: ()=>HoverCardArrow,
+    HoverCardTrigger: ()=>HoverCardTrigger,
+    HoverCardContent: ()=>HoverCardContent,
+    HoverCard: ()=>HoverCard
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const react_hover_card_namespaceObject = require("@radix-ui/react-hover-card");
+const utils_cjs_namespaceObject = require("../lib/utils.cjs");
+function HoverCard({ ...props }) {
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_hover_card_namespaceObject.Root, {
+        "data-slot": "hover-card",
+        ...props
+    });
+}
+function HoverCardTrigger({ ...props }) {
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_hover_card_namespaceObject.Trigger, {
+        "data-slot": "hover-card-trigger",
+        ...props
+    });
+}
+function HoverCardContent({ align = "center", className, sideOffset = 4, ...props }) {
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_hover_card_namespaceObject.Portal, {
+        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_hover_card_namespaceObject.Content, {
+            align: align,
+            className: (0, utils_cjs_namespaceObject.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=left]:slide-in-from-right-2 data-[state=open]:data-[side=bottom]:slide-in-from-top-2 data-[state=open]:data-[side=right]:slide-in-from-left-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=left]:slide-out-to-right-2 data-[state=closed]:data-[side=bottom]:slide-out-to-top-2 data-[state=closed]:data-[side=right]:slide-out-to-left-2 z-50 min-w-32 rounded-lg border p-4 shadow-lg", className),
+            "data-slot": "hover-card-content",
+            sideOffset: sideOffset,
+            ...props
+        })
+    });
+}
+function HoverCardArrow({ className, ...props }) {
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_hover_card_namespaceObject.Arrow, {
+        className: (0, utils_cjs_namespaceObject.cn)("fill-popover", className),
+        "data-slot": "hover-card-arrow",
+        ...props
+    });
+}
+exports.HoverCard = __webpack_exports__.HoverCard;
+exports.HoverCardArrow = __webpack_exports__.HoverCardArrow;
+exports.HoverCardContent = __webpack_exports__.HoverCardContent;
+exports.HoverCardTrigger = __webpack_exports__.HoverCardTrigger;
+for(var __webpack_i__ in __webpack_exports__)if (-1 === [
+    "HoverCard",
+    "HoverCardArrow",
+    "HoverCardContent",
+    "HoverCardTrigger"
+].indexOf(__webpack_i__)) exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/cjs/components/inline.cjs

@@ -0,0 +1,44 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ('undefined' != typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    Inline: ()=>Inline
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const react_slot_namespaceObject = require("@radix-ui/react-slot");
+function Inline({ asChild, ...props }) {
+    const Component = asChild ? react_slot_namespaceObject.Slot : "span";
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(Component, {
+        "data-slot": "inline",
+        ...props
+    });
+}
+exports.Inline = __webpack_exports__.Inline;
+for(var __webpack_i__ in __webpack_exports__)if (-1 === [
+    "Inline"
+].indexOf(__webpack_i__)) exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/cjs/components/input-date.cjs

@@ -0,0 +1,18 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ('undefined' != typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+for(var __webpack_i__ in __webpack_exports__)exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/cjs/components/input-number.cjs

@@ -0,0 +1,109 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ('undefined' != typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    NumberInput: ()=>NumberInput,
+    InputNumber: ()=>InputNumber
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const input_number_namespaceObject = require("@codefast-ui/input-number");
+const external_lucide_react_namespaceObject = require("lucide-react");
+const external_button_cjs_namespaceObject = require("./button.cjs");
+const external_input_cjs_namespaceObject = require("./input.cjs");
+const external_spinner_cjs_namespaceObject = require("./spinner.cjs");
+const utils_cjs_namespaceObject = require("../lib/utils.cjs");
+const { input, root } = (0, external_input_cjs_namespaceObject.inputVariants)();
+function InputNumber({ id, ariaDecrementLabel, ariaIncrementLabel, className, defaultValue, disabled, formatOptions, loaderPosition, loading, max, min, onChange, prefix, readOnly, spinner, step, suffix, value, ...props }) {
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(input_number_namespaceObject.Root, {
+        ariaDecrementLabel: ariaDecrementLabel,
+        ariaIncrementLabel: ariaIncrementLabel,
+        className: root({
+            className: [
+                "group pr-0",
+                className
+            ]
+        }),
+        "data-slot": "input-number",
+        defaultValue: defaultValue,
+        disabled: disabled,
+        formatOptions: formatOptions,
+        id: id,
+        loaderPosition: loaderPosition,
+        loading: loading,
+        max: max,
+        min: min,
+        prefix: prefix,
+        readOnly: readOnly,
+        spinner: spinner || /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_spinner_cjs_namespaceObject.Spinner, {}),
+        step: step,
+        suffix: suffix,
+        value: value,
+        onChange: onChange,
+        children: [
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(input_number_namespaceObject.Field, {
+                autoCapitalize: "none",
+                autoComplete: "off",
+                autoCorrect: "off",
+                className: input(),
+                spellCheck: "false",
+                ...props
+            }),
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+                className: (0, utils_cjs_namespaceObject.cn)("divide-input border-l-input group-hover:not-group-focus-within:not-has-disabled:border-l-border-ring/60 group-hover:not-group-focus-within:not-has-disabled:divide-border-ring/60 group-focus-within:border-l-ring group-focus-within:divide-ring group-has-aria-invalid:border-l-destructive group-has-aria-invalid:divide-destructive group-hover:group-has-aria-invalid:not-group-focus-within:not-has-disabled:border-l-destructive/60 group-hover:group-has-aria-invalid:not-group-focus-within:not-has-disabled:divide-destructive/60 order-last ml-auto grid h-full shrink-0 divide-y border-l transition", "*:[button]:focus-visible:ring-0 *:[button]:focus-visible:bg-ring/50 group-has-aria-invalid:*:[button]:focus-visible:bg-destructive/20 dark:group-has-aria-invalid:*:[button]:focus-visible:bg-destructive/40"),
+                "data-slot": "input-number-buttons",
+                children: [
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(input_number_namespaceObject.IncrementButton, {
+                        "aria-label": "Increment",
+                        className: (0, external_button_cjs_namespaceObject.buttonVariants)({
+                            className: "text-muted-foreground h-auto rounded-none rounded-tr-[calc(var(--radius-lg)-1px)]",
+                            variant: "ghost"
+                        }),
+                        "data-slot": "input-number-increment-button",
+                        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.ChevronUpIcon, {})
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(input_number_namespaceObject.DecrementButton, {
+                        "aria-label": "Decrement",
+                        className: (0, external_button_cjs_namespaceObject.buttonVariants)({
+                            className: "text-muted-foreground h-auto rounded-none rounded-br-[calc(var(--radius-lg)-1px)]",
+                            variant: "ghost"
+                        }),
+                        "data-slot": "input-number-decrement-button",
+                        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.ChevronDownIcon, {})
+                    })
+                ]
+            })
+        ]
+    });
+}
+const NumberInput = InputNumber;
+exports.InputNumber = __webpack_exports__.InputNumber;
+exports.NumberInput = __webpack_exports__.NumberInput;
+for(var __webpack_i__ in __webpack_exports__)if (-1 === [
+    "InputNumber",
+    "NumberInput"
+].indexOf(__webpack_i__)) exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/cjs/components/input-otp.cjs

@@ -0,0 +1,103 @@
+"use client";
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ('undefined' != typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    REGEXP_ONLY_DIGITS: ()=>external_input_otp_namespaceObject.REGEXP_ONLY_DIGITS,
+    InputOTPGroup: ()=>InputOTPGroup,
+    InputOTP: ()=>InputOTP,
+    InputOTPSlot: ()=>InputOTPSlot,
+    REGEXP_ONLY_CHARS: ()=>external_input_otp_namespaceObject.REGEXP_ONLY_CHARS,
+    REGEXP_ONLY_DIGITS_AND_CHARS: ()=>external_input_otp_namespaceObject.REGEXP_ONLY_DIGITS_AND_CHARS,
+    InputOTPSeparator: ()=>InputOTPSeparator
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const external_input_otp_namespaceObject = require("input-otp");
+const external_lucide_react_namespaceObject = require("lucide-react");
+const external_react_namespaceObject = require("react");
+const utils_cjs_namespaceObject = require("../lib/utils.cjs");
+function InputOTP({ className, containerClassName, ...props }) {
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_input_otp_namespaceObject.OTPInput, {
+        "aria-label": "One-time password",
+        className: (0, utils_cjs_namespaceObject.cn)(className),
+        containerClassName: (0, utils_cjs_namespaceObject.cn)("flex items-center gap-2 has-disabled:opacity-50", containerClassName),
+        "data-slot": "input-otp",
+        ...props
+    });
+}
+function InputOTPGroup({ className, ...props }) {
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+        className: (0, utils_cjs_namespaceObject.cn)("flex items-center -space-x-px", className),
+        "data-slot": "input-otp-group",
+        role: "group",
+        ...props
+    });
+}
+function InputOTPSlot({ className, index, ...props }) {
+    const inputOTPContext = (0, external_react_namespaceObject.use)(external_input_otp_namespaceObject.OTPInputContext);
+    const { isActive, char, hasFakeCaret } = inputOTPContext.slots[index];
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+        className: (0, utils_cjs_namespaceObject.cn)("border-input data-[active=true]:ring-3 data-[active=true]:border-ring data-[active=true]:ring-ring/50 not-has-disabled:shadow-xs outline-hidden data-[active=true]:aria-invalid:ring-destructive/20 dark:data-[active=true]:aria-invalid:ring-destructive/40 aria-invalid:border-destructive data-[active=true]:aria-invalid:border-destructive dark:bg-input/30 relative flex size-9 items-center justify-center border text-sm transition-all first:rounded-l-lg last:rounded-r-lg data-[active=true]:z-10", className),
+        "data-active": isActive,
+        "data-slot": "input-otp-slot",
+        ...props,
+        children: [
+            char,
+            hasFakeCaret ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+                className: "pointer-events-none absolute inset-0 flex items-center justify-center",
+                children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+                    className: "animate-caret-blink bg-foreground animation-duration-1000 h-4 w-px"
+                })
+            }) : null
+        ]
+    });
+}
+function InputOTPSeparator({ ...props }) {
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+        "data-slot": "input-otp-separator",
+        role: "separator",
+        ...props,
+        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.MinusIcon, {})
+    });
+}
+exports.InputOTP = __webpack_exports__.InputOTP;
+exports.InputOTPGroup = __webpack_exports__.InputOTPGroup;
+exports.InputOTPSeparator = __webpack_exports__.InputOTPSeparator;
+exports.InputOTPSlot = __webpack_exports__.InputOTPSlot;
+exports.REGEXP_ONLY_CHARS = __webpack_exports__.REGEXP_ONLY_CHARS;
+exports.REGEXP_ONLY_DIGITS = __webpack_exports__.REGEXP_ONLY_DIGITS;
+exports.REGEXP_ONLY_DIGITS_AND_CHARS = __webpack_exports__.REGEXP_ONLY_DIGITS_AND_CHARS;
+for(var __webpack_i__ in __webpack_exports__)if (-1 === [
+    "InputOTP",
+    "InputOTPGroup",
+    "InputOTPSeparator",
+    "InputOTPSlot",
+    "REGEXP_ONLY_CHARS",
+    "REGEXP_ONLY_DIGITS",
+    "REGEXP_ONLY_DIGITS_AND_CHARS"
+].indexOf(__webpack_i__)) exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/cjs/components/input-password.cjs

@@ -0,0 +1,89 @@
+"use client";
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ('undefined' != typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    InputPassword: ()=>InputPassword,
+    PasswordInput: ()=>PasswordInput
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const input_namespaceObject = require("@codefast-ui/input");
+const external_lucide_react_namespaceObject = require("lucide-react");
+const external_react_namespaceObject = require("react");
+const external_button_cjs_namespaceObject = require("./button.cjs");
+const external_input_cjs_namespaceObject = require("./input.cjs");
+const external_spinner_cjs_namespaceObject = require("./spinner.cjs");
+const { input, root } = (0, external_input_cjs_namespaceObject.inputVariants)();
+function InputPassword({ className, disabled, loaderPosition, loading, prefix, readOnly, spinner, suffix, ...props }) {
+    const [type, setType] = (0, external_react_namespaceObject.useState)("password");
+    const togglePasswordVisibility = (0, external_react_namespaceObject.useCallback)(()=>{
+        setType((prev)=>"password" === prev ? "text" : "password");
+    }, []);
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(input_namespaceObject.Root, {
+        className: root({
+            className: [
+                !suffix && "pr-1.5",
+                className
+            ]
+        }),
+        "data-slot": "input-password",
+        disabled: disabled,
+        loaderPosition: loaderPosition,
+        loading: loading,
+        prefix: prefix,
+        readOnly: readOnly,
+        spinner: spinner || /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_spinner_cjs_namespaceObject.Spinner, {}),
+        suffix: suffix,
+        children: [
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(input_namespaceObject.Field, {
+                autoCapitalize: "none",
+                className: input(),
+                "data-slot": "input-password-item",
+                type: type,
+                ...props
+            }),
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_button_cjs_namespaceObject.Button, {
+                "aria-label": "password" === type ? "Show password" : "Hide password",
+                className: "focus-visible:not-disabled:bg-input size-7 rounded-full focus-visible:ring-0",
+                "data-slot": "input-password-toggle",
+                disabled: disabled,
+                prefix: "password" === type ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.EyeOffIcon, {}) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.EyeIcon, {}),
+                size: "icon",
+                variant: "ghost",
+                onClick: togglePasswordVisibility
+            })
+        ]
+    });
+}
+const PasswordInput = InputPassword;
+exports.InputPassword = __webpack_exports__.InputPassword;
+exports.PasswordInput = __webpack_exports__.PasswordInput;
+for(var __webpack_i__ in __webpack_exports__)if (-1 === [
+    "InputPassword",
+    "PasswordInput"
+].indexOf(__webpack_i__)) exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});