@karakuri-ui/react 0.3.2 → 0.3.4

package/dist/components/ui/spinner.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ui/spinner.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// ============================================================================\n// Constants\n// ============================================================================\n\n/** Ring SVG sizes per size variant (diameter in px) */\nconst RING_SIZES = {\n  sm: 16,\n  default: 24,\n  lg: 32,\n} as const\n\n/** Ring stroke widths per size */\nconst RING_STROKE = {\n  sm: 2,\n  default: 2.5,\n  lg: 3,\n} as const\n\n/** Dot sizes (diameter in px) */\nconst DOT_SIZES = {\n  sm: 4,\n  default: 6,\n  lg: 8,\n} as const\n\n/** Dot container gap per size */\nconst DOT_GAP = {\n  sm: 3,\n  default: 4,\n  lg: 5,\n} as const\n\n/** Bar widths per size */\nconst BAR_WIDTHS = {\n  sm: 2,\n  default: 3,\n  lg: 4,\n} as const\n\n/** Bar heights per size */\nconst BAR_HEIGHTS = {\n  sm: 12,\n  default: 16,\n  lg: 24,\n} as const\n\n/** Bar gap per size */\nconst BAR_GAP = {\n  sm: 2,\n  default: 3,\n  lg: 4,\n} as const\n\n/** Orbit sizes (diameter in px) */\nconst ORBIT_SIZES = {\n  sm: 22,\n  default: 32,\n  lg: 44,\n} as const\n\n/** Orbit ring stroke widths per size */\nconst ORBIT_STROKE = {\n  sm: 2.5,\n  default: 3,\n  lg: 3.5,\n} as const\n\n\n/** Number of dots in dots variant */\nconst DOT_COUNT = 3\n\n/** Number of bars in bars variant */\nconst BAR_COUNT = 4\n\n/** SVG viewBox for ring spinner */\nconst RING_VIEWBOX = 24\n\n/** SVG center for ring spinner */\nconst RING_CENTER = 12\n\n// ============================================================================\n// Color mapping\n// ============================================================================\n\nconst strokeColorMap = {\n  default: 'stroke-foreground',\n  primary: 'stroke-primary',\n  current: 'stroke-current',\n} as const\n\nconst bgColorMap = {\n  default: 'bg-foreground',\n  primary: 'bg-primary',\n  current: 'bg-current',\n} as const\n\n// ============================================================================\n// Speed mapping\n// ============================================================================\n\n/** Speed durations in ms for ring/dots/bars */\nconst SPEED_MS = { slow: 1500, default: 1000, fast: 750 } as const\n/** Speed durations in ms for orbit (slower) */\nconst ORBIT_SPEED_MS = { slow: 2000, default: 1500, fast: 1000 } as const\n\n// ============================================================================\n// Variants (CVA)\n// ============================================================================\n\nconst spinnerVariants = cva(\n  'inline-flex items-center justify-center shrink-0',\n  {\n    variants: {\n      size: {\n        sm: '',\n        default: '',\n        lg: '',\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n    },\n  }\n)\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport type OrbitStyle = 'ring' | 'dots' | 'cube' | 'flip' | 'morph'\n\nexport interface SpinnerProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof spinnerVariants> {\n  /** Visual variant */\n  variant?: 'ring' | 'dots' | 'bars' | 'orbit'\n  /** Orbit sub-style (only when variant=\"orbit\") */\n  orbitStyle?: OrbitStyle\n  /** Spinner color */\n  color?: 'default' | 'primary' | 'current'\n  /** Animation speed */\n  speed?: 'slow' | 'default' | 'fast'\n  /** Accessibility label */\n  label?: string\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nconst Spinner = React.forwardRef<HTMLDivElement, SpinnerProps>(\n  ({\n    className,\n    variant = 'ring',\n    orbitStyle = 'ring',\n    size,\n    color = 'default',\n    speed = 'default',\n    label,\n    ...props\n  }, ref) => {\n    const resolvedSize = size || 'default'\n\n    const orbitMap = {\n      ring: OrbitSpinner,\n      dots: OrbitDotsSpinner,\n      cube: OrbitCubeSpinner,\n      flip: OrbitFlipSpinner,\n      morph: OrbitMorphSpinner,\n    } as const\n\n    return (\n      <div\n        ref={ref}\n        role=\"status\"\n        aria-label={label || 'Loading'}\n        className={cn(spinnerVariants({ size }), className)}\n        {...props}\n      >\n        {variant === 'ring' && (\n          <RingSpinner size={resolvedSize} color={color} speed={speed} />\n        )}\n        {variant === 'dots' && (\n          <DotsSpinner size={resolvedSize} color={color} speed={speed} />\n        )}\n        {variant === 'bars' && (\n          <BarsSpinner size={resolvedSize} color={color} speed={speed} />\n        )}\n        {variant === 'orbit' && (() => {\n          const OrbitComponent = orbitMap[orbitStyle]\n          return <OrbitComponent size={resolvedSize} color={color} speed={speed} />\n        })()}\n      </div>\n    )\n  }\n)\nSpinner.displayName = 'Spinner'\n\n// ============================================================================\n// Ring Spinner (SVG circle with animate-spin)\n// ============================================================================\n\nfunction RingSpinner({ size, color, speed }: {\n  size: 'sm' | 'default' | 'lg'\n  color: 'default' | 'primary' | 'current'\n  speed: 'slow' | 'default' | 'fast'\n}) {\n  const diameter = RING_SIZES[size]\n  const stroke = RING_STROKE[size]\n  const r = (RING_VIEWBOX - stroke) / 2\n  const circumference = 2 * Math.PI * r\n\n  return (\n    <svg\n      viewBox={`0 0 ${RING_VIEWBOX} ${RING_VIEWBOX}`}\n      width={diameter}\n      height={diameter}\n      fill=\"none\"\n      className=\"animate-spin\"\n      style={{ animationDuration: `${SPEED_MS[speed]}ms` }}\n    >\n      {/* Track */}\n      <circle\n        cx={RING_CENTER}\n        cy={RING_CENTER}\n        r={r}\n        className=\"stroke-border\"\n        strokeWidth={stroke}\n      />\n      {/* Indicator */}\n      <circle\n        cx={RING_CENTER}\n        cy={RING_CENTER}\n        r={r}\n        className={strokeColorMap[color]}\n        strokeWidth={stroke}\n        strokeDasharray={circumference}\n        strokeDashoffset={circumference * 0.75}\n        strokeLinecap=\"round\"\n      />\n    </svg>\n  )\n}\n\n// ============================================================================\n// Dots Spinner (3 pulsing dots)\n// ============================================================================\n\nfunction DotsSpinner({ size, color, speed }: {\n  size: 'sm' | 'default' | 'lg'\n  color: 'default' | 'primary' | 'current'\n  speed: 'slow' | 'default' | 'fast'\n}) {\n  const dotSize = DOT_SIZES[size]\n  const gap = DOT_GAP[size]\n\n  return (\n    <div className=\"inline-flex items-center\" style={{ gap }}>\n      {Array.from({ length: DOT_COUNT }, (_, i) => (\n        <div\n          key={i}\n          className={cn(\n            'rounded-full animate-spinner-dot',\n            bgColorMap[color],\n          )}\n          style={{\n            width: dotSize,\n            height: dotSize,\n            animationDuration: `${SPEED_MS[speed]}ms`,\n            animationDelay: `${i * (SPEED_MS[speed] / DOT_COUNT / 1.5)}ms`,\n          }}\n        />\n      ))}\n    </div>\n  )\n}\n\n// ============================================================================\n// Bars Spinner (4 pulsing bars)\n// ============================================================================\n\nfunction BarsSpinner({ size, color, speed }: {\n  size: 'sm' | 'default' | 'lg'\n  color: 'default' | 'primary' | 'current'\n  speed: 'slow' | 'default' | 'fast'\n}) {\n  const barWidth = BAR_WIDTHS[size]\n  const barHeight = BAR_HEIGHTS[size]\n  const gap = BAR_GAP[size]\n\n  return (\n    <div className=\"inline-flex items-center\" style={{ gap, height: barHeight }}>\n      {Array.from({ length: BAR_COUNT }, (_, i) => (\n        <div\n          key={i}\n          className={cn(\n            'rounded-full animate-spinner-bar origin-center',\n            bgColorMap[color],\n          )}\n          style={{\n            width: barWidth,\n            height: barHeight,\n            animationDuration: `${SPEED_MS[speed]}ms`,\n            animationDelay: `${i * (SPEED_MS[speed] / BAR_COUNT / 1.5)}ms`,\n          }}\n        />\n      ))}\n    </div>\n  )\n}\n\n// ============================================================================\n// Orbit Spinner (3D rotating ring)\n// ============================================================================\n\nconst orbitTextColorMap = {\n  default: 'text-foreground',\n  primary: 'text-primary',\n  current: '',\n} as const\n\nfunction OrbitSpinner({ size, color, speed }: {\n  size: 'sm' | 'default' | 'lg'\n  color: 'default' | 'primary' | 'current'\n  speed: 'slow' | 'default' | 'fast'\n}) {\n  const diameter = ORBIT_SIZES[size]\n  const stroke = ORBIT_STROKE[size]\n  const r = (RING_VIEWBOX - stroke * 2) / 2\n  const circumference = 2 * Math.PI * r\n\n  return (\n    <div\n      className={cn(orbitTextColorMap[color])}\n      style={{\n        width: diameter,\n        height: diameter,\n        perspective: diameter * 3,\n        position: 'relative',\n      }}\n    >\n      {/* Ring 1 — solid, Y-axis rotation */}\n      <svg\n        viewBox={`0 0 ${RING_VIEWBOX} ${RING_VIEWBOX}`}\n        width={diameter}\n        height={diameter}\n        fill=\"none\"\n        className=\"absolute inset-0 animate-spinner-orbit\"\n        style={{ animationDuration: `${ORBIT_SPEED_MS[speed]}ms` }}\n      >\n        <circle\n          cx={RING_CENTER}\n          cy={RING_CENTER}\n          r={r}\n          stroke=\"currentColor\"\n          strokeWidth={stroke}\n        />\n      </svg>\n      {/* Ring 2 — solid, perpendicular, reverse direction */}\n      <svg\n        viewBox={`0 0 ${RING_VIEWBOX} ${RING_VIEWBOX}`}\n        width={diameter}\n        height={diameter}\n        fill=\"none\"\n        className=\"absolute inset-0 animate-spinner-orbit\"\n        style={{\n          animationDuration: `${ORBIT_SPEED_MS[speed]}ms`,\n          transform: 'rotateZ(90deg)',\n          animationDirection: 'reverse',\n          animationDelay: '-0.4s',\n          opacity: 0.35,\n        }}\n      >\n        <circle\n          cx={RING_CENTER}\n          cy={RING_CENTER}\n          r={r}\n          stroke=\"currentColor\"\n          strokeWidth={stroke}\n        />\n      </svg>\n    </div>\n  )\n}\n\n// ============================================================================\n// Orbit Dots — 3 dots orbiting in 3D path\n// ============================================================================\n\n/** Orbit dot size per spinner size */\nconst ORBIT_DOT_SIZE = { sm: 3, default: 4, lg: 6 } as const\n\nfunction OrbitDotsSpinner({ size, color, speed }: {\n  size: 'sm' | 'default' | 'lg'\n  color: 'default' | 'primary' | 'current'\n  speed: 'slow' | 'default' | 'fast'\n}) {\n  const diameter = ORBIT_SIZES[size]\n  const dotSize = ORBIT_DOT_SIZE[size]\n  const orbitRadius = (diameter - dotSize) / 2\n\n  return (\n    <div\n      className={cn(orbitTextColorMap[color])}\n      style={{\n        width: diameter,\n        height: diameter,\n        perspective: diameter * 3,\n        position: 'relative',\n      }}\n    >\n      <div\n        className=\"animate-spinner-orbit\"\n        style={{\n          animationDuration: `${ORBIT_SPEED_MS[speed]}ms`,\n          width: '100%',\n          height: '100%',\n          position: 'relative',\n          transformStyle: 'preserve-3d',\n        }}\n      >\n        {[0, 120, 240].map((angle) => (\n          <div\n            key={angle}\n            className=\"absolute rounded-full\"\n            style={{\n              width: dotSize,\n              height: dotSize,\n              backgroundColor: 'currentColor',\n              left: '50%',\n              top: '50%',\n              transform: `translate(-50%, -50%) rotate(${angle}deg) translateX(${orbitRadius}px)`,\n            }}\n          />\n        ))}\n      </div>\n    </div>\n  )\n}\n\n// ============================================================================\n// Orbit Cube — wireframe cube rotating in 3D\n// ============================================================================\n\n/** Cube face sizes per spinner size */\nconst CUBE_SIZES = { sm: 12, default: 18, lg: 26 } as const\n\nfunction OrbitCubeSpinner({ size, color, speed }: {\n  size: 'sm' | 'default' | 'lg'\n  color: 'default' | 'primary' | 'current'\n  speed: 'slow' | 'default' | 'fast'\n}) {\n  const cubeSize = CUBE_SIZES[size]\n  const half = cubeSize / 2\n  const radius = Math.round(cubeSize * 0.15)\n\n  const overlap = 1\n  const faceBase: React.CSSProperties = {\n    position: 'absolute',\n    width: cubeSize + overlap * 2,\n    height: cubeSize + overlap * 2,\n    backgroundColor: 'currentColor',\n    borderRadius: radius,\n    top: -overlap,\n    left: -overlap,\n  }\n\n  return (\n    <div\n      className={cn(orbitTextColorMap[color])}\n      style={{\n        width: cubeSize,\n        height: cubeSize,\n        perspective: cubeSize * 6,\n      }}\n    >\n      {/* Diagonal tilt — shows top + corner for depth */}\n      <div\n        style={{\n          width: cubeSize,\n          height: cubeSize,\n          transform: 'rotateX(-25deg) rotateZ(15deg)',\n          transformStyle: 'preserve-3d',\n        }}\n      >\n        {/* Y-axis rotation */}\n        <div\n          className=\"animate-spinner-orbit\"\n          style={{\n            animationDuration: `${ORBIT_SPEED_MS[speed]}ms`,\n            width: cubeSize,\n            height: cubeSize,\n            position: 'relative',\n            transformStyle: 'preserve-3d',\n          }}\n        >\n          <div style={{ ...faceBase, transform: `translateZ(${half}px)`, opacity: 0.25 }} />\n          <div style={{ ...faceBase, transform: `translateZ(${-half}px)`, opacity: 0.1 }} />\n          <div style={{ ...faceBase, transform: `rotateY(-90deg) translateZ(${half}px)`, opacity: 0.2 }} />\n          <div style={{ ...faceBase, transform: `rotateY(90deg) translateZ(${half}px)`, opacity: 0.2 }} />\n          <div style={{ ...faceBase, transform: `rotateX(90deg) translateZ(${half}px)`, opacity: 0.15 }} />\n          <div style={{ ...faceBase, transform: `rotateX(-90deg) translateZ(${half}px)`, opacity: 0.08 }} />\n        </div>\n      </div>\n    </div>\n  )\n}\n\n// ============================================================================\n// Orbit Flip — rounded square tumbling in 3D\n// ============================================================================\n\n/** Flip square sizes per spinner size */\nconst FLIP_SIZES = { sm: 14, default: 20, lg: 28 } as const\n\nfunction OrbitFlipSpinner({ size, color, speed }: {\n  size: 'sm' | 'default' | 'lg'\n  color: 'default' | 'primary' | 'current'\n  speed: 'slow' | 'default' | 'fast'\n}) {\n  const sqSize = FLIP_SIZES[size]\n\n  return (\n    <div\n      className={cn(orbitTextColorMap[color])}\n      style={{\n        width: sqSize,\n        height: sqSize,\n        perspective: sqSize * 4,\n      }}\n    >\n      <div style={{ transform: 'rotateX(25deg)', transformStyle: 'preserve-3d', width: '100%', height: '100%' }}>\n        <div\n          className=\"animate-spinner-orbit\"\n          style={{\n            animationDuration: `${ORBIT_SPEED_MS[speed]}ms`,\n            width: '100%',\n            height: '100%',\n            borderRadius: '25%',\n            backgroundColor: 'currentColor',\n            opacity: 0.85,\n          }}\n        />\n      </div>\n    </div>\n  )\n}\n\n// ============================================================================\n// Orbit Morph — organic shape morphing + 3D rotation\n// ============================================================================\n\n/** Morph sizes per spinner size */\nconst MORPH_SIZES = { sm: 16, default: 24, lg: 34 } as const\n\nfunction OrbitMorphSpinner({ size, color, speed }: {\n  size: 'sm' | 'default' | 'lg'\n  color: 'default' | 'primary' | 'current'\n  speed: 'slow' | 'default' | 'fast'\n}) {\n  const morphSize = MORPH_SIZES[size]\n\n  return (\n    <div\n      className={cn(orbitTextColorMap[color])}\n      style={{\n        width: morphSize,\n        height: morphSize,\n        perspective: morphSize * 3,\n      }}\n    >\n      <div\n        className=\"animate-spinner-morph\"\n        style={{\n          animationDuration: `${ORBIT_SPEED_MS[speed]}ms`,\n          width: '100%',\n          height: '100%',\n          backgroundColor: 'currentColor',\n          opacity: 0.85,\n        }}\n      />\n    </div>\n  )\n}\n\nexport { Spinner, spinnerVariants }\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/components/ui/spinner.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// ============================================================================\n// Constants\n// ============================================================================\n\n/** Ring SVG sizes per size variant (diameter in px) */\nconst RING_SIZES = {\n  sm: 16,\n  default: 24,\n  lg: 32,\n} as const\n\n/** Ring stroke widths per size */\nconst RING_STROKE = {\n  sm: 2,\n  default: 2.5,\n  lg: 3,\n} as const\n\n/** Dot sizes (diameter in px) */\nconst DOT_SIZES = {\n  sm: 4,\n  default: 6,\n  lg: 8,\n} as const\n\n/** Dot container gap per size */\nconst DOT_GAP = {\n  sm: 3,\n  default: 4,\n  lg: 5,\n} as const\n\n/** Bar widths per size */\nconst BAR_WIDTHS = {\n  sm: 2,\n  default: 3,\n  lg: 4,\n} as const\n\n/** Bar heights per size */\nconst BAR_HEIGHTS = {\n  sm: 12,\n  default: 16,\n  lg: 24,\n} as const\n\n/** Bar gap per size */\nconst BAR_GAP = {\n  sm: 2,\n  default: 3,\n  lg: 4,\n} as const\n\n/** Orbit sizes (diameter in px) */\nconst ORBIT_SIZES = {\n  sm: 22,\n  default: 32,\n  lg: 44,\n} as const\n\n/** Orbit ring stroke widths per size */\nconst ORBIT_STROKE = {\n  sm: 2.5,\n  default: 3,\n  lg: 3.5,\n} as const\n\n\n/** Number of dots in dots variant */\nconst DOT_COUNT = 3\n\n/** Number of bars in bars variant */\nconst BAR_COUNT = 4\n\n/** SVG viewBox for ring spinner */\nconst RING_VIEWBOX = 24\n\n/** SVG center for ring spinner */\nconst RING_CENTER = 12\n\n// ============================================================================\n// Color mapping\n// ============================================================================\n\nconst strokeColorMap = {\n  default: 'stroke-foreground',\n  primary: 'stroke-primary',\n  current: 'stroke-current',\n} as const\n\nconst bgColorMap = {\n  default: 'bg-foreground',\n  primary: 'bg-primary',\n  current: 'bg-current',\n} as const\n\n// ============================================================================\n// Speed mapping\n// ============================================================================\n\n/** Speed durations in ms for ring/dots/bars */\nconst SPEED_MS = { slow: 1500, default: 1000, fast: 750 } as const\n/** Speed durations in ms for orbit (slower) */\nconst ORBIT_SPEED_MS = { slow: 2000, default: 1500, fast: 1000 } as const\n\n// ============================================================================\n// Variants (CVA)\n// ============================================================================\n\nconst spinnerVariants = cva(\n  'inline-flex items-center justify-center shrink-0',\n  {\n    variants: {\n      size: {\n        sm: '',\n        default: '',\n        lg: '',\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n    },\n  }\n)\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport type OrbitStyle = 'ring' | 'dots' | 'cube' | 'flip' | 'morph'\n\nexport interface SpinnerProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof spinnerVariants> {\n  /** Visual variant */\n  variant?: 'ring' | 'dots' | 'bars' | 'orbit'\n  /** Orbit sub-style (only when variant=\"orbit\") */\n  orbitStyle?: OrbitStyle\n  /** Spinner color */\n  color?: 'default' | 'primary' | 'current'\n  /** Animation speed */\n  speed?: 'slow' | 'default' | 'fast'\n  /** Accessibility label */\n  label?: string\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nconst Spinner = React.forwardRef<HTMLDivElement, SpinnerProps>(\n  ({\n    className,\n    variant = 'ring',\n    orbitStyle = 'ring',\n    size,\n    color = 'default',\n    speed = 'default',\n    label,\n    ...props\n  }, ref) => {\n    const resolvedSize = size || 'default'\n\n    const orbitMap = {\n      ring: OrbitSpinner,\n      dots: OrbitDotsSpinner,\n      cube: OrbitCubeSpinner,\n      flip: OrbitFlipSpinner,\n      morph: OrbitMorphSpinner,\n    } as const\n\n    return (\n      <div\n        ref={ref}\n        role=\"status\"\n        aria-label={label || 'Loading'}\n        className={cn(spinnerVariants({ size }), className)}\n        {...props}\n      >\n        {variant === 'ring' && (\n          <RingSpinner size={resolvedSize} color={color} speed={speed} />\n        )}\n        {variant === 'dots' && (\n          <DotsSpinner size={resolvedSize} color={color} speed={speed} />\n        )}\n        {variant === 'bars' && (\n          <BarsSpinner size={resolvedSize} color={color} speed={speed} />\n        )}\n        {variant === 'orbit' && (() => {\n          const OrbitComponent = orbitMap[orbitStyle]\n          return <OrbitComponent size={resolvedSize} color={color} speed={speed} />\n        })()}\n      </div>\n    )\n  }\n)\nSpinner.displayName = 'Spinner'\n\n// ============================================================================\n// Ring Spinner (SVG circle with animate-spin)\n// ============================================================================\n\nfunction RingSpinner({ size, color, speed }: {\n  size: 'sm' | 'default' | 'lg'\n  color: 'default' | 'primary' | 'current'\n  speed: 'slow' | 'default' | 'fast'\n}) {\n  const diameter = RING_SIZES[size]\n  const stroke = RING_STROKE[size]\n  const r = (RING_VIEWBOX - stroke) / 2\n  const circumference = 2 * Math.PI * r\n\n  return (\n    <svg\n      viewBox={`0 0 ${RING_VIEWBOX} ${RING_VIEWBOX}`}\n      width={diameter}\n      height={diameter}\n      fill=\"none\"\n      className=\"animate-spin\"\n      style={{ animationDuration: `${SPEED_MS[speed]}ms` }}\n    >\n      {/* Track */}\n      <circle\n        cx={RING_CENTER}\n        cy={RING_CENTER}\n        r={r}\n        className=\"stroke-border\"\n        strokeWidth={stroke}\n      />\n      {/* Indicator */}\n      <circle\n        cx={RING_CENTER}\n        cy={RING_CENTER}\n        r={r}\n        className={strokeColorMap[color]}\n        strokeWidth={stroke}\n        strokeDasharray={circumference}\n        strokeDashoffset={circumference * 0.75}\n        strokeLinecap=\"round\"\n      />\n    </svg>\n  )\n}\n\n// ============================================================================\n// Dots Spinner (3 pulsing dots)\n// ============================================================================\n\nfunction DotsSpinner({ size, color, speed }: {\n  size: 'sm' | 'default' | 'lg'\n  color: 'default' | 'primary' | 'current'\n  speed: 'slow' | 'default' | 'fast'\n}) {\n  const dotSize = DOT_SIZES[size]\n  const gap = DOT_GAP[size]\n\n  return (\n    <div className=\"inline-flex items-center\" style={{ gap }}>\n      {Array.from({ length: DOT_COUNT }, (_, i) => (\n        <div\n          key={i}\n          className={cn(\n            'rounded-full animate-spinner-dot',\n            bgColorMap[color],\n          )}\n          style={{\n            width: dotSize,\n            height: dotSize,\n            animationDuration: `${SPEED_MS[speed]}ms`,\n            animationDelay: `${i * (SPEED_MS[speed] / DOT_COUNT / 1.5)}ms`,\n          }}\n        />\n      ))}\n    </div>\n  )\n}\n\n// ============================================================================\n// Bars Spinner (4 pulsing bars)\n// ============================================================================\n\nfunction BarsSpinner({ size, color, speed }: {\n  size: 'sm' | 'default' | 'lg'\n  color: 'default' | 'primary' | 'current'\n  speed: 'slow' | 'default' | 'fast'\n}) {\n  const barWidth = BAR_WIDTHS[size]\n  const barHeight = BAR_HEIGHTS[size]\n  const gap = BAR_GAP[size]\n\n  return (\n    <div className=\"inline-flex items-center\" style={{ gap, height: barHeight }}>\n      {Array.from({ length: BAR_COUNT }, (_, i) => (\n        <div\n          key={i}\n          className={cn(\n            'rounded-full animate-spinner-bar origin-center',\n            bgColorMap[color],\n          )}\n          style={{\n            width: barWidth,\n            height: barHeight,\n            animationDuration: `${SPEED_MS[speed]}ms`,\n            animationDelay: `${i * (SPEED_MS[speed] / BAR_COUNT / 1.5)}ms`,\n          }}\n        />\n      ))}\n    </div>\n  )\n}\n\n// ============================================================================\n// Orbit Spinner (3D rotating ring)\n// ============================================================================\n\nconst orbitTextColorMap = {\n  default: 'text-foreground',\n  primary: 'text-primary',\n  current: '',\n} as const\n\nfunction OrbitSpinner({ size, color, speed }: {\n  size: 'sm' | 'default' | 'lg'\n  color: 'default' | 'primary' | 'current'\n  speed: 'slow' | 'default' | 'fast'\n}) {\n  const diameter = ORBIT_SIZES[size]\n  const stroke = ORBIT_STROKE[size]\n  const r = (RING_VIEWBOX - stroke * 2) / 2\n  const circumference = 2 * Math.PI * r\n\n  return (\n    <div\n      className={cn(orbitTextColorMap[color])}\n      style={{\n        width: diameter,\n        height: diameter,\n        perspective: diameter * 3,\n        position: 'relative',\n      }}\n    >\n      {/* Ring 1 — solid, Y-axis rotation */}\n      <svg\n        viewBox={`0 0 ${RING_VIEWBOX} ${RING_VIEWBOX}`}\n        width={diameter}\n        height={diameter}\n        fill=\"none\"\n        className=\"absolute inset-0 animate-spinner-orbit\"\n        style={{ animationDuration: `${ORBIT_SPEED_MS[speed]}ms` }}\n      >\n        <circle\n          cx={RING_CENTER}\n          cy={RING_CENTER}\n          r={r}\n          stroke=\"currentColor\"\n          strokeWidth={stroke}\n        />\n      </svg>\n      {/* Ring 2 — solid, perpendicular, reverse direction */}\n      <svg\n        viewBox={`0 0 ${RING_VIEWBOX} ${RING_VIEWBOX}`}\n        width={diameter}\n        height={diameter}\n        fill=\"none\"\n        className=\"absolute inset-0 animate-spinner-orbit\"\n        style={{\n          animationDuration: `${ORBIT_SPEED_MS[speed]}ms`,\n          transform: 'rotateZ(90deg)',\n          animationDirection: 'reverse',\n          animationDelay: '-0.4s',\n          opacity: 0.35,\n        }}\n      >\n        <circle\n          cx={RING_CENTER}\n          cy={RING_CENTER}\n          r={r}\n          stroke=\"currentColor\"\n          strokeWidth={stroke}\n        />\n      </svg>\n    </div>\n  )\n}\n\n// ============================================================================\n// Orbit Dots — 3 dots orbiting in 3D path\n// ============================================================================\n\n/** Orbit dot size per spinner size */\nconst ORBIT_DOT_SIZE = { sm: 3, default: 4, lg: 6 } as const\n\nfunction OrbitDotsSpinner({ size, color, speed }: {\n  size: 'sm' | 'default' | 'lg'\n  color: 'default' | 'primary' | 'current'\n  speed: 'slow' | 'default' | 'fast'\n}) {\n  const diameter = ORBIT_SIZES[size]\n  const dotSize = ORBIT_DOT_SIZE[size]\n  const orbitRadius = (diameter - dotSize) / 2\n\n  return (\n    <div\n      className={cn(orbitTextColorMap[color])}\n      style={{\n        width: diameter,\n        height: diameter,\n        perspective: diameter * 3,\n        position: 'relative',\n      }}\n    >\n      <div\n        className=\"animate-spinner-orbit\"\n        style={{\n          animationDuration: `${ORBIT_SPEED_MS[speed]}ms`,\n          width: '100%',\n          height: '100%',\n          position: 'relative',\n          transformStyle: 'preserve-3d',\n        }}\n      >\n        {[0, 120, 240].map((angle) => (\n          <div\n            key={angle}\n            className=\"absolute rounded-full\"\n            style={{\n              width: dotSize,\n              height: dotSize,\n              backgroundColor: 'currentColor',\n              left: '50%',\n              top: '50%',\n              transform: `translate(-50%, -50%) rotate(${angle}deg) translateX(${orbitRadius}px)`,\n            }}\n          />\n        ))}\n      </div>\n    </div>\n  )\n}\n\n// ============================================================================\n// Orbit Cube — wireframe cube rotating in 3D\n// ============================================================================\n\n/** Cube face sizes per spinner size */\nconst CUBE_SIZES = { sm: 12, default: 18, lg: 26 } as const\n\nfunction OrbitCubeSpinner({ size, color, speed }: {\n  size: 'sm' | 'default' | 'lg'\n  color: 'default' | 'primary' | 'current'\n  speed: 'slow' | 'default' | 'fast'\n}) {\n  const cubeSize = CUBE_SIZES[size]\n  const half = cubeSize / 2\n  const radius = Math.round(cubeSize * 0.15)\n\n  const overlap = 1\n  const faceBase: React.CSSProperties = {\n    position: 'absolute',\n    width: cubeSize + overlap * 2,\n    height: cubeSize + overlap * 2,\n    backgroundColor: 'currentColor',\n    borderRadius: radius,\n    top: -overlap,\n    left: -overlap,\n  }\n\n  return (\n    <div\n      className={cn(orbitTextColorMap[color])}\n      style={{\n        width: cubeSize,\n        height: cubeSize,\n        perspective: cubeSize * 6,\n      }}\n    >\n      {/* Diagonal tilt — shows top + corner for depth */}\n      <div\n        style={{\n          width: cubeSize,\n          height: cubeSize,\n          transform: 'rotateX(-25deg) rotateZ(15deg)',\n          transformStyle: 'preserve-3d',\n        }}\n      >\n        {/* Y-axis rotation */}\n        <div\n          className=\"animate-spinner-orbit\"\n          style={{\n            animationDuration: `${ORBIT_SPEED_MS[speed]}ms`,\n            width: cubeSize,\n            height: cubeSize,\n            position: 'relative',\n            transformStyle: 'preserve-3d',\n          }}\n        >\n          <div style={{ ...faceBase, transform: `translateZ(${half}px)`, opacity: 0.25 }} />\n          <div style={{ ...faceBase, transform: `translateZ(${-half}px)`, opacity: 0.1 }} />\n          <div style={{ ...faceBase, transform: `rotateY(-90deg) translateZ(${half}px)`, opacity: 0.2 }} />\n          <div style={{ ...faceBase, transform: `rotateY(90deg) translateZ(${half}px)`, opacity: 0.2 }} />\n          <div style={{ ...faceBase, transform: `rotateX(90deg) translateZ(${half}px)`, opacity: 0.15 }} />\n          <div style={{ ...faceBase, transform: `rotateX(-90deg) translateZ(${half}px)`, opacity: 0.08 }} />\n        </div>\n      </div>\n    </div>\n  )\n}\n\n// ============================================================================\n// Orbit Flip — rounded square tumbling in 3D\n// ============================================================================\n\n/** Flip square sizes per spinner size */\nconst FLIP_SIZES = { sm: 14, default: 20, lg: 28 } as const\n\nfunction OrbitFlipSpinner({ size, color, speed }: {\n  size: 'sm' | 'default' | 'lg'\n  color: 'default' | 'primary' | 'current'\n  speed: 'slow' | 'default' | 'fast'\n}) {\n  const sqSize = FLIP_SIZES[size]\n\n  return (\n    <div\n      className={cn(orbitTextColorMap[color])}\n      style={{\n        width: sqSize,\n        height: sqSize,\n        perspective: sqSize * 4,\n      }}\n    >\n      <div style={{ transform: 'rotateX(25deg)', transformStyle: 'preserve-3d', width: '100%', height: '100%' }}>\n        <div\n          className=\"animate-spinner-orbit\"\n          style={{\n            animationDuration: `${ORBIT_SPEED_MS[speed]}ms`,\n            width: '100%',\n            height: '100%',\n            borderRadius: '25%',\n            backgroundColor: 'currentColor',\n            opacity: 0.85,\n          }}\n        />\n      </div>\n    </div>\n  )\n}\n\n// ============================================================================\n// Orbit Morph — organic shape morphing + 3D rotation\n// ============================================================================\n\n/** Morph sizes per spinner size */\nconst MORPH_SIZES = { sm: 16, default: 24, lg: 34 } as const\n\nfunction OrbitMorphSpinner({ size, color, speed }: {\n  size: 'sm' | 'default' | 'lg'\n  color: 'default' | 'primary' | 'current'\n  speed: 'slow' | 'default' | 'fast'\n}) {\n  const morphSize = MORPH_SIZES[size]\n\n  return (\n    <div\n      className={cn(orbitTextColorMap[color])}\n      style={{\n        width: morphSize,\n        height: morphSize,\n        perspective: morphSize * 3,\n      }}\n    >\n      <div\n        className=\"animate-spinner-morph\"\n        style={{\n          animationDuration: `${ORBIT_SPEED_MS[speed]}ms`,\n          width: '100%',\n          height: '100%',\n          backgroundColor: 'currentColor',\n          opacity: 0.85,\n        }}\n      />\n    </div>\n  )\n}\n\nexport { Spinner, spinnerVariants }\n"],"mappings":"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","names":[]}

package/dist/components/ui/switch.js

@@ -33,6 +33,7 @@ __export(switch_exports, {
   switchVariants: () => switchVariants
 });
 module.exports = __toCommonJS(switch_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
 var React = __toESM(require("react"));
 var SwitchPrimitive = __toESM(require("@radix-ui/react-switch"));
 var import_class_variance_authority = require("class-variance-authority");
@@ -113,37 +114,40 @@ const Switch = React.forwardRef(({ className, size, label, labelPosition = "end"
   const resolvedDisabled = disabled ?? fieldContext?.disabled;
   const generatedId = React.useId();
   const switchId = id ?? fieldContext?.id ?? generatedId;
-  const switchEl = /* @__PURE__ */ React.createElement(
+  const switchEl = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     SwitchPrimitive.Root,
     {
       ref,
       id: switchId,
       disabled: resolvedDisabled,
       className: (0, import_utils.cn)(switchVariants({ size }), checkedTrackColors[color], className),
-      ...props
-    },
-    /* @__PURE__ */ React.createElement(
-      SwitchPrimitive.Thumb,
-      {
-        className: (0, import_utils.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: (0, import_utils.cn)(
-        iconSizes[resolvedSize],
-        checkedIconColors[color],
-        "hidden group-data-[state=checked]/thumb:block"
-      ) }, checkedIcon), uncheckedIcon && /* @__PURE__ */ React.createElement("span", { className: (0, import_utils.cn)(
-        iconSizes[resolvedSize],
-        "text-text-muted",
-        "hidden group-data-[state=unchecked]/thumb:block"
-      ) }, uncheckedIcon))
-    )
+      ...props,
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        SwitchPrimitive.Thumb,
+        {
+          className: (0, import_utils.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]
+          ),
+          children: (checkedIcon || uncheckedIcon) && resolvedSize !== "sm" && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+            checkedIcon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_utils.cn)(
+              iconSizes[resolvedSize],
+              checkedIconColors[color],
+              "hidden group-data-[state=checked]/thumb:block"
+            ), children: checkedIcon }),
+            uncheckedIcon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_utils.cn)(
+              iconSizes[resolvedSize],
+              "text-text-muted",
+              "hidden group-data-[state=unchecked]/thumb:block"
+            ), children: uncheckedIcon })
+          ] })
+        }
+      )
+    }
   );
   const labelClassName = (0, import_utils.cn)(
     labelSizes[resolvedSize],
@@ -152,17 +156,24 @@ const Switch = React.forwardRef(({ className, size, label, labelPosition = "end"
     resolvedDisabled && "opacity-50 cursor-not-allowed"
   );
   if (startLabel || endLabel) {
-    return /* @__PURE__ */ React.createElement("div", { className: (0, import_utils.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));
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: (0, import_utils.cn)("group/switch flex items-center", gapSizes[resolvedSize]), children: [
+      startLabel && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("label", { htmlFor: switchId, className: labelClassName, children: startLabel }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex items-center", children: switchEl }),
+      endLabel && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("label", { htmlFor: switchId, className: labelClassName, children: endLabel })
+    ] });
   }
   if (!label) return switchEl;
   const isVertical = labelPosition === "top" || labelPosition === "bottom";
   const isReversed = labelPosition === "start" || labelPosition === "top";
-  return /* @__PURE__ */ React.createElement("div", { className: (0, import_utils.cn)(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: (0, import_utils.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));
+  ), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex items-center", children: switchEl }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("label", { htmlFor: switchId, className: labelClassName, children: label })
+  ] });
 });
 Switch.displayName = "Switch";
 // Annotate the CommonJS export names for ESM import in node:

package/dist/components/ui/switch.js.map

@@ -1 +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":[]}
+{"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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAgIU;AA9HV,YAAuB;AACvB,sBAAiC;AACjC,sCAAuC;AACvC,mBAAmB;AACnB,mBAAgC;AAGhC,MAAM,qBAAiB;AAAA,EACrB;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,EAAE,KAAK,GAAG;AAAA,EACV;AAAA,IACE,UAAU;AAAA,MACR,MAAM;AAAA,QACJ,IAAI;AAAA,QACJ,SAAS;AAAA,QACT,IAAI;AAAA,MACN;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,MAAM;AAAA,IACR;AAAA,EACF;AACF;AAGA,MAAM,aAAa;AAAA,EACjB,IAAI;AAAA,EACJ,SAAS;AAAA,EACT,IAAI;AACN;AAGA,MAAM,iBAAiB;AAAA,EACrB,IAAI;AAAA,EACJ,SAAS;AAAA,EACT,IAAI;AACN;AAGA,MAAM,WAAW;AAAA,EACf,IAAI;AAAA;AAAA,EACJ,SAAS;AAAA;AAAA,EACT,IAAI;AAAA;AACN;AAGA,MAAM,aAAa;AAAA,EACjB,IAAI;AAAA;AAAA,EACJ,SAAS;AAAA;AAAA,EACT,IAAI;AAAA;AACN;AAMA,MAAM,qBAAkD;AAAA,EACtD,SAAS;AAAA,EACT,SAAS;AAAA,EACT,SAAS;AAAA,EACT,SAAS;AAAA,EACT,OAAO;AACT;AAGA,MAAM,oBAAiD;AAAA,EACrD,SAAS;AAAA,EACT,SAAS;AAAA,EACT,SAAS;AAAA,EACT,SAAS;AAAA,EACT,OAAO;AACT;AAGA,MAAM,YAAY;AAAA,EAChB,IAAI;AAAA;AAAA,EACJ,SAAS;AAAA;AAAA,EACT,IAAI;AAAA;AACN;AAcA,MAAM,SAAS,MAAM,WAGnB,CAAC,EAAE,WAAW,MAAM,OAAO,gBAAgB,OAAO,YAAY,UAAU,aAAa,eAAe,QAAQ,WAAW,UAAU,IAAI,GAAG,MAAM,GAAG,QAAQ;AACzJ,QAAM,mBAAe,8BAAgB;AACrC,QAAM,eAAe,QAAQ;AAC7B,QAAM,mBAAmB,YAAY,cAAc;AACnD,QAAM,cAAc,MAAM,MAAM;AAChC,QAAM,WAAW,MAAM,cAAc,MAAM;AAE3C,QAAM,WACJ;AAAA,IAAC,gBAAgB;AAAA,IAAhB;AAAA,MACC;AAAA,MACA,IAAI;AAAA,MACJ,UAAU;AAAA,MACV,eAAW,iBAAG,eAAe,EAAE,KAAK,CAAC,GAAG,mBAAmB,KAAK,GAAG,SAAS;AAAA,MAC3E,GAAG;AAAA,MAEJ;AAAA,QAAC,gBAAgB;AAAA,QAAhB;AAAA,UACC,eAAW;AAAA,YACT;AAAA,YACA,UAAU,YAAY,kBAAkB;AAAA,YACxC;AAAA,YACA;AAAA,YACA,WAAW,YAAY;AAAA,YACvB,eAAe,YAAY;AAAA,UAC7B;AAAA,UAEE,0BAAe,kBAAkB,iBAAiB,QAClD,4EACG;AAAA,2BACC,4CAAC,UAAK,eAAW;AAAA,cACf,UAAU,YAAY;AAAA,cACtB,kBAAkB,KAAK;AAAA,cACvB;AAAA,YACF,GACG,uBACH;AAAA,YAED,iBACC,4CAAC,UAAK,eAAW;AAAA,cACf,UAAU,YAAY;AAAA,cACtB;AAAA,cACA;AAAA,YACF,GACG,yBACH;AAAA,aAEJ;AAAA;AAAA,MAEJ;AAAA;AAAA,EACF;AAGF,QAAM,qBAAiB;AAAA,IACrB,WAAW,YAAY;AAAA,IACvB;AAAA,IACA;AAAA,IACA,oBAAoB;AAAA,EACtB;AAGA,MAAI,cAAc,UAAU;AAC1B,WACE,6CAAC,SAAI,eAAW,iBAAG,kCAAkC,SAAS,YAAY,CAAC,GACxE;AAAA,oBACC,4CAAC,WAAM,SAAS,UAAU,WAAW,gBAClC,sBACH;AAAA,MAEF,4CAAC,SAAI,WAAU,qBACZ,oBACH;AAAA,MACC,YACC,4CAAC,WAAM,SAAS,UAAU,WAAW,gBAClC,oBACH;AAAA,OAEJ;AAAA,EAEJ;AAEA,MAAI,CAAC,MAAO,QAAO;AAEnB,QAAM,aAAa,kBAAkB,SAAS,kBAAkB;AAChE,QAAM,aAAa,kBAAkB,WAAW,kBAAkB;AAElE,SACE,6CAAC,SAAI,eAAW;AAAA,IACd;AAAA,IACA,aAAa,iCAAiC;AAAA,IAC9C,eAAe,aAAa,qBAAqB;AAAA,IACjD,CAAC,cAAc,SAAS,YAAY;AAAA,EACtC,GACE;AAAA,gDAAC,SAAI,WAAU,qBACZ,oBACH;AAAA,IACA,4CAAC,WAAM,SAAS,UAAU,WAAW,gBAClC,iBACH;AAAA,KACF;AAEJ,CAAC;AACD,OAAO,cAAc;","names":[]}

package/dist/components/ui/switch.mjs

@@ -1,4 +1,5 @@
 "use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import * as SwitchPrimitive from "@radix-ui/react-switch";
 import { cva } from "class-variance-authority";
@@ -79,37 +80,40 @@ const Switch = React.forwardRef(({ className, size, label, labelPosition = "end"
   const resolvedDisabled = disabled ?? fieldContext?.disabled;
   const generatedId = React.useId();
   const switchId = id ?? fieldContext?.id ?? generatedId;
-  const switchEl = /* @__PURE__ */ React.createElement(
+  const switchEl = /* @__PURE__ */ jsx(
     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))
-    )
+      ...props,
+      children: /* @__PURE__ */ jsx(
+        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]
+          ),
+          children: (checkedIcon || uncheckedIcon) && resolvedSize !== "sm" && /* @__PURE__ */ jsxs(Fragment, { children: [
+            checkedIcon && /* @__PURE__ */ jsx("span", { className: cn(
+              iconSizes[resolvedSize],
+              checkedIconColors[color],
+              "hidden group-data-[state=checked]/thumb:block"
+            ), children: checkedIcon }),
+            uncheckedIcon && /* @__PURE__ */ jsx("span", { className: cn(
+              iconSizes[resolvedSize],
+              "text-text-muted",
+              "hidden group-data-[state=unchecked]/thumb:block"
+            ), children: uncheckedIcon })
+          ] })
+        }
+      )
+    }
   );
   const labelClassName = cn(
     labelSizes[resolvedSize],
@@ -118,17 +122,24 @@ const Switch = React.forwardRef(({ className, size, label, labelPosition = "end"
     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));
+    return /* @__PURE__ */ jsxs("div", { className: cn("group/switch flex items-center", gapSizes[resolvedSize]), children: [
+      startLabel && /* @__PURE__ */ jsx("label", { htmlFor: switchId, className: labelClassName, children: startLabel }),
+      /* @__PURE__ */ jsx("div", { className: "flex items-center", children: switchEl }),
+      endLabel && /* @__PURE__ */ jsx("label", { htmlFor: switchId, className: labelClassName, children: endLabel })
+    ] });
   }
   if (!label) return switchEl;
   const isVertical = labelPosition === "top" || labelPosition === "bottom";
   const isReversed = labelPosition === "start" || labelPosition === "top";
-  return /* @__PURE__ */ React.createElement("div", { className: cn(
+  return /* @__PURE__ */ jsxs("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));
+  ), children: [
+    /* @__PURE__ */ jsx("div", { className: "flex items-center", children: switchEl }),
+    /* @__PURE__ */ jsx("label", { htmlFor: switchId, className: labelClassName, children: label })
+  ] });
 });
 Switch.displayName = "Switch";
 export {

package/dist/components/ui/switch.mjs.map

@@ -1 +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":[]}
+{"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":[]}

package/dist/components/ui/table.js

@@ -39,6 +39,7 @@ __export(table_exports, {
   TableRow: () => TableRow
 });
 module.exports = __toCommonJS(table_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
 var React = __toESM(require("react"));
 var import_class_variance_authority = require("class-variance-authority");
 var import_utils = require("../../lib/utils");
@@ -74,19 +75,19 @@ const tableVariants = (0, import_class_variance_authority.cva)(
   }
 );
 const Table = React.forwardRef(
-  ({ className, size = "default", variant = "default", stickyHeader = false, wrapperClassName, ...props }, ref) => /* @__PURE__ */ React.createElement(TableContext.Provider, { value: { size, variant, stickyHeader } }, /* @__PURE__ */ React.createElement("div", { className: (0, import_utils.cn)("relative w-full overflow-auto", wrapperClassName) }, /* @__PURE__ */ React.createElement(
+  ({ className, size = "default", variant = "default", stickyHeader = false, wrapperClassName, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableContext.Provider, { value: { size, variant, stickyHeader }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: (0, import_utils.cn)("relative w-full overflow-auto", wrapperClassName), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     "table",
     {
       ref,
       className: (0, import_utils.cn)(tableVariants({ variant }), className),
       ...props
     }
-  )))
+  ) }) })
 );
 Table.displayName = "Table";
 const TableHeader = React.forwardRef(({ className, ...props }, ref) => {
   const { stickyHeader } = React.useContext(TableContext);
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     "thead",
     {
       ref,
@@ -102,7 +103,7 @@ const TableHeader = React.forwardRef(({ className, ...props }, ref) => {
 TableHeader.displayName = "TableHeader";
 const TableBody = React.forwardRef(({ className, ...props }, ref) => {
   const { variant } = React.useContext(TableContext);
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     "tbody",
     {
       ref,
@@ -116,7 +117,7 @@ const TableBody = React.forwardRef(({ className, ...props }, ref) => {
   );
 });
 TableBody.displayName = "TableBody";
-const TableFooter = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
+const TableFooter = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
   "tfoot",
   {
     ref,
@@ -129,7 +130,7 @@ const TableFooter = React.forwardRef(({ className, ...props }, ref) => /* @__PUR
 ));
 TableFooter.displayName = "TableFooter";
 const TableRow = React.forwardRef(
-  ({ className, interactive = false, selected = false, ...props }, ref) => /* @__PURE__ */ React.createElement(
+  ({ className, interactive = false, selected = false, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     "tr",
     {
       ref,
@@ -145,28 +146,30 @@ const TableRow = React.forwardRef(
 );
 TableRow.displayName = "TableRow";
 const defaultSortIcons = {
-  asc: /* @__PURE__ */ React.createElement("svg", { className: "icon-xs", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2, "aria-hidden": "true" }, /* @__PURE__ */ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M5 15l7-7 7 7" })),
-  desc: /* @__PURE__ */ React.createElement("svg", { className: "icon-xs", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2, "aria-hidden": "true" }, /* @__PURE__ */ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M19 9l-7 7-7-7" })),
-  default: /* @__PURE__ */ React.createElement("svg", { className: "icon-xs", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2, "aria-hidden": "true" }, /* @__PURE__ */ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M7 16V4m0 0L3 8m4-4l4 4m6 0v12m0 0l4-4m-4 4l-4-4" }))
+  asc: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { className: "icon-xs", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2, "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M5 15l7-7 7 7" }) }),
+  desc: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { className: "icon-xs", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2, "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M19 9l-7 7-7-7" }) }),
+  default: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { className: "icon-xs", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2, "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M7 16V4m0 0L3 8m4-4l4 4m6 0v12m0 0l4-4m-4 4l-4-4" }) })
 };
 const TableHead = React.forwardRef(
   ({ className, align = "left", sortable = false, sortDirection = null, onSort, sortIcon, children, ...props }, ref) => {
     const { size } = React.useContext(TableContext);
     const icons = { ...defaultSortIcons, ...sortIcon };
-    const content = sortable ? /* @__PURE__ */ React.createElement(
+    const content = sortable ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
       "button",
       {
         type: "button",
         className: "inline-flex items-center gap-1.5 hover:text-foreground transition-colors duration-fast group",
-        onClick: onSort
-      },
-      children,
-      /* @__PURE__ */ React.createElement("span", { className: (0, import_utils.cn)(
-        "shrink-0 transition-colors duration-fast",
-        sortDirection ? "text-foreground" : "text-text-muted"
-      ) }, sortDirection === "asc" ? icons.asc : sortDirection === "desc" ? icons.desc : icons.default)
+        onClick: onSort,
+        children: [
+          children,
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_utils.cn)(
+            "shrink-0 transition-colors duration-fast",
+            sortDirection ? "text-foreground" : "text-text-muted"
+          ), children: sortDirection === "asc" ? icons.asc : sortDirection === "desc" ? icons.desc : icons.default })
+        ]
+      }
     ) : children;
-    return /* @__PURE__ */ React.createElement(
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       "th",
       {
         ref,
@@ -180,9 +183,9 @@ const TableHead = React.forwardRef(
           className
         ),
         "aria-sort": sortDirection === "asc" ? "ascending" : sortDirection === "desc" ? "descending" : void 0,
-        ...props
-      },
-      content
+        ...props,
+        children: content
+      }
     );
   }
 );
@@ -190,7 +193,7 @@ TableHead.displayName = "TableHead";
 const TableCell = React.forwardRef(
   ({ className, align = "left", ...props }, ref) => {
     const { size } = React.useContext(TableContext);
-    return /* @__PURE__ */ React.createElement(
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       "td",
       {
         ref,
@@ -208,7 +211,7 @@ const TableCell = React.forwardRef(
   }
 );
 TableCell.displayName = "TableCell";
-const TableCaption = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
+const TableCaption = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
   "caption",
   {
     ref,