@proyecto-viviana/ui 0.6.2 → 0.8.0-rc.0

package/dist/_chunk/Chevron.js.map

@@ -1 +1 @@
-{"version":3,"file":"Chevron.js","names":["JSX","createUIIcon","ChevronProps","SvgSVGAttributes","SVGSVGElement","size","Chevron_XSSvg","props","Element","class","className","width","_width","height","_height","rest","_el$","_$getNextElement","_tmpl$","_$spread","_$mergeProps","_$runHydrationEvents","Chevron_SSvg","_el$2","_tmpl$2","Chevron_MSvg","_el$3","_tmpl$3","Chevron_LSvg","_el$4","_tmpl$4","Chevron_XLSvg","_el$5","_tmpl$5","Chevron_XXLSvg","_el$6","_tmpl$6","Chevron_XS","Chevron_S","Chevron_M","Chevron_L","Chevron_XL","Chevron_XXL","Chevron","_$createComponent","ChevronIcon"],"sources":["../../src/icon/ui-icons/Chevron.tsx"],"sourcesContent":["/*\n * Auto-generated from the shipped @react-spectrum/s2 dist assets (SVGO-\n * optimized — pixel parity requires the shipped path data, not the raw\n * vendored .svg sources). Variants absent from the dist (Arrow, Gripper)\n * fall back to the vendored sources.\n * Do not edit by hand.\n */\n\nimport { type JSX } from \"solid-js\";\nimport { createUIIcon } from \"../spectrum-icon\";\n\nexport type ChevronProps = JSX.SvgSVGAttributes<SVGSVGElement> & {\n  size?: \"XS\" | \"S\" | \"M\" | \"L\" | \"XL\" | \"XXL\";\n};\n\nfunction Chevron_XSSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const { class: className, width: _width, height: _height, ...rest } = props;\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"6\"\n      height=\"6\"\n      viewBox=\"0 0 6 6\"\n      {...rest}\n      class={className}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M1.985 5.961a.695.695 0 0 1-.7-.704.7.7 0 0 1 .209-.493L3.279 3 1.51 1.251A.7.7 0 0 1 1.3.757.696.696 0 0 1 2.492.255l2.275 2.247a.7.7 0 0 1 0 .996L2.477 5.76a.7.7 0 0 1-.492.201\"\n      />\n    </svg>\n  );\n}\n\nfunction Chevron_SSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const { class: className, width: _width, height: _height, ...rest } = props;\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"10\"\n      height=\"10\"\n      viewBox=\"0 0 10 10\"\n      {...rest}\n      class={className}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M7.483 4.406 3.86.783a.84.84 0 1 0-1.188 1.188L5.702 5l-3.03 3.03A.84.84 0 1 0 3.86 9.216l3.623-3.623a.84.84 0 0 0 0-1.188\"\n      />\n    </svg>\n  );\n}\n\nfunction Chevron_MSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const { class: className, width: _width, height: _height, ...rest } = props;\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"10\"\n      height=\"10\"\n      viewBox=\"0 0 10 10\"\n      {...rest}\n      class={className}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M7.965 5.178C7.978 5.118 8 5.061 8 5s-.021-.118-.034-.178c-.01-.05-.01-.102-.03-.15-.023-.058-.068-.107-.104-.16-.03-.042-.047-.09-.084-.127l-.004-.003-.003-.004L3.615.303a.875.875 0 1 0-1.23 1.244L5.88 5 2.385 8.453a.875.875 0 1 0 1.23 1.244L7.74 5.622l.003-.004.004-.003c.037-.038.055-.085.084-.127.036-.053.08-.102.104-.16.02-.048.02-.1.03-.15\"\n      />\n    </svg>\n  );\n}\n\nfunction Chevron_LSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const { class: className, width: _width, height: _height, ...rest } = props;\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"12\"\n      height=\"12\"\n      viewBox=\"0 0 12 12\"\n      {...rest}\n      class={className}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M9.301 6c0-.049-.02-.095-.028-.143-.01-.068-.013-.136-.039-.2a.9.9 0 0 0-.2-.302L4.343.663a.912.912 0 0 0-1.29 1.29L7.102 6l-4.047 4.048a.912.912 0 0 0 1.289 1.289l4.691-4.692a.9.9 0 0 0 .2-.302c.026-.064.028-.132.04-.2C9.28 6.095 9.3 6.05 9.3 6\"\n      />\n    </svg>\n  );\n}\n\nfunction Chevron_XLSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const { class: className, width: _width, height: _height, ...rest } = props;\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"14\"\n      height=\"14\"\n      viewBox=\"0 0 14 14\"\n      {...rest}\n      class={className}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M10.361 6.328 5.03.996a.954.954 0 0 0-1.343 0 .95.95 0 0 0 0 1.344L8.346 7l-4.66 4.66a.95.95 0 0 0 1.344 1.344l5.331-5.332a.95.95 0 0 0 0-1.344\"\n      />\n    </svg>\n  );\n}\n\nfunction Chevron_XXLSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const { class: className, width: _width, height: _height, ...rest } = props;\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"16\"\n      height=\"16\"\n      viewBox=\"0 0 16 16\"\n      {...rest}\n      class={className}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M11.726 7.3 5.67 1.247A.988.988 0 1 0 4.27 2.645L9.628 8 4.27 13.355a.988.988 0 1 0 1.399 1.399l6.056-6.055a.99.99 0 0 0 0-1.398\"\n      />\n    </svg>\n  );\n}\n\nconst Chevron_XS = createUIIcon(Chevron_XSSvg);\nconst Chevron_S = createUIIcon(Chevron_SSvg);\nconst Chevron_M = createUIIcon(Chevron_MSvg);\nconst Chevron_L = createUIIcon(Chevron_LSvg);\nconst Chevron_XL = createUIIcon(Chevron_XLSvg);\nconst Chevron_XXL = createUIIcon(Chevron_XXLSvg);\n\nexport default function Chevron(props: ChevronProps): JSX.Element {\n  const { size = \"M\", class: className, width: _width, height: _height, ...rest } = props;\n  switch (size) {\n    case \"XS\":\n      return <Chevron_XS {...rest} class={className} />;\n    case \"S\":\n      return <Chevron_S {...rest} class={className} />;\n    case \"M\":\n      return <Chevron_M {...rest} class={className} />;\n    case \"L\":\n      return <Chevron_L {...rest} class={className} />;\n    case \"XL\":\n      return <Chevron_XL {...rest} class={className} />;\n    case \"XXL\":\n      return <Chevron_XXL {...rest} class={className} />;\n    default:\n      return <Chevron_M {...rest} class={className} />;\n  }\n}\n\nexport const ChevronIcon = Chevron;\n"],"mappings":"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"}
+{"version":3,"file":"Chevron.js","names":[],"sources":["../../src/icon/ui-icons/Chevron.tsx"],"sourcesContent":["/*\n * Auto-generated from the pinned @react-spectrum/s2 icon inventory.\n * Do not edit by hand.\n */\n// Generator input: react-spectrum/packages/@react-spectrum/s2/ui-icons/Chevron.tsx\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_ChevronSize50.mjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_ChevronSize50.cjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_ChevronSize75.mjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_ChevronSize75.cjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_ChevronSize100.mjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_ChevronSize100.cjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_ChevronSize200.mjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_ChevronSize200.cjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_ChevronSize300.mjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_ChevronSize300.cjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_ChevronSize400.mjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_ChevronSize400.cjs\n\nimport type { JSX } from \"@solidjs/web\";\nimport { createUIIcon } from \"../spectrum-icon\";\nimport { style } from \"../../style\" with { type: \"macro\" };\nimport { splitProps } from \"@proyecto-viviana/solidaria/utils\";\n\nconst styles = style({\n  width: {\n    size: {\n      M: 10,\n      L: 12,\n      XL: 14,\n      XXL: 16,\n      XS: 6,\n      S: 10,\n    },\n  },\n  height: {\n    size: {\n      M: 10,\n      L: 12,\n      XL: 14,\n      XXL: 16,\n      XS: 6,\n      S: 10,\n    },\n  },\n});\n\nexport type ChevronProps = JSX.SvgSVGAttributes<SVGSVGElement> & {\n  size?: \"XS\" | \"S\" | \"M\" | \"L\" | \"XL\" | \"XXL\";\n};\n\nfunction Chevron_XSSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const [local, rest] = splitProps(props, [\"class\", \"width\", \"height\"]);\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"6\"\n      height=\"6\"\n      viewBox=\"0 0 6 6\"\n      {...rest}\n      class={local.class}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M1.985 5.961a.695.695 0 0 1-.7-.704.7.7 0 0 1 .209-.493L3.279 3 1.51 1.251A.7.7 0 0 1 1.3.757.696.696 0 0 1 2.492.255l2.275 2.247a.7.7 0 0 1 0 .996L2.477 5.76a.7.7 0 0 1-.492.201\"\n      />\n    </svg>\n  );\n}\n\nfunction Chevron_SSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const [local, rest] = splitProps(props, [\"class\", \"width\", \"height\"]);\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"10\"\n      height=\"10\"\n      viewBox=\"0 0 10 10\"\n      {...rest}\n      class={local.class}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M7.483 4.406 3.86.783a.84.84 0 1 0-1.188 1.188L5.702 5l-3.03 3.03A.84.84 0 1 0 3.86 9.216l3.623-3.623a.84.84 0 0 0 0-1.188\"\n      />\n    </svg>\n  );\n}\n\nfunction Chevron_MSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const [local, rest] = splitProps(props, [\"class\", \"width\", \"height\"]);\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"10\"\n      height=\"10\"\n      viewBox=\"0 0 10 10\"\n      {...rest}\n      class={local.class}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M7.965 5.178C7.978 5.118 8 5.061 8 5s-.021-.118-.034-.178c-.01-.05-.01-.102-.03-.15-.023-.058-.068-.107-.104-.16-.03-.042-.047-.09-.084-.127l-.004-.003-.003-.004L3.615.303a.875.875 0 1 0-1.23 1.244L5.88 5 2.385 8.453a.875.875 0 1 0 1.23 1.244L7.74 5.622l.003-.004.004-.003c.037-.038.055-.085.084-.127.036-.053.08-.102.104-.16.02-.048.02-.1.03-.15\"\n      />\n    </svg>\n  );\n}\n\nfunction Chevron_LSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const [local, rest] = splitProps(props, [\"class\", \"width\", \"height\"]);\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"12\"\n      height=\"12\"\n      viewBox=\"0 0 12 12\"\n      {...rest}\n      class={local.class}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M9.301 6c0-.049-.02-.095-.028-.143-.01-.068-.013-.136-.039-.2a.9.9 0 0 0-.2-.302L4.343.663a.912.912 0 0 0-1.29 1.29L7.102 6l-4.047 4.048a.912.912 0 0 0 1.289 1.289l4.691-4.692a.9.9 0 0 0 .2-.302c.026-.064.028-.132.04-.2C9.28 6.095 9.3 6.05 9.3 6\"\n      />\n    </svg>\n  );\n}\n\nfunction Chevron_XLSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const [local, rest] = splitProps(props, [\"class\", \"width\", \"height\"]);\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"14\"\n      height=\"14\"\n      viewBox=\"0 0 14 14\"\n      {...rest}\n      class={local.class}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M10.361 6.328 5.03.996a.954.954 0 0 0-1.343 0 .95.95 0 0 0 0 1.344L8.346 7l-4.66 4.66a.95.95 0 0 0 1.344 1.344l5.331-5.332a.95.95 0 0 0 0-1.344\"\n      />\n    </svg>\n  );\n}\n\nfunction Chevron_XXLSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const [local, rest] = splitProps(props, [\"class\", \"width\", \"height\"]);\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"16\"\n      height=\"16\"\n      viewBox=\"0 0 16 16\"\n      {...rest}\n      class={local.class}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M11.726 7.3 5.67 1.247A.988.988 0 1 0 4.27 2.645L9.628 8 4.27 13.355a.988.988 0 1 0 1.399 1.399l6.056-6.055a.99.99 0 0 0 0-1.398\"\n      />\n    </svg>\n  );\n}\n\nconst Chevron_XS = createUIIcon(Chevron_XSSvg);\nconst Chevron_S = createUIIcon(Chevron_SSvg);\nconst Chevron_M = createUIIcon(Chevron_MSvg);\nconst Chevron_L = createUIIcon(Chevron_LSvg);\nconst Chevron_XL = createUIIcon(Chevron_XLSvg);\nconst Chevron_XXL = createUIIcon(Chevron_XXLSvg);\n\nexport default function Chevron(props: ChevronProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\"size\", \"class\", \"width\", \"height\"]);\n  const size = local.size ?? \"M\";\n  const mergedClass = () => `${local.class ?? \"\"}${styles({ size })}`;\n  switch (size) {\n    case \"XS\":\n      return <Chevron_XS {...rest} class={mergedClass()} />;\n    case \"S\":\n      return <Chevron_S {...rest} class={mergedClass()} />;\n    case \"M\":\n      return <Chevron_M {...rest} class={mergedClass()} />;\n    case \"L\":\n      return <Chevron_L {...rest} class={mergedClass()} />;\n    case \"XL\":\n      return <Chevron_XL {...rest} class={mergedClass()} />;\n    case \"XXL\":\n      return <Chevron_XXL {...rest} class={mergedClass()} />;\n    default:\n      return <Chevron_M {...rest} class={mergedClass()} />;\n  }\n}\n\nexport const ChevronIcon = Chevron;\n"],"mappings":";;;;;;;;;;AAuBA,MAAM,SAAA,SAAA,UAAA,OAAA;;;;;;;;;;;;;;;;AA2BN,SAAS,cAAc,OAAiD;CACtE,MAAM,CAAC,OAAO,QAAQ,WAAW,OAAO;EAAC;EAAS;EAAS;CAAS,CAAA;CAC7D,IAAA,OAAA,eAAA,MAaH;;EARQ;GAHR,OAAA;GACA,OAAA;GACA,QAAA;GACA,SAAA;EACQ;EAAJ;EACJ,EAAA,IAAA,UAAA;GAAO,OAAA,MAAM;EAAK,EAAA;;CAPf,mBAaH;CAbJ,OAAO;AAeT;AAEA,SAAS,aAAa,OAAiD;CACrE,MAAM,CAAC,OAAO,QAAQ,WAAW,OAAO;EAAC;EAAS;EAAS;CAAS,CAAA;CAC7D,IAAA,QAAA,eAAA,OAaH;;EARQ;GAHR,OAAA;GACA,OAAA;GACA,QAAA;GACA,SAAA;EACQ;EAAJ;EACJ,EAAA,IAAA,UAAA;GAAO,OAAA,MAAM;EAAK,EAAA;;CAPf,mBAaH;CAbJ,OAAO;AAeT;AAEA,SAAS,aAAa,OAAiD;CACrE,MAAM,CAAC,OAAO,QAAQ,WAAW,OAAO;EAAC;EAAS;EAAS;CAAS,CAAA;CAC7D,IAAA,QAAA,eAAA,OAaH;;EARQ;GAHR,OAAA;GACA,OAAA;GACA,QAAA;GACA,SAAA;EACQ;EAAJ;EACJ,EAAA,IAAA,UAAA;GAAO,OAAA,MAAM;EAAK,EAAA;;CAPf,mBAaH;CAbJ,OAAO;AAeT;AAEA,SAAS,aAAa,OAAiD;CACrE,MAAM,CAAC,OAAO,QAAQ,WAAW,OAAO;EAAC;EAAS;EAAS;CAAS,CAAA;CAC7D,IAAA,QAAA,eAAA,OAaH;;EARQ;GAHR,OAAA;GACA,OAAA;GACA,QAAA;GACA,SAAA;EACQ;EAAJ;EACJ,EAAA,IAAA,UAAA;GAAO,OAAA,MAAM;EAAK,EAAA;;CAPf,mBAaH;CAbJ,OAAO;AAeT;AAEA,SAAS,cAAc,OAAiD;CACtE,MAAM,CAAC,OAAO,QAAQ,WAAW,OAAO;EAAC;EAAS;EAAS;CAAS,CAAA;CAC7D,IAAA,QAAA,eAAA,OAaH;;EARQ;GAHR,OAAA;GACA,OAAA;GACA,QAAA;GACA,SAAA;EACQ;EAAJ;EACJ,EAAA,IAAA,UAAA;GAAO,OAAA,MAAM;EAAK,EAAA;;CAPf,mBAaH;CAbJ,OAAO;AAeT;AAEA,SAAS,eAAe,OAAiD;CACvE,MAAM,CAAC,OAAO,QAAQ,WAAW,OAAO;EAAC;EAAS;EAAS;CAAS,CAAA;CAC7D,IAAA,QAAA,eAAA,OAaH;;EARQ;GAHR,OAAA;GACA,OAAA;GACA,QAAA;GACA,SAAA;EACQ;EAAJ;EACJ,EAAA,IAAA,UAAA;GAAO,OAAA,MAAM;EAAK,EAAA;;CAPf,mBAaH;CAbJ,OAAO;AAeT;AAEA,MAAM,aAAa,aAAa,aAAA;AAChC,MAAM,YAAY,aAAa,YAAA;AAC/B,MAAM,YAAY,aAAa,YAAA;AAC/B,MAAM,YAAY,aAAa,YAAA;AAC/B,MAAM,aAAa,aAAa,aAAA;AAChC,MAAM,cAAc,aAAa,cAAA;AAEjC,SAAwB,QAAQ,OAA0B;CACxD,MAAM,CAAC,OAAO,QAAQ,WAAW,OAAO;EAAC;EAAQ;EAAS;EAAS;CAAS,CAAA;CAC5E,MAAM,OAAO,MAAM,QAAQ;CAC3B,MAAM,oBAAoB,GAAG,MAAM,SAAS,KAAK,OAAO,EAAE,KAAK,CAAA;CAC/D,QAAQ,MAAR;EACE,KAAK,MACH,OAAA,gBAAA,YAAA,WAAuB,MAAvB,EAA6B,IAAA,UAAA;GAAO,OAAA,YAAA;EAAA,EAAA,CAAA,CAAA;EACtC,KAAK,KACH,OAAA,gBAAA,WAAA,WAAsB,MAAtB,EAA4B,IAAA,UAAA;GAAO,OAAA,YAAA;EAAA,EAAA,CAAA,CAAA;EACrC,KAAK,KACH,OAAA,gBAAA,WAAA,WAAsB,MAAtB,EAA4B,IAAA,UAAA;GAAO,OAAA,YAAA;EAAA,EAAA,CAAA,CAAA;EACrC,KAAK,KACH,OAAA,gBAAA,WAAA,WAAsB,MAAtB,EAA4B,IAAA,UAAA;GAAO,OAAA,YAAA;EAAA,EAAA,CAAA,CAAA;EACrC,KAAK,MACH,OAAA,gBAAA,YAAA,WAAuB,MAAvB,EAA6B,IAAA,UAAA;GAAO,OAAA,YAAA;EAAA,EAAA,CAAA,CAAA;EACtC,KAAK,OACH,OAAA,gBAAA,aAAA,WAAwB,MAAxB,EAA8B,IAAA,UAAA;GAAO,OAAA,YAAA;EAAA,EAAA,CAAA,CAAA;EACvC,SACE,OAAA,gBAAA,WAAA,WAAsB,MAAtB,EAA4B,IAAA,UAAA;GAAO,OAAA,YAAA;EAAA,EAAA,CAAA,CAAA;CACvC;AACF"}

package/dist/_chunk/Chevron.jsx

@@ -1,38 +1,79 @@
 import { a as createUIIcon } from "./spectrum-icon.jsx";
+import { splitProps } from "@proyecto-viviana/solidaria/utils";
 //#region src/icon/ui-icons/Chevron.tsx
+const styles = function anonymous(props) {
+	let rules = " ";
+	if (props.size === "S") rules += " Zi17";
+	else if (props.size === "XS") rules += " Zg17";
+	else if (props.size === "XXL") rules += " Zu17";
+	else if (props.size === "XL") rules += " Zk17";
+	else if (props.size === "L") rules += " Zj17";
+	else if (props.size === "M") rules += " Zi17";
+	if (props.size === "S") rules += " Fj17";
+	else if (props.size === "XS") rules += " Fg17";
+	else if (props.size === "XXL") rules += " Ft17";
+	else if (props.size === "XL") rules += " Fl17";
+	else if (props.size === "L") rules += " Fk17";
+	else if (props.size === "M") rules += " Fj17";
+	return rules;
+};
 function Chevron_XSSvg(props) {
-	const { class: className, width: _width, height: _height, ...rest } = props;
-	return <svg xmlns="http://www.w3.org/2000/svg" width="6" height="6" viewBox="0 0 6 6" {...rest} class={className}>
+	const [local, rest] = splitProps(props, [
+		"class",
+		"width",
+		"height"
+	]);
+	return <svg xmlns="http://www.w3.org/2000/svg" width="6" height="6" viewBox="0 0 6 6" {...rest} class={local.class}>
       <path fill="var(--iconPrimary, #222)" d="M1.985 5.961a.695.695 0 0 1-.7-.704.7.7 0 0 1 .209-.493L3.279 3 1.51 1.251A.7.7 0 0 1 1.3.757.696.696 0 0 1 2.492.255l2.275 2.247a.7.7 0 0 1 0 .996L2.477 5.76a.7.7 0 0 1-.492.201" />
     </svg>;
 }
 function Chevron_SSvg(props) {
-	const { class: className, width: _width, height: _height, ...rest } = props;
-	return <svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 10 10" {...rest} class={className}>
+	const [local, rest] = splitProps(props, [
+		"class",
+		"width",
+		"height"
+	]);
+	return <svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 10 10" {...rest} class={local.class}>
       <path fill="var(--iconPrimary, #222)" d="M7.483 4.406 3.86.783a.84.84 0 1 0-1.188 1.188L5.702 5l-3.03 3.03A.84.84 0 1 0 3.86 9.216l3.623-3.623a.84.84 0 0 0 0-1.188" />
     </svg>;
 }
 function Chevron_MSvg(props) {
-	const { class: className, width: _width, height: _height, ...rest } = props;
-	return <svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 10 10" {...rest} class={className}>
+	const [local, rest] = splitProps(props, [
+		"class",
+		"width",
+		"height"
+	]);
+	return <svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 10 10" {...rest} class={local.class}>
       <path fill="var(--iconPrimary, #222)" d="M7.965 5.178C7.978 5.118 8 5.061 8 5s-.021-.118-.034-.178c-.01-.05-.01-.102-.03-.15-.023-.058-.068-.107-.104-.16-.03-.042-.047-.09-.084-.127l-.004-.003-.003-.004L3.615.303a.875.875 0 1 0-1.23 1.244L5.88 5 2.385 8.453a.875.875 0 1 0 1.23 1.244L7.74 5.622l.003-.004.004-.003c.037-.038.055-.085.084-.127.036-.053.08-.102.104-.16.02-.048.02-.1.03-.15" />
     </svg>;
 }
 function Chevron_LSvg(props) {
-	const { class: className, width: _width, height: _height, ...rest } = props;
-	return <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" {...rest} class={className}>
+	const [local, rest] = splitProps(props, [
+		"class",
+		"width",
+		"height"
+	]);
+	return <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" {...rest} class={local.class}>
       <path fill="var(--iconPrimary, #222)" d="M9.301 6c0-.049-.02-.095-.028-.143-.01-.068-.013-.136-.039-.2a.9.9 0 0 0-.2-.302L4.343.663a.912.912 0 0 0-1.29 1.29L7.102 6l-4.047 4.048a.912.912 0 0 0 1.289 1.289l4.691-4.692a.9.9 0 0 0 .2-.302c.026-.064.028-.132.04-.2C9.28 6.095 9.3 6.05 9.3 6" />
     </svg>;
 }
 function Chevron_XLSvg(props) {
-	const { class: className, width: _width, height: _height, ...rest } = props;
-	return <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" {...rest} class={className}>
+	const [local, rest] = splitProps(props, [
+		"class",
+		"width",
+		"height"
+	]);
+	return <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" {...rest} class={local.class}>
       <path fill="var(--iconPrimary, #222)" d="M10.361 6.328 5.03.996a.954.954 0 0 0-1.343 0 .95.95 0 0 0 0 1.344L8.346 7l-4.66 4.66a.95.95 0 0 0 1.344 1.344l5.331-5.332a.95.95 0 0 0 0-1.344" />
     </svg>;
 }
 function Chevron_XXLSvg(props) {
-	const { class: className, width: _width, height: _height, ...rest } = props;
-	return <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" {...rest} class={className}>
+	const [local, rest] = splitProps(props, [
+		"class",
+		"width",
+		"height"
+	]);
+	return <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" {...rest} class={local.class}>
       <path fill="var(--iconPrimary, #222)" d="M11.726 7.3 5.67 1.247A.988.988 0 1 0 4.27 2.645L9.628 8 4.27 13.355a.988.988 0 1 0 1.399 1.399l6.056-6.055a.99.99 0 0 0 0-1.398" />
     </svg>;
 }
@@ -43,15 +84,22 @@ const Chevron_L = createUIIcon(Chevron_LSvg);
 const Chevron_XL = createUIIcon(Chevron_XLSvg);
 const Chevron_XXL = createUIIcon(Chevron_XXLSvg);
 function Chevron(props) {
-	const { size = "M", class: className, width: _width, height: _height, ...rest } = props;
+	const [local, rest] = splitProps(props, [
+		"size",
+		"class",
+		"width",
+		"height"
+	]);
+	const size = local.size ?? "M";
+	const mergedClass = () => `${local.class ?? ""}${styles({ size })}`;
 	switch (size) {
-		case "XS": return <Chevron_XS {...rest} class={className} />;
-		case "S": return <Chevron_S {...rest} class={className} />;
-		case "M": return <Chevron_M {...rest} class={className} />;
-		case "L": return <Chevron_L {...rest} class={className} />;
-		case "XL": return <Chevron_XL {...rest} class={className} />;
-		case "XXL": return <Chevron_XXL {...rest} class={className} />;
-		default: return <Chevron_M {...rest} class={className} />;
+		case "XS": return <Chevron_XS {...rest} class={mergedClass()} />;
+		case "S": return <Chevron_S {...rest} class={mergedClass()} />;
+		case "M": return <Chevron_M {...rest} class={mergedClass()} />;
+		case "L": return <Chevron_L {...rest} class={mergedClass()} />;
+		case "XL": return <Chevron_XL {...rest} class={mergedClass()} />;
+		case "XXL": return <Chevron_XXL {...rest} class={mergedClass()} />;
+		default: return <Chevron_M {...rest} class={mergedClass()} />;
 	}
 }
 //#endregion

package/dist/_chunk/Chevron.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"Chevron.jsx","names":[],"sources":["../../src/icon/ui-icons/Chevron.tsx"],"sourcesContent":["/*\n * Auto-generated from the shipped @react-spectrum/s2 dist assets (SVGO-\n * optimized — pixel parity requires the shipped path data, not the raw\n * vendored .svg sources). Variants absent from the dist (Arrow, Gripper)\n * fall back to the vendored sources.\n * Do not edit by hand.\n */\n\nimport { type JSX } from \"solid-js\";\nimport { createUIIcon } from \"../spectrum-icon\";\n\nexport type ChevronProps = JSX.SvgSVGAttributes<SVGSVGElement> & {\n  size?: \"XS\" | \"S\" | \"M\" | \"L\" | \"XL\" | \"XXL\";\n};\n\nfunction Chevron_XSSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const { class: className, width: _width, height: _height, ...rest } = props;\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"6\"\n      height=\"6\"\n      viewBox=\"0 0 6 6\"\n      {...rest}\n      class={className}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M1.985 5.961a.695.695 0 0 1-.7-.704.7.7 0 0 1 .209-.493L3.279 3 1.51 1.251A.7.7 0 0 1 1.3.757.696.696 0 0 1 2.492.255l2.275 2.247a.7.7 0 0 1 0 .996L2.477 5.76a.7.7 0 0 1-.492.201\"\n      />\n    </svg>\n  );\n}\n\nfunction Chevron_SSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const { class: className, width: _width, height: _height, ...rest } = props;\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"10\"\n      height=\"10\"\n      viewBox=\"0 0 10 10\"\n      {...rest}\n      class={className}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M7.483 4.406 3.86.783a.84.84 0 1 0-1.188 1.188L5.702 5l-3.03 3.03A.84.84 0 1 0 3.86 9.216l3.623-3.623a.84.84 0 0 0 0-1.188\"\n      />\n    </svg>\n  );\n}\n\nfunction Chevron_MSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const { class: className, width: _width, height: _height, ...rest } = props;\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"10\"\n      height=\"10\"\n      viewBox=\"0 0 10 10\"\n      {...rest}\n      class={className}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M7.965 5.178C7.978 5.118 8 5.061 8 5s-.021-.118-.034-.178c-.01-.05-.01-.102-.03-.15-.023-.058-.068-.107-.104-.16-.03-.042-.047-.09-.084-.127l-.004-.003-.003-.004L3.615.303a.875.875 0 1 0-1.23 1.244L5.88 5 2.385 8.453a.875.875 0 1 0 1.23 1.244L7.74 5.622l.003-.004.004-.003c.037-.038.055-.085.084-.127.036-.053.08-.102.104-.16.02-.048.02-.1.03-.15\"\n      />\n    </svg>\n  );\n}\n\nfunction Chevron_LSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const { class: className, width: _width, height: _height, ...rest } = props;\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"12\"\n      height=\"12\"\n      viewBox=\"0 0 12 12\"\n      {...rest}\n      class={className}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M9.301 6c0-.049-.02-.095-.028-.143-.01-.068-.013-.136-.039-.2a.9.9 0 0 0-.2-.302L4.343.663a.912.912 0 0 0-1.29 1.29L7.102 6l-4.047 4.048a.912.912 0 0 0 1.289 1.289l4.691-4.692a.9.9 0 0 0 .2-.302c.026-.064.028-.132.04-.2C9.28 6.095 9.3 6.05 9.3 6\"\n      />\n    </svg>\n  );\n}\n\nfunction Chevron_XLSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const { class: className, width: _width, height: _height, ...rest } = props;\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"14\"\n      height=\"14\"\n      viewBox=\"0 0 14 14\"\n      {...rest}\n      class={className}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M10.361 6.328 5.03.996a.954.954 0 0 0-1.343 0 .95.95 0 0 0 0 1.344L8.346 7l-4.66 4.66a.95.95 0 0 0 1.344 1.344l5.331-5.332a.95.95 0 0 0 0-1.344\"\n      />\n    </svg>\n  );\n}\n\nfunction Chevron_XXLSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const { class: className, width: _width, height: _height, ...rest } = props;\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"16\"\n      height=\"16\"\n      viewBox=\"0 0 16 16\"\n      {...rest}\n      class={className}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M11.726 7.3 5.67 1.247A.988.988 0 1 0 4.27 2.645L9.628 8 4.27 13.355a.988.988 0 1 0 1.399 1.399l6.056-6.055a.99.99 0 0 0 0-1.398\"\n      />\n    </svg>\n  );\n}\n\nconst Chevron_XS = createUIIcon(Chevron_XSSvg);\nconst Chevron_S = createUIIcon(Chevron_SSvg);\nconst Chevron_M = createUIIcon(Chevron_MSvg);\nconst Chevron_L = createUIIcon(Chevron_LSvg);\nconst Chevron_XL = createUIIcon(Chevron_XLSvg);\nconst Chevron_XXL = createUIIcon(Chevron_XXLSvg);\n\nexport default function Chevron(props: ChevronProps): JSX.Element {\n  const { size = \"M\", class: className, width: _width, height: _height, ...rest } = props;\n  switch (size) {\n    case \"XS\":\n      return <Chevron_XS {...rest} class={className} />;\n    case \"S\":\n      return <Chevron_S {...rest} class={className} />;\n    case \"M\":\n      return <Chevron_M {...rest} class={className} />;\n    case \"L\":\n      return <Chevron_L {...rest} class={className} />;\n    case \"XL\":\n      return <Chevron_XL {...rest} class={className} />;\n    case \"XXL\":\n      return <Chevron_XXL {...rest} class={className} />;\n    default:\n      return <Chevron_M {...rest} class={className} />;\n  }\n}\n\nexport const ChevronIcon = Chevron;\n"],"mappings":";;AAeA,SAAS,cAAc,OAAyD;CAC9E,MAAM,EAAE,OAAO,WAAW,OAAO,QAAQ,QAAQ,SAAS,GAAG,SAAS;CACtE,OACE,CAAC,IACC,mCACA,UACA,WACA,sBACI,MACJ,OAAO,WACR;MACC,CAAC,KACC,gCACA,yLACA;IACJ,EAAE;AAEN;AAEA,SAAS,aAAa,OAAyD;CAC7E,MAAM,EAAE,OAAO,WAAW,OAAO,QAAQ,QAAQ,SAAS,GAAG,SAAS;CACtE,OACE,CAAC,IACC,mCACA,WACA,YACA,wBACI,MACJ,OAAO,WACR;MACC,CAAC,KACC,gCACA,iIACA;IACJ,EAAE;AAEN;AAEA,SAAS,aAAa,OAAyD;CAC7E,MAAM,EAAE,OAAO,WAAW,OAAO,QAAQ,QAAQ,SAAS,GAAG,SAAS;CACtE,OACE,CAAC,IACC,mCACA,WACA,YACA,wBACI,MACJ,OAAO,WACR;MACC,CAAC,KACC,gCACA,iWACA;IACJ,EAAE;AAEN;AAEA,SAAS,aAAa,OAAyD;CAC7E,MAAM,EAAE,OAAO,WAAW,OAAO,QAAQ,QAAQ,SAAS,GAAG,SAAS;CACtE,OACE,CAAC,IACC,mCACA,WACA,YACA,wBACI,MACJ,OAAO,WACR;MACC,CAAC,KACC,gCACA,4PACA;IACJ,EAAE;AAEN;AAEA,SAAS,cAAc,OAAyD;CAC9E,MAAM,EAAE,OAAO,WAAW,OAAO,QAAQ,QAAQ,SAAS,GAAG,SAAS;CACtE,OACE,CAAC,IACC,mCACA,WACA,YACA,wBACI,MACJ,OAAO,WACR;MACC,CAAC,KACC,gCACA,sJACA;IACJ,EAAE;AAEN;AAEA,SAAS,eAAe,OAAyD;CAC/E,MAAM,EAAE,OAAO,WAAW,OAAO,QAAQ,QAAQ,SAAS,GAAG,SAAS;CACtE,OACE,CAAC,IACC,mCACA,WACA,YACA,wBACI,MACJ,OAAO,WACR;MACC,CAAC,KACC,gCACA,uIACA;IACJ,EAAE;AAEN;AAEA,MAAM,aAAa,aAAa,aAAa;AAC7C,MAAM,YAAY,aAAa,YAAY;AAC3C,MAAM,YAAY,aAAa,YAAY;AAC3C,MAAM,YAAY,aAAa,YAAY;AAC3C,MAAM,aAAa,aAAa,aAAa;AAC7C,MAAM,cAAc,aAAa,cAAc;AAE/C,SAAwB,QAAQ,OAAkC;CAChE,MAAM,EAAE,OAAO,KAAK,OAAO,WAAW,OAAO,QAAQ,QAAQ,SAAS,GAAG,SAAS;CAClF,QAAQ,MAAR;EACE,KAAK,MACH,OAAO,CAAC,eAAe,MAAM,OAAO;EACtC,KAAK,KACH,OAAO,CAAC,cAAc,MAAM,OAAO;EACrC,KAAK,KACH,OAAO,CAAC,cAAc,MAAM,OAAO;EACrC,KAAK,KACH,OAAO,CAAC,cAAc,MAAM,OAAO;EACrC,KAAK,MACH,OAAO,CAAC,eAAe,MAAM,OAAO;EACtC,KAAK,OACH,OAAO,CAAC,gBAAgB,MAAM,OAAO;EACvC,SACE,OAAO,CAAC,cAAc,MAAM,OAAO;CACvC;AACF"}
+{"version":3,"file":"Chevron.jsx","names":[],"sources":["../../src/icon/ui-icons/Chevron.tsx"],"sourcesContent":["/*\n * Auto-generated from the pinned @react-spectrum/s2 icon inventory.\n * Do not edit by hand.\n */\n// Generator input: react-spectrum/packages/@react-spectrum/s2/ui-icons/Chevron.tsx\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_ChevronSize50.mjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_ChevronSize50.cjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_ChevronSize75.mjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_ChevronSize75.cjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_ChevronSize100.mjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_ChevronSize100.cjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_ChevronSize200.mjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_ChevronSize200.cjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_ChevronSize300.mjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_ChevronSize300.cjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_ChevronSize400.mjs\n// Generator input: @react-spectrum/s2@1.7.0/dist/private/S2_ChevronSize400.cjs\n\nimport type { JSX } from \"@solidjs/web\";\nimport { createUIIcon } from \"../spectrum-icon\";\nimport { style } from \"../../style\" with { type: \"macro\" };\nimport { splitProps } from \"@proyecto-viviana/solidaria/utils\";\n\nconst styles = style({\n  width: {\n    size: {\n      M: 10,\n      L: 12,\n      XL: 14,\n      XXL: 16,\n      XS: 6,\n      S: 10,\n    },\n  },\n  height: {\n    size: {\n      M: 10,\n      L: 12,\n      XL: 14,\n      XXL: 16,\n      XS: 6,\n      S: 10,\n    },\n  },\n});\n\nexport type ChevronProps = JSX.SvgSVGAttributes<SVGSVGElement> & {\n  size?: \"XS\" | \"S\" | \"M\" | \"L\" | \"XL\" | \"XXL\";\n};\n\nfunction Chevron_XSSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const [local, rest] = splitProps(props, [\"class\", \"width\", \"height\"]);\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"6\"\n      height=\"6\"\n      viewBox=\"0 0 6 6\"\n      {...rest}\n      class={local.class}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M1.985 5.961a.695.695 0 0 1-.7-.704.7.7 0 0 1 .209-.493L3.279 3 1.51 1.251A.7.7 0 0 1 1.3.757.696.696 0 0 1 2.492.255l2.275 2.247a.7.7 0 0 1 0 .996L2.477 5.76a.7.7 0 0 1-.492.201\"\n      />\n    </svg>\n  );\n}\n\nfunction Chevron_SSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const [local, rest] = splitProps(props, [\"class\", \"width\", \"height\"]);\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"10\"\n      height=\"10\"\n      viewBox=\"0 0 10 10\"\n      {...rest}\n      class={local.class}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M7.483 4.406 3.86.783a.84.84 0 1 0-1.188 1.188L5.702 5l-3.03 3.03A.84.84 0 1 0 3.86 9.216l3.623-3.623a.84.84 0 0 0 0-1.188\"\n      />\n    </svg>\n  );\n}\n\nfunction Chevron_MSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const [local, rest] = splitProps(props, [\"class\", \"width\", \"height\"]);\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"10\"\n      height=\"10\"\n      viewBox=\"0 0 10 10\"\n      {...rest}\n      class={local.class}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M7.965 5.178C7.978 5.118 8 5.061 8 5s-.021-.118-.034-.178c-.01-.05-.01-.102-.03-.15-.023-.058-.068-.107-.104-.16-.03-.042-.047-.09-.084-.127l-.004-.003-.003-.004L3.615.303a.875.875 0 1 0-1.23 1.244L5.88 5 2.385 8.453a.875.875 0 1 0 1.23 1.244L7.74 5.622l.003-.004.004-.003c.037-.038.055-.085.084-.127.036-.053.08-.102.104-.16.02-.048.02-.1.03-.15\"\n      />\n    </svg>\n  );\n}\n\nfunction Chevron_LSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const [local, rest] = splitProps(props, [\"class\", \"width\", \"height\"]);\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"12\"\n      height=\"12\"\n      viewBox=\"0 0 12 12\"\n      {...rest}\n      class={local.class}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M9.301 6c0-.049-.02-.095-.028-.143-.01-.068-.013-.136-.039-.2a.9.9 0 0 0-.2-.302L4.343.663a.912.912 0 0 0-1.29 1.29L7.102 6l-4.047 4.048a.912.912 0 0 0 1.289 1.289l4.691-4.692a.9.9 0 0 0 .2-.302c.026-.064.028-.132.04-.2C9.28 6.095 9.3 6.05 9.3 6\"\n      />\n    </svg>\n  );\n}\n\nfunction Chevron_XLSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const [local, rest] = splitProps(props, [\"class\", \"width\", \"height\"]);\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"14\"\n      height=\"14\"\n      viewBox=\"0 0 14 14\"\n      {...rest}\n      class={local.class}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M10.361 6.328 5.03.996a.954.954 0 0 0-1.343 0 .95.95 0 0 0 0 1.344L8.346 7l-4.66 4.66a.95.95 0 0 0 1.344 1.344l5.331-5.332a.95.95 0 0 0 0-1.344\"\n      />\n    </svg>\n  );\n}\n\nfunction Chevron_XXLSvg(props: JSX.SvgSVGAttributes<SVGSVGElement>): JSX.Element {\n  const [local, rest] = splitProps(props, [\"class\", \"width\", \"height\"]);\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"16\"\n      height=\"16\"\n      viewBox=\"0 0 16 16\"\n      {...rest}\n      class={local.class}\n    >\n      <path\n        fill=\"var(--iconPrimary, #222)\"\n        d=\"M11.726 7.3 5.67 1.247A.988.988 0 1 0 4.27 2.645L9.628 8 4.27 13.355a.988.988 0 1 0 1.399 1.399l6.056-6.055a.99.99 0 0 0 0-1.398\"\n      />\n    </svg>\n  );\n}\n\nconst Chevron_XS = createUIIcon(Chevron_XSSvg);\nconst Chevron_S = createUIIcon(Chevron_SSvg);\nconst Chevron_M = createUIIcon(Chevron_MSvg);\nconst Chevron_L = createUIIcon(Chevron_LSvg);\nconst Chevron_XL = createUIIcon(Chevron_XLSvg);\nconst Chevron_XXL = createUIIcon(Chevron_XXLSvg);\n\nexport default function Chevron(props: ChevronProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\"size\", \"class\", \"width\", \"height\"]);\n  const size = local.size ?? \"M\";\n  const mergedClass = () => `${local.class ?? \"\"}${styles({ size })}`;\n  switch (size) {\n    case \"XS\":\n      return <Chevron_XS {...rest} class={mergedClass()} />;\n    case \"S\":\n      return <Chevron_S {...rest} class={mergedClass()} />;\n    case \"M\":\n      return <Chevron_M {...rest} class={mergedClass()} />;\n    case \"L\":\n      return <Chevron_L {...rest} class={mergedClass()} />;\n    case \"XL\":\n      return <Chevron_XL {...rest} class={mergedClass()} />;\n    case \"XXL\":\n      return <Chevron_XXL {...rest} class={mergedClass()} />;\n    default:\n      return <Chevron_M {...rest} class={mergedClass()} />;\n  }\n}\n\nexport const ChevronIcon = Chevron;\n"],"mappings":";;;AAuBA,MAAM,SAAA,SAAA,UAAA,OAAA;;;;;;;;;;;;;;;;AA2BN,SAAS,cAAc,OAAiD;CACtE,MAAM,CAAC,OAAO,QAAQ,WAAW,OAAO;EAAC;EAAS;EAAS;CAAS,CAAA;CACpE,OAAO,CACJ,IACC,mCACA,UACA,WACA,sBACI,MACJ,OAAO,MAAM,OACd;MACC,CAAC,KACC,gCACA,yLACA;IACJ,EAAE;AAEN;AAEA,SAAS,aAAa,OAAiD;CACrE,MAAM,CAAC,OAAO,QAAQ,WAAW,OAAO;EAAC;EAAS;EAAS;CAAS,CAAA;CACpE,OAAO,CACJ,IACC,mCACA,WACA,YACA,wBACI,MACJ,OAAO,MAAM,OACd;MACC,CAAC,KACC,gCACA,iIACA;IACJ,EAAE;AAEN;AAEA,SAAS,aAAa,OAAiD;CACrE,MAAM,CAAC,OAAO,QAAQ,WAAW,OAAO;EAAC;EAAS;EAAS;CAAS,CAAA;CACpE,OAAO,CACJ,IACC,mCACA,WACA,YACA,wBACI,MACJ,OAAO,MAAM,OACd;MACC,CAAC,KACC,gCACA,iWACA;IACJ,EAAE;AAEN;AAEA,SAAS,aAAa,OAAiD;CACrE,MAAM,CAAC,OAAO,QAAQ,WAAW,OAAO;EAAC;EAAS;EAAS;CAAS,CAAA;CACpE,OAAO,CACJ,IACC,mCACA,WACA,YACA,wBACI,MACJ,OAAO,MAAM,OACd;MACC,CAAC,KACC,gCACA,4PACA;IACJ,EAAE;AAEN;AAEA,SAAS,cAAc,OAAiD;CACtE,MAAM,CAAC,OAAO,QAAQ,WAAW,OAAO;EAAC;EAAS;EAAS;CAAS,CAAA;CACpE,OAAO,CACJ,IACC,mCACA,WACA,YACA,wBACI,MACJ,OAAO,MAAM,OACd;MACC,CAAC,KACC,gCACA,sJACA;IACJ,EAAE;AAEN;AAEA,SAAS,eAAe,OAAiD;CACvE,MAAM,CAAC,OAAO,QAAQ,WAAW,OAAO;EAAC;EAAS;EAAS;CAAS,CAAA;CACpE,OAAO,CACJ,IACC,mCACA,WACA,YACA,wBACI,MACJ,OAAO,MAAM,OACd;MACC,CAAC,KACC,gCACA,uIACA;IACJ,EAAE;AAEN;AAEA,MAAM,aAAa,aAAa,aAAA;AAChC,MAAM,YAAY,aAAa,YAAA;AAC/B,MAAM,YAAY,aAAa,YAAA;AAC/B,MAAM,YAAY,aAAa,YAAA;AAC/B,MAAM,aAAa,aAAa,aAAA;AAChC,MAAM,cAAc,aAAa,cAAA;AAEjC,SAAwB,QAAQ,OAA0B;CACxD,MAAM,CAAC,OAAO,QAAQ,WAAW,OAAO;EAAC;EAAQ;EAAS;EAAS;CAAS,CAAA;CAC5E,MAAM,OAAO,MAAM,QAAQ;CAC3B,MAAM,oBAAoB,GAAG,MAAM,SAAS,KAAK,OAAO,EAAE,KAAK,CAAA;CAC/D,QAAQ,MAAR;EACE,KAAK,MACH,OAAA,CAAQ,eAAe,MAAM,OAAO,YAAA;EACtC,KAAK,KACH,OAAA,CAAQ,cAAc,MAAM,OAAO,YAAA;EACrC,KAAK,KACH,OAAA,CAAQ,cAAc,MAAM,OAAO,YAAA;EACrC,KAAK,KACH,OAAA,CAAQ,cAAc,MAAM,OAAO,YAAA;EACrC,KAAK,MACH,OAAA,CAAQ,eAAe,MAAM,OAAO,YAAA;EACtC,KAAK,OACH,OAAA,CAAQ,gBAAgB,MAAM,OAAO,YAAA;EACvC,SACE,OAAA,CAAQ,cAAc,MAAM,OAAO,YAAA;CACvC;AACF"}

package/dist/_chunk/ColorSwatchPicker.js

@@ -1,48 +1,73 @@
-import { useProviderProps } from "../provider/index.js";
+/*
+* Copyright 2024 Adobe. All rights reserved.
+* This file is licensed to you under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License. You may obtain a copy
+* of the License at http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software distributed under
+* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+* OF ANY KIND, either express or implied. See the License for the specific language
+* governing permissions and limitations under the License.
+*/
+// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/ColorSwatchPicker.tsx
+/*
+* Copyright 2024 Adobe. All rights reserved.
+* This file is licensed to you under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License. You may obtain a copy
+* of the License at http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software distributed under
+* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+* OF ANY KIND, either express or implied. See the License for the specific language
+* governing permissions and limitations under the License.
+*/
+// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/ColorSwatch.tsx
+import { a as useProviderProps } from "./provider.js";
 import { a as mergeContextUnsafeStyle, i as mergeContextStyles, n as getSlottedContextProps } from "./spectrum-context.js";
-import { createComponent, getNextElement, mergeProps, template } from "solid-js/web";
-import { Show, createContext, mergeProps as mergeProps$1, splitProps, useContext } from "solid-js";
+import { createComponent, getNextElement, mergeProps, template } from "@solidjs/web";
+import { Show, createContext, useContext } from "solid-js";
+import { mergeProps as mergeProps$1, splitProps } from "@proyecto-viviana/solidaria/utils";
 import { ColorSwatch, ColorSwatchPicker, ColorSwatchPickerItem } from "@proyecto-viviana/solidaria-components";
 //#region src/color/color-swatch-internal.ts
 const InternalColorSwatchContext = createContext(null);
 //#endregion
 //#region src/color/ColorSwatchPicker.tsx
-var _tmpl$ = /*#__PURE__*/ template(`<div aria-hidden=true class=" _Pa151 _Ob151 Wr151 _lr151 _Ar151 _zr151 _oa151 iMwyHo151 _jf151 _kc151 hc151 mc151 lc151 OLZZSrd151 _Lf151 _Mc151 _Kc151 _yb151 oi151 ni151 ki151 ji151">`);
+var _tmpl$ = /* @__PURE__ */ template(`<div aria-hidden=true class=" _Pa17 _Ob17 Wr17 _lr17 _Ar17 _zr17 _oa17 iBJTC6c17 _jf17 _kc17 hc17 mc17 lc17 O4T7hrb17 _Lf17 _Mc17 _Kc17 _yb17 oi17 ni17 ki17 ji17">`);
 const colorSwatchPickerRoot = function anonymous(props, overrides) {
 	let rules = " ";
 	rules += (String(overrides || "").match(/(?:^|\s)(J|G|I|H|_u|_v|_s|__A|_d|_J|z|y|B|A|_P|_9|W|_l|_A|_z|_6|Z|N|L)[^\s]+/g) || []).join("");
-	rules += " sd151";
-	rules += " _wb151";
-	if (props.density === "spacious") rules += " UWJpoB151";
-	else if (props.density === "regular") rules += " Ub151";
-	else if (props.density === "compact") rules += " Ua151";
-	if (props.density === "spacious") rules += " qWJpoB151";
-	else if (props.density === "regular") rules += " qb151";
-	else if (props.density === "compact") rules += " qa151";
+	rules += " sd17";
+	rules += " _wb17";
+	if (props.density === "spacious") rules += " UWJpoB17";
+	else if (props.density === "regular") rules += " Ub17";
+	else if (props.density === "compact") rules += " Ua17";
+	if (props.density === "spacious") rules += " qWJpoB17";
+	else if (props.density === "regular") rules += " qb17";
+	else if (props.density === "compact") rules += " qa17";
 	return rules;
 };
 const colorSwatchPickerItemRoot = function anonymous(props) {
 	let rules = " ";
-	if (props.isFocusVisible) rules += " _Lf151";
-	else rules += " _Le151";
-	rules += " O8KaFke151";
-	rules += " Olc151";
-	rules += " _Mc151";
-	rules += " _Kd151";
-	rules += " _Pc151";
-	if (props.rounding === "full") rules += " og151";
-	else if (props.rounding === "default") rules += " oa151";
-	else if (props.rounding === "none") rules += " od151";
-	if (props.rounding === "full") rules += " ng151";
-	else if (props.rounding === "default") rules += " na151";
-	else if (props.rounding === "none") rules += " nd151";
-	if (props.rounding === "full") rules += " kg151";
-	else if (props.rounding === "default") rules += " ka151";
-	else if (props.rounding === "none") rules += " kd151";
-	if (props.rounding === "full") rules += " jg151";
-	else if (props.rounding === "default") rules += " ja151";
-	else if (props.rounding === "none") rules += " jd151";
-	rules += " __ca151";
+	if (props.isFocusVisible) rules += " _Lf17";
+	else rules += " _Le17";
+	rules += " Or2Mazb17";
+	rules += " Olc17";
+	rules += " _Mc17";
+	rules += " _Kd17";
+	rules += " _Pc17";
+	if (props.rounding === "full") rules += " og17";
+	else if (props.rounding === "default") rules += " oa17";
+	else if (props.rounding === "none") rules += " od17";
+	if (props.rounding === "full") rules += " ng17";
+	else if (props.rounding === "default") rules += " na17";
+	else if (props.rounding === "none") rules += " nd17";
+	if (props.rounding === "full") rules += " kg17";
+	else if (props.rounding === "default") rules += " ka17";
+	else if (props.rounding === "none") rules += " kd17";
+	if (props.rounding === "full") rules += " jg17";
+	else if (props.rounding === "default") rules += " ja17";
+	else if (props.rounding === "none") rules += " jd17";
+	rules += " __ca17";
 	return rules;
 };
 const pickerColorSwatchRoot = function anonymous(props, overrides) {
@@ -56,44 +81,44 @@ const pickerColorSwatchRoot = function anonymous(props, overrides) {
 		rules += p[0];
 	}
 	if (props.size === "L") {
-		if (!width) rules += " Zw151";
+		if (!width) rules += " Zw17";
 	} else if (props.size === "M") {
-		if (!width) rules += " ZC151";
+		if (!width) rules += " ZC17";
 	} else if (props.size === "S") {
-		if (!width) rules += " Zo151";
+		if (!width) rules += " Zo17";
 	} else if (props.size === "XS") {
-		if (!width) rules += " Zu151";
+		if (!width) rules += " Zu17";
 	}
 	if (props.size === "L") {
-		if (!height) rules += " Fv151";
+		if (!height) rules += " Fv17";
 	} else if (props.size === "M") {
-		if (!height) rules += " Fx151";
+		if (!height) rules += " Fx17";
 	} else if (props.size === "S") {
-		if (!height) rules += " Fp151";
+		if (!height) rules += " Fp17";
 	} else if (props.size === "XS") {
-		if (!height) rules += " Ft151";
+		if (!height) rules += " Ft17";
 	}
-	if (props.rounding === "full") rules += " og151";
-	else if (props.rounding === "none") rules += " od151";
-	else if (props.rounding === "default") rules += " oa151";
-	if (props.rounding === "full") rules += " ng151";
-	else if (props.rounding === "none") rules += " nd151";
-	else if (props.rounding === "default") rules += " na151";
-	if (props.rounding === "full") rules += " kg151";
-	else if (props.rounding === "none") rules += " kd151";
-	else if (props.rounding === "default") rules += " ka151";
-	if (props.rounding === "full") rules += " jg151";
-	else if (props.rounding === "none") rules += " jd151";
-	else if (props.rounding === "default") rules += " ja151";
-	rules += " iO2XpG151";
-	rules += " _kb151";
-	rules += " hb151";
-	rules += " mb151";
-	rules += " lb151";
-	rules += " _jf151";
-	rules += " _oa151";
-	rules += " _yb151";
-	rules += " -_8LZfRc-pYjUhNc151";
+	if (props.rounding === "full") rules += " og17";
+	else if (props.rounding === "none") rules += " od17";
+	else if (props.rounding === "default") rules += " oa17";
+	if (props.rounding === "full") rules += " ng17";
+	else if (props.rounding === "none") rules += " nd17";
+	else if (props.rounding === "default") rules += " na17";
+	if (props.rounding === "full") rules += " kg17";
+	else if (props.rounding === "none") rules += " kd17";
+	else if (props.rounding === "default") rules += " ka17";
+	if (props.rounding === "full") rules += " jg17";
+	else if (props.rounding === "none") rules += " jd17";
+	else if (props.rounding === "default") rules += " ja17";
+	rules += " iO2XpG17";
+	rules += " _kb17";
+	rules += " hb17";
+	rules += " mb17";
+	rules += " lb17";
+	rules += " _jf17";
+	rules += " _oa17";
+	rules += " _yb17";
+	rules += " -_8LZfRc-puNtkec17";
 	return rules;
 };
 const ColorSwatchPickerContext = createContext(null);
@@ -104,11 +129,19 @@ function getColorSwatchStyle(renderProps) {
 }
 /**
 * A ColorSwatchPicker displays a list of color swatches and allows a user to select one of them.
-*/
-function ColorSwatchPicker$1(props) {
+*/ function ColorSwatchPicker$1(props) {
 	const providerProps = useProviderProps(props);
+	const [flags] = splitProps(providerProps, [
+		"isQuiet",
+		"isEmphasized",
+		"isDisabled",
+		"isRequired",
+		"isReadOnly",
+		"validationState"
+	]);
 	const contextProps = getSlottedContextProps(useContext(ColorSwatchPickerContext), props.slot);
-	const [local, headlessProps] = splitProps(mergeProps$1(providerProps, contextProps ?? {}, props), [
+	const mergedProps = mergeProps$1(flags, contextProps ?? {}, props);
+	const [local, headlessProps] = splitProps(mergedProps, [
 		"density",
 		"size",
 		"rounding",
@@ -133,7 +166,7 @@ function ColorSwatchPicker$1(props) {
 		get color() {
 			return color();
 		},
-		"class": (renderProps) => colorSwatchPickerItemRoot({
+		class: (renderProps) => colorSwatchPickerItemRoot({
 			...renderProps,
 			rounding: swatchRounding()
 		}),
@@ -147,7 +180,7 @@ function ColorSwatchPicker$1(props) {
 		})]
 	});
 	return createComponent(ColorSwatchPicker, mergeProps(headlessProps, {
-		"class": (renderProps) => [unsafeClassName(), colorSwatchPickerRoot({
+		class: (renderProps) => [unsafeClassName(), colorSwatchPickerRoot({
 			...renderProps,
 			density: density()
 		}, mergedStyles())].filter(Boolean).join(" "),
@@ -155,13 +188,15 @@ function ColorSwatchPicker$1(props) {
 			return mergedUnsafeStyle();
 		},
 		get children() {
-			return createComponent(InternalColorSwatchContext.Provider, {
-				get value() {
-					return {
-						useWrapper,
-						size: size(),
-						rounding: rounding()
-					};
+			return createComponent(InternalColorSwatchContext, {
+				value: {
+					useWrapper,
+					get size() {
+						return size();
+					},
+					get rounding() {
+						return rounding();
+					}
 				},
 				get children() {
 					return local.children;
@@ -173,8 +208,7 @@ function ColorSwatchPicker$1(props) {
 /**
 * Compatibility helper for callers that still compose picker items manually.
 * The public S2 API composes ColorSwatchPicker with ColorSwatch children.
-*/
-function ColorSwatchPickerItem$1(props) {
+*/ function ColorSwatchPickerItem$1(props) {
 	const pickerContext = useContext(InternalColorSwatchContext);
 	const [local, headlessProps] = splitProps(props, [
 		"class",
@@ -190,7 +224,7 @@ function ColorSwatchPickerItem$1(props) {
 			get color() {
 				return local.color;
 			},
-			"class": (swatchRenderProps) => pickerColorSwatchRoot({
+			class: (swatchRenderProps) => pickerColorSwatchRoot({
 				...swatchRenderProps,
 				size: size(),
 				rounding: rounding()
@@ -202,11 +236,11 @@ function ColorSwatchPickerItem$1(props) {
 		get color() {
 			return local.color;
 		},
-		"class": (renderProps) => [local.class, colorSwatchPickerItemRoot({
+		class: (renderProps) => [local.class, colorSwatchPickerItemRoot({
 			...renderProps,
 			rounding: rounding()
 		})].filter(Boolean).join(" "),
-		children: (renderProps) => [createComponent(InternalColorSwatchContext.Provider, {
+		children: (renderProps) => [createComponent(InternalColorSwatchContext, {
 			value: null,
 			get children() {
 				return renderChildren(renderProps);

package/dist/_chunk/ColorSwatchPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColorSwatchPicker.js","names":[],"sources":["../../src/color/color-swatch-internal.ts","../../src/color/ColorSwatchPicker.tsx"],"sourcesContent":["import { createContext, type Accessor, type JSX } from \"solid-js\";\nimport type { Color } from \"@proyecto-viviana/solid-stately\";\n\nexport type InternalColorSwatchSize = \"XS\" | \"S\" | \"M\" | \"L\";\nexport type InternalColorSwatchRounding = \"default\" | \"none\" | \"full\";\n\nexport interface InternalColorSwatchContextValue {\n  size?: InternalColorSwatchSize;\n  rounding?: InternalColorSwatchRounding;\n  useWrapper: (\n    swatch: JSX.Element,\n    color: Accessor<Color>,\n    rounding: Accessor<InternalColorSwatchRounding>,\n  ) => JSX.Element;\n}\n\nexport const InternalColorSwatchContext = createContext<InternalColorSwatchContextValue | null>(\n  null,\n);\n","import { type JSX, createContext, mergeProps, Show, splitProps, useContext } from \"solid-js\";\nimport {\n  ColorSwatch as HeadlessColorSwatch,\n  ColorSwatchPicker as HeadlessColorSwatchPicker,\n  ColorSwatchPickerItem as HeadlessColorSwatchPickerItem,\n  type ColorSwatchRenderProps,\n  type ColorSwatchPickerItemProps as HeadlessColorSwatchPickerItemProps,\n  type ColorSwatchPickerItemRenderProps,\n  type ColorSwatchPickerProps as HeadlessColorSwatchPickerProps,\n  type ColorSwatchPickerRenderProps,\n} from \"@proyecto-viviana/solidaria-components\";\nimport type { Color } from \"@proyecto-viviana/solid-stately\";\nimport { focusRing, space, style } from \"../style\" with { type: \"macro\" };\nimport type { StylesProp, UnsafeClassName } from \"../s2-internal/style-utils\";\nimport { getAllowedOverrides } from \"../s2-internal/style-utils\" with { type: \"macro\" };\nimport { useProviderProps } from \"../provider\";\nimport {\n  getSlottedContextProps,\n  mergeContextStyles,\n  mergeContextUnsafeStyle,\n  type SpectrumContextValue,\n} from \"../button/spectrum-context\";\nimport {\n  InternalColorSwatchContext,\n  type InternalColorSwatchRounding,\n  type InternalColorSwatchSize,\n} from \"./color-swatch-internal\";\n\nexport type ColorSwatchPickerSize = InternalColorSwatchSize;\nexport type ColorSwatchPickerDensity = \"compact\" | \"regular\" | \"spacious\";\nexport type ColorSwatchPickerRounding = \"none\" | \"default\" | \"full\";\n\nexport type SwatchPickerSize = ColorSwatchPickerSize;\nexport type SwatchPickerDensity = ColorSwatchPickerDensity;\nexport type SwatchPickerRounding = ColorSwatchPickerRounding;\n\nexport interface ColorSwatchPickerProps extends Omit<\n  HeadlessColorSwatchPickerProps,\n  \"class\" | \"style\" | \"layout\" | \"slot\"\n> {\n  /** The ColorSwatches within the ColorSwatchPicker. */\n  children: JSX.Element;\n  /**\n   * The amount of padding between the swatches.\n   * @default 'regular'\n   */\n  density?: ColorSwatchPickerDensity;\n  /**\n   * The size of the color swatches.\n   * @default 'M'\n   */\n  size?: ColorSwatchPickerSize;\n  /**\n   * The corner rounding of the color swatches.\n   * @default 'none'\n   */\n  rounding?: ColorSwatchPickerRounding;\n  /** Spectrum-defined generated classes. */\n  styles?: StylesProp;\n  /** Additional CSS class name. Use only as a last resort. */\n  UNSAFE_className?: UnsafeClassName | string;\n  /** Additional inline styles. Use only as a last resort. */\n  UNSAFE_style?: JSX.CSSProperties;\n  /** Backward-compatible class alias. Prefer UNSAFE_className for S2 parity. */\n  class?: string;\n  /** A slot name for the component. */\n  slot?: string | null;\n}\n\nexport interface ColorSwatchPickerItemProps extends Omit<\n  HeadlessColorSwatchPickerItemProps,\n  \"class\" | \"style\"\n> {\n  /** Additional CSS class name. */\n  class?: string;\n}\n\ninterface ColorSwatchPickerStyleProps extends Partial<ColorSwatchPickerRenderProps> {\n  density?: ColorSwatchPickerDensity;\n}\n\ninterface ColorSwatchPickerItemStyleProps extends Partial<ColorSwatchPickerItemRenderProps> {\n  rounding?: ColorSwatchPickerRounding;\n}\n\ninterface PickerColorSwatchStyleProps extends Partial<ColorSwatchRenderProps> {\n  size?: ColorSwatchPickerSize;\n  rounding?: ColorSwatchPickerRounding;\n}\n\nconst colorSwatchPickerRoot = style<ColorSwatchPickerStyleProps>(\n  {\n    display: \"flex\",\n    flexWrap: \"wrap\",\n    gap: {\n      density: {\n        compact: space(2),\n        regular: 4,\n        spacious: space(6),\n      },\n    },\n  },\n  getAllowedOverrides(),\n);\n\nconst colorSwatchPickerItemRoot = style<ColorSwatchPickerItemStyleProps>({\n  ...focusRing(),\n  position: \"relative\",\n  borderRadius: {\n    rounding: {\n      none: \"none\",\n      default: \"sm\",\n      full: \"full\",\n    },\n  },\n  disableTapHighlight: true,\n});\n\nconst colorSwatchPickerSelectedOverlay = style({\n  position: \"absolute\",\n  pointerEvents: \"none\",\n  inset: 0,\n  boxSizing: \"border-box\",\n  borderColor: \"gray-900\",\n  borderStyle: \"solid\",\n  borderWidth: 2,\n  outlineColor: \"gray-25\",\n  outlineStyle: \"solid\",\n  outlineWidth: 2,\n  outlineOffset: -4,\n  forcedColorAdjust: \"none\",\n  borderRadius: \"inherit\",\n});\n\nconst pickerColorSwatchRoot = style<PickerColorSwatchStyleProps>(\n  {\n    width: {\n      size: {\n        XS: 16,\n        S: 24,\n        M: 32,\n        L: 40,\n      },\n    },\n    height: {\n      size: {\n        XS: 16,\n        S: 24,\n        M: 32,\n        L: 40,\n      },\n    },\n    borderRadius: {\n      rounding: {\n        default: \"sm\",\n        none: \"none\",\n        full: \"full\",\n      },\n    },\n    borderColor: \"gray-1000/42\",\n    borderWidth: 1,\n    borderStyle: \"solid\",\n    boxSizing: \"border-box\",\n    forcedColorAdjust: \"none\",\n    \"--slash-color\": {\n      type: \"color\",\n      value: \"red-900\",\n    },\n  },\n  getAllowedOverrides({ height: true }),\n);\n\nexport const ColorSwatchPickerContext =\n  createContext<SpectrumContextValue<ColorSwatchPickerProps>>(null);\n\nfunction getColorSwatchStyle(renderProps: ColorSwatchRenderProps): JSX.CSSProperties {\n  const swatchColor = renderProps.color;\n  const colorValue = swatchColor.toString(\"css\");\n  const background =\n    swatchColor.getChannelValue(\"alpha\") > 0\n      ? `linear-gradient(${colorValue}, ${colorValue}), repeating-conic-gradient(#e6e6e6 0% 25%, white 0% 50%) 0% 50% / 16px 16px`\n      : \"linear-gradient(to bottom right, transparent calc(50% - 2px), var(--slash-color) calc(50% - 2px) calc(50% + 2px), transparent calc(50% + 2px)) no-repeat\";\n\n  return { background };\n}\n\n/**\n * A ColorSwatchPicker displays a list of color swatches and allows a user to select one of them.\n */\nexport function ColorSwatchPicker(props: ColorSwatchPickerProps): JSX.Element {\n  const providerProps = useProviderProps(props);\n  const contextProps = getSlottedContextProps(useContext(ColorSwatchPickerContext), props.slot);\n  const mergedProps = mergeProps(providerProps, contextProps ?? {}, props);\n  const [local, headlessProps] = splitProps(mergedProps, [\n    \"density\",\n    \"size\",\n    \"rounding\",\n    \"styles\",\n    \"UNSAFE_className\",\n    \"UNSAFE_style\",\n    \"class\",\n    \"children\",\n    \"slot\",\n  ]);\n\n  const density = () => local.density ?? \"regular\";\n  const size = () => local.size ?? \"M\";\n  const rounding = () => local.rounding ?? \"none\";\n  const mergedStyles = () => mergeContextStyles(contextProps?.styles, props.styles);\n  const mergedUnsafeStyle = () =>\n    mergeContextUnsafeStyle(contextProps?.UNSAFE_style, props.UNSAFE_style);\n  const unsafeClassName = () =>\n    [contextProps?.UNSAFE_className, local.UNSAFE_className, local.class].filter(Boolean).join(\" \");\n\n  const useWrapper = (\n    swatch: JSX.Element,\n    color: () => Color,\n    swatchRounding: () => InternalColorSwatchRounding,\n  ) => (\n    <HeadlessColorSwatchPickerItem\n      color={color()}\n      class={(renderProps) =>\n        colorSwatchPickerItemRoot({\n          ...renderProps,\n          rounding: swatchRounding(),\n        })\n      }\n    >\n      {(renderProps) => (\n        <>\n          {swatch}\n          <Show when={renderProps.isSelected}>\n            <div aria-hidden=\"true\" class={colorSwatchPickerSelectedOverlay} />\n          </Show>\n        </>\n      )}\n    </HeadlessColorSwatchPickerItem>\n  );\n\n  return (\n    <HeadlessColorSwatchPicker\n      {...headlessProps}\n      class={(renderProps) =>\n        [\n          unsafeClassName(),\n          colorSwatchPickerRoot(\n            {\n              ...renderProps,\n              density: density(),\n            },\n            mergedStyles(),\n          ),\n        ]\n          .filter(Boolean)\n          .join(\" \")\n      }\n      style={mergedUnsafeStyle()}\n    >\n      <InternalColorSwatchContext.Provider\n        value={{\n          useWrapper,\n          size: size(),\n          rounding: rounding(),\n        }}\n      >\n        {local.children}\n      </InternalColorSwatchContext.Provider>\n    </HeadlessColorSwatchPicker>\n  );\n}\n\n/**\n * Compatibility helper for callers that still compose picker items manually.\n * The public S2 API composes ColorSwatchPicker with ColorSwatch children.\n */\nexport function ColorSwatchPickerItem(props: ColorSwatchPickerItemProps): JSX.Element {\n  const pickerContext = useContext(InternalColorSwatchContext);\n  const [local, headlessProps] = splitProps(props, [\"class\", \"children\", \"color\"]);\n  const size = () => pickerContext?.size ?? \"M\";\n  const rounding = () => pickerContext?.rounding ?? \"none\";\n\n  const renderChildren = (renderProps: ColorSwatchPickerItemRenderProps) => {\n    const children = local.children;\n\n    if (typeof children === \"function\") {\n      return children(renderProps);\n    }\n\n    return (\n      children ?? (\n        <HeadlessColorSwatch\n          color={local.color}\n          class={(swatchRenderProps) =>\n            pickerColorSwatchRoot({\n              ...swatchRenderProps,\n              size: size(),\n              rounding: rounding(),\n            })\n          }\n          style={getColorSwatchStyle}\n        />\n      )\n    );\n  };\n\n  return (\n    <HeadlessColorSwatchPickerItem\n      {...headlessProps}\n      color={local.color}\n      class={(renderProps) =>\n        [\n          local.class,\n          colorSwatchPickerItemRoot({\n            ...renderProps,\n            rounding: rounding(),\n          }),\n        ]\n          .filter(Boolean)\n          .join(\" \")\n      }\n    >\n      {(renderProps) => (\n        <>\n          <InternalColorSwatchContext.Provider value={null}>\n            {renderChildren(renderProps)}\n          </InternalColorSwatchContext.Provider>\n          <Show when={renderProps.isSelected}>\n            <div aria-hidden=\"true\" class={colorSwatchPickerSelectedOverlay} />\n          </Show>\n        </>\n      )}\n    </HeadlessColorSwatchPickerItem>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"ColorSwatchPicker.js","names":[],"sources":["../../src/color/color-swatch-internal.ts","../../src/color/ColorSwatchPicker.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/ColorSwatch.tsx\n\n// Port of packages/@react-spectrum/s2/src/ColorSwatch.tsx.\nimport { createContext } from \"solid-js\";\nimport type { Accessor } from \"solid-js\";\nimport type { JSX } from \"@solidjs/web\";\nimport type { Color } from \"@proyecto-viviana/solid-stately\";\n\nexport type InternalColorSwatchSize = \"XS\" | \"S\" | \"M\" | \"L\";\nexport type InternalColorSwatchRounding = \"default\" | \"none\" | \"full\";\n\nexport interface InternalColorSwatchContextValue {\n  size?: InternalColorSwatchSize;\n  rounding?: InternalColorSwatchRounding;\n  useWrapper: (\n    swatch: JSX.Element,\n    color: Accessor<Color>,\n    rounding: Accessor<InternalColorSwatchRounding>,\n  ) => JSX.Element;\n}\n\nexport const InternalColorSwatchContext = createContext<InternalColorSwatchContextValue | null>(\n  null,\n);\n","/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/ColorSwatchPicker.tsx\n\n// Port of packages/@react-spectrum/s2/src/ColorSwatchPicker.tsx.\nimport { createContext, Show, useContext } from \"solid-js\";\nimport type { JSX } from \"@solidjs/web\";\nimport { mergeProps } from \"@proyecto-viviana/solidaria/utils\";\nimport {\n  ColorSwatch as HeadlessColorSwatch,\n  ColorSwatchPicker as HeadlessColorSwatchPicker,\n  ColorSwatchPickerItem as HeadlessColorSwatchPickerItem,\n  type ColorSwatchRenderProps,\n  type ColorSwatchPickerItemProps as HeadlessColorSwatchPickerItemProps,\n  type ColorSwatchPickerItemRenderProps,\n  type ColorSwatchPickerProps as HeadlessColorSwatchPickerProps,\n  type ColorSwatchPickerRenderProps,\n} from \"@proyecto-viviana/solidaria-components\";\nimport type { Color } from \"@proyecto-viviana/solid-stately\";\nimport { focusRing, space, style } from \"../style\" with { type: \"macro\" };\nimport type { StylesProp, UnsafeClassName } from \"../s2-internal/style-utils\";\nimport { getAllowedOverrides } from \"../s2-internal/style-utils\" with { type: \"macro\" };\nimport { useProviderProps, type ProviderInheritedProps } from \"../provider\";\nimport {\n  getSlottedContextProps,\n  mergeContextStyles,\n  mergeContextUnsafeStyle,\n  type SpectrumContextValue,\n} from \"../button/spectrum-context\";\nimport { splitProps } from \"@proyecto-viviana/solidaria/utils\";\nimport {\n  InternalColorSwatchContext,\n  type InternalColorSwatchRounding,\n  type InternalColorSwatchSize,\n} from \"./color-swatch-internal\";\n\nexport type ColorSwatchPickerSize = InternalColorSwatchSize;\nexport type ColorSwatchPickerDensity = \"compact\" | \"regular\" | \"spacious\";\nexport type ColorSwatchPickerRounding = \"none\" | \"default\" | \"full\";\n\nexport type SwatchPickerSize = ColorSwatchPickerSize;\nexport type SwatchPickerDensity = ColorSwatchPickerDensity;\nexport type SwatchPickerRounding = ColorSwatchPickerRounding;\n\nexport interface ColorSwatchPickerProps extends Omit<\n  HeadlessColorSwatchPickerProps,\n  \"class\" | \"style\" | \"layout\" | \"slot\"\n> {\n  /** The ColorSwatches within the ColorSwatchPicker. */\n  children: JSX.Element;\n  /**\n   * The amount of padding between the swatches.\n   * @default 'regular'\n   */\n  density?: ColorSwatchPickerDensity;\n  /**\n   * The size of the color swatches.\n   * @default 'M'\n   */\n  size?: ColorSwatchPickerSize;\n  /**\n   * The corner rounding of the color swatches.\n   * @default 'none'\n   */\n  rounding?: ColorSwatchPickerRounding;\n  /** Spectrum-defined generated classes. */\n  styles?: StylesProp;\n  /** Additional CSS class name. Use only as a last resort. */\n  UNSAFE_className?: UnsafeClassName | string;\n  /** Additional inline styles. Use only as a last resort. */\n  UNSAFE_style?: JSX.CSSProperties;\n  /** Backward-compatible class alias. Prefer UNSAFE_className for S2 parity. */\n  class?: string;\n  /** A slot name for the component. */\n  slot?: string | null;\n}\n\nexport interface ColorSwatchPickerItemProps extends Omit<\n  HeadlessColorSwatchPickerItemProps,\n  \"class\" | \"style\"\n> {\n  /** Additional CSS class name. */\n  class?: string;\n}\n\ninterface ColorSwatchPickerStyleProps extends Partial<ColorSwatchPickerRenderProps> {\n  density?: ColorSwatchPickerDensity;\n}\n\ninterface ColorSwatchPickerItemStyleProps extends Partial<ColorSwatchPickerItemRenderProps> {\n  rounding?: ColorSwatchPickerRounding;\n}\n\ninterface PickerColorSwatchStyleProps extends Partial<ColorSwatchRenderProps> {\n  size?: ColorSwatchPickerSize;\n  rounding?: ColorSwatchPickerRounding;\n}\n\nconst colorSwatchPickerRoot = style<ColorSwatchPickerStyleProps>(\n  {\n    display: \"flex\",\n    flexWrap: \"wrap\",\n    gap: {\n      density: {\n        compact: space(2),\n        regular: 4,\n        spacious: space(6),\n      },\n    },\n  },\n  getAllowedOverrides(),\n);\n\nconst colorSwatchPickerItemRoot = style<ColorSwatchPickerItemStyleProps>({\n  ...focusRing(),\n  position: \"relative\",\n  borderRadius: {\n    rounding: {\n      none: \"none\",\n      default: \"sm\",\n      full: \"full\",\n    },\n  },\n  disableTapHighlight: true,\n});\n\nconst colorSwatchPickerSelectedOverlay = style({\n  position: \"absolute\",\n  pointerEvents: \"none\",\n  inset: 0,\n  boxSizing: \"border-box\",\n  borderColor: \"gray-900\",\n  borderStyle: \"solid\",\n  borderWidth: 2,\n  outlineColor: \"gray-25\",\n  outlineStyle: \"solid\",\n  outlineWidth: 2,\n  outlineOffset: -4,\n  forcedColorAdjust: \"none\",\n  borderRadius: \"inherit\",\n});\n\nconst pickerColorSwatchRoot = style<PickerColorSwatchStyleProps>(\n  {\n    width: {\n      size: {\n        XS: 16,\n        S: 24,\n        M: 32,\n        L: 40,\n      },\n    },\n    height: {\n      size: {\n        XS: 16,\n        S: 24,\n        M: 32,\n        L: 40,\n      },\n    },\n    borderRadius: {\n      rounding: {\n        default: \"sm\",\n        none: \"none\",\n        full: \"full\",\n      },\n    },\n    borderColor: \"gray-1000/42\",\n    borderWidth: 1,\n    borderStyle: \"solid\",\n    boxSizing: \"border-box\",\n    forcedColorAdjust: \"none\",\n    \"--slash-color\": {\n      type: \"color\",\n      value: \"red-900\",\n    },\n  },\n  getAllowedOverrides({ height: true }),\n);\n\nexport const ColorSwatchPickerContext =\n  createContext<SpectrumContextValue<ColorSwatchPickerProps>>(null);\n\nfunction getColorSwatchStyle(renderProps: ColorSwatchRenderProps): JSX.CSSProperties {\n  const swatchColor = renderProps.color;\n  const colorValue = swatchColor.toString(\"css\");\n  const background =\n    swatchColor.getChannelValue(\"alpha\") > 0\n      ? `linear-gradient(${colorValue}, ${colorValue}), repeating-conic-gradient(#e6e6e6 0% 25%, white 0% 50%) 0% 50% / 16px 16px`\n      : \"linear-gradient(to bottom right, transparent calc(50% - 2px), var(--slash-color) calc(50% - 2px) calc(50% + 2px), transparent calc(50% + 2px)) no-repeat\";\n\n  return { background };\n}\n\n/**\n * A ColorSwatchPicker displays a list of color swatches and allows a user to select one of them.\n */\nexport function ColorSwatchPicker(props: ColorSwatchPickerProps): JSX.Element {\n  const providerProps = useProviderProps(props) as ColorSwatchPickerProps & ProviderInheritedProps;\n  const [flags] = splitProps(providerProps, [\n    \"isQuiet\",\n    \"isEmphasized\",\n    \"isDisabled\",\n    \"isRequired\",\n    \"isReadOnly\",\n    \"validationState\",\n  ]);\n  const contextProps = getSlottedContextProps(useContext(ColorSwatchPickerContext), props.slot);\n  const mergedProps = mergeProps<ColorSwatchPickerProps>(flags, contextProps ?? {}, props);\n  const [local, headlessProps] = splitProps(mergedProps, [\n    \"density\",\n    \"size\",\n    \"rounding\",\n    \"styles\",\n    \"UNSAFE_className\",\n    \"UNSAFE_style\",\n    \"class\",\n    \"children\",\n    \"slot\",\n  ]);\n\n  const density = () => local.density ?? \"regular\";\n  const size = () => local.size ?? \"M\";\n  const rounding = () => local.rounding ?? \"none\";\n  const mergedStyles = () => mergeContextStyles(contextProps?.styles, props.styles);\n  const mergedUnsafeStyle = () =>\n    mergeContextUnsafeStyle(contextProps?.UNSAFE_style, props.UNSAFE_style);\n  const unsafeClassName = () =>\n    [contextProps?.UNSAFE_className, local.UNSAFE_className, local.class].filter(Boolean).join(\" \");\n\n  const useWrapper = (\n    swatch: JSX.Element,\n    color: () => Color,\n    swatchRounding: () => InternalColorSwatchRounding,\n  ) => (\n    <HeadlessColorSwatchPickerItem\n      color={color()}\n      class={(renderProps) =>\n        colorSwatchPickerItemRoot({\n          ...renderProps,\n          rounding: swatchRounding(),\n        })\n      }\n    >\n      {(renderProps) => (\n        <>\n          {swatch}\n          <Show when={renderProps.isSelected}>\n            <div aria-hidden=\"true\" class={colorSwatchPickerSelectedOverlay} />\n          </Show>\n        </>\n      )}\n    </HeadlessColorSwatchPickerItem>\n  );\n\n  return (\n    <HeadlessColorSwatchPicker\n      {...headlessProps}\n      class={(renderProps) =>\n        [\n          unsafeClassName(),\n          colorSwatchPickerRoot(\n            {\n              ...renderProps,\n              density: density(),\n            },\n            mergedStyles(),\n          ),\n        ]\n          .filter(Boolean)\n          .join(\" \")\n      }\n      style={mergedUnsafeStyle()}\n    >\n      <InternalColorSwatchContext\n        value={{\n          useWrapper,\n          get size() {\n            return size();\n          },\n          get rounding() {\n            return rounding();\n          },\n        }}\n      >\n        {local.children}\n      </InternalColorSwatchContext>\n    </HeadlessColorSwatchPicker>\n  );\n}\n\n/**\n * Compatibility helper for callers that still compose picker items manually.\n * The public S2 API composes ColorSwatchPicker with ColorSwatch children.\n */\nexport function ColorSwatchPickerItem(props: ColorSwatchPickerItemProps): JSX.Element {\n  const pickerContext = useContext(InternalColorSwatchContext);\n  const [local, headlessProps] = splitProps(props, [\"class\", \"children\", \"color\"]);\n  const size = () => pickerContext?.size ?? \"M\";\n  const rounding = () => pickerContext?.rounding ?? \"none\";\n\n  const renderChildren = (renderProps: ColorSwatchPickerItemRenderProps) => {\n    const children = local.children;\n\n    if (typeof children === \"function\") {\n      return children(renderProps);\n    }\n\n    return (\n      children ?? (\n        <HeadlessColorSwatch\n          color={local.color}\n          class={(swatchRenderProps) =>\n            pickerColorSwatchRoot({\n              ...swatchRenderProps,\n              size: size(),\n              rounding: rounding(),\n            })\n          }\n          style={getColorSwatchStyle}\n        />\n      )\n    );\n  };\n\n  return (\n    <HeadlessColorSwatchPickerItem\n      {...headlessProps}\n      color={local.color}\n      class={(renderProps) =>\n        [\n          local.class,\n          colorSwatchPickerItemRoot({\n            ...renderProps,\n            rounding: rounding(),\n          }),\n        ]\n          .filter(Boolean)\n          .join(\" \")\n      }\n    >\n      {(renderProps) => (\n        <>\n          <InternalColorSwatchContext value={null}>\n            {renderChildren(renderProps)}\n          </InternalColorSwatchContext>\n          <Show when={renderProps.isSelected}>\n            <div aria-hidden=\"true\" class={colorSwatchPickerSelectedOverlay} />\n          </Show>\n        </>\n      )}\n    </HeadlessColorSwatchPickerItem>\n  );\n}\n"],"mappings":"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"}