@mieweb/ui 0.1.0

package/dist/chunk-QDGZBDBI.cjs

@@ -0,0 +1,99 @@
+'use strict';
+
+var chunkOR5DRJCW_cjs = require('./chunk-OR5DRJCW.cjs');
+var React = require('react');
+var classVarianceAuthority = require('class-variance-authority');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+var textVariants = classVarianceAuthority.cva("", {
+  variants: {
+    variant: {
+      default: "text-foreground",
+      muted: "text-muted-foreground",
+      primary: "text-primary-600 dark:text-primary-400",
+      destructive: "text-destructive",
+      success: "text-success",
+      warning: "text-warning"
+    },
+    size: {
+      xs: "text-xs",
+      sm: "text-sm",
+      base: "text-base",
+      lg: "text-lg",
+      xl: "text-xl",
+      "2xl": "text-2xl",
+      "3xl": "text-3xl"
+    },
+    weight: {
+      normal: "font-normal",
+      medium: "font-medium",
+      semibold: "font-semibold",
+      bold: "font-bold"
+    },
+    align: {
+      left: "text-left",
+      center: "text-center",
+      right: "text-right"
+    }
+  },
+  defaultVariants: {
+    variant: "default",
+    size: "base",
+    weight: "normal",
+    align: "left"
+  }
+});
+var Text = React__namespace.forwardRef(
+  ({
+    className,
+    variant,
+    size,
+    weight,
+    align,
+    as: Component = "p",
+    truncate,
+    ...props
+  }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      Component,
+      {
+        ref,
+        className: chunkOR5DRJCW_cjs.cn(
+          textVariants({ variant, size, weight, align }),
+          truncate && "truncate",
+          className
+        ),
+        ...props
+      }
+    );
+  }
+);
+Text.displayName = "Text";
+var SmallMuted = React__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(Text, { ref, variant: "muted", size: "sm", className, ...props }));
+SmallMuted.displayName = "SmallMuted";
+
+exports.SmallMuted = SmallMuted;
+exports.Text = Text;
+exports.textVariants = textVariants;
+//# sourceMappingURL=chunk-QDGZBDBI.cjs.map
+//# sourceMappingURL=chunk-QDGZBDBI.cjs.map

package/dist/chunk-QDGZBDBI.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Text/Text.tsx"],"names":["cva","React","jsx","cn"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA,IAAM,YAAA,GAAeA,2BAAI,EAAA,EAAI;AAAA,EAC3B,QAAA,EAAU;AAAA,IACR,OAAA,EAAS;AAAA,MACP,OAAA,EAAS,iBAAA;AAAA,MACT,KAAA,EAAO,uBAAA;AAAA,MACP,OAAA,EAAS,wCAAA;AAAA,MACT,WAAA,EAAa,kBAAA;AAAA,MACb,OAAA,EAAS,cAAA;AAAA,MACT,OAAA,EAAS;AAAA,KACX;AAAA,IACA,IAAA,EAAM;AAAA,MACJ,EAAA,EAAI,SAAA;AAAA,MACJ,EAAA,EAAI,SAAA;AAAA,MACJ,IAAA,EAAM,WAAA;AAAA,MACN,EAAA,EAAI,SAAA;AAAA,MACJ,EAAA,EAAI,SAAA;AAAA,MACJ,KAAA,EAAO,UAAA;AAAA,MACP,KAAA,EAAO;AAAA,KACT;AAAA,IACA,MAAA,EAAQ;AAAA,MACN,MAAA,EAAQ,aAAA;AAAA,MACR,MAAA,EAAQ,aAAA;AAAA,MACR,QAAA,EAAU,eAAA;AAAA,MACV,IAAA,EAAM;AAAA,KACR;AAAA,IACA,KAAA,EAAO;AAAA,MACL,IAAA,EAAM,WAAA;AAAA,MACN,MAAA,EAAQ,aAAA;AAAA,MACR,KAAA,EAAO;AAAA;AACT,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,OAAA,EAAS,SAAA;AAAA,IACT,IAAA,EAAM,MAAA;AAAA,IACN,MAAA,EAAQ,QAAA;AAAA,IACR,KAAA,EAAO;AAAA;AAEX,CAAC;AAgCD,IAAM,IAAA,GAAaC,gBAAA,CAAA,UAAA;AAAA,EACjB,CACE;AAAA,IACE,SAAA;AAAA,IACA,OAAA;AAAA,IACA,IAAA;AAAA,IACA,MAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAI,SAAA,GAAY,GAAA;AAAA,IAChB,QAAA;AAAA,IACA,GAAG;AAAA,KAEL,GAAA,KACG;AACH,IAAA,uBACEC,cAAA;AAAA,MAAC,SAAA;AAAA,MAAA;AAAA,QAEC,GAAA;AAAA,QACA,SAAA,EAAWC,oBAAA;AAAA,UACT,aAAa,EAAE,OAAA,EAAS,IAAA,EAAM,MAAA,EAAQ,OAAO,CAAA;AAAA,UAC7C,QAAA,IAAY,UAAA;AAAA,UACZ;AAAA,SACF;AAAA,QACC,GAAG;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;AAEA,IAAA,CAAK,WAAA,GAAc,MAAA;AAMnB,IAAM,aAAmBF,gBAAA,CAAA,UAAA,CAGvB,CAAC,EAAE,SAAA,EAAW,GAAG,OAAM,EAAG,GAAA,oCACzB,IAAA,EAAA,EAAK,GAAA,EAAU,SAAQ,OAAA,EAAQ,IAAA,EAAK,MAAK,SAAA,EAAuB,GAAG,OAAO,CAC5E;AAED,UAAA,CAAW,WAAA,GAAc,YAAA","file":"chunk-QDGZBDBI.cjs","sourcesContent":["import * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\n\nconst textVariants = cva('', {\n  variants: {\n    variant: {\n      default: 'text-foreground',\n      muted: 'text-muted-foreground',\n      primary: 'text-primary-600 dark:text-primary-400',\n      destructive: 'text-destructive',\n      success: 'text-success',\n      warning: 'text-warning',\n    },\n    size: {\n      xs: 'text-xs',\n      sm: 'text-sm',\n      base: 'text-base',\n      lg: 'text-lg',\n      xl: 'text-xl',\n      '2xl': 'text-2xl',\n      '3xl': 'text-3xl',\n    },\n    weight: {\n      normal: 'font-normal',\n      medium: 'font-medium',\n      semibold: 'font-semibold',\n      bold: 'font-bold',\n    },\n    align: {\n      left: 'text-left',\n      center: 'text-center',\n      right: 'text-right',\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n    size: 'base',\n    weight: 'normal',\n    align: 'left',\n  },\n});\n\ntype TextElement =\n  | 'p'\n  | 'span'\n  | 'div'\n  | 'label'\n  | 'h1'\n  | 'h2'\n  | 'h3'\n  | 'h4'\n  | 'h5'\n  | 'h6';\n\nexport interface TextProps\n  extends React.HTMLAttributes<HTMLElement>, VariantProps<typeof textVariants> {\n  /** HTML element to render as */\n  as?: TextElement;\n  /** Truncate text with ellipsis */\n  truncate?: boolean;\n}\n\n/**\n * A flexible text component for consistent typography.\n *\n * @example\n * ```tsx\n * <Text variant=\"muted\" size=\"sm\">Helper text</Text>\n * <Text as=\"h1\" size=\"3xl\" weight=\"bold\">Page Title</Text>\n * <Text variant=\"destructive\">Error message</Text>\n * ```\n */\nconst Text = React.forwardRef<HTMLElement, TextProps>(\n  (\n    {\n      className,\n      variant,\n      size,\n      weight,\n      align,\n      as: Component = 'p',\n      truncate,\n      ...props\n    },\n    ref\n  ) => {\n    return (\n      <Component\n        // @ts-expect-error - ref type is complex due to polymorphic component\n        ref={ref}\n        className={cn(\n          textVariants({ variant, size, weight, align }),\n          truncate && 'truncate',\n          className\n        )}\n        {...props}\n      />\n    );\n  }\n);\n\nText.displayName = 'Text';\n\n/**\n * Small muted text, useful for helper text and descriptions.\n * This is a convenience component equivalent to <Text variant=\"muted\" size=\"sm\">\n */\nconst SmallMuted = React.forwardRef<\n  HTMLElement,\n  Omit<TextProps, 'variant' | 'size'>\n>(({ className, ...props }, ref) => (\n  <Text ref={ref} variant=\"muted\" size=\"sm\" className={className} {...props} />\n));\n\nSmallMuted.displayName = 'SmallMuted';\n\nexport { Text, SmallMuted, textVariants };\n"]}

package/dist/chunk-QL2YTVTR.js

@@ -0,0 +1,163 @@
+import { cn } from './chunk-F3SOEIN2.js';
+import * as React from 'react';
+import { cva } from 'class-variance-authority';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var switchTrackVariants = cva(
+  [
+    "relative inline-flex shrink-0",
+    "cursor-pointer rounded-full",
+    "transition-colors duration-200 ease-in-out",
+    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+    "disabled:cursor-not-allowed disabled:opacity-50",
+    "bg-neutral-200 dark:bg-neutral-700",
+    "data-[state=checked]:bg-primary-500"
+  ],
+  {
+    variants: {
+      size: {
+        sm: "h-5 w-9",
+        md: "h-6 w-11",
+        lg: "h-7 w-14"
+      }
+    },
+    defaultVariants: {
+      size: "md"
+    }
+  }
+);
+var switchThumbVariants = cva(
+  [
+    "pointer-events-none inline-block rounded-full",
+    "bg-white shadow-lg",
+    "ring-0 transition-transform duration-200 ease-in-out"
+  ],
+  {
+    variants: {
+      size: {
+        sm: "h-4 w-4 data-[state=checked]:translate-x-4 translate-x-0.5",
+        md: "h-5 w-5 data-[state=checked]:translate-x-5 translate-x-0.5",
+        lg: "h-6 w-6 data-[state=checked]:translate-x-7 translate-x-0.5"
+      }
+    },
+    defaultVariants: {
+      size: "md"
+    }
+  }
+);
+var Switch = React.forwardRef(
+  ({
+    className,
+    size,
+    checked: controlledChecked,
+    defaultChecked = false,
+    onCheckedChange,
+    label,
+    description,
+    labelPosition = "right",
+    disabled,
+    id,
+    ...props
+  }, ref) => {
+    const [uncontrolledChecked, setUncontrolledChecked] = React.useState(defaultChecked);
+    const generatedId = React.useId();
+    const switchId = id || generatedId;
+    const descriptionId = `${switchId}-description`;
+    const isControlled = controlledChecked !== void 0;
+    const isChecked = isControlled ? controlledChecked : uncontrolledChecked;
+    const handleToggle = React.useCallback(() => {
+      if (disabled) return;
+      const newValue = !isChecked;
+      if (!isControlled) {
+        setUncontrolledChecked(newValue);
+      }
+      onCheckedChange?.(newValue);
+    }, [disabled, isChecked, isControlled, onCheckedChange]);
+    const handleKeyDown = React.useCallback(
+      (e) => {
+        if (e.key === "Enter" || e.key === " ") {
+          e.preventDefault();
+          handleToggle();
+        }
+      },
+      [handleToggle]
+    );
+    const switchElement = /* @__PURE__ */ jsx(
+      "button",
+      {
+        ref,
+        id: switchId,
+        type: "button",
+        role: "switch",
+        "aria-checked": isChecked,
+        "aria-describedby": description ? descriptionId : void 0,
+        "data-state": isChecked ? "checked" : "unchecked",
+        disabled,
+        onClick: handleToggle,
+        onKeyDown: handleKeyDown,
+        className: cn(switchTrackVariants({ size }), "items-center", className),
+        ...props,
+        children: /* @__PURE__ */ jsx(
+          "span",
+          {
+            "data-state": isChecked ? "checked" : "unchecked",
+            className: switchThumbVariants({ size })
+          }
+        )
+      }
+    );
+    const labelSizeClasses = {
+      sm: "text-xs",
+      md: "text-sm",
+      lg: "text-base"
+    };
+    const descriptionSizeClasses = {
+      sm: "text-[10px]",
+      md: "text-xs",
+      lg: "text-sm"
+    };
+    const labelElement = label && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-0.5", children: [
+      /* @__PURE__ */ jsx(
+        "label",
+        {
+          htmlFor: switchId,
+          className: cn(
+            "text-foreground cursor-pointer font-medium select-none",
+            labelSizeClasses[size || "md"],
+            disabled && "cursor-not-allowed opacity-50"
+          ),
+          children: label
+        }
+      ),
+      description && /* @__PURE__ */ jsx(
+        "p",
+        {
+          id: descriptionId,
+          className: cn(
+            "text-muted-foreground",
+            descriptionSizeClasses[size || "md"]
+          ),
+          children: description
+        }
+      )
+    ] });
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: cn(
+          "flex items-center gap-3",
+          labelPosition === "left" && "flex-row-reverse"
+        ),
+        children: [
+          switchElement,
+          labelElement
+        ]
+      }
+    );
+  }
+);
+Switch.displayName = "Switch";
+
+export { Switch, switchThumbVariants, switchTrackVariants };
+//# sourceMappingURL=chunk-QL2YTVTR.js.map
+//# sourceMappingURL=chunk-QL2YTVTR.js.map

package/dist/chunk-QL2YTVTR.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Switch/Switch.tsx"],"names":[],"mappings":"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","file":"chunk-QL2YTVTR.js","sourcesContent":["import * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\n\nconst switchTrackVariants = cva(\n  [\n    'relative inline-flex shrink-0',\n    'cursor-pointer rounded-full',\n    'transition-colors duration-200 ease-in-out',\n    'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',\n    'disabled:cursor-not-allowed disabled:opacity-50',\n    'bg-neutral-200 dark:bg-neutral-700',\n    'data-[state=checked]:bg-primary-500',\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'h-5 w-9',\n        md: 'h-6 w-11',\n        lg: 'h-7 w-14',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n    },\n  }\n);\n\nconst switchThumbVariants = cva(\n  [\n    'pointer-events-none inline-block rounded-full',\n    'bg-white shadow-lg',\n    'ring-0 transition-transform duration-200 ease-in-out',\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'h-4 w-4 data-[state=checked]:translate-x-4 translate-x-0.5',\n        md: 'h-5 w-5 data-[state=checked]:translate-x-5 translate-x-0.5',\n        lg: 'h-6 w-6 data-[state=checked]:translate-x-7 translate-x-0.5',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n    },\n  }\n);\n\nexport interface SwitchProps\n  extends\n    Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'onChange'>,\n    VariantProps<typeof switchTrackVariants> {\n  /** Controlled checked state */\n  checked?: boolean;\n  /** Default checked state (uncontrolled) */\n  defaultChecked?: boolean;\n  /** Callback when checked state changes */\n  onCheckedChange?: (checked: boolean) => void;\n  /** Label for the switch */\n  label?: string;\n  /** Description text */\n  description?: string;\n  /** Position of the label */\n  labelPosition?: 'left' | 'right';\n  /** ID for the switch */\n  id?: string;\n}\n\n/**\n * An accessible toggle switch component.\n *\n * @example\n * ```tsx\n * <Switch label=\"Enable notifications\" />\n * <Switch\n *   label=\"Dark mode\"\n *   description=\"Toggle between light and dark theme\"\n * />\n * ```\n */\nconst Switch = React.forwardRef<HTMLButtonElement, SwitchProps>(\n  (\n    {\n      className,\n      size,\n      checked: controlledChecked,\n      defaultChecked = false,\n      onCheckedChange,\n      label,\n      description,\n      labelPosition = 'right',\n      disabled,\n      id,\n      ...props\n    },\n    ref\n  ) => {\n    const [uncontrolledChecked, setUncontrolledChecked] =\n      React.useState(defaultChecked);\n\n    const generatedId = React.useId();\n    const switchId = id || generatedId;\n    const descriptionId = `${switchId}-description`;\n\n    const isControlled = controlledChecked !== undefined;\n    const isChecked = isControlled ? controlledChecked : uncontrolledChecked;\n\n    const handleToggle = React.useCallback(() => {\n      if (disabled) return;\n\n      const newValue = !isChecked;\n      if (!isControlled) {\n        setUncontrolledChecked(newValue);\n      }\n      onCheckedChange?.(newValue);\n    }, [disabled, isChecked, isControlled, onCheckedChange]);\n\n    const handleKeyDown = React.useCallback(\n      (e: React.KeyboardEvent<HTMLButtonElement>) => {\n        if (e.key === 'Enter' || e.key === ' ') {\n          e.preventDefault();\n          handleToggle();\n        }\n      },\n      [handleToggle]\n    );\n\n    const switchElement = (\n      <button\n        ref={ref}\n        id={switchId}\n        type=\"button\"\n        role=\"switch\"\n        aria-checked={isChecked}\n        aria-describedby={description ? descriptionId : undefined}\n        data-state={isChecked ? 'checked' : 'unchecked'}\n        disabled={disabled}\n        onClick={handleToggle}\n        onKeyDown={handleKeyDown}\n        className={cn(switchTrackVariants({ size }), 'items-center', className)}\n        {...props}\n      >\n        <span\n          data-state={isChecked ? 'checked' : 'unchecked'}\n          className={switchThumbVariants({ size })}\n        />\n      </button>\n    );\n\n    const labelSizeClasses = {\n      sm: 'text-xs',\n      md: 'text-sm',\n      lg: 'text-base',\n    };\n\n    const descriptionSizeClasses = {\n      sm: 'text-[10px]',\n      md: 'text-xs',\n      lg: 'text-sm',\n    };\n\n    const labelElement = label && (\n      <div className=\"flex flex-col gap-0.5\">\n        <label\n          htmlFor={switchId}\n          className={cn(\n            'text-foreground cursor-pointer font-medium select-none',\n            labelSizeClasses[size || 'md'],\n            disabled && 'cursor-not-allowed opacity-50'\n          )}\n        >\n          {label}\n        </label>\n        {description && (\n          <p\n            id={descriptionId}\n            className={cn(\n              'text-muted-foreground',\n              descriptionSizeClasses[size || 'md']\n            )}\n          >\n            {description}\n          </p>\n        )}\n      </div>\n    );\n\n    return (\n      <div\n        className={cn(\n          'flex items-center gap-3',\n          labelPosition === 'left' && 'flex-row-reverse'\n        )}\n      >\n        {switchElement}\n        {labelElement}\n      </div>\n    );\n  }\n);\n\nSwitch.displayName = 'Switch';\n\nexport { Switch, switchTrackVariants, switchThumbVariants };\n"]}

package/dist/chunk-QYJ7RQJ2.cjs

@@ -0,0 +1,239 @@
+'use strict';
+
+var chunkOR5DRJCW_cjs = require('./chunk-OR5DRJCW.cjs');
+var React = require('react');
+var classVarianceAuthority = require('class-variance-authority');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+var checkboxVariants = classVarianceAuthority.cva(
+  [
+    "shrink-0 appearance-none",
+    "border-2 border-input rounded",
+    "bg-background",
+    "transition-all duration-150",
+    "cursor-pointer",
+    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+    "disabled:cursor-not-allowed disabled:opacity-50",
+    "checked:bg-primary-500 checked:border-primary-500",
+    "indeterminate:bg-primary-500 indeterminate:border-primary-500"
+  ],
+  {
+    variants: {
+      size: {
+        sm: "h-4 w-4",
+        md: "h-5 w-5",
+        lg: "h-6 w-6"
+      }
+    },
+    defaultVariants: {
+      size: "md"
+    }
+  }
+);
+var Checkbox = React__namespace.forwardRef(
+  ({
+    className,
+    size,
+    label,
+    description,
+    indeterminate = false,
+    error,
+    labelPosition = "right",
+    id,
+    disabled,
+    ...props
+  }, ref) => {
+    const internalRef = React__namespace.useRef(null);
+    const generatedId = React__namespace.useId();
+    const checkboxId = id || generatedId;
+    const descriptionId = `${checkboxId}-description`;
+    const errorId = `${checkboxId}-error`;
+    React__namespace.useEffect(() => {
+      const checkbox = internalRef.current;
+      if (checkbox) {
+        checkbox.indeterminate = indeterminate;
+      }
+    }, [indeterminate]);
+    React__namespace.useImperativeHandle(ref, () => internalRef.current);
+    const checkboxElement = /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "relative inline-flex items-center justify-center", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "input",
+        {
+          ref: internalRef,
+          id: checkboxId,
+          type: "checkbox",
+          disabled,
+          "aria-describedby": [description ? descriptionId : null, error ? errorId : null].filter(Boolean).join(" ") || void 0,
+          "aria-invalid": !!error,
+          className: chunkOR5DRJCW_cjs.cn("peer", checkboxVariants({ size }), className),
+          ...props
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        CheckIcon,
+        {
+          size,
+          className: "pointer-events-none absolute text-white opacity-0 transition-opacity peer-checked:opacity-100"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        MinusIcon,
+        {
+          size,
+          className: "pointer-events-none absolute text-white opacity-0 transition-opacity peer-indeterminate:opacity-100"
+        }
+      )
+    ] });
+    const labelElement = label && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "label",
+        {
+          htmlFor: checkboxId,
+          className: chunkOR5DRJCW_cjs.cn(
+            "text-foreground cursor-pointer text-sm font-medium select-none",
+            disabled && "cursor-not-allowed opacity-50"
+          ),
+          children: label
+        }
+      ),
+      description && /* @__PURE__ */ jsxRuntime.jsx(
+        "p",
+        {
+          id: descriptionId,
+          className: "text-muted-foreground mt-0.5 text-xs",
+          children: description
+        }
+      )
+    ] });
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          className: chunkOR5DRJCW_cjs.cn(
+            "flex gap-2",
+            description ? "items-start" : "items-center",
+            labelPosition === "left" && "flex-row-reverse"
+          ),
+          children: [
+            checkboxElement,
+            labelElement
+          ]
+        }
+      ),
+      error && /* @__PURE__ */ jsxRuntime.jsx("p", { id: errorId, className: "text-destructive text-sm", role: "alert", children: error })
+    ] });
+  }
+);
+Checkbox.displayName = "Checkbox";
+function CheckboxGroup({
+  label,
+  description,
+  error,
+  orientation = "vertical",
+  children,
+  className
+}) {
+  const groupId = React__namespace.useId();
+  const descriptionId = `${groupId}-description`;
+  const errorId = `${groupId}-error`;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "fieldset",
+    {
+      className: chunkOR5DRJCW_cjs.cn("flex flex-col", className),
+      "aria-describedby": [description ? descriptionId : null, error ? errorId : null].filter(Boolean).join(" ") || void 0,
+      children: [
+        label && /* @__PURE__ */ jsxRuntime.jsx("legend", { className: "text-foreground mb-1 text-sm font-medium", children: label }),
+        description && /* @__PURE__ */ jsxRuntime.jsx("p", { id: descriptionId, className: "text-muted-foreground mb-3 text-xs", children: description }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            role: "group",
+            className: chunkOR5DRJCW_cjs.cn(
+              "flex gap-4",
+              orientation === "vertical" && "flex-col gap-2"
+            ),
+            children
+          }
+        ),
+        error && /* @__PURE__ */ jsxRuntime.jsx("p", { id: errorId, className: "text-destructive mt-2 text-sm", role: "alert", children: error })
+      ]
+    }
+  );
+}
+CheckboxGroup.displayName = "CheckboxGroup";
+function CheckIcon({ size, className }) {
+  const sizeMap = {
+    sm: 10,
+    md: 12,
+    lg: 14
+  };
+  const iconSize = sizeMap[size || "md"];
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: iconSize,
+      height: iconSize,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "3",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className,
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M20 6 9 17l-5-5" })
+    }
+  );
+}
+function MinusIcon({ size, className }) {
+  const sizeMap = {
+    sm: 10,
+    md: 12,
+    lg: 14
+  };
+  const iconSize = sizeMap[size || "md"];
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: iconSize,
+      height: iconSize,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "3",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className,
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M5 12h14" })
+    }
+  );
+}
+
+exports.Checkbox = Checkbox;
+exports.CheckboxGroup = CheckboxGroup;
+exports.checkboxVariants = checkboxVariants;
+//# sourceMappingURL=chunk-QYJ7RQJ2.cjs.map
+//# sourceMappingURL=chunk-QYJ7RQJ2.cjs.map

package/dist/chunk-QYJ7RQJ2.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Checkbox/Checkbox.tsx"],"names":["cva","React","jsxs","jsx","cn"],"mappings":"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","file":"chunk-QYJ7RQJ2.cjs","sourcesContent":["import * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\n\nconst checkboxVariants = cva(\n  [\n    'shrink-0 appearance-none',\n    'border-2 border-input rounded',\n    'bg-background',\n    'transition-all duration-150',\n    'cursor-pointer',\n    'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',\n    'disabled:cursor-not-allowed disabled:opacity-50',\n    'checked:bg-primary-500 checked:border-primary-500',\n    'indeterminate:bg-primary-500 indeterminate:border-primary-500',\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'h-4 w-4',\n        md: 'h-5 w-5',\n        lg: 'h-6 w-6',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n    },\n  }\n);\n\nexport interface CheckboxProps\n  extends\n    Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'type'>,\n    VariantProps<typeof checkboxVariants> {\n  /** Label for the checkbox */\n  label?: string;\n  /** Description text below the label */\n  description?: string;\n  /** Indeterminate state (neither checked nor unchecked) */\n  indeterminate?: boolean;\n  /** Error message */\n  error?: string;\n  /** Position of the label */\n  labelPosition?: 'left' | 'right';\n}\n\n/**\n * An accessible checkbox component with support for indeterminate state.\n *\n * @example\n * ```tsx\n * <Checkbox label=\"Accept terms and conditions\" />\n * <Checkbox label=\"Newsletter\" description=\"Receive updates about new features\" />\n * <Checkbox indeterminate label=\"Select all\" />\n * ```\n */\nconst Checkbox = React.forwardRef<HTMLInputElement, CheckboxProps>(\n  (\n    {\n      className,\n      size,\n      label,\n      description,\n      indeterminate = false,\n      error,\n      labelPosition = 'right',\n      id,\n      disabled,\n      ...props\n    },\n    ref\n  ) => {\n    const internalRef = React.useRef<HTMLInputElement>(null);\n    const generatedId = React.useId();\n    const checkboxId = id || generatedId;\n    const descriptionId = `${checkboxId}-description`;\n    const errorId = `${checkboxId}-error`;\n\n    // Handle indeterminate state\n    React.useEffect(() => {\n      const checkbox = internalRef.current;\n      if (checkbox) {\n        checkbox.indeterminate = indeterminate;\n      }\n    }, [indeterminate]);\n\n    // Combine refs\n    React.useImperativeHandle(ref, () => internalRef.current!);\n\n    const checkboxElement = (\n      <span className=\"relative inline-flex items-center justify-center\">\n        <input\n          ref={internalRef}\n          id={checkboxId}\n          type=\"checkbox\"\n          disabled={disabled}\n          aria-describedby={\n            [description ? descriptionId : null, error ? errorId : null]\n              .filter(Boolean)\n              .join(' ') || undefined\n          }\n          aria-invalid={!!error}\n          className={cn('peer', checkboxVariants({ size }), className)}\n          {...props}\n        />\n        {/* Custom check icon overlay */}\n        <CheckIcon\n          size={size}\n          className=\"pointer-events-none absolute text-white opacity-0 transition-opacity peer-checked:opacity-100\"\n        />\n        {/* Custom indeterminate icon overlay */}\n        <MinusIcon\n          size={size}\n          className=\"pointer-events-none absolute text-white opacity-0 transition-opacity peer-indeterminate:opacity-100\"\n        />\n      </span>\n    );\n\n    const labelElement = label && (\n      <div className=\"flex flex-col\">\n        <label\n          htmlFor={checkboxId}\n          className={cn(\n            'text-foreground cursor-pointer text-sm font-medium select-none',\n            disabled && 'cursor-not-allowed opacity-50'\n          )}\n        >\n          {label}\n        </label>\n        {description && (\n          <p\n            id={descriptionId}\n            className=\"text-muted-foreground mt-0.5 text-xs\"\n          >\n            {description}\n          </p>\n        )}\n      </div>\n    );\n\n    return (\n      <div className=\"flex flex-col gap-1\">\n        <div\n          className={cn(\n            'flex gap-2',\n            description ? 'items-start' : 'items-center',\n            labelPosition === 'left' && 'flex-row-reverse'\n          )}\n        >\n          {checkboxElement}\n          {labelElement}\n        </div>\n        {error && (\n          <p id={errorId} className=\"text-destructive text-sm\" role=\"alert\">\n            {error}\n          </p>\n        )}\n      </div>\n    );\n  }\n);\n\nCheckbox.displayName = 'Checkbox';\n\n// ============================================================================\n// Checkbox Group\n// ============================================================================\n\nexport interface CheckboxGroupProps {\n  /** Group label */\n  label?: string;\n  /** Description for the group */\n  description?: string;\n  /** Error message for the group */\n  error?: string;\n  /** Orientation of checkboxes */\n  orientation?: 'horizontal' | 'vertical';\n  /** Children checkboxes */\n  children: React.ReactNode;\n  /** Additional class name */\n  className?: string;\n}\n\n/**\n * A container for grouping related checkboxes.\n *\n * @example\n * ```tsx\n * <CheckboxGroup label=\"Interests\" orientation=\"vertical\">\n *   <Checkbox label=\"Sports\" />\n *   <Checkbox label=\"Music\" />\n *   <Checkbox label=\"Travel\" />\n * </CheckboxGroup>\n * ```\n */\nfunction CheckboxGroup({\n  label,\n  description,\n  error,\n  orientation = 'vertical',\n  children,\n  className,\n}: CheckboxGroupProps) {\n  const groupId = React.useId();\n  const descriptionId = `${groupId}-description`;\n  const errorId = `${groupId}-error`;\n\n  return (\n    <fieldset\n      className={cn('flex flex-col', className)}\n      aria-describedby={\n        [description ? descriptionId : null, error ? errorId : null]\n          .filter(Boolean)\n          .join(' ') || undefined\n      }\n    >\n      {label && (\n        <legend className=\"text-foreground mb-1 text-sm font-medium\">\n          {label}\n        </legend>\n      )}\n      {description && (\n        <p id={descriptionId} className=\"text-muted-foreground mb-3 text-xs\">\n          {description}\n        </p>\n      )}\n      <div\n        role=\"group\"\n        className={cn(\n          'flex gap-4',\n          orientation === 'vertical' && 'flex-col gap-2'\n        )}\n      >\n        {children}\n      </div>\n      {error && (\n        <p id={errorId} className=\"text-destructive mt-2 text-sm\" role=\"alert\">\n          {error}\n        </p>\n      )}\n    </fieldset>\n  );\n}\n\nCheckboxGroup.displayName = 'CheckboxGroup';\n\n// ============================================================================\n// Check Icon\n// ============================================================================\n\ninterface CheckIconProps {\n  size?: 'sm' | 'md' | 'lg' | null;\n  className?: string;\n}\n\nfunction CheckIcon({ size, className }: CheckIconProps) {\n  const sizeMap = {\n    sm: 10,\n    md: 12,\n    lg: 14,\n  };\n  const iconSize = sizeMap[size || 'md'];\n\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width={iconSize}\n      height={iconSize}\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"3\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      className={className}\n      aria-hidden=\"true\"\n    >\n      <path d=\"M20 6 9 17l-5-5\" />\n    </svg>\n  );\n}\n\nfunction MinusIcon({ size, className }: CheckIconProps) {\n  const sizeMap = {\n    sm: 10,\n    md: 12,\n    lg: 14,\n  };\n  const iconSize = sizeMap[size || 'md'];\n\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width={iconSize}\n      height={iconSize}\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"3\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      className={className}\n      aria-hidden=\"true\"\n    >\n      <path d=\"M5 12h14\" />\n    </svg>\n  );\n}\n\nexport { Checkbox, CheckboxGroup, checkboxVariants };\n"]}