@epilot/volt-ui-experimental-griffel 0.1.2 → 0.2.1

package/dist/components/skeleton/skeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton.js","sources":["../../../src/components/skeleton/skeleton.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { mergeClasses, shorthands } from \"@griffel/core\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeVoltStyles } from \"../../styles/make-styles\"\nimport * as tokens from \"../../tokens\"\nimport { ensurePaletteTokens } from \"../../tokens/install\"\n\n/**\n * Skeleton — v1's loading placeholder ported to Griffel atoms.\n *\n * Two variants, `default` and `ai`. `default` is a gray block that pulses; `ai` is a gray field\n * that renders three decorative colour spots drifting behind the content. The spots are ported from\n * v1's global `skeleton-ai-spot-*` classes in `styles/utilities.css`, including their exact\n * gradients, durations (10s / 12s / 14s) and easing.\n *\n * The keyframes are the object form, so Griffel hashes each one from its content — a hand-authored\n * global `@keyframes` would collide across two co-resident copies of this package. The pulse is a\n * single three-stop animation; each spot carries its own.\n *\n * The spots are `purple-a4`, `pink-a4` and `indigo-a4`, none of which is a core token family\n * (accent / gray / error / warning / success / info ship in the core sheet; everything else lives\n * in the palette sheet, which is not loaded by default). `ai` therefore calls\n * `ensurePaletteTokens()` — CONVENTIONS rule 3. There is no `color` prop, so no inline custom\n * properties: the spot colours are constant and live inside the style objects.\n */\n\nexport type SkeletonVariant = \"default\" | \"ai\"\n\nconst useStyles = makeVoltStyles({\n  default: {\n    backgroundColor: tokens.gray4,\n    ...shorthands.borderRadius(tokens.radiusMd),\n    animationName: {\n      \"0%,100%\": { opacity: 1 },\n      \"50%\": { opacity: 0.5 },\n    },\n    animationDuration: \"2s\",\n    animationTimingFunction: \"cubic-bezier(0.4,0,0.6,1)\",\n    animationIterationCount: \"infinite\",\n  },\n  ai: {\n    backgroundColor: tokens.gray3,\n    ...shorthands.borderRadius(tokens.radiusMd),\n    position: \"relative\",\n    ...shorthands.overflow(\"hidden\"),\n  },\n  spot: {\n    position: \"absolute\",\n    inset: \"-50%\",\n    ...shorthands.borderRadius(\"50%\"),\n    opacity: 0.6,\n    filter: \"blur(18px)\",\n    pointerEvents: \"none\",\n  },\n  spot1: {\n    backgroundImage: `radial-gradient(circle, ${tokens.purpleA4} 0%, transparent 65%)`,\n    animationName: {\n      \"0%,100%\": { transform: \"translate(-20%, 0%) scale(1)\" },\n      \"33%\": { transform: \"translate(40%, -25%) scale(1.2)\" },\n      \"66%\": { transform: \"translate(-10%, 30%) scale(0.9)\" },\n    },\n    animationDuration: \"10s\",\n    animationTimingFunction: \"ease-in-out\",\n    animationIterationCount: \"infinite\",\n  },\n  spot2: {\n    backgroundImage: `radial-gradient(circle, ${tokens.pinkA4} 0%, transparent 65%)`,\n    animationName: {\n      \"0%,100%\": { transform: \"translate(20%, 0%) scale(1.1)\" },\n      \"33%\": { transform: \"translate(-35%, 25%) scale(0.9)\" },\n      \"66%\": { transform: \"translate(30%, -20%) scale(1.3)\" },\n    },\n    animationDuration: \"12s\",\n    animationTimingFunction: \"ease-in-out\",\n    animationIterationCount: \"infinite\",\n  },\n  spot3: {\n    backgroundImage: `radial-gradient(circle, ${tokens.indigoA4} 0%, transparent 65%)`,\n    animationName: {\n      \"0%,100%\": { transform: \"translate(0%, 20%) scale(1)\" },\n      \"33%\": { transform: \"translate(25%, -30%) scale(1.2)\" },\n      \"66%\": { transform: \"translate(-30%, 10%) scale(0.8)\" },\n    },\n    animationDuration: \"14s\",\n    animationTimingFunction: \"ease-in-out\",\n    animationIterationCount: \"infinite\",\n  },\n})\n\nexport type SkeletonProps = React.ComponentProps<\"div\"> & {\n  variant?: SkeletonVariant\n}\n\nexport const Skeleton = React.forwardRef<HTMLDivElement, SkeletonProps>(\n  function Skeleton(\n    { variant = \"default\", className, children, ...props },\n    ref\n  ) {\n    // The decorative families live in the palette sheet, which is not installed by default\n    // (CONVENTIONS rule 3). It has to be present whenever this component renders at all.\n    ensurePaletteTokens()\n\n    const styles = useStyles()\n\n    if (variant === \"ai\") {\n      return (\n        <div\n          ref={ref}\n          data-slot=\"skeleton\"\n          {...{ [SLOT_ATTR]: \"skeleton\" }}\n          className={mergeClasses(styles.ai, className)}\n          {...props}\n        >\n          <span\n            aria-hidden=\"true\"\n            className={mergeClasses(styles.spot, styles.spot1)}\n          />\n          <span\n            aria-hidden=\"true\"\n            className={mergeClasses(styles.spot, styles.spot2)}\n          />\n          <span\n            aria-hidden=\"true\"\n            className={mergeClasses(styles.spot, styles.spot3)}\n          />\n          {children}\n        </div>\n      )\n    }\n\n    return (\n      <div\n        ref={ref}\n        data-slot=\"skeleton\"\n        {...{ [SLOT_ATTR]: \"skeleton\" }}\n        className={mergeClasses(styles.default, className)}\n        {...props}\n      >\n        {children}\n      </div>\n    )\n  }\n)\n"],"names":["useStyles","makeVoltStyles","tokens.gray4","shorthands","tokens.radiusMd","tokens.gray3","tokens.purpleA4","tokens.pinkA4","tokens.indigoA4","Skeleton","React","variant","className","children","props","ref","ensurePaletteTokens","styles","jsxs","SLOT_ATTR","mergeClasses","jsx"],"mappings":"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"}
+{"version":3,"file":"skeleton.js","sources":["../../../src/components/skeleton/skeleton.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { mergeClasses, shorthands } from \"@epilot/volt-ui-runtime\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeVoltStyles } from \"../../styles/make-styles\"\nimport * as tokens from \"../../tokens\"\nimport { ensurePaletteTokens } from \"../../tokens/install\"\n\n/**\n * Skeleton — v1's loading placeholder ported to Griffel atoms.\n *\n * Two variants, `default` and `ai`. `default` is a gray block that pulses; `ai` is a gray field\n * that renders three decorative colour spots drifting behind the content. The spots are ported from\n * v1's global `skeleton-ai-spot-*` classes in `styles/utilities.css`, including their exact\n * gradients, durations (10s / 12s / 14s) and easing.\n *\n * The keyframes are the object form, so Griffel hashes each one from its content — a hand-authored\n * global `@keyframes` would collide across two co-resident copies of this package. The pulse is a\n * single three-stop animation; each spot carries its own.\n *\n * The spots are `purple-a4`, `pink-a4` and `indigo-a4`, none of which is a core token family\n * (accent / gray / error / warning / success / info ship in the core sheet; everything else lives\n * in the palette sheet, which is not loaded by default). `ai` therefore calls\n * `ensurePaletteTokens()` — CONVENTIONS rule 3. There is no `color` prop, so no inline custom\n * properties: the spot colours are constant and live inside the style objects.\n */\n\nexport type SkeletonVariant = \"default\" | \"ai\"\n\nconst useStyles = makeVoltStyles({\n  default: {\n    backgroundColor: tokens.gray4,\n    ...shorthands.borderRadius(tokens.radiusMd),\n    animationName: {\n      \"0%,100%\": { opacity: 1 },\n      \"50%\": { opacity: 0.5 },\n    },\n    animationDuration: \"2s\",\n    animationTimingFunction: \"cubic-bezier(0.4,0,0.6,1)\",\n    animationIterationCount: \"infinite\",\n  },\n  ai: {\n    backgroundColor: tokens.gray3,\n    ...shorthands.borderRadius(tokens.radiusMd),\n    position: \"relative\",\n    ...shorthands.overflow(\"hidden\"),\n  },\n  spot: {\n    position: \"absolute\",\n    inset: \"-50%\",\n    ...shorthands.borderRadius(\"50%\"),\n    opacity: 0.6,\n    filter: \"blur(18px)\",\n    pointerEvents: \"none\",\n  },\n  spot1: {\n    backgroundImage: `radial-gradient(circle, ${tokens.purpleA4} 0%, transparent 65%)`,\n    animationName: {\n      \"0%,100%\": { transform: \"translate(-20%, 0%) scale(1)\" },\n      \"33%\": { transform: \"translate(40%, -25%) scale(1.2)\" },\n      \"66%\": { transform: \"translate(-10%, 30%) scale(0.9)\" },\n    },\n    animationDuration: \"10s\",\n    animationTimingFunction: \"ease-in-out\",\n    animationIterationCount: \"infinite\",\n  },\n  spot2: {\n    backgroundImage: `radial-gradient(circle, ${tokens.pinkA4} 0%, transparent 65%)`,\n    animationName: {\n      \"0%,100%\": { transform: \"translate(20%, 0%) scale(1.1)\" },\n      \"33%\": { transform: \"translate(-35%, 25%) scale(0.9)\" },\n      \"66%\": { transform: \"translate(30%, -20%) scale(1.3)\" },\n    },\n    animationDuration: \"12s\",\n    animationTimingFunction: \"ease-in-out\",\n    animationIterationCount: \"infinite\",\n  },\n  spot3: {\n    backgroundImage: `radial-gradient(circle, ${tokens.indigoA4} 0%, transparent 65%)`,\n    animationName: {\n      \"0%,100%\": { transform: \"translate(0%, 20%) scale(1)\" },\n      \"33%\": { transform: \"translate(25%, -30%) scale(1.2)\" },\n      \"66%\": { transform: \"translate(-30%, 10%) scale(0.8)\" },\n    },\n    animationDuration: \"14s\",\n    animationTimingFunction: \"ease-in-out\",\n    animationIterationCount: \"infinite\",\n  },\n})\n\nexport type SkeletonProps = React.ComponentProps<\"div\"> & {\n  variant?: SkeletonVariant\n}\n\nexport const Skeleton = React.forwardRef<HTMLDivElement, SkeletonProps>(\n  function Skeleton(\n    { variant = \"default\", className, children, ...props },\n    ref\n  ) {\n    // The decorative families live in the palette sheet, which is not installed by default\n    // (CONVENTIONS rule 3). It has to be present whenever this component renders at all.\n    ensurePaletteTokens()\n\n    const styles = useStyles()\n\n    if (variant === \"ai\") {\n      return (\n        <div\n          ref={ref}\n          data-slot=\"skeleton\"\n          {...{ [SLOT_ATTR]: \"skeleton\" }}\n          className={mergeClasses(styles.ai, className)}\n          {...props}\n        >\n          <span\n            aria-hidden=\"true\"\n            className={mergeClasses(styles.spot, styles.spot1)}\n          />\n          <span\n            aria-hidden=\"true\"\n            className={mergeClasses(styles.spot, styles.spot2)}\n          />\n          <span\n            aria-hidden=\"true\"\n            className={mergeClasses(styles.spot, styles.spot3)}\n          />\n          {children}\n        </div>\n      )\n    }\n\n    return (\n      <div\n        ref={ref}\n        data-slot=\"skeleton\"\n        {...{ [SLOT_ATTR]: \"skeleton\" }}\n        className={mergeClasses(styles.default, className)}\n        {...props}\n      >\n        {children}\n      </div>\n    )\n  }\n)\n"],"names":["useStyles","makeVoltStyles","tokens.gray4","shorthands","tokens.radiusMd","tokens.gray3","tokens.purpleA4","tokens.pinkA4","tokens.indigoA4","Skeleton","React","variant","className","children","props","ref","ensurePaletteTokens","styles","jsxs","SLOT_ATTR","mergeClasses","jsx"],"mappings":";;;;;;;;AA8BA,MAAMA,IAAYC,EAAe;AAAA,EAC/B,SAAS;AAAA,IACP,iBAAiBC;AAAAA,IACjB,GAAGC,EAAW,aAAaC,CAAe;AAAA,IAC1C,eAAe;AAAA,MACb,WAAW,EAAE,SAAS,EAAA;AAAA,MACtB,OAAO,EAAE,SAAS,IAAA;AAAA,IAAI;AAAA,IAExB,mBAAmB;AAAA,IACnB,yBAAyB;AAAA,IACzB,yBAAyB;AAAA,EAAA;AAAA,EAE3B,IAAI;AAAA,IACF,iBAAiBC;AAAAA,IACjB,GAAGF,EAAW,aAAaC,CAAe;AAAA,IAC1C,UAAU;AAAA,IACV,GAAGD,EAAW,SAAS,QAAQ;AAAA,EAAA;AAAA,EAEjC,MAAM;AAAA,IACJ,UAAU;AAAA,IACV,OAAO;AAAA,IACP,GAAGA,EAAW,aAAa,KAAK;AAAA,IAChC,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,eAAe;AAAA,EAAA;AAAA,EAEjB,OAAO;AAAA,IACL,iBAAiB,2BAA2BG,CAAe;AAAA,IAC3D,eAAe;AAAA,MACb,WAAW,EAAE,WAAW,+BAAA;AAAA,MACxB,OAAO,EAAE,WAAW,kCAAA;AAAA,MACpB,OAAO,EAAE,WAAW,kCAAA;AAAA,IAAkC;AAAA,IAExD,mBAAmB;AAAA,IACnB,yBAAyB;AAAA,IACzB,yBAAyB;AAAA,EAAA;AAAA,EAE3B,OAAO;AAAA,IACL,iBAAiB,2BAA2BC,CAAa;AAAA,IACzD,eAAe;AAAA,MACb,WAAW,EAAE,WAAW,gCAAA;AAAA,MACxB,OAAO,EAAE,WAAW,kCAAA;AAAA,MACpB,OAAO,EAAE,WAAW,kCAAA;AAAA,IAAkC;AAAA,IAExD,mBAAmB;AAAA,IACnB,yBAAyB;AAAA,IACzB,yBAAyB;AAAA,EAAA;AAAA,EAE3B,OAAO;AAAA,IACL,iBAAiB,2BAA2BC,CAAe;AAAA,IAC3D,eAAe;AAAA,MACb,WAAW,EAAE,WAAW,8BAAA;AAAA,MACxB,OAAO,EAAE,WAAW,kCAAA;AAAA,MACpB,OAAO,EAAE,WAAW,kCAAA;AAAA,IAAkC;AAAA,IAExD,mBAAmB;AAAA,IACnB,yBAAyB;AAAA,IACzB,yBAAyB;AAAA,EAAA;AAE7B,CAAC,GAMYC,IAAWC,EAAM;AAAA,EAC5B,SACE,EAAE,SAAAC,IAAU,WAAW,WAAAC,GAAW,UAAAC,GAAU,GAAGC,EAAA,GAC/CC,GACA;AAGA,IAAAC,EAAA;AAEA,UAAMC,IAASjB,EAAA;AAEf,WAAIW,MAAY,OAEZ,gBAAAO;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAH;AAAA,QACA,aAAU;AAAA,QACJ,CAACI,CAAS,GAAG;AAAA,QACnB,WAAWC,EAAaH,EAAO,IAAIL,CAAS;AAAA,QAC3C,GAAGE;AAAA,QAEJ,UAAA;AAAA,UAAA,gBAAAO;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,eAAY;AAAA,cACZ,WAAWD,EAAaH,EAAO,MAAMA,EAAO,KAAK;AAAA,YAAA;AAAA,UAAA;AAAA,UAEnD,gBAAAI;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,eAAY;AAAA,cACZ,WAAWD,EAAaH,EAAO,MAAMA,EAAO,KAAK;AAAA,YAAA;AAAA,UAAA;AAAA,UAEnD,gBAAAI;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,eAAY;AAAA,cACZ,WAAWD,EAAaH,EAAO,MAAMA,EAAO,KAAK;AAAA,YAAA;AAAA,UAAA;AAAA,UAElDJ;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA,IAML,gBAAAQ;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAN;AAAA,QACA,aAAU;AAAA,QACJ,CAACI,CAAS,GAAG;AAAA,QACnB,WAAWC,EAAaH,EAAO,SAASL,CAAS;AAAA,QAChD,GAAGE;AAAA,QAEH,UAAAD;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AACF;"}

package/dist/components/spinner/spinner.js

@@ -1,9 +1,9 @@
 import { jsx as e, jsxs as s } from "react/jsx-runtime";
-import * as a from "react";
-import { SLOT_ATTR as m } from "../../renderer/contract.js";
-import { makeVoltStyles as h } from "../../styles/make-styles.js";
-import { mergeClasses as c } from "../../node_modules/@griffel/core/src/mergeClasses.js";
-const l = h({
+import * as o from "react";
+import { SLOT_ATTR as m } from "../../packages/volt-runtime/dist/renderer/contract.js";
+import { mergeClasses as h } from "../../packages/volt-runtime/dist/vendor/@griffel/core/src/mergeClasses.js";
+import { makeVoltStyles as c } from "../../styles/make-styles.js";
+const l = c({
   sm: {
     width: "1rem",
     height: "1rem"
@@ -52,13 +52,13 @@ const l = h({
     animationTimingFunction: "ease-in-out",
     animationIterationCount: "infinite"
   }
-}), w = a.forwardRef(
-  function({ size: i = "base", className: r, ...n }, o) {
+}), w = o.forwardRef(
+  function({ size: i = "base", className: r, ...n }, a) {
     const t = l();
     return /* @__PURE__ */ e(
       "svg",
       {
-        ref: o,
+        ref: a,
         xmlns: "http://www.w3.org/2000/svg",
         width: "24",
         height: "24",
@@ -68,7 +68,7 @@ const l = h({
         role: "status",
         "data-slot": "spinner",
         [m]: "spinner",
-        className: c(t[i], r),
+        className: h(t[i], r),
         ...n,
         children: /* @__PURE__ */ s("g", { className: t.spin, children: [
           /* @__PURE__ */ e("circle", { cx: "12", cy: "12", r: "9.5", strokeWidth: "3", opacity: "0.1" }),

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

@@ -1 +1 @@
-{"version":3,"file":"spinner.js","sources":["../../../src/components/spinner/spinner.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { mergeClasses } from \"@griffel/core\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeVoltStyles } from \"../../styles/make-styles\"\n\n/**\n * Spinner — v1's SVG spinner ported to a size-driven style object.\n *\n * v1 sizes this with Tailwind `size-*` utilities and deprecated the `size` prop in favour of a\n * `className` like `size-4`. There is no Tailwind here, so that escape hatch does not exist: `size`\n * is the supported API and the `@deprecated` tag is dropped (CONVENTIONS rule 9).\n *\n * The SVG markup, `viewBox` and stroke attributes are copied exactly from v1. Both animations are\n * the object form per CONVENTIONS rule 8: the outer `<g>` spins from a single `100%` stop, and the\n * dash sweep carries all three of v1's keyframe stops (`0%`, `47.5%`, `95%,100%`) from\n * `styles/animations.css`. The only mechanical changes are stylistic: sizes become width/height\n * atoms and the two `animate-*` classes become `animationName` + duration + timing + iteration.\n *\n * The five dimensions (1rem / 1.5rem / 2.5rem / 4rem / 6rem) are v1's Tailwind `size-N` values;\n * the v2 token set has no size or width/height family, so they are literals (CONVENTIONS rule 1).\n *\n * v1 also exposes a `variant` prop (`circle` | `line`) whose branches are both empty strings — it\n * produces no styles at all, so it is omitted here.\n */\n\nexport type SpinnerSize = \"sm\" | \"base\" | \"lg\" | \"xl\" | \"2xl\"\n\nconst useStyles = makeVoltStyles({\n  sm: {\n    width: \"1rem\",\n    height: \"1rem\",\n  },\n  base: {\n    width: \"1.5rem\",\n    height: \"1.5rem\",\n  },\n  lg: {\n    width: \"2.5rem\",\n    height: \"2.5rem\",\n  },\n  xl: {\n    width: \"4rem\",\n    height: \"4rem\",\n  },\n  \"2xl\": {\n    width: \"6rem\",\n    height: \"6rem\",\n  },\n  spin: {\n    transformOrigin: \"center\",\n    animationName: {\n      \"100%\": { transform: \"rotate(360deg)\" },\n    },\n    animationDuration: \"2s\",\n    animationTimingFunction: \"linear\",\n    animationIterationCount: \"infinite\",\n  },\n  dash: {\n    animationName: {\n      \"0%\": {\n        strokeDasharray: \"0 150\",\n        strokeDashoffset: 0,\n      },\n      \"47.5%\": {\n        strokeDasharray: \"42 150\",\n        strokeDashoffset: -16,\n      },\n      \"95%,100%\": {\n        strokeDasharray: \"42 150\",\n        strokeDashoffset: -59,\n      },\n    },\n    animationDuration: \"1.5s\",\n    animationTimingFunction: \"ease-in-out\",\n    animationIterationCount: \"infinite\",\n  },\n})\n\nexport type SpinnerProps = React.ComponentProps<\"svg\"> & {\n  size?: SpinnerSize\n}\n\nexport const Spinner = React.forwardRef<SVGSVGElement, SpinnerProps>(\n  function Spinner({ size = \"base\", className, ...props }, ref) {\n    const styles = useStyles()\n\n    return (\n      <svg\n        ref={ref}\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width=\"24\"\n        height=\"24\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        role=\"status\"\n        data-slot=\"spinner\"\n        {...{ [SLOT_ATTR]: \"spinner\" }}\n        className={mergeClasses(styles[size], className)}\n        {...props}\n      >\n        <g className={styles.spin}>\n          <circle cx=\"12\" cy=\"12\" r=\"9.5\" strokeWidth=\"3\" opacity=\"0.1\" />\n          <circle\n            className={styles.dash}\n            cx=\"12\"\n            cy=\"12\"\n            r=\"9.5\"\n            strokeWidth=\"3\"\n            strokeLinecap=\"round\"\n            fill=\"none\"\n          />\n        </g>\n      </svg>\n    )\n  }\n)\n"],"names":["useStyles","makeVoltStyles","Spinner","React","size","className","props","ref","styles","jsx","SLOT_ATTR","mergeClasses","jsxs"],"mappings":";;;;;AA6BA,MAAMA,IAAYC,EAAe;AAAA,EAC/B,IAAI;AAAA,IACF,OAAO;AAAA,IACP,QAAQ;AAAA,EAAA;AAAA,EAEV,MAAM;AAAA,IACJ,OAAO;AAAA,IACP,QAAQ;AAAA,EAAA;AAAA,EAEV,IAAI;AAAA,IACF,OAAO;AAAA,IACP,QAAQ;AAAA,EAAA;AAAA,EAEV,IAAI;AAAA,IACF,OAAO;AAAA,IACP,QAAQ;AAAA,EAAA;AAAA,EAEV,OAAO;AAAA,IACL,OAAO;AAAA,IACP,QAAQ;AAAA,EAAA;AAAA,EAEV,MAAM;AAAA,IACJ,iBAAiB;AAAA,IACjB,eAAe;AAAA,MACb,QAAQ,EAAE,WAAW,iBAAA;AAAA,IAAiB;AAAA,IAExC,mBAAmB;AAAA,IACnB,yBAAyB;AAAA,IACzB,yBAAyB;AAAA,EAAA;AAAA,EAE3B,MAAM;AAAA,IACJ,eAAe;AAAA,MACb,MAAM;AAAA,QACJ,iBAAiB;AAAA,QACjB,kBAAkB;AAAA,MAAA;AAAA,MAEpB,SAAS;AAAA,QACP,iBAAiB;AAAA,QACjB,kBAAkB;AAAA,MAAA;AAAA,MAEpB,YAAY;AAAA,QACV,iBAAiB;AAAA,QACjB,kBAAkB;AAAA,MAAA;AAAA,IACpB;AAAA,IAEF,mBAAmB;AAAA,IACnB,yBAAyB;AAAA,IACzB,yBAAyB;AAAA,EAAA;AAE7B,CAAC,GAMYC,IAAUC,EAAM;AAAA,EAC3B,SAAiB,EAAE,MAAAC,IAAO,QAAQ,WAAAC,GAAW,GAAGC,EAAA,GAASC,GAAK;AAC5D,UAAMC,IAASR,EAAA;AAEf,WACE,gBAAAS;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAF;AAAA,QACA,OAAM;AAAA,QACN,OAAM;AAAA,QACN,QAAO;AAAA,QACP,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,QAAO;AAAA,QACP,MAAK;AAAA,QACL,aAAU;AAAA,QACJ,CAACG,CAAS,GAAG;AAAA,QACnB,WAAWC,EAAaH,EAAOJ,CAAI,GAAGC,CAAS;AAAA,QAC9C,GAAGC;AAAA,QAEJ,UAAA,gBAAAM,EAAC,KAAA,EAAE,WAAWJ,EAAO,MACnB,UAAA;AAAA,UAAA,gBAAAC,EAAC,UAAA,EAAO,IAAG,MAAK,IAAG,MAAK,GAAE,OAAM,aAAY,KAAI,SAAQ,MAAA,CAAM;AAAA,UAC9D,gBAAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAWD,EAAO;AAAA,cAClB,IAAG;AAAA,cACH,IAAG;AAAA,cACH,GAAE;AAAA,cACF,aAAY;AAAA,cACZ,eAAc;AAAA,cACd,MAAK;AAAA,YAAA;AAAA,UAAA;AAAA,QACP,EAAA,CACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;"}
+{"version":3,"file":"spinner.js","sources":["../../../src/components/spinner/spinner.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { mergeClasses } from \"@epilot/volt-ui-runtime\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeVoltStyles } from \"../../styles/make-styles\"\n\n/**\n * Spinner — v1's SVG spinner ported to a size-driven style object.\n *\n * v1 sizes this with Tailwind `size-*` utilities and deprecated the `size` prop in favour of a\n * `className` like `size-4`. There is no Tailwind here, so that escape hatch does not exist: `size`\n * is the supported API and the `@deprecated` tag is dropped (CONVENTIONS rule 9).\n *\n * The SVG markup, `viewBox` and stroke attributes are copied exactly from v1. Both animations are\n * the object form per CONVENTIONS rule 8: the outer `<g>` spins from a single `100%` stop, and the\n * dash sweep carries all three of v1's keyframe stops (`0%`, `47.5%`, `95%,100%`) from\n * `styles/animations.css`. The only mechanical changes are stylistic: sizes become width/height\n * atoms and the two `animate-*` classes become `animationName` + duration + timing + iteration.\n *\n * The five dimensions (1rem / 1.5rem / 2.5rem / 4rem / 6rem) are v1's Tailwind `size-N` values;\n * the v2 token set has no size or width/height family, so they are literals (CONVENTIONS rule 1).\n *\n * v1 also exposes a `variant` prop (`circle` | `line`) whose branches are both empty strings — it\n * produces no styles at all, so it is omitted here.\n */\n\nexport type SpinnerSize = \"sm\" | \"base\" | \"lg\" | \"xl\" | \"2xl\"\n\nconst useStyles = makeVoltStyles({\n  sm: {\n    width: \"1rem\",\n    height: \"1rem\",\n  },\n  base: {\n    width: \"1.5rem\",\n    height: \"1.5rem\",\n  },\n  lg: {\n    width: \"2.5rem\",\n    height: \"2.5rem\",\n  },\n  xl: {\n    width: \"4rem\",\n    height: \"4rem\",\n  },\n  \"2xl\": {\n    width: \"6rem\",\n    height: \"6rem\",\n  },\n  spin: {\n    transformOrigin: \"center\",\n    animationName: {\n      \"100%\": { transform: \"rotate(360deg)\" },\n    },\n    animationDuration: \"2s\",\n    animationTimingFunction: \"linear\",\n    animationIterationCount: \"infinite\",\n  },\n  dash: {\n    animationName: {\n      \"0%\": {\n        strokeDasharray: \"0 150\",\n        strokeDashoffset: 0,\n      },\n      \"47.5%\": {\n        strokeDasharray: \"42 150\",\n        strokeDashoffset: -16,\n      },\n      \"95%,100%\": {\n        strokeDasharray: \"42 150\",\n        strokeDashoffset: -59,\n      },\n    },\n    animationDuration: \"1.5s\",\n    animationTimingFunction: \"ease-in-out\",\n    animationIterationCount: \"infinite\",\n  },\n})\n\nexport type SpinnerProps = React.ComponentProps<\"svg\"> & {\n  size?: SpinnerSize\n}\n\nexport const Spinner = React.forwardRef<SVGSVGElement, SpinnerProps>(\n  function Spinner({ size = \"base\", className, ...props }, ref) {\n    const styles = useStyles()\n\n    return (\n      <svg\n        ref={ref}\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width=\"24\"\n        height=\"24\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        role=\"status\"\n        data-slot=\"spinner\"\n        {...{ [SLOT_ATTR]: \"spinner\" }}\n        className={mergeClasses(styles[size], className)}\n        {...props}\n      >\n        <g className={styles.spin}>\n          <circle cx=\"12\" cy=\"12\" r=\"9.5\" strokeWidth=\"3\" opacity=\"0.1\" />\n          <circle\n            className={styles.dash}\n            cx=\"12\"\n            cy=\"12\"\n            r=\"9.5\"\n            strokeWidth=\"3\"\n            strokeLinecap=\"round\"\n            fill=\"none\"\n          />\n        </g>\n      </svg>\n    )\n  }\n)\n"],"names":["useStyles","makeVoltStyles","Spinner","React","size","className","props","ref","styles","jsx","SLOT_ATTR","mergeClasses","jsxs"],"mappings":";;;;;AA6BA,MAAMA,IAAYC,EAAe;AAAA,EAC/B,IAAI;AAAA,IACF,OAAO;AAAA,IACP,QAAQ;AAAA,EAAA;AAAA,EAEV,MAAM;AAAA,IACJ,OAAO;AAAA,IACP,QAAQ;AAAA,EAAA;AAAA,EAEV,IAAI;AAAA,IACF,OAAO;AAAA,IACP,QAAQ;AAAA,EAAA;AAAA,EAEV,IAAI;AAAA,IACF,OAAO;AAAA,IACP,QAAQ;AAAA,EAAA;AAAA,EAEV,OAAO;AAAA,IACL,OAAO;AAAA,IACP,QAAQ;AAAA,EAAA;AAAA,EAEV,MAAM;AAAA,IACJ,iBAAiB;AAAA,IACjB,eAAe;AAAA,MACb,QAAQ,EAAE,WAAW,iBAAA;AAAA,IAAiB;AAAA,IAExC,mBAAmB;AAAA,IACnB,yBAAyB;AAAA,IACzB,yBAAyB;AAAA,EAAA;AAAA,EAE3B,MAAM;AAAA,IACJ,eAAe;AAAA,MACb,MAAM;AAAA,QACJ,iBAAiB;AAAA,QACjB,kBAAkB;AAAA,MAAA;AAAA,MAEpB,SAAS;AAAA,QACP,iBAAiB;AAAA,QACjB,kBAAkB;AAAA,MAAA;AAAA,MAEpB,YAAY;AAAA,QACV,iBAAiB;AAAA,QACjB,kBAAkB;AAAA,MAAA;AAAA,IACpB;AAAA,IAEF,mBAAmB;AAAA,IACnB,yBAAyB;AAAA,IACzB,yBAAyB;AAAA,EAAA;AAE7B,CAAC,GAMYC,IAAUC,EAAM;AAAA,EAC3B,SAAiB,EAAE,MAAAC,IAAO,QAAQ,WAAAC,GAAW,GAAGC,EAAA,GAASC,GAAK;AAC5D,UAAMC,IAASR,EAAA;AAEf,WACE,gBAAAS;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAF;AAAA,QACA,OAAM;AAAA,QACN,OAAM;AAAA,QACN,QAAO;AAAA,QACP,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,QAAO;AAAA,QACP,MAAK;AAAA,QACL,aAAU;AAAA,QACJ,CAACG,CAAS,GAAG;AAAA,QACnB,WAAWC,EAAaH,EAAOJ,CAAI,GAAGC,CAAS;AAAA,QAC9C,GAAGC;AAAA,QAEJ,UAAA,gBAAAM,EAAC,KAAA,EAAE,WAAWJ,EAAO,MACnB,UAAA;AAAA,UAAA,gBAAAC,EAAC,UAAA,EAAO,IAAG,MAAK,IAAG,MAAK,GAAE,OAAM,aAAY,KAAI,SAAQ,MAAA,CAAM;AAAA,UAC9D,gBAAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAWD,EAAO;AAAA,cAClB,IAAG;AAAA,cACH,IAAG;AAAA,cACH,GAAE;AAAA,cACF,aAAY;AAAA,cACZ,eAAc;AAAA,cACd,MAAK;AAAA,YAAA;AAAA,UAAA;AAAA,QACP,EAAA,CACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;"}

package/dist/components/switch/switch.js

@@ -1,12 +1,12 @@
 import { jsx as t, jsxs as k } from "react/jsx-runtime";
-import * as a from "react";
-import { Root as v, Thumb as x } from "../../node_modules/@radix-ui/react-switch/dist/index.js";
-import { shorthands as r } from "../../node_modules/@griffel/core/src/index.js";
-import { SLOT_ATTR as s } from "../../renderer/contract.js";
+import * as c from "react";
+import { Root as v, Thumb as x } from "../../vendor/@radix-ui/react-switch/dist/index.js";
+import { shorthands as r } from "../../packages/volt-runtime/dist/vendor/@griffel/core/src/index.js";
+import { SLOT_ATTR as s } from "../../packages/volt-runtime/dist/renderer/contract.js";
+import { mergeClasses as g } from "../../packages/volt-runtime/dist/vendor/@griffel/core/src/mergeClasses.js";
 import { makeVoltStyles as b } from "../../styles/make-styles.js";
-import { errorA8 as c, errorA3 as C, semErrorSolid as y, accentA8 as S, grayA3 as T, semAccentSolid as R, grayA8 as u, errorA11 as A, errorContrast as V, accentA11 as E, grayContrast as I } from "../../tokens/index.js";
-import { mergeClasses as g } from "../../node_modules/@griffel/core/src/mergeClasses.js";
-const N = a.forwardRef(
+import { errorA8 as a, errorA3 as y, semErrorSolid as C, accentA8 as S, grayA3 as T, semAccentSolid as R, grayA8 as u, errorA11 as A, errorContrast as V, accentA11 as E, grayContrast as I } from "../../tokens/index.js";
+const N = c.forwardRef(
   function(i, e) {
     const o = w();
     return /* @__PURE__ */ t(
@@ -24,7 +24,7 @@ const N = a.forwardRef(
       }
     );
   }
-), D = a.forwardRef(
+), D = c.forwardRef(
   function(i, e) {
     const o = w();
     return /* @__PURE__ */ t(
@@ -52,7 +52,7 @@ const N = a.forwardRef(
       }
     );
   }
-), H = a.forwardRef(
+), H = c.forwardRef(
   function(i, e) {
     const o = w();
     return /* @__PURE__ */ t(
@@ -130,10 +130,10 @@ const N = a.forwardRef(
     ":focus-visible": { outlineColor: S }
   },
   destructive: {
-    color: c,
-    "&[data-state='checked']": { backgroundColor: y },
-    "&[data-state='unchecked']": { backgroundColor: C },
-    ":focus-visible": { outlineColor: c }
+    color: a,
+    "&[data-state='checked']": { backgroundColor: C },
+    "&[data-state='unchecked']": { backgroundColor: y },
+    ":focus-visible": { outlineColor: a }
   },
   sm: {
     width: "1.625rem",
@@ -181,9 +181,9 @@ const N = a.forwardRef(
   },
   destructive: {
     backgroundColor: V,
-    color: c,
+    color: a,
     "&[data-state='checked']": { color: A },
-    "&[data-state='unchecked']": { color: c }
+    "&[data-state='unchecked']": { color: a }
   },
   sm: {
     width: "0.75rem",
@@ -204,7 +204,7 @@ const N = a.forwardRef(
       width: "0.4375rem"
     }
   }
-}), X = a.forwardRef(function({
+}), X = c.forwardRef(function({
   variant: i = "default",
   size: e = "base",
   className: o,

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

@@ -1 +1 @@
-{"version":3,"file":"switch.js","sources":["../../../src/components/switch/switch.tsx"],"sourcesContent":["import * as React from \"react\"\nimport * as SwitchPrimitive from \"@radix-ui/react-switch\"\nimport { mergeClasses, shorthands } from \"@griffel/core\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeVoltStyles } from \"../../styles/make-styles\"\nimport * as tokens from \"../../tokens\"\n\nconst ThumbIconChecked = React.forwardRef<SVGSVGElement>(\n  function ThumbIconChecked(_props, ref) {\n    const styles = useThumbIconStyles()\n\n    return (\n      <svg\n        ref={ref}\n        data-slot=\"switch-thumb-icon-checked\"\n        {...{ [SLOT_ATTR]: \"switch-thumb-icon-checked\" }}\n        role=\"presentation\"\n        className={styles.checked}\n        viewBox=\"0 0 1 6\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <rect width=\"1\" height=\"6\" fill=\"currentColor\" />\n      </svg>\n    )\n  }\n)\n\nconst ThumbIconUnchecked = React.forwardRef<SVGSVGElement>(\n  function ThumbIconUnchecked(_props, ref) {\n    const styles = useThumbIconStyles()\n\n    return (\n      <svg\n        ref={ref}\n        data-slot=\"switch-thumb-icon-unchecked\"\n        {...{ [SLOT_ATTR]: \"switch-thumb-icon-unchecked\" }}\n        role=\"presentation\"\n        className={styles.unchecked}\n        viewBox=\"0 0 4 6\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <rect\n          x=\"0.5\"\n          y=\"0.5\"\n          width=\"3\"\n          height=\"5\"\n          rx=\"1.5\"\n          stroke=\"currentColor\"\n        />\n      </svg>\n    )\n  }\n)\n\nconst ThumbIconDisabled = React.forwardRef<SVGSVGElement>(\n  function ThumbIconDisabled(_props, ref) {\n    const styles = useThumbIconStyles()\n\n    return (\n      <svg\n        ref={ref}\n        data-slot=\"switch-thumb-icon-disabled\"\n        {...{ [SLOT_ATTR]: \"switch-thumb-icon-disabled\" }}\n        className={styles.disabled}\n        viewBox=\"0 0 4 5\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <path\n          d=\"M0 5V1.875H0.666667V1.25C0.666667 0.90625 0.797223 0.611979 1.05833 0.367188C1.31944 0.122396 1.63333 0 2 0C2.36667 0 2.68056 0.122396 2.94167 0.367188C3.20278 0.611979 3.33333 0.90625 3.33333 1.25V1.875H4V5H0ZM1.33333 1.875H2.66667V1.25C2.66667 1.07292 2.60278 0.924479 2.475 0.804687C2.34722 0.684896 2.18889 0.625 2 0.625C1.81111 0.625 1.65278 0.684896 1.525 0.804687C1.39722 0.924479 1.33333 1.07292 1.33333 1.25V1.875Z\"\n          fill=\"currentColor\"\n        />\n      </svg>\n    )\n  }\n)\n\nconst useThumbIconStyles = makeVoltStyles({\n  checked: {\n    display: \"none\",\n    position: \"absolute\",\n    pointerEvents: \"none\",\n    ...shorthands.inset(0),\n    color: \"currentColor\",\n    ...shorthands.margin(\"auto\"),\n  },\n  unchecked: {\n    display: \"none\",\n    position: \"absolute\",\n    pointerEvents: \"none\",\n    ...shorthands.inset(0),\n    color: \"currentColor\",\n    ...shorthands.margin(\"auto\"),\n  },\n  disabled: {\n    display: \"inline-block\",\n    position: \"absolute\",\n    pointerEvents: \"none\",\n    ...shorthands.inset(0),\n    color: \"currentColor\",\n    ...shorthands.margin(\"auto\"),\n  },\n})\n\nconst useRootStyles = makeVoltStyles({\n  root: {\n    boxSizing: \"border-box\",\n    display: \"inline-flex\",\n    alignItems: \"center\",\n    flexShrink: 0,\n    cursor: \"pointer\",\n    borderRadius: \"9999px\",\n    ...shorthands.border(\"1px\", \"solid\", \"transparent\"),\n    boxShadow: \"0 1px 2px 0 #0000000d\",\n    transitionProperty: \"all\",\n    transitionTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n    transitionDuration: \"150ms\",\n    \":focus-visible\": {\n      outlineWidth: \"2px\",\n      outlineStyle: \"solid\",\n      outlineOffset: \"2px\",\n    },\n    \":disabled, &[data-disabled]\": {\n      pointerEvents: \"none\",\n      opacity: 0.5,\n    },\n  },\n  default: {\n    color: tokens.grayA8,\n    \"&[data-state='checked']\": { backgroundColor: tokens.semAccentSolid },\n    \"&[data-state='unchecked']\": { backgroundColor: tokens.grayA3 },\n    \":focus-visible\": { outlineColor: tokens.accentA8 },\n  },\n  destructive: {\n    color: tokens.errorA8,\n    \"&[data-state='checked']\": { backgroundColor: tokens.semErrorSolid },\n    \"&[data-state='unchecked']\": { backgroundColor: tokens.errorA3 },\n    \":focus-visible\": { outlineColor: tokens.errorA8 },\n  },\n  sm: {\n    width: \"1.625rem\",\n    height: \"1rem\",\n    \"& svg\": { width: \"0.25rem\", height: \"0.375rem\" },\n  },\n  base: {\n    width: \"2.125rem\",\n    height: \"1.25rem\",\n    \"& svg\": { width: \"0.4375rem\", height: \"0.5rem\" },\n  },\n  lg: {\n    width: \"2.625rem\",\n    height: \"1.5rem\",\n    \"& svg\": { width: \"0.5rem\", height: \"0.625rem\" },\n  },\n})\n\nconst useThumbStyles = makeVoltStyles({\n  thumb: {\n    position: \"relative\",\n    display: \"block\",\n    pointerEvents: \"none\",\n    borderRadius: \"9999px\",\n    boxShadow: \"0 1px 2px 0 #0000000d\",\n    transitionProperty: \"transform\",\n    transitionTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n    transitionDuration: \"150ms\",\n    \"&[data-state='checked']\": {\n      transform: \"translateX(calc(100% - 1px))\",\n    },\n    \"&[data-state='unchecked']\": {\n      transform: \"translateX(1px)\",\n    },\n    \"&[data-state='checked'] [data-volt2-slot='switch-thumb-icon-checked']\": {\n      display: \"inline-block\",\n    },\n    \"&[data-state='unchecked'] [data-volt2-slot='switch-thumb-icon-unchecked']\":\n      {\n        display: \"inline-block\",\n      },\n  },\n  default: {\n    backgroundColor: tokens.grayContrast,\n    color: tokens.grayA8,\n    \"&[data-state='checked']\": { color: tokens.accentA11 },\n    \"&[data-state='unchecked']\": { color: tokens.grayA8 },\n  },\n  destructive: {\n    backgroundColor: tokens.errorContrast,\n    color: tokens.errorA8,\n    \"&[data-state='checked']\": { color: tokens.errorA11 },\n    \"&[data-state='unchecked']\": { color: tokens.errorA8 },\n  },\n  sm: {\n    width: \"0.75rem\",\n    height: \"0.75rem\",\n    \"& svg[data-volt2-slot='switch-thumb-icon-disabled']\": { width: \"0.25rem\" },\n  },\n  base: {\n    width: \"1rem\",\n    height: \"1rem\",\n    \"& svg[data-volt2-slot='switch-thumb-icon-disabled']\": {\n      width: \"0.375rem\",\n    },\n  },\n  lg: {\n    width: \"1.25rem\",\n    height: \"1.25rem\",\n    \"& svg[data-volt2-slot='switch-thumb-icon-disabled']\": {\n      width: \"0.4375rem\",\n    },\n  },\n})\n\n/**\n * `primary` is a deprecated alias of `default`, carried because v1 has it and real consumers still\n * pass it — entity-sidepanel's SettingsControls does. v1's own comment marks it deprecated and its\n * styles are byte-identical to `default`, so it is mapped rather than duplicated.\n *\n * @remarks `primary` is deprecated; use `default`.\n */\nexport type SwitchVariant = \"default\" | \"destructive\" | \"primary\"\nexport type SwitchSize = \"sm\" | \"base\" | \"lg\"\n\nexport type SwitchProps = React.ComponentProps<typeof SwitchPrimitive.Root> & {\n  variant?: SwitchVariant\n  size?: SwitchSize\n  showThumbIcon?: boolean\n}\n\nexport const Switch = React.forwardRef<\n  React.ComponentRef<typeof SwitchPrimitive.Root>,\n  SwitchProps\n>(function Switch(\n  {\n    variant = \"default\",\n    size = \"base\",\n    className,\n    showThumbIcon = false,\n    ...props\n  },\n  ref\n) {\n  const rootStyles = useRootStyles()\n  const thumbStyles = useThumbStyles()\n  // See SwitchVariant: `primary` is v1's deprecated alias for `default`, same styles.\n  const variantKey = variant === \"primary\" ? \"default\" : variant\n\n  return (\n    <SwitchPrimitive.Root\n      ref={ref}\n      data-slot=\"switch\"\n      {...{ [SLOT_ATTR]: \"switch\" }}\n      className={mergeClasses(\n        rootStyles.root,\n        rootStyles[variantKey],\n        rootStyles[size],\n        className\n      )}\n      {...props}\n    >\n      <SwitchPrimitive.Thumb\n        data-slot=\"switch-thumb\"\n        {...{ [SLOT_ATTR]: \"switch-thumb\" }}\n        className={mergeClasses(\n          thumbStyles.thumb,\n          thumbStyles[variantKey],\n          thumbStyles[size]\n        )}\n      >\n        {showThumbIcon && !props.disabled && <ThumbIconChecked />}\n        {showThumbIcon && !props.disabled && <ThumbIconUnchecked />}\n        {showThumbIcon && props.disabled && <ThumbIconDisabled />}\n      </SwitchPrimitive.Thumb>\n    </SwitchPrimitive.Root>\n  )\n})\n"],"names":["ThumbIconChecked","React","_props","ref","styles","useThumbIconStyles","jsx","SLOT_ATTR","ThumbIconUnchecked","ThumbIconDisabled","makeVoltStyles","shorthands","useRootStyles","tokens.grayA8","tokens.semAccentSolid","tokens.grayA3","tokens.accentA8","tokens.errorA8","tokens.semErrorSolid","tokens.errorA3","useThumbStyles","tokens.grayContrast","tokens.accentA11","tokens.errorContrast","tokens.errorA11","Switch","variant","size","className","showThumbIcon","props","rootStyles","thumbStyles","variantKey","SwitchPrimitive.Root","mergeClasses","jsxs","SwitchPrimitive.Thumb"],"mappings":"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"}
+{"version":3,"file":"switch.js","sources":["../../../src/components/switch/switch.tsx"],"sourcesContent":["import * as React from \"react\"\nimport * as SwitchPrimitive from \"@radix-ui/react-switch\"\nimport { mergeClasses, shorthands } from \"@epilot/volt-ui-runtime\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeVoltStyles } from \"../../styles/make-styles\"\nimport * as tokens from \"../../tokens\"\n\nconst ThumbIconChecked = React.forwardRef<SVGSVGElement>(\n  function ThumbIconChecked(_props, ref) {\n    const styles = useThumbIconStyles()\n\n    return (\n      <svg\n        ref={ref}\n        data-slot=\"switch-thumb-icon-checked\"\n        {...{ [SLOT_ATTR]: \"switch-thumb-icon-checked\" }}\n        role=\"presentation\"\n        className={styles.checked}\n        viewBox=\"0 0 1 6\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <rect width=\"1\" height=\"6\" fill=\"currentColor\" />\n      </svg>\n    )\n  }\n)\n\nconst ThumbIconUnchecked = React.forwardRef<SVGSVGElement>(\n  function ThumbIconUnchecked(_props, ref) {\n    const styles = useThumbIconStyles()\n\n    return (\n      <svg\n        ref={ref}\n        data-slot=\"switch-thumb-icon-unchecked\"\n        {...{ [SLOT_ATTR]: \"switch-thumb-icon-unchecked\" }}\n        role=\"presentation\"\n        className={styles.unchecked}\n        viewBox=\"0 0 4 6\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <rect\n          x=\"0.5\"\n          y=\"0.5\"\n          width=\"3\"\n          height=\"5\"\n          rx=\"1.5\"\n          stroke=\"currentColor\"\n        />\n      </svg>\n    )\n  }\n)\n\nconst ThumbIconDisabled = React.forwardRef<SVGSVGElement>(\n  function ThumbIconDisabled(_props, ref) {\n    const styles = useThumbIconStyles()\n\n    return (\n      <svg\n        ref={ref}\n        data-slot=\"switch-thumb-icon-disabled\"\n        {...{ [SLOT_ATTR]: \"switch-thumb-icon-disabled\" }}\n        className={styles.disabled}\n        viewBox=\"0 0 4 5\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <path\n          d=\"M0 5V1.875H0.666667V1.25C0.666667 0.90625 0.797223 0.611979 1.05833 0.367188C1.31944 0.122396 1.63333 0 2 0C2.36667 0 2.68056 0.122396 2.94167 0.367188C3.20278 0.611979 3.33333 0.90625 3.33333 1.25V1.875H4V5H0ZM1.33333 1.875H2.66667V1.25C2.66667 1.07292 2.60278 0.924479 2.475 0.804687C2.34722 0.684896 2.18889 0.625 2 0.625C1.81111 0.625 1.65278 0.684896 1.525 0.804687C1.39722 0.924479 1.33333 1.07292 1.33333 1.25V1.875Z\"\n          fill=\"currentColor\"\n        />\n      </svg>\n    )\n  }\n)\n\nconst useThumbIconStyles = makeVoltStyles({\n  checked: {\n    display: \"none\",\n    position: \"absolute\",\n    pointerEvents: \"none\",\n    ...shorthands.inset(0),\n    color: \"currentColor\",\n    ...shorthands.margin(\"auto\"),\n  },\n  unchecked: {\n    display: \"none\",\n    position: \"absolute\",\n    pointerEvents: \"none\",\n    ...shorthands.inset(0),\n    color: \"currentColor\",\n    ...shorthands.margin(\"auto\"),\n  },\n  disabled: {\n    display: \"inline-block\",\n    position: \"absolute\",\n    pointerEvents: \"none\",\n    ...shorthands.inset(0),\n    color: \"currentColor\",\n    ...shorthands.margin(\"auto\"),\n  },\n})\n\nconst useRootStyles = makeVoltStyles({\n  root: {\n    boxSizing: \"border-box\",\n    display: \"inline-flex\",\n    alignItems: \"center\",\n    flexShrink: 0,\n    cursor: \"pointer\",\n    borderRadius: \"9999px\",\n    ...shorthands.border(\"1px\", \"solid\", \"transparent\"),\n    boxShadow: \"0 1px 2px 0 #0000000d\",\n    transitionProperty: \"all\",\n    transitionTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n    transitionDuration: \"150ms\",\n    \":focus-visible\": {\n      outlineWidth: \"2px\",\n      outlineStyle: \"solid\",\n      outlineOffset: \"2px\",\n    },\n    \":disabled, &[data-disabled]\": {\n      pointerEvents: \"none\",\n      opacity: 0.5,\n    },\n  },\n  default: {\n    color: tokens.grayA8,\n    \"&[data-state='checked']\": { backgroundColor: tokens.semAccentSolid },\n    \"&[data-state='unchecked']\": { backgroundColor: tokens.grayA3 },\n    \":focus-visible\": { outlineColor: tokens.accentA8 },\n  },\n  destructive: {\n    color: tokens.errorA8,\n    \"&[data-state='checked']\": { backgroundColor: tokens.semErrorSolid },\n    \"&[data-state='unchecked']\": { backgroundColor: tokens.errorA3 },\n    \":focus-visible\": { outlineColor: tokens.errorA8 },\n  },\n  sm: {\n    width: \"1.625rem\",\n    height: \"1rem\",\n    \"& svg\": { width: \"0.25rem\", height: \"0.375rem\" },\n  },\n  base: {\n    width: \"2.125rem\",\n    height: \"1.25rem\",\n    \"& svg\": { width: \"0.4375rem\", height: \"0.5rem\" },\n  },\n  lg: {\n    width: \"2.625rem\",\n    height: \"1.5rem\",\n    \"& svg\": { width: \"0.5rem\", height: \"0.625rem\" },\n  },\n})\n\nconst useThumbStyles = makeVoltStyles({\n  thumb: {\n    position: \"relative\",\n    display: \"block\",\n    pointerEvents: \"none\",\n    borderRadius: \"9999px\",\n    boxShadow: \"0 1px 2px 0 #0000000d\",\n    transitionProperty: \"transform\",\n    transitionTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n    transitionDuration: \"150ms\",\n    \"&[data-state='checked']\": {\n      transform: \"translateX(calc(100% - 1px))\",\n    },\n    \"&[data-state='unchecked']\": {\n      transform: \"translateX(1px)\",\n    },\n    \"&[data-state='checked'] [data-volt2-slot='switch-thumb-icon-checked']\": {\n      display: \"inline-block\",\n    },\n    \"&[data-state='unchecked'] [data-volt2-slot='switch-thumb-icon-unchecked']\":\n      {\n        display: \"inline-block\",\n      },\n  },\n  default: {\n    backgroundColor: tokens.grayContrast,\n    color: tokens.grayA8,\n    \"&[data-state='checked']\": { color: tokens.accentA11 },\n    \"&[data-state='unchecked']\": { color: tokens.grayA8 },\n  },\n  destructive: {\n    backgroundColor: tokens.errorContrast,\n    color: tokens.errorA8,\n    \"&[data-state='checked']\": { color: tokens.errorA11 },\n    \"&[data-state='unchecked']\": { color: tokens.errorA8 },\n  },\n  sm: {\n    width: \"0.75rem\",\n    height: \"0.75rem\",\n    \"& svg[data-volt2-slot='switch-thumb-icon-disabled']\": { width: \"0.25rem\" },\n  },\n  base: {\n    width: \"1rem\",\n    height: \"1rem\",\n    \"& svg[data-volt2-slot='switch-thumb-icon-disabled']\": {\n      width: \"0.375rem\",\n    },\n  },\n  lg: {\n    width: \"1.25rem\",\n    height: \"1.25rem\",\n    \"& svg[data-volt2-slot='switch-thumb-icon-disabled']\": {\n      width: \"0.4375rem\",\n    },\n  },\n})\n\n/**\n * `primary` is a deprecated alias of `default`, carried because v1 has it and real consumers still\n * pass it — entity-sidepanel's SettingsControls does. v1's own comment marks it deprecated and its\n * styles are byte-identical to `default`, so it is mapped rather than duplicated.\n *\n * @remarks `primary` is deprecated; use `default`.\n */\nexport type SwitchVariant = \"default\" | \"destructive\" | \"primary\"\nexport type SwitchSize = \"sm\" | \"base\" | \"lg\"\n\nexport type SwitchProps = React.ComponentProps<typeof SwitchPrimitive.Root> & {\n  variant?: SwitchVariant\n  size?: SwitchSize\n  showThumbIcon?: boolean\n}\n\nexport const Switch = React.forwardRef<\n  React.ComponentRef<typeof SwitchPrimitive.Root>,\n  SwitchProps\n>(function Switch(\n  {\n    variant = \"default\",\n    size = \"base\",\n    className,\n    showThumbIcon = false,\n    ...props\n  },\n  ref\n) {\n  const rootStyles = useRootStyles()\n  const thumbStyles = useThumbStyles()\n  // See SwitchVariant: `primary` is v1's deprecated alias for `default`, same styles.\n  const variantKey = variant === \"primary\" ? \"default\" : variant\n\n  return (\n    <SwitchPrimitive.Root\n      ref={ref}\n      data-slot=\"switch\"\n      {...{ [SLOT_ATTR]: \"switch\" }}\n      className={mergeClasses(\n        rootStyles.root,\n        rootStyles[variantKey],\n        rootStyles[size],\n        className\n      )}\n      {...props}\n    >\n      <SwitchPrimitive.Thumb\n        data-slot=\"switch-thumb\"\n        {...{ [SLOT_ATTR]: \"switch-thumb\" }}\n        className={mergeClasses(\n          thumbStyles.thumb,\n          thumbStyles[variantKey],\n          thumbStyles[size]\n        )}\n      >\n        {showThumbIcon && !props.disabled && <ThumbIconChecked />}\n        {showThumbIcon && !props.disabled && <ThumbIconUnchecked />}\n        {showThumbIcon && props.disabled && <ThumbIconDisabled />}\n      </SwitchPrimitive.Thumb>\n    </SwitchPrimitive.Root>\n  )\n})\n"],"names":["ThumbIconChecked","React","_props","ref","styles","useThumbIconStyles","jsx","SLOT_ATTR","ThumbIconUnchecked","ThumbIconDisabled","makeVoltStyles","shorthands","useRootStyles","tokens.grayA8","tokens.semAccentSolid","tokens.grayA3","tokens.accentA8","tokens.errorA8","tokens.semErrorSolid","tokens.errorA3","useThumbStyles","tokens.grayContrast","tokens.accentA11","tokens.errorContrast","tokens.errorA11","Switch","variant","size","className","showThumbIcon","props","rootStyles","thumbStyles","variantKey","SwitchPrimitive.Root","mergeClasses","jsxs","SwitchPrimitive.Thumb"],"mappings":"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"}