@spectrum-web-components/theme 0.9.5-express.9 → 0.10.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.
- package/README.md +38 -56
- package/custom-elements.json +3 -163
- package/package.json +5 -12
- package/src/Theme.d.ts +7 -12
- package/src/Theme.js +13 -57
- package/src/Theme.js.map +1 -1
- package/src/theme.css.js +12 -0
- package/src/theme.css.js.map +1 -1
- package/src/typography.css.js +1 -1
- package/src/typography.css.js.map +1 -1
- package/express/scale-large.d.ts +0 -1
- package/express/scale-large.js +0 -15
- package/express/scale-large.js.map +0 -1
- package/express/scale-medium.d.ts +0 -1
- package/express/scale-medium.js +0 -15
- package/express/scale-medium.js.map +0 -1
- package/express/theme-dark.d.ts +0 -1
- package/express/theme-dark.js +0 -15
- package/express/theme-dark.js.map +0 -1
- package/express/theme-light.d.ts +0 -1
- package/express/theme-light.js +0 -15
- package/express/theme-light.js.map +0 -1
- package/src/express/core.d.ts +0 -1
- package/src/express/core.js +0 -15
- package/src/express/core.js.map +0 -1
- package/src/express/scale-large.css.d.ts +0 -2
- package/src/express/scale-large.css.js +0 -4079
- package/src/express/scale-large.css.js.map +0 -1
- package/src/express/scale-medium.css.d.ts +0 -2
- package/src/express/scale-medium.css.js +0 -4133
- package/src/express/scale-medium.css.js.map +0 -1
- package/src/express/theme-dark.css.d.ts +0 -2
- package/src/express/theme-dark.css.js +0 -35
- package/src/express/theme-dark.css.js.map +0 -1
- package/src/express/theme-light.css.d.ts +0 -2
- package/src/express/theme-light.css.js +0 -35
- package/src/express/theme-light.css.js.map +0 -1
- package/src/express/theme.css.d.ts +0 -2
- package/src/express/theme.css.js +0 -1641
- package/src/express/theme.css.js.map +0 -1
- package/src/express/themes.d.ts +0 -5
- package/src/express/themes.js +0 -17
- package/src/express/themes.js.map +0 -1
- package/test/theme-lazy.test.js +0 -119
- package/test/theme-lazy.test.js.map +0 -1
- package/test/theme.test-vrt.js +0 -15
- package/test/theme.test-vrt.js.map +0 -1
- package/test/themes.test.js +0 -152
- package/test/themes.test.js.map +0 -1
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"theme.css.js","sourceRoot":"","sources":["theme.css.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AACF,OAAO,EAAE,GAAG,EAAE,MAAM,+BAA+B,CAAC;AACpD,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0lDjB,CAAC;AACF,eAAe,MAAM,CAAC","sourcesContent":["/*\nCopyright 2020 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,:root{--spectrum-global-animation-linear:cubic-bezier(0,0,1,1);--spectrum-global-animation-duration-0:0ms;--spectrum-global-animation-duration-100:130ms;--spectrum-global-animation-duration-200:160ms;--spectrum-global-animation-duration-300:190ms;--spectrum-global-animation-duration-400:220ms;--spectrum-global-animation-duration-500:250ms;--spectrum-global-animation-duration-600:300ms;--spectrum-global-animation-duration-700:350ms;--spectrum-global-animation-duration-800:400ms;--spectrum-global-animation-duration-900:450ms;--spectrum-global-animation-duration-1000:500ms;--spectrum-global-animation-duration-2000:1000ms;--spectrum-global-animation-duration-4000:2000ms;--spectrum-global-animation-ease-in-out:cubic-bezier(0.45,0,0.4,1);--spectrum-global-animation-ease-in:cubic-bezier(0.5,0,1,1);--spectrum-global-animation-ease-out:cubic-bezier(0,0,0.4,1);--spectrum-global-animation-ease-linear:cubic-bezier(0,0,1,1);--spectrum-global-color-status:Verified;--spectrum-global-color-version:5.1.0;--spectrum-global-color-static-blue:#0261d6;--spectrum-global-color-static-gray-50:#fff;--spectrum-global-color-static-gray-75:#fff;--spectrum-global-color-static-gray-100:#fff;--spectrum-global-color-static-gray-200:#ebebeb;--spectrum-global-color-static-gray-300:#dadada;--spectrum-global-color-static-gray-400:#b3b3b3;--spectrum-global-color-static-gray-500:#929292;--spectrum-global-color-static-gray-600:#6e6e6e;--spectrum-global-color-static-gray-700:#474747;--spectrum-global-color-static-gray-800:#222;--spectrum-global-color-static-gray-900:#000;--spectrum-global-color-static-red-400:#fa604b;--spectrum-global-color-static-red-500:#f04534;--spectrum-global-color-static-red-600:#e32a1f;--spectrum-global-color-static-red-700:#ce0f0b;--spectrum-global-color-static-red-800:#b60000;--spectrum-global-color-static-orange-400:#e87200;--spectrum-global-color-static-orange-500:#d56300;--spectrum-global-color-static-orange-600:#c25600;--spectrum-global-color-static-orange-700:#ac4900;--spectrum-global-color-static-orange-800:#963e00;--spectrum-global-color-static-yellow-200:#fdf8cd;--spectrum-global-color-static-yellow-300:#f9e442;--spectrum-global-color-static-yellow-400:#ec0;--spectrum-global-color-static-yellow-500:#dbb700;--spectrum-global-color-static-yellow-600:#c8a300;--spectrum-global-color-static-yellow-700:#b48f00;--spectrum-global-color-static-yellow-800:#a47f00;--spectrum-global-color-static-chartreuse-300:#c4f081;--spectrum-global-color-static-chartreuse-400:#a6df58;--spectrum-global-color-static-chartreuse-500:#8bcc39;--spectrum-global-color-static-chartreuse-600:#74b824;--spectrum-global-color-static-chartreuse-700:#62a416;--spectrum-global-color-static-chartreuse-800:#559310;--spectrum-global-color-static-celery-200:#a9f597;--spectrum-global-color-static-celery-300:#7be471;--spectrum-global-color-static-celery-400:#53d254;--spectrum-global-color-static-celery-500:#2dbf3a;--spectrum-global-color-static-celery-600:#0dab25;--spectrum-global-color-static-celery-700:#009a17;--spectrum-global-color-static-celery-800:#008910;--spectrum-global-color-static-green-400:#1ba772;--spectrum-global-color-static-green-500:#009764;--spectrum-global-color-static-green-600:#008757;--spectrum-global-color-static-green-700:#00764c;--spectrum-global-color-static-green-800:#006641;--spectrum-global-color-static-seafoam-200:#49cbcd;--spectrum-global-color-static-seafoam-300:#25b8bd;--spectrum-global-color-static-seafoam-400:#00a3aa;--spectrum-global-color-static-seafoam-500:#00929b;--spectrum-global-color-static-seafoam-600:#00828e;--spectrum-global-color-static-seafoam-700:#00727e;--spectrum-global-color-static-seafoam-800:#00626e;--spectrum-global-color-static-blue-200:#7fbffb;--spectrum-global-color-static-blue-300:#60abf8;--spectrum-global-color-static-blue-400:#3e95f4;--spectrum-global-color-static-blue-500:#1f82f6;--spectrum-global-color-static-blue-600:#0b71ef;--spectrum-global-color-static-blue-700:#0261d6;--spectrum-global-color-static-blue-800:#0055b9;--spectrum-global-color-static-indigo-200:#9a9dff;--spectrum-global-color-static-indigo-300:#8287fd;--spectrum-global-color-static-indigo-400:#7175f8;--spectrum-global-color-static-indigo-500:#6165f0;--spectrum-global-color-static-indigo-600:#4f54e1;--spectrum-global-color-static-indigo-700:#4246cb;--spectrum-global-color-static-indigo-800:#363ab2;--spectrum-global-color-static-purple-400:#a460f8;--spectrum-global-color-static-purple-500:#964df0;--spectrum-global-color-static-purple-600:#8638e4;--spectrum-global-color-static-purple-700:#7526d5;--spectrum-global-color-static-purple-800:#6317bf;--spectrum-global-color-static-fuchsia-400:#d642d7;--spectrum-global-color-static-fuchsia-500:#c530c6;--spectrum-global-color-static-fuchsia-600:#b21cb3;--spectrum-global-color-static-fuchsia-700:#9f04a0;--spectrum-global-color-static-fuchsia-800:#880089;--spectrum-global-color-static-magenta-200:#fd7cae;--spectrum-global-color-static-magenta-300:#f25e9c;--spectrum-global-color-static-magenta-400:#e5478b;--spectrum-global-color-static-magenta-500:#d7327a;--spectrum-global-color-static-magenta-600:#c41d66;--spectrum-global-color-static-magenta-700:#af0a56;--spectrum-global-color-static-magenta-800:#970049;--spectrum-global-color-static-black:#000;--spectrum-global-color-static-white:#fff;--spectrum-global-color-static-transparent-white-200:hsla(0,0%,100%,.1);--spectrum-global-color-static-transparent-white-300:hsla(0,0%,100%,.25);--spectrum-global-color-static-transparent-white-400:hsla(0,0%,100%,.4);--spectrum-global-color-static-transparent-white-500:hsla(0,0%,100%,.55);--spectrum-global-color-static-transparent-white-600:hsla(0,0%,100%,.7);--spectrum-global-color-static-transparent-white-700:hsla(0,0%,100%,.8);--spectrum-global-color-static-transparent-white-800:hsla(0,0%,100%,.9);--spectrum-global-color-static-transparent-white-900:#fff;--spectrum-global-color-static-transparent-black-200:rgba(0,0,0,.1);--spectrum-global-color-static-transparent-black-300:rgba(0,0,0,.25);--spectrum-global-color-static-transparent-black-400:rgba(0,0,0,.4);--spectrum-global-color-static-transparent-black-500:rgba(0,0,0,.55);--spectrum-global-color-static-transparent-black-600:rgba(0,0,0,.7);--spectrum-global-color-static-transparent-black-700:rgba(0,0,0,.8);--spectrum-global-color-static-transparent-black-800:rgba(0,0,0,.9);--spectrum-global-color-static-transparent-black-900:#000;--spectrum-global-color-sequential-cerulean:#e9fff1,#c8f1e4,#a5e3d7,#82d5ca,#68c5c1,#54b4ba,#3fa2b2,#2991ac,#2280a2,#1f6d98,#1d5c8d,#1a4b83,#1a3979,#1a266f,#191264,#180057;--spectrum-global-color-sequential-forest:#ffffdf,#e2f6ba,#c4eb95,#a4e16d,#8dd366,#77c460,#5fb65a,#48a754,#36984f,#2c894d,#237a4a,#196b47,#105c45,#094d41,#033f3e,#00313a;--spectrum-global-color-sequential-rose:#fff4dd,#ffddd7,#ffc5d2,#feaecb,#fa96c4,#f57ebd,#ef64b5,#e846ad,#d238a1,#bb2e96,#a3248c,#8a1b83,#71167c,#560f74,#370b6e,#000968;--spectrum-global-color-diverging-orange-yellow-seafoam:#580000,#79260b,#9c4511,#bd651a,#dd8629,#f5ad52,#fed693,#ffffe0,#bbe4d1,#76c7be,#3ea8a6,#208288,#076769,#00494b,#002c2d;--spectrum-global-color-diverging-red-yellow-blue:#4a001e,#751232,#a52747,#c65154,#e47961,#f0a882,#fad4ac,#ffffe0,#bce2cf,#89c0c4,#579eb9,#397aa8,#1c5796,#163771,#10194d;--spectrum-global-color-diverging-red-blue:#4a001e,#731331,#9f2945,#cc415a,#e06e85,#ed9ab0,#f8c3d9,#faf0ff,#c6d0f2,#92b2de,#5d94cb,#2f74b3,#265191,#163670,#0b194c;--spectrum-semantic-cta-background-color-default:var(\n--spectrum-global-color-static-indigo-600\n);--spectrum-semantic-cta-background-color-hover:var(\n--spectrum-global-color-static-indigo-700\n);--spectrum-semantic-cta-background-color-down:var(\n--spectrum-global-color-static-indigo-800\n);--spectrum-semantic-cta-background-color-key-focus:var(\n--spectrum-global-color-static-indigo-700\n);--spectrum-semantic-neutral-background-color-default:var(\n--spectrum-global-color-static-gray-800\n);--spectrum-semantic-informative-background-color:var(\n--spectrum-global-color-static-blue-500\n);--spectrum-semantic-positive-background-color:var(\n--spectrum-global-color-static-green-500\n);--spectrum-semantic-negative-background-color:var(\n--spectrum-global-color-static-red-500\n);--spectrum-semantic-negative-color-default:var(\n--spectrum-global-color-red-500\n);--spectrum-semantic-negative-color-hover:var(\n--spectrum-global-color-red-600\n);--spectrum-semantic-negative-color-dark:var(\n--spectrum-global-color-red-600\n);--spectrum-semantic-negative-border-color:var(\n--spectrum-global-color-red-400\n);--spectrum-semantic-negative-icon-color:var(\n--spectrum-global-color-red-600\n);--spectrum-semantic-negative-status-color:var(\n--spectrum-global-color-red-400\n);--spectrum-semantic-negative-text-color-large:var(\n--spectrum-global-color-red-500\n);--spectrum-semantic-negative-text-color-small:var(\n--spectrum-global-color-red-600\n);--spectrum-semantic-negative-text-color-small-hover:var(\n--spectrum-global-color-red-700\n);--spectrum-semantic-negative-text-color-small-down:var(\n--spectrum-global-color-red-700\n);--spectrum-semantic-negative-text-color-small-key-focus:var(\n--spectrum-global-color-red-600\n);--spectrum-semantic-negative-color-down:var(\n--spectrum-global-color-red-700\n);--spectrum-semantic-negative-color-key-focus:var(\n--spectrum-global-color-red-400\n);--spectrum-semantic-negative-background-color-default:var(\n--spectrum-global-color-static-red-600\n);--spectrum-semantic-negative-background-color-hover:var(\n--spectrum-global-color-static-red-700\n);--spectrum-semantic-negative-background-color-down:var(\n--spectrum-global-color-static-red-800\n);--spectrum-semantic-negative-background-color-key-focus:var(\n--spectrum-global-color-static-red-700\n);--spectrum-semantic-notice-background-color:var(\n--spectrum-global-color-static-orange-700\n);--spectrum-semantic-notice-color-default:var(\n--spectrum-global-color-orange-500\n);--spectrum-semantic-notice-color-dark:var(\n--spectrum-global-color-orange-600\n);--spectrum-semantic-notice-border-color:var(\n--spectrum-global-color-orange-400\n);--spectrum-semantic-notice-icon-color:var(\n--spectrum-global-color-orange-600\n);--spectrum-semantic-notice-status-color:var(\n--spectrum-global-color-orange-400\n);--spectrum-semantic-notice-text-color-large:var(\n--spectrum-global-color-orange-500\n);--spectrum-semantic-notice-text-color-small:var(\n--spectrum-global-color-orange-600\n);--spectrum-semantic-notice-color-down:var(\n--spectrum-global-color-orange-700\n);--spectrum-semantic-notice-color-key-focus:var(\n--spectrum-global-color-orange-400\n);--spectrum-semantic-notice-background-color-default:var(\n--spectrum-global-color-static-orange-600\n);--spectrum-semantic-notice-background-color-hover:var(\n--spectrum-global-color-static-orange-700\n);--spectrum-semantic-notice-background-color-down:var(\n--spectrum-global-color-static-orange-800\n);--spectrum-semantic-notice-background-color-key-focus:var(\n--spectrum-global-color-static-orange-700\n);--spectrum-semantic-positive-color-default:var(\n--spectrum-global-color-green-500\n);--spectrum-semantic-positive-color-dark:var(\n--spectrum-global-color-green-600\n);--spectrum-semantic-positive-border-color:var(\n--spectrum-global-color-green-400\n);--spectrum-semantic-positive-icon-color:var(\n--spectrum-global-color-green-600\n);--spectrum-semantic-positive-status-color:var(\n--spectrum-global-color-green-400\n);--spectrum-semantic-positive-text-color-large:var(\n--spectrum-global-color-green-500\n);--spectrum-semantic-positive-text-color-small:var(\n--spectrum-global-color-green-600\n);--spectrum-semantic-positive-color-down:var(\n--spectrum-global-color-green-700\n);--spectrum-semantic-positive-color-key-focus:var(\n--spectrum-global-color-green-400\n);--spectrum-semantic-positive-background-color-default:var(\n--spectrum-global-color-static-green-700\n);--spectrum-semantic-positive-background-color-hover:var(\n--spectrum-global-color-static-green-800\n);--spectrum-semantic-positive-background-color-down:var(\n--spectrum-global-color-static-green-800\n);--spectrum-semantic-positive-background-color-key-focus:var(\n--spectrum-global-color-static-green-800\n);--spectrum-semantic-informative-color-default:var(\n--spectrum-global-color-blue-500\n);--spectrum-semantic-informative-color-dark:var(\n--spectrum-global-color-blue-600\n);--spectrum-semantic-informative-border-color:var(\n--spectrum-global-color-blue-400\n);--spectrum-semantic-informative-icon-color:var(\n--spectrum-global-color-blue-600\n);--spectrum-semantic-informative-status-color:var(\n--spectrum-global-color-blue-400\n);--spectrum-semantic-informative-text-color-large:var(\n--spectrum-global-color-blue-500\n);--spectrum-semantic-informative-text-color-small:var(\n--spectrum-global-color-blue-600\n);--spectrum-semantic-informative-color-down:var(\n--spectrum-global-color-blue-700\n);--spectrum-semantic-informative-color-key-focus:var(\n--spectrum-global-color-blue-400\n);--spectrum-semantic-informative-background-color-default:var(\n--spectrum-global-color-static-blue-600\n);--spectrum-semantic-informative-background-color-hover:var(\n--spectrum-global-color-static-blue-700\n);--spectrum-semantic-informative-background-color-down:var(\n--spectrum-global-color-static-blue-800\n);--spectrum-semantic-informative-background-color-key-focus:var(\n--spectrum-global-color-static-blue-700\n);--spectrum-semantic-neutral-background-color-hover:var(\n--spectrum-global-color-static-gray-800\n);--spectrum-semantic-neutral-background-color-down:var(\n--spectrum-global-color-static-gray-900\n);--spectrum-semantic-neutral-background-color-key-focus:var(\n--spectrum-global-color-static-gray-800\n);--spectrum-semantic-presence-color-1:var(\n--spectrum-global-color-static-red-500\n);--spectrum-semantic-presence-color-2:var(\n--spectrum-global-color-static-orange-400\n);--spectrum-semantic-presence-color-3:var(\n--spectrum-global-color-static-yellow-400\n);--spectrum-semantic-presence-color-4:#4bcca2;--spectrum-semantic-presence-color-5:#00c7ff;--spectrum-semantic-presence-color-6:#008cb8;--spectrum-semantic-presence-color-7:#7e4bf3;--spectrum-semantic-presence-color-8:var(\n--spectrum-global-color-static-fuchsia-600\n);--spectrum-global-dimension-static-percent-50:50%;--spectrum-global-dimension-static-percent-70:70%;--spectrum-global-dimension-static-percent-100:100%;--spectrum-global-dimension-static-breakpoint-xsmall:304px;--spectrum-global-dimension-static-breakpoint-small:768px;--spectrum-global-dimension-static-breakpoint-medium:1280px;--spectrum-global-dimension-static-breakpoint-large:1768px;--spectrum-global-dimension-static-breakpoint-xlarge:2160px;--spectrum-global-dimension-static-grid-columns:12;--spectrum-global-dimension-static-grid-fluid-width:100%;--spectrum-global-dimension-static-grid-fixed-max-width:1280px;--spectrum-global-dimension-static-size-0:0px;--spectrum-global-dimension-static-size-10:1px;--spectrum-global-dimension-static-size-25:2px;--spectrum-global-dimension-static-size-40:3px;--spectrum-global-dimension-static-size-50:4px;--spectrum-global-dimension-static-size-65:5px;--spectrum-global-dimension-static-size-75:6px;--spectrum-global-dimension-static-size-85:7px;--spectrum-global-dimension-static-size-100:8px;--spectrum-global-dimension-static-size-115:9px;--spectrum-global-dimension-static-size-125:10px;--spectrum-global-dimension-static-size-130:11px;--spectrum-global-dimension-static-size-150:12px;--spectrum-global-dimension-static-size-160:13px;--spectrum-global-dimension-static-size-175:14px;--spectrum-global-dimension-static-size-200:16px;--spectrum-global-dimension-static-size-225:18px;--spectrum-global-dimension-static-size-250:20px;--spectrum-global-dimension-static-size-275:22px;--spectrum-global-dimension-static-size-300:24px;--spectrum-global-dimension-static-size-325:26px;--spectrum-global-dimension-static-size-400:32px;--spectrum-global-dimension-static-size-450:36px;--spectrum-global-dimension-static-size-500:40px;--spectrum-global-dimension-static-size-550:44px;--spectrum-global-dimension-static-size-600:48px;--spectrum-global-dimension-static-size-700:56px;--spectrum-global-dimension-static-size-800:64px;--spectrum-global-dimension-static-size-900:72px;--spectrum-global-dimension-static-size-1000:80px;--spectrum-global-dimension-static-size-1200:96px;--spectrum-global-dimension-static-size-1700:136px;--spectrum-global-dimension-static-size-2400:192px;--spectrum-global-dimension-static-size-2500:200px;--spectrum-global-dimension-static-size-2600:208px;--spectrum-global-dimension-static-size-2800:224px;--spectrum-global-dimension-static-size-3200:256px;--spectrum-global-dimension-static-size-3400:272px;--spectrum-global-dimension-static-size-3500:280px;--spectrum-global-dimension-static-size-3600:288px;--spectrum-global-dimension-static-size-3800:304px;--spectrum-global-dimension-static-size-4600:368px;--spectrum-global-dimension-static-size-5000:400px;--spectrum-global-dimension-static-size-6000:480px;--spectrum-global-dimension-static-size-16000:1280px;--spectrum-global-dimension-static-font-size-50:11px;--spectrum-global-dimension-static-font-size-75:12px;--spectrum-global-dimension-static-font-size-100:14px;--spectrum-global-dimension-static-font-size-150:15px;--spectrum-global-dimension-static-font-size-200:16px;--spectrum-global-dimension-static-font-size-300:18px;--spectrum-global-dimension-static-font-size-400:20px;--spectrum-global-dimension-static-font-size-500:22px;--spectrum-global-dimension-static-font-size-600:25px;--spectrum-global-dimension-static-font-size-700:28px;--spectrum-global-dimension-static-font-size-800:32px;--spectrum-global-dimension-static-font-size-900:36px;--spectrum-global-dimension-static-font-size-1000:40px;--spectrum-global-font-family-base:adobe-clean,\"Source Sans Pro\",-apple-system,BlinkMacSystemFont,\"Segoe UI\",Roboto,Ubuntu,\"Trebuchet MS\",\"Lucida Grande\",sans-serif;--spectrum-global-font-family-serif:adobe-clean-serif,\"Source Serif Pro\",Georgia,serif;--spectrum-global-font-family-code:\"Source Code Pro\",Monaco,monospace;--spectrum-global-font-weight-thin:100;--spectrum-global-font-weight-ultra-light:200;--spectrum-global-font-weight-light:300;--spectrum-global-font-weight-regular:400;--spectrum-global-font-weight-medium:500;--spectrum-global-font-weight-semi-bold:600;--spectrum-global-font-weight-bold:700;--spectrum-global-font-weight-extra-bold:800;--spectrum-global-font-weight-black:900;--spectrum-global-font-style-regular:normal;--spectrum-global-font-style-italic:italic;--spectrum-global-font-letter-spacing-none:0;--spectrum-global-font-letter-spacing-small:0.0125em;--spectrum-global-font-letter-spacing-han:0.05em;--spectrum-global-font-letter-spacing-medium:0.06em;--spectrum-global-font-line-height-large:1.7;--spectrum-global-font-line-height-medium:1.5;--spectrum-global-font-line-height-small:1.3;--spectrum-global-font-multiplier-0:0em;--spectrum-global-font-multiplier-25:0.25em;--spectrum-global-font-multiplier-75:0.75em;--spectrum-global-font-font-family-ar:myriad-arabic,adobe-clean,\"Source Sans Pro\",-apple-system,BlinkMacSystemFont,\"Segoe UI\",Roboto,Ubuntu,\"Trebuchet MS\",\"Lucida Grande\",sans-serif;--spectrum-global-font-font-family-he:myriad-hebrew,adobe-clean,\"Source Sans Pro\",-apple-system,BlinkMacSystemFont,\"Segoe UI\",Roboto,Ubuntu,\"Trebuchet MS\",\"Lucida Grande\",sans-serif;--spectrum-global-font-font-family-zh:adobe-clean-han-traditional,source-han-traditional,\"MingLiu\",\"Heiti TC Light\",\"sans-serif\";--spectrum-global-font-font-family-zhhans:adobe-clean-han-simplified-c,source-han-simplified-c,\"SimSun\",\"Heiti SC Light\",\"sans-serif\";--spectrum-global-font-font-family-ko:adobe-clean-han-korean,source-han-korean,\"Malgun Gothic\",\"Apple Gothic\",\"sans-serif\";--spectrum-global-font-font-family-ja:adobe-clean-han-japanese,\"Hiragino Kaku Gothic ProN\",\"ヒラギノ角ゴ ProN W3\",\"Osaka\",YuGothic,\"Yu Gothic\",\"メイリオ\",Meiryo,\"MS Pゴシック\",\"MS PGothic\",\"sans-serif\";--spectrum-global-font-font-family-condensed:adobe-clean-han-traditional,source-han-traditional,\"MingLiu\",\"Heiti TC Light\",adobe-clean,\"Source Sans Pro\",-apple-system,BlinkMacSystemFont,\"Segoe UI\",Roboto,Ubuntu,\"Trebuchet MS\",\"Lucida Grande\",sans-serif;--spectrum-alias-loupe-entry-animation-duration:var(\n--spectrum-global-animation-duration-300\n);--spectrum-alias-loupe-exit-animation-duration:var(\n--spectrum-global-animation-duration-300\n);--spectrum-alias-heading-text-font-weight-regular:var(\n--spectrum-global-font-weight-black\n);--spectrum-alias-heading-text-font-weight-heavy:var(\n--spectrum-global-font-weight-black\n);--spectrum-alias-heading-text-line-height:var(\n--spectrum-global-font-line-height-small\n);--spectrum-alias-heading-text-font-weight-regular-strong:var(\n--spectrum-global-font-weight-black\n);--spectrum-alias-heading-text-font-weight-light:var(\n--spectrum-global-font-weight-light\n);--spectrum-alias-heading-text-font-weight-light-strong:var(\n--spectrum-global-font-weight-bold\n);--spectrum-alias-heading-text-font-weight-heavy-strong:var(\n--spectrum-global-font-weight-black\n);--spectrum-alias-heading-text-font-weight-quiet:var(\n--spectrum-global-font-weight-light\n);--spectrum-alias-heading-text-font-weight-quiet-strong:var(\n--spectrum-global-font-weight-bold\n);--spectrum-alias-heading-text-font-weight-strong:var(\n--spectrum-global-font-weight-black\n);--spectrum-alias-heading-text-font-weight-strong-strong:var(\n--spectrum-global-font-weight-black\n);--spectrum-alias-heading-margin-bottom:var(\n--spectrum-global-font-multiplier-25\n);--spectrum-alias-subheading-text-font-weight:var(\n--spectrum-global-font-weight-bold\n);--spectrum-alias-subheading-text-font-weight-strong:var(\n--spectrum-global-font-weight-black\n);--spectrum-alias-body-text-font-family:var(\n--spectrum-global-font-family-base\n);--spectrum-alias-body-text-line-height:var(\n--spectrum-global-font-line-height-medium\n);--spectrum-alias-body-text-font-weight:var(\n--spectrum-global-font-weight-regular\n);--spectrum-alias-body-text-font-weight-strong:var(\n--spectrum-global-font-weight-bold\n);--spectrum-alias-body-margin-bottom:var(\n--spectrum-global-font-multiplier-75\n);--spectrum-alias-detail-text-font-weight:var(\n--spectrum-global-font-weight-bold\n);--spectrum-alias-detail-text-font-weight-regular:var(\n--spectrum-global-font-weight-bold\n);--spectrum-alias-detail-text-font-weight-light:var(\n--spectrum-global-font-weight-regular\n);--spectrum-alias-detail-text-font-weight-strong:var(\n--spectrum-global-font-weight-black\n);--spectrum-alias-article-heading-text-font-weight:var(\n--spectrum-global-font-weight-bold\n);--spectrum-alias-article-heading-text-font-weight-strong:var(\n--spectrum-global-font-weight-black\n);--spectrum-alias-article-heading-text-font-weight-quiet:var(\n--spectrum-global-font-weight-regular\n);--spectrum-alias-article-heading-text-font-weight-quiet-strong:var(\n--spectrum-global-font-weight-bold\n);--spectrum-alias-article-body-text-font-weight:var(\n--spectrum-global-font-weight-regular\n);--spectrum-alias-article-body-text-font-weight-strong:var(\n--spectrum-global-font-weight-black\n);--spectrum-alias-article-subheading-text-font-weight:var(\n--spectrum-global-font-weight-bold\n);--spectrum-alias-article-subheading-text-font-weight-strong:var(\n--spectrum-global-font-weight-black\n);--spectrum-alias-article-detail-text-font-weight:var(\n--spectrum-global-font-weight-regular\n);--spectrum-alias-article-detail-text-font-weight-strong:var(\n--spectrum-global-font-weight-bold\n);--spectrum-alias-code-text-font-family:var(\n--spectrum-global-font-family-code\n);--spectrum-alias-code-text-font-weight-regular:var(\n--spectrum-global-font-weight-regular\n);--spectrum-alias-code-text-font-weight-strong:var(\n--spectrum-global-font-weight-bold\n);--spectrum-alias-code-text-line-height:var(\n--spectrum-global-font-line-height-medium\n);--spectrum-alias-code-margin-bottom:var(\n--spectrum-global-font-multiplier-0\n);--spectrum-alias-font-family-ar:var(--spectrum-global-font-font-family-ar);--spectrum-alias-font-family-he:var(--spectrum-global-font-font-family-he);--spectrum-alias-font-family-zh:var(--spectrum-global-font-font-family-zh);--spectrum-alias-font-family-zhhans:var(\n--spectrum-global-font-font-family-zhhans\n);--spectrum-alias-font-family-ko:var(--spectrum-global-font-font-family-ko);--spectrum-alias-font-family-ja:var(--spectrum-global-font-font-family-ja);--spectrum-alias-font-family-condensed:var(\n--spectrum-global-font-font-family-condensed\n);--spectrum-alias-button-text-line-height:var(\n--spectrum-global-font-line-height-small\n);--spectrum-alias-component-text-line-height:var(\n--spectrum-global-font-line-height-small\n);--spectrum-alias-han-component-text-line-height:var(\n--spectrum-global-font-line-height-medium\n);--spectrum-alias-serif-text-font-family:var(\n--spectrum-global-font-family-serif\n);--spectrum-alias-han-heading-text-line-height:var(\n--spectrum-global-font-line-height-medium\n);--spectrum-alias-han-heading-text-font-weight-regular:var(\n--spectrum-global-font-weight-bold\n);--spectrum-alias-han-heading-text-font-weight-regular-emphasis:var(\n--spectrum-global-font-weight-extra-bold\n);--spectrum-alias-han-heading-text-font-weight-regular-strong:var(\n--spectrum-global-font-weight-black\n);--spectrum-alias-han-heading-text-font-weight-quiet-strong:var(\n--spectrum-global-font-weight-bold\n);--spectrum-alias-han-heading-text-font-weight-light:var(\n--spectrum-global-font-weight-light\n);--spectrum-alias-han-heading-text-font-weight-light-emphasis:var(\n--spectrum-global-font-weight-regular\n);--spectrum-alias-han-heading-text-font-weight-light-strong:var(\n--spectrum-global-font-weight-bold\n);--spectrum-alias-han-heading-text-font-weight-heavy:var(\n--spectrum-global-font-weight-black\n);--spectrum-alias-han-heading-text-font-weight-heavy-emphasis:var(\n--spectrum-global-font-weight-black\n);--spectrum-alias-han-heading-text-font-weight-heavy-strong:var(\n--spectrum-global-font-weight-black\n);--spectrum-alias-han-body-text-line-height:var(\n--spectrum-global-font-line-height-large\n);--spectrum-alias-han-body-text-font-weight-regular:var(\n--spectrum-global-font-weight-regular\n);--spectrum-alias-han-body-text-font-weight-emphasis:var(\n--spectrum-global-font-weight-bold\n);--spectrum-alias-han-body-text-font-weight-strong:var(\n--spectrum-global-font-weight-black\n);--spectrum-alias-han-subheading-text-font-weight-regular:var(\n--spectrum-global-font-weight-bold\n);--spectrum-alias-han-subheading-text-font-weight-emphasis:var(\n--spectrum-global-font-weight-extra-bold\n);--spectrum-alias-han-subheading-text-font-weight-strong:var(\n--spectrum-global-font-weight-black\n);--spectrum-alias-han-detail-text-font-weight:var(\n--spectrum-global-font-weight-regular\n);--spectrum-alias-han-detail-text-font-weight-emphasis:var(\n--spectrum-global-font-weight-bold\n);--spectrum-alias-han-detail-text-font-weight-strong:var(\n--spectrum-global-font-weight-black\n)}:host,:root{--spectrum-alias-item-height-s:var(--spectrum-global-dimension-size-300);--spectrum-alias-item-height-m:var(--spectrum-global-dimension-size-400);--spectrum-alias-item-height-l:var(--spectrum-global-dimension-size-500);--spectrum-alias-item-height-xl:var(--spectrum-global-dimension-size-600);--spectrum-alias-item-rounded-border-radius-s:var(\n--spectrum-global-dimension-size-150\n);--spectrum-alias-item-rounded-border-radius-m:var(\n--spectrum-global-dimension-size-200\n);--spectrum-alias-item-rounded-border-radius-l:var(\n--spectrum-global-dimension-size-250\n);--spectrum-alias-item-rounded-border-radius-xl:var(\n--spectrum-global-dimension-size-300\n);--spectrum-alias-item-text-size-s:var(\n--spectrum-global-dimension-font-size-75\n);--spectrum-alias-item-text-size-m:var(\n--spectrum-global-dimension-font-size-100\n);--spectrum-alias-item-text-size-l:var(\n--spectrum-global-dimension-font-size-200\n);--spectrum-alias-item-text-size-xl:var(\n--spectrum-global-dimension-font-size-300\n);--spectrum-alias-item-text-padding-top-s:var(\n--spectrum-global-dimension-static-size-50\n);--spectrum-alias-item-text-padding-top-m:var(\n--spectrum-global-dimension-size-75\n);--spectrum-alias-item-text-padding-top-xl:var(\n--spectrum-global-dimension-size-150\n);--spectrum-alias-item-text-padding-bottom-m:var(\n--spectrum-global-dimension-size-115\n);--spectrum-alias-item-text-padding-bottom-l:var(\n--spectrum-global-dimension-size-130\n);--spectrum-alias-item-text-padding-bottom-xl:var(\n--spectrum-global-dimension-size-175\n);--spectrum-alias-item-icon-padding-top-s:var(\n--spectrum-global-dimension-size-50\n);--spectrum-alias-item-icon-padding-top-m:var(\n--spectrum-global-dimension-size-85\n);--spectrum-alias-item-icon-padding-top-l:var(\n--spectrum-global-dimension-size-125\n);--spectrum-alias-item-icon-padding-top-xl:var(\n--spectrum-global-dimension-size-160\n);--spectrum-alias-item-icon-padding-bottom-s:var(\n--spectrum-global-dimension-size-50\n);--spectrum-alias-item-icon-padding-bottom-m:var(\n--spectrum-global-dimension-size-85\n);--spectrum-alias-item-icon-padding-bottom-l:var(\n--spectrum-global-dimension-size-125\n);--spectrum-alias-item-icon-padding-bottom-xl:var(\n--spectrum-global-dimension-size-160\n);--spectrum-alias-item-padding-s:var(--spectrum-global-dimension-size-115);--spectrum-alias-item-padding-m:var(--spectrum-global-dimension-size-150);--spectrum-alias-item-padding-l:var(--spectrum-global-dimension-size-185);--spectrum-alias-item-padding-xl:var(--spectrum-global-dimension-size-225);--spectrum-alias-item-rounded-padding-s:var(\n--spectrum-global-dimension-size-150\n);--spectrum-alias-item-rounded-padding-m:var(\n--spectrum-global-dimension-size-200\n);--spectrum-alias-item-rounded-padding-l:var(\n--spectrum-global-dimension-size-250\n);--spectrum-alias-item-rounded-padding-xl:var(\n--spectrum-global-dimension-size-300\n);--spectrum-alias-item-icononly-padding-s:var(\n--spectrum-global-dimension-size-50\n);--spectrum-alias-item-icononly-padding-m:var(\n--spectrum-global-dimension-size-85\n);--spectrum-alias-item-icononly-padding-l:var(\n--spectrum-global-dimension-size-125\n);--spectrum-alias-item-icononly-padding-xl:var(\n--spectrum-global-dimension-size-160\n);--spectrum-alias-item-control-gap-s:var(\n--spectrum-global-dimension-size-115\n);--spectrum-alias-item-control-gap-m:var(\n--spectrum-global-dimension-size-125\n);--spectrum-alias-item-control-gap-l:var(\n--spectrum-global-dimension-size-130\n);--spectrum-alias-item-control-gap-xl:var(\n--spectrum-global-dimension-size-160\n);--spectrum-alias-item-workflow-icon-gap-s:var(\n--spectrum-global-dimension-size-85\n);--spectrum-alias-item-workflow-icon-gap-m:var(\n--spectrum-global-dimension-size-100\n);--spectrum-alias-item-workflow-icon-gap-l:var(\n--spectrum-global-dimension-size-115\n);--spectrum-alias-item-workflow-icon-gap-xl:var(\n--spectrum-global-dimension-size-125\n);--spectrum-alias-item-mark-gap-s:var(--spectrum-global-dimension-size-85);--spectrum-alias-item-mark-gap-m:var(--spectrum-global-dimension-size-100);--spectrum-alias-item-mark-gap-l:var(--spectrum-global-dimension-size-115);--spectrum-alias-item-mark-gap-xl:var(\n--spectrum-global-dimension-size-125\n);--spectrum-alias-item-ui-icon-gap-s:var(\n--spectrum-global-dimension-size-85\n);--spectrum-alias-item-ui-icon-gap-m:var(\n--spectrum-global-dimension-size-100\n);--spectrum-alias-item-ui-icon-gap-l:var(\n--spectrum-global-dimension-size-115\n);--spectrum-alias-item-ui-icon-gap-xl:var(\n--spectrum-global-dimension-size-125\n);--spectrum-alias-item-clearbutton-gap-s:var(\n--spectrum-global-dimension-size-50\n);--spectrum-alias-item-clearbutton-gap-m:var(\n--spectrum-global-dimension-size-85\n);--spectrum-alias-item-clearbutton-gap-l:var(\n--spectrum-global-dimension-size-125\n);--spectrum-alias-item-clearbutton-gap-xl:var(\n--spectrum-global-dimension-size-150\n);--spectrum-alias-item-workflow-padding-left-s:var(\n--spectrum-global-dimension-size-85\n);--spectrum-alias-item-workflow-padding-left-l:var(\n--spectrum-global-dimension-size-160\n);--spectrum-alias-item-workflow-padding-left-xl:var(\n--spectrum-global-dimension-size-185\n);--spectrum-alias-item-rounded-workflow-padding-left-s:var(\n--spectrum-global-dimension-size-125\n);--spectrum-alias-item-rounded-workflow-padding-left-l:var(\n--spectrum-global-dimension-size-225\n);--spectrum-alias-item-mark-padding-top-s:var(\n--spectrum-global-dimension-size-40\n);--spectrum-alias-item-mark-padding-top-l:var(\n--spectrum-global-dimension-size-115\n);--spectrum-alias-item-mark-padding-top-xl:var(\n--spectrum-global-dimension-size-130\n);--spectrum-alias-item-mark-padding-bottom-s:var(\n--spectrum-global-dimension-size-40\n);--spectrum-alias-item-mark-padding-bottom-l:var(\n--spectrum-global-dimension-size-115\n);--spectrum-alias-item-mark-padding-bottom-xl:var(\n--spectrum-global-dimension-size-130\n);--spectrum-alias-item-mark-padding-left-s:var(\n--spectrum-global-dimension-size-85\n);--spectrum-alias-item-mark-padding-left-l:var(\n--spectrum-global-dimension-size-160\n);--spectrum-alias-item-mark-padding-left-xl:var(\n--spectrum-global-dimension-size-185\n);--spectrum-alias-item-control-1-size-s:var(\n--spectrum-global-dimension-static-size-100\n);--spectrum-alias-item-control-1-size-m:var(\n--spectrum-global-dimension-size-100\n);--spectrum-alias-item-control-2-size-m:var(\n--spectrum-global-dimension-size-175\n);--spectrum-alias-item-control-2-size-l:var(\n--spectrum-global-dimension-size-200\n);--spectrum-alias-item-control-2-size-xl:var(\n--spectrum-global-dimension-size-225\n);--spectrum-alias-item-control-2-size-xxl:var(\n--spectrum-global-dimension-size-250\n);--spectrum-alias-item-control-2-border-radius-s:var(\n--spectrum-global-dimension-size-75\n);--spectrum-alias-item-control-2-border-radius-m:var(\n--spectrum-global-dimension-size-85\n);--spectrum-alias-item-control-2-border-radius-l:var(\n--spectrum-global-dimension-size-100\n);--spectrum-alias-item-control-2-border-radius-xl:var(\n--spectrum-global-dimension-size-115\n);--spectrum-alias-item-control-2-border-radius-xxl:var(\n--spectrum-global-dimension-size-125\n);--spectrum-alias-item-control-2-padding-s:var(\n--spectrum-global-dimension-size-75\n);--spectrum-alias-item-control-2-padding-m:var(\n--spectrum-global-dimension-size-115\n);--spectrum-alias-item-control-2-padding-l:var(\n--spectrum-global-dimension-size-150\n);--spectrum-alias-item-control-2-padding-xl:var(\n--spectrum-global-dimension-size-185\n);--spectrum-alias-item-control-3-height-m:var(\n--spectrum-global-dimension-size-175\n);--spectrum-alias-item-control-3-height-l:var(\n--spectrum-global-dimension-size-200\n);--spectrum-alias-item-control-3-height-xl:var(\n--spectrum-global-dimension-size-225\n);--spectrum-alias-item-control-3-border-radius-s:var(\n--spectrum-global-dimension-size-75\n);--spectrum-alias-item-control-3-border-radius-m:var(\n--spectrum-global-dimension-size-85\n);--spectrum-alias-item-control-3-border-radius-l:var(\n--spectrum-global-dimension-size-100\n);--spectrum-alias-item-control-3-border-radius-xl:var(\n--spectrum-global-dimension-size-115\n);--spectrum-alias-item-control-3-padding-s:var(\n--spectrum-global-dimension-size-75\n);--spectrum-alias-item-control-3-padding-m:var(\n--spectrum-global-dimension-size-115\n);--spectrum-alias-item-control-3-padding-l:var(\n--spectrum-global-dimension-size-150\n);--spectrum-alias-item-control-3-padding-xl:var(\n--spectrum-global-dimension-size-185\n);--spectrum-alias-item-mark-size-s:var(\n--spectrum-global-dimension-size-225\n);--spectrum-alias-item-mark-size-l:var(\n--spectrum-global-dimension-size-275\n);--spectrum-alias-item-mark-size-xl:var(\n--spectrum-global-dimension-size-325\n);--spectrum-alias-heading-xxxl-text-size:var(\n--spectrum-global-dimension-font-size-1300\n);--spectrum-alias-heading-xxl-text-size:var(\n--spectrum-global-dimension-font-size-1100\n);--spectrum-alias-heading-xl-text-size:var(\n--spectrum-global-dimension-font-size-900\n);--spectrum-alias-heading-l-text-size:var(\n--spectrum-global-dimension-font-size-700\n);--spectrum-alias-heading-m-text-size:var(\n--spectrum-global-dimension-font-size-500\n);--spectrum-alias-heading-s-text-size:var(\n--spectrum-global-dimension-font-size-300\n);--spectrum-alias-heading-xs-text-size:var(\n--spectrum-global-dimension-font-size-200\n);--spectrum-alias-heading-xxs-text-size:var(\n--spectrum-global-dimension-font-size-100\n);--spectrum-alias-heading-xxxl-margin-top:var(\n--spectrum-global-dimension-font-size-1200\n);--spectrum-alias-heading-xxl-margin-top:var(\n--spectrum-global-dimension-font-size-900\n);--spectrum-alias-heading-xl-margin-top:var(\n--spectrum-global-dimension-font-size-800\n);--spectrum-alias-heading-l-margin-top:var(\n--spectrum-global-dimension-font-size-600\n);--spectrum-alias-heading-m-margin-top:var(\n--spectrum-global-dimension-font-size-400\n);--spectrum-alias-heading-s-margin-top:var(\n--spectrum-global-dimension-font-size-200\n);--spectrum-alias-heading-xs-margin-top:var(\n--spectrum-global-dimension-font-size-100\n);--spectrum-alias-heading-xxs-margin-top:var(\n--spectrum-global-dimension-font-size-75\n);--spectrum-alias-heading-han-xxxl-text-size:var(\n--spectrum-global-dimension-font-size-1300\n);--spectrum-alias-heading-han-xxl-text-size:var(\n--spectrum-global-dimension-font-size-900\n);--spectrum-alias-heading-han-xl-text-size:var(\n--spectrum-global-dimension-font-size-800\n);--spectrum-alias-heading-han-l-text-size:var(\n--spectrum-global-dimension-font-size-600\n);--spectrum-alias-heading-han-m-text-size:var(\n--spectrum-global-dimension-font-size-400\n);--spectrum-alias-heading-han-s-text-size:var(\n--spectrum-global-dimension-font-size-300\n);--spectrum-alias-heading-han-xs-text-size:var(\n--spectrum-global-dimension-font-size-200\n);--spectrum-alias-heading-han-xxs-text-size:var(\n--spectrum-global-dimension-font-size-100\n);--spectrum-alias-heading-han-xxxl-margin-top:var(\n--spectrum-global-dimension-font-size-1200\n);--spectrum-alias-heading-han-xxl-margin-top:var(\n--spectrum-global-dimension-font-size-800\n);--spectrum-alias-heading-han-xl-margin-top:var(\n--spectrum-global-dimension-font-size-700\n);--spectrum-alias-heading-han-l-margin-top:var(\n--spectrum-global-dimension-font-size-500\n);--spectrum-alias-heading-han-m-margin-top:var(\n--spectrum-global-dimension-font-size-300\n);--spectrum-alias-heading-han-s-margin-top:var(\n--spectrum-global-dimension-font-size-200\n);--spectrum-alias-heading-han-xs-margin-top:var(\n--spectrum-global-dimension-font-size-100\n);--spectrum-alias-heading-han-xxs-margin-top:var(\n--spectrum-global-dimension-font-size-75\n);--spectrum-alias-component-border-radius:var(\n--spectrum-global-dimension-size-75\n);--spectrum-alias-component-border-radius-quiet:var(\n--spectrum-global-dimension-size-75\n);--spectrum-alias-component-focusring-gap:var(\n--spectrum-global-dimension-static-size-25\n);--spectrum-alias-component-focusring-gap-emphasized:var(\n--spectrum-global-dimension-static-size-25\n);--spectrum-alias-component-focusring-size:var(\n--spectrum-global-dimension-static-size-25\n);--spectrum-alias-component-focusring-size-emphasized:var(\n--spectrum-global-dimension-static-size-25\n);--spectrum-alias-component-focusring-border-radius:var(\n--spectrum-global-dimension-size-125\n);--spectrum-alias-input-focusring-gap:var(\n--spectrum-global-dimension-static-size-25\n);--spectrum-alias-input-quiet-focusline-gap:var(\n--spectrum-global-dimension-static-size-50\n);--spectrum-alias-border-radius-xsmall:var(\n--spectrum-global-dimension-size-25\n);--spectrum-alias-border-radius-small:var(\n--spectrum-global-dimension-size-40\n);--spectrum-alias-border-radius-regular:var(\n--spectrum-global-dimension-size-75\n);--spectrum-alias-border-radius-medium:var(\n--spectrum-global-dimension-size-125\n);--spectrum-alias-border-radius-large:var(\n--spectrum-global-dimension-size-150\n);--spectrum-alias-border-radius-xlarge:var(\n--spectrum-global-dimension-size-300\n);--spectrum-alias-control-two-size-s:var(\n--spectrum-global-dimension-size-175\n);--spectrum-alias-control-two-size-m:var(\n--spectrum-global-dimension-size-200\n);--spectrum-alias-control-two-size-l:var(\n--spectrum-global-dimension-size-225\n);--spectrum-alias-control-two-size-xl:var(\n--spectrum-global-dimension-size-250\n);--spectrum-alias-control-two-size-xxl:var(\n--spectrum-global-dimension-size-275\n);--spectrum-alias-control-two-border-radius-s:var(\n--spectrum-global-dimension-size-85\n);--spectrum-alias-control-two-border-radius-m:var(\n--spectrum-global-dimension-size-100\n);--spectrum-alias-control-two-border-radius-l:var(\n--spectrum-global-dimension-size-115\n);--spectrum-alias-control-two-border-radius-xl:var(\n--spectrum-global-dimension-size-125\n);--spectrum-alias-control-two-border-radius-xxl:var(\n--spectrum-global-dimension-size-130\n);--spectrum-alias-control-three-height-s:var(\n--spectrum-global-dimension-size-175\n);--spectrum-alias-control-three-height-m:var(\n--spectrum-global-dimension-size-200\n);--spectrum-alias-control-three-height-l:var(\n--spectrum-global-dimension-size-225\n);--spectrum-alias-control-three-height-xl:var(\n--spectrum-global-dimension-size-250\n);--spectrum-alias-control-three-width-s:var(\n--spectrum-global-dimension-size-300\n);--spectrum-alias-infieldbutton-icon-margin-y-s:var(\n--spectrum-global-dimension-size-10\n);--spectrum-alias-infieldbutton-icon-margin-y-m:var(\n--spectrum-global-dimension-size-40\n);--spectrum-alias-infieldbutton-icon-margin-y-l:var(\n--spectrum-global-dimension-size-75\n);--spectrum-alias-infieldbutton-icon-margin-y-xl:var(\n--spectrum-global-dimension-size-115\n);--spectrum-alias-infieldbutton-padding-s:var(\n--spectrum-global-dimension-size-50\n);--spectrum-alias-infieldbutton-padding-m:var(\n--spectrum-global-dimension-size-50\n);--spectrum-alias-infieldbutton-padding-l:var(\n--spectrum-global-dimension-size-50\n);--spectrum-alias-infieldbutton-padding-xl:var(\n--spectrum-global-dimension-size-50\n);--spectrum-alias-infieldbutton-border-radius:var(\n--spectrum-global-dimension-size-40\n);--spectrum-alias-infieldbutton-border-radius-sided:var(\n--spectrum-global-dimension-size-40\n);--spectrum-alias-infieldbutton-border-size:var(\n--spectrum-global-dimension-static-size-0\n);--spectrum-alias-infieldbutton-fill-padding-s:var(\n--spectrum-global-dimension-size-10\n);--spectrum-alias-infieldbutton-fill-padding-m:var(\n--spectrum-global-dimension-size-40\n);--spectrum-alias-infieldbutton-fill-padding-l:var(\n--spectrum-global-dimension-size-75\n);--spectrum-alias-infieldbutton-fill-padding-xl:var(\n--spectrum-global-dimension-size-115\n);--spectrum-alias-infieldbutton-full-height-s:var(\n--spectrum-global-dimension-size-200\n);--spectrum-alias-infieldbutton-full-height-m:var(\n--spectrum-global-dimension-size-300\n);--spectrum-alias-infieldbutton-full-height-l:var(\n--spectrum-global-dimension-size-400\n);--spectrum-alias-infieldbutton-full-height-xl:var(\n--spectrum-global-dimension-size-500\n);--spectrum-alias-infieldbutton-half-height-s:var(\n--spectrum-global-dimension-size-115\n);--spectrum-alias-infieldbutton-half-height-m:var(\n--spectrum-global-dimension-size-130\n);--spectrum-alias-infieldbutton-half-height-l:var(\n--spectrum-global-dimension-size-150\n);--spectrum-alias-infieldbutton-half-height-xl:var(\n--spectrum-global-dimension-size-185\n);--spectrum-alias-stepperbutton-gap:var(\n--spectrum-global-dimension-size-25\n);--spectrum-alias-stepperbutton-width-s:var(\n--spectrum-global-dimension-size-225\n);--spectrum-alias-stepperbutton-width-m:var(\n--spectrum-global-dimension-size-250\n);--spectrum-alias-stepperbutton-width-l:var(\n--spectrum-global-dimension-size-275\n);--spectrum-alias-stepperbutton-width-xl:var(\n--spectrum-global-dimension-size-325\n);--spectrum-alias-stepperbutton-icon-x-offset-s:var(\n--spectrum-global-dimension-size-50\n);--spectrum-alias-stepperbutton-icon-x-offset-m:var(\n--spectrum-global-dimension-size-65\n);--spectrum-alias-stepperbutton-icon-x-offset-l:var(\n--spectrum-global-dimension-size-65\n);--spectrum-alias-stepperbutton-icon-x-offset-xl:var(\n--spectrum-global-dimension-size-75\n);--spectrum-alias-stepperbutton-icon-y-offset-top-s:0;--spectrum-alias-stepperbutton-icon-y-offset-top-m:var(\n--spectrum-global-dimension-size-10\n);--spectrum-alias-stepperbutton-icon-y-offset-top-l:var(\n--spectrum-global-dimension-size-10\n);--spectrum-alias-stepperbutton-icon-y-offset-top-xl:var(\n--spectrum-global-dimension-size-10\n);--spectrum-alias-stepperbutton-icon-y-offset-bottom-s:0;--spectrum-alias-stepperbutton-icon-y-offset-bottom-m:0;--spectrum-alias-stepperbutton-icon-y-offset-bottom-l:0;--spectrum-alias-stepperbutton-icon-y-offset-bottom-xl:0;--spectrum-alias-stepperbutton-radius-touching:var(\n--spectrum-global-dimension-size-25\n);--spectrum-alias-clearbutton-icon-margin-s:var(\n--spectrum-global-dimension-size-50\n);--spectrum-alias-clearbutton-icon-margin-m:var(\n--spectrum-global-dimension-size-100\n);--spectrum-alias-clearbutton-icon-margin-l:var(\n--spectrum-global-dimension-size-130\n);--spectrum-alias-clearbutton-icon-margin-xl:var(\n--spectrum-global-dimension-size-175\n);--spectrum-alias-clearbutton-border-radius:var(\n--spectrum-global-dimension-size-150\n);--spectrum-alias-pickerbutton-icononly-padding-x-s:var(\n--spectrum-global-dimension-size-40\n);--spectrum-alias-pickerbutton-icononly-padding-x-m:var(\n--spectrum-global-dimension-size-75\n);--spectrum-alias-pickerbutton-icononly-padding-x-l:var(\n--spectrum-global-dimension-size-115\n);--spectrum-alias-pickerbutton-icononly-padding-x-xl:var(\n--spectrum-global-dimension-size-150\n);--spectrum-alias-pickerbutton-icon-margin-y-s:var(\n--spectrum-global-dimension-size-40\n);--spectrum-alias-pickerbutton-icon-margin-y-m:var(\n--spectrum-global-dimension-size-75\n);--spectrum-alias-pickerbutton-icon-margin-y-l:var(\n--spectrum-global-dimension-size-115\n);--spectrum-alias-pickerbutton-icon-margin-y-xl:var(\n--spectrum-global-dimension-size-150\n);--spectrum-alias-pickerbutton-label-padding-y-s:0;--spectrum-alias-pickerbutton-label-padding-y-m:var(\n--spectrum-global-dimension-size-40\n);--spectrum-alias-pickerbutton-label-padding-y-l:var(\n--spectrum-global-dimension-size-65\n);--spectrum-alias-pickerbutton-label-padding-y-xl:var(\n--spectrum-global-dimension-size-100\n);--spectrum-alias-pickerbutton-border-radius-rounded:var(\n--spectrum-global-dimension-size-150\n);--spectrum-alias-pickerbutton-border-radius-rounded-sided:var(\n--spectrum-global-dimension-size-150\n);--spectrum-alias-search-border-radius:var(\n--spectrum-global-dimension-size-300\n);--spectrum-alias-combobox-quiet-button-offset-x:var(\n--spectrum-global-dimension-size-50\n);--spectrum-alias-thumbnail-border-radius-small:var(\n--spectrum-global-dimension-size-75\n);--spectrum-alias-focus-ring-gap-small:var(\n--spectrum-global-dimension-static-size-25\n);--spectrum-alias-focus-ring-size-small:var(\n--spectrum-global-dimension-static-size-25\n);--spectrum-alias-input-border-size:var(\n--spectrum-global-dimension-static-size-25\n);--spectrum-alias-avatar-border-size:var(\n--spectrum-global-dimension-static-size-25\n);--spectrum-alias-actiongroup-button-gap:var(\n--spectrum-global-dimension-size-100\n);--spectrum-alias-actiongroup-button-gap-compact:var(\n--spectrum-global-dimension-size-25\n);--spectrum-alias-actiongroup-button-gap-quiet:var(\n--spectrum-global-dimension-size-100\n);--spectrum-alias-actiongroup-button-gap-quiet-compact:var(\n--spectrum-global-dimension-size-25\n);--spectrum-alias-search-padding-left-s:var(\n--spectrum-global-dimension-size-125\n);--spectrum-alias-search-padding-left-m:var(\n--spectrum-global-dimension-size-175\n);--spectrum-alias-search-padding-left-l:var(\n--spectrum-global-dimension-size-200\n);--spectrum-alias-search-padding-left-xl:var(\n--spectrum-global-dimension-size-225\n);--spectrum-alias-tag-border-radius:var(\n--spectrum-global-dimension-size-300\n);--spectrum-alias-tag-border-size-default:var(\n--spectrum-global-dimension-static-size-25\n);--spectrum-alias-tag-border-size-disabled:var(\n--spectrum-global-dimension-static-size-25\n);--spectrum-alias-tag-border-size-key-focus:var(\n--spectrum-global-dimension-static-size-25\n);--spectrum-alias-tag-padding-right-s:var(\n--spectrum-global-dimension-size-125\n);--spectrum-alias-tag-padding-right-m:var(\n--spectrum-global-dimension-size-130\n);--spectrum-alias-tag-padding-right-l:var(\n--spectrum-global-dimension-size-175\n);--spectrum-alias-tag-height-s:var(--spectrum-global-dimension-size-250);--spectrum-alias-tag-height-m:var(--spectrum-global-dimension-size-300);--spectrum-alias-tag-height-l:var(--spectrum-global-dimension-size-400);--spectrum-alias-tag-font-size-s:var(\n--spectrum-global-dimension-font-size-50\n);--spectrum-alias-tag-font-size-m:var(\n--spectrum-global-dimension-font-size-75\n);--spectrum-alias-tag-font-size-l:var(\n--spectrum-global-dimension-font-size-100\n);--spectrum-alias-tag-text-padding-top-m:var(\n--spectrum-global-dimension-size-50\n);--spectrum-alias-tag-text-padding-top-l:var(\n--spectrum-global-dimension-size-85\n);--spectrum-alias-tag-icon-size-s:var(--spectrum-global-dimension-size-175);--spectrum-alias-tag-icon-size-m:var(--spectrum-global-dimension-size-200);--spectrum-alias-tag-icon-margin-top-s:var(\n--spectrum-global-dimension-size-40\n);--spectrum-alias-tag-icon-margin-top-m:var(\n--spectrum-global-dimension-size-50\n);--spectrum-alias-tag-icon-margin-top-l:var(\n--spectrum-global-dimension-size-85\n);--spectrum-alias-tag-clearbutton-width-s:var(\n--spectrum-global-dimension-size-175\n);--spectrum-alias-tag-clearbutton-width-m:var(\n--spectrum-global-dimension-size-225\n);--spectrum-alias-tag-clearbutton-width-l:var(\n--spectrum-global-dimension-size-350\n);--spectrum-alias-tag-clearbutton-icon-margin-s:var(\n--spectrum-global-dimension-size-30\n);--spectrum-alias-tag-clearbutton-icon-margin-m:var(\n--spectrum-global-dimension-size-50\n);--spectrum-alias-tag-clearbutton-icon-margin-l:var(\n--spectrum-global-dimension-size-100\n);--spectrum-alias-tag-focusring-border-radius:var(\n--spectrum-global-dimension-size-300\n);--spectrum-alias-tag-focusring-gap:var(\n--spectrum-global-dimension-size-25\n);--spectrum-alias-colorloupe-width:var(\n--spectrum-global-dimension-static-size-450\n);--spectrum-alias-colorloupe-height:var(\n--spectrum-global-dimension-static-size-550\n);--spectrum-alias-search-border-radius-quiet:0;--spectrum-alias-percent-50:50%;--spectrum-alias-percent-70:70%;--spectrum-alias-percent-100:100%;--spectrum-alias-breakpoint-xsmall:304px;--spectrum-alias-breakpoint-small:768px;--spectrum-alias-breakpoint-medium:1280px;--spectrum-alias-breakpoint-large:1768px;--spectrum-alias-breakpoint-xlarge:2160px;--spectrum-alias-grid-columns:12;--spectrum-alias-grid-fluid-width:100%;--spectrum-alias-grid-fixed-max-width:1280px;--spectrum-alias-border-size-thin:var(\n--spectrum-global-dimension-static-size-10\n);--spectrum-alias-border-size-thick:var(\n--spectrum-global-dimension-static-size-25\n);--spectrum-alias-border-size-thicker:var(\n--spectrum-global-dimension-static-size-50\n);--spectrum-alias-border-size-thickest:var(\n--spectrum-global-dimension-static-size-100\n);--spectrum-alias-border-offset-thin:var(\n--spectrum-global-dimension-static-size-25\n);--spectrum-alias-border-offset-thick:var(\n--spectrum-global-dimension-static-size-50\n);--spectrum-alias-border-offset-thicker:var(\n--spectrum-global-dimension-static-size-100\n);--spectrum-alias-border-offset-thickest:var(\n--spectrum-global-dimension-static-size-200\n);--spectrum-alias-grid-baseline:var(\n--spectrum-global-dimension-static-size-100\n);--spectrum-alias-grid-gutter-xsmall:var(\n--spectrum-global-dimension-static-size-200\n);--spectrum-alias-grid-gutter-small:var(\n--spectrum-global-dimension-static-size-300\n);--spectrum-alias-grid-gutter-medium:var(\n--spectrum-global-dimension-static-size-400\n);--spectrum-alias-grid-gutter-large:var(\n--spectrum-global-dimension-static-size-500\n);--spectrum-alias-grid-gutter-xlarge:var(\n--spectrum-global-dimension-static-size-600\n);--spectrum-alias-grid-margin-xsmall:var(\n--spectrum-global-dimension-static-size-200\n);--spectrum-alias-grid-margin-small:var(\n--spectrum-global-dimension-static-size-300\n);--spectrum-alias-grid-margin-medium:var(\n--spectrum-global-dimension-static-size-400\n);--spectrum-alias-grid-margin-large:var(\n--spectrum-global-dimension-static-size-500\n);--spectrum-alias-grid-margin-xlarge:var(\n--spectrum-global-dimension-static-size-600\n);--spectrum-alias-grid-layout-region-margin-bottom-xsmall:var(\n--spectrum-global-dimension-static-size-200\n);--spectrum-alias-grid-layout-region-margin-bottom-small:var(\n--spectrum-global-dimension-static-size-300\n);--spectrum-alias-grid-layout-region-margin-bottom-medium:var(\n--spectrum-global-dimension-static-size-400\n);--spectrum-alias-grid-layout-region-margin-bottom-large:var(\n--spectrum-global-dimension-static-size-500\n);--spectrum-alias-grid-layout-region-margin-bottom-xlarge:var(\n--spectrum-global-dimension-static-size-600\n);--spectrum-alias-radial-reaction-size-default:var(\n--spectrum-global-dimension-static-size-550\n);--spectrum-alias-focus-ring-gap:var(\n--spectrum-global-dimension-static-size-25\n);--spectrum-alias-focus-ring-size:var(\n--spectrum-global-dimension-static-size-25\n);--spectrum-alias-dropshadow-blur:var(--spectrum-global-dimension-size-50);--spectrum-alias-dropshadow-offset-y:var(\n--spectrum-global-dimension-size-10\n);--spectrum-alias-font-size-default:var(\n--spectrum-global-dimension-font-size-100\n);--spectrum-alias-layout-label-gap-size:var(\n--spectrum-global-dimension-size-100\n);--spectrum-alias-pill-button-text-size:var(\n--spectrum-global-dimension-font-size-100\n);--spectrum-alias-pill-button-text-baseline:var(\n--spectrum-global-dimension-static-size-150\n);--spectrum-alias-single-line-height:var(\n--spectrum-global-dimension-size-400\n);--spectrum-alias-single-line-width:var(\n--spectrum-global-dimension-size-2400\n);--spectrum-alias-workflow-icon-size-s:var(\n--spectrum-global-dimension-size-200\n);--spectrum-alias-workflow-icon-size-m:var(\n--spectrum-global-dimension-size-225\n);--spectrum-alias-workflow-icon-size-xl:var(\n--spectrum-global-dimension-size-275\n);--spectrum-alias-ui-icon-alert-size-75:var(\n--spectrum-global-dimension-size-200\n);--spectrum-alias-ui-icon-alert-size-100:var(\n--spectrum-global-dimension-size-225\n);--spectrum-alias-ui-icon-alert-size-200:var(\n--spectrum-global-dimension-size-250\n);--spectrum-alias-ui-icon-alert-size-300:var(\n--spectrum-global-dimension-size-275\n);--spectrum-alias-ui-icon-triplegripper-size-100-height:var(\n--spectrum-global-dimension-size-100\n);--spectrum-alias-ui-icon-doublegripper-size-100-width:var(\n--spectrum-global-dimension-size-200\n);--spectrum-alias-ui-icon-singlegripper-size-100-width:var(\n--spectrum-global-dimension-size-300\n);--spectrum-alias-ui-icon-cornertriangle-size-75:var(\n--spectrum-global-dimension-size-65\n);--spectrum-alias-ui-icon-cornertriangle-size-200:var(\n--spectrum-global-dimension-size-75\n);--spectrum-alias-ui-icon-asterisk-size-75:var(\n--spectrum-global-dimension-static-size-100\n);--spectrum-alias-ui-icon-asterisk-size-100:var(\n--spectrum-global-dimension-size-100\n);--spectrum-alias-avatar-size-50:var(--spectrum-global-dimension-size-200);--spectrum-alias-avatar-size-75:var(--spectrum-global-dimension-size-225);--spectrum-alias-avatar-size-200:var(--spectrum-global-dimension-size-275);--spectrum-alias-avatar-size-300:var(--spectrum-global-dimension-size-325);--spectrum-alias-avatar-size-500:var(--spectrum-global-dimension-size-400);--spectrum-alias-avatar-size-700:var(--spectrum-global-dimension-size-500);--spectrum-alias-tag-border-size:var(\n--spectrum-global-dimension-static-size-25\n);--spectrum-alias-tag-icon-margin-right-s:var(\n--spectrum-global-dimension-size-85\n);--spectrum-alias-tag-icon-margin-right-m:var(\n--spectrum-global-dimension-size-100\n);--spectrum-alias-tag-icon-margin-right-l:var(\n--spectrum-global-dimension-size-115\n);--spectrum-alias-tag-focusring-size:var(\n--spectrum-global-dimension-size-25\n);--spectrum-alias-tag-focusring-gap-selected:var(\n--spectrum-global-dimension-size-25\n)}:host,:root{--spectrum-alias-colorhandle-outer-border-color:rgba(0,0,0,.42);--spectrum-alias-component-text-color-selected-default:var(\n--spectrum-global-color-gray-50\n);--spectrum-alias-component-text-color-selected-hover:var(\n--spectrum-alias-component-text-color-selected-default\n);--spectrum-alias-component-text-color-selected-down:var(\n--spectrum-alias-component-text-color-selected-default\n);--spectrum-alias-component-text-color-selected-key-focus:var(\n--spectrum-alias-component-text-color-selected-default\n);--spectrum-alias-component-text-color-selected-mouse-focus:var(\n--spectrum-alias-component-text-color-selected-default\n);--spectrum-alias-component-icon-color-default:var(\n--spectrum-global-color-gray-800\n);--spectrum-alias-component-icon-color-selected:var(\n--spectrum-global-color-gray-50\n);--spectrum-alias-component-background-color-default:var(\n--spectrum-global-color-gray-200\n);--spectrum-alias-component-background-color-hover:var(\n--spectrum-global-color-gray-300\n);--spectrum-alias-component-background-color-down:var(\n--spectrum-global-color-gray-400\n);--spectrum-alias-component-background-color-key-focus:var(\n--spectrum-global-color-gray-300\n);--spectrum-alias-component-background-color-quiet-hover:var(\n--spectrum-alias-component-background-color-hover\n);--spectrum-alias-component-background-color-quiet-down:var(\n--spectrum-alias-component-background-color-down\n);--spectrum-alias-component-background-color-quiet-key-focus:var(\n--spectrum-alias-component-background-color-key-focus\n);--spectrum-alias-component-background-color-selected-default:var(\n--spectrum-global-color-gray-800\n);--spectrum-alias-component-background-color-selected-hover:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-component-background-color-selected-down:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-component-background-color-selected-key-focus:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-component-border-color-default:var(\n--spectrum-alias-component-background-color-default\n);--spectrum-alias-component-border-color-hover:var(\n--spectrum-alias-component-background-color-hover\n);--spectrum-alias-component-border-color-down:var(\n--spectrum-alias-component-background-color-down\n);--spectrum-alias-component-border-color-key-focus:var(\n--spectrum-alias-component-background-color-key-focus\n);--spectrum-alias-component-border-color-selected-default:var(\n--spectrum-alias-component-background-color-selected-default\n);--spectrum-alias-component-border-color-selected-hover:var(\n--spectrum-alias-component-background-color-selected-hover\n);--spectrum-alias-component-border-color-selected-down:var(\n--spectrum-alias-component-background-color-selected-down\n);--spectrum-alias-component-border-color-selected-key-focus:var(\n--spectrum-alias-component-background-color-selected-key-focus\n);--spectrum-alias-component-border-color-quiet-key-focus:var(\n--spectrum-alias-component-background-color-quiet-default\n);--spectrum-alias-component-border-color-quiet-selected-default:var(\n--spectrum-alias-component-background-color-selected-default\n);--spectrum-alias-component-border-color-quiet-selected-hover:var(\n--spectrum-alias-component-background-color-quiet-selected-hover\n);--spectrum-alias-component-border-color-quiet-selected-down:var(\n--spectrum-alias-component-background-color-quiet-selected-down\n);--spectrum-alias-component-border-color-quiet-selected-key-focus:var(\n--spectrum-alias-component-background-color-quiet-selected-key-focus\n);--spectrum-alias-toggle-background-color-default:var(\n--spectrum-global-color-gray-800\n);--spectrum-alias-toggle-background-color-hover:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-toggle-background-color-down:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-toggle-background-color-key-focus:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-toggle-border-color-default:var(\n--spectrum-global-color-gray-800\n);--spectrum-alias-toggle-border-color-hover:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-toggle-border-color-down:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-toggle-border-color-key-focus:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-toggle-icon-color-selected:var(\n--spectrum-global-color-gray-50\n);--spectrum-alias-tag-border-color-default:var(\n--spectrum-global-color-gray-300\n);--spectrum-alias-tag-border-color-hover:var(\n--spectrum-global-color-gray-400\n);--spectrum-alias-tag-border-color-down:var(\n--spectrum-global-color-gray-500\n);--spectrum-alias-tag-border-color-key-focus:var(\n--spectrum-global-color-gray-400\n);--spectrum-alias-tag-border-color-disabled-default:var(\n--spectrum-global-color-gray-200\n);--spectrum-alias-tag-border-color-error-key-focus:var(\n--spectrum-semantic-negative-color-default\n);--spectrum-alias-tag-focusring-border-color-key-focus:var(\n--spectrum-alias-focus-ring-color\n);--spectrum-alias-tag-background-color-disabled:var(\n--spectrum-global-color-gray-100\n);--spectrum-alias-tag-background-color-default:var(\n--spectrum-global-color-gray-100\n);--spectrum-alias-tag-background-color-hover:var(\n--spectrum-global-color-gray-300\n);--spectrum-alias-tag-background-color-down:var(\n--spectrum-global-color-gray-400\n);--spectrum-alias-tag-background-color-key-focus:var(\n--spectrum-global-color-gray-300\n);--spectrum-alias-tag-background-color-error-default:var(\n--spectrum-alias-tag-background-color-default\n);--spectrum-alias-tag-background-color-error-hover:var(\n--spectrum-alias-tag-background-color-hover\n);--spectrum-alias-tag-background-color-error-down:var(\n--spectrum-alias-tag-background-color-down\n);--spectrum-alias-tag-background-color-error-key-focus:var(\n--spectrum-alias-tag-background-color-key-focus\n);--spectrum-alias-avatar-border-color-disabled:var(\n--spectrum-alias-background-color-transparent\n);--spectrum-alias-avatar-border-color-selected-default:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-avatar-border-color-selected-hover:var(\n--spectrum-alias-component-background-color-selected-hover\n);--spectrum-alias-avatar-border-color-selected-down:var(\n--spectrum-alias-component-background-color-selected-hover\n);--spectrum-alias-avatar-border-color-selected-key-focus:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-link-primary-text-color-default:var(\n--spectrum-global-color-indigo-600\n);--spectrum-alias-link-primary-text-color-hover:var(\n--spectrum-global-color-indigo-600\n);--spectrum-alias-link-primary-text-color-down:var(\n--spectrum-global-color-indigo-700\n);--spectrum-alias-link-primary-text-color-key-focus:var(\n--spectrum-alias-text-color-key-focus\n);--spectrum-alias-link-secondary-text-color-default:var(\n--spectrum-alias-text-color\n);--spectrum-alias-link-secondary-text-color-hover:var(\n--spectrum-alias-link-primary-text-color-hover\n);--spectrum-alias-link-secondary-text-color-down:var(\n--spectrum-alias-link-primary-text-color-down\n);--spectrum-alias-link-secondary-text-color-key-focus:var(\n--spectrum-alias-link-primary-text-color-key-focus\n);--spectrum-alias-button-primary-background-color-default:var(\n--spectrum-alias-button-primary-border-color-default\n);--spectrum-alias-button-primary-text-color-default:var(\n--spectrum-alias-button-primary-text-color-hover\n);--spectrum-alias-button-primary-icon-color-default:var(\n--spectrum-alias-button-primary-text-color-default\n);--spectrum-alias-button-secondary-background-color-default:var(\n--spectrum-alias-button-secondary-border-color-default\n);--spectrum-alias-button-secondary-text-color-default:var(\n--spectrum-alias-button-secondary-text-color-hover\n);--spectrum-alias-button-secondary-icon-color-default:var(\n--spectrum-alias-button-secondary-text-color-default\n);--spectrum-alias-button-negative-background-color-default:var(\n--spectrum-alias-button-negative-border-color-default\n);--spectrum-alias-button-negative-text-color-default:var(\n--spectrum-alias-button-negative-text-color-hover\n);--spectrum-alias-button-negative-icon-color-default:var(\n--spectrum-alias-button-negative-text-color-default\n);--spectrum-alias-transparent-blue-background-color-hover:rgba(66,70,203,.15);--spectrum-alias-transparent-blue-background-color-down:rgba(54,58,178,.15);--spectrum-alias-transparent-blue-background-color-key-focus:rgba(66,70,203,.15);--spectrum-alias-input-border-color-default:var(\n--spectrum-alias-border-color\n);--spectrum-alias-input-border-color-hover:var(\n--spectrum-alias-border-color-hover\n);--spectrum-alias-input-border-color-down:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-input-border-color-mouse-focus:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-input-border-color-key-focus:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-input-border-color-invalid-key-focus:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-yellow-background-color-default:var(\n--spectrum-global-color-static-yellow-400\n);--spectrum-alias-yellow-background-color-hover:var(\n--spectrum-global-color-static-yellow-500\n);--spectrum-alias-yellow-background-color-key-focus:var(\n--spectrum-global-color-static-yellow-500\n);--spectrum-alias-yellow-background-color-down:var(\n--spectrum-global-color-static-yellow-600\n);--spectrum-alias-infieldbutton-background-color:transparent;--spectrum-alias-infieldbutton-fill-border-color-default:transparent;--spectrum-alias-infieldbutton-fill-border-color-hover:transparent;--spectrum-alias-infieldbutton-fill-border-color-down:transparent;--spectrum-alias-infieldbutton-fill-border-color-mouse-focus:transparent;--spectrum-alias-infieldbutton-fill-border-color-key-focus:transparent;--spectrum-alias-infieldbutton-fill-loudnessHigh-background-color-default:var(\n--spectrum-global-color-gray-200\n);--spectrum-alias-infieldbutton-fill-loudnessHigh-background-color-hover:var(\n--spectrum-global-color-gray-300\n);--spectrum-alias-infieldbutton-fill-loudnessHigh-background-color-down:var(\n--spectrum-global-color-gray-400\n);--spectrum-alias-infieldbutton-fill-loudnessHigh-background-color-key-focus:var(\n--spectrum-global-color-gray-300\n);--spectrum-alias-infieldbutton-fill-loudnessHigh-background-color-disabled:var(\n--spectrum-alias-component-background-color-disabled\n);--spectrum-alias-infieldbutton-fill-loudnessMedium-background-color-default:var(\n--spectrum-alias-infieldbutton-fill-loudnessHigh-background-color-default\n);--spectrum-alias-infieldbutton-fill-loudnessMedium-background-color-hover:var(\n--spectrum-alias-infieldbutton-fill-loudnessHigh-background-color-hover\n);--spectrum-alias-infieldbutton-fill-loudnessMedium-background-color-down:var(\n--spectrum-alias-infieldbutton-fill-loudnessHigh-background-color-down\n);--spectrum-alias-infieldbutton-fill-loudnessMedium-background-color-key-focus:var(\n--spectrum-alias-infieldbutton-fill-loudnessHigh-background-color-key-focus\n);--spectrum-alias-infieldbutton-fill-loudnessMedium-background-color-disabled:transparent;--spectrum-alias-infieldbutton-fill-loudnessLow-background-color-default:transparent;--spectrum-alias-infieldbutton-fill-loudnessLow-background-color-hover:var(\n--spectrum-alias-infieldbutton-fill-loudnessHigh-background-color-hover\n);--spectrum-alias-infieldbutton-fill-loudnessLow-background-color-down:var(\n--spectrum-alias-infieldbutton-fill-loudnessHigh-background-color-down\n);--spectrum-alias-infieldbutton-fill-loudnessLow-background-color-key-focus:var(\n--spectrum-alias-infieldbutton-fill-loudnessHigh-background-color-key-focus\n);--spectrum-alias-infieldbutton-fill-loudnessLow-background-color-disabled:transparent;--spectrum-alias-actionbutton-staticBlack-border-color-default:transparent;--spectrum-alias-actionbutton-staticBlack-background-color-default:rgba(0,0,0,.1);--spectrum-alias-actionbutton-staticBlack-border-color-hover:transparent;--spectrum-alias-actionbutton-staticBlack-background-color-hover:rgba(0,0,0,.25);--spectrum-alias-actionbutton-staticBlack-border-color-down:transparent;--spectrum-alias-actionbutton-staticBlack-background-color-down:rgba(0,0,0,.4);--spectrum-alias-actionbutton-staticBlack-border-color-key-focus:transparent;--spectrum-alias-actionbutton-staticBlack-background-color-key-focus:rgba(0,0,0,.25);--spectrum-alias-actionbutton-staticBlack-border-color-disabled:transparent;--spectrum-alias-actionbutton-staticBlack-background-color-disabled:transparent;--spectrum-alias-actionbutton-staticBlack-border-color-disabled-selected:transparent;--spectrum-alias-actionbutton-staticBlack-background-color-disabled-selected:rgba(0,0,0,.1);--spectrum-alias-actionbutton-staticWhite-border-color-default:transparent;--spectrum-alias-actionbutton-staticWhite-background-color-default:hsla(0,0%,100%,.1);--spectrum-alias-actionbutton-staticWhite-border-color-hover:transparent;--spectrum-alias-actionbutton-staticWhite-background-color-hover:hsla(0,0%,100%,.25);--spectrum-alias-actionbutton-staticWhite-border-color-down:transparent;--spectrum-alias-actionbutton-staticWhite-background-color-down:hsla(0,0%,100%,.4);--spectrum-alias-actionbutton-staticWhite-border-color-key-focus:transparent;--spectrum-alias-actionbutton-staticWhite-background-color-key-focus:hsla(0,0%,100%,.25);--spectrum-alias-actionbutton-staticWhite-border-color-disabled:transparent;--spectrum-alias-actionbutton-staticWhite-background-color-disabled:transparent;--spectrum-alias-actionbutton-staticWhite-border-color-disabled-selected:transparent;--spectrum-alias-actionbutton-staticWhite-background-color-disabled-selected:hsla(0,0%,100%,.1);--spectrum-alias-thumbnail-darksquare-background-color:var(\n--spectrum-global-color-gray-200\n);--spectrum-alias-thumbnail-lightsquare-background-color:var(\n--spectrum-global-color-static-white\n);--spectrum-alias-tabs-divider-background-color-default:var(\n--spectrum-global-color-gray-200\n);--spectrum-alias-tabs-divider-background-color-quiet:var(\n--spectrum-alias-background-color-transparent\n);--spectrum-alias-tabitem-text-color-default:var(\n--spectrum-global-color-gray-700\n);--spectrum-alias-tabitem-text-color-hover:var(\n--spectrum-alias-text-color-hover\n);--spectrum-alias-tabitem-text-color-down:var(\n--spectrum-alias-text-color-down\n);--spectrum-alias-tabitem-text-color-key-focus:var(\n--spectrum-alias-text-color-hover\n);--spectrum-alias-tabitem-text-color-mouse-focus:var(\n--spectrum-alias-text-color-hover\n);--spectrum-alias-tabitem-text-color-selected-default:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-tabitem-text-color-selected-hover:var(\n--spectrum-alias-tabitem-text-color-selected-default\n);--spectrum-alias-tabitem-text-color-selected-down:var(\n--spectrum-alias-tabitem-text-color-selected-default\n);--spectrum-alias-tabitem-text-color-selected-key-focus:var(\n--spectrum-alias-tabitem-text-color-selected-default\n);--spectrum-alias-tabitem-text-color-selected-mouse-focus:var(\n--spectrum-alias-tabitem-text-color-selected-default\n);--spectrum-alias-tabitem-text-color-emphasized:var(\n--spectrum-alias-tabitem-text-color-default\n);--spectrum-alias-tabitem-text-color-emphasized-selected-default:var(\n--spectrum-global-color-indigo-600\n);--spectrum-alias-tabitem-text-color-emphasized-selected-hover:var(\n--spectrum-alias-tabitem-text-color-emphasized-selected-default\n);--spectrum-alias-tabitem-text-color-emphasized-selected-down:var(\n--spectrum-alias-tabitem-text-color-emphasized-selected-default\n);--spectrum-alias-tabitem-text-color-emphasized-selected-key-focus:var(\n--spectrum-alias-tabitem-text-color-emphasized-selected-default\n);--spectrum-alias-tabitem-text-color-emphasized-selected-mouse-focus:var(\n--spectrum-alias-tabitem-text-color-emphasized-selected-default\n);--spectrum-alias-tabitem-selection-indicator-color-default:var(\n--spectrum-alias-tabitem-text-color-default\n);--spectrum-alias-tabitem-selection-indicator-color-emphasized:var(\n--spectrum-alias-tabitem-text-color-emphasized-selected-default\n);--spectrum-alias-tabitem-icon-color-disabled:var(\n--spectrum-alias-text-color-disabled\n);--spectrum-alias-tabitem-icon-color-default:var(\n--spectrum-alias-tabitem-text-color-default\n);--spectrum-alias-tabitem-icon-color-hover:var(\n--spectrum-alias-tabitem-text-color-hover\n);--spectrum-alias-tabitem-icon-color-down:var(\n--spectrum-alias-tabitem-text-color-down\n);--spectrum-alias-tabitem-icon-color-key-focus:var(\n--spectrum-alias-tabitem-text-color-hover\n);--spectrum-alias-tabitem-icon-color-mouse-focus:var(\n--spectrum-alias-tabitem-text-color-down\n);--spectrum-alias-tabitem-icon-color-selected:var(\n--spectrum-alias-tabitem-text-color-selected-default\n);--spectrum-alias-tabitem-icon-color-emphasized:var(\n--spectrum-alias-tabitem-text-color-default\n);--spectrum-alias-tabitem-icon-color-emphasized-selected:var(\n--spectrum-alias-tabitem-text-color-emphasized-selected-default\n);--spectrum-alias-transparent-blue-background-color-mouse-focus:var(\n--spectrum-alias-transparent-blue-background-color-hover\n);--spectrum-alias-transparent-blue-background-color:var(\n--spectrum-alias-component-text-color-default\n);--spectrum-alias-transparent-red-background-color-hover:rgba(206,15,11,.15);--spectrum-alias-transparent-red-background-color-down:rgba(182,0,0,.3);--spectrum-alias-transparent-red-background-color-key-focus:var(\n--spectrum-alias-transparent-red-background-color-hover\n);--spectrum-alias-transparent-red-background-color-mouse-focus:var(\n--spectrum-alias-transparent-red-background-color-hover\n);--spectrum-alias-transparent-red-background-color:var(\n--spectrum-alias-component-text-color-default\n);--spectrum-alias-component-text-color-disabled:var(\n--spectrum-global-color-gray-500\n);--spectrum-alias-component-text-color-default:var(\n--spectrum-global-color-gray-800\n);--spectrum-alias-component-text-color-hover:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-component-text-color-down:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-component-text-color-key-focus:var(\n--spectrum-alias-component-text-color-hover\n);--spectrum-alias-component-text-color-mouse-focus:var(\n--spectrum-alias-component-text-color-hover\n);--spectrum-alias-component-text-color:var(\n--spectrum-alias-component-text-color-default\n);--spectrum-alias-component-text-color-selected:var(\n--spectrum-alias-component-text-color-selected-default\n);--spectrum-alias-component-text-color-emphasized-selected-default:var(\n--spectrum-global-color-static-white\n);--spectrum-alias-component-text-color-emphasized-selected-hover:var(\n--spectrum-alias-component-text-color-emphasized-selected-default\n);--spectrum-alias-component-text-color-emphasized-selected-down:var(\n--spectrum-alias-component-text-color-emphasized-selected-default\n);--spectrum-alias-component-text-color-emphasized-selected-key-focus:var(\n--spectrum-alias-component-text-color-emphasized-selected-default\n);--spectrum-alias-component-text-color-emphasized-selected-mouse-focus:var(\n--spectrum-alias-component-text-color-emphasized-selected-default\n);--spectrum-alias-component-text-color-emphasized-selected:var(\n--spectrum-alias-component-text-color-emphasized-selected-default\n);--spectrum-alias-component-text-color-error-default:var(\n--spectrum-semantic-negative-text-color-small\n);--spectrum-alias-component-text-color-error-hover:var(\n--spectrum-semantic-negative-text-color-small-hover\n);--spectrum-alias-component-text-color-error-down:var(\n--spectrum-semantic-negative-text-color-small-down\n);--spectrum-alias-component-text-color-error-key-focus:var(\n--spectrum-semantic-negative-text-color-small-key-focus\n);--spectrum-alias-component-text-color-error-mouse-focus:var(\n--spectrum-semantic-negative-text-color-small-key-focus\n);--spectrum-alias-component-text-color-error:var(\n--spectrum-alias-component-text-color-error-default\n);--spectrum-alias-component-icon-color-disabled:var(\n--spectrum-alias-icon-color-disabled\n);--spectrum-alias-component-icon-color-hover:var(\n--spectrum-alias-icon-color-hover\n);--spectrum-alias-component-icon-color-down:var(\n--spectrum-alias-icon-color-down\n);--spectrum-alias-component-icon-color-key-focus:var(\n--spectrum-alias-icon-color-hover\n);--spectrum-alias-component-icon-color-mouse-focus:var(\n--spectrum-alias-icon-color-down\n);--spectrum-alias-component-icon-color:var(\n--spectrum-alias-component-icon-color-default\n);--spectrum-alias-component-icon-color-emphasized-selected-default:var(\n--spectrum-global-color-static-white\n);--spectrum-alias-component-icon-color-emphasized-selected-hover:var(\n--spectrum-alias-component-icon-color-emphasized-selected-default\n);--spectrum-alias-component-icon-color-emphasized-selected-down:var(\n--spectrum-alias-component-icon-color-emphasized-selected-default\n);--spectrum-alias-component-icon-color-emphasized-selected-key-focus:var(\n--spectrum-alias-component-icon-color-emphasized-selected-default\n);--spectrum-alias-component-icon-color-emphasized-selected:var(\n--spectrum-alias-component-icon-color-emphasized-selected-default\n);--spectrum-alias-component-background-color-disabled:var(\n--spectrum-global-color-gray-200\n);--spectrum-alias-component-background-color-quiet-disabled:var(\n--spectrum-alias-background-color-transparent\n);--spectrum-alias-component-background-color-quiet-selected-disabled:var(\n--spectrum-alias-component-background-color-disabled\n);--spectrum-alias-component-background-color:var(\n--spectrum-alias-component-background-color-default\n);--spectrum-alias-component-background-color-selected:var(\n--spectrum-alias-component-background-color-selected-default\n);--spectrum-alias-component-background-color-quiet-default:var(\n--spectrum-alias-background-color-transparent\n);--spectrum-alias-component-background-color-quiet:var(\n--spectrum-alias-component-background-color-quiet-default\n);--spectrum-alias-component-background-color-quiet-selected-default:var(\n--spectrum-alias-component-background-color-selected-default\n);--spectrum-alias-component-background-color-quiet-selected-hover:var(\n--spectrum-alias-component-background-color-selected-hover\n);--spectrum-alias-component-background-color-quiet-selected-down:var(\n--spectrum-alias-component-background-color-selected-down\n);--spectrum-alias-component-background-color-quiet-selected-key-focus:var(\n--spectrum-alias-component-background-color-selected-key-focus\n);--spectrum-alias-component-background-color-quiet-selected:var(\n--spectrum-alias-component-background-color-selected-default\n);--spectrum-alias-component-background-color-emphasized-selected-default:var(\n--spectrum-semantic-cta-background-color-default\n);--spectrum-alias-component-background-color-emphasized-selected-hover:var(\n--spectrum-semantic-cta-background-color-hover\n);--spectrum-alias-component-background-color-emphasized-selected-down:var(\n--spectrum-semantic-cta-background-color-down\n);--spectrum-alias-component-background-color-emphasized-selected-key-focus:var(\n--spectrum-semantic-cta-background-color-key-focus\n);--spectrum-alias-component-background-color-emphasized-selected:var(\n--spectrum-alias-component-background-color-emphasized-selected-default\n);--spectrum-alias-component-border-color-disabled:var(\n--spectrum-alias-border-color-disabled\n);--spectrum-alias-component-border-color-quiet-disabled:var(\n--spectrum-alias-border-color-transparent\n);--spectrum-alias-component-border-color:var(\n--spectrum-alias-component-border-color-default\n);--spectrum-alias-component-border-color-selected:var(\n--spectrum-alias-component-border-color-selected-default\n);--spectrum-alias-component-border-color-quiet-default:var(\n--spectrum-alias-border-color-transparent\n);--spectrum-alias-component-border-color-quiet-hover:var(\n--spectrum-alias-border-color-transparent\n);--spectrum-alias-component-border-color-quiet-down:var(\n--spectrum-alias-border-color-transparent\n);--spectrum-alias-component-border-color-quiet:var(\n--spectrum-alias-component-border-color-quiet-default\n);--spectrum-alias-component-border-color-quiet-selected:var(\n--spectrum-alias-component-background-color-selected-default\n);--spectrum-alias-component-border-color-emphasized-selected-default:var(\n--spectrum-semantic-cta-background-color-default\n);--spectrum-alias-component-border-color-emphasized-selected-hover:var(\n--spectrum-semantic-cta-background-color-hover\n);--spectrum-alias-component-border-color-emphasized-selected-down:var(\n--spectrum-semantic-cta-background-color-down\n);--spectrum-alias-component-border-color-emphasized-selected-key-focus:var(\n--spectrum-semantic-cta-background-color-key-focus\n);--spectrum-alias-component-border-color-emphasized-selected:var(\n--spectrum-alias-component-border-color-emphasized-selected-default\n);--spectrum-alias-tag-border-color-error-default:var(\n--spectrum-semantic-negative-color-default\n);--spectrum-alias-tag-border-color-error-hover:var(\n--spectrum-semantic-negative-color-hover\n);--spectrum-alias-tag-border-color-error-down:var(\n--spectrum-semantic-negative-color-hover\n);--spectrum-alias-tag-border-color-error-selected:var(\n--spectrum-semantic-negative-color-default\n);--spectrum-alias-tag-border-color-selected:var(\n--spectrum-alias-tag-background-color-selected-default\n);--spectrum-alias-tag-border-color:var(\n--spectrum-alias-tag-border-color-default\n);--spectrum-alias-tag-border-color-disabled:var(\n--spectrum-alias-border-color-disabled\n);--spectrum-alias-tag-border-color-error:var(\n--spectrum-alias-tag-border-color-error-default\n);--spectrum-alias-tag-text-color-default:var(\n--spectrum-alias-label-text-color\n);--spectrum-alias-tag-text-color-hover:var(\n--spectrum-alias-text-color-hover\n);--spectrum-alias-tag-text-color-down:var(--spectrum-alias-text-color-down);--spectrum-alias-tag-text-color-key-focus:var(\n--spectrum-alias-text-color-hover\n);--spectrum-alias-tag-text-color-disabled:var(\n--spectrum-global-color-gray-500\n);--spectrum-alias-tag-text-color:var(\n--spectrum-alias-tag-text-color-default\n);--spectrum-alias-tag-text-color-error-default:var(\n--spectrum-global-color-red-600\n);--spectrum-alias-tag-text-color-error-hover:var(\n--spectrum-global-color-red-700\n);--spectrum-alias-tag-text-color-error-down:var(\n--spectrum-global-color-red-700\n);--spectrum-alias-tag-text-color-error-key-focus:var(\n--spectrum-global-color-red-700\n);--spectrum-alias-tag-text-color-error:var(\n--spectrum-alias-tag-text-color-error-default\n);--spectrum-alias-tag-text-color-selected:var(\n--spectrum-global-color-gray-50\n);--spectrum-alias-tag-icon-color-default:var(--spectrum-alias-icon-color);--spectrum-alias-tag-icon-color-hover:var(\n--spectrum-alias-icon-color-hover\n);--spectrum-alias-tag-icon-color-down:var(--spectrum-alias-icon-color-down);--spectrum-alias-tag-icon-color-key-focus:var(\n--spectrum-alias-icon-color-hover\n);--spectrum-alias-tag-icon-color-disabled:var(\n--spectrum-alias-icon-color-disabled\n);--spectrum-alias-tag-icon-color:var(\n--spectrum-alias-tag-icon-color-default\n);--spectrum-alias-tag-icon-color-error:var(--spectrum-global-color-red-600);--spectrum-alias-tag-icon-color-selected:var(\n--spectrum-global-color-gray-50\n);--spectrum-alias-tag-background-color:var(\n--spectrum-alias-tag-background-color-default\n);--spectrum-alias-tag-background-color-error:var(\n--spectrum-alias-tag-background-color-error-default\n);--spectrum-alias-tag-background-color-error-selected-default:var(\n--spectrum-semantic-negative-color-default\n);--spectrum-alias-tag-background-color-error-selected-hover:var(\n--spectrum-semantic-negative-color-hover\n);--spectrum-alias-tag-background-color-error-selected-down:var(\n--spectrum-semantic-negative-color-hover\n);--spectrum-alias-tag-background-color-error-selected-key-focus:var(\n--spectrum-global-color-red-600\n);--spectrum-alias-tag-background-color-error-selected:var(\n--spectrum-alias-tag-background-color-error-selected-default\n);--spectrum-alias-tag-background-color-selected-default:var(\n--spectrum-global-color-gray-700\n);--spectrum-alias-tag-background-color-selected-hover:var(\n--spectrum-global-color-gray-800\n);--spectrum-alias-tag-background-color-selected-down:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-tag-background-color-selected-key-focus:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-tag-background-color-selected:var(\n--spectrum-alias-tag-background-color-selected-default\n);--spectrum-alias-tag-focusring-border-color-default:transparent;--spectrum-alias-tag-focusring-border-color-disabled:transparent;--spectrum-alias-tag-focusring-border-color-selected-key-focus:var(\n--spectrum-alias-focus-ring-color\n);--spectrum-alias-tag-focusring-border-color:var(\n--spectrum-alias-tag-focusring-border-color-default\n);--spectrum-alias-avatar-border-color:var(\n--spectrum-alias-avatar-border-color-default\n);--spectrum-alias-avatar-border-color-selected:var(\n--spectrum-alias-avatar-border-color-selected-default\n);--spectrum-alias-toggle-background-color:var(\n--spectrum-alias-toggle-background-color-default\n);--spectrum-alias-toggle-background-color-emphasized-selected-default:var(\n--spectrum-semantic-cta-background-color-default\n);--spectrum-alias-toggle-background-color-emphasized-selected-hover:var(\n--spectrum-semantic-cta-background-color-hover\n);--spectrum-alias-toggle-background-color-emphasized-selected-down:var(\n--spectrum-semantic-cta-background-color-down\n);--spectrum-alias-toggle-background-color-emphasized-selected-key-focus:var(\n--spectrum-semantic-cta-background-color-key-focus\n);--spectrum-alias-toggle-background-color-emphasized-selected:var(\n--spectrum-alias-toggle-background-color-emphasized-selected-default\n);--spectrum-alias-toggle-border-color:var(\n--spectrum-alias-toggle-border-color-default\n);--spectrum-alias-toggle-icon-color-emphasized-selected:var(\n--spectrum-alias-component-icon-color-emphasized-selected-default\n);--spectrum-alias-button-primary-background-color-hover:var(\n--spectrum-global-color-gray-800\n);--spectrum-alias-button-primary-background-color-down:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-button-primary-background-color-key-focus:var(\n--spectrum-global-color-gray-800\n);--spectrum-alias-button-primary-background-color:var(\n--spectrum-alias-button-primary-background-color-default\n);--spectrum-alias-button-primary-border-color-default:var(\n--spectrum-global-color-gray-800\n);--spectrum-alias-button-primary-border-color-hover:var(\n--spectrum-alias-button-primary-background-color-hover\n);--spectrum-alias-button-primary-border-color-down:var(\n--spectrum-alias-button-primary-background-color-down\n);--spectrum-alias-button-primary-border-color-key-focus:var(\n--spectrum-alias-button-primary-background-color-key-focus\n);--spectrum-alias-button-primary-border-color:var(\n--spectrum-alias-button-primary-border-color-default\n);--spectrum-alias-button-primary-text-color-hover:var(\n--spectrum-global-color-gray-50\n);--spectrum-alias-button-primary-text-color-down:var(\n--spectrum-global-color-gray-50\n);--spectrum-alias-button-primary-text-color-key-focus:var(\n--spectrum-global-color-gray-50\n);--spectrum-alias-button-primary-text-color:var(\n--spectrum-alias-button-primary-text-color-default\n);--spectrum-alias-button-primary-icon-color-hover:var(\n--spectrum-alias-button-primary-text-color-hover\n);--spectrum-alias-button-primary-icon-color-down:var(\n--spectrum-alias-button-primary-text-color-down\n);--spectrum-alias-button-primary-icon-color-key-focus:var(\n--spectrum-alias-button-primary-text-color-key-focus\n);--spectrum-alias-button-primary-icon-color:var(\n--spectrum-alias-button-primary-icon-color-default\n);--spectrum-alias-button-secondary-background-color-hover:var(\n--spectrum-global-color-gray-700\n);--spectrum-alias-button-secondary-background-color-down:var(\n--spectrum-global-color-gray-800\n);--spectrum-alias-button-secondary-background-color-key-focus:var(\n--spectrum-global-color-gray-700\n);--spectrum-alias-button-secondary-background-color:var(\n--spectrum-alias-button-secondary-background-color-default\n);--spectrum-alias-button-secondary-border-color-default:var(\n--spectrum-global-color-gray-700\n);--spectrum-alias-button-secondary-border-color-hover:var(\n--spectrum-alias-button-secondary-background-color-hover\n);--spectrum-alias-button-secondary-border-color-down:var(\n--spectrum-alias-button-secondary-background-color-down\n);--spectrum-alias-button-secondary-border-color-key-focus:var(\n--spectrum-alias-button-secondary-background-color-key-focus\n);--spectrum-alias-button-secondary-border-color:var(\n--spectrum-alias-button-secondary-border-color-default\n);--spectrum-alias-button-secondary-text-color-hover:var(\n--spectrum-global-color-gray-50\n);--spectrum-alias-button-secondary-text-color-down:var(\n--spectrum-global-color-gray-50\n);--spectrum-alias-button-secondary-text-color-key-focus:var(\n--spectrum-global-color-gray-50\n);--spectrum-alias-button-secondary-text-color:var(\n--spectrum-alias-button-secondary-text-color-default\n);--spectrum-alias-button-secondary-icon-color-hover:var(\n--spectrum-alias-button-secondary-text-color-hover\n);--spectrum-alias-button-secondary-icon-color-down:var(\n--spectrum-alias-button-secondary-text-color-down\n);--spectrum-alias-button-secondary-icon-color-key-focus:var(\n--spectrum-alias-button-secondary-text-color-key-focus\n);--spectrum-alias-button-secondary-icon-color:var(\n--spectrum-alias-button-secondary-icon-color-default\n);--spectrum-alias-button-negative-background-color-hover:var(\n--spectrum-semantic-negative-text-color-small\n);--spectrum-alias-button-negative-background-color-down:var(\n--spectrum-global-color-red-700\n);--spectrum-alias-button-negative-background-color-key-focus:var(\n--spectrum-semantic-negative-text-color-small\n);--spectrum-alias-button-negative-background-color:var(\n--spectrum-alias-button-negative-background-color-default\n);--spectrum-alias-button-negative-border-color-default:var(\n--spectrum-semantic-negative-text-color-small\n);--spectrum-alias-button-negative-border-color-hover:var(\n--spectrum-semantic-negative-text-color-small\n);--spectrum-alias-button-negative-border-color-down:var(\n--spectrum-global-color-red-700\n);--spectrum-alias-button-negative-border-color-key-focus:var(\n--spectrum-semantic-negative-text-color-small\n);--spectrum-alias-button-negative-border-color:var(\n--spectrum-alias-button-negative-border-color-default\n);--spectrum-alias-button-negative-text-color-hover:var(\n--spectrum-global-color-gray-50\n);--spectrum-alias-button-negative-text-color-down:var(\n--spectrum-global-color-gray-50\n);--spectrum-alias-button-negative-text-color-key-focus:var(\n--spectrum-global-color-gray-50\n);--spectrum-alias-button-negative-text-color:var(\n--spectrum-alias-button-negative-text-color-default\n);--spectrum-alias-button-negative-icon-color-hover:var(\n--spectrum-alias-button-negative-text-color-hover\n);--spectrum-alias-button-negative-icon-color-down:var(\n--spectrum-alias-button-negative-text-color-down\n);--spectrum-alias-button-negative-icon-color-key-focus:var(\n--spectrum-alias-button-negative-text-color-key-focus\n);--spectrum-alias-button-negative-icon-color:var(\n--spectrum-alias-button-negative-icon-color-default\n);--spectrum-alias-input-border-color-disabled:var(\n--spectrum-alias-border-color-transparent\n);--spectrum-alias-input-border-color-quiet-disabled:var(\n--spectrum-alias-border-color-mid\n);--spectrum-alias-input-border-color:var(\n--spectrum-alias-input-border-color-default\n);--spectrum-alias-input-border-color-invalid-default:var(\n--spectrum-semantic-negative-color-default\n);--spectrum-alias-input-border-color-invalid-hover:var(\n--spectrum-semantic-negative-color-hover\n);--spectrum-alias-input-border-color-invalid-down:var(\n--spectrum-semantic-negative-color-down\n);--spectrum-alias-input-border-color-invalid-mouse-focus:var(\n--spectrum-semantic-negative-color-hover\n);--spectrum-alias-input-border-color-invalid:var(\n--spectrum-alias-input-border-color-invalid-default\n);--spectrum-alias-background-color-yellow-default:var(\n--spectrum-global-color-static-yellow-600\n);--spectrum-alias-background-color-yellow-hover:var(\n--spectrum-global-color-static-yellow-700\n);--spectrum-alias-background-color-yellow-key-focus:var(\n--spectrum-global-color-static-yellow-700\n);--spectrum-alias-background-color-yellow-down:var(\n--spectrum-global-color-static-yellow-800\n);--spectrum-alias-background-color-yellow:var(\n--spectrum-alias-background-color-yellow-default\n);--spectrum-alias-infieldbutton-fill-loudnessLow-border-color-disabled:transparent;--spectrum-alias-infieldbutton-fill-loudnessMedium-border-color-disabled:transparent;--spectrum-alias-infieldbutton-fill-loudnessHigh-border-color-disabled:var(\n--spectrum-alias-component-background-color-disabled\n);--spectrum-alias-tabitem-text-color:var(\n--spectrum-alias-tabitem-text-color-default\n);--spectrum-alias-tabitem-text-color-selected:var(\n--spectrum-alias-tabitem-text-color-selected-default\n);--spectrum-alias-tabitem-text-color-emphasized-selected:var(\n--spectrum-alias-tabitem-text-color-emphasized-selected-default\n);--spectrum-alias-tabitem-icon-color:var(\n--spectrum-alias-tabitem-text-color-default\n);--spectrum-alias-background-color-default:var(\n--spectrum-global-color-gray-100\n);--spectrum-alias-background-color-disabled:var(\n--spectrum-global-color-gray-200\n);--spectrum-alias-background-color-transparent:transparent;--spectrum-alias-background-color-overbackground-down:hsla(0,0%,100%,.2);--spectrum-alias-background-color-quiet-overbackground-hover:hsla(0,0%,100%,.1);--spectrum-alias-background-color-quiet-overbackground-down:hsla(0,0%,100%,.2);--spectrum-alias-background-color-overbackground-disabled:hsla(0,0%,100%,.1);--spectrum-alias-background-color-quickactions-overlay:rgba(0,0,0,.2);--spectrum-alias-placeholder-text-color:var(\n--spectrum-global-color-gray-800\n);--spectrum-alias-placeholder-text-color-hover:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-placeholder-text-color-down:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-placeholder-text-color-selected:var(\n--spectrum-global-color-gray-800\n);--spectrum-alias-label-text-color:var(--spectrum-global-color-gray-700);--spectrum-alias-text-color:var(--spectrum-global-color-gray-800);--spectrum-alias-text-color-hover:var(--spectrum-global-color-gray-900);--spectrum-alias-text-color-down:var(--spectrum-global-color-gray-900);--spectrum-alias-text-color-key-focus:var(\n--spectrum-global-color-blue-600\n);--spectrum-alias-text-color-mouse-focus:var(\n--spectrum-global-color-blue-600\n);--spectrum-alias-text-color-disabled:var(--spectrum-global-color-gray-500);--spectrum-alias-text-color-invalid:var(--spectrum-global-color-red-500);--spectrum-alias-text-color-selected:var(--spectrum-global-color-blue-600);--spectrum-alias-text-color-selected-neutral:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-text-color-overbackground:var(\n--spectrum-global-color-static-white\n);--spectrum-alias-text-color-overbackground-disabled:hsla(0,0%,100%,.2);--spectrum-alias-text-color-quiet-overbackground-disabled:hsla(0,0%,100%,.2);--spectrum-alias-heading-text-color:var(--spectrum-global-color-gray-900);--spectrum-alias-link-primary-text-color:var(\n--spectrum-alias-link-primary-text-color-default\n);--spectrum-alias-link-secondary-text-color:var(\n--spectrum-alias-link-secondary-text-color-default\n);--spectrum-alias-border-color:var(--spectrum-global-color-gray-400);--spectrum-alias-border-color-hover:var(--spectrum-global-color-gray-500);--spectrum-alias-border-color-down:var(--spectrum-global-color-gray-500);--spectrum-alias-border-color-key-focus:var(\n--spectrum-global-color-blue-400\n);--spectrum-alias-border-color-mouse-focus:var(\n--spectrum-global-color-blue-500\n);--spectrum-alias-border-color-disabled:var(\n--spectrum-global-color-gray-200\n);--spectrum-alias-border-color-extralight:var(\n--spectrum-global-color-gray-100\n);--spectrum-alias-border-color-light:var(--spectrum-global-color-gray-200);--spectrum-alias-border-color-mid:var(--spectrum-global-color-gray-300);--spectrum-alias-border-color-dark:var(--spectrum-global-color-gray-400);--spectrum-alias-border-color-darker-default:var(\n--spectrum-global-color-gray-600\n);--spectrum-alias-border-color-darker-hover:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-border-color-darker-down:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-border-color-transparent:transparent;--spectrum-alias-border-color-translucent-dark:rgba(0,0,0,.05);--spectrum-alias-border-color-translucent-darker:rgba(0,0,0,.1);--spectrum-alias-focus-color:var(--spectrum-global-color-blue-400);--spectrum-alias-focus-ring-color:var(--spectrum-alias-focus-color);--spectrum-alias-track-color-default:var(--spectrum-global-color-gray-400);--spectrum-alias-track-fill-color-overbackground:var(\n--spectrum-global-color-static-white\n);--spectrum-alias-track-color-disabled:var(\n--spectrum-global-color-gray-300\n);--spectrum-alias-track-color-overbackground:hsla(0,0%,100%,.2);--spectrum-alias-icon-color:var(--spectrum-global-color-gray-700);--spectrum-alias-icon-color-overbackground:var(\n--spectrum-global-color-static-white\n);--spectrum-alias-icon-color-hover:var(--spectrum-global-color-gray-900);--spectrum-alias-icon-color-down:var(--spectrum-global-color-gray-900);--spectrum-alias-icon-color-key-focus:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-icon-color-disabled:var(--spectrum-global-color-gray-400);--spectrum-alias-icon-color-overbackground-disabled:hsla(0,0%,100%,.2);--spectrum-alias-icon-color-quiet-overbackground-disabled:hsla(0,0%,100%,.15);--spectrum-alias-icon-color-selected-neutral:var(\n--spectrum-global-color-gray-900\n);--spectrum-alias-icon-color-selected-neutral-subdued:var(\n--spectrum-global-color-gray-800\n);--spectrum-alias-icon-color-selected:var(--spectrum-global-color-blue-500);--spectrum-alias-icon-color-selected-hover:var(\n--spectrum-global-color-blue-600\n);--spectrum-alias-icon-color-selected-down:var(\n--spectrum-global-color-blue-700\n);--spectrum-alias-icon-color-selected-focus:var(\n--spectrum-global-color-blue-600\n);--spectrum-alias-image-opacity-disabled:var(\n--spectrum-global-color-opacity-30\n);--spectrum-alias-toolbar-background-color:var(\n--spectrum-global-color-gray-100\n);--spectrum-alias-code-highlight-color-default:var(\n--spectrum-global-color-gray-800\n);--spectrum-alias-code-highlight-background-color:var(\n--spectrum-global-color-gray-75\n);--spectrum-alias-code-highlight-color-keyword:var(\n--spectrum-global-color-fuchsia-600\n);--spectrum-alias-code-highlight-color-section:var(\n--spectrum-global-color-red-600\n);--spectrum-alias-code-highlight-color-literal:var(\n--spectrum-global-color-blue-600\n);--spectrum-alias-code-highlight-color-attribute:var(\n--spectrum-global-color-seafoam-600\n);--spectrum-alias-code-highlight-color-class:var(\n--spectrum-global-color-magenta-600\n);--spectrum-alias-code-highlight-color-variable:var(\n--spectrum-global-color-purple-600\n);--spectrum-alias-code-highlight-color-title:var(\n--spectrum-global-color-indigo-600\n);--spectrum-alias-code-highlight-color-string:var(\n--spectrum-global-color-fuchsia-600\n);--spectrum-alias-code-highlight-color-function:var(\n--spectrum-global-color-blue-600\n);--spectrum-alias-code-highlight-color-comment:var(\n--spectrum-global-color-gray-700\n);--spectrum-alias-categorical-color-1:var(\n--spectrum-global-color-static-seafoam-200\n);--spectrum-alias-categorical-color-2:var(\n--spectrum-global-color-static-indigo-700\n);--spectrum-alias-categorical-color-3:var(\n--spectrum-global-color-static-orange-500\n);--spectrum-alias-categorical-color-4:var(\n--spectrum-global-color-static-magenta-500\n);--spectrum-alias-categorical-color-5:var(\n--spectrum-global-color-static-indigo-200\n);--spectrum-alias-categorical-color-6:var(\n--spectrum-global-color-static-celery-200\n);--spectrum-alias-categorical-color-7:var(\n--spectrum-global-color-static-blue-500\n);--spectrum-alias-categorical-color-8:var(\n--spectrum-global-color-static-purple-800\n);--spectrum-alias-categorical-color-9:var(\n--spectrum-global-color-static-yellow-500\n);--spectrum-alias-categorical-color-10:var(\n--spectrum-global-color-static-orange-700\n);--spectrum-alias-categorical-color-11:var(\n--spectrum-global-color-static-green-600\n);--spectrum-alias-categorical-color-12:var(\n--spectrum-global-color-static-chartreuse-300\n);--spectrum-alias-categorical-color-13:var(\n--spectrum-global-color-static-blue-200\n);--spectrum-alias-categorical-color-14:var(\n--spectrum-global-color-static-fuchsia-500\n);--spectrum-alias-categorical-color-15:var(\n--spectrum-global-color-static-magenta-200\n);--spectrum-alias-categorical-color-16:var(\n--spectrum-global-color-static-yellow-200\n)}:host,:root{font-family:var(--spectrum-alias-body-text-font-family);font-size:var(--spectrum-alias-font-size-default)}:host:lang(ar),:root:lang(ar){font-family:var(--spectrum-alias-font-family-ar)}:host:lang(he),:root:lang(he){font-family:var(--spectrum-alias-font-family-he)}:host:lang(zh-Hans),:root:lang(zh-Hans){font-family:var(--spectrum-alias-font-family-zhhans)}:host:lang(zh-Hant),:root:lang(zh-Hant){font-family:var(--spectrum-alias-font-family-zh)}:host:lang(zh),:root:lang(zh){font-family:var(--spectrum-alias-font-family-zh)}:host:lang(ko),:root:lang(ko){font-family:var(--spectrum-alias-font-family-ko)}:host:lang(ja),:root:lang(ja){font-family:var(--spectrum-alias-font-family-ja)}:host{display:block}#scale,#theme{height:100%;width:100%}\n`;\nexport default styles;"]}
|
package/src/express/themes.d.ts
DELETED
package/src/express/themes.js
DELETED
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
Copyright 2020 Adobe. All rights reserved.
|
|
3
|
-
This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
4
|
-
you may not use this file except in compliance with the License. You may obtain a copy
|
|
5
|
-
of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
6
|
-
|
|
7
|
-
Unless required by applicable law or agreed to in writing, software distributed under
|
|
8
|
-
the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
9
|
-
OF ANY KIND, either express or implied. See the License for the specific language
|
|
10
|
-
governing permissions and limitations under the License.
|
|
11
|
-
*/
|
|
12
|
-
import './core.js';
|
|
13
|
-
import '../../express/theme-light.js';
|
|
14
|
-
import '../../express/theme-dark.js';
|
|
15
|
-
import '../../express/scale-medium.js';
|
|
16
|
-
import '../../express/scale-large.js';
|
|
17
|
-
//# sourceMappingURL=themes.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"themes.js","sourceRoot":"","sources":["themes.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AAEF,OAAO,WAAW,CAAC;AACnB,OAAO,8BAA8B,CAAC;AACtC,OAAO,6BAA6B,CAAC;AACrC,OAAO,+BAA+B,CAAC;AACvC,OAAO,8BAA8B,CAAC","sourcesContent":["/*\nCopyright 2020 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*/\n\nimport './core.js';\nimport '../../express/theme-light.js';\nimport '../../express/theme-dark.js';\nimport '../../express/scale-medium.js';\nimport '../../express/scale-large.js';\n"]}
|
package/test/theme-lazy.test.js
DELETED
|
@@ -1,119 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
Copyright 2020 Adobe. All rights reserved.
|
|
3
|
-
This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
4
|
-
you may not use this file except in compliance with the License. You may obtain a copy
|
|
5
|
-
of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
6
|
-
|
|
7
|
-
Unless required by applicable law or agreed to in writing, software distributed under
|
|
8
|
-
the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
9
|
-
OF ANY KIND, either express or implied. See the License for the specific language
|
|
10
|
-
governing permissions and limitations under the License.
|
|
11
|
-
*/
|
|
12
|
-
import '../sp-theme.js';
|
|
13
|
-
import { Theme } from '../';
|
|
14
|
-
import coreStyles from '../src/theme.css.js';
|
|
15
|
-
import lightStyles from '../src/theme-light.css.js';
|
|
16
|
-
import lightestStyles from '../src/theme-lightest.css.js';
|
|
17
|
-
import darkStyles from '../src/theme-dark.css.js';
|
|
18
|
-
import darkestStyles from '../src/theme-darkest.css.js';
|
|
19
|
-
import largeStyles from '../src/scale-large.css.js';
|
|
20
|
-
import mediumStyles from '../src/scale-medium.css.js';
|
|
21
|
-
import { elementUpdated, expect, fixture, html } from '@open-wc/testing';
|
|
22
|
-
describe('Themes - lazy', () => {
|
|
23
|
-
beforeEach(() => {
|
|
24
|
-
Theme.themeFragmentsByKind.clear();
|
|
25
|
-
// Core is registered by default in `theme.ts`
|
|
26
|
-
Theme.registerThemeFragment('spectrum', 'theme', coreStyles);
|
|
27
|
-
});
|
|
28
|
-
after(() => {
|
|
29
|
-
Theme.registerThemeFragment('light', 'color', lightStyles);
|
|
30
|
-
Theme.registerThemeFragment('lightest', 'color', lightestStyles);
|
|
31
|
-
Theme.registerThemeFragment('dark', 'color', darkStyles);
|
|
32
|
-
Theme.registerThemeFragment('darkest', 'color', darkestStyles);
|
|
33
|
-
Theme.registerThemeFragment('large', 'scale', largeStyles);
|
|
34
|
-
Theme.registerThemeFragment('medium', 'scale', mediumStyles);
|
|
35
|
-
});
|
|
36
|
-
it('loads w/ no themes and none set', async () => {
|
|
37
|
-
const el = await fixture(html `
|
|
38
|
-
<sp-theme></sp-theme>
|
|
39
|
-
`);
|
|
40
|
-
await elementUpdated(el);
|
|
41
|
-
if (el.shadowRoot.adoptedStyleSheets) {
|
|
42
|
-
expect(el.shadowRoot.adoptedStyleSheets.length).to.equal(1);
|
|
43
|
-
}
|
|
44
|
-
else {
|
|
45
|
-
expect([...el.shadowRoot.querySelectorAll('style')].length).to.equal(1);
|
|
46
|
-
}
|
|
47
|
-
expect(el.color).to.equal('');
|
|
48
|
-
expect(el.scale).to.equal('');
|
|
49
|
-
});
|
|
50
|
-
it('loads w/ themes and none set', async () => {
|
|
51
|
-
const el = await fixture(html `
|
|
52
|
-
<sp-theme></sp-theme>
|
|
53
|
-
`);
|
|
54
|
-
await elementUpdated(el);
|
|
55
|
-
Theme.registerThemeFragment('light', 'color', lightStyles);
|
|
56
|
-
Theme.registerThemeFragment('medium', 'scale', mediumStyles);
|
|
57
|
-
await elementUpdated(el);
|
|
58
|
-
if (el.shadowRoot.adoptedStyleSheets) {
|
|
59
|
-
expect(el.shadowRoot.adoptedStyleSheets.length).to.equal(1);
|
|
60
|
-
}
|
|
61
|
-
else {
|
|
62
|
-
expect([...el.shadowRoot.querySelectorAll('style')].length).to.equal(1);
|
|
63
|
-
}
|
|
64
|
-
expect(el.color).to.equal('light');
|
|
65
|
-
expect(el.scale).to.equal('medium');
|
|
66
|
-
});
|
|
67
|
-
it('loads w/ no themes', async () => {
|
|
68
|
-
const el = await fixture(html `
|
|
69
|
-
<sp-theme color="lightest" scale="large"></sp-theme>
|
|
70
|
-
`);
|
|
71
|
-
await elementUpdated(el);
|
|
72
|
-
if (el.shadowRoot.adoptedStyleSheets) {
|
|
73
|
-
expect(el.shadowRoot.adoptedStyleSheets.length).to.equal(1);
|
|
74
|
-
}
|
|
75
|
-
else {
|
|
76
|
-
expect([...el.shadowRoot.querySelectorAll('style')].length).to.equal(1);
|
|
77
|
-
}
|
|
78
|
-
});
|
|
79
|
-
it('loads w/ not enough themes', async () => {
|
|
80
|
-
const el = await fixture(html `
|
|
81
|
-
<sp-theme color="lightest" scale="large"></sp-theme>
|
|
82
|
-
`);
|
|
83
|
-
await elementUpdated(el);
|
|
84
|
-
Theme.registerThemeFragment('light', 'color', lightStyles);
|
|
85
|
-
Theme.registerThemeFragment('medium', 'scale', mediumStyles);
|
|
86
|
-
await elementUpdated(el);
|
|
87
|
-
if (el.shadowRoot.adoptedStyleSheets) {
|
|
88
|
-
expect(el.shadowRoot.adoptedStyleSheets.length).to.equal(1);
|
|
89
|
-
}
|
|
90
|
-
else {
|
|
91
|
-
expect([...el.shadowRoot.querySelectorAll('style')].length).to.equal(1);
|
|
92
|
-
}
|
|
93
|
-
});
|
|
94
|
-
it('loads w/ lazy themes', async () => {
|
|
95
|
-
const el = await fixture(html `
|
|
96
|
-
<sp-theme color="lightest" scale="large"></sp-theme>
|
|
97
|
-
`);
|
|
98
|
-
await elementUpdated(el);
|
|
99
|
-
Theme.registerThemeFragment('light', 'color', lightStyles);
|
|
100
|
-
Theme.registerThemeFragment('medium', 'scale', mediumStyles);
|
|
101
|
-
await elementUpdated(el);
|
|
102
|
-
if (el.shadowRoot.adoptedStyleSheets) {
|
|
103
|
-
expect(el.shadowRoot.adoptedStyleSheets.length).to.equal(1);
|
|
104
|
-
}
|
|
105
|
-
else {
|
|
106
|
-
expect([...el.shadowRoot.querySelectorAll('style')].length).to.equal(1);
|
|
107
|
-
}
|
|
108
|
-
Theme.registerThemeFragment('lightest', 'color', lightestStyles);
|
|
109
|
-
Theme.registerThemeFragment('large', 'scale', largeStyles);
|
|
110
|
-
await elementUpdated(el);
|
|
111
|
-
if (el.shadowRoot.adoptedStyleSheets) {
|
|
112
|
-
expect(el.shadowRoot.adoptedStyleSheets.length).to.equal(3);
|
|
113
|
-
}
|
|
114
|
-
else {
|
|
115
|
-
expect([...el.shadowRoot.querySelectorAll('style')].length).to.equal(3);
|
|
116
|
-
}
|
|
117
|
-
});
|
|
118
|
-
});
|
|
119
|
-
//# sourceMappingURL=theme-lazy.test.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"theme-lazy.test.js","sourceRoot":"","sources":["theme-lazy.test.ts"],"names":[],"mappings":"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","sourcesContent":["/*\nCopyright 2020 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*/\n\nimport '../sp-theme.js';\nimport { Theme, ThemeFragmentMap } from '../';\nimport coreStyles from '../src/theme.css.js';\nimport lightStyles from '../src/theme-light.css.js';\nimport lightestStyles from '../src/theme-lightest.css.js';\nimport darkStyles from '../src/theme-dark.css.js';\nimport darkestStyles from '../src/theme-darkest.css.js';\nimport largeStyles from '../src/scale-large.css.js';\nimport mediumStyles from '../src/scale-medium.css.js';\nimport { elementUpdated, expect, fixture, html } from '@open-wc/testing';\n\ntype TestableThemeConstructor = {\n instances: Set<Theme>;\n themeFragmentsByKind: ThemeFragmentMap;\n};\n\ndescribe('Themes - lazy', () => {\n beforeEach(() => {\n (\n Theme as unknown as TestableThemeConstructor\n ).themeFragmentsByKind.clear();\n // Core is registered by default in `theme.ts`\n Theme.registerThemeFragment('spectrum', 'theme', coreStyles);\n });\n after(() => {\n Theme.registerThemeFragment('light', 'color', lightStyles);\n Theme.registerThemeFragment('lightest', 'color', lightestStyles);\n Theme.registerThemeFragment('dark', 'color', darkStyles);\n Theme.registerThemeFragment('darkest', 'color', darkestStyles);\n Theme.registerThemeFragment('large', 'scale', largeStyles);\n Theme.registerThemeFragment('medium', 'scale', mediumStyles);\n });\n it('loads w/ no themes and none set', async () => {\n const el = await fixture<Theme>(\n html`\n <sp-theme></sp-theme>\n `\n );\n\n await elementUpdated(el);\n\n if (el.shadowRoot.adoptedStyleSheets) {\n expect(el.shadowRoot.adoptedStyleSheets.length).to.equal(1);\n } else {\n expect(\n [...el.shadowRoot.querySelectorAll('style')].length\n ).to.equal(1);\n }\n expect(el.color).to.equal('');\n expect(el.scale).to.equal('');\n });\n it('loads w/ themes and none set', async () => {\n const el = await fixture<Theme>(\n html`\n <sp-theme></sp-theme>\n `\n );\n\n await elementUpdated(el);\n\n Theme.registerThemeFragment('light', 'color', lightStyles);\n Theme.registerThemeFragment('medium', 'scale', mediumStyles);\n\n await elementUpdated(el);\n\n if (el.shadowRoot.adoptedStyleSheets) {\n expect(el.shadowRoot.adoptedStyleSheets.length).to.equal(1);\n } else {\n expect(\n [...el.shadowRoot.querySelectorAll('style')].length\n ).to.equal(1);\n }\n expect(el.color).to.equal('light');\n expect(el.scale).to.equal('medium');\n });\n it('loads w/ no themes', async () => {\n const el = await fixture<Theme>(\n html`\n <sp-theme color=\"lightest\" scale=\"large\"></sp-theme>\n `\n );\n\n await elementUpdated(el);\n\n if (el.shadowRoot.adoptedStyleSheets) {\n expect(el.shadowRoot.adoptedStyleSheets.length).to.equal(1);\n } else {\n expect(\n [...el.shadowRoot.querySelectorAll('style')].length\n ).to.equal(1);\n }\n });\n it('loads w/ not enough themes', async () => {\n const el = await fixture<Theme>(\n html`\n <sp-theme color=\"lightest\" scale=\"large\"></sp-theme>\n `\n );\n\n await elementUpdated(el);\n\n Theme.registerThemeFragment('light', 'color', lightStyles);\n Theme.registerThemeFragment('medium', 'scale', mediumStyles);\n\n await elementUpdated(el);\n\n if (el.shadowRoot.adoptedStyleSheets) {\n expect(el.shadowRoot.adoptedStyleSheets.length).to.equal(1);\n } else {\n expect(\n [...el.shadowRoot.querySelectorAll('style')].length\n ).to.equal(1);\n }\n });\n it('loads w/ lazy themes', async () => {\n const el = await fixture<Theme>(\n html`\n <sp-theme color=\"lightest\" scale=\"large\"></sp-theme>\n `\n );\n\n await elementUpdated(el);\n\n Theme.registerThemeFragment('light', 'color', lightStyles);\n Theme.registerThemeFragment('medium', 'scale', mediumStyles);\n\n await elementUpdated(el);\n\n if (el.shadowRoot.adoptedStyleSheets) {\n expect(el.shadowRoot.adoptedStyleSheets.length).to.equal(1);\n } else {\n expect(\n [...el.shadowRoot.querySelectorAll('style')].length\n ).to.equal(1);\n }\n\n Theme.registerThemeFragment('lightest', 'color', lightestStyles);\n Theme.registerThemeFragment('large', 'scale', largeStyles);\n\n await elementUpdated(el);\n\n if (el.shadowRoot.adoptedStyleSheets) {\n expect(el.shadowRoot.adoptedStyleSheets.length).to.equal(3);\n } else {\n expect(\n [...el.shadowRoot.querySelectorAll('style')].length\n ).to.equal(3);\n }\n });\n});\n"]}
|
package/test/theme.test-vrt.js
DELETED
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
Copyright 2020 Adobe. All rights reserved.
|
|
3
|
-
This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
4
|
-
you may not use this file except in compliance with the License. You may obtain a copy
|
|
5
|
-
of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
6
|
-
|
|
7
|
-
Unless required by applicable law or agreed to in writing, software distributed under
|
|
8
|
-
the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
9
|
-
OF ANY KIND, either express or implied. See the License for the specific language
|
|
10
|
-
governing permissions and limitations under the License.
|
|
11
|
-
*/
|
|
12
|
-
import * as stories from '../stories/theme.stories.js';
|
|
13
|
-
import { regressVisuals } from '../../../test/visual/test.js';
|
|
14
|
-
regressVisuals('ThemeStories', stories);
|
|
15
|
-
//# sourceMappingURL=theme.test-vrt.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"theme.test-vrt.js","sourceRoot":"","sources":["theme.test-vrt.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AAEF,OAAO,KAAK,OAAO,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAE9D,cAAc,CAAC,cAAc,EAAE,OAAO,CAAC,CAAC","sourcesContent":["/*\nCopyright 2020 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*/\n\nimport * as stories from '../stories/theme.stories.js';\nimport { regressVisuals } from '../../../test/visual/test.js';\n\nregressVisuals('ThemeStories', stories);\n"]}
|
package/test/themes.test.js
DELETED
|
@@ -1,152 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
Copyright 2020 Adobe. All rights reserved.
|
|
3
|
-
This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
4
|
-
you may not use this file except in compliance with the License. You may obtain a copy
|
|
5
|
-
of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
6
|
-
|
|
7
|
-
Unless required by applicable law or agreed to in writing, software distributed under
|
|
8
|
-
the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
9
|
-
OF ANY KIND, either express or implied. See the License for the specific language
|
|
10
|
-
governing permissions and limitations under the License.
|
|
11
|
-
*/
|
|
12
|
-
import '../sp-theme.js';
|
|
13
|
-
import '../src/themes.js';
|
|
14
|
-
import { Theme } from '../';
|
|
15
|
-
import { elementUpdated, expect, fixture, html } from '@open-wc/testing';
|
|
16
|
-
import { css } from '@spectrum-web-components/base';
|
|
17
|
-
describe('Themes', () => {
|
|
18
|
-
it('loads - light', async () => {
|
|
19
|
-
const el = await fixture(html `
|
|
20
|
-
<sp-theme theme="classic" color="light"></sp-theme>
|
|
21
|
-
`);
|
|
22
|
-
await elementUpdated(el);
|
|
23
|
-
expect(el).to.exist;
|
|
24
|
-
expect(el).shadowDom.to.exist;
|
|
25
|
-
});
|
|
26
|
-
it('loads - dark', async () => {
|
|
27
|
-
const el = await fixture(html `
|
|
28
|
-
<sp-theme color="dark"></sp-theme>
|
|
29
|
-
`);
|
|
30
|
-
await elementUpdated(el);
|
|
31
|
-
expect(el).to.exist;
|
|
32
|
-
expect(el).shadowDom.to.exist;
|
|
33
|
-
});
|
|
34
|
-
it('loads - unkown', async () => {
|
|
35
|
-
const el = await fixture(html `
|
|
36
|
-
<sp-theme color="unknown" scale="unknown"></sp-theme>
|
|
37
|
-
`);
|
|
38
|
-
await elementUpdated(el);
|
|
39
|
-
expect(el).to.exist;
|
|
40
|
-
expect(el).shadowDom.to.exist;
|
|
41
|
-
});
|
|
42
|
-
it('adds an instance only once', async () => {
|
|
43
|
-
const el = await fixture(html `
|
|
44
|
-
<sp-theme theme="express"></sp-theme>
|
|
45
|
-
`);
|
|
46
|
-
await elementUpdated(el);
|
|
47
|
-
const testableTheme = Theme;
|
|
48
|
-
expect(testableTheme.instances.has(el), 'first').to.be.true;
|
|
49
|
-
expect(testableTheme.instances.size).to.equal(1);
|
|
50
|
-
el.remove();
|
|
51
|
-
expect(testableTheme.instances.has(el), 'second').to.be.false;
|
|
52
|
-
expect(testableTheme.instances.size).to.equal(0);
|
|
53
|
-
document.body.append(el);
|
|
54
|
-
expect(testableTheme.instances.has(el), 'third').to.be.true;
|
|
55
|
-
expect(testableTheme.instances.size).to.equal(1);
|
|
56
|
-
});
|
|
57
|
-
});
|
|
58
|
-
describe('Lightest', () => {
|
|
59
|
-
it('loads', async () => {
|
|
60
|
-
const el = await fixture(html `
|
|
61
|
-
<sp-theme color="lightest"></sp-theme>
|
|
62
|
-
`);
|
|
63
|
-
await elementUpdated(el);
|
|
64
|
-
expect(el).to.exist;
|
|
65
|
-
expect(el).shadowDom.to.exist;
|
|
66
|
-
});
|
|
67
|
-
});
|
|
68
|
-
describe('Medium', () => {
|
|
69
|
-
it('loads', async () => {
|
|
70
|
-
const el = await fixture(html `
|
|
71
|
-
<sp-theme scale="medium"></sp-theme>
|
|
72
|
-
`);
|
|
73
|
-
await elementUpdated(el);
|
|
74
|
-
expect(el).to.exist;
|
|
75
|
-
expect(el).shadowDom.to.exist;
|
|
76
|
-
});
|
|
77
|
-
});
|
|
78
|
-
describe('App styles', () => {
|
|
79
|
-
it('applies app fragments', async () => {
|
|
80
|
-
const el = await fixture(html `
|
|
81
|
-
<sp-theme color="light">
|
|
82
|
-
<style>
|
|
83
|
-
div {
|
|
84
|
-
padding: var(--app-padding);
|
|
85
|
-
}
|
|
86
|
-
</style>
|
|
87
|
-
<div></div>
|
|
88
|
-
</sp-theme>
|
|
89
|
-
`);
|
|
90
|
-
const div = el.querySelector('div');
|
|
91
|
-
await elementUpdated(el);
|
|
92
|
-
const preStylesDiv = getComputedStyle(div);
|
|
93
|
-
expect(preStylesDiv.paddingBlockStart).to.equal('0px');
|
|
94
|
-
Theme.registerThemeFragment('app', 'app', css `
|
|
95
|
-
:host {
|
|
96
|
-
--app-padding: 10px;
|
|
97
|
-
}
|
|
98
|
-
`);
|
|
99
|
-
await elementUpdated(el);
|
|
100
|
-
const postStylesDiv = getComputedStyle(div);
|
|
101
|
-
expect(postStylesDiv.paddingBlockStart).to.equal('10px');
|
|
102
|
-
Theme.themeFragmentsByKind.delete('app');
|
|
103
|
-
});
|
|
104
|
-
});
|
|
105
|
-
describe('Setting attributes', () => {
|
|
106
|
-
it('loads', async () => {
|
|
107
|
-
const el = await fixture(html `
|
|
108
|
-
<sp-theme color="light"></sp-theme>
|
|
109
|
-
`);
|
|
110
|
-
await elementUpdated(el);
|
|
111
|
-
expect(el).to.not.be.undefined;
|
|
112
|
-
expect(el.hasAttribute('scale')).to.be.false;
|
|
113
|
-
if (el.shadowRoot.adoptedStyleSheets) {
|
|
114
|
-
expect(el.shadowRoot.adoptedStyleSheets.length).to.equal(2);
|
|
115
|
-
}
|
|
116
|
-
else {
|
|
117
|
-
expect([...el.shadowRoot.querySelectorAll('style')].length).to.equal(2);
|
|
118
|
-
}
|
|
119
|
-
await elementUpdated(el);
|
|
120
|
-
// Invalid initial value falls back to default
|
|
121
|
-
el.setAttribute('scale', 'fish');
|
|
122
|
-
expect(el.getAttribute('scale')).to.equal('medium');
|
|
123
|
-
if (el.shadowRoot.adoptedStyleSheets) {
|
|
124
|
-
expect(el.shadowRoot.adoptedStyleSheets.length).to.equal(2);
|
|
125
|
-
}
|
|
126
|
-
else {
|
|
127
|
-
expect([...el.shadowRoot.querySelectorAll('style')].length).to.equal(2);
|
|
128
|
-
}
|
|
129
|
-
el.color = 'dark';
|
|
130
|
-
el.scale = 'medium';
|
|
131
|
-
await elementUpdated(el);
|
|
132
|
-
expect(el.getAttribute('color')).to.equal('dark');
|
|
133
|
-
expect(el.getAttribute('scale')).to.equal('medium');
|
|
134
|
-
if (el.shadowRoot.adoptedStyleSheets) {
|
|
135
|
-
expect(el.shadowRoot.adoptedStyleSheets.length, 'all').to.equal(3);
|
|
136
|
-
}
|
|
137
|
-
else {
|
|
138
|
-
expect([...el.shadowRoot.querySelectorAll('style')].length).to.equal(3);
|
|
139
|
-
}
|
|
140
|
-
// Invalid second + value fallsback to previous
|
|
141
|
-
el.setAttribute('color', 'fish');
|
|
142
|
-
await elementUpdated(el);
|
|
143
|
-
expect(el.getAttribute('color')).to.equal('dark');
|
|
144
|
-
if (el.shadowRoot.adoptedStyleSheets) {
|
|
145
|
-
expect(el.shadowRoot.adoptedStyleSheets.length, 'last').to.equal(3);
|
|
146
|
-
}
|
|
147
|
-
else {
|
|
148
|
-
expect([...el.shadowRoot.querySelectorAll('style')].length).to.equal(3);
|
|
149
|
-
}
|
|
150
|
-
});
|
|
151
|
-
});
|
|
152
|
-
//# sourceMappingURL=themes.test.js.map
|
package/test/themes.test.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"themes.test.js","sourceRoot":"","sources":["themes.test.ts"],"names":[],"mappings":"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","sourcesContent":["/*\nCopyright 2020 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*/\n\nimport '../sp-theme.js';\nimport '../src/themes.js';\nimport { Theme, ThemeFragmentMap } from '../';\nimport { elementUpdated, expect, fixture, html } from '@open-wc/testing';\nimport { css } from '@spectrum-web-components/base';\n\ntype TestableThemeConstructor = {\n instances: Set<Theme>;\n themeFragmentsByKind: ThemeFragmentMap;\n};\n\ndescribe('Themes', () => {\n it('loads - light', async () => {\n const el = await fixture<Theme>(\n html`\n <sp-theme theme=\"classic\" color=\"light\"></sp-theme>\n `\n );\n\n await elementUpdated(el);\n\n expect(el).to.exist;\n expect(el).shadowDom.to.exist;\n });\n it('loads - dark', async () => {\n const el = await fixture<Theme>(\n html`\n <sp-theme color=\"dark\"></sp-theme>\n `\n );\n\n await elementUpdated(el);\n\n expect(el).to.exist;\n expect(el).shadowDom.to.exist;\n });\n it('loads - unkown', async () => {\n const el = await fixture<Theme>(\n html`\n <sp-theme color=\"unknown\" scale=\"unknown\"></sp-theme>\n `\n );\n\n await elementUpdated(el);\n\n expect(el).to.exist;\n expect(el).shadowDom.to.exist;\n });\n it('adds an instance only once', async () => {\n const el = await fixture<Theme>(\n html`\n <sp-theme theme=\"express\"></sp-theme>\n `\n );\n\n await elementUpdated(el);\n const testableTheme = Theme as unknown as TestableThemeConstructor;\n expect(testableTheme.instances.has(el), 'first').to.be.true;\n expect(testableTheme.instances.size).to.equal(1);\n\n el.remove();\n expect(testableTheme.instances.has(el), 'second').to.be.false;\n expect(testableTheme.instances.size).to.equal(0);\n\n document.body.append(el);\n expect(testableTheme.instances.has(el), 'third').to.be.true;\n expect(testableTheme.instances.size).to.equal(1);\n });\n});\n\ndescribe('Lightest', () => {\n it('loads', async () => {\n const el = await fixture<Theme>(\n html`\n <sp-theme color=\"lightest\"></sp-theme>\n `\n );\n\n await elementUpdated(el);\n\n expect(el).to.exist;\n expect(el).shadowDom.to.exist;\n });\n});\n\ndescribe('Medium', () => {\n it('loads', async () => {\n const el = await fixture<Theme>(\n html`\n <sp-theme scale=\"medium\"></sp-theme>\n `\n );\n\n await elementUpdated(el);\n\n expect(el).to.exist;\n expect(el).shadowDom.to.exist;\n });\n});\n\ndescribe('App styles', () => {\n it('applies app fragments', async () => {\n const el = await fixture<Theme>(\n html`\n <sp-theme color=\"light\">\n <style>\n div {\n padding: var(--app-padding);\n }\n </style>\n <div></div>\n </sp-theme>\n `\n );\n const div = el.querySelector('div') as HTMLDivElement;\n\n await elementUpdated(el);\n\n const preStylesDiv = getComputedStyle(div);\n expect(preStylesDiv.paddingBlockStart).to.equal('0px');\n\n Theme.registerThemeFragment(\n 'app',\n 'app',\n css`\n :host {\n --app-padding: 10px;\n }\n `\n );\n await elementUpdated(el);\n\n const postStylesDiv = getComputedStyle(div);\n expect(postStylesDiv.paddingBlockStart).to.equal('10px');\n\n (\n Theme as unknown as TestableThemeConstructor\n ).themeFragmentsByKind.delete('app');\n });\n});\n\ndescribe('Setting attributes', () => {\n it('loads', async () => {\n const el = await fixture<Theme>(\n html`\n <sp-theme color=\"light\"></sp-theme>\n `\n );\n\n await elementUpdated(el);\n\n expect(el).to.not.be.undefined;\n expect(el.hasAttribute('scale')).to.be.false;\n\n if (el.shadowRoot.adoptedStyleSheets) {\n expect(el.shadowRoot.adoptedStyleSheets.length).to.equal(2);\n } else {\n expect(\n [...el.shadowRoot.querySelectorAll('style')].length\n ).to.equal(2);\n }\n\n await elementUpdated(el);\n\n // Invalid initial value falls back to default\n el.setAttribute('scale', 'fish');\n expect(el.getAttribute('scale')).to.equal('medium');\n\n if (el.shadowRoot.adoptedStyleSheets) {\n expect(el.shadowRoot.adoptedStyleSheets.length).to.equal(2);\n } else {\n expect(\n [...el.shadowRoot.querySelectorAll('style')].length\n ).to.equal(2);\n }\n\n el.color = 'dark';\n el.scale = 'medium';\n\n await elementUpdated(el);\n expect(el.getAttribute('color')).to.equal('dark');\n expect(el.getAttribute('scale')).to.equal('medium');\n\n if (el.shadowRoot.adoptedStyleSheets) {\n expect(el.shadowRoot.adoptedStyleSheets.length, 'all').to.equal(3);\n } else {\n expect(\n [...el.shadowRoot.querySelectorAll('style')].length\n ).to.equal(3);\n }\n\n // Invalid second + value fallsback to previous\n el.setAttribute('color', 'fish');\n\n await elementUpdated(el);\n expect(el.getAttribute('color')).to.equal('dark');\n\n if (el.shadowRoot.adoptedStyleSheets) {\n expect(el.shadowRoot.adoptedStyleSheets.length, 'last').to.equal(3);\n } else {\n expect(\n [...el.shadowRoot.querySelectorAll('style')].length\n ).to.equal(3);\n }\n });\n});\n"]}
|