@spectrum-web-components/styles 0.14.0 → 0.15.0

package/tokens/darkest-vars.css

@@ -0,0 +1,267 @@
+/*
+Copyright 2022 Adobe. All rights reserved.
+This file is licensed to you under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License. You may obtain a copy
+of the License at http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under
+the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+OF ANY KIND, either express or implied. See the License for the specific language
+governing permissions and limitations under the License.
+*/
+
+:host {
+    --spectrum-neutral-background-color-default: var(--spectrum-gray-400);
+    --spectrum-neutral-background-color-hover: var(--spectrum-gray-300);
+    --spectrum-neutral-background-color-down: var(--spectrum-gray-200);
+    --spectrum-neutral-background-color-key-focus: var(--spectrum-gray-300);
+    --spectrum-neutral-subdued-background-color-default: var(
+        --spectrum-gray-400
+    );
+    --spectrum-neutral-subdued-background-color-hover: var(--spectrum-gray-300);
+    --spectrum-neutral-subdued-background-color-down: var(--spectrum-gray-200);
+    --spectrum-neutral-subdued-background-color-key-focus: var(
+        --spectrum-gray-300
+    );
+    --spectrum-accent-background-color-default: var(
+        --spectrum-accent-color-600
+    );
+    --spectrum-accent-background-color-hover: var(--spectrum-accent-color-500);
+    --spectrum-accent-background-color-down: var(--spectrum-accent-color-400);
+    --spectrum-accent-background-color-key-focus: var(
+        --spectrum-accent-color-500
+    );
+    --spectrum-informative-background-color-default: var(
+        --spectrum-informative-color-600
+    );
+    --spectrum-informative-background-color-hover: var(
+        --spectrum-informative-color-500
+    );
+    --spectrum-informative-background-color-down: var(
+        --spectrum-informative-color-400
+    );
+    --spectrum-informative-background-color-key-focus: var(
+        --spectrum-informative-color-500
+    );
+    --spectrum-negative-background-color-default: var(
+        --spectrum-negative-color-600
+    );
+    --spectrum-negative-background-color-hover: var(
+        --spectrum-negative-color-500
+    );
+    --spectrum-negative-background-color-down: var(
+        --spectrum-negative-color-400
+    );
+    --spectrum-negative-background-color-key-focus: var(
+        --spectrum-negative-color-500
+    );
+    --spectrum-positive-background-color-default: var(
+        --spectrum-positive-color-600
+    );
+    --spectrum-positive-background-color-hover: var(
+        --spectrum-positive-color-500
+    );
+    --spectrum-positive-background-color-down: var(
+        --spectrum-positive-color-400
+    );
+    --spectrum-positive-background-color-key-focus: var(
+        --spectrum-positive-color-500
+    );
+    --spectrum-drop-shadow-color: rgba(0, 0, 0, 0.8);
+    --spectrum-background-base-color: var(--spectrum-gray-50);
+    --spectrum-background-layer-1-color: var(--spectrum-gray-75);
+    --spectrum-background-layer-2-color: var(--spectrum-gray-100);
+    --spectrum-gray-50: rgb(0, 0, 0);
+    --spectrum-gray-75: rgb(14, 14, 14);
+    --spectrum-gray-100: rgb(29, 29, 29);
+    --spectrum-gray-200: rgb(48, 48, 48);
+    --spectrum-gray-300: rgb(75, 75, 75);
+    --spectrum-gray-400: rgb(106, 106, 106);
+    --spectrum-gray-500: rgb(141, 141, 141);
+    --spectrum-gray-600: rgb(176, 176, 176);
+    --spectrum-gray-700: rgb(208, 208, 208);
+    --spectrum-gray-800: rgb(235, 235, 235);
+    --spectrum-gray-900: rgb(255, 255, 255);
+    --spectrum-red-100: rgb(87, 0, 0);
+    --spectrum-red-200: rgb(110, 0, 0);
+    --spectrum-red-300: rgb(138, 0, 0);
+    --spectrum-red-400: rgb(167, 0, 0);
+    --spectrum-red-500: rgb(196, 7, 6);
+    --spectrum-red-600: rgb(221, 33, 24);
+    --spectrum-red-700: rgb(238, 67, 49);
+    --spectrum-red-800: rgb(249, 99, 76);
+    --spectrum-red-900: rgb(255, 129, 107);
+    --spectrum-red-1000: rgb(255, 158, 140);
+    --spectrum-red-1100: rgb(255, 183, 169);
+    --spectrum-red-1200: rgb(255, 205, 195);
+    --spectrum-red-1300: rgb(255, 223, 217);
+    --spectrum-red-1400: rgb(255, 237, 234);
+    --spectrum-orange-100: rgb(72, 24, 1);
+    --spectrum-orange-200: rgb(92, 32, 0);
+    --spectrum-orange-300: rgb(115, 43, 0);
+    --spectrum-orange-400: rgb(138, 55, 0);
+    --spectrum-orange-500: rgb(162, 68, 0);
+    --spectrum-orange-600: rgb(186, 82, 0);
+    --spectrum-orange-700: rgb(210, 98, 0);
+    --spectrum-orange-800: rgb(232, 116, 0);
+    --spectrum-orange-900: rgb(249, 137, 23);
+    --spectrum-orange-1000: rgb(255, 162, 59);
+    --spectrum-orange-1100: rgb(255, 188, 102);
+    --spectrum-orange-1200: rgb(253, 210, 145);
+    --spectrum-orange-1300: rgb(255, 226, 181);
+    --spectrum-orange-1400: rgb(255, 239, 213);
+    --spectrum-yellow-100: rgb(53, 36, 0);
+    --spectrum-yellow-200: rgb(68, 47, 0);
+    --spectrum-yellow-300: rgb(86, 62, 0);
+    --spectrum-yellow-400: rgb(103, 77, 0);
+    --spectrum-yellow-500: rgb(122, 92, 0);
+    --spectrum-yellow-600: rgb(141, 108, 0);
+    --spectrum-yellow-700: rgb(161, 126, 0);
+    --spectrum-yellow-800: rgb(180, 144, 0);
+    --spectrum-yellow-900: rgb(199, 162, 0);
+    --spectrum-yellow-1000: rgb(216, 181, 0);
+    --spectrum-yellow-1100: rgb(233, 199, 0);
+    --spectrum-yellow-1200: rgb(247, 216, 4);
+    --spectrum-yellow-1300: rgb(249, 233, 97);
+    --spectrum-yellow-1400: rgb(252, 243, 170);
+    --spectrum-chartreuse-100: rgb(32, 43, 0);
+    --spectrum-chartreuse-200: rgb(42, 56, 0);
+    --spectrum-chartreuse-300: rgb(54, 72, 0);
+    --spectrum-chartreuse-400: rgb(66, 88, 0);
+    --spectrum-chartreuse-500: rgb(79, 105, 0);
+    --spectrum-chartreuse-600: rgb(93, 123, 0);
+    --spectrum-chartreuse-700: rgb(107, 142, 0);
+    --spectrum-chartreuse-800: rgb(122, 161, 0);
+    --spectrum-chartreuse-900: rgb(138, 180, 3);
+    --spectrum-chartreuse-1000: rgb(154, 198, 11);
+    --spectrum-chartreuse-1100: rgb(170, 216, 22);
+    --spectrum-chartreuse-1200: rgb(187, 232, 41);
+    --spectrum-chartreuse-1300: rgb(205, 246, 72);
+    --spectrum-chartreuse-1400: rgb(225, 253, 132);
+    --spectrum-celery-100: rgb(0, 47, 7);
+    --spectrum-celery-200: rgb(0, 61, 9);
+    --spectrum-celery-300: rgb(0, 77, 12);
+    --spectrum-celery-400: rgb(0, 95, 15);
+    --spectrum-celery-500: rgb(0, 113, 15);
+    --spectrum-celery-600: rgb(0, 132, 15);
+    --spectrum-celery-700: rgb(0, 151, 20);
+    --spectrum-celery-800: rgb(13, 171, 37);
+    --spectrum-celery-900: rgb(45, 191, 58);
+    --spectrum-celery-1000: rgb(80, 208, 82);
+    --spectrum-celery-1100: rgb(115, 224, 107);
+    --spectrum-celery-1200: rgb(147, 237, 131);
+    --spectrum-celery-1300: rgb(180, 247, 162);
+    --spectrum-celery-1400: rgb(213, 252, 202);
+    --spectrum-green-100: rgb(10, 44, 28);
+    --spectrum-green-200: rgb(7, 59, 36);
+    --spectrum-green-300: rgb(0, 76, 46);
+    --spectrum-green-400: rgb(0, 93, 57);
+    --spectrum-green-500: rgb(0, 111, 69);
+    --spectrum-green-600: rgb(0, 130, 82);
+    --spectrum-green-700: rgb(0, 149, 98);
+    --spectrum-green-800: rgb(28, 168, 114);
+    --spectrum-green-900: rgb(52, 187, 132);
+    --spectrum-green-1000: rgb(75, 205, 149);
+    --spectrum-green-1100: rgb(103, 222, 168);
+    --spectrum-green-1200: rgb(137, 236, 188);
+    --spectrum-green-1300: rgb(177, 244, 209);
+    --spectrum-green-1400: rgb(214, 249, 228);
+    --spectrum-seafoam-100: rgb(18, 43, 42);
+    --spectrum-seafoam-200: rgb(19, 57, 55);
+    --spectrum-seafoam-300: rgb(16, 73, 70);
+    --spectrum-seafoam-400: rgb(3, 91, 88);
+    --spectrum-seafoam-500: rgb(0, 108, 104);
+    --spectrum-seafoam-600: rgb(0, 127, 121);
+    --spectrum-seafoam-700: rgb(0, 146, 140);
+    --spectrum-seafoam-800: rgb(0, 165, 159);
+    --spectrum-seafoam-900: rgb(26, 185, 178);
+    --spectrum-seafoam-1000: rgb(66, 202, 195);
+    --spectrum-seafoam-1100: rgb(102, 218, 211);
+    --spectrum-seafoam-1200: rgb(139, 232, 225);
+    --spectrum-seafoam-1300: rgb(179, 242, 237);
+    --spectrum-seafoam-1400: rgb(215, 248, 244);
+    --spectrum-cyan-100: rgb(0, 41, 68);
+    --spectrum-cyan-200: rgb(0, 54, 88);
+    --spectrum-cyan-300: rgb(0, 69, 108);
+    --spectrum-cyan-400: rgb(0, 86, 128);
+    --spectrum-cyan-500: rgb(0, 103, 147);
+    --spectrum-cyan-600: rgb(0, 121, 167);
+    --spectrum-cyan-700: rgb(0, 140, 186);
+    --spectrum-cyan-800: rgb(4, 160, 205);
+    --spectrum-cyan-900: rgb(23, 180, 221);
+    --spectrum-cyan-1000: rgb(57, 199, 234);
+    --spectrum-cyan-1100: rgb(96, 216, 243);
+    --spectrum-cyan-1200: rgb(134, 230, 250);
+    --spectrum-cyan-1300: rgb(170, 242, 255);
+    --spectrum-cyan-1400: rgb(206, 249, 255);
+    --spectrum-blue-100: rgb(0, 38, 81);
+    --spectrum-blue-200: rgb(0, 50, 106);
+    --spectrum-blue-300: rgb(0, 64, 135);
+    --spectrum-blue-400: rgb(0, 78, 166);
+    --spectrum-blue-500: rgb(0, 92, 200);
+    --spectrum-blue-600: rgb(6, 108, 231);
+    --spectrum-blue-700: rgb(29, 128, 245);
+    --spectrum-blue-800: rgb(64, 150, 243);
+    --spectrum-blue-900: rgb(94, 170, 247);
+    --spectrum-blue-1000: rgb(124, 189, 250);
+    --spectrum-blue-1100: rgb(152, 206, 253);
+    --spectrum-blue-1200: rgb(179, 222, 254);
+    --spectrum-blue-1300: rgb(206, 234, 255);
+    --spectrum-blue-1400: rgb(227, 243, 255);
+    --spectrum-indigo-100: rgb(26, 29, 97);
+    --spectrum-indigo-200: rgb(35, 39, 125);
+    --spectrum-indigo-300: rgb(46, 50, 158);
+    --spectrum-indigo-400: rgb(58, 63, 189);
+    --spectrum-indigo-500: rgb(73, 78, 216);
+    --spectrum-indigo-600: rgb(90, 96, 235);
+    --spectrum-indigo-700: rgb(110, 115, 246);
+    --spectrum-indigo-800: rgb(132, 136, 253);
+    --spectrum-indigo-900: rgb(153, 157, 255);
+    --spectrum-indigo-1000: rgb(174, 177, 255);
+    --spectrum-indigo-1100: rgb(194, 196, 255);
+    --spectrum-indigo-1200: rgb(212, 213, 255);
+    --spectrum-indigo-1300: rgb(227, 228, 255);
+    --spectrum-indigo-1400: rgb(240, 240, 255);
+    --spectrum-purple-100: rgb(50, 16, 104);
+    --spectrum-purple-200: rgb(67, 13, 140);
+    --spectrum-purple-300: rgb(86, 16, 173);
+    --spectrum-purple-400: rgb(106, 29, 200);
+    --spectrum-purple-500: rgb(126, 49, 222);
+    --spectrum-purple-600: rgb(145, 70, 236);
+    --spectrum-purple-700: rgb(162, 94, 246);
+    --spectrum-purple-800: rgb(178, 119, 250);
+    --spectrum-purple-900: rgb(192, 143, 252);
+    --spectrum-purple-1000: rgb(206, 166, 253);
+    --spectrum-purple-1100: rgb(219, 188, 254);
+    --spectrum-purple-1200: rgb(230, 207, 255);
+    --spectrum-purple-1300: rgb(240, 224, 255);
+    --spectrum-purple-1400: rgb(248, 237, 255);
+    --spectrum-fuchsia-100: rgb(70, 14, 68);
+    --spectrum-fuchsia-200: rgb(93, 9, 92);
+    --spectrum-fuchsia-300: rgb(120, 0, 120);
+    --spectrum-fuchsia-400: rgb(146, 0, 147);
+    --spectrum-fuchsia-500: rgb(169, 19, 170);
+    --spectrum-fuchsia-600: rgb(191, 43, 191);
+    --spectrum-fuchsia-700: rgb(211, 65, 213);
+    --spectrum-fuchsia-800: rgb(228, 91, 229);
+    --spectrum-fuchsia-900: rgb(239, 120, 238);
+    --spectrum-fuchsia-1000: rgb(246, 149, 243);
+    --spectrum-fuchsia-1100: rgb(251, 175, 246);
+    --spectrum-fuchsia-1200: rgb(254, 199, 248);
+    --spectrum-fuchsia-1300: rgb(255, 220, 250);
+    --spectrum-fuchsia-1400: rgb(255, 235, 252);
+    --spectrum-magenta-100: rgb(83, 3, 41);
+    --spectrum-magenta-200: rgb(106, 0, 52);
+    --spectrum-magenta-300: rgb(133, 0, 65);
+    --spectrum-magenta-400: rgb(161, 0, 78);
+    --spectrum-magenta-500: rgb(186, 22, 93);
+    --spectrum-magenta-600: rgb(209, 43, 114);
+    --spectrum-magenta-700: rgb(227, 69, 137);
+    --spectrum-magenta-800: rgb(241, 97, 156);
+    --spectrum-magenta-900: rgb(252, 124, 173);
+    --spectrum-magenta-1000: rgb(255, 152, 191);
+    --spectrum-magenta-1100: rgb(255, 179, 207);
+    --spectrum-magenta-1200: rgb(255, 202, 221);
+    --spectrum-magenta-1300: rgb(255, 221, 233);
+    --spectrum-magenta-1400: rgb(255, 236, 243);
+}

package/tokens/express/custom-large-vars.css

@@ -0,0 +1,17 @@
+/*
+Copyright 2022 Adobe. All rights reserved.
+This file is licensed to you under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License. You may obtain a copy
+of the License at http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under
+the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+OF ANY KIND, either express or implied. See the License for the specific language
+governing permissions and limitations under the License.
+*/
+
+/* This file contains overrides and additions to core tokens */
+
+:host {
+    /*  */
+}

package/tokens/express/custom-medium-vars.css

@@ -0,0 +1,17 @@
+/*
+Copyright 2022 Adobe. All rights reserved.
+This file is licensed to you under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License. You may obtain a copy
+of the License at http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under
+the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+OF ANY KIND, either express or implied. See the License for the specific language
+governing permissions and limitations under the License.
+*/
+
+/* This file contains overrides and additions to core tokens */
+
+:host {
+    /*  */
+}

package/tokens/express/custom-vars.css

@@ -0,0 +1,17 @@
+/*
+Copyright 2022 Adobe. All rights reserved.
+This file is licensed to you under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License. You may obtain a copy
+of the License at http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under
+the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+OF ANY KIND, either express or implied. See the License for the specific language
+governing permissions and limitations under the License.
+*/
+
+/* This file contains overrides and additions to core tokens */
+
+:host {
+    --system: express;
+}

package/tokens/express/global-vars.css

@@ -0,0 +1,268 @@
+/*
+Copyright 2022 Adobe. All rights reserved.
+This file is licensed to you under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License. You may obtain a copy
+of the License at http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under
+the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+OF ANY KIND, either express or implied. See the License for the specific language
+governing permissions and limitations under the License.
+*/
+
+:host {
+    --spectrum-accent-color-100: var(--spectrum-indigo-100);
+    --spectrum-accent-color-200: var(--spectrum-indigo-200);
+    --spectrum-accent-color-300: var(--spectrum-indigo-300);
+    --spectrum-accent-color-400: var(--spectrum-indigo-400);
+    --spectrum-accent-color-500: var(--spectrum-indigo-500);
+    --spectrum-accent-color-600: var(--spectrum-indigo-600);
+    --spectrum-accent-color-700: var(--spectrum-indigo-700);
+    --spectrum-accent-color-800: var(--spectrum-indigo-800);
+    --spectrum-accent-color-900: var(--spectrum-indigo-900);
+    --spectrum-accent-color-1000: var(--spectrum-indigo-1000);
+    --spectrum-accent-color-1100: var(--spectrum-indigo-1100);
+    --spectrum-accent-color-1200: var(--spectrum-indigo-1200);
+    --spectrum-accent-color-1300: var(--spectrum-indigo-1300);
+    --spectrum-accent-color-1400: var(--spectrum-indigo-1400);
+    --spectrum-border-width-100: 2px;
+}
+:host {
+    --system-spectrum-actionbutton-background-color-default: var(
+        --spectrum-gray-200
+    );
+    --system-spectrum-actionbutton-background-color-hover: var(
+        --spectrum-gray-300
+    );
+    --system-spectrum-actionbutton-background-color-down: var(
+        --spectrum-gray-400
+    );
+    --system-spectrum-actionbutton-background-color-focus: var(
+        --spectrum-gray-300
+    );
+    --system-spectrum-actionbutton-border-color-default: transparent;
+    --system-spectrum-actionbutton-border-color-hover: transparent;
+    --system-spectrum-actionbutton-border-color-down: transparent;
+    --system-spectrum-actionbutton-border-color-focus: transparent;
+    --system-spectrum-actionbutton-content-color-default: var(
+        --spectrum-neutral-content-color-default
+    );
+    --system-spectrum-actionbutton-content-color-hover: var(
+        --spectrum-neutral-content-color-hover
+    );
+    --system-spectrum-actionbutton-content-color-down: var(
+        --spectrum-neutral-content-color-down
+    );
+    --system-spectrum-actionbutton-content-color-focus: var(
+        --spectrum-neutral-content-color-key-focus
+    );
+    --system-spectrum-actionbutton-background-color-disabled: var(
+        --spectrum-disabled-background-color
+    );
+    --system-spectrum-actionbutton-border-color-disabled: transparent;
+    --system-spectrum-actionbutton-content-color-disabled: var(
+        --spectrum-disabled-content-color
+    );
+    --system-spectrum-actionbutton-quiet-background-color-default: transparent;
+    --system-spectrum-actionbutton-quiet-background-color-hover: var(
+        --spectrum-gray-200
+    );
+    --system-spectrum-actionbutton-quiet-background-color-down: var(
+        --spectrum-gray-300
+    );
+    --system-spectrum-actionbutton-quiet-background-color-focus: var(
+        --spectrum-gray-200
+    );
+    --system-spectrum-actionbutton-quiet-border-color-default: transparent;
+    --system-spectrum-actionbutton-quiet-border-color-hover: transparent;
+    --system-spectrum-actionbutton-quiet-border-color-down: transparent;
+    --system-spectrum-actionbutton-quiet-border-color-focus: transparent;
+    --system-spectrum-actionbutton-quiet-background-color-disabled: transparent;
+    --system-spectrum-actionbutton-quiet-border-color-disabled: transparent;
+    --system-spectrum-actionbutton-selected-background-color-default: var(
+        --spectrum-neutral-background-color-default
+    );
+    --system-spectrum-actionbutton-selected-background-color-hover: var(
+        --spectrum-neutral-background-color-hover
+    );
+    --system-spectrum-actionbutton-selected-background-color-down: var(
+        --spectrum-neutral-background-color-down
+    );
+    --system-spectrum-actionbutton-selected-background-color-focus: var(
+        --spectrum-neutral-background-color-key-focus
+    );
+    --system-spectrum-actionbutton-selected-border-color-default: transparent;
+    --system-spectrum-actionbutton-selected-border-color-hover: transparent;
+    --system-spectrum-actionbutton-selected-border-color-down: transparent;
+    --system-spectrum-actionbutton-selected-border-color-focus: transparent;
+    --system-spectrum-actionbutton-selected-content-color-default: var(
+        --spectrum-white
+    );
+    --system-spectrum-actionbutton-selected-content-color-hover: var(
+        --spectrum-white
+    );
+    --system-spectrum-actionbutton-selected-content-color-down: var(
+        --spectrum-white
+    );
+    --system-spectrum-actionbutton-selected-content-color-focus: var(
+        --spectrum-white
+    );
+    --system-spectrum-actionbutton-selected-background-color-disabled: var(
+        --spectrum-disabled-background-color
+    );
+    --system-spectrum-actionbutton-selected-border-color-disabled: transparent;
+    --system-spectrum-actionbutton-selected-emphasized-background-color-default: var(
+        --spectrum-accent-background-color-default
+    );
+    --system-spectrum-actionbutton-selected-emphasized-background-color-hover: var(
+        --spectrum-accent-background-color-hover
+    );
+    --system-spectrum-actionbutton-selected-emphasized-background-color-down: var(
+        --spectrum-accent-background-color-down
+    );
+    --system-spectrum-actionbutton-selected-emphasized-background-color-focus: var(
+        --spectrum-accent-background-color-key-focus
+    );
+    --system-spectrum-actionbutton-staticblack-quiet-border-color-default: transparent;
+    --system-spectrum-actionbutton-staticwhite-quiet-border-color-default: transparent;
+    --system-spectrum-actionbutton-staticblack-quiet-border-color-hover: transparent;
+    --system-spectrum-actionbutton-staticwhite-quiet-border-color-hover: transparent;
+    --system-spectrum-actionbutton-staticblack-quiet-border-color-down: transparent;
+    --system-spectrum-actionbutton-staticwhite-quiet-border-color-down: transparent;
+    --system-spectrum-actionbutton-staticblack-quiet-border-color-focus: transparent;
+    --system-spectrum-actionbutton-staticwhite-quiet-border-color-focus: transparent;
+    --system-spectrum-actionbutton-staticblack-quiet-border-color-disabled: transparent;
+    --system-spectrum-actionbutton-staticwhite-quiet-border-color-disabled: transparent;
+    --system-spectrum-actionbutton-staticblack-background-color-default: var(
+        --spectrum-transparent-black-200
+    );
+    --system-spectrum-actionbutton-staticblack-background-color-hover: var(
+        --spectrum-transparent-black-300
+    );
+    --system-spectrum-actionbutton-staticblack-background-color-down: var(
+        --spectrum-transparent-black-400
+    );
+    --system-spectrum-actionbutton-staticblack-background-color-focus: var(
+        --spectrum-transparent-black-300
+    );
+    --system-spectrum-actionbutton-staticblack-border-color-default: transparent;
+    --system-spectrum-actionbutton-staticblack-border-color-hover: transparent;
+    --system-spectrum-actionbutton-staticblack-border-color-down: transparent;
+    --system-spectrum-actionbutton-staticblack-border-color-focus: transparent;
+    --system-spectrum-actionbutton-staticblack-content-color-default: var(
+        --spectrum-black
+    );
+    --system-spectrum-actionbutton-staticblack-content-color-hover: var(
+        --spectrum-black
+    );
+    --system-spectrum-actionbutton-staticblack-content-color-down: var(
+        --spectrum-black
+    );
+    --system-spectrum-actionbutton-staticblack-content-color-focus: var(
+        --spectrum-black
+    );
+    --system-spectrum-actionbutton-staticblack-focus-ring-color: var(
+        --spectrum-static-black-focus-ring-color
+    );
+    --system-spectrum-actionbutton-staticblack-background-color-disabled: transparent;
+    --system-spectrum-actionbutton-staticblack-border-color-disabled: var(
+        --spectrum-disabled-static-black-border-color
+    );
+    --system-spectrum-actionbutton-staticblack-content-color-disabled: var(
+        --spectrum-disabled-static-black-content-color
+    );
+    --system-spectrum-actionbutton-staticblack-selected-background-color-default: var(
+        --spectrum-transparent-black-800
+    );
+    --system-spectrum-actionbutton-staticblack-selected-background-color-hover: var(
+        --spectrum-transparent-black-900
+    );
+    --system-spectrum-actionbutton-staticblack-selected-background-color-down: var(
+        --spectrum-transparent-black-900
+    );
+    --system-spectrum-actionbutton-staticblack-selected-background-color-focus: var(
+        --spectrum-transparent-black-900
+    );
+    --system-spectrum-actionbutton-staticblack-selected-border-color-disabled: transparent;
+    --system-spectrum-actionbutton-staticblack-selected-content-color-default: var(
+        --spectrum-white
+    );
+    --system-spectrum-actionbutton-staticblack-selected-content-color-hover: var(
+        --spectrum-white
+    );
+    --system-spectrum-actionbutton-staticblack-selected-content-color-down: var(
+        --spectrum-white
+    );
+    --system-spectrum-actionbutton-staticblack-selected-content-color-focus: var(
+        --spectrum-white
+    );
+    --system-spectrum-actionbutton-staticblack-selected-background-color-disabled: var(
+        --spectrum-disabled-static-black-background-color
+    );
+    --system-spectrum-actionbutton-staticwhite-background-color-default: var(
+        --spectrum-transparent-white-200
+    );
+    --system-spectrum-actionbutton-staticwhite-background-color-hover: var(
+        --spectrum-transparent-white-300
+    );
+    --system-spectrum-actionbutton-staticwhite-background-color-down: var(
+        --spectrum-transparent-white-400
+    );
+    --system-spectrum-actionbutton-staticwhite-background-color-focus: var(
+        --spectrum-transparent-white-300
+    );
+    --system-spectrum-actionbutton-staticwhite-border-color-default: transparent;
+    --system-spectrum-actionbutton-staticwhite-border-color-hover: transparent;
+    --system-spectrum-actionbutton-staticwhite-border-color-down: transparent;
+    --system-spectrum-actionbutton-staticwhite-border-color-focus: transparent;
+    --system-spectrum-actionbutton-staticwhite-content-color-default: var(
+        --spectrum-white
+    );
+    --system-spectrum-actionbutton-staticwhite-content-color-hover: var(
+        --spectrum-white
+    );
+    --system-spectrum-actionbutton-staticwhite-content-color-down: var(
+        --spectrum-white
+    );
+    --system-spectrum-actionbutton-staticwhite-content-color-focus: var(
+        --spectrum-white
+    );
+    --system-spectrum-actionbutton-staticwhite-focus-ring-color: var(
+        --spectrum-static-white-focus-ring-color
+    );
+    --system-spectrum-actionbutton-staticwhite-background-color-disabled: transparent;
+    --system-spectrum-actionbutton-staticwhite-border-color-disabled: var(
+        --spectrum-disabled-static-white-border-color
+    );
+    --system-spectrum-actionbutton-staticwhite-content-color-disabled: var(
+        --spectrum-disabled-static-white-content-color
+    );
+    --system-spectrum-actionbutton-staticwhite-selected-background-color-default: var(
+        --spectrum-transparent-white-800
+    );
+    --system-spectrum-actionbutton-staticwhite-selected-background-color-hover: var(
+        --spectrum-transparent-white-900
+    );
+    --system-spectrum-actionbutton-staticwhite-selected-background-color-down: var(
+        --spectrum-transparent-white-900
+    );
+    --system-spectrum-actionbutton-staticwhite-selected-background-color-focus: var(
+        --spectrum-transparent-white-900
+    );
+    --system-spectrum-actionbutton-staticwhite-selected-content-color-default: var(
+        --spectrum-black
+    );
+    --system-spectrum-actionbutton-staticwhite-selected-content-color-hover: var(
+        --spectrum-black
+    );
+    --system-spectrum-actionbutton-staticwhite-selected-content-color-down: var(
+        --spectrum-black
+    );
+    --system-spectrum-actionbutton-staticwhite-selected-content-color-focus: var(
+        --spectrum-black
+    );
+    --system-spectrum-actionbutton-staticwhite-selected-background-color-disabled: var(
+        --spectrum-disabled-static-white-background-color
+    );
+    --system-spectrum-actionbutton-staticwhite-selected-border-color-disabled: transparent;
+}

package/tokens/express/large-vars.css

@@ -0,0 +1,48 @@
+/*
+Copyright 2022 Adobe. All rights reserved.
+This file is licensed to you under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License. You may obtain a copy
+of the License at http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under
+the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+OF ANY KIND, either express or implied. See the License for the specific language
+governing permissions and limitations under the License.
+*/
+
+:host {
+    --spectrum-checkbox-control-size-small: 18px;
+    --spectrum-checkbox-control-size-medium: 20px;
+    --spectrum-checkbox-control-size-large: 22px;
+    --spectrum-checkbox-control-size-extra-large: 26px;
+    --spectrum-checkbox-top-to-control-small: 6px;
+    --spectrum-checkbox-top-to-control-medium: 10px;
+    --spectrum-checkbox-top-to-control-large: 14px;
+    --spectrum-checkbox-top-to-control-extra-large: 17px;
+    --spectrum-radio-button-control-size-small: 18px;
+    --spectrum-radio-button-control-size-medium: 20px;
+    --spectrum-radio-button-control-size-large: 22px;
+    --spectrum-radio-button-control-size-extra-large: 26px;
+    --spectrum-radio-button-top-to-control-small: 6px;
+    --spectrum-radio-button-top-to-control-medium: 10px;
+    --spectrum-radio-button-top-to-control-large: 14px;
+    --spectrum-radio-button-top-to-control-extra-large: 17px;
+    --spectrum-switch-control-width-small: 32px;
+    --spectrum-switch-control-width-medium: 36px;
+    --spectrum-switch-control-width-large: 41px;
+    --spectrum-switch-control-width-extra-large: 46px;
+    --spectrum-switch-control-height-small: 18px;
+    --spectrum-switch-control-height-medium: 20px;
+    --spectrum-switch-control-height-large: 22px;
+    --spectrum-switch-control-height-extra-large: 26px;
+    --spectrum-switch-top-to-control-small: 6px;
+    --spectrum-switch-top-to-control-medium: 10px;
+    --spectrum-switch-top-to-control-large: 14px;
+    --spectrum-switch-top-to-control-extra-large: 17px;
+    --spectrum-corner-radius-75: 4px;
+    --spectrum-corner-radius-100: 8px;
+    --spectrum-corner-radius-200: 16px;
+    --spectrum-drop-shadow-x: 0px;
+    --spectrum-drop-shadow-y: 4px;
+    --spectrum-drop-shadow-blur: 16px;
+}