npm - @spectrum-web-components/swatch - Versions diffs - 0.3.0 → 0.3.1 - Mend

@spectrum-web-components/swatch 0.3.0 → 0.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (9) hide show

package/package.json +8 -9
package/src/spectrum-swatch.css.dev.js +16 -11
package/src/spectrum-swatch.css.dev.js.map +2 -2
package/src/spectrum-swatch.css.js +16 -11
package/src/spectrum-swatch.css.js.map +2 -2
package/src/swatch.css.dev.js +16 -11
package/src/swatch.css.dev.js.map +2 -2
package/src/swatch.css.js +16 -11
package/src/swatch.css.js.map +2 -2

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/swatch",
-    "version": "0.3.0",
+    "version": "0.3.1",
     "publishConfig": {
         "access": "public"
     },
@@ -67,15 +67,14 @@
     ],
     "dependencies": {
         "@lit-labs/observers": "^1.0.1",
-        "@spectrum-web-components/base": "^0.7.0",
-        "@spectrum-web-components/icon": "^0.12.2",
-        "@spectrum-web-components/icons-ui": "^0.9.2",
-        "@spectrum-web-components/reactive-controllers": "^0.3.2",
-        "@spectrum-web-components/shared": "^0.15.1",
-        "tslib": "^2.0.0"
+        "@spectrum-web-components/base": "^0.7.1",
+        "@spectrum-web-components/icon": "^0.12.3",
+        "@spectrum-web-components/icons-ui": "^0.9.3",
+        "@spectrum-web-components/reactive-controllers": "^0.3.3",
+        "@spectrum-web-components/shared": "^0.15.2"
     },
     "devDependencies": {
-        "@spectrum-css/swatch": "^2.0.0",
+        "@spectrum-css/swatch": "^3.0.0",
         "@spectrum-css/swatchgroup": "^2.0.1"
     },
     "types": "./src/index.d.ts",
@@ -84,5 +83,5 @@
         "./sp-*.js",
         "./**/*.dev.js"
     ],
-    "gitHead": "31d083d1eb61a1382335030c190c85d85f41e15d"
+    "gitHead": "8bd87724e91e23df83dbf63a434bbbe10b8daaa6"
 }

package/src/spectrum-swatch.css.dev.js CHANGED Viewed

@@ -1,15 +1,17 @@
 "use strict";
 import { css } from "@spectrum-web-components/base";
 const styles = css`
-:host{--spectrum-swatch-focus-ring-border-radius:8px;--spectrum-swatch-icon-border-color:rgba(0,0,0,.51);--spectrum-swatch-size:var(--spectrum-swatch-size-small);--spectrum-swatch-border-radius:var(--spectrum-corner-radius-100);--spectrum-swatch-border-thickness:var(--spectrum-border-width-100);--spectrum-swatch-border-thickness-selected:var(
+:host{--spectrum-swatch-focus-indicator-border-radius:8px;--spectrum-swatch-icon-border-color:rgba(0,0,0,.51);--spectrum-swatch-size:var(--spectrum-swatch-size-small);--spectrum-swatch-border-radius:var(--spectrum-corner-radius-100);--spectrum-swatch-border-thickness:var(--spectrum-border-width-100);--spectrum-swatch-border-thickness-selected:var(
 --spectrum-border-width-200
 );--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-75);--spectrum-swatch-slash-thickness:var(
 --spectrum-swatch-slash-thickness-small
-);--spectrum-swatch-focus-ring-thickness:var(
---spectrum-focus-ring-thickness
-);--spectrum-swatch-focus-ring-gap:var(--spectrum-focus-ring-gap);--spectrum-swatch-border-color-selected:var(--spectrum-gray-900);--spectrum-swatch-inner-border-color-selected:var(--spectrum-gray-50);--spectrum-swatch-disabled-icon-border-color:var(
+);--spectrum-swatch-focus-indicator-thickness:var(
+--spectrum-focus-indicator-thickness
+);--spectrum-swatch-focus-indicator-gap:var(--spectrum-focus-indicator-gap);--spectrum-swatch-border-color-selected:var(--spectrum-gray-900);--spectrum-swatch-inner-border-color-selected:var(--spectrum-gray-50);--spectrum-swatch-disabled-icon-border-color:var(
 --spectrum-swatch-disabled-icon-border-color
-);--spectrum-swatch-disabled-icon-color:var(--spectrum-white);--spectrum-swatch-dash-icon-color:var(--spectrum-gray-800);--spectrum-swatch-slash-icon-color:var(--spectrum-red-900);--spectrum-swatch-focus-ring-color:var(--spectrum-focus-ring-color)}:host([size=xs]){--spectrum-swatch-size:var(
+);--spectrum-swatch-disabled-icon-color:var(--spectrum-white);--spectrum-swatch-dash-icon-color:var(--spectrum-gray-800);--spectrum-swatch-slash-icon-color:var(--spectrum-red-900);--spectrum-swatch-focus-indicator-color:var(
+--spectrum-focus-indicator-color
+)}:host([size=xs]){--spectrum-swatch-size:var(
 --spectrum-swatch-size-extra-small
 );--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-50);--spectrum-swatch-slash-thickness:var(
 --spectrum-swatch-slash-thickness-extra-small
@@ -29,7 +31,7 @@ const styles = css`
 --spectrum-workflow-icon-size-200
 );--spectrum-swatch-slash-thickness:var(
 --spectrum-swatch-slash-thickness-large
-)}@media (forced-colors:active){:host{--highcontrast-swatch-disabled-icon-color:GrayText;--highcontrast-swatch-focus-ring-color:ButtonText;--highcontrast-swatch-background-color-selected:Background;--highcontrast-swatch-border-color-selected:Highlight;--highcontrast-swatch-border-color:ButtonText;--highcontrast-swatch-fill-foreground-color:ButtonText}.fill{forced-color-adjust:none}:host([disabled]) .fill{forced-color-adjust:auto}}:host{align-items:center;display:flex;height:var(--mod-swatch-size,var(--spectrum-swatch-size));justify-content:center;outline:none;position:relative;-webkit-user-select:none;user-select:none;width:var(
+)}@media (forced-colors:active){:host{--highcontrast-swatch-disabled-icon-color:GrayText;--highcontrast-swatch-focus-indicator-color:ButtonText;--highcontrast-swatch-background-color-selected:Background;--highcontrast-swatch-border-color-selected:Highlight;--highcontrast-swatch-border-color:ButtonText;--highcontrast-swatch-fill-foreground-color:ButtonText}.fill{forced-color-adjust:none}:host([disabled]) .fill{forced-color-adjust:auto}}:host{align-items:center;display:flex;height:var(--mod-swatch-size,var(--spectrum-swatch-size));justify-content:center;outline:none;position:relative;-webkit-user-select:none;user-select:none;width:var(
 --mod-swatch-size,var(--spectrum-swatch-size)
 )}.disabledIcon{height:var(
 --mod-swatch-disabled-icon-size,var(--spectrum-swatch-disabled-icon-size)
@@ -84,14 +86,17 @@ var(--spectrum-swatch-border-thickness-selected)
 );border-style:solid;border-width:var(
 --mod-swatch-border-thickness-selected,var(--spectrum-swatch-border-thickness-selected)
 );content:"";inset:0;opacity:0;pointer-events:none;position:absolute}:host:after{border-color:var(
---highcontrast-swatch-focus-ring-color,var(
---mod-swatch-focus-ring-color,var(--spectrum-swatch-focus-ring-color)
+--highcontrast-swatch-focus-indicator-color,var(
+--mod-swatch-focus-indicator-color,var(--spectrum-swatch-focus-indicator-color)
 )
 );border-radius:var(
---mod-swatch-focus-ring-border-radius,var(--spectrum-swatch-focus-ring-border-radius)
+--mod-swatch-focus-indicator-border-radius,var(--spectrum-swatch-focus-indicator-border-radius)
 );border-style:solid;border-width:var(
---mod-swatch-focus-ring-thickness,var(--spectrum-swatch-focus-ring-thickness)
-);content:"";inset:calc(var(--mod-swatch-focus-ring-gap, var(--spectrum-swatch-focus-ring-gap))*-2);opacity:0;position:absolute;transition:opacity var(
+--mod-swatch-focus-indicator-thickness,var(--spectrum-swatch-focus-indicator-thickness)
+);content:"";inset:calc(var(
+--mod-swatch-focus-indicator-gap,
+var(--spectrum-swatch-focus-indicator-gap)
+)*-2);opacity:0;position:absolute;transition:opacity var(
 --mod-animation-duration-100,var(--spectrum-animation-duration-100)
 ) ease-in-out}:host(.focus-visible):after{opacity:1}:host(:focus-visible):after{opacity:1}.fill{--spectrum-swatch-checkerboard-size:8px;--spectrum-swatch-checkerboard-background-offset:0px;--spectrum-swatch-checkerboard-dark-color:#d9d9d9;--spectrum-swatch-checkerboard-light-color:#fff;align-items:center;background-color:var(--spectrum-swatch-checkerboard-light-color);background-image:linear-gradient(-45deg,transparent 75.5%,var(--spectrum-swatch-checkerboard-dark-color) 75.5%),linear-gradient(45deg,transparent 75.5%,var(--spectrum-swatch-checkerboard-dark-color) 75.5%),linear-gradient(-45deg,var(--spectrum-swatch-checkerboard-dark-color) 25.5%,transparent 25.5%),linear-gradient(45deg,var(--spectrum-swatch-checkerboard-dark-color) 25.5%,transparent 25.5%);background-position:var(--spectrum-swatch-checkerboard-background-offset) var(--spectrum-swatch-checkerboard-background-offset),var(--spectrum-swatch-checkerboard-background-offset) calc(var(
 --mod-swatch-checkerboard-size,

package/src/spectrum-swatch.css.dev.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["spectrum-swatch.css.ts"],
-  "sourcesContent": ["/*\nCopyright 2022 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host{--spectrum-swatch-focus-ring-border-radius:8px;--spectrum-swatch-icon-border-color:rgba(0,0,0,.51);--spectrum-swatch-size:var(--spectrum-swatch-size-small);--spectrum-swatch-border-radius:var(--spectrum-corner-radius-100);--spectrum-swatch-border-thickness:var(--spectrum-border-width-100);--spectrum-swatch-border-thickness-selected:var(\n--spectrum-border-width-200\n);--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-75);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-small\n);--spectrum-swatch-focus-ring-thickness:var(\n--spectrum-focus-ring-thickness\n);--spectrum-swatch-focus-ring-gap:var(--spectrum-focus-ring-gap);--spectrum-swatch-border-color-selected:var(--spectrum-gray-900);--spectrum-swatch-inner-border-color-selected:var(--spectrum-gray-50);--spectrum-swatch-disabled-icon-border-color:var(\n--spectrum-swatch-disabled-icon-border-color\n);--spectrum-swatch-disabled-icon-color:var(--spectrum-white);--spectrum-swatch-dash-icon-color:var(--spectrum-gray-800);--spectrum-swatch-slash-icon-color:var(--spectrum-red-900);--spectrum-swatch-focus-ring-color:var(--spectrum-focus-ring-color)}:host([size=xs]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-extra-small\n);--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-50);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-extra-small\n)}:host([size=s]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-small\n);--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-75);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-small\n)}:host([size=m]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-medium\n);--spectrum-swatch-disabled-icon-size:var(\n--spectrum-workflow-icon-size-100\n);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-medium\n)}:host([size=l]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-large\n);--spectrum-swatch-disabled-icon-size:var(\n--spectrum-workflow-icon-size-200\n);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-large\n)}@media (forced-colors:active){:host{--highcontrast-swatch-disabled-icon-color:GrayText;--highcontrast-swatch-focus-ring-color:ButtonText;--highcontrast-swatch-background-color-selected:Background;--highcontrast-swatch-border-color-selected:Highlight;--highcontrast-swatch-border-color:ButtonText;--highcontrast-swatch-fill-foreground-color:ButtonText}.fill{forced-color-adjust:none}:host([disabled]) .fill{forced-color-adjust:auto}}:host{align-items:center;display:flex;height:var(--mod-swatch-size,var(--spectrum-swatch-size));justify-content:center;outline:none;position:relative;-webkit-user-select:none;user-select:none;width:var(\n--mod-swatch-size,var(--spectrum-swatch-size)\n)}.disabledIcon{height:var(\n--mod-swatch-disabled-icon-size,var(--spectrum-swatch-disabled-icon-size)\n);width:var(\n--mod-swatch-disabled-icon-size,var(--spectrum-swatch-disabled-icon-size)\n)}:host,:host:before{border-radius:var(\n--mod-swatch-border-radius,var(--spectrum-swatch-border-radius)\n)}:host([selected]){background-color:var(\n--highcontrast-swatch-background-color-selected,var(\n--mod-swatch-inner-border-color-selected,var(--spectrum-swatch-inner-border-color-selected)\n)\n)}:host([selected]) .fill{border-radius:0;clip-path:polygon(calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2),calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2),calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2),calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2))}:host([selected]) .fill:before{border-radius:0;box-shadow:none}:host([selected]):before{opacity:1}:host(.is-image) .fill:before{background-color:transparent}:host([mixed-value]) .fill{background:var(\n--spectrum-picked-color,transparent\n)}:host([mixed-value]) .mixedValueIcon{color:var(\n--spectrum-swatch-dash-icon-color\n);visibility:visible}:host([nothing]) .fill{background-color:var(\n--spectrum-picked-color,transparent\n);background-image:none}:host([nothing]) .fill:after{background:var(\n--highcontrast-swatch-fill-foreground-color,var(\n--mod-swatch-slash-icon-color,var(--spectrum-swatch-slash-icon-color)\n)\n);content:\"\";height:var(\n--mod-swatch-slash-thickness,var(--spectrum-swatch-slash-thickness)\n);position:absolute;transform:rotate(-45deg);width:200%}:host([nothing][shape=rectangle]) .fill:after{transform:rotate(-25deg)}:host([disabled]) .disabledIcon,:host([disabled]) .disabledIcon{visibility:visible}:host:before{border-color:var(\n--highcontrast-swatch-border-color-selected,var(\n--mod-swatch-border-color-selected,var(--spectrum-swatch-border-color-selected)\n)\n);border-style:solid;border-width:var(\n--mod-swatch-border-thickness-selected,var(--spectrum-swatch-border-thickness-selected)\n);content:\"\";inset:0;opacity:0;pointer-events:none;position:absolute}:host:after{border-color:var(\n--highcontrast-swatch-focus-ring-color,var(\n--mod-swatch-focus-ring-color,var(--spectrum-swatch-focus-ring-color)\n)\n);border-radius:var(\n--mod-swatch-focus-ring-border-radius,var(--spectrum-swatch-focus-ring-border-radius)\n);border-style:solid;border-width:var(\n--mod-swatch-focus-ring-thickness,var(--spectrum-swatch-focus-ring-thickness)\n);content:\"\";inset:calc(var(--mod-swatch-focus-ring-gap, var(--spectrum-swatch-focus-ring-gap))*-2);opacity:0;position:absolute;transition:opacity var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-in-out}:host(.focus-visible):after{opacity:1}:host(:focus-visible):after{opacity:1}.fill{--spectrum-swatch-checkerboard-size:8px;--spectrum-swatch-checkerboard-background-offset:0px;--spectrum-swatch-checkerboard-dark-color:#d9d9d9;--spectrum-swatch-checkerboard-light-color:#fff;align-items:center;background-color:var(--spectrum-swatch-checkerboard-light-color);background-image:linear-gradient(-45deg,transparent 75.5%,var(--spectrum-swatch-checkerboard-dark-color) 75.5%),linear-gradient(45deg,transparent 75.5%,var(--spectrum-swatch-checkerboard-dark-color) 75.5%),linear-gradient(-45deg,var(--spectrum-swatch-checkerboard-dark-color) 25.5%,transparent 25.5%),linear-gradient(45deg,var(--spectrum-swatch-checkerboard-dark-color) 25.5%,transparent 25.5%);background-position:var(--spectrum-swatch-checkerboard-background-offset) var(--spectrum-swatch-checkerboard-background-offset),var(--spectrum-swatch-checkerboard-background-offset) calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n) + var(--spectrum-swatch-checkerboard-background-offset)),calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n) + var(--spectrum-swatch-checkerboard-background-offset)) calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*-1 + var(--spectrum-swatch-checkerboard-background-offset)),calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*-1 + var(--spectrum-swatch-checkerboard-background-offset)) var(--spectrum-swatch-checkerboard-background-offset);background-size:calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*2) calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*2);border-radius:var(\n--mod-swatch-border-radius,var(--spectrum-swatch-border-radius)\n);box-sizing:border-box;display:flex;height:100%;justify-content:center;overflow:hidden;position:relative;width:100%}.fill:before{background-color:var(--spectrum-picked-color,transparent);border-radius:var(\n--mod-swatch-border-radius,var(--spectrum-swatch-border-radius)\n);box-shadow:inset 0 0 0 var(\n--mod-swatch-border-thickness,var(--spectrum-swatch-border-thickness)\n) var(\n--highcontrast-swatch-border-color,var(--mod-swatch-border-color,var(--spectrum-swatch-border-color))\n);content:\"\";inset:0;position:absolute;z-index:0}:host([border=none]) .fill:before{background-color:var(--spectrum-picked-color,transparent);box-shadow:none}.mixedValueIcon{color:var(\n--spectrum-picked-color,transparent\n)}.disabledIcon,.mixedValueIcon{pointer-events:none;visibility:hidden}.disabledIcon{stroke:var(\n--highcontrast-swatch-disabled-icon-color,var(\n--mod-swatch-disabled-icon-color,var(--spectrum-swatch-disabled-icon-color)\n)\n);color:var(\n--highcontrast-swatch-disabled-icon-color,var(\n--mod-swatch-disabled-icon-color,var(--spectrum-swatch-disabled-icon-color)\n)\n);position:relative;z-index:2}.disabledIcon path:first-child{fill:var(\n--highcontrast-swatch-disabled-icon-color,var(\n--mod-swatch-disabled-icon-color,var(--spectrum-swatch-disabled-icon-color)\n)\n)}.disabledIcon path:last-child{fill:var(\n--mod-swatch-icon-border-color,var(--spectrum-swatch-icon-border-color)\n)}:host([shape=rectangle]){width:calc(var(--mod-swatch-size, var(--spectrum-swatch-size))*2)}:host([rounding=none]),:host([rounding=none]) .fill,:host([rounding=none]) .fill:before,:host([rounding=none]):after,:host([rounding=none]):before,:host([rounding=none][selected]) .fill,:host([rounding=none][selected]) .fill:before{border-radius:0}:host([rounding=full]:not([shape=rectangle])),:host([rounding=full]:not([shape=rectangle])) .fill,:host([rounding=full]:not([shape=rectangle])) .fill:before,:host([rounding=full]:not([shape=rectangle])):after,:host([rounding=full]:not([shape=rectangle])):before,:host([rounding=full][selected]:not([shape=rectangle])) .fill,:host([rounding=full][selected]:not([shape=rectangle])) .fill:before{border-radius:100%}:host([rounding=full][selected]:not([shape=rectangle])) .fill{clip-path:circle(calc(50% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) at 50% 50%)}::slotted([slot=image]){height:100%;object-fit:contain;transition:width var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-in-out,height var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-in-out;width:100%}\n`;\nexport default styles;"],
-  "mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAgJf,eAAe;",
+  "sourcesContent": ["/*\nCopyright 2022 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host{--spectrum-swatch-focus-indicator-border-radius:8px;--spectrum-swatch-icon-border-color:rgba(0,0,0,.51);--spectrum-swatch-size:var(--spectrum-swatch-size-small);--spectrum-swatch-border-radius:var(--spectrum-corner-radius-100);--spectrum-swatch-border-thickness:var(--spectrum-border-width-100);--spectrum-swatch-border-thickness-selected:var(\n--spectrum-border-width-200\n);--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-75);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-small\n);--spectrum-swatch-focus-indicator-thickness:var(\n--spectrum-focus-indicator-thickness\n);--spectrum-swatch-focus-indicator-gap:var(--spectrum-focus-indicator-gap);--spectrum-swatch-border-color-selected:var(--spectrum-gray-900);--spectrum-swatch-inner-border-color-selected:var(--spectrum-gray-50);--spectrum-swatch-disabled-icon-border-color:var(\n--spectrum-swatch-disabled-icon-border-color\n);--spectrum-swatch-disabled-icon-color:var(--spectrum-white);--spectrum-swatch-dash-icon-color:var(--spectrum-gray-800);--spectrum-swatch-slash-icon-color:var(--spectrum-red-900);--spectrum-swatch-focus-indicator-color:var(\n--spectrum-focus-indicator-color\n)}:host([size=xs]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-extra-small\n);--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-50);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-extra-small\n)}:host([size=s]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-small\n);--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-75);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-small\n)}:host([size=m]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-medium\n);--spectrum-swatch-disabled-icon-size:var(\n--spectrum-workflow-icon-size-100\n);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-medium\n)}:host([size=l]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-large\n);--spectrum-swatch-disabled-icon-size:var(\n--spectrum-workflow-icon-size-200\n);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-large\n)}@media (forced-colors:active){:host{--highcontrast-swatch-disabled-icon-color:GrayText;--highcontrast-swatch-focus-indicator-color:ButtonText;--highcontrast-swatch-background-color-selected:Background;--highcontrast-swatch-border-color-selected:Highlight;--highcontrast-swatch-border-color:ButtonText;--highcontrast-swatch-fill-foreground-color:ButtonText}.fill{forced-color-adjust:none}:host([disabled]) .fill{forced-color-adjust:auto}}:host{align-items:center;display:flex;height:var(--mod-swatch-size,var(--spectrum-swatch-size));justify-content:center;outline:none;position:relative;-webkit-user-select:none;user-select:none;width:var(\n--mod-swatch-size,var(--spectrum-swatch-size)\n)}.disabledIcon{height:var(\n--mod-swatch-disabled-icon-size,var(--spectrum-swatch-disabled-icon-size)\n);width:var(\n--mod-swatch-disabled-icon-size,var(--spectrum-swatch-disabled-icon-size)\n)}:host,:host:before{border-radius:var(\n--mod-swatch-border-radius,var(--spectrum-swatch-border-radius)\n)}:host([selected]){background-color:var(\n--highcontrast-swatch-background-color-selected,var(\n--mod-swatch-inner-border-color-selected,var(--spectrum-swatch-inner-border-color-selected)\n)\n)}:host([selected]) .fill{border-radius:0;clip-path:polygon(calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2),calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2),calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2),calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2))}:host([selected]) .fill:before{border-radius:0;box-shadow:none}:host([selected]):before{opacity:1}:host(.is-image) .fill:before{background-color:transparent}:host([mixed-value]) .fill{background:var(\n--spectrum-picked-color,transparent\n)}:host([mixed-value]) .mixedValueIcon{color:var(\n--spectrum-swatch-dash-icon-color\n);visibility:visible}:host([nothing]) .fill{background-color:var(\n--spectrum-picked-color,transparent\n);background-image:none}:host([nothing]) .fill:after{background:var(\n--highcontrast-swatch-fill-foreground-color,var(\n--mod-swatch-slash-icon-color,var(--spectrum-swatch-slash-icon-color)\n)\n);content:\"\";height:var(\n--mod-swatch-slash-thickness,var(--spectrum-swatch-slash-thickness)\n);position:absolute;transform:rotate(-45deg);width:200%}:host([nothing][shape=rectangle]) .fill:after{transform:rotate(-25deg)}:host([disabled]) .disabledIcon,:host([disabled]) .disabledIcon{visibility:visible}:host:before{border-color:var(\n--highcontrast-swatch-border-color-selected,var(\n--mod-swatch-border-color-selected,var(--spectrum-swatch-border-color-selected)\n)\n);border-style:solid;border-width:var(\n--mod-swatch-border-thickness-selected,var(--spectrum-swatch-border-thickness-selected)\n);content:\"\";inset:0;opacity:0;pointer-events:none;position:absolute}:host:after{border-color:var(\n--highcontrast-swatch-focus-indicator-color,var(\n--mod-swatch-focus-indicator-color,var(--spectrum-swatch-focus-indicator-color)\n)\n);border-radius:var(\n--mod-swatch-focus-indicator-border-radius,var(--spectrum-swatch-focus-indicator-border-radius)\n);border-style:solid;border-width:var(\n--mod-swatch-focus-indicator-thickness,var(--spectrum-swatch-focus-indicator-thickness)\n);content:\"\";inset:calc(var(\n--mod-swatch-focus-indicator-gap,\nvar(--spectrum-swatch-focus-indicator-gap)\n)*-2);opacity:0;position:absolute;transition:opacity var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-in-out}:host(.focus-visible):after{opacity:1}:host(:focus-visible):after{opacity:1}.fill{--spectrum-swatch-checkerboard-size:8px;--spectrum-swatch-checkerboard-background-offset:0px;--spectrum-swatch-checkerboard-dark-color:#d9d9d9;--spectrum-swatch-checkerboard-light-color:#fff;align-items:center;background-color:var(--spectrum-swatch-checkerboard-light-color);background-image:linear-gradient(-45deg,transparent 75.5%,var(--spectrum-swatch-checkerboard-dark-color) 75.5%),linear-gradient(45deg,transparent 75.5%,var(--spectrum-swatch-checkerboard-dark-color) 75.5%),linear-gradient(-45deg,var(--spectrum-swatch-checkerboard-dark-color) 25.5%,transparent 25.5%),linear-gradient(45deg,var(--spectrum-swatch-checkerboard-dark-color) 25.5%,transparent 25.5%);background-position:var(--spectrum-swatch-checkerboard-background-offset) var(--spectrum-swatch-checkerboard-background-offset),var(--spectrum-swatch-checkerboard-background-offset) calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n) + var(--spectrum-swatch-checkerboard-background-offset)),calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n) + var(--spectrum-swatch-checkerboard-background-offset)) calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*-1 + var(--spectrum-swatch-checkerboard-background-offset)),calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*-1 + var(--spectrum-swatch-checkerboard-background-offset)) var(--spectrum-swatch-checkerboard-background-offset);background-size:calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*2) calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*2);border-radius:var(\n--mod-swatch-border-radius,var(--spectrum-swatch-border-radius)\n);box-sizing:border-box;display:flex;height:100%;justify-content:center;overflow:hidden;position:relative;width:100%}.fill:before{background-color:var(--spectrum-picked-color,transparent);border-radius:var(\n--mod-swatch-border-radius,var(--spectrum-swatch-border-radius)\n);box-shadow:inset 0 0 0 var(\n--mod-swatch-border-thickness,var(--spectrum-swatch-border-thickness)\n) var(\n--highcontrast-swatch-border-color,var(--mod-swatch-border-color,var(--spectrum-swatch-border-color))\n);content:\"\";inset:0;position:absolute;z-index:0}:host([border=none]) .fill:before{background-color:var(--spectrum-picked-color,transparent);box-shadow:none}.mixedValueIcon{color:var(\n--spectrum-picked-color,transparent\n)}.disabledIcon,.mixedValueIcon{pointer-events:none;visibility:hidden}.disabledIcon{stroke:var(\n--highcontrast-swatch-disabled-icon-color,var(\n--mod-swatch-disabled-icon-color,var(--spectrum-swatch-disabled-icon-color)\n)\n);color:var(\n--highcontrast-swatch-disabled-icon-color,var(\n--mod-swatch-disabled-icon-color,var(--spectrum-swatch-disabled-icon-color)\n)\n);position:relative;z-index:2}.disabledIcon path:first-child{fill:var(\n--highcontrast-swatch-disabled-icon-color,var(\n--mod-swatch-disabled-icon-color,var(--spectrum-swatch-disabled-icon-color)\n)\n)}.disabledIcon path:last-child{fill:var(\n--mod-swatch-icon-border-color,var(--spectrum-swatch-icon-border-color)\n)}:host([shape=rectangle]){width:calc(var(--mod-swatch-size, var(--spectrum-swatch-size))*2)}:host([rounding=none]),:host([rounding=none]) .fill,:host([rounding=none]) .fill:before,:host([rounding=none]):after,:host([rounding=none]):before,:host([rounding=none][selected]) .fill,:host([rounding=none][selected]) .fill:before{border-radius:0}:host([rounding=full]:not([shape=rectangle])),:host([rounding=full]:not([shape=rectangle])) .fill,:host([rounding=full]:not([shape=rectangle])) .fill:before,:host([rounding=full]:not([shape=rectangle])):after,:host([rounding=full]:not([shape=rectangle])):before,:host([rounding=full][selected]:not([shape=rectangle])) .fill,:host([rounding=full][selected]:not([shape=rectangle])) .fill:before{border-radius:100%}:host([rounding=full][selected]:not([shape=rectangle])) .fill{clip-path:circle(calc(50% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) at 50% 50%)}::slotted([slot=image]){height:100%;object-fit:contain;transition:width var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-in-out,height var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-in-out;width:100%}\n`;\nexport default styles;"],
+  "mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAqJf,eAAe;",
   "names": []
 }

package/src/spectrum-swatch.css.js CHANGED Viewed

@@ -1,13 +1,15 @@
 "use strict";import{css as r}from"@spectrum-web-components/base";const e=r`
-:host{--spectrum-swatch-focus-ring-border-radius:8px;--spectrum-swatch-icon-border-color:rgba(0,0,0,.51);--spectrum-swatch-size:var(--spectrum-swatch-size-small);--spectrum-swatch-border-radius:var(--spectrum-corner-radius-100);--spectrum-swatch-border-thickness:var(--spectrum-border-width-100);--spectrum-swatch-border-thickness-selected:var(
+:host{--spectrum-swatch-focus-indicator-border-radius:8px;--spectrum-swatch-icon-border-color:rgba(0,0,0,.51);--spectrum-swatch-size:var(--spectrum-swatch-size-small);--spectrum-swatch-border-radius:var(--spectrum-corner-radius-100);--spectrum-swatch-border-thickness:var(--spectrum-border-width-100);--spectrum-swatch-border-thickness-selected:var(
 --spectrum-border-width-200
 );--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-75);--spectrum-swatch-slash-thickness:var(
 --spectrum-swatch-slash-thickness-small
-);--spectrum-swatch-focus-ring-thickness:var(
---spectrum-focus-ring-thickness
-);--spectrum-swatch-focus-ring-gap:var(--spectrum-focus-ring-gap);--spectrum-swatch-border-color-selected:var(--spectrum-gray-900);--spectrum-swatch-inner-border-color-selected:var(--spectrum-gray-50);--spectrum-swatch-disabled-icon-border-color:var(
+);--spectrum-swatch-focus-indicator-thickness:var(
+--spectrum-focus-indicator-thickness
+);--spectrum-swatch-focus-indicator-gap:var(--spectrum-focus-indicator-gap);--spectrum-swatch-border-color-selected:var(--spectrum-gray-900);--spectrum-swatch-inner-border-color-selected:var(--spectrum-gray-50);--spectrum-swatch-disabled-icon-border-color:var(
 --spectrum-swatch-disabled-icon-border-color
-);--spectrum-swatch-disabled-icon-color:var(--spectrum-white);--spectrum-swatch-dash-icon-color:var(--spectrum-gray-800);--spectrum-swatch-slash-icon-color:var(--spectrum-red-900);--spectrum-swatch-focus-ring-color:var(--spectrum-focus-ring-color)}:host([size=xs]){--spectrum-swatch-size:var(
+);--spectrum-swatch-disabled-icon-color:var(--spectrum-white);--spectrum-swatch-dash-icon-color:var(--spectrum-gray-800);--spectrum-swatch-slash-icon-color:var(--spectrum-red-900);--spectrum-swatch-focus-indicator-color:var(
+--spectrum-focus-indicator-color
+)}:host([size=xs]){--spectrum-swatch-size:var(
 --spectrum-swatch-size-extra-small
 );--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-50);--spectrum-swatch-slash-thickness:var(
 --spectrum-swatch-slash-thickness-extra-small
@@ -27,7 +29,7 @@
 --spectrum-workflow-icon-size-200
 );--spectrum-swatch-slash-thickness:var(
 --spectrum-swatch-slash-thickness-large
-)}@media (forced-colors:active){:host{--highcontrast-swatch-disabled-icon-color:GrayText;--highcontrast-swatch-focus-ring-color:ButtonText;--highcontrast-swatch-background-color-selected:Background;--highcontrast-swatch-border-color-selected:Highlight;--highcontrast-swatch-border-color:ButtonText;--highcontrast-swatch-fill-foreground-color:ButtonText}.fill{forced-color-adjust:none}:host([disabled]) .fill{forced-color-adjust:auto}}:host{align-items:center;display:flex;height:var(--mod-swatch-size,var(--spectrum-swatch-size));justify-content:center;outline:none;position:relative;-webkit-user-select:none;user-select:none;width:var(
+)}@media (forced-colors:active){:host{--highcontrast-swatch-disabled-icon-color:GrayText;--highcontrast-swatch-focus-indicator-color:ButtonText;--highcontrast-swatch-background-color-selected:Background;--highcontrast-swatch-border-color-selected:Highlight;--highcontrast-swatch-border-color:ButtonText;--highcontrast-swatch-fill-foreground-color:ButtonText}.fill{forced-color-adjust:none}:host([disabled]) .fill{forced-color-adjust:auto}}:host{align-items:center;display:flex;height:var(--mod-swatch-size,var(--spectrum-swatch-size));justify-content:center;outline:none;position:relative;-webkit-user-select:none;user-select:none;width:var(
 --mod-swatch-size,var(--spectrum-swatch-size)
 )}.disabledIcon{height:var(
 --mod-swatch-disabled-icon-size,var(--spectrum-swatch-disabled-icon-size)
@@ -82,14 +84,17 @@ var(--spectrum-swatch-border-thickness-selected)
 );border-style:solid;border-width:var(
 --mod-swatch-border-thickness-selected,var(--spectrum-swatch-border-thickness-selected)
 );content:"";inset:0;opacity:0;pointer-events:none;position:absolute}:host:after{border-color:var(
---highcontrast-swatch-focus-ring-color,var(
---mod-swatch-focus-ring-color,var(--spectrum-swatch-focus-ring-color)
+--highcontrast-swatch-focus-indicator-color,var(
+--mod-swatch-focus-indicator-color,var(--spectrum-swatch-focus-indicator-color)
 )
 );border-radius:var(
---mod-swatch-focus-ring-border-radius,var(--spectrum-swatch-focus-ring-border-radius)
+--mod-swatch-focus-indicator-border-radius,var(--spectrum-swatch-focus-indicator-border-radius)
 );border-style:solid;border-width:var(
---mod-swatch-focus-ring-thickness,var(--spectrum-swatch-focus-ring-thickness)
-);content:"";inset:calc(var(--mod-swatch-focus-ring-gap, var(--spectrum-swatch-focus-ring-gap))*-2);opacity:0;position:absolute;transition:opacity var(
+--mod-swatch-focus-indicator-thickness,var(--spectrum-swatch-focus-indicator-thickness)
+);content:"";inset:calc(var(
+--mod-swatch-focus-indicator-gap,
+var(--spectrum-swatch-focus-indicator-gap)
+)*-2);opacity:0;position:absolute;transition:opacity var(
 --mod-animation-duration-100,var(--spectrum-animation-duration-100)
 ) ease-in-out}:host(.focus-visible):after{opacity:1}:host(:focus-visible):after{opacity:1}.fill{--spectrum-swatch-checkerboard-size:8px;--spectrum-swatch-checkerboard-background-offset:0px;--spectrum-swatch-checkerboard-dark-color:#d9d9d9;--spectrum-swatch-checkerboard-light-color:#fff;align-items:center;background-color:var(--spectrum-swatch-checkerboard-light-color);background-image:linear-gradient(-45deg,transparent 75.5%,var(--spectrum-swatch-checkerboard-dark-color) 75.5%),linear-gradient(45deg,transparent 75.5%,var(--spectrum-swatch-checkerboard-dark-color) 75.5%),linear-gradient(-45deg,var(--spectrum-swatch-checkerboard-dark-color) 25.5%,transparent 25.5%),linear-gradient(45deg,var(--spectrum-swatch-checkerboard-dark-color) 25.5%,transparent 25.5%);background-position:var(--spectrum-swatch-checkerboard-background-offset) var(--spectrum-swatch-checkerboard-background-offset),var(--spectrum-swatch-checkerboard-background-offset) calc(var(
 --mod-swatch-checkerboard-size,

package/src/spectrum-swatch.css.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["spectrum-swatch.css.ts"],
-  "sourcesContent": ["/*\nCopyright 2022 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host{--spectrum-swatch-focus-ring-border-radius:8px;--spectrum-swatch-icon-border-color:rgba(0,0,0,.51);--spectrum-swatch-size:var(--spectrum-swatch-size-small);--spectrum-swatch-border-radius:var(--spectrum-corner-radius-100);--spectrum-swatch-border-thickness:var(--spectrum-border-width-100);--spectrum-swatch-border-thickness-selected:var(\n--spectrum-border-width-200\n);--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-75);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-small\n);--spectrum-swatch-focus-ring-thickness:var(\n--spectrum-focus-ring-thickness\n);--spectrum-swatch-focus-ring-gap:var(--spectrum-focus-ring-gap);--spectrum-swatch-border-color-selected:var(--spectrum-gray-900);--spectrum-swatch-inner-border-color-selected:var(--spectrum-gray-50);--spectrum-swatch-disabled-icon-border-color:var(\n--spectrum-swatch-disabled-icon-border-color\n);--spectrum-swatch-disabled-icon-color:var(--spectrum-white);--spectrum-swatch-dash-icon-color:var(--spectrum-gray-800);--spectrum-swatch-slash-icon-color:var(--spectrum-red-900);--spectrum-swatch-focus-ring-color:var(--spectrum-focus-ring-color)}:host([size=xs]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-extra-small\n);--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-50);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-extra-small\n)}:host([size=s]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-small\n);--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-75);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-small\n)}:host([size=m]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-medium\n);--spectrum-swatch-disabled-icon-size:var(\n--spectrum-workflow-icon-size-100\n);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-medium\n)}:host([size=l]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-large\n);--spectrum-swatch-disabled-icon-size:var(\n--spectrum-workflow-icon-size-200\n);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-large\n)}@media (forced-colors:active){:host{--highcontrast-swatch-disabled-icon-color:GrayText;--highcontrast-swatch-focus-ring-color:ButtonText;--highcontrast-swatch-background-color-selected:Background;--highcontrast-swatch-border-color-selected:Highlight;--highcontrast-swatch-border-color:ButtonText;--highcontrast-swatch-fill-foreground-color:ButtonText}.fill{forced-color-adjust:none}:host([disabled]) .fill{forced-color-adjust:auto}}:host{align-items:center;display:flex;height:var(--mod-swatch-size,var(--spectrum-swatch-size));justify-content:center;outline:none;position:relative;-webkit-user-select:none;user-select:none;width:var(\n--mod-swatch-size,var(--spectrum-swatch-size)\n)}.disabledIcon{height:var(\n--mod-swatch-disabled-icon-size,var(--spectrum-swatch-disabled-icon-size)\n);width:var(\n--mod-swatch-disabled-icon-size,var(--spectrum-swatch-disabled-icon-size)\n)}:host,:host:before{border-radius:var(\n--mod-swatch-border-radius,var(--spectrum-swatch-border-radius)\n)}:host([selected]){background-color:var(\n--highcontrast-swatch-background-color-selected,var(\n--mod-swatch-inner-border-color-selected,var(--spectrum-swatch-inner-border-color-selected)\n)\n)}:host([selected]) .fill{border-radius:0;clip-path:polygon(calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2),calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2),calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2),calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2))}:host([selected]) .fill:before{border-radius:0;box-shadow:none}:host([selected]):before{opacity:1}:host(.is-image) .fill:before{background-color:transparent}:host([mixed-value]) .fill{background:var(\n--spectrum-picked-color,transparent\n)}:host([mixed-value]) .mixedValueIcon{color:var(\n--spectrum-swatch-dash-icon-color\n);visibility:visible}:host([nothing]) .fill{background-color:var(\n--spectrum-picked-color,transparent\n);background-image:none}:host([nothing]) .fill:after{background:var(\n--highcontrast-swatch-fill-foreground-color,var(\n--mod-swatch-slash-icon-color,var(--spectrum-swatch-slash-icon-color)\n)\n);content:\"\";height:var(\n--mod-swatch-slash-thickness,var(--spectrum-swatch-slash-thickness)\n);position:absolute;transform:rotate(-45deg);width:200%}:host([nothing][shape=rectangle]) .fill:after{transform:rotate(-25deg)}:host([disabled]) .disabledIcon,:host([disabled]) .disabledIcon{visibility:visible}:host:before{border-color:var(\n--highcontrast-swatch-border-color-selected,var(\n--mod-swatch-border-color-selected,var(--spectrum-swatch-border-color-selected)\n)\n);border-style:solid;border-width:var(\n--mod-swatch-border-thickness-selected,var(--spectrum-swatch-border-thickness-selected)\n);content:\"\";inset:0;opacity:0;pointer-events:none;position:absolute}:host:after{border-color:var(\n--highcontrast-swatch-focus-ring-color,var(\n--mod-swatch-focus-ring-color,var(--spectrum-swatch-focus-ring-color)\n)\n);border-radius:var(\n--mod-swatch-focus-ring-border-radius,var(--spectrum-swatch-focus-ring-border-radius)\n);border-style:solid;border-width:var(\n--mod-swatch-focus-ring-thickness,var(--spectrum-swatch-focus-ring-thickness)\n);content:\"\";inset:calc(var(--mod-swatch-focus-ring-gap, var(--spectrum-swatch-focus-ring-gap))*-2);opacity:0;position:absolute;transition:opacity var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-in-out}:host(.focus-visible):after{opacity:1}:host(:focus-visible):after{opacity:1}.fill{--spectrum-swatch-checkerboard-size:8px;--spectrum-swatch-checkerboard-background-offset:0px;--spectrum-swatch-checkerboard-dark-color:#d9d9d9;--spectrum-swatch-checkerboard-light-color:#fff;align-items:center;background-color:var(--spectrum-swatch-checkerboard-light-color);background-image:linear-gradient(-45deg,transparent 75.5%,var(--spectrum-swatch-checkerboard-dark-color) 75.5%),linear-gradient(45deg,transparent 75.5%,var(--spectrum-swatch-checkerboard-dark-color) 75.5%),linear-gradient(-45deg,var(--spectrum-swatch-checkerboard-dark-color) 25.5%,transparent 25.5%),linear-gradient(45deg,var(--spectrum-swatch-checkerboard-dark-color) 25.5%,transparent 25.5%);background-position:var(--spectrum-swatch-checkerboard-background-offset) var(--spectrum-swatch-checkerboard-background-offset),var(--spectrum-swatch-checkerboard-background-offset) calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n) + var(--spectrum-swatch-checkerboard-background-offset)),calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n) + var(--spectrum-swatch-checkerboard-background-offset)) calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*-1 + var(--spectrum-swatch-checkerboard-background-offset)),calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*-1 + var(--spectrum-swatch-checkerboard-background-offset)) var(--spectrum-swatch-checkerboard-background-offset);background-size:calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*2) calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*2);border-radius:var(\n--mod-swatch-border-radius,var(--spectrum-swatch-border-radius)\n);box-sizing:border-box;display:flex;height:100%;justify-content:center;overflow:hidden;position:relative;width:100%}.fill:before{background-color:var(--spectrum-picked-color,transparent);border-radius:var(\n--mod-swatch-border-radius,var(--spectrum-swatch-border-radius)\n);box-shadow:inset 0 0 0 var(\n--mod-swatch-border-thickness,var(--spectrum-swatch-border-thickness)\n) var(\n--highcontrast-swatch-border-color,var(--mod-swatch-border-color,var(--spectrum-swatch-border-color))\n);content:\"\";inset:0;position:absolute;z-index:0}:host([border=none]) .fill:before{background-color:var(--spectrum-picked-color,transparent);box-shadow:none}.mixedValueIcon{color:var(\n--spectrum-picked-color,transparent\n)}.disabledIcon,.mixedValueIcon{pointer-events:none;visibility:hidden}.disabledIcon{stroke:var(\n--highcontrast-swatch-disabled-icon-color,var(\n--mod-swatch-disabled-icon-color,var(--spectrum-swatch-disabled-icon-color)\n)\n);color:var(\n--highcontrast-swatch-disabled-icon-color,var(\n--mod-swatch-disabled-icon-color,var(--spectrum-swatch-disabled-icon-color)\n)\n);position:relative;z-index:2}.disabledIcon path:first-child{fill:var(\n--highcontrast-swatch-disabled-icon-color,var(\n--mod-swatch-disabled-icon-color,var(--spectrum-swatch-disabled-icon-color)\n)\n)}.disabledIcon path:last-child{fill:var(\n--mod-swatch-icon-border-color,var(--spectrum-swatch-icon-border-color)\n)}:host([shape=rectangle]){width:calc(var(--mod-swatch-size, var(--spectrum-swatch-size))*2)}:host([rounding=none]),:host([rounding=none]) .fill,:host([rounding=none]) .fill:before,:host([rounding=none]):after,:host([rounding=none]):before,:host([rounding=none][selected]) .fill,:host([rounding=none][selected]) .fill:before{border-radius:0}:host([rounding=full]:not([shape=rectangle])),:host([rounding=full]:not([shape=rectangle])) .fill,:host([rounding=full]:not([shape=rectangle])) .fill:before,:host([rounding=full]:not([shape=rectangle])):after,:host([rounding=full]:not([shape=rectangle])):before,:host([rounding=full][selected]:not([shape=rectangle])) .fill,:host([rounding=full][selected]:not([shape=rectangle])) .fill:before{border-radius:100%}:host([rounding=full][selected]:not([shape=rectangle])) .fill{clip-path:circle(calc(50% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) at 50% 50%)}::slotted([slot=image]){height:100%;object-fit:contain;transition:width var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-in-out,height var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-in-out;width:100%}\n`;\nexport default styles;"],
-  "mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAgJf,eAAeC",
+  "sourcesContent": ["/*\nCopyright 2022 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host{--spectrum-swatch-focus-indicator-border-radius:8px;--spectrum-swatch-icon-border-color:rgba(0,0,0,.51);--spectrum-swatch-size:var(--spectrum-swatch-size-small);--spectrum-swatch-border-radius:var(--spectrum-corner-radius-100);--spectrum-swatch-border-thickness:var(--spectrum-border-width-100);--spectrum-swatch-border-thickness-selected:var(\n--spectrum-border-width-200\n);--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-75);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-small\n);--spectrum-swatch-focus-indicator-thickness:var(\n--spectrum-focus-indicator-thickness\n);--spectrum-swatch-focus-indicator-gap:var(--spectrum-focus-indicator-gap);--spectrum-swatch-border-color-selected:var(--spectrum-gray-900);--spectrum-swatch-inner-border-color-selected:var(--spectrum-gray-50);--spectrum-swatch-disabled-icon-border-color:var(\n--spectrum-swatch-disabled-icon-border-color\n);--spectrum-swatch-disabled-icon-color:var(--spectrum-white);--spectrum-swatch-dash-icon-color:var(--spectrum-gray-800);--spectrum-swatch-slash-icon-color:var(--spectrum-red-900);--spectrum-swatch-focus-indicator-color:var(\n--spectrum-focus-indicator-color\n)}:host([size=xs]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-extra-small\n);--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-50);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-extra-small\n)}:host([size=s]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-small\n);--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-75);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-small\n)}:host([size=m]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-medium\n);--spectrum-swatch-disabled-icon-size:var(\n--spectrum-workflow-icon-size-100\n);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-medium\n)}:host([size=l]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-large\n);--spectrum-swatch-disabled-icon-size:var(\n--spectrum-workflow-icon-size-200\n);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-large\n)}@media (forced-colors:active){:host{--highcontrast-swatch-disabled-icon-color:GrayText;--highcontrast-swatch-focus-indicator-color:ButtonText;--highcontrast-swatch-background-color-selected:Background;--highcontrast-swatch-border-color-selected:Highlight;--highcontrast-swatch-border-color:ButtonText;--highcontrast-swatch-fill-foreground-color:ButtonText}.fill{forced-color-adjust:none}:host([disabled]) .fill{forced-color-adjust:auto}}:host{align-items:center;display:flex;height:var(--mod-swatch-size,var(--spectrum-swatch-size));justify-content:center;outline:none;position:relative;-webkit-user-select:none;user-select:none;width:var(\n--mod-swatch-size,var(--spectrum-swatch-size)\n)}.disabledIcon{height:var(\n--mod-swatch-disabled-icon-size,var(--spectrum-swatch-disabled-icon-size)\n);width:var(\n--mod-swatch-disabled-icon-size,var(--spectrum-swatch-disabled-icon-size)\n)}:host,:host:before{border-radius:var(\n--mod-swatch-border-radius,var(--spectrum-swatch-border-radius)\n)}:host([selected]){background-color:var(\n--highcontrast-swatch-background-color-selected,var(\n--mod-swatch-inner-border-color-selected,var(--spectrum-swatch-inner-border-color-selected)\n)\n)}:host([selected]) .fill{border-radius:0;clip-path:polygon(calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2),calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2),calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2),calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2))}:host([selected]) .fill:before{border-radius:0;box-shadow:none}:host([selected]):before{opacity:1}:host(.is-image) .fill:before{background-color:transparent}:host([mixed-value]) .fill{background:var(\n--spectrum-picked-color,transparent\n)}:host([mixed-value]) .mixedValueIcon{color:var(\n--spectrum-swatch-dash-icon-color\n);visibility:visible}:host([nothing]) .fill{background-color:var(\n--spectrum-picked-color,transparent\n);background-image:none}:host([nothing]) .fill:after{background:var(\n--highcontrast-swatch-fill-foreground-color,var(\n--mod-swatch-slash-icon-color,var(--spectrum-swatch-slash-icon-color)\n)\n);content:\"\";height:var(\n--mod-swatch-slash-thickness,var(--spectrum-swatch-slash-thickness)\n);position:absolute;transform:rotate(-45deg);width:200%}:host([nothing][shape=rectangle]) .fill:after{transform:rotate(-25deg)}:host([disabled]) .disabledIcon,:host([disabled]) .disabledIcon{visibility:visible}:host:before{border-color:var(\n--highcontrast-swatch-border-color-selected,var(\n--mod-swatch-border-color-selected,var(--spectrum-swatch-border-color-selected)\n)\n);border-style:solid;border-width:var(\n--mod-swatch-border-thickness-selected,var(--spectrum-swatch-border-thickness-selected)\n);content:\"\";inset:0;opacity:0;pointer-events:none;position:absolute}:host:after{border-color:var(\n--highcontrast-swatch-focus-indicator-color,var(\n--mod-swatch-focus-indicator-color,var(--spectrum-swatch-focus-indicator-color)\n)\n);border-radius:var(\n--mod-swatch-focus-indicator-border-radius,var(--spectrum-swatch-focus-indicator-border-radius)\n);border-style:solid;border-width:var(\n--mod-swatch-focus-indicator-thickness,var(--spectrum-swatch-focus-indicator-thickness)\n);content:\"\";inset:calc(var(\n--mod-swatch-focus-indicator-gap,\nvar(--spectrum-swatch-focus-indicator-gap)\n)*-2);opacity:0;position:absolute;transition:opacity var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-in-out}:host(.focus-visible):after{opacity:1}:host(:focus-visible):after{opacity:1}.fill{--spectrum-swatch-checkerboard-size:8px;--spectrum-swatch-checkerboard-background-offset:0px;--spectrum-swatch-checkerboard-dark-color:#d9d9d9;--spectrum-swatch-checkerboard-light-color:#fff;align-items:center;background-color:var(--spectrum-swatch-checkerboard-light-color);background-image:linear-gradient(-45deg,transparent 75.5%,var(--spectrum-swatch-checkerboard-dark-color) 75.5%),linear-gradient(45deg,transparent 75.5%,var(--spectrum-swatch-checkerboard-dark-color) 75.5%),linear-gradient(-45deg,var(--spectrum-swatch-checkerboard-dark-color) 25.5%,transparent 25.5%),linear-gradient(45deg,var(--spectrum-swatch-checkerboard-dark-color) 25.5%,transparent 25.5%);background-position:var(--spectrum-swatch-checkerboard-background-offset) var(--spectrum-swatch-checkerboard-background-offset),var(--spectrum-swatch-checkerboard-background-offset) calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n) + var(--spectrum-swatch-checkerboard-background-offset)),calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n) + var(--spectrum-swatch-checkerboard-background-offset)) calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*-1 + var(--spectrum-swatch-checkerboard-background-offset)),calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*-1 + var(--spectrum-swatch-checkerboard-background-offset)) var(--spectrum-swatch-checkerboard-background-offset);background-size:calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*2) calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*2);border-radius:var(\n--mod-swatch-border-radius,var(--spectrum-swatch-border-radius)\n);box-sizing:border-box;display:flex;height:100%;justify-content:center;overflow:hidden;position:relative;width:100%}.fill:before{background-color:var(--spectrum-picked-color,transparent);border-radius:var(\n--mod-swatch-border-radius,var(--spectrum-swatch-border-radius)\n);box-shadow:inset 0 0 0 var(\n--mod-swatch-border-thickness,var(--spectrum-swatch-border-thickness)\n) var(\n--highcontrast-swatch-border-color,var(--mod-swatch-border-color,var(--spectrum-swatch-border-color))\n);content:\"\";inset:0;position:absolute;z-index:0}:host([border=none]) .fill:before{background-color:var(--spectrum-picked-color,transparent);box-shadow:none}.mixedValueIcon{color:var(\n--spectrum-picked-color,transparent\n)}.disabledIcon,.mixedValueIcon{pointer-events:none;visibility:hidden}.disabledIcon{stroke:var(\n--highcontrast-swatch-disabled-icon-color,var(\n--mod-swatch-disabled-icon-color,var(--spectrum-swatch-disabled-icon-color)\n)\n);color:var(\n--highcontrast-swatch-disabled-icon-color,var(\n--mod-swatch-disabled-icon-color,var(--spectrum-swatch-disabled-icon-color)\n)\n);position:relative;z-index:2}.disabledIcon path:first-child{fill:var(\n--highcontrast-swatch-disabled-icon-color,var(\n--mod-swatch-disabled-icon-color,var(--spectrum-swatch-disabled-icon-color)\n)\n)}.disabledIcon path:last-child{fill:var(\n--mod-swatch-icon-border-color,var(--spectrum-swatch-icon-border-color)\n)}:host([shape=rectangle]){width:calc(var(--mod-swatch-size, var(--spectrum-swatch-size))*2)}:host([rounding=none]),:host([rounding=none]) .fill,:host([rounding=none]) .fill:before,:host([rounding=none]):after,:host([rounding=none]):before,:host([rounding=none][selected]) .fill,:host([rounding=none][selected]) .fill:before{border-radius:0}:host([rounding=full]:not([shape=rectangle])),:host([rounding=full]:not([shape=rectangle])) .fill,:host([rounding=full]:not([shape=rectangle])) .fill:before,:host([rounding=full]:not([shape=rectangle])):after,:host([rounding=full]:not([shape=rectangle])):before,:host([rounding=full][selected]:not([shape=rectangle])) .fill,:host([rounding=full][selected]:not([shape=rectangle])) .fill:before{border-radius:100%}:host([rounding=full][selected]:not([shape=rectangle])) .fill{clip-path:circle(calc(50% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) at 50% 50%)}::slotted([slot=image]){height:100%;object-fit:contain;transition:width var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-in-out,height var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-in-out;width:100%}\n`;\nexport default styles;"],
+  "mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAqJf,eAAeC",
   "names": ["css", "styles"]
 }

package/src/swatch.css.dev.js CHANGED Viewed

@@ -1,15 +1,17 @@
 "use strict";
 import { css } from "@spectrum-web-components/base";
 const styles = css`
-:host{--spectrum-swatch-focus-ring-border-radius:8px;--spectrum-swatch-icon-border-color:rgba(0,0,0,.51);--spectrum-swatch-size:var(--spectrum-swatch-size-small);--spectrum-swatch-border-radius:var(--spectrum-corner-radius-100);--spectrum-swatch-border-thickness:var(--spectrum-border-width-100);--spectrum-swatch-border-thickness-selected:var(
+:host{--spectrum-swatch-focus-indicator-border-radius:8px;--spectrum-swatch-icon-border-color:rgba(0,0,0,.51);--spectrum-swatch-size:var(--spectrum-swatch-size-small);--spectrum-swatch-border-radius:var(--spectrum-corner-radius-100);--spectrum-swatch-border-thickness:var(--spectrum-border-width-100);--spectrum-swatch-border-thickness-selected:var(
 --spectrum-border-width-200
 );--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-75);--spectrum-swatch-slash-thickness:var(
 --spectrum-swatch-slash-thickness-small
-);--spectrum-swatch-focus-ring-thickness:var(
---spectrum-focus-ring-thickness
-);--spectrum-swatch-focus-ring-gap:var(--spectrum-focus-ring-gap);--spectrum-swatch-border-color-selected:var(--spectrum-gray-900);--spectrum-swatch-inner-border-color-selected:var(--spectrum-gray-50);--spectrum-swatch-disabled-icon-border-color:var(
+);--spectrum-swatch-focus-indicator-thickness:var(
+--spectrum-focus-indicator-thickness
+);--spectrum-swatch-focus-indicator-gap:var(--spectrum-focus-indicator-gap);--spectrum-swatch-border-color-selected:var(--spectrum-gray-900);--spectrum-swatch-inner-border-color-selected:var(--spectrum-gray-50);--spectrum-swatch-disabled-icon-border-color:var(
 --spectrum-swatch-disabled-icon-border-color
-);--spectrum-swatch-disabled-icon-color:var(--spectrum-white);--spectrum-swatch-dash-icon-color:var(--spectrum-gray-800);--spectrum-swatch-slash-icon-color:var(--spectrum-red-900);--spectrum-swatch-focus-ring-color:var(--spectrum-focus-ring-color)}:host([size=xs]){--spectrum-swatch-size:var(
+);--spectrum-swatch-disabled-icon-color:var(--spectrum-white);--spectrum-swatch-dash-icon-color:var(--spectrum-gray-800);--spectrum-swatch-slash-icon-color:var(--spectrum-red-900);--spectrum-swatch-focus-indicator-color:var(
+--spectrum-focus-indicator-color
+)}:host([size=xs]){--spectrum-swatch-size:var(
 --spectrum-swatch-size-extra-small
 );--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-50);--spectrum-swatch-slash-thickness:var(
 --spectrum-swatch-slash-thickness-extra-small
@@ -29,7 +31,7 @@ const styles = css`
 --spectrum-workflow-icon-size-200
 );--spectrum-swatch-slash-thickness:var(
 --spectrum-swatch-slash-thickness-large
-)}@media (forced-colors:active){:host{--highcontrast-swatch-disabled-icon-color:GrayText;--highcontrast-swatch-focus-ring-color:ButtonText;--highcontrast-swatch-background-color-selected:Background;--highcontrast-swatch-border-color-selected:Highlight;--highcontrast-swatch-border-color:ButtonText;--highcontrast-swatch-fill-foreground-color:ButtonText}.fill{forced-color-adjust:none}:host([disabled]) .fill{forced-color-adjust:auto}}:host{align-items:center;display:flex;height:var(--mod-swatch-size,var(--spectrum-swatch-size));justify-content:center;outline:none;position:relative;-webkit-user-select:none;user-select:none;width:var(
+)}@media (forced-colors:active){:host{--highcontrast-swatch-disabled-icon-color:GrayText;--highcontrast-swatch-focus-indicator-color:ButtonText;--highcontrast-swatch-background-color-selected:Background;--highcontrast-swatch-border-color-selected:Highlight;--highcontrast-swatch-border-color:ButtonText;--highcontrast-swatch-fill-foreground-color:ButtonText}.fill{forced-color-adjust:none}:host([disabled]) .fill{forced-color-adjust:auto}}:host{align-items:center;display:flex;height:var(--mod-swatch-size,var(--spectrum-swatch-size));justify-content:center;outline:none;position:relative;-webkit-user-select:none;user-select:none;width:var(
 --mod-swatch-size,var(--spectrum-swatch-size)
 )}.disabledIcon{height:var(
 --mod-swatch-disabled-icon-size,var(--spectrum-swatch-disabled-icon-size)
@@ -84,14 +86,17 @@ var(--spectrum-swatch-border-thickness-selected)
 );border-style:solid;border-width:var(
 --mod-swatch-border-thickness-selected,var(--spectrum-swatch-border-thickness-selected)
 );content:"";inset:0;opacity:0;pointer-events:none;position:absolute}:host:after{border-color:var(
---highcontrast-swatch-focus-ring-color,var(
---mod-swatch-focus-ring-color,var(--spectrum-swatch-focus-ring-color)
+--highcontrast-swatch-focus-indicator-color,var(
+--mod-swatch-focus-indicator-color,var(--spectrum-swatch-focus-indicator-color)
 )
 );border-radius:var(
---mod-swatch-focus-ring-border-radius,var(--spectrum-swatch-focus-ring-border-radius)
+--mod-swatch-focus-indicator-border-radius,var(--spectrum-swatch-focus-indicator-border-radius)
 );border-style:solid;border-width:var(
---mod-swatch-focus-ring-thickness,var(--spectrum-swatch-focus-ring-thickness)
-);content:"";inset:calc(var(--mod-swatch-focus-ring-gap, var(--spectrum-swatch-focus-ring-gap))*-2);opacity:0;position:absolute;transition:opacity var(
+--mod-swatch-focus-indicator-thickness,var(--spectrum-swatch-focus-indicator-thickness)
+);content:"";inset:calc(var(
+--mod-swatch-focus-indicator-gap,
+var(--spectrum-swatch-focus-indicator-gap)
+)*-2);opacity:0;position:absolute;transition:opacity var(
 --mod-animation-duration-100,var(--spectrum-animation-duration-100)
 ) ease-in-out}:host(.focus-visible):after{opacity:1}:host(:focus-visible):after{opacity:1}.fill{--spectrum-swatch-checkerboard-size:8px;--spectrum-swatch-checkerboard-background-offset:0px;--spectrum-swatch-checkerboard-dark-color:#d9d9d9;--spectrum-swatch-checkerboard-light-color:#fff;align-items:center;background-color:var(--spectrum-swatch-checkerboard-light-color);background-image:linear-gradient(-45deg,transparent 75.5%,var(--spectrum-swatch-checkerboard-dark-color) 75.5%),linear-gradient(45deg,transparent 75.5%,var(--spectrum-swatch-checkerboard-dark-color) 75.5%),linear-gradient(-45deg,var(--spectrum-swatch-checkerboard-dark-color) 25.5%,transparent 25.5%),linear-gradient(45deg,var(--spectrum-swatch-checkerboard-dark-color) 25.5%,transparent 25.5%);background-position:var(--spectrum-swatch-checkerboard-background-offset) var(--spectrum-swatch-checkerboard-background-offset),var(--spectrum-swatch-checkerboard-background-offset) calc(var(
 --mod-swatch-checkerboard-size,

package/src/swatch.css.dev.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["swatch.css.ts"],
-  "sourcesContent": ["/*\nCopyright 2022 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host{--spectrum-swatch-focus-ring-border-radius:8px;--spectrum-swatch-icon-border-color:rgba(0,0,0,.51);--spectrum-swatch-size:var(--spectrum-swatch-size-small);--spectrum-swatch-border-radius:var(--spectrum-corner-radius-100);--spectrum-swatch-border-thickness:var(--spectrum-border-width-100);--spectrum-swatch-border-thickness-selected:var(\n--spectrum-border-width-200\n);--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-75);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-small\n);--spectrum-swatch-focus-ring-thickness:var(\n--spectrum-focus-ring-thickness\n);--spectrum-swatch-focus-ring-gap:var(--spectrum-focus-ring-gap);--spectrum-swatch-border-color-selected:var(--spectrum-gray-900);--spectrum-swatch-inner-border-color-selected:var(--spectrum-gray-50);--spectrum-swatch-disabled-icon-border-color:var(\n--spectrum-swatch-disabled-icon-border-color\n);--spectrum-swatch-disabled-icon-color:var(--spectrum-white);--spectrum-swatch-dash-icon-color:var(--spectrum-gray-800);--spectrum-swatch-slash-icon-color:var(--spectrum-red-900);--spectrum-swatch-focus-ring-color:var(--spectrum-focus-ring-color)}:host([size=xs]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-extra-small\n);--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-50);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-extra-small\n)}:host([size=s]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-small\n);--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-75);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-small\n)}:host([size=m]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-medium\n);--spectrum-swatch-disabled-icon-size:var(\n--spectrum-workflow-icon-size-100\n);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-medium\n)}:host([size=l]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-large\n);--spectrum-swatch-disabled-icon-size:var(\n--spectrum-workflow-icon-size-200\n);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-large\n)}@media (forced-colors:active){:host{--highcontrast-swatch-disabled-icon-color:GrayText;--highcontrast-swatch-focus-ring-color:ButtonText;--highcontrast-swatch-background-color-selected:Background;--highcontrast-swatch-border-color-selected:Highlight;--highcontrast-swatch-border-color:ButtonText;--highcontrast-swatch-fill-foreground-color:ButtonText}.fill{forced-color-adjust:none}:host([disabled]) .fill{forced-color-adjust:auto}}:host{align-items:center;display:flex;height:var(--mod-swatch-size,var(--spectrum-swatch-size));justify-content:center;outline:none;position:relative;-webkit-user-select:none;user-select:none;width:var(\n--mod-swatch-size,var(--spectrum-swatch-size)\n)}.disabledIcon{height:var(\n--mod-swatch-disabled-icon-size,var(--spectrum-swatch-disabled-icon-size)\n);width:var(\n--mod-swatch-disabled-icon-size,var(--spectrum-swatch-disabled-icon-size)\n)}:host,:host:before{border-radius:var(\n--mod-swatch-border-radius,var(--spectrum-swatch-border-radius)\n)}:host([selected]){background-color:var(\n--highcontrast-swatch-background-color-selected,var(\n--mod-swatch-inner-border-color-selected,var(--spectrum-swatch-inner-border-color-selected)\n)\n)}:host([selected]) .fill{border-radius:0;clip-path:polygon(calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2),calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2),calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2),calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2))}:host([selected]) .fill:before{border-radius:0;box-shadow:none}:host([selected]):before{opacity:1}:host(.is-image) .fill:before{background-color:transparent}:host([mixed-value]) .fill{background:var(\n--spectrum-picked-color,transparent\n)}:host([mixed-value]) .mixedValueIcon{color:var(\n--spectrum-swatch-dash-icon-color\n);visibility:visible}:host([nothing]) .fill{background-color:var(\n--spectrum-picked-color,transparent\n);background-image:none}:host([nothing]) .fill:after{background:var(\n--highcontrast-swatch-fill-foreground-color,var(\n--mod-swatch-slash-icon-color,var(--spectrum-swatch-slash-icon-color)\n)\n);content:\"\";height:var(\n--mod-swatch-slash-thickness,var(--spectrum-swatch-slash-thickness)\n);position:absolute;transform:rotate(-45deg);width:200%}:host([nothing][shape=rectangle]) .fill:after{transform:rotate(-25deg)}:host([disabled]) .disabledIcon,:host([disabled]) .disabledIcon{visibility:visible}:host:before{border-color:var(\n--highcontrast-swatch-border-color-selected,var(\n--mod-swatch-border-color-selected,var(--spectrum-swatch-border-color-selected)\n)\n);border-style:solid;border-width:var(\n--mod-swatch-border-thickness-selected,var(--spectrum-swatch-border-thickness-selected)\n);content:\"\";inset:0;opacity:0;pointer-events:none;position:absolute}:host:after{border-color:var(\n--highcontrast-swatch-focus-ring-color,var(\n--mod-swatch-focus-ring-color,var(--spectrum-swatch-focus-ring-color)\n)\n);border-radius:var(\n--mod-swatch-focus-ring-border-radius,var(--spectrum-swatch-focus-ring-border-radius)\n);border-style:solid;border-width:var(\n--mod-swatch-focus-ring-thickness,var(--spectrum-swatch-focus-ring-thickness)\n);content:\"\";inset:calc(var(--mod-swatch-focus-ring-gap, var(--spectrum-swatch-focus-ring-gap))*-2);opacity:0;position:absolute;transition:opacity var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-in-out}:host(.focus-visible):after{opacity:1}:host(:focus-visible):after{opacity:1}.fill{--spectrum-swatch-checkerboard-size:8px;--spectrum-swatch-checkerboard-background-offset:0px;--spectrum-swatch-checkerboard-dark-color:#d9d9d9;--spectrum-swatch-checkerboard-light-color:#fff;align-items:center;background-color:var(--spectrum-swatch-checkerboard-light-color);background-image:linear-gradient(-45deg,transparent 75.5%,var(--spectrum-swatch-checkerboard-dark-color) 75.5%),linear-gradient(45deg,transparent 75.5%,var(--spectrum-swatch-checkerboard-dark-color) 75.5%),linear-gradient(-45deg,var(--spectrum-swatch-checkerboard-dark-color) 25.5%,transparent 25.5%),linear-gradient(45deg,var(--spectrum-swatch-checkerboard-dark-color) 25.5%,transparent 25.5%);background-position:var(--spectrum-swatch-checkerboard-background-offset) var(--spectrum-swatch-checkerboard-background-offset),var(--spectrum-swatch-checkerboard-background-offset) calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n) + var(--spectrum-swatch-checkerboard-background-offset)),calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n) + var(--spectrum-swatch-checkerboard-background-offset)) calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*-1 + var(--spectrum-swatch-checkerboard-background-offset)),calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*-1 + var(--spectrum-swatch-checkerboard-background-offset)) var(--spectrum-swatch-checkerboard-background-offset);background-size:calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*2) calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*2);border-radius:var(\n--mod-swatch-border-radius,var(--spectrum-swatch-border-radius)\n);box-sizing:border-box;display:flex;height:100%;justify-content:center;overflow:hidden;position:relative;width:100%}.fill:before{background-color:var(--spectrum-picked-color,transparent);border-radius:var(\n--mod-swatch-border-radius,var(--spectrum-swatch-border-radius)\n);box-shadow:inset 0 0 0 var(\n--mod-swatch-border-thickness,var(--spectrum-swatch-border-thickness)\n) var(\n--highcontrast-swatch-border-color,var(--mod-swatch-border-color,var(--spectrum-swatch-border-color))\n);content:\"\";inset:0;position:absolute;z-index:0}:host([border=none]) .fill:before{background-color:var(--spectrum-picked-color,transparent);box-shadow:none}.mixedValueIcon{color:var(\n--spectrum-picked-color,transparent\n)}.disabledIcon,.mixedValueIcon{pointer-events:none;visibility:hidden}.disabledIcon{stroke:var(\n--highcontrast-swatch-disabled-icon-color,var(\n--mod-swatch-disabled-icon-color,var(--spectrum-swatch-disabled-icon-color)\n)\n);color:var(\n--highcontrast-swatch-disabled-icon-color,var(\n--mod-swatch-disabled-icon-color,var(--spectrum-swatch-disabled-icon-color)\n)\n);position:relative;z-index:2}.disabledIcon path:first-child{fill:var(\n--highcontrast-swatch-disabled-icon-color,var(\n--mod-swatch-disabled-icon-color,var(--spectrum-swatch-disabled-icon-color)\n)\n)}.disabledIcon path:last-child{fill:var(\n--mod-swatch-icon-border-color,var(--spectrum-swatch-icon-border-color)\n)}:host([shape=rectangle]){width:calc(var(--mod-swatch-size, var(--spectrum-swatch-size))*2)}:host([rounding=none]),:host([rounding=none]) .fill,:host([rounding=none]) .fill:before,:host([rounding=none]):after,:host([rounding=none]):before,:host([rounding=none][selected]) .fill,:host([rounding=none][selected]) .fill:before{border-radius:0}:host([rounding=full]:not([shape=rectangle])),:host([rounding=full]:not([shape=rectangle])) .fill,:host([rounding=full]:not([shape=rectangle])) .fill:before,:host([rounding=full]:not([shape=rectangle])):after,:host([rounding=full]:not([shape=rectangle])):before,:host([rounding=full][selected]:not([shape=rectangle])) .fill,:host([rounding=full][selected]:not([shape=rectangle])) .fill:before{border-radius:100%}:host([rounding=full][selected]:not([shape=rectangle])) .fill{clip-path:circle(calc(50% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) at 50% 50%)}::slotted([slot=image]){height:100%;object-fit:contain;transition:width var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-in-out,height var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-in-out;width:100%}\n`;\nexport default styles;"],
-  "mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAgJf,eAAe;",
+  "sourcesContent": ["/*\nCopyright 2022 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host{--spectrum-swatch-focus-indicator-border-radius:8px;--spectrum-swatch-icon-border-color:rgba(0,0,0,.51);--spectrum-swatch-size:var(--spectrum-swatch-size-small);--spectrum-swatch-border-radius:var(--spectrum-corner-radius-100);--spectrum-swatch-border-thickness:var(--spectrum-border-width-100);--spectrum-swatch-border-thickness-selected:var(\n--spectrum-border-width-200\n);--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-75);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-small\n);--spectrum-swatch-focus-indicator-thickness:var(\n--spectrum-focus-indicator-thickness\n);--spectrum-swatch-focus-indicator-gap:var(--spectrum-focus-indicator-gap);--spectrum-swatch-border-color-selected:var(--spectrum-gray-900);--spectrum-swatch-inner-border-color-selected:var(--spectrum-gray-50);--spectrum-swatch-disabled-icon-border-color:var(\n--spectrum-swatch-disabled-icon-border-color\n);--spectrum-swatch-disabled-icon-color:var(--spectrum-white);--spectrum-swatch-dash-icon-color:var(--spectrum-gray-800);--spectrum-swatch-slash-icon-color:var(--spectrum-red-900);--spectrum-swatch-focus-indicator-color:var(\n--spectrum-focus-indicator-color\n)}:host([size=xs]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-extra-small\n);--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-50);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-extra-small\n)}:host([size=s]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-small\n);--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-75);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-small\n)}:host([size=m]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-medium\n);--spectrum-swatch-disabled-icon-size:var(\n--spectrum-workflow-icon-size-100\n);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-medium\n)}:host([size=l]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-large\n);--spectrum-swatch-disabled-icon-size:var(\n--spectrum-workflow-icon-size-200\n);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-large\n)}@media (forced-colors:active){:host{--highcontrast-swatch-disabled-icon-color:GrayText;--highcontrast-swatch-focus-indicator-color:ButtonText;--highcontrast-swatch-background-color-selected:Background;--highcontrast-swatch-border-color-selected:Highlight;--highcontrast-swatch-border-color:ButtonText;--highcontrast-swatch-fill-foreground-color:ButtonText}.fill{forced-color-adjust:none}:host([disabled]) .fill{forced-color-adjust:auto}}:host{align-items:center;display:flex;height:var(--mod-swatch-size,var(--spectrum-swatch-size));justify-content:center;outline:none;position:relative;-webkit-user-select:none;user-select:none;width:var(\n--mod-swatch-size,var(--spectrum-swatch-size)\n)}.disabledIcon{height:var(\n--mod-swatch-disabled-icon-size,var(--spectrum-swatch-disabled-icon-size)\n);width:var(\n--mod-swatch-disabled-icon-size,var(--spectrum-swatch-disabled-icon-size)\n)}:host,:host:before{border-radius:var(\n--mod-swatch-border-radius,var(--spectrum-swatch-border-radius)\n)}:host([selected]){background-color:var(\n--highcontrast-swatch-background-color-selected,var(\n--mod-swatch-inner-border-color-selected,var(--spectrum-swatch-inner-border-color-selected)\n)\n)}:host([selected]) .fill{border-radius:0;clip-path:polygon(calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2),calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2),calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2),calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2))}:host([selected]) .fill:before{border-radius:0;box-shadow:none}:host([selected]):before{opacity:1}:host(.is-image) .fill:before{background-color:transparent}:host([mixed-value]) .fill{background:var(\n--spectrum-picked-color,transparent\n)}:host([mixed-value]) .mixedValueIcon{color:var(\n--spectrum-swatch-dash-icon-color\n);visibility:visible}:host([nothing]) .fill{background-color:var(\n--spectrum-picked-color,transparent\n);background-image:none}:host([nothing]) .fill:after{background:var(\n--highcontrast-swatch-fill-foreground-color,var(\n--mod-swatch-slash-icon-color,var(--spectrum-swatch-slash-icon-color)\n)\n);content:\"\";height:var(\n--mod-swatch-slash-thickness,var(--spectrum-swatch-slash-thickness)\n);position:absolute;transform:rotate(-45deg);width:200%}:host([nothing][shape=rectangle]) .fill:after{transform:rotate(-25deg)}:host([disabled]) .disabledIcon,:host([disabled]) .disabledIcon{visibility:visible}:host:before{border-color:var(\n--highcontrast-swatch-border-color-selected,var(\n--mod-swatch-border-color-selected,var(--spectrum-swatch-border-color-selected)\n)\n);border-style:solid;border-width:var(\n--mod-swatch-border-thickness-selected,var(--spectrum-swatch-border-thickness-selected)\n);content:\"\";inset:0;opacity:0;pointer-events:none;position:absolute}:host:after{border-color:var(\n--highcontrast-swatch-focus-indicator-color,var(\n--mod-swatch-focus-indicator-color,var(--spectrum-swatch-focus-indicator-color)\n)\n);border-radius:var(\n--mod-swatch-focus-indicator-border-radius,var(--spectrum-swatch-focus-indicator-border-radius)\n);border-style:solid;border-width:var(\n--mod-swatch-focus-indicator-thickness,var(--spectrum-swatch-focus-indicator-thickness)\n);content:\"\";inset:calc(var(\n--mod-swatch-focus-indicator-gap,\nvar(--spectrum-swatch-focus-indicator-gap)\n)*-2);opacity:0;position:absolute;transition:opacity var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-in-out}:host(.focus-visible):after{opacity:1}:host(:focus-visible):after{opacity:1}.fill{--spectrum-swatch-checkerboard-size:8px;--spectrum-swatch-checkerboard-background-offset:0px;--spectrum-swatch-checkerboard-dark-color:#d9d9d9;--spectrum-swatch-checkerboard-light-color:#fff;align-items:center;background-color:var(--spectrum-swatch-checkerboard-light-color);background-image:linear-gradient(-45deg,transparent 75.5%,var(--spectrum-swatch-checkerboard-dark-color) 75.5%),linear-gradient(45deg,transparent 75.5%,var(--spectrum-swatch-checkerboard-dark-color) 75.5%),linear-gradient(-45deg,var(--spectrum-swatch-checkerboard-dark-color) 25.5%,transparent 25.5%),linear-gradient(45deg,var(--spectrum-swatch-checkerboard-dark-color) 25.5%,transparent 25.5%);background-position:var(--spectrum-swatch-checkerboard-background-offset) var(--spectrum-swatch-checkerboard-background-offset),var(--spectrum-swatch-checkerboard-background-offset) calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n) + var(--spectrum-swatch-checkerboard-background-offset)),calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n) + var(--spectrum-swatch-checkerboard-background-offset)) calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*-1 + var(--spectrum-swatch-checkerboard-background-offset)),calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*-1 + var(--spectrum-swatch-checkerboard-background-offset)) var(--spectrum-swatch-checkerboard-background-offset);background-size:calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*2) calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*2);border-radius:var(\n--mod-swatch-border-radius,var(--spectrum-swatch-border-radius)\n);box-sizing:border-box;display:flex;height:100%;justify-content:center;overflow:hidden;position:relative;width:100%}.fill:before{background-color:var(--spectrum-picked-color,transparent);border-radius:var(\n--mod-swatch-border-radius,var(--spectrum-swatch-border-radius)\n);box-shadow:inset 0 0 0 var(\n--mod-swatch-border-thickness,var(--spectrum-swatch-border-thickness)\n) var(\n--highcontrast-swatch-border-color,var(--mod-swatch-border-color,var(--spectrum-swatch-border-color))\n);content:\"\";inset:0;position:absolute;z-index:0}:host([border=none]) .fill:before{background-color:var(--spectrum-picked-color,transparent);box-shadow:none}.mixedValueIcon{color:var(\n--spectrum-picked-color,transparent\n)}.disabledIcon,.mixedValueIcon{pointer-events:none;visibility:hidden}.disabledIcon{stroke:var(\n--highcontrast-swatch-disabled-icon-color,var(\n--mod-swatch-disabled-icon-color,var(--spectrum-swatch-disabled-icon-color)\n)\n);color:var(\n--highcontrast-swatch-disabled-icon-color,var(\n--mod-swatch-disabled-icon-color,var(--spectrum-swatch-disabled-icon-color)\n)\n);position:relative;z-index:2}.disabledIcon path:first-child{fill:var(\n--highcontrast-swatch-disabled-icon-color,var(\n--mod-swatch-disabled-icon-color,var(--spectrum-swatch-disabled-icon-color)\n)\n)}.disabledIcon path:last-child{fill:var(\n--mod-swatch-icon-border-color,var(--spectrum-swatch-icon-border-color)\n)}:host([shape=rectangle]){width:calc(var(--mod-swatch-size, var(--spectrum-swatch-size))*2)}:host([rounding=none]),:host([rounding=none]) .fill,:host([rounding=none]) .fill:before,:host([rounding=none]):after,:host([rounding=none]):before,:host([rounding=none][selected]) .fill,:host([rounding=none][selected]) .fill:before{border-radius:0}:host([rounding=full]:not([shape=rectangle])),:host([rounding=full]:not([shape=rectangle])) .fill,:host([rounding=full]:not([shape=rectangle])) .fill:before,:host([rounding=full]:not([shape=rectangle])):after,:host([rounding=full]:not([shape=rectangle])):before,:host([rounding=full][selected]:not([shape=rectangle])) .fill,:host([rounding=full][selected]:not([shape=rectangle])) .fill:before{border-radius:100%}:host([rounding=full][selected]:not([shape=rectangle])) .fill{clip-path:circle(calc(50% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) at 50% 50%)}::slotted([slot=image]){height:100%;object-fit:contain;transition:width var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-in-out,height var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-in-out;width:100%}\n`;\nexport default styles;"],
+  "mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAqJf,eAAe;",
   "names": []
 }

package/src/swatch.css.js CHANGED Viewed

@@ -1,13 +1,15 @@
 "use strict";import{css as r}from"@spectrum-web-components/base";const e=r`
-:host{--spectrum-swatch-focus-ring-border-radius:8px;--spectrum-swatch-icon-border-color:rgba(0,0,0,.51);--spectrum-swatch-size:var(--spectrum-swatch-size-small);--spectrum-swatch-border-radius:var(--spectrum-corner-radius-100);--spectrum-swatch-border-thickness:var(--spectrum-border-width-100);--spectrum-swatch-border-thickness-selected:var(
+:host{--spectrum-swatch-focus-indicator-border-radius:8px;--spectrum-swatch-icon-border-color:rgba(0,0,0,.51);--spectrum-swatch-size:var(--spectrum-swatch-size-small);--spectrum-swatch-border-radius:var(--spectrum-corner-radius-100);--spectrum-swatch-border-thickness:var(--spectrum-border-width-100);--spectrum-swatch-border-thickness-selected:var(
 --spectrum-border-width-200
 );--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-75);--spectrum-swatch-slash-thickness:var(
 --spectrum-swatch-slash-thickness-small
-);--spectrum-swatch-focus-ring-thickness:var(
---spectrum-focus-ring-thickness
-);--spectrum-swatch-focus-ring-gap:var(--spectrum-focus-ring-gap);--spectrum-swatch-border-color-selected:var(--spectrum-gray-900);--spectrum-swatch-inner-border-color-selected:var(--spectrum-gray-50);--spectrum-swatch-disabled-icon-border-color:var(
+);--spectrum-swatch-focus-indicator-thickness:var(
+--spectrum-focus-indicator-thickness
+);--spectrum-swatch-focus-indicator-gap:var(--spectrum-focus-indicator-gap);--spectrum-swatch-border-color-selected:var(--spectrum-gray-900);--spectrum-swatch-inner-border-color-selected:var(--spectrum-gray-50);--spectrum-swatch-disabled-icon-border-color:var(
 --spectrum-swatch-disabled-icon-border-color
-);--spectrum-swatch-disabled-icon-color:var(--spectrum-white);--spectrum-swatch-dash-icon-color:var(--spectrum-gray-800);--spectrum-swatch-slash-icon-color:var(--spectrum-red-900);--spectrum-swatch-focus-ring-color:var(--spectrum-focus-ring-color)}:host([size=xs]){--spectrum-swatch-size:var(
+);--spectrum-swatch-disabled-icon-color:var(--spectrum-white);--spectrum-swatch-dash-icon-color:var(--spectrum-gray-800);--spectrum-swatch-slash-icon-color:var(--spectrum-red-900);--spectrum-swatch-focus-indicator-color:var(
+--spectrum-focus-indicator-color
+)}:host([size=xs]){--spectrum-swatch-size:var(
 --spectrum-swatch-size-extra-small
 );--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-50);--spectrum-swatch-slash-thickness:var(
 --spectrum-swatch-slash-thickness-extra-small
@@ -27,7 +29,7 @@
 --spectrum-workflow-icon-size-200
 );--spectrum-swatch-slash-thickness:var(
 --spectrum-swatch-slash-thickness-large
-)}@media (forced-colors:active){:host{--highcontrast-swatch-disabled-icon-color:GrayText;--highcontrast-swatch-focus-ring-color:ButtonText;--highcontrast-swatch-background-color-selected:Background;--highcontrast-swatch-border-color-selected:Highlight;--highcontrast-swatch-border-color:ButtonText;--highcontrast-swatch-fill-foreground-color:ButtonText}.fill{forced-color-adjust:none}:host([disabled]) .fill{forced-color-adjust:auto}}:host{align-items:center;display:flex;height:var(--mod-swatch-size,var(--spectrum-swatch-size));justify-content:center;outline:none;position:relative;-webkit-user-select:none;user-select:none;width:var(
+)}@media (forced-colors:active){:host{--highcontrast-swatch-disabled-icon-color:GrayText;--highcontrast-swatch-focus-indicator-color:ButtonText;--highcontrast-swatch-background-color-selected:Background;--highcontrast-swatch-border-color-selected:Highlight;--highcontrast-swatch-border-color:ButtonText;--highcontrast-swatch-fill-foreground-color:ButtonText}.fill{forced-color-adjust:none}:host([disabled]) .fill{forced-color-adjust:auto}}:host{align-items:center;display:flex;height:var(--mod-swatch-size,var(--spectrum-swatch-size));justify-content:center;outline:none;position:relative;-webkit-user-select:none;user-select:none;width:var(
 --mod-swatch-size,var(--spectrum-swatch-size)
 )}.disabledIcon{height:var(
 --mod-swatch-disabled-icon-size,var(--spectrum-swatch-disabled-icon-size)
@@ -82,14 +84,17 @@ var(--spectrum-swatch-border-thickness-selected)
 );border-style:solid;border-width:var(
 --mod-swatch-border-thickness-selected,var(--spectrum-swatch-border-thickness-selected)
 );content:"";inset:0;opacity:0;pointer-events:none;position:absolute}:host:after{border-color:var(
---highcontrast-swatch-focus-ring-color,var(
---mod-swatch-focus-ring-color,var(--spectrum-swatch-focus-ring-color)
+--highcontrast-swatch-focus-indicator-color,var(
+--mod-swatch-focus-indicator-color,var(--spectrum-swatch-focus-indicator-color)
 )
 );border-radius:var(
---mod-swatch-focus-ring-border-radius,var(--spectrum-swatch-focus-ring-border-radius)
+--mod-swatch-focus-indicator-border-radius,var(--spectrum-swatch-focus-indicator-border-radius)
 );border-style:solid;border-width:var(
---mod-swatch-focus-ring-thickness,var(--spectrum-swatch-focus-ring-thickness)
-);content:"";inset:calc(var(--mod-swatch-focus-ring-gap, var(--spectrum-swatch-focus-ring-gap))*-2);opacity:0;position:absolute;transition:opacity var(
+--mod-swatch-focus-indicator-thickness,var(--spectrum-swatch-focus-indicator-thickness)
+);content:"";inset:calc(var(
+--mod-swatch-focus-indicator-gap,
+var(--spectrum-swatch-focus-indicator-gap)
+)*-2);opacity:0;position:absolute;transition:opacity var(
 --mod-animation-duration-100,var(--spectrum-animation-duration-100)
 ) ease-in-out}:host(.focus-visible):after{opacity:1}:host(:focus-visible):after{opacity:1}.fill{--spectrum-swatch-checkerboard-size:8px;--spectrum-swatch-checkerboard-background-offset:0px;--spectrum-swatch-checkerboard-dark-color:#d9d9d9;--spectrum-swatch-checkerboard-light-color:#fff;align-items:center;background-color:var(--spectrum-swatch-checkerboard-light-color);background-image:linear-gradient(-45deg,transparent 75.5%,var(--spectrum-swatch-checkerboard-dark-color) 75.5%),linear-gradient(45deg,transparent 75.5%,var(--spectrum-swatch-checkerboard-dark-color) 75.5%),linear-gradient(-45deg,var(--spectrum-swatch-checkerboard-dark-color) 25.5%,transparent 25.5%),linear-gradient(45deg,var(--spectrum-swatch-checkerboard-dark-color) 25.5%,transparent 25.5%);background-position:var(--spectrum-swatch-checkerboard-background-offset) var(--spectrum-swatch-checkerboard-background-offset),var(--spectrum-swatch-checkerboard-background-offset) calc(var(
 --mod-swatch-checkerboard-size,

package/src/swatch.css.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["swatch.css.ts"],
-  "sourcesContent": ["/*\nCopyright 2022 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host{--spectrum-swatch-focus-ring-border-radius:8px;--spectrum-swatch-icon-border-color:rgba(0,0,0,.51);--spectrum-swatch-size:var(--spectrum-swatch-size-small);--spectrum-swatch-border-radius:var(--spectrum-corner-radius-100);--spectrum-swatch-border-thickness:var(--spectrum-border-width-100);--spectrum-swatch-border-thickness-selected:var(\n--spectrum-border-width-200\n);--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-75);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-small\n);--spectrum-swatch-focus-ring-thickness:var(\n--spectrum-focus-ring-thickness\n);--spectrum-swatch-focus-ring-gap:var(--spectrum-focus-ring-gap);--spectrum-swatch-border-color-selected:var(--spectrum-gray-900);--spectrum-swatch-inner-border-color-selected:var(--spectrum-gray-50);--spectrum-swatch-disabled-icon-border-color:var(\n--spectrum-swatch-disabled-icon-border-color\n);--spectrum-swatch-disabled-icon-color:var(--spectrum-white);--spectrum-swatch-dash-icon-color:var(--spectrum-gray-800);--spectrum-swatch-slash-icon-color:var(--spectrum-red-900);--spectrum-swatch-focus-ring-color:var(--spectrum-focus-ring-color)}:host([size=xs]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-extra-small\n);--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-50);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-extra-small\n)}:host([size=s]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-small\n);--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-75);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-small\n)}:host([size=m]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-medium\n);--spectrum-swatch-disabled-icon-size:var(\n--spectrum-workflow-icon-size-100\n);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-medium\n)}:host([size=l]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-large\n);--spectrum-swatch-disabled-icon-size:var(\n--spectrum-workflow-icon-size-200\n);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-large\n)}@media (forced-colors:active){:host{--highcontrast-swatch-disabled-icon-color:GrayText;--highcontrast-swatch-focus-ring-color:ButtonText;--highcontrast-swatch-background-color-selected:Background;--highcontrast-swatch-border-color-selected:Highlight;--highcontrast-swatch-border-color:ButtonText;--highcontrast-swatch-fill-foreground-color:ButtonText}.fill{forced-color-adjust:none}:host([disabled]) .fill{forced-color-adjust:auto}}:host{align-items:center;display:flex;height:var(--mod-swatch-size,var(--spectrum-swatch-size));justify-content:center;outline:none;position:relative;-webkit-user-select:none;user-select:none;width:var(\n--mod-swatch-size,var(--spectrum-swatch-size)\n)}.disabledIcon{height:var(\n--mod-swatch-disabled-icon-size,var(--spectrum-swatch-disabled-icon-size)\n);width:var(\n--mod-swatch-disabled-icon-size,var(--spectrum-swatch-disabled-icon-size)\n)}:host,:host:before{border-radius:var(\n--mod-swatch-border-radius,var(--spectrum-swatch-border-radius)\n)}:host([selected]){background-color:var(\n--highcontrast-swatch-background-color-selected,var(\n--mod-swatch-inner-border-color-selected,var(--spectrum-swatch-inner-border-color-selected)\n)\n)}:host([selected]) .fill{border-radius:0;clip-path:polygon(calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2),calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2),calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2),calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2))}:host([selected]) .fill:before{border-radius:0;box-shadow:none}:host([selected]):before{opacity:1}:host(.is-image) .fill:before{background-color:transparent}:host([mixed-value]) .fill{background:var(\n--spectrum-picked-color,transparent\n)}:host([mixed-value]) .mixedValueIcon{color:var(\n--spectrum-swatch-dash-icon-color\n);visibility:visible}:host([nothing]) .fill{background-color:var(\n--spectrum-picked-color,transparent\n);background-image:none}:host([nothing]) .fill:after{background:var(\n--highcontrast-swatch-fill-foreground-color,var(\n--mod-swatch-slash-icon-color,var(--spectrum-swatch-slash-icon-color)\n)\n);content:\"\";height:var(\n--mod-swatch-slash-thickness,var(--spectrum-swatch-slash-thickness)\n);position:absolute;transform:rotate(-45deg);width:200%}:host([nothing][shape=rectangle]) .fill:after{transform:rotate(-25deg)}:host([disabled]) .disabledIcon,:host([disabled]) .disabledIcon{visibility:visible}:host:before{border-color:var(\n--highcontrast-swatch-border-color-selected,var(\n--mod-swatch-border-color-selected,var(--spectrum-swatch-border-color-selected)\n)\n);border-style:solid;border-width:var(\n--mod-swatch-border-thickness-selected,var(--spectrum-swatch-border-thickness-selected)\n);content:\"\";inset:0;opacity:0;pointer-events:none;position:absolute}:host:after{border-color:var(\n--highcontrast-swatch-focus-ring-color,var(\n--mod-swatch-focus-ring-color,var(--spectrum-swatch-focus-ring-color)\n)\n);border-radius:var(\n--mod-swatch-focus-ring-border-radius,var(--spectrum-swatch-focus-ring-border-radius)\n);border-style:solid;border-width:var(\n--mod-swatch-focus-ring-thickness,var(--spectrum-swatch-focus-ring-thickness)\n);content:\"\";inset:calc(var(--mod-swatch-focus-ring-gap, var(--spectrum-swatch-focus-ring-gap))*-2);opacity:0;position:absolute;transition:opacity var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-in-out}:host(.focus-visible):after{opacity:1}:host(:focus-visible):after{opacity:1}.fill{--spectrum-swatch-checkerboard-size:8px;--spectrum-swatch-checkerboard-background-offset:0px;--spectrum-swatch-checkerboard-dark-color:#d9d9d9;--spectrum-swatch-checkerboard-light-color:#fff;align-items:center;background-color:var(--spectrum-swatch-checkerboard-light-color);background-image:linear-gradient(-45deg,transparent 75.5%,var(--spectrum-swatch-checkerboard-dark-color) 75.5%),linear-gradient(45deg,transparent 75.5%,var(--spectrum-swatch-checkerboard-dark-color) 75.5%),linear-gradient(-45deg,var(--spectrum-swatch-checkerboard-dark-color) 25.5%,transparent 25.5%),linear-gradient(45deg,var(--spectrum-swatch-checkerboard-dark-color) 25.5%,transparent 25.5%);background-position:var(--spectrum-swatch-checkerboard-background-offset) var(--spectrum-swatch-checkerboard-background-offset),var(--spectrum-swatch-checkerboard-background-offset) calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n) + var(--spectrum-swatch-checkerboard-background-offset)),calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n) + var(--spectrum-swatch-checkerboard-background-offset)) calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*-1 + var(--spectrum-swatch-checkerboard-background-offset)),calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*-1 + var(--spectrum-swatch-checkerboard-background-offset)) var(--spectrum-swatch-checkerboard-background-offset);background-size:calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*2) calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*2);border-radius:var(\n--mod-swatch-border-radius,var(--spectrum-swatch-border-radius)\n);box-sizing:border-box;display:flex;height:100%;justify-content:center;overflow:hidden;position:relative;width:100%}.fill:before{background-color:var(--spectrum-picked-color,transparent);border-radius:var(\n--mod-swatch-border-radius,var(--spectrum-swatch-border-radius)\n);box-shadow:inset 0 0 0 var(\n--mod-swatch-border-thickness,var(--spectrum-swatch-border-thickness)\n) var(\n--highcontrast-swatch-border-color,var(--mod-swatch-border-color,var(--spectrum-swatch-border-color))\n);content:\"\";inset:0;position:absolute;z-index:0}:host([border=none]) .fill:before{background-color:var(--spectrum-picked-color,transparent);box-shadow:none}.mixedValueIcon{color:var(\n--spectrum-picked-color,transparent\n)}.disabledIcon,.mixedValueIcon{pointer-events:none;visibility:hidden}.disabledIcon{stroke:var(\n--highcontrast-swatch-disabled-icon-color,var(\n--mod-swatch-disabled-icon-color,var(--spectrum-swatch-disabled-icon-color)\n)\n);color:var(\n--highcontrast-swatch-disabled-icon-color,var(\n--mod-swatch-disabled-icon-color,var(--spectrum-swatch-disabled-icon-color)\n)\n);position:relative;z-index:2}.disabledIcon path:first-child{fill:var(\n--highcontrast-swatch-disabled-icon-color,var(\n--mod-swatch-disabled-icon-color,var(--spectrum-swatch-disabled-icon-color)\n)\n)}.disabledIcon path:last-child{fill:var(\n--mod-swatch-icon-border-color,var(--spectrum-swatch-icon-border-color)\n)}:host([shape=rectangle]){width:calc(var(--mod-swatch-size, var(--spectrum-swatch-size))*2)}:host([rounding=none]),:host([rounding=none]) .fill,:host([rounding=none]) .fill:before,:host([rounding=none]):after,:host([rounding=none]):before,:host([rounding=none][selected]) .fill,:host([rounding=none][selected]) .fill:before{border-radius:0}:host([rounding=full]:not([shape=rectangle])),:host([rounding=full]:not([shape=rectangle])) .fill,:host([rounding=full]:not([shape=rectangle])) .fill:before,:host([rounding=full]:not([shape=rectangle])):after,:host([rounding=full]:not([shape=rectangle])):before,:host([rounding=full][selected]:not([shape=rectangle])) .fill,:host([rounding=full][selected]:not([shape=rectangle])) .fill:before{border-radius:100%}:host([rounding=full][selected]:not([shape=rectangle])) .fill{clip-path:circle(calc(50% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) at 50% 50%)}::slotted([slot=image]){height:100%;object-fit:contain;transition:width var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-in-out,height var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-in-out;width:100%}\n`;\nexport default styles;"],
-  "mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAgJf,eAAeC",
+  "sourcesContent": ["/*\nCopyright 2022 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host{--spectrum-swatch-focus-indicator-border-radius:8px;--spectrum-swatch-icon-border-color:rgba(0,0,0,.51);--spectrum-swatch-size:var(--spectrum-swatch-size-small);--spectrum-swatch-border-radius:var(--spectrum-corner-radius-100);--spectrum-swatch-border-thickness:var(--spectrum-border-width-100);--spectrum-swatch-border-thickness-selected:var(\n--spectrum-border-width-200\n);--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-75);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-small\n);--spectrum-swatch-focus-indicator-thickness:var(\n--spectrum-focus-indicator-thickness\n);--spectrum-swatch-focus-indicator-gap:var(--spectrum-focus-indicator-gap);--spectrum-swatch-border-color-selected:var(--spectrum-gray-900);--spectrum-swatch-inner-border-color-selected:var(--spectrum-gray-50);--spectrum-swatch-disabled-icon-border-color:var(\n--spectrum-swatch-disabled-icon-border-color\n);--spectrum-swatch-disabled-icon-color:var(--spectrum-white);--spectrum-swatch-dash-icon-color:var(--spectrum-gray-800);--spectrum-swatch-slash-icon-color:var(--spectrum-red-900);--spectrum-swatch-focus-indicator-color:var(\n--spectrum-focus-indicator-color\n)}:host([size=xs]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-extra-small\n);--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-50);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-extra-small\n)}:host([size=s]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-small\n);--spectrum-swatch-disabled-icon-size:var(--spectrum-workflow-icon-size-75);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-small\n)}:host([size=m]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-medium\n);--spectrum-swatch-disabled-icon-size:var(\n--spectrum-workflow-icon-size-100\n);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-medium\n)}:host([size=l]){--spectrum-swatch-size:var(\n--spectrum-swatch-size-large\n);--spectrum-swatch-disabled-icon-size:var(\n--spectrum-workflow-icon-size-200\n);--spectrum-swatch-slash-thickness:var(\n--spectrum-swatch-slash-thickness-large\n)}@media (forced-colors:active){:host{--highcontrast-swatch-disabled-icon-color:GrayText;--highcontrast-swatch-focus-indicator-color:ButtonText;--highcontrast-swatch-background-color-selected:Background;--highcontrast-swatch-border-color-selected:Highlight;--highcontrast-swatch-border-color:ButtonText;--highcontrast-swatch-fill-foreground-color:ButtonText}.fill{forced-color-adjust:none}:host([disabled]) .fill{forced-color-adjust:auto}}:host{align-items:center;display:flex;height:var(--mod-swatch-size,var(--spectrum-swatch-size));justify-content:center;outline:none;position:relative;-webkit-user-select:none;user-select:none;width:var(\n--mod-swatch-size,var(--spectrum-swatch-size)\n)}.disabledIcon{height:var(\n--mod-swatch-disabled-icon-size,var(--spectrum-swatch-disabled-icon-size)\n);width:var(\n--mod-swatch-disabled-icon-size,var(--spectrum-swatch-disabled-icon-size)\n)}:host,:host:before{border-radius:var(\n--mod-swatch-border-radius,var(--spectrum-swatch-border-radius)\n)}:host([selected]){background-color:var(\n--highcontrast-swatch-background-color-selected,var(\n--mod-swatch-inner-border-color-selected,var(--spectrum-swatch-inner-border-color-selected)\n)\n)}:host([selected]) .fill{border-radius:0;clip-path:polygon(calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2),calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2),calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2),calc(var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) calc(100% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2))}:host([selected]) .fill:before{border-radius:0;box-shadow:none}:host([selected]):before{opacity:1}:host(.is-image) .fill:before{background-color:transparent}:host([mixed-value]) .fill{background:var(\n--spectrum-picked-color,transparent\n)}:host([mixed-value]) .mixedValueIcon{color:var(\n--spectrum-swatch-dash-icon-color\n);visibility:visible}:host([nothing]) .fill{background-color:var(\n--spectrum-picked-color,transparent\n);background-image:none}:host([nothing]) .fill:after{background:var(\n--highcontrast-swatch-fill-foreground-color,var(\n--mod-swatch-slash-icon-color,var(--spectrum-swatch-slash-icon-color)\n)\n);content:\"\";height:var(\n--mod-swatch-slash-thickness,var(--spectrum-swatch-slash-thickness)\n);position:absolute;transform:rotate(-45deg);width:200%}:host([nothing][shape=rectangle]) .fill:after{transform:rotate(-25deg)}:host([disabled]) .disabledIcon,:host([disabled]) .disabledIcon{visibility:visible}:host:before{border-color:var(\n--highcontrast-swatch-border-color-selected,var(\n--mod-swatch-border-color-selected,var(--spectrum-swatch-border-color-selected)\n)\n);border-style:solid;border-width:var(\n--mod-swatch-border-thickness-selected,var(--spectrum-swatch-border-thickness-selected)\n);content:\"\";inset:0;opacity:0;pointer-events:none;position:absolute}:host:after{border-color:var(\n--highcontrast-swatch-focus-indicator-color,var(\n--mod-swatch-focus-indicator-color,var(--spectrum-swatch-focus-indicator-color)\n)\n);border-radius:var(\n--mod-swatch-focus-indicator-border-radius,var(--spectrum-swatch-focus-indicator-border-radius)\n);border-style:solid;border-width:var(\n--mod-swatch-focus-indicator-thickness,var(--spectrum-swatch-focus-indicator-thickness)\n);content:\"\";inset:calc(var(\n--mod-swatch-focus-indicator-gap,\nvar(--spectrum-swatch-focus-indicator-gap)\n)*-2);opacity:0;position:absolute;transition:opacity var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-in-out}:host(.focus-visible):after{opacity:1}:host(:focus-visible):after{opacity:1}.fill{--spectrum-swatch-checkerboard-size:8px;--spectrum-swatch-checkerboard-background-offset:0px;--spectrum-swatch-checkerboard-dark-color:#d9d9d9;--spectrum-swatch-checkerboard-light-color:#fff;align-items:center;background-color:var(--spectrum-swatch-checkerboard-light-color);background-image:linear-gradient(-45deg,transparent 75.5%,var(--spectrum-swatch-checkerboard-dark-color) 75.5%),linear-gradient(45deg,transparent 75.5%,var(--spectrum-swatch-checkerboard-dark-color) 75.5%),linear-gradient(-45deg,var(--spectrum-swatch-checkerboard-dark-color) 25.5%,transparent 25.5%),linear-gradient(45deg,var(--spectrum-swatch-checkerboard-dark-color) 25.5%,transparent 25.5%);background-position:var(--spectrum-swatch-checkerboard-background-offset) var(--spectrum-swatch-checkerboard-background-offset),var(--spectrum-swatch-checkerboard-background-offset) calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n) + var(--spectrum-swatch-checkerboard-background-offset)),calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n) + var(--spectrum-swatch-checkerboard-background-offset)) calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*-1 + var(--spectrum-swatch-checkerboard-background-offset)),calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*-1 + var(--spectrum-swatch-checkerboard-background-offset)) var(--spectrum-swatch-checkerboard-background-offset);background-size:calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*2) calc(var(\n--mod-swatch-checkerboard-size,\nvar(--spectrum-swatch-checkerboard-size)\n)*2);border-radius:var(\n--mod-swatch-border-radius,var(--spectrum-swatch-border-radius)\n);box-sizing:border-box;display:flex;height:100%;justify-content:center;overflow:hidden;position:relative;width:100%}.fill:before{background-color:var(--spectrum-picked-color,transparent);border-radius:var(\n--mod-swatch-border-radius,var(--spectrum-swatch-border-radius)\n);box-shadow:inset 0 0 0 var(\n--mod-swatch-border-thickness,var(--spectrum-swatch-border-thickness)\n) var(\n--highcontrast-swatch-border-color,var(--mod-swatch-border-color,var(--spectrum-swatch-border-color))\n);content:\"\";inset:0;position:absolute;z-index:0}:host([border=none]) .fill:before{background-color:var(--spectrum-picked-color,transparent);box-shadow:none}.mixedValueIcon{color:var(\n--spectrum-picked-color,transparent\n)}.disabledIcon,.mixedValueIcon{pointer-events:none;visibility:hidden}.disabledIcon{stroke:var(\n--highcontrast-swatch-disabled-icon-color,var(\n--mod-swatch-disabled-icon-color,var(--spectrum-swatch-disabled-icon-color)\n)\n);color:var(\n--highcontrast-swatch-disabled-icon-color,var(\n--mod-swatch-disabled-icon-color,var(--spectrum-swatch-disabled-icon-color)\n)\n);position:relative;z-index:2}.disabledIcon path:first-child{fill:var(\n--highcontrast-swatch-disabled-icon-color,var(\n--mod-swatch-disabled-icon-color,var(--spectrum-swatch-disabled-icon-color)\n)\n)}.disabledIcon path:last-child{fill:var(\n--mod-swatch-icon-border-color,var(--spectrum-swatch-icon-border-color)\n)}:host([shape=rectangle]){width:calc(var(--mod-swatch-size, var(--spectrum-swatch-size))*2)}:host([rounding=none]),:host([rounding=none]) .fill,:host([rounding=none]) .fill:before,:host([rounding=none]):after,:host([rounding=none]):before,:host([rounding=none][selected]) .fill,:host([rounding=none][selected]) .fill:before{border-radius:0}:host([rounding=full]:not([shape=rectangle])),:host([rounding=full]:not([shape=rectangle])) .fill,:host([rounding=full]:not([shape=rectangle])) .fill:before,:host([rounding=full]:not([shape=rectangle])):after,:host([rounding=full]:not([shape=rectangle])):before,:host([rounding=full][selected]:not([shape=rectangle])) .fill,:host([rounding=full][selected]:not([shape=rectangle])) .fill:before{border-radius:100%}:host([rounding=full][selected]:not([shape=rectangle])) .fill{clip-path:circle(calc(50% - var(\n--mod-swatch-border-thickness-selected,\nvar(--spectrum-swatch-border-thickness-selected)\n)*2) at 50% 50%)}::slotted([slot=image]){height:100%;object-fit:contain;transition:width var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-in-out,height var(\n--mod-animation-duration-100,var(--spectrum-animation-duration-100)\n) ease-in-out;width:100%}\n`;\nexport default styles;"],
+  "mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAqJf,eAAeC",
   "names": ["css", "styles"]
 }