@karakuri-ui/react 0.2.3 → 0.3.0

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

@@ -0,0 +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":[]}

package/dist/components/ui/spinner.mjs

@@ -0,0 +1,436 @@
+"use client";
+import * as React from "react";
+import { cva } from "class-variance-authority";
+import { cn } from "../../lib/utils";
+const RING_SIZES = {
+  sm: 16,
+  default: 24,
+  lg: 32
+};
+const RING_STROKE = {
+  sm: 2,
+  default: 2.5,
+  lg: 3
+};
+const DOT_SIZES = {
+  sm: 4,
+  default: 6,
+  lg: 8
+};
+const DOT_GAP = {
+  sm: 3,
+  default: 4,
+  lg: 5
+};
+const BAR_WIDTHS = {
+  sm: 2,
+  default: 3,
+  lg: 4
+};
+const BAR_HEIGHTS = {
+  sm: 12,
+  default: 16,
+  lg: 24
+};
+const BAR_GAP = {
+  sm: 2,
+  default: 3,
+  lg: 4
+};
+const ORBIT_SIZES = {
+  sm: 22,
+  default: 32,
+  lg: 44
+};
+const ORBIT_STROKE = {
+  sm: 2.5,
+  default: 3,
+  lg: 3.5
+};
+const DOT_COUNT = 3;
+const BAR_COUNT = 4;
+const RING_VIEWBOX = 24;
+const RING_CENTER = 12;
+const strokeColorMap = {
+  default: "stroke-foreground",
+  primary: "stroke-primary",
+  current: "stroke-current"
+};
+const bgColorMap = {
+  default: "bg-foreground",
+  primary: "bg-primary",
+  current: "bg-current"
+};
+const SPEED_MS = { slow: 1500, default: 1e3, fast: 750 };
+const ORBIT_SPEED_MS = { slow: 2e3, default: 1500, fast: 1e3 };
+const spinnerVariants = cva(
+  "inline-flex items-center justify-center shrink-0",
+  {
+    variants: {
+      size: {
+        sm: "",
+        default: "",
+        lg: ""
+      }
+    },
+    defaultVariants: {
+      size: "default"
+    }
+  }
+);
+const Spinner = React.forwardRef(
+  ({
+    className,
+    variant = "ring",
+    orbitStyle = "ring",
+    size,
+    color = "default",
+    speed = "default",
+    label,
+    ...props
+  }, ref) => {
+    const resolvedSize = size || "default";
+    const orbitMap = {
+      ring: OrbitSpinner,
+      dots: OrbitDotsSpinner,
+      cube: OrbitCubeSpinner,
+      flip: OrbitFlipSpinner,
+      morph: OrbitMorphSpinner
+    };
+    return /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        ref,
+        role: "status",
+        "aria-label": label || "Loading",
+        className: cn(spinnerVariants({ size }), className),
+        ...props
+      },
+      variant === "ring" && /* @__PURE__ */ React.createElement(RingSpinner, { size: resolvedSize, color, speed }),
+      variant === "dots" && /* @__PURE__ */ React.createElement(DotsSpinner, { size: resolvedSize, color, speed }),
+      variant === "bars" && /* @__PURE__ */ React.createElement(BarsSpinner, { size: resolvedSize, color, speed }),
+      variant === "orbit" && (() => {
+        const OrbitComponent = orbitMap[orbitStyle];
+        return /* @__PURE__ */ React.createElement(OrbitComponent, { size: resolvedSize, color, speed });
+      })()
+    );
+  }
+);
+Spinner.displayName = "Spinner";
+function RingSpinner({ size, color, speed }) {
+  const diameter = RING_SIZES[size];
+  const stroke = RING_STROKE[size];
+  const r = (RING_VIEWBOX - stroke) / 2;
+  const circumference = 2 * Math.PI * r;
+  return /* @__PURE__ */ React.createElement(
+    "svg",
+    {
+      viewBox: `0 0 ${RING_VIEWBOX} ${RING_VIEWBOX}`,
+      width: diameter,
+      height: diameter,
+      fill: "none",
+      className: "animate-spin",
+      style: { animationDuration: `${SPEED_MS[speed]}ms` }
+    },
+    /* @__PURE__ */ React.createElement(
+      "circle",
+      {
+        cx: RING_CENTER,
+        cy: RING_CENTER,
+        r,
+        className: "stroke-border",
+        strokeWidth: stroke
+      }
+    ),
+    /* @__PURE__ */ React.createElement(
+      "circle",
+      {
+        cx: RING_CENTER,
+        cy: RING_CENTER,
+        r,
+        className: strokeColorMap[color],
+        strokeWidth: stroke,
+        strokeDasharray: circumference,
+        strokeDashoffset: circumference * 0.75,
+        strokeLinecap: "round"
+      }
+    )
+  );
+}
+function DotsSpinner({ size, color, speed }) {
+  const dotSize = DOT_SIZES[size];
+  const gap = DOT_GAP[size];
+  return /* @__PURE__ */ React.createElement("div", { className: "inline-flex items-center", style: { gap } }, Array.from({ length: DOT_COUNT }, (_, i) => /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      key: i,
+      className: cn(
+        "rounded-full animate-spinner-dot",
+        bgColorMap[color]
+      ),
+      style: {
+        width: dotSize,
+        height: dotSize,
+        animationDuration: `${SPEED_MS[speed]}ms`,
+        animationDelay: `${i * (SPEED_MS[speed] / DOT_COUNT / 1.5)}ms`
+      }
+    }
+  )));
+}
+function BarsSpinner({ size, color, speed }) {
+  const barWidth = BAR_WIDTHS[size];
+  const barHeight = BAR_HEIGHTS[size];
+  const gap = BAR_GAP[size];
+  return /* @__PURE__ */ React.createElement("div", { className: "inline-flex items-center", style: { gap, height: barHeight } }, Array.from({ length: BAR_COUNT }, (_, i) => /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      key: i,
+      className: cn(
+        "rounded-full animate-spinner-bar origin-center",
+        bgColorMap[color]
+      ),
+      style: {
+        width: barWidth,
+        height: barHeight,
+        animationDuration: `${SPEED_MS[speed]}ms`,
+        animationDelay: `${i * (SPEED_MS[speed] / BAR_COUNT / 1.5)}ms`
+      }
+    }
+  )));
+}
+const orbitTextColorMap = {
+  default: "text-foreground",
+  primary: "text-primary",
+  current: ""
+};
+function OrbitSpinner({ size, color, speed }) {
+  const diameter = ORBIT_SIZES[size];
+  const stroke = ORBIT_STROKE[size];
+  const r = (RING_VIEWBOX - stroke * 2) / 2;
+  const circumference = 2 * Math.PI * r;
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      className: cn(orbitTextColorMap[color]),
+      style: {
+        width: diameter,
+        height: diameter,
+        perspective: diameter * 3,
+        position: "relative"
+      }
+    },
+    /* @__PURE__ */ React.createElement(
+      "svg",
+      {
+        viewBox: `0 0 ${RING_VIEWBOX} ${RING_VIEWBOX}`,
+        width: diameter,
+        height: diameter,
+        fill: "none",
+        className: "absolute inset-0 animate-spinner-orbit",
+        style: { animationDuration: `${ORBIT_SPEED_MS[speed]}ms` }
+      },
+      /* @__PURE__ */ React.createElement(
+        "circle",
+        {
+          cx: RING_CENTER,
+          cy: RING_CENTER,
+          r,
+          stroke: "currentColor",
+          strokeWidth: stroke
+        }
+      )
+    ),
+    /* @__PURE__ */ React.createElement(
+      "svg",
+      {
+        viewBox: `0 0 ${RING_VIEWBOX} ${RING_VIEWBOX}`,
+        width: diameter,
+        height: diameter,
+        fill: "none",
+        className: "absolute inset-0 animate-spinner-orbit",
+        style: {
+          animationDuration: `${ORBIT_SPEED_MS[speed]}ms`,
+          transform: "rotateZ(90deg)",
+          animationDirection: "reverse",
+          animationDelay: "-0.4s",
+          opacity: 0.35
+        }
+      },
+      /* @__PURE__ */ React.createElement(
+        "circle",
+        {
+          cx: RING_CENTER,
+          cy: RING_CENTER,
+          r,
+          stroke: "currentColor",
+          strokeWidth: stroke
+        }
+      )
+    )
+  );
+}
+const ORBIT_DOT_SIZE = { sm: 3, default: 4, lg: 6 };
+function OrbitDotsSpinner({ size, color, speed }) {
+  const diameter = ORBIT_SIZES[size];
+  const dotSize = ORBIT_DOT_SIZE[size];
+  const orbitRadius = (diameter - dotSize) / 2;
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      className: cn(orbitTextColorMap[color]),
+      style: {
+        width: diameter,
+        height: diameter,
+        perspective: diameter * 3,
+        position: "relative"
+      }
+    },
+    /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        className: "animate-spinner-orbit",
+        style: {
+          animationDuration: `${ORBIT_SPEED_MS[speed]}ms`,
+          width: "100%",
+          height: "100%",
+          position: "relative",
+          transformStyle: "preserve-3d"
+        }
+      },
+      [0, 120, 240].map((angle) => /* @__PURE__ */ React.createElement(
+        "div",
+        {
+          key: angle,
+          className: "absolute rounded-full",
+          style: {
+            width: dotSize,
+            height: dotSize,
+            backgroundColor: "currentColor",
+            left: "50%",
+            top: "50%",
+            transform: `translate(-50%, -50%) rotate(${angle}deg) translateX(${orbitRadius}px)`
+          }
+        }
+      ))
+    )
+  );
+}
+const CUBE_SIZES = { sm: 12, default: 18, lg: 26 };
+function OrbitCubeSpinner({ size, color, speed }) {
+  const cubeSize = CUBE_SIZES[size];
+  const half = cubeSize / 2;
+  const radius = Math.round(cubeSize * 0.15);
+  const overlap = 1;
+  const faceBase = {
+    position: "absolute",
+    width: cubeSize + overlap * 2,
+    height: cubeSize + overlap * 2,
+    backgroundColor: "currentColor",
+    borderRadius: radius,
+    top: -overlap,
+    left: -overlap
+  };
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      className: cn(orbitTextColorMap[color]),
+      style: {
+        width: cubeSize,
+        height: cubeSize,
+        perspective: cubeSize * 6
+      }
+    },
+    /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        style: {
+          width: cubeSize,
+          height: cubeSize,
+          transform: "rotateX(-25deg) rotateZ(15deg)",
+          transformStyle: "preserve-3d"
+        }
+      },
+      /* @__PURE__ */ React.createElement(
+        "div",
+        {
+          className: "animate-spinner-orbit",
+          style: {
+            animationDuration: `${ORBIT_SPEED_MS[speed]}ms`,
+            width: cubeSize,
+            height: cubeSize,
+            position: "relative",
+            transformStyle: "preserve-3d"
+          }
+        },
+        /* @__PURE__ */ React.createElement("div", { style: { ...faceBase, transform: `translateZ(${half}px)`, opacity: 0.25 } }),
+        /* @__PURE__ */ React.createElement("div", { style: { ...faceBase, transform: `translateZ(${-half}px)`, opacity: 0.1 } }),
+        /* @__PURE__ */ React.createElement("div", { style: { ...faceBase, transform: `rotateY(-90deg) translateZ(${half}px)`, opacity: 0.2 } }),
+        /* @__PURE__ */ React.createElement("div", { style: { ...faceBase, transform: `rotateY(90deg) translateZ(${half}px)`, opacity: 0.2 } }),
+        /* @__PURE__ */ React.createElement("div", { style: { ...faceBase, transform: `rotateX(90deg) translateZ(${half}px)`, opacity: 0.15 } }),
+        /* @__PURE__ */ React.createElement("div", { style: { ...faceBase, transform: `rotateX(-90deg) translateZ(${half}px)`, opacity: 0.08 } })
+      )
+    )
+  );
+}
+const FLIP_SIZES = { sm: 14, default: 20, lg: 28 };
+function OrbitFlipSpinner({ size, color, speed }) {
+  const sqSize = FLIP_SIZES[size];
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      className: cn(orbitTextColorMap[color]),
+      style: {
+        width: sqSize,
+        height: sqSize,
+        perspective: sqSize * 4
+      }
+    },
+    /* @__PURE__ */ React.createElement("div", { style: { transform: "rotateX(25deg)", transformStyle: "preserve-3d", width: "100%", height: "100%" } }, /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        className: "animate-spinner-orbit",
+        style: {
+          animationDuration: `${ORBIT_SPEED_MS[speed]}ms`,
+          width: "100%",
+          height: "100%",
+          borderRadius: "25%",
+          backgroundColor: "currentColor",
+          opacity: 0.85
+        }
+      }
+    ))
+  );
+}
+const MORPH_SIZES = { sm: 16, default: 24, lg: 34 };
+function OrbitMorphSpinner({ size, color, speed }) {
+  const morphSize = MORPH_SIZES[size];
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      className: cn(orbitTextColorMap[color]),
+      style: {
+        width: morphSize,
+        height: morphSize,
+        perspective: morphSize * 3
+      }
+    },
+    /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        className: "animate-spinner-morph",
+        style: {
+          animationDuration: `${ORBIT_SPEED_MS[speed]}ms`,
+          width: "100%",
+          height: "100%",
+          backgroundColor: "currentColor",
+          opacity: 0.85
+        }
+      }
+    )
+  );
+}
+export {
+  Spinner,
+  spinnerVariants
+};
+//# sourceMappingURL=spinner.mjs.map

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

@@ -0,0 +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":[]}

package/dist/components/ui/switch.d.mts

@@ -0,0 +1,22 @@
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import * as React from 'react';
+import * as SwitchPrimitive from '@radix-ui/react-switch';
+import { VariantProps } from 'class-variance-authority';
+
+declare const switchVariants: (props?: ({
+    size?: "default" | "sm" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type SwitchLabelPosition = 'start' | 'end' | 'top' | 'bottom';
+type SwitchColor = 'default' | 'primary' | 'success' | 'warning' | 'error';
+interface SwitchProps extends React.ComponentPropsWithoutRef<typeof SwitchPrimitive.Root>, VariantProps<typeof switchVariants> {
+    label?: string;
+    labelPosition?: SwitchLabelPosition;
+    startLabel?: string;
+    endLabel?: string;
+    checkedIcon?: React.ReactNode;
+    uncheckedIcon?: React.ReactNode;
+    color?: SwitchColor;
+}
+declare const Switch: React.ForwardRefExoticComponent<SwitchProps & React.RefAttributes<HTMLButtonElement>>;
+
+export { Switch, type SwitchColor, type SwitchLabelPosition, type SwitchProps, switchVariants };

package/dist/components/ui/switch.d.ts

@@ -0,0 +1,22 @@
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import * as React from 'react';
+import * as SwitchPrimitive from '@radix-ui/react-switch';
+import { VariantProps } from 'class-variance-authority';
+
+declare const switchVariants: (props?: ({
+    size?: "default" | "sm" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type SwitchLabelPosition = 'start' | 'end' | 'top' | 'bottom';
+type SwitchColor = 'default' | 'primary' | 'success' | 'warning' | 'error';
+interface SwitchProps extends React.ComponentPropsWithoutRef<typeof SwitchPrimitive.Root>, VariantProps<typeof switchVariants> {
+    label?: string;
+    labelPosition?: SwitchLabelPosition;
+    startLabel?: string;
+    endLabel?: string;
+    checkedIcon?: React.ReactNode;
+    uncheckedIcon?: React.ReactNode;
+    color?: SwitchColor;
+}
+declare const Switch: React.ForwardRefExoticComponent<SwitchProps & React.RefAttributes<HTMLButtonElement>>;
+
+export { Switch, type SwitchColor, type SwitchLabelPosition, type SwitchProps, switchVariants };