@7onic-ui/react 0.3.9 → 0.3.10

package/dist/chunk-DJAEXCRU.mjs

@@ -0,0 +1,190 @@
+"use client";
+import {
+  cn
+} from "./chunk-53MIUPSY.mjs";
+
+// src/components/ui/alert.tsx
+import * as React from "react";
+import { cva } from "class-variance-authority";
+var InfoIcon = ({ className }) => /* @__PURE__ */ React.createElement("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true" }, /* @__PURE__ */ React.createElement("circle", { cx: "12", cy: "12", r: "10" }), /* @__PURE__ */ React.createElement("path", { d: "M12 16v-4" }), /* @__PURE__ */ React.createElement("path", { d: "M12 8h.01" }));
+var SuccessIcon = ({ className }) => /* @__PURE__ */ React.createElement("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true" }, /* @__PURE__ */ React.createElement("circle", { cx: "12", cy: "12", r: "10" }), /* @__PURE__ */ React.createElement("path", { d: "m9 12 2 2 4-4" }));
+var WarningIcon = ({ className }) => /* @__PURE__ */ React.createElement("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true" }, /* @__PURE__ */ React.createElement("path", { d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }), /* @__PURE__ */ React.createElement("path", { d: "M12 9v4" }), /* @__PURE__ */ React.createElement("path", { d: "M12 17h.01" }));
+var ErrorIcon = ({ className }) => /* @__PURE__ */ React.createElement("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true" }, /* @__PURE__ */ React.createElement("circle", { cx: "12", cy: "12", r: "10" }), /* @__PURE__ */ React.createElement("path", { d: "M12 8v5" }), /* @__PURE__ */ React.createElement("path", { d: "M12 16h.01" }));
+var DefaultCloseIcon = ({ className }) => /* @__PURE__ */ React.createElement("svg", { className, fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2, "aria-hidden": "true" }, /* @__PURE__ */ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 18L18 6M6 6l12 12" }));
+var STATUS_ICONS = {
+  info: InfoIcon,
+  success: SuccessIcon,
+  warning: WarningIcon,
+  error: ErrorIcon
+};
+var colorMap = {
+  info: {
+    default: "bg-info-tint text-text-info border-info/20",
+    outline: "bg-transparent text-text-info border-info",
+    filled: "bg-info text-info-foreground border-transparent"
+  },
+  success: {
+    default: "bg-success-tint text-text-success border-success/20",
+    outline: "bg-transparent text-text-success border-success",
+    filled: "bg-success text-success-foreground border-transparent"
+  },
+  warning: {
+    default: "bg-warning-tint text-text-warning border-warning/20",
+    outline: "bg-transparent text-text-warning border-warning",
+    filled: "bg-warning text-warning-foreground border-transparent"
+  },
+  error: {
+    default: "bg-error-tint text-text-error border-error/20",
+    outline: "bg-transparent text-text-error border-error",
+    filled: "bg-error text-error-foreground border-transparent"
+  }
+};
+var alertVariants = cva(
+  "group relative flex items-center border w-full [&:has([data-alert-description])]:items-start",
+  {
+    variants: {
+      size: {
+        sm: "gap-2 p-2.5 text-sm",
+        default: "gap-2.5 p-3.5 text-md",
+        lg: "gap-3 p-4 text-md"
+      },
+      radius: {
+        none: "rounded-none",
+        sm: "rounded-sm",
+        base: "rounded",
+        md: "rounded-md",
+        lg: "rounded-lg",
+        xl: "rounded-xl",
+        "2xl": "rounded-2xl",
+        "3xl": "rounded-3xl",
+        full: "rounded-full"
+      }
+    },
+    defaultVariants: {
+      size: "default",
+      radius: "lg"
+    }
+  }
+);
+var ICON_SIZE_MAP = {
+  sm: "icon-sm",
+  // 16px
+  default: "w-[18px] h-[18px]",
+  // 18px — TOKEN-EXCEPTION: no 18px icon token
+  lg: "icon-md"
+  // 20px
+};
+var ICON_LINE_MAP = {
+  sm: "text-sm",
+  default: "text-md",
+  lg: "text-base"
+};
+var TITLE_SIZE_MAP = {
+  sm: "text-sm font-semibold tracking-tight",
+  default: "text-md font-semibold tracking-tight",
+  lg: "text-base font-semibold tracking-tight"
+};
+var DESC_SIZE_MAP = {
+  sm: "text-xs mt-0.5",
+  default: "text-sm mt-0.5",
+  lg: "text-md mt-0.5"
+};
+var AlertContext = React.createContext({
+  variant: "default",
+  color: "info",
+  size: "default"
+});
+function useAlertContext() {
+  return React.useContext(AlertContext);
+}
+var Alert = React.forwardRef(
+  ({
+    className,
+    variant = "default",
+    color = "info",
+    size = "default",
+    radius,
+    closable = false,
+    onClose,
+    closeIcon,
+    icon,
+    hideIcon = false,
+    children,
+    ...props
+  }, ref) => {
+    const role = color === "error" ? "alert" : "status";
+    const colorClasses = colorMap[color][variant];
+    const StatusIcon = STATUS_ICONS[color];
+    return /* @__PURE__ */ React.createElement(AlertContext.Provider, { value: { variant, color, size } }, /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        ref,
+        role,
+        className: cn(
+          alertVariants({ size, radius }),
+          colorClasses,
+          className
+        ),
+        ...props
+      },
+      !hideIcon && /* @__PURE__ */ React.createElement("span", { className: cn("shrink-0 flex items-center min-h-[1lh]", ICON_LINE_MAP[size]) }, icon || /* @__PURE__ */ React.createElement(StatusIcon, { className: ICON_SIZE_MAP[size] })),
+      /* @__PURE__ */ React.createElement("div", { className: "flex-1 min-w-0" }, children),
+      closable && /* @__PURE__ */ React.createElement(
+        "button",
+        {
+          type: "button",
+          className: cn(
+            "shrink-0 rounded-md p-1 opacity-70 hover:opacity-100 transition-opacity focus-visible:focus-ring",
+            "group-has-[[data-alert-description]]:absolute",
+            size === "sm" ? "group-has-[[data-alert-description]]:top-2 group-has-[[data-alert-description]]:right-2" : "group-has-[[data-alert-description]]:top-3 group-has-[[data-alert-description]]:right-3"
+          ),
+          onClick: onClose,
+          "aria-label": "Close"
+        },
+        closeIcon || /* @__PURE__ */ React.createElement(DefaultCloseIcon, { className: "icon-sm" })
+      )
+    ));
+  }
+);
+Alert.displayName = "Alert";
+var AlertTitle = React.forwardRef(
+  ({ className, ...props }, ref) => {
+    const { size } = useAlertContext();
+    return /* @__PURE__ */ React.createElement(
+      "h5",
+      {
+        ref,
+        className: cn(TITLE_SIZE_MAP[size], className),
+        ...props
+      }
+    );
+  }
+);
+AlertTitle.displayName = "AlertTitle";
+var AlertDescription = React.forwardRef(
+  ({ className, ...props }, ref) => {
+    const { variant, size } = useAlertContext();
+    return /* @__PURE__ */ React.createElement(
+      "p",
+      {
+        ref,
+        "data-alert-description": "",
+        className: cn(
+          DESC_SIZE_MAP[size],
+          variant === "filled" ? "opacity-90" : "opacity-80",
+          className
+        ),
+        ...props
+      }
+    );
+  }
+);
+AlertDescription.displayName = "AlertDescription";
+
+export {
+  alertVariants,
+  Alert,
+  AlertTitle,
+  AlertDescription
+};
+//# sourceMappingURL=chunk-DJAEXCRU.mjs.map

package/dist/chunk-DJAEXCRU.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/ui/alert.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '@/lib/utils'\n\n// ─── Built-in status icons (no external dependency) ──────────────\n// All icons: Lucide-compatible 24×24 viewBox, strokeWidth=2, rounded caps/joins\n// Info = circle + \"i\" | Success = circle + check | Warning = triangle + \"!\" | Error = circle + small ×\nconst InfoIcon = ({ className }: { className?: string }) => (\n  <svg className={className} viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth={2} strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden=\"true\">\n    <circle cx=\"12\" cy=\"12\" r=\"10\" />\n    <path d=\"M12 16v-4\" />\n    <path d=\"M12 8h.01\" />\n  </svg>\n)\n\nconst SuccessIcon = ({ className }: { className?: string }) => (\n  <svg className={className} viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth={2} strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden=\"true\">\n    <circle cx=\"12\" cy=\"12\" r=\"10\" />\n    <path d=\"m9 12 2 2 4-4\" />\n  </svg>\n)\n\nconst WarningIcon = ({ className }: { className?: string }) => (\n  <svg className={className} viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth={2} strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden=\"true\">\n    <path d=\"m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3\" />\n    <path d=\"M12 9v4\" />\n    <path d=\"M12 17h.01\" />\n  </svg>\n)\n\nconst ErrorIcon = ({ className }: { className?: string }) => (\n  <svg className={className} viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth={2} strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden=\"true\">\n    <circle cx=\"12\" cy=\"12\" r=\"10\" />\n    <path d=\"M12 8v5\" />\n    <path d=\"M12 16h.01\" />\n  </svg>\n)\n\nconst DefaultCloseIcon = ({ className }: { className?: string }) => (\n  <svg className={className} fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" strokeWidth={2} aria-hidden=\"true\">\n    <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M6 18L18 6M6 6l12 12\" />\n  </svg>\n)\n\n// ─── Status icon mapping ─────────────────────────────────────────\nconst STATUS_ICONS: Record<AlertColor, React.FC<{ className?: string }>> = {\n  info: InfoIcon,\n  success: SuccessIcon,\n  warning: WarningIcon,\n  error: ErrorIcon,\n}\n\n// ─── Color × Variant class mapping ──────────────────────────────\n// Uses semantic tokens (*.tint, text-text-*) — same pattern as Badge\nconst colorMap = {\n  info: {\n    default: 'bg-info-tint text-text-info border-info/20',\n    outline: 'bg-transparent text-text-info border-info',\n    filled: 'bg-info text-info-foreground border-transparent',\n  },\n  success: {\n    default: 'bg-success-tint text-text-success border-success/20',\n    outline: 'bg-transparent text-text-success border-success',\n    filled: 'bg-success text-success-foreground border-transparent',\n  },\n  warning: {\n    default: 'bg-warning-tint text-text-warning border-warning/20',\n    outline: 'bg-transparent text-text-warning border-warning',\n    filled: 'bg-warning text-warning-foreground border-transparent',\n  },\n  error: {\n    default: 'bg-error-tint text-text-error border-error/20',\n    outline: 'bg-transparent text-text-error border-error',\n    filled: 'bg-error text-error-foreground border-transparent',\n  },\n} as const\n\n// ─── Alert variants ──────────────────────────────────────────────\nconst alertVariants = cva(\n  'group relative flex items-center border w-full [&:has([data-alert-description])]:items-start',\n  {\n    variants: {\n      size: {\n        sm: 'gap-2 p-2.5 text-sm',\n        default: 'gap-2.5 p-3.5 text-md',\n        lg: 'gap-3 p-4 text-md',\n      },\n      radius: {\n        none: 'rounded-none',\n        sm: 'rounded-sm',\n        base: 'rounded',\n        md: 'rounded-md',\n        lg: 'rounded-lg',\n        xl: 'rounded-xl',\n        '2xl': 'rounded-2xl',\n        '3xl': 'rounded-3xl',\n        full: 'rounded-full',\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n      radius: 'lg',\n    },\n  }\n)\n\n// ─── Size-dependent class maps ──────────────────────────────────\nconst ICON_SIZE_MAP = {\n  sm: 'icon-sm',                // 16px\n  default: 'w-[18px] h-[18px]', // 18px — TOKEN-EXCEPTION: no 18px icon token\n  lg: 'icon-md',                // 20px\n} as const\n\n/** Icon wrapper text class — matches title line-height for vertical alignment */\nconst ICON_LINE_MAP = {\n  sm: 'text-sm',\n  default: 'text-md',\n  lg: 'text-base',\n} as const\n\nconst TITLE_SIZE_MAP = {\n  sm: 'text-sm font-semibold tracking-tight',\n  default: 'text-md font-semibold tracking-tight',\n  lg: 'text-base font-semibold tracking-tight',\n} as const\n\nconst DESC_SIZE_MAP = {\n  sm: 'text-xs mt-0.5',\n  default: 'text-sm mt-0.5',\n  lg: 'text-md mt-0.5',\n} as const\n\n// ─── Types ───────────────────────────────────────────────────────\nexport type AlertVariant = 'default' | 'outline' | 'filled'\nexport type AlertColor = 'info' | 'success' | 'warning' | 'error'\nexport type AlertSize = 'sm' | 'default' | 'lg'\n\n// ─── Context ─────────────────────────────────────────────────────\ninterface AlertContextValue {\n  variant: AlertVariant\n  color: AlertColor\n  size: AlertSize\n}\n\nconst AlertContext = React.createContext<AlertContextValue>({\n  variant: 'default',\n  color: 'info',\n  size: 'default',\n})\n\nfunction useAlertContext() {\n  return React.useContext(AlertContext)\n}\n\n// ═══════════════════════════════════════════════════════════════════\n// Alert\n// ═══════════════════════════════════════════════════════════════════\n\n// ─── Alert ───────────────────────────────────────────────────────\nexport interface AlertRootProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof alertVariants> {\n  /** Visual style */\n  variant?: AlertVariant\n  /** Semantic color (determines icon, colors, and ARIA role) */\n  color?: AlertColor\n  /** Size */\n  size?: AlertSize\n  /** Closable — shows close button */\n  closable?: boolean\n  /** Close callback */\n  onClose?: () => void\n  /** Custom close icon */\n  closeIcon?: React.ReactNode\n  /** Custom status icon (overrides default) */\n  icon?: React.ReactNode\n  /** Hide the status icon entirely */\n  hideIcon?: boolean\n}\n\nconst Alert = React.forwardRef<HTMLDivElement, AlertRootProps>(\n  ({\n    className,\n    variant = 'default',\n    color = 'info',\n    size = 'default',\n    radius,\n    closable = false,\n    onClose,\n    closeIcon,\n    icon,\n    hideIcon = false,\n    children,\n    ...props\n  }, ref) => {\n    // error → role=\"alert\" (assertive), others → role=\"status\" (polite)\n    const role = color === 'error' ? 'alert' : 'status'\n    const colorClasses = colorMap[color][variant]\n    const StatusIcon = STATUS_ICONS[color]\n\n    return (\n      <AlertContext.Provider value={{ variant, color, size }}>\n        <div\n          ref={ref}\n          role={role}\n          className={cn(\n            alertVariants({ size, radius }),\n            colorClasses,\n            className,\n          )}\n          {...props}\n        >\n          {/* Icon */}\n          {!hideIcon && (\n            <span className={cn('shrink-0 flex items-center min-h-[1lh]', ICON_LINE_MAP[size])}>\n              {icon || <StatusIcon className={ICON_SIZE_MAP[size]} />}\n            </span>\n          )}\n\n          {/* Content area */}\n          <div className=\"flex-1 min-w-0\">\n            {children}\n          </div>\n\n          {/* Close button */}\n          {closable && (\n            <button\n              type=\"button\"\n              className={cn(\n                'shrink-0 rounded-md p-1 opacity-70 hover:opacity-100 transition-opacity focus-visible:focus-ring',\n                'group-has-[[data-alert-description]]:absolute',\n                size === 'sm'\n                  ? 'group-has-[[data-alert-description]]:top-2 group-has-[[data-alert-description]]:right-2'\n                  : 'group-has-[[data-alert-description]]:top-3 group-has-[[data-alert-description]]:right-3',\n              )}\n              onClick={onClose}\n              aria-label=\"Close\"\n            >\n              {closeIcon || <DefaultCloseIcon className=\"icon-sm\" />}\n            </button>\n          )}\n        </div>\n      </AlertContext.Provider>\n    )\n  }\n)\nAlert.displayName = 'Alert'\n\n// ─── AlertTitle ──────────────────────────────────────────────────\nexport interface AlertTitleProps extends React.HTMLAttributes<HTMLHeadingElement> {}\n\nconst AlertTitle = React.forwardRef<HTMLHeadingElement, AlertTitleProps>(\n  ({ className, ...props }, ref) => {\n    const { size } = useAlertContext()\n    return (\n      <h5\n        ref={ref}\n        className={cn(TITLE_SIZE_MAP[size], className)}\n        {...props}\n      />\n    )\n  }\n)\nAlertTitle.displayName = 'AlertTitle'\n\n// ─── AlertDescription ────────────────────────────────────────────\nexport interface AlertDescriptionProps extends React.HTMLAttributes<HTMLParagraphElement> {}\n\nconst AlertDescription = React.forwardRef<HTMLParagraphElement, AlertDescriptionProps>(\n  ({ className, ...props }, ref) => {\n    const { variant, size } = useAlertContext()\n    return (\n      <p\n        ref={ref}\n        data-alert-description=\"\"\n        className={cn(\n          DESC_SIZE_MAP[size],\n          variant === 'filled' ? 'opacity-90' : 'opacity-80',\n          className,\n        )}\n        {...props}\n      />\n    )\n  }\n)\nAlertDescription.displayName = 'AlertDescription'\n\n// ─── Exports ─────────────────────────────────────────────────────\nexport {\n  Alert,\n  AlertTitle,\n  AlertDescription,\n  alertVariants,\n}\n"],"mappings":"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","names":[]}

package/dist/chunk-DRVHHEAY.mjs

@@ -0,0 +1,145 @@
+"use client";
+import {
+  useFieldContext
+} from "./chunk-Z6JWWCNL.mjs";
+import {
+  cn
+} from "./chunk-53MIUPSY.mjs";
+
+// src/components/ui/switch.tsx
+import * as React from "react";
+import * as SwitchPrimitive from "@radix-ui/react-switch";
+import { cva } from "class-variance-authority";
+var switchVariants = cva(
+  [
+    "group peer inline-flex shrink-0 cursor-pointer items-center rounded-full",
+    "border border-transparent transition-all duration-normal ease-out",
+    "focus-visible:focus-ring",
+    "disabled:cursor-not-allowed disabled:opacity-50",
+    "data-[state=unchecked]:bg-border"
+  ].join(" "),
+  {
+    variants: {
+      size: {
+        sm: "w-[var(--component-switch-track-sm-width)] h-[var(--component-switch-track-sm-height)]",
+        default: "w-[var(--component-switch-track-default-width)] h-[var(--component-switch-track-default-height)]",
+        lg: "w-[var(--component-switch-track-lg-width)] h-[var(--component-switch-track-lg-height)]"
+      }
+    },
+    defaultVariants: {
+      size: "default"
+    }
+  }
+);
+var thumbSizes = {
+  sm: "w-[var(--component-switch-thumb-sm)] h-[var(--component-switch-thumb-sm)]",
+  default: "w-[var(--component-switch-thumb-default)] h-[var(--component-switch-thumb-default)]",
+  lg: "w-[var(--component-switch-thumb-lg)] h-[var(--component-switch-thumb-lg)]"
+};
+var thumbTranslate = {
+  sm: "data-[state=checked]:translate-x-[calc(var(--component-switch-track-sm-width)_-_var(--component-switch-thumb-sm)_-_2px)]",
+  default: "data-[state=checked]:translate-x-[calc(var(--component-switch-track-default-width)_-_var(--component-switch-thumb-default)_-_2px)]",
+  lg: "data-[state=checked]:translate-x-[calc(var(--component-switch-track-lg-width)_-_var(--component-switch-thumb-lg)_-_2px)]"
+};
+var gapSizes = {
+  sm: "gap-2",
+  // 8px
+  default: "gap-2.5",
+  // 10px
+  lg: "gap-3"
+  // 12px
+};
+var labelSizes = {
+  sm: "text-xs",
+  // 12px
+  default: "text-md",
+  // 14px
+  lg: "text-base"
+  // 16px
+};
+var checkedTrackColors = {
+  default: "data-[state=checked]:bg-foreground",
+  primary: "data-[state=checked]:bg-primary",
+  success: "data-[state=checked]:bg-success",
+  warning: "data-[state=checked]:bg-warning",
+  error: "data-[state=checked]:bg-error"
+};
+var checkedIconColors = {
+  default: "text-foreground",
+  primary: "text-primary",
+  success: "text-success",
+  warning: "text-warning",
+  error: "text-error"
+};
+var iconSizes = {
+  sm: "hidden",
+  // 12px thumb — too small for icons
+  default: "w-2.5 h-2.5",
+  // 10px icon in 16px thumb
+  lg: "w-3.5 h-3.5"
+  // 14px icon in 20px thumb
+};
+var Switch = React.forwardRef(({ className, size, label, labelPosition = "end", startLabel, endLabel, checkedIcon, uncheckedIcon, color = "default", disabled, id, ...props }, ref) => {
+  const fieldContext = useFieldContext();
+  const resolvedSize = size || "default";
+  const resolvedDisabled = disabled ?? fieldContext?.disabled;
+  const generatedId = React.useId();
+  const switchId = id ?? fieldContext?.id ?? generatedId;
+  const switchEl = /* @__PURE__ */ React.createElement(
+    SwitchPrimitive.Root,
+    {
+      ref,
+      id: switchId,
+      disabled: resolvedDisabled,
+      className: cn(switchVariants({ size }), checkedTrackColors[color], className),
+      ...props
+    },
+    /* @__PURE__ */ React.createElement(
+      SwitchPrimitive.Thumb,
+      {
+        className: cn(
+          "group/thumb pointer-events-none flex items-center justify-center rounded-full shadow-sm ring-0",
+          color === "default" ? "bg-background" : "bg-primary-foreground",
+          "transition-transform duration-normal ease-out",
+          "data-[state=unchecked]:translate-x-0",
+          thumbSizes[resolvedSize],
+          thumbTranslate[resolvedSize]
+        )
+      },
+      (checkedIcon || uncheckedIcon) && resolvedSize !== "sm" && /* @__PURE__ */ React.createElement(React.Fragment, null, checkedIcon && /* @__PURE__ */ React.createElement("span", { className: cn(
+        iconSizes[resolvedSize],
+        checkedIconColors[color],
+        "hidden group-data-[state=checked]/thumb:block"
+      ) }, checkedIcon), uncheckedIcon && /* @__PURE__ */ React.createElement("span", { className: cn(
+        iconSizes[resolvedSize],
+        "text-text-muted",
+        "hidden group-data-[state=unchecked]/thumb:block"
+      ) }, uncheckedIcon))
+    )
+  );
+  const labelClassName = cn(
+    labelSizes[resolvedSize],
+    "text-text-muted cursor-pointer select-none transition-colors duration-micro",
+    "group-hover/switch:text-foreground",
+    resolvedDisabled && "opacity-50 cursor-not-allowed"
+  );
+  if (startLabel || endLabel) {
+    return /* @__PURE__ */ React.createElement("div", { className: cn("group/switch flex items-center", gapSizes[resolvedSize]) }, startLabel && /* @__PURE__ */ React.createElement("label", { htmlFor: switchId, className: labelClassName }, startLabel), /* @__PURE__ */ React.createElement("div", { className: "flex items-center" }, switchEl), endLabel && /* @__PURE__ */ React.createElement("label", { htmlFor: switchId, className: labelClassName }, endLabel));
+  }
+  if (!label) return switchEl;
+  const isVertical = labelPosition === "top" || labelPosition === "bottom";
+  const isReversed = labelPosition === "start" || labelPosition === "top";
+  return /* @__PURE__ */ React.createElement("div", { className: cn(
+    "group/switch flex",
+    isVertical ? "flex-col items-start gap-1.5" : "items-center",
+    isReversed && (isVertical ? "flex-col-reverse" : "flex-row-reverse"),
+    !isVertical && gapSizes[resolvedSize]
+  ) }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center" }, switchEl), /* @__PURE__ */ React.createElement("label", { htmlFor: switchId, className: labelClassName }, label));
+});
+Switch.displayName = "Switch";
+
+export {
+  switchVariants,
+  Switch
+};
+//# sourceMappingURL=chunk-DRVHHEAY.mjs.map

package/dist/chunk-DRVHHEAY.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/ui/switch.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport * as SwitchPrimitive from '@radix-ui/react-switch'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '@/lib/utils'\nimport { useFieldContext } from './field'\n\n// Switch track variants\nconst switchVariants = cva(\n  [\n    'group peer inline-flex shrink-0 cursor-pointer items-center rounded-full',\n    'border border-transparent transition-all duration-normal ease-out',\n    'focus-visible:focus-ring',\n    'disabled:cursor-not-allowed disabled:opacity-50',\n    'data-[state=unchecked]:bg-border',\n  ].join(' '),\n  {\n    variants: {\n      size: {\n        sm: 'w-[var(--component-switch-track-sm-width)] h-[var(--component-switch-track-sm-height)]',\n        default: 'w-[var(--component-switch-track-default-width)] h-[var(--component-switch-track-default-height)]',\n        lg: 'w-[var(--component-switch-track-lg-width)] h-[var(--component-switch-track-lg-height)]',\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n    },\n  }\n)\n\n// Thumb sizes\nconst thumbSizes = {\n  sm: 'w-[var(--component-switch-thumb-sm)] h-[var(--component-switch-thumb-sm)]',\n  default: 'w-[var(--component-switch-thumb-default)] h-[var(--component-switch-thumb-default)]',\n  lg: 'w-[var(--component-switch-thumb-lg)] h-[var(--component-switch-thumb-lg)]',\n}\n\n// Thumb translate when checked: track_width - thumb_size - 2px (border 1px × 2)\nconst thumbTranslate = {\n  sm: 'data-[state=checked]:translate-x-[calc(var(--component-switch-track-sm-width)_-_var(--component-switch-thumb-sm)_-_2px)]',\n  default: 'data-[state=checked]:translate-x-[calc(var(--component-switch-track-default-width)_-_var(--component-switch-thumb-default)_-_2px)]',\n  lg: 'data-[state=checked]:translate-x-[calc(var(--component-switch-track-lg-width)_-_var(--component-switch-thumb-lg)_-_2px)]',\n}\n\n// Gap between switch and label\nconst gapSizes = {\n  sm: 'gap-2',      // 8px\n  default: 'gap-2.5', // 10px\n  lg: 'gap-3',      // 12px\n}\n\n// Label font sizes\nconst labelSizes = {\n  sm: 'text-xs',      // 12px\n  default: 'text-md',  // 14px\n  lg: 'text-base',    // 16px\n}\n\nexport type SwitchLabelPosition = 'start' | 'end' | 'top' | 'bottom'\nexport type SwitchColor = 'default' | 'primary' | 'success' | 'warning' | 'error'\n\n// Checked track color per color variant\nconst checkedTrackColors: Record<SwitchColor, string> = {\n  default: 'data-[state=checked]:bg-foreground',\n  primary: 'data-[state=checked]:bg-primary',\n  success: 'data-[state=checked]:bg-success',\n  warning: 'data-[state=checked]:bg-warning',\n  error: 'data-[state=checked]:bg-error',\n}\n\n// Checked icon color per color variant\nconst checkedIconColors: Record<SwitchColor, string> = {\n  default: 'text-foreground',\n  primary: 'text-primary',\n  success: 'text-success',\n  warning: 'text-warning',\n  error: 'text-error',\n}\n\n// Icon sizes per thumb size\nconst iconSizes = {\n  sm: 'hidden',            // 12px thumb — too small for icons\n  default: 'w-2.5 h-2.5', // 10px icon in 16px thumb\n  lg: 'w-3.5 h-3.5',      // 14px icon in 20px thumb\n}\n\nexport interface SwitchProps\n  extends React.ComponentPropsWithoutRef<typeof SwitchPrimitive.Root>,\n    VariantProps<typeof switchVariants> {\n  label?: string\n  labelPosition?: SwitchLabelPosition\n  startLabel?: string\n  endLabel?: string\n  checkedIcon?: React.ReactNode\n  uncheckedIcon?: React.ReactNode\n  color?: SwitchColor\n}\n\nconst Switch = React.forwardRef<\n  React.ElementRef<typeof SwitchPrimitive.Root>,\n  SwitchProps\n>(({ className, size, label, labelPosition = 'end', startLabel, endLabel, checkedIcon, uncheckedIcon, color = 'default', disabled, id, ...props }, ref) => {\n  const fieldContext = useFieldContext()\n  const resolvedSize = size || 'default'\n  const resolvedDisabled = disabled ?? fieldContext?.disabled\n  const generatedId = React.useId()\n  const switchId = id ?? fieldContext?.id ?? generatedId\n\n  const switchEl = (\n    <SwitchPrimitive.Root\n      ref={ref}\n      id={switchId}\n      disabled={resolvedDisabled}\n      className={cn(switchVariants({ size }), checkedTrackColors[color], className)}\n      {...props}\n    >\n      <SwitchPrimitive.Thumb\n        className={cn(\n          'group/thumb pointer-events-none flex items-center justify-center rounded-full shadow-sm ring-0',\n          color === 'default' ? 'bg-background' : 'bg-primary-foreground',\n          'transition-transform duration-normal ease-out',\n          'data-[state=unchecked]:translate-x-0',\n          thumbSizes[resolvedSize],\n          thumbTranslate[resolvedSize]\n        )}\n      >\n        {(checkedIcon || uncheckedIcon) && resolvedSize !== 'sm' && (\n          <>\n            {checkedIcon && (\n              <span className={cn(\n                iconSizes[resolvedSize],\n                checkedIconColors[color],\n                'hidden group-data-[state=checked]/thumb:block',\n              )}>\n                {checkedIcon}\n              </span>\n            )}\n            {uncheckedIcon && (\n              <span className={cn(\n                iconSizes[resolvedSize],\n                'text-text-muted',\n                'hidden group-data-[state=unchecked]/thumb:block',\n              )}>\n                {uncheckedIcon}\n              </span>\n            )}\n          </>\n        )}\n      </SwitchPrimitive.Thumb>\n    </SwitchPrimitive.Root>\n  )\n\n  const labelClassName = cn(\n    labelSizes[resolvedSize],\n    'text-text-muted cursor-pointer select-none transition-colors duration-micro',\n    'group-hover/switch:text-foreground',\n    resolvedDisabled && 'opacity-50 cursor-not-allowed'\n  )\n\n  // Sides mode: startLabel / endLabel\n  if (startLabel || endLabel) {\n    return (\n      <div className={cn('group/switch flex items-center', gapSizes[resolvedSize])}>\n        {startLabel && (\n          <label htmlFor={switchId} className={labelClassName}>\n            {startLabel}\n          </label>\n        )}\n        <div className=\"flex items-center\">\n          {switchEl}\n        </div>\n        {endLabel && (\n          <label htmlFor={switchId} className={labelClassName}>\n            {endLabel}\n          </label>\n        )}\n      </div>\n    )\n  }\n\n  if (!label) return switchEl\n\n  const isVertical = labelPosition === 'top' || labelPosition === 'bottom'\n  const isReversed = labelPosition === 'start' || labelPosition === 'top'\n\n  return (\n    <div className={cn(\n      'group/switch flex',\n      isVertical ? 'flex-col items-start gap-1.5' : 'items-center',\n      isReversed && (isVertical ? 'flex-col-reverse' : 'flex-row-reverse'),\n      !isVertical && gapSizes[resolvedSize],\n    )}>\n      <div className=\"flex items-center\">\n        {switchEl}\n      </div>\n      <label htmlFor={switchId} className={labelClassName}>\n        {label}\n      </label>\n    </div>\n  )\n})\nSwitch.displayName = 'Switch'\n\nexport { Switch, switchVariants }\n"],"mappings":"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","names":[]}