@mdigital_ui/ui 0.1.0

package/dist/chunk-OW5A5IIF.js

@@ -0,0 +1,175 @@
+import { componentColors } from './chunk-5UEWVFF6.js';
+import { cn } from './chunk-YNNAOXU5.js';
+import { cva } from 'class-variance-authority';
+import React, { useState } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var createActiveTabVariants = (variant, getClassName) => {
+  return componentColors.map((color) => ({
+    variant,
+    color,
+    active: true,
+    className: getClassName(color)
+  }));
+};
+var tabListVariants = cva("flex", {
+  variants: {
+    size: {
+      xs: "gap-1",
+      sm: "gap-1.5",
+      md: "gap-2",
+      lg: "gap-2.5"
+    },
+    variant: {
+      default: "border-b",
+      solid: "border-b",
+      soft: "border-b",
+      pill: "bg-surface p-0.5 rounded-lg border border-border gap-0 w-fit"
+    }
+  },
+  defaultVariants: {
+    size: "md",
+    variant: "default"
+  }
+});
+var tabItemVariants = cva(
+  "font-medium transition-all duration-200 ease-out cursor-pointer flex items-center gap-2",
+  {
+    variants: {
+      size: {
+        xs: "text-xs px-2 py-1",
+        sm: "text-sm px-3 py-1.5",
+        md: "text-base px-4 py-2",
+        lg: "text-lg px-5 py-2.5"
+      },
+      variant: {
+        default: "relative pb-2 border-b-2 -mb-px",
+        solid: "relative pb-2 border-b-2 -mb-px",
+        soft: "relative pb-2 border-b-2 -mb-px",
+        pill: "rounded-md"
+      },
+      color: {
+        default: "",
+        primary: "",
+        secondary: "",
+        accent: "",
+        success: "",
+        error: "",
+        warning: "",
+        info: ""
+      },
+      active: {
+        true: "",
+        false: ""
+      }
+    },
+    compoundVariants: [
+      // Inactive states (all variants)
+      ...componentColors.map((color) => ({
+        color,
+        active: false,
+        className: "border-transparent text-text-secondary hover:text-text-primary hover:border-border/30"
+      })),
+      // Active pill variant
+      ...createActiveTabVariants(
+        "pill",
+        (color) => color === "default" ? "bg-background text-text-primary" : `bg-${color} text-white`
+      ),
+      // Active default variant (border-bottom)
+      ...createActiveTabVariants(
+        "default",
+        (color) => color === "default" ? "border-border text-text-primary" : `border-${color} text-${color}`
+      ),
+      // Active solid variant (border-bottom)
+      ...createActiveTabVariants(
+        "solid",
+        (color) => color === "default" ? "border-border text-text-primary" : `border-${color} text-${color}`
+      ),
+      // Active soft variant (border-bottom with opacity)
+      ...createActiveTabVariants(
+        "soft",
+        (color) => color === "default" ? "border-border/50 text-text-primary" : `border-${color}/50 text-${color}`
+      ),
+      // Inactive pill variant hover
+      ...componentColors.map((color) => ({
+        variant: "pill",
+        color,
+        active: false,
+        className: "bg-transparent hover:bg-background"
+      }))
+    ],
+    defaultVariants: {
+      size: "md",
+      variant: "default",
+      color: "primary",
+      active: false
+    }
+  }
+);
+var Tabs = React.memo(
+  ({
+    items,
+    defaultActiveKey,
+    activeKey: controlledActiveKey,
+    color = "primary",
+    size = "md",
+    variant = "default",
+    onChange,
+    className
+  }) => {
+    const [internalActiveKey, setInternalActiveKey] = useState(
+      defaultActiveKey || items[0]?.key || ""
+    );
+    const activeKey = controlledActiveKey !== void 0 ? controlledActiveKey : internalActiveKey;
+    const handleTabClick = (key, disabled) => {
+      if (disabled) return;
+      if (controlledActiveKey === void 0) {
+        setInternalActiveKey(key);
+      }
+      onChange?.(key);
+    };
+    const activeItem = items.find((item) => item.key === activeKey);
+    return /* @__PURE__ */ jsxs("div", { className: cn(className), children: [
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: cn(
+            tabListVariants({ size, variant }),
+            variant !== "pill" && "border-border"
+          ),
+          children: items.map((item) => {
+            const isActive = item.key === activeKey;
+            return /* @__PURE__ */ jsxs(
+              "button",
+              {
+                className: cn(
+                  tabItemVariants({
+                    size,
+                    variant,
+                    color,
+                    active: isActive
+                  }),
+                  item.disabled && "opacity-50 cursor-not-allowed"
+                ),
+                onClick: () => handleTabClick(item.key, item.disabled),
+                disabled: item.disabled,
+                children: [
+                  item.icon,
+                  item.label
+                ]
+              },
+              item.key
+            );
+          })
+        }
+      ),
+      activeItem?.content && /* @__PURE__ */ jsx("div", { className: "py-4 animate-in fade-in slide-in-from-bottom-2 duration-300", children: activeItem?.content })
+    ] });
+  }
+);
+Tabs.displayName = "Tabs";
+var tabs_default = Tabs;
+
+export { tabs_default };
+//# sourceMappingURL=chunk-OW5A5IIF.js.map
+//# sourceMappingURL=chunk-OW5A5IIF.js.map

package/dist/chunk-OW5A5IIF.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/tabs/index.tsx"],"names":[],"mappings":"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","file":"chunk-OW5A5IIF.js","sourcesContent":["import { cva } from 'class-variance-authority'\nimport React, { useState } from 'react'\n\nimport { cn } from '../utils'\nimport { componentColors } from '../variants'\nimport type { TabsColor, TabsProps, TabsVariant } from './types'\n\n// Tab-specific variant generators for DRY\nconst createActiveTabVariants = (\n  variant: TabsVariant,\n  getClassName: (color: string) => string,\n) => {\n  return componentColors.map((color) => ({\n    variant,\n    color: color as TabsColor,\n    active: true as const,\n    className: getClassName(color),\n  }))\n}\n\nconst tabListVariants = cva('flex', {\n  variants: {\n    size: {\n      xs: 'gap-1',\n      sm: 'gap-1.5',\n      md: 'gap-2',\n      lg: 'gap-2.5',\n    },\n    variant: {\n      default: 'border-b',\n      solid: 'border-b',\n      soft: 'border-b',\n      pill: 'bg-surface p-0.5 rounded-lg border border-border gap-0 w-fit',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n    variant: 'default',\n  },\n})\n\nconst tabItemVariants = cva(\n  'font-medium transition-all duration-200 ease-out cursor-pointer flex items-center gap-2',\n  {\n    variants: {\n      size: {\n        xs: 'text-xs px-2 py-1',\n        sm: 'text-sm px-3 py-1.5',\n        md: 'text-base px-4 py-2',\n        lg: 'text-lg px-5 py-2.5',\n      },\n      variant: {\n        default: 'relative pb-2 border-b-2 -mb-px',\n        solid: 'relative pb-2 border-b-2 -mb-px',\n        soft: 'relative pb-2 border-b-2 -mb-px',\n        pill: 'rounded-md',\n      },\n      color: {\n        default: '',\n        primary: '',\n        secondary: '',\n        accent: '',\n        success: '',\n        error: '',\n        warning: '',\n        info: '',\n      },\n      active: {\n        true: '',\n        false: '',\n      },\n    },\n    compoundVariants: [\n      // Inactive states (all variants)\n      ...componentColors.map((color) => ({\n        color: color as TabsColor,\n        active: false as const,\n        className:\n          'border-transparent text-text-secondary hover:text-text-primary hover:border-border/30',\n      })),\n\n      // Active pill variant\n      ...createActiveTabVariants('pill', (color) =>\n        color === 'default'\n          ? 'bg-background text-text-primary'\n          : `bg-${color} text-white`,\n      ),\n\n      // Active default variant (border-bottom)\n      ...createActiveTabVariants('default', (color) =>\n        color === 'default'\n          ? 'border-border text-text-primary'\n          : `border-${color} text-${color}`,\n      ),\n\n      // Active solid variant (border-bottom)\n      ...createActiveTabVariants('solid', (color) =>\n        color === 'default'\n          ? 'border-border text-text-primary'\n          : `border-${color} text-${color}`,\n      ),\n\n      // Active soft variant (border-bottom with opacity)\n      ...createActiveTabVariants('soft', (color) =>\n        color === 'default'\n          ? 'border-border/50 text-text-primary'\n          : `border-${color}/50 text-${color}`,\n      ),\n\n      // Inactive pill variant hover\n      ...componentColors.map((color) => ({\n        variant: 'pill' as const,\n        color: color as TabsColor,\n        active: false as const,\n        className: 'bg-transparent hover:bg-background',\n      })),\n    ],\n    defaultVariants: {\n      size: 'md',\n      variant: 'default',\n      color: 'primary',\n      active: false,\n    },\n  },\n)\n\nconst Tabs = React.memo<TabsProps>(\n  ({\n    items,\n    defaultActiveKey,\n    activeKey: controlledActiveKey,\n    color = 'primary',\n    size = 'md',\n    variant = 'default',\n    onChange,\n    className,\n  }) => {\n    const [internalActiveKey, setInternalActiveKey] = useState(\n      defaultActiveKey || items[0]?.key || '',\n    )\n\n    const activeKey =\n      controlledActiveKey !== undefined\n        ? controlledActiveKey\n        : internalActiveKey\n\n    const handleTabClick = (key: string, disabled?: boolean) => {\n      if (disabled) return\n\n      if (controlledActiveKey === undefined) {\n        setInternalActiveKey(key)\n      }\n      onChange?.(key)\n    }\n\n    const activeItem = items.find((item) => item.key === activeKey)\n\n    return (\n      <div className={cn(className)}>\n        <div\n          className={cn(\n            tabListVariants({ size, variant }),\n            variant !== 'pill' && 'border-border',\n          )}\n        >\n          {items.map((item) => {\n            const isActive = item.key === activeKey\n\n            return (\n              <button\n                key={item.key}\n                className={cn(\n                  tabItemVariants({\n                    size,\n                    variant,\n                    color,\n                    active: isActive,\n                  }),\n                  item.disabled && 'opacity-50 cursor-not-allowed',\n                )}\n                onClick={() => handleTabClick(item.key, item.disabled)}\n                disabled={item.disabled}\n              >\n                {item.icon}\n                {item.label}\n              </button>\n            )\n          })}\n        </div>\n\n        {/* Performance optimization: Removed key prop to prevent forced remount\n            on tab change. Animation still works via CSS, but tab content state\n            is preserved. This is especially important for tabs containing forms\n            or expensive components. */}\n        {activeItem?.content && (\n          <div className=\"py-4 animate-in fade-in slide-in-from-bottom-2 duration-300\">\n            {activeItem?.content}\n          </div>\n        )}\n      </div>\n    )\n  },\n)\n\nTabs.displayName = 'Tabs'\n\nexport type * from './types'\nexport default Tabs\n"]}

package/dist/chunk-R225A5II.js

@@ -0,0 +1,187 @@
+import { cn } from './chunk-YNNAOXU5.js';
+import React from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function getValidationStatus(props) {
+  if (props.error) return "error";
+  if (props.warning) return "warning";
+  if (props.info) return "info";
+  if (props.success) return "success";
+  return "default";
+}
+function getValidationMessage(props) {
+  const status = getValidationStatus(props);
+  if (status === "error" && typeof props.error === "string") return props.error;
+  if (status === "warning" && typeof props.warning === "string")
+    return props.warning;
+  if (status === "info" && typeof props.info === "string") return props.info;
+  if (status === "success" && typeof props.success === "string")
+    return props.success;
+  return props.helperText;
+}
+var InputOTP = React.memo(
+  ({
+    length = 6,
+    size = "md",
+    value = "",
+    onChange,
+    onComplete,
+    error,
+    warning,
+    info,
+    success,
+    helperText,
+    disabled = false,
+    autoFocus = false,
+    type = "text",
+    pattern,
+    label,
+    messagePosition = "bottom",
+    className,
+    ref
+  }) => {
+    const inputRefs = React.useRef([]);
+    const [otp, setOtp] = React.useState(
+      value.split("").slice(0, length)
+    );
+    React.useEffect(() => {
+      setOtp(value.split("").slice(0, length));
+    }, [value, length]);
+    React.useEffect(() => {
+      if (autoFocus && inputRefs.current[0]) {
+        inputRefs.current[0].focus();
+      }
+    }, [autoFocus]);
+    const handleChange = React.useCallback(
+      (index, newValue) => {
+        const char = newValue.slice(-1);
+        if (pattern && char && !new RegExp(pattern).test(char)) {
+          return;
+        }
+        const newOtp = [...otp];
+        newOtp[index] = char;
+        setOtp(newOtp);
+        const otpValue = newOtp.join("");
+        onChange?.(otpValue);
+        if (char && index < length - 1) {
+          inputRefs.current[index + 1]?.focus();
+        }
+        if (otpValue.length === length) {
+          onComplete?.(otpValue);
+        }
+      },
+      [otp, length, onChange, onComplete, pattern]
+    );
+    const handleKeyDown = React.useCallback(
+      (index, e) => {
+        if (e.key === "Backspace") {
+          if (!otp[index] && index > 0) {
+            inputRefs.current[index - 1]?.focus();
+          }
+        } else if (e.key === "ArrowLeft" && index > 0) {
+          inputRefs.current[index - 1]?.focus();
+        } else if (e.key === "ArrowRight" && index < length - 1) {
+          inputRefs.current[index + 1]?.focus();
+        }
+      },
+      [otp, length]
+    );
+    const handlePaste = React.useCallback(
+      (e) => {
+        e.preventDefault();
+        const pastedData = e.clipboardData.getData("text").slice(0, length);
+        if (pattern && !new RegExp(`^${pattern}*$`).test(pastedData)) {
+          return;
+        }
+        const newOtp = pastedData.split("").slice(0, length);
+        setOtp(newOtp);
+        const otpValue = newOtp.join("");
+        onChange?.(otpValue);
+        const focusIndex = Math.min(newOtp.length, length - 1);
+        inputRefs.current[focusIndex]?.focus();
+        if (otpValue.length === length) {
+          onComplete?.(otpValue);
+        }
+      },
+      [length, onChange, onComplete, pattern]
+    );
+    const status = getValidationStatus({
+      error,
+      warning,
+      info,
+      success});
+    const message = getValidationMessage({
+      error,
+      warning,
+      info,
+      success,
+      helperText
+    });
+    const sizeClasses = {
+      xs: "h-8 w-8 text-xs",
+      sm: "h-9 w-9 text-sm",
+      md: "h-12 w-12 text-base",
+      lg: "h-14 w-14 text-lg"
+    };
+    const statusBorderClasses = {
+      default: "border-border focus:border-primary",
+      error: "border-error focus:border-error",
+      warning: "border-warning focus:border-warning",
+      info: "border-info focus:border-info",
+      success: "border-success focus:border-success"
+    };
+    const statusTextClasses = {
+      default: "text-text-secondary",
+      error: "text-error",
+      warning: "text-warning",
+      info: "text-info",
+      success: "text-success"
+    };
+    const MessageComponent = message && /* @__PURE__ */ jsx("p", { className: cn("text-xs mt-1", statusTextClasses[status]), children: message });
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn("w-full", className),
+        children: [
+          label && messagePosition === "top" && /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-text-primary mb-1.5", children: label }),
+          messagePosition === "top" && MessageComponent,
+          /* @__PURE__ */ jsx("div", { className: "flex gap-2", children: Array.from({ length }).map((_, index) => /* @__PURE__ */ jsx(
+            "input",
+            {
+              ref: (el) => {
+                inputRefs.current[index] = el;
+              },
+              type: "text",
+              inputMode: type === "number" ? "numeric" : "text",
+              maxLength: 1,
+              value: otp[index] || "",
+              onChange: (e) => handleChange(index, e.target.value),
+              onKeyDown: (e) => handleKeyDown(index, e),
+              onPaste: handlePaste,
+              disabled,
+              className: cn(
+                "text-center font-semibold",
+                "border rounded-md outline-none",
+                "disabled:opacity-50 disabled:cursor-not-allowed",
+                "text-text-primary",
+                sizeClasses[size],
+                statusBorderClasses[status]
+              ),
+              "aria-label": `OTP digit ${index + 1}`
+            },
+            index
+          )) }),
+          label && messagePosition === "bottom" && /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-text-primary mt-1.5", children: label }),
+          messagePosition === "bottom" && MessageComponent
+        ]
+      }
+    );
+  }
+);
+InputOTP.displayName = "InputOTP";
+var input_otp_default = InputOTP;
+
+export { input_otp_default };
+//# sourceMappingURL=chunk-R225A5II.js.map
+//# sourceMappingURL=chunk-R225A5II.js.map

package/dist/chunk-R225A5II.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/input-otp/index.tsx"],"names":[],"mappings":"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","file":"chunk-R225A5II.js","sourcesContent":["import React from 'react'\n\nimport { cn } from '../utils'\nimport type { InputOTPProps } from './types'\n\n/**\n * Determine the current validation status\n */\nfunction getValidationStatus(\n  props: InputOTPProps,\n): 'default' | 'error' | 'warning' | 'info' | 'success' {\n  if (props.error) return 'error'\n  if (props.warning) return 'warning'\n  if (props.info) return 'info'\n  if (props.success) return 'success'\n  return 'default'\n}\n\n/**\n * Get the validation message to display\n */\nfunction getValidationMessage(props: InputOTPProps): string | undefined {\n  const status = getValidationStatus(props)\n  if (status === 'error' && typeof props.error === 'string') return props.error\n  if (status === 'warning' && typeof props.warning === 'string')\n    return props.warning\n  if (status === 'info' && typeof props.info === 'string') return props.info\n  if (status === 'success' && typeof props.success === 'string')\n    return props.success\n  return props.helperText\n}\n\nconst InputOTP = React.memo<InputOTPProps>(\n  ({\n    length = 6,\n    size = 'md',\n    value = '',\n    onChange,\n    onComplete,\n    error,\n    warning,\n    info,\n    success,\n    helperText,\n    disabled = false,\n    autoFocus = false,\n    type = 'text',\n    pattern,\n    label,\n    messagePosition = 'bottom',\n    className,\n    ref,\n  }) => {\n    const inputRefs = React.useRef<(HTMLInputElement | null)[]>([])\n    const [otp, setOtp] = React.useState<string[]>(\n      value.split('').slice(0, length),\n    )\n\n    // Update OTP when controlled value changes\n    React.useEffect(() => {\n      setOtp(value.split('').slice(0, length))\n    }, [value, length])\n\n    // Auto-focus first input\n    React.useEffect(() => {\n      if (autoFocus && inputRefs.current[0]) {\n        inputRefs.current[0].focus()\n      }\n    }, [autoFocus])\n\n    const handleChange = React.useCallback(\n      (index: number, newValue: string) => {\n        // Only allow single character or clear\n        const char = newValue.slice(-1)\n\n        // Validate pattern if provided\n        if (pattern && char && !new RegExp(pattern).test(char)) {\n          return\n        }\n\n        const newOtp = [...otp]\n        newOtp[index] = char\n        setOtp(newOtp)\n\n        const otpValue = newOtp.join('')\n        onChange?.(otpValue)\n\n        // Auto-focus next input\n        if (char && index < length - 1) {\n          inputRefs.current[index + 1]?.focus()\n        }\n\n        // Call onComplete when all fields filled\n        if (otpValue.length === length) {\n          onComplete?.(otpValue)\n        }\n      },\n      [otp, length, onChange, onComplete, pattern],\n    )\n\n    const handleKeyDown = React.useCallback(\n      (index: number, e: React.KeyboardEvent<HTMLInputElement>) => {\n        if (e.key === 'Backspace') {\n          if (!otp[index] && index > 0) {\n            // Move to previous input if current is empty\n            inputRefs.current[index - 1]?.focus()\n          }\n        } else if (e.key === 'ArrowLeft' && index > 0) {\n          inputRefs.current[index - 1]?.focus()\n        } else if (e.key === 'ArrowRight' && index < length - 1) {\n          inputRefs.current[index + 1]?.focus()\n        }\n      },\n      [otp, length],\n    )\n\n    const handlePaste = React.useCallback(\n      (e: React.ClipboardEvent) => {\n        e.preventDefault()\n        const pastedData = e.clipboardData.getData('text').slice(0, length)\n\n        // Validate pasted data against pattern if provided\n        if (pattern && !new RegExp(`^${pattern}*$`).test(pastedData)) {\n          return\n        }\n\n        const newOtp = pastedData.split('').slice(0, length)\n        setOtp(newOtp)\n\n        const otpValue = newOtp.join('')\n        onChange?.(otpValue)\n\n        // Focus last filled input or first empty\n        const focusIndex = Math.min(newOtp.length, length - 1)\n        inputRefs.current[focusIndex]?.focus()\n\n        // Call onComplete if all fields filled\n        if (otpValue.length === length) {\n          onComplete?.(otpValue)\n        }\n      },\n      [length, onChange, onComplete, pattern],\n    )\n\n    const status = getValidationStatus({\n      error,\n      warning,\n      info,\n      success,\n      helperText,\n    })\n    const message = getValidationMessage({\n      error,\n      warning,\n      info,\n      success,\n      helperText,\n    })\n\n    const sizeClasses = {\n      xs: 'h-8 w-8 text-xs',\n      sm: 'h-9 w-9 text-sm',\n      md: 'h-12 w-12 text-base',\n      lg: 'h-14 w-14 text-lg',\n    }\n\n    const statusBorderClasses = {\n      default: 'border-border focus:border-primary',\n      error: 'border-error focus:border-error',\n      warning: 'border-warning focus:border-warning',\n      info: 'border-info focus:border-info',\n      success: 'border-success focus:border-success',\n    }\n\n    const statusTextClasses = {\n      default: 'text-text-secondary',\n      error: 'text-error',\n      warning: 'text-warning',\n      info: 'text-info',\n      success: 'text-success',\n    }\n\n    const MessageComponent = message && (\n      <p className={cn('text-xs mt-1', statusTextClasses[status])}>{message}</p>\n    )\n\n    return (\n      <div\n        ref={ref}\n        className={cn('w-full', className)}\n      >\n        {label && messagePosition === 'top' && (\n          <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n            {label}\n          </label>\n        )}\n        {messagePosition === 'top' && MessageComponent}\n\n        <div className=\"flex gap-2\">\n          {Array.from({ length }).map((_, index) => (\n            <input\n              key={index}\n              ref={(el) => {\n                inputRefs.current[index] = el\n              }}\n              type=\"text\"\n              inputMode={type === 'number' ? 'numeric' : 'text'}\n              maxLength={1}\n              value={otp[index] || ''}\n              onChange={(e) => handleChange(index, e.target.value)}\n              onKeyDown={(e) => handleKeyDown(index, e)}\n              onPaste={handlePaste}\n              disabled={disabled}\n              className={cn(\n                'text-center font-semibold',\n                'border rounded-md outline-none',\n                'disabled:opacity-50 disabled:cursor-not-allowed',\n                'text-text-primary',\n                sizeClasses[size],\n                statusBorderClasses[status],\n              )}\n              aria-label={`OTP digit ${index + 1}`}\n            />\n          ))}\n        </div>\n\n        {label && messagePosition === 'bottom' && (\n          <label className=\"block text-sm font-medium text-text-primary mt-1.5\">\n            {label}\n          </label>\n        )}\n        {messagePosition === 'bottom' && MessageComponent}\n      </div>\n    )\n  },\n)\n\nInputOTP.displayName = 'InputOTP'\n\nexport type * from './types'\nexport default InputOTP\n"]}

package/dist/chunk-ROR4E6IE.js

@@ -0,0 +1,119 @@
+import { cn } from './chunk-YNNAOXU5.js';
+import { cva } from 'class-variance-authority';
+import { InboxIcon } from 'lucide-react';
+import React from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var emptyContainerVariants = cva(
+  "flex flex-col items-center justify-center text-center",
+  {
+    variants: {
+      size: {
+        xs: "py-4 px-2",
+        sm: "py-6 px-4",
+        md: "py-12 px-6",
+        lg: "py-16 px-8"
+      }
+    },
+    defaultVariants: {
+      size: "md"
+    }
+  }
+);
+var emptyIconVariants = cva("text-text-muted mb-4", {
+  variants: {
+    size: {
+      xs: "w-8 h-8",
+      sm: "w-12 h-12",
+      md: "w-16 h-16",
+      lg: "w-24 h-24"
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+var emptyImageVariants = cva("mb-4 object-contain", {
+  variants: {
+    size: {
+      xs: "w-16 h-16",
+      sm: "w-24 h-24",
+      md: "w-32 h-32",
+      lg: "w-48 h-48"
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+var emptyTitleVariants = cva("font-semibold text-text-primary mb-2", {
+  variants: {
+    size: {
+      xs: "text-sm",
+      sm: "text-base",
+      md: "text-lg",
+      lg: "text-xl"
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+var emptyDescriptionVariants = cva("text-text-muted", {
+  variants: {
+    size: {
+      xs: "text-[10px] max-w-[200px]",
+      sm: "text-xs max-w-xs",
+      md: "text-sm max-w-sm",
+      lg: "text-base max-w-md"
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+var emptyActionsVariants = cva("mt-6 flex gap-2 flex-wrap justify-center", {
+  variants: {
+    size: {
+      xs: "mt-2",
+      sm: "mt-4",
+      md: "mt-6",
+      lg: "mt-8"
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+var Empty = React.memo(
+  ({
+    icon,
+    image,
+    imageAlt = "Empty",
+    title = "No Data",
+    description = "There is no data to display",
+    children,
+    size = "md",
+    className
+  }) => {
+    return /* @__PURE__ */ jsxs("div", { className: cn(emptyContainerVariants({ size }), className), children: [
+      image ? /* @__PURE__ */ jsx(
+        "img",
+        {
+          src: image,
+          alt: imageAlt,
+          className: emptyImageVariants({ size })
+        }
+      ) : /* @__PURE__ */ jsx("div", { className: emptyIconVariants({ size }), children: icon || /* @__PURE__ */ jsx(InboxIcon, { className: "size-full" }) }),
+      title && /* @__PURE__ */ jsx("h3", { className: emptyTitleVariants({ size }), children: title }),
+      description && /* @__PURE__ */ jsx("p", { className: emptyDescriptionVariants({ size }), children: description }),
+      children && /* @__PURE__ */ jsx("div", { className: emptyActionsVariants({ size }), children })
+    ] });
+  }
+);
+Empty.displayName = "Empty";
+var empty_default = Empty;
+
+export { empty_default };
+//# sourceMappingURL=chunk-ROR4E6IE.js.map
+//# sourceMappingURL=chunk-ROR4E6IE.js.map

package/dist/chunk-ROR4E6IE.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/empty/index.tsx"],"names":[],"mappings":"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","file":"chunk-ROR4E6IE.js","sourcesContent":["import { cva } from 'class-variance-authority'\nimport { InboxIcon } from 'lucide-react'\nimport React from 'react'\n\nimport { cn } from '../utils'\nimport type { EmptyProps } from './types'\n\nconst emptyContainerVariants = cva(\n  'flex flex-col items-center justify-center text-center',\n  {\n    variants: {\n      size: {\n        xs: 'py-4 px-2',\n        sm: 'py-6 px-4',\n        md: 'py-12 px-6',\n        lg: 'py-16 px-8',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n    },\n  },\n)\n\nconst emptyIconVariants = cva('text-text-muted mb-4', {\n  variants: {\n    size: {\n      xs: 'w-8 h-8',\n      sm: 'w-12 h-12',\n      md: 'w-16 h-16',\n      lg: 'w-24 h-24',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n})\n\nconst emptyImageVariants = cva('mb-4 object-contain', {\n  variants: {\n    size: {\n      xs: 'w-16 h-16',\n      sm: 'w-24 h-24',\n      md: 'w-32 h-32',\n      lg: 'w-48 h-48',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n})\n\nconst emptyTitleVariants = cva('font-semibold text-text-primary mb-2', {\n  variants: {\n    size: {\n      xs: 'text-sm',\n      sm: 'text-base',\n      md: 'text-lg',\n      lg: 'text-xl',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n})\n\nconst emptyDescriptionVariants = cva('text-text-muted', {\n  variants: {\n    size: {\n      xs: 'text-[10px] max-w-[200px]',\n      sm: 'text-xs max-w-xs',\n      md: 'text-sm max-w-sm',\n      lg: 'text-base max-w-md',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n})\n\nconst emptyActionsVariants = cva('mt-6 flex gap-2 flex-wrap justify-center', {\n  variants: {\n    size: {\n      xs: 'mt-2',\n      sm: 'mt-4',\n      md: 'mt-6',\n      lg: 'mt-8',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n})\n\nconst Empty = React.memo<EmptyProps>(\n  ({\n    icon,\n    image,\n    imageAlt = 'Empty',\n    title = 'No Data',\n    description = 'There is no data to display',\n    children,\n    size = 'md',\n    className,\n  }) => {\n    return (\n      <div className={cn(emptyContainerVariants({ size }), className)}>\n        {/* Image or Icon */}\n        {image ? (\n          <img\n            src={image}\n            alt={imageAlt}\n            className={emptyImageVariants({ size })}\n          />\n        ) : (\n          <div className={emptyIconVariants({ size })}>\n            {icon || <InboxIcon className=\"size-full\" />}\n          </div>\n        )}\n\n        {/* Title */}\n        {title && <h3 className={emptyTitleVariants({ size })}>{title}</h3>}\n\n        {/* Description */}\n        {description && (\n          <p className={emptyDescriptionVariants({ size })}>{description}</p>\n        )}\n\n        {/* Actions or Custom Content */}\n        {children && (\n          <div className={emptyActionsVariants({ size })}>{children}</div>\n        )}\n      </div>\n    )\n  },\n)\n\nEmpty.displayName = 'Empty'\n\nexport type * from './types'\nexport default Empty\n"]}

package/dist/chunk-RPAQAZTI.js

@@ -0,0 +1,54 @@
+import { cn } from './chunk-YNNAOXU5.js';
+import React from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var CheckboxGroup = React.memo(
+  ({
+    label,
+    helperText,
+    error,
+    orientation = "vertical",
+    className,
+    children,
+    ref,
+    ...props
+  }) => {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn("w-full", className),
+        ...props,
+        children: [
+          label && /* @__PURE__ */ jsx("div", { className: "mb-2", children: /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-text-secondary", children: label }) }),
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: cn(
+                "flex",
+                orientation === "vertical" ? "flex-col gap-2" : "flex-row flex-wrap gap-4"
+              ),
+              children
+            }
+          ),
+          (helperText || error) && /* @__PURE__ */ jsx(
+            "p",
+            {
+              className: cn(
+                "mt-2 text-xs",
+                error ? "text-error" : "text-text-secondary"
+              ),
+              children: error || helperText
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+CheckboxGroup.displayName = "CheckboxGroup";
+var checkbox_group_default = CheckboxGroup;
+
+export { checkbox_group_default };
+//# sourceMappingURL=chunk-RPAQAZTI.js.map
+//# sourceMappingURL=chunk-RPAQAZTI.js.map

package/dist/chunk-RPAQAZTI.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/checkbox-group/index.tsx"],"names":[],"mappings":";;;;AAKA,IAAM,gBAAgB,KAAA,CAAM,IAAA;AAAA,EAC1B,CAAC;AAAA,IACC,KAAA;AAAA,IACA,UAAA;AAAA,IACA,KAAA;AAAA,IACA,WAAA,GAAc,UAAA;AAAA,IACd,SAAA;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,SAAA,EAAW,EAAA,CAAG,QAAA,EAAU,SAAS,CAAA;AAAA,QAChC,GAAG,KAAA;AAAA,QAEH,QAAA,EAAA;AAAA,UAAA,KAAA,oBACC,GAAA,CAAC,SAAI,SAAA,EAAU,MAAA,EACb,8BAAC,MAAA,EAAA,EAAK,SAAA,EAAU,yCAAA,EACb,QAAA,EAAA,KAAA,EACH,CAAA,EACF,CAAA;AAAA,0BAEF,GAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,EAAA;AAAA,gBACT,MAAA;AAAA,gBACA,WAAA,KAAgB,aACZ,gBAAA,GACA;AAAA,eACN;AAAA,cAEC;AAAA;AAAA,WACH;AAAA,UAAA,CACE,cAAc,KAAA,qBACd,GAAA;AAAA,YAAC,GAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,EAAA;AAAA,gBACT,cAAA;AAAA,gBACA,QAAQ,YAAA,GAAe;AAAA,eACzB;AAAA,cAEC,QAAA,EAAA,KAAA,IAAS;AAAA;AAAA;AACZ;AAAA;AAAA,KAEJ;AAAA,EAEJ;AACF,CAAA;AAEA,aAAA,CAAc,WAAA,GAAc,eAAA;AAG5B,IAAO,sBAAA,GAAQ","file":"chunk-RPAQAZTI.js","sourcesContent":["import React from 'react'\n\nimport { cn } from '../utils'\nimport type { CheckboxGroupProps } from './types'\n\nconst CheckboxGroup = React.memo<CheckboxGroupProps>(\n  ({\n    label,\n    helperText,\n    error,\n    orientation = 'vertical',\n    className,\n    children,\n    ref,\n    ...props\n  }) => {\n    return (\n      <div\n        ref={ref}\n        className={cn('w-full', className)}\n        {...props}\n      >\n        {label && (\n          <div className=\"mb-2\">\n            <span className=\"text-sm font-medium text-text-secondary\">\n              {label}\n            </span>\n          </div>\n        )}\n        <div\n          className={cn(\n            'flex',\n            orientation === 'vertical'\n              ? 'flex-col gap-2'\n              : 'flex-row flex-wrap gap-4',\n          )}\n        >\n          {children}\n        </div>\n        {(helperText || error) && (\n          <p\n            className={cn(\n              'mt-2 text-xs',\n              error ? 'text-error' : 'text-text-secondary',\n            )}\n          >\n            {error || helperText}\n          </p>\n        )}\n      </div>\n    )\n  },\n)\n\nCheckboxGroup.displayName = 'CheckboxGroup'\n\nexport type * from './types'\nexport default CheckboxGroup\n"]}