@mdigital_ui/ui 0.2.5 → 0.2.7

package/dist/chunk-SDNT2JGC.js

@@ -0,0 +1,143 @@
+import { createAllColorVariants, componentColors } from './chunk-NTPWR57C.js';
+import { cn } from './chunk-NGYLRX6F.js';
+import { cva } from 'class-variance-authority';
+import { X } from 'lucide-react';
+import React from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var tagVariants = cva("inline-flex items-center gap-1.5 whitespace-nowrap rounded font-medium transition-colors", {
+  variants: {
+    variant: {
+      default: "border",
+      solid: "",
+      outline: "border",
+      soft: ""
+    },
+    color: {
+      default: "",
+      primary: "",
+      secondary: "",
+      accent: "",
+      success: "",
+      error: "",
+      warning: "",
+      info: ""
+    },
+    size: {
+      xs: "text-[10px] px-1.5 py-0.5",
+      sm: "text-xs px-2 py-1",
+      md: "text-sm px-2.5 py-1",
+      lg: "text-base px-3 py-1.5"
+    }
+  },
+  compoundVariants: createAllColorVariants(componentColors, ["default", "solid", "outline", "soft"]),
+  defaultVariants: {
+    variant: "solid",
+    color: "primary",
+    size: "sm"
+  }
+});
+var iconSizeClasses = {
+  xs: "size-2.5",
+  sm: "size-3",
+  md: "size-3.5",
+  lg: "size-4"
+};
+var Tag = React.memo(
+  ({
+    children,
+    color = "primary",
+    variant = "solid",
+    size = "sm",
+    closable = false,
+    onClose,
+    icon,
+    className,
+    classNames,
+    onClick,
+    disableKeyboardRemoval = false,
+    ...props
+  }) => {
+    const handleClose = (e) => {
+      e.stopPropagation();
+      onClose?.(e);
+    };
+    const handleCloseKeyDown = (e) => {
+      if (e.key === "Enter" || e.key === " ") {
+        e.preventDefault();
+        e.stopPropagation();
+        onClose?.(e);
+      }
+    };
+    const handleTagKeyDown = (e) => {
+      if (!disableKeyboardRemoval && closable && (e.key === "Delete" || e.key === "Backspace")) {
+        e.preventDefault();
+        e.stopPropagation();
+        onClose?.(e);
+        return;
+      }
+      if (onClick && (e.key === "Enter" || e.key === " ")) {
+        e.preventDefault();
+        e.stopPropagation();
+        onClick(e);
+      }
+    };
+    return /* @__PURE__ */ jsxs(
+      "span",
+      {
+        className: cn(
+          "tag_root",
+          tagVariants({ variant, color, size }),
+          (onClick || closable) && "cursor-pointer",
+          (onClick || !disableKeyboardRemoval && closable) && "focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary",
+          classNames?.root,
+          className
+        ),
+        onClick,
+        onKeyDown: onClick || !disableKeyboardRemoval && closable ? handleTagKeyDown : void 0,
+        role: onClick || !disableKeyboardRemoval && closable ? "button" : void 0,
+        tabIndex: onClick || !disableKeyboardRemoval && closable ? 0 : void 0,
+        "aria-label": (onClick || !disableKeyboardRemoval && closable) && typeof children === "string" ? children : void 0,
+        "data-slot": "root",
+        ...props,
+        children: [
+          icon && /* @__PURE__ */ jsx("span", { className: cn("inline-flex items-center justify-center flex-shrink-0", iconSizeClasses[size]), children: React.isValidElement(icon) ? React.cloneElement(icon, {
+            className: cn("w-full h-full", icon.props.className)
+          }) : icon }),
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: cn("tag_content", classNames?.content),
+              "data-slot": "content",
+              children
+            }
+          ),
+          closable && /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: handleClose,
+              onKeyDown: handleCloseKeyDown,
+              className: cn(
+                "tag_closeButton",
+                "inline-flex items-center justify-center flex-shrink-0 cursor-pointer rounded-sm opacity-70 hover:opacity-100 transition-opacity focus:outline-none focus:ring-2 focus:ring-current focus:ring-offset-1",
+                iconSizeClasses[size],
+                classNames?.closeButton
+              ),
+              "aria-label": typeof children === "string" ? `Remove ${children}` : "Remove tag",
+              tabIndex: disableKeyboardRemoval ? 0 : -1,
+              "data-slot": "closeButton",
+              children: /* @__PURE__ */ jsx(X, { className: "w-full h-full" })
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+Tag.displayName = "Tag";
+var tag_default = Tag;
+
+export { tag_default };
+//# sourceMappingURL=chunk-SDNT2JGC.js.map
+//# sourceMappingURL=chunk-SDNT2JGC.js.map

package/dist/chunk-SDNT2JGC.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/tag/index.tsx"],"names":[],"mappings":"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","file":"chunk-SDNT2JGC.js","sourcesContent":["'use client'\n\nimport { cva } from 'class-variance-authority';\nimport { X } from 'lucide-react';\nimport React from 'react';\n\nimport { cn } from '../utils';\nimport { componentColors, createAllColorVariants } from '../variants';\nimport type { TagProps } from './types';\n\n/**\n * Class variance authority configuration for the Tag component\n * Defines style variants for color, variant, and size\n */\nconst tagVariants = cva('inline-flex items-center gap-1.5 whitespace-nowrap rounded font-medium transition-colors', {\n  variants: {\n    variant: {\n      default: 'border',\n      solid: '',\n      outline: 'border',\n      soft: '',\n    },\n    color: {\n      default: '',\n      primary: '',\n      secondary: '',\n      accent: '',\n      success: '',\n      error: '',\n      warning: '',\n      info: '',\n    },\n    size: {\n      xs: 'text-[10px] px-1.5 py-0.5',\n      sm: 'text-xs px-2 py-1',\n      md: 'text-sm px-2.5 py-1',\n      lg: 'text-base px-3 py-1.5',\n    },\n  },\n  compoundVariants: createAllColorVariants(componentColors, ['default', 'solid', 'outline', 'soft']),\n  defaultVariants: {\n    variant: 'solid',\n    color: 'primary',\n    size: 'sm',\n  },\n});\n\n/**\n * Icon and close button size variants for different tag sizes\n */\nconst iconSizeClasses = {\n  xs: 'size-2.5',\n  sm: 'size-3',\n  md: 'size-3.5',\n  lg: 'size-4',\n};\n\n/**\n * Tag Component\n *\n * An interactive badge variant that can be used for labels, categories, or removable items.\n * Supports multiple variants, colors, sizes, icons, and close functionality.\n *\n * @component\n * @example\n * // Basic tag\n * <Tag>Label</Tag>\n *\n * @example\n * // Tag with close button\n * <Tag closable onClose={(e) => console.log('Tag removed')}>\n *   Removable Tag\n * </Tag>\n *\n * @example\n * // Tag with icon\n * <Tag icon={<Star />} color=\"warning\">\n *   Featured\n * </Tag>\n *\n * @example\n * // Different variants\n * <Tag variant=\"outline\" color=\"success\">Outline Tag</Tag>\n * <Tag variant=\"soft\" color=\"info\">Soft Tag</Tag>\n *\n * @example\n * // Disable keyboard removal (Backspace/Delete on tag)\n * <Tag closable disableKeyboardRemoval onClose={(e) => console.log('Tag removed')}>\n *   No keyboard removal\n * </Tag>\n *\n * @example\n * // Tag with keyboard removal enabled (focus on tag and press Delete/Backspace)\n * <Tag closable onClose={(e) => console.log('Tag removed')}>\n *   Press Delete or Backspace to remove\n * </Tag>\n *\n * @param {TagProps} props - Component props\n * @returns {JSX.Element} Rendered tag component\n */\nconst Tag = React.memo<TagProps>(\n  ({\n    children,\n    color = 'primary',\n    variant = 'solid',\n    size = 'sm',\n    closable = false,\n    onClose,\n    icon,\n    className,\n    classNames,\n    onClick,\n    disableKeyboardRemoval = false,\n    ...props\n  }) => {\n    /**\n     * Handles the close button click event\n     * Stops event propagation to prevent triggering parent onClick handlers\n     *\n     * @param {React.MouseEvent<HTMLButtonElement>} e - Mouse event\n     */\n    const handleClose = (e: React.MouseEvent<HTMLButtonElement>) => {\n      e.stopPropagation();\n      onClose?.(e);\n    };\n\n    /**\n     * Handles keyboard events for the close button\n     * Always responds to Enter/Space for activation (accessibility requirement)\n     *\n     * @param {React.KeyboardEvent<HTMLButtonElement>} e - Keyboard event\n     */\n    const handleCloseKeyDown = (e: React.KeyboardEvent<HTMLButtonElement>) => {\n      // Always allow Enter/Space for activation (accessibility requirement)\n      if (e.key === 'Enter' || e.key === ' ') {\n        e.preventDefault();\n        e.stopPropagation();\n        onClose?.(e);\n      }\n    };\n\n    /**\n     * Handles keyboard events for the tag\n     * Removes tag when Delete or Backspace is pressed (takes priority)\n     * Activates onClick when Enter or Space is pressed\n     *\n     * @param {React.KeyboardEvent<HTMLSpanElement>} e - Keyboard event\n     */\n    const handleTagKeyDown = (e: React.KeyboardEvent<HTMLSpanElement>) => {\n      // Handle deletion for closable tags (takes priority over onClick)\n      if (!disableKeyboardRemoval && closable && (e.key === 'Delete' || e.key === 'Backspace')) {\n        e.preventDefault();\n        e.stopPropagation();\n        onClose?.(e);\n        return;\n      }\n\n      // Handle activation for clickable tags\n      if (onClick && (e.key === 'Enter' || e.key === ' ')) {\n        e.preventDefault();\n        e.stopPropagation();\n        onClick(e);\n      }\n    };\n\n    return (\n      <span\n        className={cn(\n          'tag_root',\n          tagVariants({ variant, color, size }),\n          (onClick || closable) && 'cursor-pointer',\n          (onClick || (!disableKeyboardRemoval && closable)) &&\n            'focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary',\n          classNames?.root,\n          className\n        )}\n        onClick={onClick}\n        onKeyDown={onClick || (!disableKeyboardRemoval && closable) ? handleTagKeyDown : undefined}\n        role={onClick || (!disableKeyboardRemoval && closable) ? 'button' : undefined}\n        tabIndex={onClick || (!disableKeyboardRemoval && closable) ? 0 : undefined}\n        aria-label={\n          (onClick || (!disableKeyboardRemoval && closable)) && typeof children === 'string' ? children : undefined\n        }\n        data-slot='root'\n        {...props}\n      >\n        {icon && (\n          <span className={cn('inline-flex items-center justify-center flex-shrink-0', iconSizeClasses[size])}>\n            {React.isValidElement(icon)\n              ? React.cloneElement(icon, {\n                  className: cn('w-full h-full', (icon.props as { className?: string }).className),\n                } as React.HTMLAttributes<HTMLElement>)\n              : icon}\n          </span>\n        )}\n        <span\n          className={cn('tag_content', classNames?.content)}\n          data-slot='content'\n        >\n          {children}\n        </span>\n        {closable && (\n          <button\n            type='button'\n            onClick={handleClose}\n            onKeyDown={handleCloseKeyDown}\n            className={cn(\n              'tag_closeButton',\n              'inline-flex items-center justify-center flex-shrink-0 cursor-pointer rounded-sm opacity-70 hover:opacity-100 transition-opacity focus:outline-none focus:ring-2 focus:ring-current focus:ring-offset-1',\n              iconSizeClasses[size],\n              classNames?.closeButton\n            )}\n            aria-label={typeof children === 'string' ? `Remove ${children}` : 'Remove tag'}\n            tabIndex={disableKeyboardRemoval ? 0 : -1}\n            data-slot='closeButton'\n          >\n            <X className='w-full h-full' />\n          </button>\n        )}\n      </span>\n    );\n  }\n);\n\nTag.displayName = 'Tag';\n\nexport type * from './types';\nexport default Tag;\n"]}

package/dist/{chunk-DOKTHDG3.js → chunk-SGRACNBP.js}

@@ -1,4 +1,4 @@
-import { cn } from './chunk-YNNAOXU5.js';
+import { cn } from './chunk-NGYLRX6F.js';
 import React from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
@@ -9,6 +9,7 @@ var RadioGroup = React.memo(
     error,
     orientation = "vertical",
     className,
+    classNames,
     children,
     ref,
     ...props
@@ -17,17 +18,19 @@ var RadioGroup = React.memo(
       "div",
       {
         ref,
-        className: cn("w-full", className),
+        className: cn("radioGroup_root", "w-full", className, classNames?.root),
         role: "radiogroup",
         ...props,
         children: [
-          label && /* @__PURE__ */ jsx("div", { className: "mb-2", children: /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-text-secondary", children: label }) }),
+          label && /* @__PURE__ */ jsx("div", { className: "mb-2", children: /* @__PURE__ */ jsx("span", { className: cn("radioGroup_label", "text-sm font-medium text-text-secondary", classNames?.label), children: label }) }),
           /* @__PURE__ */ jsx(
             "div",
             {
               className: cn(
+                "radioGroup_group",
                 "flex",
-                orientation === "vertical" ? "flex-col gap-2" : "flex-row flex-wrap gap-4"
+                orientation === "vertical" ? "flex-col gap-2" : "flex-row flex-wrap gap-4",
+                classNames?.group
               ),
               children
             }
@@ -36,8 +39,10 @@ var RadioGroup = React.memo(
             "p",
             {
               className: cn(
+                error ? "radioGroup_error" : "radioGroup_helper",
                 "mt-2 text-xs",
-                error ? "text-error" : "text-text-secondary"
+                error ? "text-error" : "text-text-secondary",
+                error ? classNames?.error : classNames?.helper
               ),
               children: error || helperText
             }
@@ -51,5 +56,5 @@ RadioGroup.displayName = "RadioGroup";
 var radio_group_default = RadioGroup;
 
 export { RadioGroup, radio_group_default };
-//# sourceMappingURL=chunk-DOKTHDG3.js.map
-//# sourceMappingURL=chunk-DOKTHDG3.js.map
+//# sourceMappingURL=chunk-SGRACNBP.js.map
+//# sourceMappingURL=chunk-SGRACNBP.js.map

package/dist/chunk-SGRACNBP.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/radio-group/index.tsx"],"names":[],"mappings":";;;;AAKO,IAAM,aAAa,KAAA,CAAM,IAAA;AAAA,EAC9B,CAAC;AAAA,IACC,KAAA;AAAA,IACA,UAAA;AAAA,IACA,KAAA;AAAA,IACA,WAAA,GAAc,UAAA;AAAA,IACd,SAAA;AAAA,IACA,UAAA;AAAA,IACA,QAAA;AAAA,IACA,GAAA;AAAA,IACA,GAAG;AAAA,GACL,KAAM;AACJ,IAAA,uBACE,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,WAAW,EAAA,CAAG,iBAAA,EAAmB,QAAA,EAAU,SAAA,EAAW,YAAY,IAAI,CAAA;AAAA,QACtE,IAAA,EAAK,YAAA;AAAA,QACJ,GAAG,KAAA;AAAA,QAEH,QAAA,EAAA;AAAA,UAAA,KAAA,oBACC,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,MAAA,EACb,8BAAC,MAAA,EAAA,EAAK,SAAA,EAAW,EAAA,CAAG,kBAAA,EAAoB,yCAAA,EAA2C,UAAA,EAAY,KAAK,CAAA,EACjG,iBACH,CAAA,EACF,CAAA;AAAA,0BAEF,GAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,EAAA;AAAA,gBACT,kBAAA;AAAA,gBACA,MAAA;AAAA,gBACA,WAAA,KAAgB,aACZ,gBAAA,GACA,0BAAA;AAAA,gBACJ,UAAA,EAAY;AAAA,eACd;AAAA,cAEC;AAAA;AAAA,WACH;AAAA,UAAA,CACE,cAAc,KAAA,qBACd,GAAA;AAAA,YAAC,GAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,EAAA;AAAA,gBACT,QAAQ,kBAAA,GAAqB,mBAAA;AAAA,gBAC7B,cAAA;AAAA,gBACA,QAAQ,YAAA,GAAe,qBAAA;AAAA,gBACvB,KAAA,GAAQ,UAAA,EAAY,KAAA,GAAQ,UAAA,EAAY;AAAA,eAC1C;AAAA,cAEC,QAAA,EAAA,KAAA,IAAS;AAAA;AAAA;AACZ;AAAA;AAAA,KAEJ;AAAA,EAEJ;AACF;AAEA,UAAA,CAAW,WAAA,GAAc,YAAA;AAGzB,IAAO,mBAAA,GAAQ","file":"chunk-SGRACNBP.js","sourcesContent":["import React from 'react'\n\nimport { cn } from '../utils'\nimport type { RadioGroupProps } from './types'\n\nexport const RadioGroup = React.memo<RadioGroupProps>(\n  ({\n    label,\n    helperText,\n    error,\n    orientation = 'vertical',\n    className,\n    classNames,\n    children,\n    ref,\n    ...props\n  }) => {\n    return (\n      <div\n        ref={ref}\n        className={cn('radioGroup_root', 'w-full', className, classNames?.root)}\n        role=\"radiogroup\"\n        {...props}\n      >\n        {label && (\n          <div className=\"mb-2\">\n            <span className={cn('radioGroup_label', 'text-sm font-medium text-text-secondary', classNames?.label)}>\n              {label}\n            </span>\n          </div>\n        )}\n        <div\n          className={cn(\n            'radioGroup_group',\n            'flex',\n            orientation === 'vertical'\n              ? 'flex-col gap-2'\n              : 'flex-row flex-wrap gap-4',\n            classNames?.group,\n          )}\n        >\n          {children}\n        </div>\n        {(helperText || error) && (\n          <p\n            className={cn(\n              error ? 'radioGroup_error' : 'radioGroup_helper',\n              'mt-2 text-xs',\n              error ? 'text-error' : 'text-text-secondary',\n              error ? classNames?.error : classNames?.helper,\n            )}\n          >\n            {error || helperText}\n          </p>\n        )}\n      </div>\n    )\n  },\n)\n\nRadioGroup.displayName = 'RadioGroup'\n\nexport type * from './types'\nexport default RadioGroup\n"]}

package/dist/{chunk-OALOWWO7.js → chunk-TTEBZZ3T.js}

@@ -1,37 +1,33 @@
-import { getCheckboxColorClass } from './chunk-5UEWVFF6.js';
-import { cn, iconSizes } from './chunk-YNNAOXU5.js';
+import { checkboxBorderColorClasses, checkedColorClasses, textColorClasses } from './chunk-NTPWR57C.js';
+import { cn, iconSizes } from './chunk-NGYLRX6F.js';
 import { cva } from 'class-variance-authority';
 import { Check } from 'lucide-react';
-import React, { useState } from 'react';
+import React, { useState, useId, useCallback, useEffect } from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
-var colorClasses = {
-  primary: "text-primary",
-  secondary: "text-secondary",
-  accent: "text-accent",
-  success: "text-success",
-  error: "text-error",
-  warning: "text-warning",
-  info: "text-info"
-};
+function useMergeRefs(...refs) {
+  const refsRef = React.useRef(refs);
+  refsRef.current = refs;
+  return useCallback((instance) => {
+    refsRef.current.forEach((ref) => {
+      if (typeof ref === "function") {
+        ref(instance);
+      } else if (ref && typeof ref === "object") {
+        ref.current = instance;
+      }
+    });
+  }, []);
+}
 var checkboxVariants = cva(
   "appearance-none rounded border bg-background cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed outline-none",
   {
     variants: {
-      color: {
-        primary: "border-border checked:border-primary",
-        secondary: "border-border checked:border-secondary",
-        accent: "border-border checked:border-accent",
-        success: "border-border checked:border-success",
-        error: "border-border checked:border-error",
-        warning: "border-border checked:border-warning",
-        info: "border-border checked:border-info"
-      },
+      color: checkboxBorderColorClasses,
       size: {
-        xs: "w-[var(--checkbox-size-xs)] h-[var(--checkbox-size-xs)]",
-        sm: "w-[var(--checkbox-size-sm)] h-[var(--checkbox-size-sm)]",
-        md: "w-[var(--checkbox-size-md)] h-[var(--checkbox-size-md)]",
-        lg: "w-[var(--checkbox-size-lg)] h-[var(--checkbox-size-lg)]"
+        xs: "w-(--checkbox-size-xs) h-(--checkbox-size-xs)",
+        sm: "w-(--checkbox-size-sm) h-(--checkbox-size-sm)",
+        md: "w-(--checkbox-size-md) h-(--checkbox-size-md)",
+        lg: "w-(--checkbox-size-lg) h-(--checkbox-size-lg)"
       },
       error: {
         true: "border-error checked:border-error",
@@ -57,16 +53,20 @@ var Checkbox = React.memo(
     defaultChecked,
     ref,
     labelClassName,
+    classNames,
     ...props
   }) => {
     const [internalChecked, setInternalChecked] = useState(
       defaultChecked ?? false
     );
     const internalRef = React.useRef(null);
-    const checkboxRef = ref || internalRef;
+    const uniqueId = useId();
+    const helperId = `checkbox-helper-${uniqueId}`;
+    const hasHelperText = !!(helperText || error);
+    const mergedRef = useMergeRefs(ref, internalRef);
     const isControlled = checked !== void 0;
     const currentChecked = isControlled ? checked : internalChecked;
-    const onChange = React.useCallback(
+    const onChange = useCallback(
       (event) => {
         if (!isControlled) {
           setInternalChecked(event.target.checked);
@@ -75,33 +75,41 @@ var Checkbox = React.memo(
       },
       [isControlled, props.onChange]
     );
-    React.useEffect(() => {
-      if (checkboxRef.current) {
-        checkboxRef.current.indeterminate = indeterminate;
+    useEffect(() => {
+      if (internalRef.current) {
+        internalRef.current.indeterminate = indeterminate;
       }
-    }, [indeterminate, checkboxRef]);
+    }, [indeterminate]);
     const checkboxElement = /* @__PURE__ */ jsxs("div", { className: "relative inline-flex", children: [
       /* @__PURE__ */ jsx(
         "input",
         {
-          ref: checkboxRef,
+          ref: mergedRef,
           type: "checkbox",
           className: cn(
+            "checkbox_checkbox",
             checkboxVariants({ color, size, error: !!error }),
-            className
+            className,
+            classNames?.checkbox
           ),
           "aria-checked": indeterminate ? "mixed" : currentChecked,
+          "aria-invalid": !!error || void 0,
+          "aria-describedby": hasHelperText ? helperId : void 0,
           ...props,
           onChange,
           checked: currentChecked
         }
       ),
-      currentChecked && /* @__PURE__ */ jsx("div", { className: "absolute inset-0 flex items-center justify-center pointer-events-none", children: indeterminate ? /* @__PURE__ */ jsx(
+      currentChecked && /* @__PURE__ */ jsx("div", { className: cn(
+        "checkbox_indicator",
+        "absolute inset-0 flex items-center justify-center pointer-events-none",
+        classNames?.indicator
+      ), children: indeterminate ? /* @__PURE__ */ jsx(
         "div",
         {
           className: cn(
             "w-[70%] h-[70%] rounded-xs border-2 border-background flex items-center justify-center",
-            getCheckboxColorClass(color)
+            checkedColorClasses[color]
           )
         }
       ) : /* @__PURE__ */ jsx(
@@ -109,13 +117,13 @@ var Checkbox = React.memo(
         {
           className: cn(
             iconSizes[size],
-            colorClasses[color]
+            textColorClasses[color]
           )
         }
       ) })
     ] });
     if (!label && !helperText && !error) return checkboxElement;
-    return /* @__PURE__ */ jsxs("div", { className: "w-full", children: [
+    return /* @__PURE__ */ jsxs("div", { className: cn("checkbox_root", "w-full", classNames?.root), children: [
       /* @__PURE__ */ jsxs(
         "label",
         {
@@ -129,10 +137,12 @@ var Checkbox = React.memo(
               "span",
               {
                 className: cn(
+                  "checkbox_label",
                   "text-sm text-text-primary select-none",
                   error && "text-error",
                   props.disabled && "opacity-50",
-                  labelClassName
+                  labelClassName,
+                  classNames?.label
                 ),
                 children: label
               }
@@ -143,11 +153,14 @@ var Checkbox = React.memo(
       (helperText || error) && /* @__PURE__ */ jsx(
         "p",
         {
+          id: helperId,
           className: cn(
+            "checkbox_description",
             "mt-1 ml-0 text-xs",
-            error ? "text-error" : "text-text-secondary"
+            error ? "text-error" : "text-text-secondary",
+            classNames?.description
           ),
-          children: error || helperText
+          children: typeof error === "string" ? error : helperText
         }
       )
     ] });
@@ -157,5 +170,5 @@ Checkbox.displayName = "Checkbox";
 var checkbox_default = Checkbox;
 
 export { checkbox_default };
-//# sourceMappingURL=chunk-OALOWWO7.js.map
-//# sourceMappingURL=chunk-OALOWWO7.js.map
+//# sourceMappingURL=chunk-TTEBZZ3T.js.map
+//# sourceMappingURL=chunk-TTEBZZ3T.js.map

package/dist/chunk-TTEBZZ3T.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/checkbox/index.tsx"],"names":[],"mappings":"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","file":"chunk-TTEBZZ3T.js","sourcesContent":["'use client'\n\nimport { cva } from 'class-variance-authority'\nimport { Check } from 'lucide-react'\nimport React, { useState, useCallback, useEffect, useId } from 'react'\n\nimport { cn, iconSizes } from '../utils'\nimport { checkboxBorderColorClasses, checkedColorClasses, textColorClasses } from '../variants'\nimport type { CheckboxProps } from './types'\n\n/**\n * Merges multiple refs into a single callback ref.\n * Handles both callback refs and RefObject refs safely.\n */\nfunction useMergeRefs<T>(\n  ...refs: (React.Ref<T> | undefined)[]\n): React.RefCallback<T> {\n  // Store refs in a ref to avoid dependency array issues\n  const refsRef = React.useRef(refs)\n  refsRef.current = refs\n\n  return useCallback((instance: T | null) => {\n    refsRef.current.forEach((ref) => {\n      if (typeof ref === 'function') {\n        ref(instance)\n      } else if (ref && typeof ref === 'object') {\n        ;(ref as React.MutableRefObject<T | null>).current = instance\n      }\n    })\n  }, [])\n}\n\nconst checkboxVariants = cva(\n  'appearance-none rounded border bg-background cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed outline-none',\n  {\n    variants: {\n      color: checkboxBorderColorClasses,\n      size: {\n        xs: 'w-(--checkbox-size-xs) h-(--checkbox-size-xs)',\n        sm: 'w-(--checkbox-size-sm) h-(--checkbox-size-sm)',\n        md: 'w-(--checkbox-size-md) h-(--checkbox-size-md)',\n        lg: 'w-(--checkbox-size-lg) h-(--checkbox-size-lg)',\n      },\n      error: {\n        true: 'border-error checked:border-error',\n        false: '',\n      },\n    },\n    defaultVariants: {\n      color: 'primary',\n      size: 'md',\n    },\n  },\n)\n\nconst Checkbox = React.memo<CheckboxProps>(\n  ({\n    color = 'primary',\n    size = 'md',\n    label,\n    helperText,\n    error,\n    indeterminate = false,\n    className,\n    checked,\n    defaultChecked,\n    ref,\n    labelClassName,\n    classNames,\n    ...props\n  }) => {\n    const [internalChecked, setInternalChecked] = useState(\n      defaultChecked ?? false,\n    )\n    const internalRef = React.useRef<HTMLInputElement>(null)\n\n    // Generate unique ID for accessibility\n    const uniqueId = useId()\n    const helperId = `checkbox-helper-${uniqueId}`\n    const hasHelperText = !!(helperText || error)\n\n    // Safely merge refs - handles both callback refs and RefObject refs\n    const mergedRef = useMergeRefs(ref, internalRef)\n\n    // Determine if controlled\n    const isControlled = checked !== undefined\n    const currentChecked = isControlled ? checked : internalChecked\n\n    const onChange = useCallback(\n      (event: React.ChangeEvent<HTMLInputElement>) => {\n        if (!isControlled) {\n          setInternalChecked(event.target.checked)\n        }\n        props.onChange?.(event)\n      },\n      [isControlled, props.onChange],\n    )\n\n    useEffect(() => {\n      if (internalRef.current) {\n        internalRef.current.indeterminate = indeterminate\n      }\n    }, [indeterminate])\n\n    const checkboxElement = (\n      <div className=\"relative inline-flex\">\n        <input\n          ref={mergedRef}\n          type=\"checkbox\"\n          className={cn(\n            'checkbox_checkbox',\n            checkboxVariants({ color, size, error: !!error }),\n            className,\n            classNames?.checkbox,\n          )}\n          aria-checked={indeterminate ? 'mixed' : currentChecked}\n          aria-invalid={!!error || undefined}\n          aria-describedby={hasHelperText ? helperId : undefined}\n          {...props}\n          onChange={onChange}\n          checked={currentChecked}\n        />\n        {currentChecked && (\n          <div className={cn(\n            'checkbox_indicator',\n            'absolute inset-0 flex items-center justify-center pointer-events-none',\n            classNames?.indicator,\n          )}>\n            {indeterminate ? (\n              <div\n                className={cn(\n                  'w-[70%] h-[70%] rounded-xs border-2 border-background flex items-center justify-center',\n                  checkedColorClasses[color],\n                )}\n              />\n            ) : (\n              <Check\n                className={cn(\n                  iconSizes[size],\n                  textColorClasses[color],\n                )}\n              />\n            )}\n          </div>\n        )}\n      </div>\n    )\n\n    if (!label && !helperText && !error) return checkboxElement\n\n    return (\n      <div className={cn('checkbox_root', 'w-full', classNames?.root)}>\n        <label\n          className={cn(\n            'flex items-center gap-2',\n            !props.disabled && 'cursor-pointer',\n          )}\n        >\n          {checkboxElement}\n          {label && (\n            <span\n              className={cn(\n                'checkbox_label',\n                'text-sm text-text-primary select-none',\n                error && 'text-error',\n                props.disabled && 'opacity-50',\n                labelClassName,\n                classNames?.label,\n              )}\n            >\n              {label}\n            </span>\n          )}\n        </label>\n        {(helperText || error) && (\n          <p\n            id={helperId}\n            className={cn(\n              'checkbox_description',\n              'mt-1 ml-0 text-xs',\n              error ? 'text-error' : 'text-text-secondary',\n              classNames?.description,\n            )}\n          >\n            {typeof error === 'string' ? error : helperText}\n          </p>\n        )}\n      </div>\n    )\n  },\n)\n\nCheckbox.displayName = 'Checkbox'\n\nexport type * from './types'\nexport default Checkbox\n"]}

package/dist/{chunk-FCMVKFVV.js → chunk-US4ZCMNU.js}

@@ -1,5 +1,5 @@
-import { checkbox_default } from './chunk-OALOWWO7.js';
-import { cn, getValidationStatus, iconSizes, statusMessageVariants } from './chunk-YNNAOXU5.js';
+import { checkbox_default } from './chunk-TTEBZZ3T.js';
+import { cn, getValidationStatus, iconSizes, statusMessageVariants } from './chunk-NGYLRX6F.js';
 import { Search, ChevronRight, ChevronLeft, ChevronsRight, ChevronsLeft } from 'lucide-react';
 import React from 'react';
 import { cva } from 'class-variance-authority';
@@ -30,7 +30,7 @@ var transferItemVariants = cva(
 );
 var transferButtonVariants = cva("flex flex-col gap-2");
 var transferActionButtonVariants = cva(
-  "flex items-center justify-center p-2 rounded-md border border-border bg-background text-text-muted hover:bg-primary hover:text-white hover:border-primary transition-colors disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:bg-background disabled:hover:text-text-muted disabled:hover:border-border"
+  "flex items-center justify-center p-2 rounded-md border border-border bg-background text-text-secondary hover:bg-primary hover:text-white hover:border-primary transition-colors disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:bg-background disabled:hover:text-text-secondary disabled:hover:border-border"
 );
 var filterItems = (items, searchValue) => {
   if (!searchValue) return items;
@@ -59,7 +59,8 @@ var TransferList = React.memo(
     onItemSelectAll,
     onSearch,
     render,
-    footer
+    footer,
+    classNames
   }) => {
     const [searchValue, setSearchValue] = React.useState("");
     const filteredData = React.useMemo(
@@ -100,8 +101,8 @@ var TransferList = React.memo(
       },
       [selectedKeys, onItemSelect]
     );
-    return /* @__PURE__ */ jsxs("div", { className: "flex flex-col border border-border rounded-lg bg-card overflow-hidden min-w-72", children: [
-      /* @__PURE__ */ jsx("div", { className: transferHeaderVariants(), children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-1", children: [
+    return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col border border-border rounded-lg bg-card overflow-hidden min-w-72 transfer_list", classNames?.list), children: [
+      /* @__PURE__ */ jsx("div", { className: cn(transferHeaderVariants(), "transfer_header", classNames?.header), children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-1", children: [
         showSelectAll && /* @__PURE__ */ jsx(
           checkbox_default,
           {
@@ -114,7 +115,7 @@ var TransferList = React.memo(
         ),
         /* @__PURE__ */ jsxs("span", { className: "text-sm font-medium text-text-primary", children: [
           title,
-          /* @__PURE__ */ jsxs("span", { className: "text-text-muted ml-1", children: [
+          /* @__PURE__ */ jsxs("span", { className: "text-text-secondary ml-1", children: [
             "(",
             selectedCount,
             "/",
@@ -124,12 +125,12 @@ var TransferList = React.memo(
         ] })
       ] }) }),
       showSearch && /* @__PURE__ */ jsx("div", { className: "p-2 border-b border-border", children: /* @__PURE__ */ jsxs("div", { className: "relative", children: [
-        /* @__PURE__ */ jsx(Search, { className: "absolute left-2 top-1/2 -translate-y-1/2 w-4 h-4 text-text-muted" }),
+        /* @__PURE__ */ jsx(Search, { className: "absolute left-2 top-1/2 -translate-y-1/2 w-4 h-4 text-text-secondary" }),
         /* @__PURE__ */ jsx(
           "input",
           {
             type: "text",
-            className: "w-full pl-8 pr-3 py-1.5 text-sm bg-background border border-border rounded-md outline-none focus:border-primary transition-colors",
+            className: cn("w-full pl-8 pr-3 py-1.5 text-sm bg-background border border-border rounded-md outline-none focus:border-primary transition-colors transfer_search", classNames?.search),
             placeholder: searchPlaceholder,
             value: searchValue,
             onChange: handleSearchChange,
@@ -142,14 +143,16 @@ var TransferList = React.memo(
         {
           className: transferBodyVariants(),
           style: { height: listHeight },
-          children: filteredData.length === 0 ? /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center h-full text-sm text-text-muted", children: "No data" }) : filteredData.map((item) => /* @__PURE__ */ jsxs(
+          children: filteredData.length === 0 ? /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center h-full text-sm text-text-secondary", children: "No data" }) : filteredData.map((item) => /* @__PURE__ */ jsxs(
             "div",
             {
               className: cn(
                 transferItemVariants({
                   selected: selectedKeys.includes(item.key),
                   disabled: !!item.disabled || disabled
-                })
+                }),
+                "transfer_item",
+                classNames?.item
               ),
               onClick: () => handleItemSelect(item),
               children: [
@@ -165,7 +168,7 @@ var TransferList = React.memo(
                 ),
                 render ? render(item) : /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
                   /* @__PURE__ */ jsx("div", { className: "text-sm text-text-primary truncate", children: item.label }),
-                  item.description && /* @__PURE__ */ jsx("div", { className: "text-xs text-text-muted truncate", children: item.description })
+                  item.description && /* @__PURE__ */ jsx("div", { className: "text-xs text-text-secondary truncate", children: item.description })
                 ] })
               ]
             },
@@ -173,7 +176,7 @@ var TransferList = React.memo(
           ))
         }
       ),
-      footer && /* @__PURE__ */ jsx("div", { className: "px-4 py-2 border-t border-border bg-surface text-sm text-text-muted", children: footer })
+      footer && /* @__PURE__ */ jsx("div", { className: "px-4 py-2 border-t border-border bg-surface text-sm text-text-secondary", children: footer })
     ] });
   }
 );
@@ -203,6 +206,7 @@ var Transfer = React.memo(
     info,
     success,
     className,
+    classNames,
     ref
   }) => {
     const [internalTargetKeys, setInternalTargetKeys] = React.useState(defaultTargetKeys);
@@ -301,8 +305,8 @@ var Transfer = React.memo(
     const leftFooter = footer?.({ direction: "left" });
     const rightFooter = footer?.({ direction: "right" });
     return /* @__PURE__ */ jsxs("div", { ref, children: [
-      label && /* @__PURE__ */ jsx("label", { className: "block mb-2", children: /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-text-muted", children: label }) }),
-      /* @__PURE__ */ jsxs("div", { className: cn("flex items-center gap-4", className), children: [
+      label && /* @__PURE__ */ jsx("label", { className: "block mb-2", children: /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-text-secondary", children: label }) }),
+      /* @__PURE__ */ jsxs("div", { className: cn("flex items-center gap-4 transfer_root", classNames?.root, className), children: [
         /* @__PURE__ */ jsx(
           TransferList,
           {
@@ -320,10 +324,11 @@ var Transfer = React.memo(
             onSearch: (value) => onSearch?.("left", value),
             render,
             footer: leftFooter,
-            size
+            size,
+            classNames
           }
         ),
-        /* @__PURE__ */ jsxs("div", { className: transferButtonVariants(), children: [
+        /* @__PURE__ */ jsxs("div", { className: cn(transferButtonVariants(), "transfer_actions", classNames?.actions), children: [
           /* @__PURE__ */ jsx(
             "button",
             {
@@ -386,7 +391,8 @@ var Transfer = React.memo(
             onSearch: (value) => onSearch?.("right", value),
             render,
             footer: rightFooter,
-            size
+            size,
+            classNames
           }
         )
       ] }),
@@ -397,5 +403,5 @@ var Transfer = React.memo(
 Transfer.displayName = "Transfer";
 
 export { Transfer };
-//# sourceMappingURL=chunk-FCMVKFVV.js.map
-//# sourceMappingURL=chunk-FCMVKFVV.js.map
+//# sourceMappingURL=chunk-US4ZCMNU.js.map
+//# sourceMappingURL=chunk-US4ZCMNU.js.map