@@ -11,6 +11,69 @@ governing permissions and limitations under the License.
1111*/
1212
1313/* THIS FILE IS MACHINE GENERATED. DO NOT EDIT */
14+ # list {
15+ --spectrum-tabs-item-height : var (--spectrum-tab-item-height-medium );
16+ --spectrum-tabs-item-horizontal-spacing : var (--spectrum-tab-item-to-tab-item-horizontal-medium );
17+ --spectrum-tabs-item-vertical-spacing : var (--spectrum-tab-item-to-tab-item-vertical-medium );
18+ --spectrum-tabs-start-to-edge : var (--spectrum-tab-item-start-to-edge-medium );
19+ --spectrum-tabs-top-to-text : var (--spectrum-tab-item-top-to-text-medium );
20+ --spectrum-tabs-bottom-to-text : var (--spectrum-tab-item-bottom-to-text-medium );
21+ --spectrum-tabs-icon-size : var (--spectrum-workflow-icon-size-75 );
22+ --spectrum-tabs-icon-to-text : var (--spectrum-text-to-visual-100 );
23+ --spectrum-tabs-top-to-icon : var (--spectrum-tab-item-top-to-workflow-icon-medium );
24+ --spectrum-tabs-color : var (--spectrum-neutral-subdued-content-color-default );
25+ --spectrum-tabs-color-selected : var (--spectrum-neutral-subdued-content-color-down );
26+ --spectrum-tabs-color-hover : var (--spectrum-neutral-subdued-content-color-hover );
27+ --spectrum-tabs-color-key-focus : var (--spectrum-neutral-subdued-content-color-key-focus );
28+ --spectrum-tabs-color-disabled : var (--spectrum-gray-500 );
29+ --spectrum-tabs-font-family : var (--spectrum-sans-font-family-stack );
30+ --spectrum-tabs-font-style : var (--spectrum-default-font-style );
31+ --spectrum-tabs-font-size : var (--spectrum-font-size-100 );
32+ --spectrum-tabs-line-height : var (--spectrum-line-height-100 );
33+ --spectrum-tabs-focus-indicator-width : var (--spectrum-focus-indicator-thickness );
34+ --spectrum-tabs-focus-indicator-border-radius : var (--spectrum-corner-radius-100 );
35+ --spectrum-tabs-focus-indicator-gap : var (--spectrum-tab-item-focus-indicator-gap-medium );
36+ --spectrum-tabs-focus-indicator-color : var (--spectrum-focus-indicator-color );
37+ --spectrum-tabs-selection-indicator-color : var (--spectrum-neutral-subdued-content-color-down );
38+ --spectrum-tabs-list-background-direction : top;
39+ --spectrum-tabs-divider-size : var (--spectrum-border-width-200 );
40+ --spectrum-tabs-divider-border-radius : 1px ;
41+ --spectrum-tabs-animation-duration : var (--spectrum-animation-duration-100 );
42+ --spectrum-tabs-animation-ease : var (--spectrum-animation-ease-in-out );
43+ }
44+
45+ : host ([emphasized ]) # list {
46+ --mod-tabs-color-selected : var (--mod-tabs-color-selected-emphasized , var (--spectrum-accent-content-color-default ));
47+ --mod-tabs-color-hover : var (--mod-tabs-color-hover-emphasized , var (--spectrum-accent-content-color-hover ));
48+ --mod-tabs-color-key-focus : var (--mod-tabs-color-key-focus-emphasized , var (--spectrum-accent-content-color-key-focus ));
49+ --mod-tabs-selection-indicator-color : var (--mod-tabs-selection-indicator-color-emphasized , var (--spectrum-accent-content-color-default ));
50+ }
51+
52+ : host ([direction ^= 'vertical' ]) # list {
53+ --mod-tabs-list-background-direction : var (--mod-tabs-list-background-direction-vertical , right);
54+ }
55+
56+ : host ([direction ^= 'vertical-right' ]) # list {
57+ --mod-tabs-list-background-direction : var (--mod-tabs-list-background-direction-vertical-right , left);
58+ }
59+
60+ : host ([direction ^= 'vertical' ]) # list : dir(rtl),
61+ : host ([dir = 'rtl' ][direction ^= 'vertical' ]) # list {
62+ --mod-tabs-list-background-direction : var (--mod-tabs-list-background-direction-vertical , left);
63+ }
64+
65+ : host ([direction ^= 'vertical-right' ]) # list : dir(rtl),
66+ : host ([dir = 'rtl' ][direction ^= 'vertical-right' ]) # list {
67+ --mod-tabs-list-background-direction : var (--mod-tabs-list-background-direction-vertical , right);
68+ }
69+
70+ : host ([compact ]) # list {
71+ --mod-tabs-item-height : var (--mod-tabs-item-height-compact , var (--spectrum-tab-item-compact-height-medium ));
72+ --mod-tabs-top-to-text : var (--mod-tabs-top-to-text-compact , var (--spectrum-tab-item-top-to-text-compact-medium ));
73+ --mod-tabs-bottom-to-text : var (--mod-tabs-bottom-to-text-compact , var (--spectrum-tab-item-top-to-text-compact-medium ));
74+ --mod-tabs-top-to-icon : var (--mod-tabs-top-to-icon-compact , var (--spectrum-tab-item-top-to-workflow-icon-compact-medium ));
75+ }
76+
1477# list {
1578 z-index : 0 ;
1679 vertical-align : top;
@@ -21,13 +84,6 @@ governing permissions and limitations under the License.
2184 position : relative;
2285}
2386
24- : host ([emphasized ]) # list {
25- --mod-tabs-color-selected : var (--mod-tabs-color-selected-emphasized , var (--spectrum-tabs-color-selected ));
26- --mod-tabs-color-hover : var (--mod-tabs-color-hover-emphasized , var (--spectrum-tabs-color-hover ));
27- --mod-tabs-color-key-focus : var (--mod-tabs-color-key-focus-emphasized , var (--spectrum-tabs-color-key-focus ));
28- --mod-tabs-selection-indicator-color : var (--mod-tabs-selection-indicator-color-emphasized , var (--spectrum-tabs-selection-indicator-color ));
29- }
30-
3187::slotted ([selected ]: not ([slot ])) {
3288 color : var (--highcontrast-tabs-color-selected , var (--mod-tabs-color-selected , var (--spectrum-tabs-color-selected )));
3389}
@@ -77,11 +133,7 @@ governing permissions and limitations under the License.
77133}
78134
79135: host ([quiet ]) # selection-indicator {
80- padding-inline-start : var (--mod-tabs-start-to-item-quiet , var (--spectrum-tabs-start-to-item-quiet ));
81- }
82-
83- : host ([direction ^= 'vertical' ]) # list {
84- --mod-tabs-list-background-direction : var (--mod-tabs-list-background-direction-vertical , right);
136+ padding-inline-start : var (--mod-tabs-start-to-item-quiet );
85137}
86138
87139: host ([direction ^= 'vertical' ]) # list ,
@@ -119,31 +171,10 @@ governing permissions and limitations under the License.
119171 inset-inline-start : 0 ;
120172}
121173
122- : host ([direction ^= 'vertical-right' ]) # list {
123- --mod-tabs-list-background-direction : var (--mod-tabs-list-background-direction-vertical-right , left);
124- }
125-
126174: host ([direction ^= 'vertical-right' ]) # list # selection-indicator {
127175 inset-inline : auto 0 ;
128176}
129177
130- : host ([direction ^= 'vertical' ]) # list : dir(rtl),
131- : host ([dir = 'rtl' ][direction ^= 'vertical' ]) # list {
132- --mod-tabs-list-background-direction : var (--mod-tabs-list-background-direction-vertical , left);
133- }
134-
135- : host ([direction ^= 'vertical-right' ]) # list : dir(rtl),
136- : host ([dir = 'rtl' ][direction ^= 'vertical-right' ]) # list {
137- --mod-tabs-list-background-direction : var (--mod-tabs-list-background-direction-vertical , right);
138- }
139-
140- : host ([compact ]) # list {
141- --spectrum-tabs-item-height : var (--mod-tabs-item-height-compact , var (--spectrum-tab-item-compact-height-medium ));
142- --spectrum-tabs-top-to-text : var (--mod-tabs-top-to-text-compact , var (--spectrum-tab-item-top-to-text-compact-medium ));
143- --spectrum-tabs-bottom-to-text : var (--mod-tabs-bottom-to-text-compact , var (--spectrum-tab-item-top-to-text-compact-medium ));
144- --spectrum-tabs-top-to-icon : var (--mod-tabs-top-to-icon-compact , var (--spectrum-tab-item-top-to-workflow-icon-compact-medium ));
145- }
146-
147178@media (forced-colors : active) {
148179 # list {
149180 --highcontrast-tabs-divider-background-color : var (--spectrum-gray-500 );
0 commit comments