@spectrum-web-components/tabs 0.8.13 → 0.8.15-devmode.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (71) hide show
  1. package/package.json +41 -14
  2. package/sp-tab-panel.dev.js +3 -0
  3. package/sp-tab-panel.dev.js.map +7 -0
  4. package/sp-tab-panel.js +3 -14
  5. package/sp-tab-panel.js.map +7 -1
  6. package/sp-tab.dev.js +3 -0
  7. package/sp-tab.dev.js.map +7 -0
  8. package/sp-tab.js +3 -14
  9. package/sp-tab.js.map +7 -1
  10. package/sp-tabs.dev.js +3 -0
  11. package/sp-tabs.dev.js.map +7 -0
  12. package/sp-tabs.js +3 -14
  13. package/sp-tabs.js.map +7 -1
  14. package/src/Tab.dev.js +101 -0
  15. package/src/Tab.dev.js.map +7 -0
  16. package/src/Tab.js +92 -103
  17. package/src/Tab.js.map +7 -1
  18. package/src/TabPanel.dev.js +58 -0
  19. package/src/TabPanel.dev.js.map +7 -0
  20. package/src/TabPanel.js +51 -57
  21. package/src/TabPanel.js.map +7 -1
  22. package/src/Tabs.dev.js +304 -0
  23. package/src/Tabs.dev.js.map +7 -0
  24. package/src/Tabs.js +275 -302
  25. package/src/Tabs.js.map +7 -1
  26. package/src/index.dev.js +4 -0
  27. package/src/index.dev.js.map +7 -0
  28. package/src/index.js +4 -15
  29. package/src/index.js.map +7 -1
  30. package/src/spectrum-tab.css.dev.js +40 -0
  31. package/src/spectrum-tab.css.dev.js.map +7 -0
  32. package/src/spectrum-tab.css.js +3 -14
  33. package/src/spectrum-tab.css.js.map +7 -1
  34. package/src/spectrum-tabs.css.dev.js +392 -0
  35. package/src/spectrum-tabs.css.dev.js.map +7 -0
  36. package/src/spectrum-tabs.css.js +3 -14
  37. package/src/spectrum-tabs.css.js.map +7 -1
  38. package/src/tab-panel.css.dev.js +6 -0
  39. package/src/tab-panel.css.dev.js.map +7 -0
  40. package/src/tab-panel.css.js +3 -14
  41. package/src/tab-panel.css.js.map +7 -1
  42. package/src/tab.css.dev.js +54 -0
  43. package/src/tab.css.dev.js.map +7 -0
  44. package/src/tab.css.js +3 -14
  45. package/src/tab.css.js.map +7 -1
  46. package/src/tabs.css.dev.js +406 -0
  47. package/src/tabs.css.dev.js.map +7 -0
  48. package/src/tabs.css.js +3 -14
  49. package/src/tabs.css.js.map +7 -1
  50. package/stories/tabs-horizontal-sizes.stories.js +53 -64
  51. package/stories/tabs-horizontal-sizes.stories.js.map +7 -1
  52. package/stories/tabs-vertical-right-sizes.stories.js +50 -61
  53. package/stories/tabs-vertical-right-sizes.stories.js.map +7 -1
  54. package/stories/tabs-vertical-sizes.stories.js +50 -61
  55. package/stories/tabs-vertical-sizes.stories.js.map +7 -1
  56. package/stories/tabs.stories.js +79 -81
  57. package/stories/tabs.stories.js.map +7 -1
  58. package/test/benchmark/basic-test.js +6 -17
  59. package/test/benchmark/basic-test.js.map +7 -1
  60. package/test/tab.test.js +21 -34
  61. package/test/tab.test.js.map +7 -1
  62. package/test/tabs-horizontal-sizes.test-vrt.js +4 -15
  63. package/test/tabs-horizontal-sizes.test-vrt.js.map +7 -1
  64. package/test/tabs-vertical-right-sizes.test-vrt.js +4 -15
  65. package/test/tabs-vertical-right-sizes.test-vrt.js.map +7 -1
  66. package/test/tabs-vertical-sizes.test-vrt.js +4 -15
  67. package/test/tabs-vertical-sizes.test-vrt.js.map +7 -1
  68. package/test/tabs.test-vrt.js +4 -15
  69. package/test/tabs.test-vrt.js.map +7 -1
  70. package/test/tabs.test.js +375 -383
  71. package/test/tabs.test.js.map +7 -1
@@ -0,0 +1,406 @@
1
+ import { css } from "@spectrum-web-components/base";
2
+ const styles = css`
3
+ :host([size=s]){--spectrum-tabs-quiet-textonly-tabitem-selection-indicator-background-color-selected:var(
4
+ --spectrum-tabs-s-quiet-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)
5
+ );--spectrum-tabs-quiet-textonly-divider-background-color:var(
6
+ --spectrum-tabs-s-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)
7
+ );--spectrum-tabs-quiet-textonly-tabitem-icon-gap:var(
8
+ --spectrum-tabs-s-quiet-textonly-tabitem-icon-gap,var(--spectrum-global-dimension-size-85)
9
+ );--spectrum-tabs-quiet-textonly-tabitem-focus-ring-padding-x:var(
10
+ --spectrum-tabs-s-quiet-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-85)
11
+ );--spectrum-tabs-quiet-textonly-tabitem-height:var(
12
+ --spectrum-tabs-s-quiet-textonly-tabitem-height,var(--spectrum-global-dimension-size-500)
13
+ );--spectrum-tabs-quiet-textonly-divider-size:var(
14
+ --spectrum-tabs-s-quiet-textonly-divider-size,var(--spectrum-alias-border-size-thick)
15
+ );--spectrum-tabs-emphasized-texticon-tabitem-icon-color-selected:var(
16
+ --spectrum-tabs-s-emphasized-texticon-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)
17
+ );--spectrum-tabs-emphasized-texticon-tabitem-text-color-selected:var(
18
+ --spectrum-tabs-s-emphasized-texticon-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)
19
+ );--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected:var(
20
+ --spectrum-tabs-s-emphasized-texticon-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-selection-indicator-color-emphasized)
21
+ );--spectrum-tabs-emphasized-textonly-divider-background-color:var(
22
+ --spectrum-tabs-s-emphasized-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)
23
+ );--spectrum-tabs-texticon-tabitem-text-size:var(
24
+ --spectrum-tabs-s-texticon-tabitem-text-size,var(--spectrum-global-dimension-font-size-75)
25
+ );--spectrum-tabs-texticon-tabitem-selection-indicator-animation-duration:var(
26
+ --spectrum-tabs-s-texticon-tabitem-selection-indicator-animation-duration,var(--spectrum-global-animation-duration-100)
27
+ );--spectrum-tabs-texticon-tabitem-selection-indicator-animation-ease:var(
28
+ --spectrum-tabs-s-texticon-tabitem-selection-indicator-animation-ease,var(--spectrum-global-animation-ease-in-out)
29
+ );--spectrum-tabs-textonly-tabitem-icon-color-selected:var(
30
+ --spectrum-tabs-s-textonly-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-icon-color-selected)
31
+ );--spectrum-tabs-textonly-tabitem-text-color-selected:var(
32
+ --spectrum-tabs-s-textonly-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)
33
+ );--spectrum-tabs-textonly-tabitem-selection-indicator-background-color-selected:var(
34
+ --spectrum-tabs-s-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)
35
+ );--spectrum-tabs-textonly-tabitem-icon-color-selected-key-focus:var(
36
+ --spectrum-tabs-s-textonly-tabitem-icon-color-selected-key-focus,var(--spectrum-alias-tabitem-icon-color-selected)
37
+ );--spectrum-tabs-textonly-tabitem-text-color-selected-key-focus:var(
38
+ --spectrum-tabs-s-textonly-tabitem-text-color-selected-key-focus,var(--spectrum-alias-tabitem-text-color-selected-key-focus)
39
+ );--spectrum-tabs-textonly-tabitem-icon-color-disabled:var(
40
+ --spectrum-tabs-s-textonly-tabitem-icon-color-disabled,var(--spectrum-alias-tabitem-icon-color-disabled)
41
+ );--spectrum-tabs-textonly-tabitem-text-color-disabled:var(
42
+ --spectrum-tabs-s-textonly-tabitem-text-color-disabled,var(--spectrum-alias-text-color-disabled)
43
+ );--spectrum-tabs-textonly-tabitem-icon-color:var(
44
+ --spectrum-tabs-s-textonly-tabitem-icon-color,var(--spectrum-alias-tabitem-icon-color-default)
45
+ );--spectrum-tabs-textonly-tabitem-text-color:var(
46
+ --spectrum-tabs-s-textonly-tabitem-text-color,var(--spectrum-alias-tabitem-text-color-default)
47
+ );--spectrum-tabs-textonly-tabitem-icon-color-hover:var(
48
+ --spectrum-tabs-s-textonly-tabitem-icon-color-hover,var(--spectrum-alias-tabitem-icon-color-hover)
49
+ );--spectrum-tabs-textonly-tabitem-text-color-hover:var(
50
+ --spectrum-tabs-s-textonly-tabitem-text-color-hover,var(--spectrum-alias-tabitem-text-color-hover)
51
+ );--spectrum-tabs-textonly-tabitem-focus-ring-border-color-key-focus:var(
52
+ --spectrum-tabs-s-textonly-tabitem-focus-ring-border-color-key-focus,var(--spectrum-alias-focus-ring-color)
53
+ );--spectrum-tabs-textonly-divider-background-color:var(
54
+ --spectrum-tabs-s-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)
55
+ );--spectrum-tabs-textonly-tabitem-text-font-weight:var(
56
+ --spectrum-tabs-s-textonly-tabitem-text-font-weight,var(--spectrum-alias-body-text-font-weight)
57
+ );--spectrum-tabs-textonly-tabitem-focus-ring-size:var(
58
+ --spectrum-tabs-s-textonly-tabitem-focus-ring-size,var(--spectrum-alias-focus-ring-size)
59
+ );--spectrum-tabs-textonly-tabitem-focus-ring-height:var(
60
+ --spectrum-tabs-s-textonly-tabitem-focus-ring-height,var(--spectrum-global-dimension-size-300)
61
+ );--spectrum-tabs-textonly-tabitem-focus-ring-padding-x:var(
62
+ --spectrum-tabs-s-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-85)
63
+ );--spectrum-tabs-textonly-tabitem-focus-ring-border-radius:var(
64
+ --spectrum-tabs-s-textonly-tabitem-focus-ring-border-radius,var(--spectrum-alias-border-radius-regular)
65
+ );--spectrum-tabs-textonly-tabitem-margin-right:var(
66
+ --spectrum-tabs-s-textonly-tabitem-margin-right,var(--spectrum-global-dimension-size-300)
67
+ );--spectrum-tabs-textonly-divider-border-radius:var(
68
+ --spectrum-tabs-s-textonly-divider-border-radius,var(--spectrum-global-dimension-static-size-10)
69
+ );--spectrum-tabs-vertical-quiet-textonly-divider-background-color:var(
70
+ --spectrum-tabs-s-vertical-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)
71
+ );--spectrum-tabs-vertical-textonly-tabitem-selection-indicator-background-color-selected:var(
72
+ --spectrum-tabs-s-vertical-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)
73
+ );--spectrum-tabs-vertical-textonly-divider-background-color:var(
74
+ --spectrum-tabs-s-vertical-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)
75
+ );--spectrum-tabs-vertical-textonly-tabitem-height:var(
76
+ --spectrum-tabs-s-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-450)
77
+ );--spectrum-tabs-vertical-textonly-tabitem-gap:var(
78
+ --spectrum-tabs-s-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-85)
79
+ );--spectrum-tabs-compact-textonly-divider-size:var(
80
+ --spectrum-tabs-s-compact-textonly-divider-size,var(--spectrum-alias-border-size-thick)
81
+ );--spectrum-tabs-compact-textonly-height:var(
82
+ --spectrum-tabs-s-compact-textonly-height,var(--spectrum-global-dimension-size-300)
83
+ );--spectrum-tabs-compact-vertical-textonly-tabitem-height:var(
84
+ --spectrum-tabs-s-compact-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-300)
85
+ );--spectrum-tabs-compact-vertical-textonly-tabitem-gap:var(
86
+ --spectrum-tabs-s-compact-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-85)
87
+ )}:host([size=m]){--spectrum-tabs-quiet-textonly-tabitem-selection-indicator-background-color-selected:var(
88
+ --spectrum-tabs-m-quiet-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)
89
+ );--spectrum-tabs-quiet-textonly-divider-background-color:var(
90
+ --spectrum-tabs-m-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)
91
+ );--spectrum-tabs-quiet-textonly-tabitem-icon-gap:var(
92
+ --spectrum-tabs-m-quiet-textonly-tabitem-icon-gap,var(--spectrum-global-dimension-size-100)
93
+ );--spectrum-tabs-quiet-textonly-tabitem-focus-ring-padding-x:var(
94
+ --spectrum-tabs-m-quiet-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-100)
95
+ );--spectrum-tabs-quiet-textonly-tabitem-height:var(
96
+ --spectrum-tabs-m-quiet-textonly-tabitem-height,var(--spectrum-global-dimension-size-600)
97
+ );--spectrum-tabs-quiet-textonly-divider-size:var(
98
+ --spectrum-tabs-m-quiet-textonly-divider-size,var(--spectrum-alias-border-size-thick)
99
+ );--spectrum-tabs-emphasized-texticon-tabitem-icon-color-selected:var(
100
+ --spectrum-tabs-m-emphasized-texticon-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)
101
+ );--spectrum-tabs-emphasized-texticon-tabitem-text-color-selected:var(
102
+ --spectrum-tabs-m-emphasized-texticon-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)
103
+ );--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected:var(
104
+ --spectrum-tabs-m-emphasized-texticon-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-selection-indicator-color-emphasized)
105
+ );--spectrum-tabs-emphasized-textonly-divider-background-color:var(
106
+ --spectrum-tabs-m-emphasized-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)
107
+ );--spectrum-tabs-texticon-tabitem-text-size:var(
108
+ --spectrum-tabs-m-texticon-tabitem-text-size,var(--spectrum-global-dimension-font-size-100)
109
+ );--spectrum-tabs-texticon-tabitem-selection-indicator-animation-duration:var(
110
+ --spectrum-tabs-m-texticon-tabitem-selection-indicator-animation-duration,var(--spectrum-global-animation-duration-100)
111
+ );--spectrum-tabs-texticon-tabitem-selection-indicator-animation-ease:var(
112
+ --spectrum-tabs-m-texticon-tabitem-selection-indicator-animation-ease,var(--spectrum-global-animation-ease-in-out)
113
+ );--spectrum-tabs-textonly-tabitem-icon-color-selected:var(
114
+ --spectrum-tabs-m-textonly-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-icon-color-selected)
115
+ );--spectrum-tabs-textonly-tabitem-text-color-selected:var(
116
+ --spectrum-tabs-m-textonly-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)
117
+ );--spectrum-tabs-textonly-tabitem-selection-indicator-background-color-selected:var(
118
+ --spectrum-tabs-m-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)
119
+ );--spectrum-tabs-textonly-tabitem-icon-color-selected-key-focus:var(
120
+ --spectrum-tabs-m-textonly-tabitem-icon-color-selected-key-focus,var(--spectrum-alias-tabitem-icon-color-selected)
121
+ );--spectrum-tabs-textonly-tabitem-text-color-selected-key-focus:var(
122
+ --spectrum-tabs-m-textonly-tabitem-text-color-selected-key-focus,var(--spectrum-alias-tabitem-text-color-selected-key-focus)
123
+ );--spectrum-tabs-textonly-tabitem-icon-color-disabled:var(
124
+ --spectrum-tabs-m-textonly-tabitem-icon-color-disabled,var(--spectrum-alias-tabitem-icon-color-disabled)
125
+ );--spectrum-tabs-textonly-tabitem-text-color-disabled:var(
126
+ --spectrum-tabs-m-textonly-tabitem-text-color-disabled,var(--spectrum-alias-text-color-disabled)
127
+ );--spectrum-tabs-textonly-tabitem-icon-color:var(
128
+ --spectrum-tabs-m-textonly-tabitem-icon-color,var(--spectrum-alias-tabitem-icon-color-default)
129
+ );--spectrum-tabs-textonly-tabitem-text-color:var(
130
+ --spectrum-tabs-m-textonly-tabitem-text-color,var(--spectrum-alias-tabitem-text-color-default)
131
+ );--spectrum-tabs-textonly-tabitem-icon-color-hover:var(
132
+ --spectrum-tabs-m-textonly-tabitem-icon-color-hover,var(--spectrum-alias-tabitem-icon-color-hover)
133
+ );--spectrum-tabs-textonly-tabitem-text-color-hover:var(
134
+ --spectrum-tabs-m-textonly-tabitem-text-color-hover,var(--spectrum-alias-tabitem-text-color-hover)
135
+ );--spectrum-tabs-textonly-tabitem-focus-ring-border-color-key-focus:var(
136
+ --spectrum-tabs-m-textonly-tabitem-focus-ring-border-color-key-focus,var(--spectrum-alias-focus-ring-color)
137
+ );--spectrum-tabs-textonly-divider-background-color:var(
138
+ --spectrum-tabs-m-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)
139
+ );--spectrum-tabs-textonly-tabitem-text-font-weight:var(
140
+ --spectrum-tabs-m-textonly-tabitem-text-font-weight,var(--spectrum-alias-body-text-font-weight)
141
+ );--spectrum-tabs-textonly-tabitem-focus-ring-size:var(
142
+ --spectrum-tabs-m-textonly-tabitem-focus-ring-size,var(--spectrum-alias-focus-ring-size)
143
+ );--spectrum-tabs-textonly-tabitem-focus-ring-height:var(
144
+ --spectrum-tabs-m-textonly-tabitem-focus-ring-height,var(--spectrum-global-dimension-size-400)
145
+ );--spectrum-tabs-textonly-tabitem-focus-ring-padding-x:var(
146
+ --spectrum-tabs-m-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-100)
147
+ );--spectrum-tabs-textonly-tabitem-focus-ring-border-radius:var(
148
+ --spectrum-tabs-m-textonly-tabitem-focus-ring-border-radius,var(--spectrum-alias-border-radius-regular)
149
+ );--spectrum-tabs-textonly-tabitem-margin-right:var(
150
+ --spectrum-tabs-m-textonly-tabitem-margin-right,var(--spectrum-global-dimension-size-300)
151
+ );--spectrum-tabs-textonly-divider-border-radius:var(
152
+ --spectrum-tabs-m-textonly-divider-border-radius,var(--spectrum-global-dimension-static-size-10)
153
+ );--spectrum-tabs-vertical-quiet-textonly-divider-background-color:var(
154
+ --spectrum-tabs-m-vertical-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)
155
+ );--spectrum-tabs-vertical-textonly-tabitem-selection-indicator-background-color-selected:var(
156
+ --spectrum-tabs-m-vertical-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)
157
+ );--spectrum-tabs-vertical-textonly-divider-background-color:var(
158
+ --spectrum-tabs-m-vertical-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)
159
+ );--spectrum-tabs-vertical-textonly-tabitem-height:var(
160
+ --spectrum-tabs-m-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-550)
161
+ );--spectrum-tabs-vertical-textonly-tabitem-gap:var(
162
+ --spectrum-tabs-m-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-100)
163
+ );--spectrum-tabs-compact-textonly-divider-size:var(
164
+ --spectrum-tabs-m-compact-textonly-divider-size,var(--spectrum-alias-border-size-thick)
165
+ );--spectrum-tabs-compact-textonly-height:var(
166
+ --spectrum-tabs-m-compact-textonly-height,var(--spectrum-global-dimension-size-400)
167
+ );--spectrum-tabs-compact-vertical-textonly-tabitem-height:var(
168
+ --spectrum-tabs-m-compact-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-400)
169
+ );--spectrum-tabs-compact-vertical-textonly-tabitem-gap:var(
170
+ --spectrum-tabs-m-compact-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-100)
171
+ )}:host([size=l]){--spectrum-tabs-quiet-textonly-tabitem-selection-indicator-background-color-selected:var(
172
+ --spectrum-tabs-l-quiet-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)
173
+ );--spectrum-tabs-quiet-textonly-divider-background-color:var(
174
+ --spectrum-tabs-l-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)
175
+ );--spectrum-tabs-quiet-textonly-tabitem-icon-gap:var(
176
+ --spectrum-tabs-l-quiet-textonly-tabitem-icon-gap,var(--spectrum-global-dimension-size-115)
177
+ );--spectrum-tabs-quiet-textonly-tabitem-focus-ring-padding-x:var(
178
+ --spectrum-tabs-l-quiet-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-115)
179
+ );--spectrum-tabs-quiet-textonly-tabitem-height:var(
180
+ --spectrum-tabs-l-quiet-textonly-tabitem-height,var(--spectrum-global-dimension-size-700)
181
+ );--spectrum-tabs-quiet-textonly-divider-size:var(
182
+ --spectrum-tabs-l-quiet-textonly-divider-size,var(--spectrum-alias-border-size-thick)
183
+ );--spectrum-tabs-emphasized-texticon-tabitem-icon-color-selected:var(
184
+ --spectrum-tabs-l-emphasized-texticon-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)
185
+ );--spectrum-tabs-emphasized-texticon-tabitem-text-color-selected:var(
186
+ --spectrum-tabs-l-emphasized-texticon-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)
187
+ );--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected:var(
188
+ --spectrum-tabs-l-emphasized-texticon-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-selection-indicator-color-emphasized)
189
+ );--spectrum-tabs-emphasized-textonly-divider-background-color:var(
190
+ --spectrum-tabs-l-emphasized-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)
191
+ );--spectrum-tabs-texticon-tabitem-text-size:var(
192
+ --spectrum-tabs-l-texticon-tabitem-text-size,var(--spectrum-global-dimension-font-size-200)
193
+ );--spectrum-tabs-texticon-tabitem-selection-indicator-animation-duration:var(
194
+ --spectrum-tabs-l-texticon-tabitem-selection-indicator-animation-duration,var(--spectrum-global-animation-duration-100)
195
+ );--spectrum-tabs-texticon-tabitem-selection-indicator-animation-ease:var(
196
+ --spectrum-tabs-l-texticon-tabitem-selection-indicator-animation-ease,var(--spectrum-global-animation-ease-in-out)
197
+ );--spectrum-tabs-textonly-tabitem-icon-color-selected:var(
198
+ --spectrum-tabs-l-textonly-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-icon-color-selected)
199
+ );--spectrum-tabs-textonly-tabitem-text-color-selected:var(
200
+ --spectrum-tabs-l-textonly-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)
201
+ );--spectrum-tabs-textonly-tabitem-selection-indicator-background-color-selected:var(
202
+ --spectrum-tabs-l-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)
203
+ );--spectrum-tabs-textonly-tabitem-icon-color-selected-key-focus:var(
204
+ --spectrum-tabs-l-textonly-tabitem-icon-color-selected-key-focus,var(--spectrum-alias-tabitem-icon-color-selected)
205
+ );--spectrum-tabs-textonly-tabitem-text-color-selected-key-focus:var(
206
+ --spectrum-tabs-l-textonly-tabitem-text-color-selected-key-focus,var(--spectrum-alias-tabitem-text-color-selected-key-focus)
207
+ );--spectrum-tabs-textonly-tabitem-icon-color-disabled:var(
208
+ --spectrum-tabs-l-textonly-tabitem-icon-color-disabled,var(--spectrum-alias-tabitem-icon-color-disabled)
209
+ );--spectrum-tabs-textonly-tabitem-text-color-disabled:var(
210
+ --spectrum-tabs-l-textonly-tabitem-text-color-disabled,var(--spectrum-alias-text-color-disabled)
211
+ );--spectrum-tabs-textonly-tabitem-icon-color:var(
212
+ --spectrum-tabs-l-textonly-tabitem-icon-color,var(--spectrum-alias-tabitem-icon-color-default)
213
+ );--spectrum-tabs-textonly-tabitem-text-color:var(
214
+ --spectrum-tabs-l-textonly-tabitem-text-color,var(--spectrum-alias-tabitem-text-color-default)
215
+ );--spectrum-tabs-textonly-tabitem-icon-color-hover:var(
216
+ --spectrum-tabs-l-textonly-tabitem-icon-color-hover,var(--spectrum-alias-tabitem-icon-color-hover)
217
+ );--spectrum-tabs-textonly-tabitem-text-color-hover:var(
218
+ --spectrum-tabs-l-textonly-tabitem-text-color-hover,var(--spectrum-alias-tabitem-text-color-hover)
219
+ );--spectrum-tabs-textonly-tabitem-focus-ring-border-color-key-focus:var(
220
+ --spectrum-tabs-l-textonly-tabitem-focus-ring-border-color-key-focus,var(--spectrum-alias-focus-ring-color)
221
+ );--spectrum-tabs-textonly-divider-background-color:var(
222
+ --spectrum-tabs-l-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)
223
+ );--spectrum-tabs-textonly-tabitem-text-font-weight:var(
224
+ --spectrum-tabs-l-textonly-tabitem-text-font-weight,var(--spectrum-alias-body-text-font-weight)
225
+ );--spectrum-tabs-textonly-tabitem-focus-ring-size:var(
226
+ --spectrum-tabs-l-textonly-tabitem-focus-ring-size,var(--spectrum-alias-focus-ring-size)
227
+ );--spectrum-tabs-textonly-tabitem-focus-ring-height:var(
228
+ --spectrum-tabs-l-textonly-tabitem-focus-ring-height,var(--spectrum-global-dimension-size-500)
229
+ );--spectrum-tabs-textonly-tabitem-focus-ring-padding-x:var(
230
+ --spectrum-tabs-l-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-115)
231
+ );--spectrum-tabs-textonly-tabitem-focus-ring-border-radius:var(
232
+ --spectrum-tabs-l-textonly-tabitem-focus-ring-border-radius,var(--spectrum-alias-border-radius-regular)
233
+ );--spectrum-tabs-textonly-tabitem-margin-right:var(
234
+ --spectrum-tabs-l-textonly-tabitem-margin-right,var(--spectrum-global-dimension-size-300)
235
+ );--spectrum-tabs-textonly-divider-border-radius:var(
236
+ --spectrum-tabs-l-textonly-divider-border-radius,var(--spectrum-global-dimension-static-size-10)
237
+ );--spectrum-tabs-vertical-quiet-textonly-divider-background-color:var(
238
+ --spectrum-tabs-l-vertical-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)
239
+ );--spectrum-tabs-vertical-textonly-tabitem-selection-indicator-background-color-selected:var(
240
+ --spectrum-tabs-l-vertical-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)
241
+ );--spectrum-tabs-vertical-textonly-divider-background-color:var(
242
+ --spectrum-tabs-l-vertical-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)
243
+ );--spectrum-tabs-vertical-textonly-tabitem-height:var(
244
+ --spectrum-tabs-l-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-650)
245
+ );--spectrum-tabs-vertical-textonly-tabitem-gap:var(
246
+ --spectrum-tabs-l-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-115)
247
+ );--spectrum-tabs-compact-textonly-divider-size:var(
248
+ --spectrum-tabs-l-compact-textonly-divider-size,var(--spectrum-alias-border-size-thick)
249
+ );--spectrum-tabs-compact-textonly-height:var(
250
+ --spectrum-tabs-l-compact-textonly-height,var(--spectrum-global-dimension-size-500)
251
+ );--spectrum-tabs-compact-vertical-textonly-tabitem-height:var(
252
+ --spectrum-tabs-l-compact-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-500)
253
+ );--spectrum-tabs-compact-vertical-textonly-tabitem-gap:var(
254
+ --spectrum-tabs-l-compact-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-115)
255
+ )}:host([size=xl]){--spectrum-tabs-quiet-textonly-tabitem-selection-indicator-background-color-selected:var(
256
+ --spectrum-tabs-xl-quiet-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)
257
+ );--spectrum-tabs-quiet-textonly-divider-background-color:var(
258
+ --spectrum-tabs-xl-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)
259
+ );--spectrum-tabs-quiet-textonly-tabitem-icon-gap:var(
260
+ --spectrum-tabs-xl-quiet-textonly-tabitem-icon-gap,var(--spectrum-global-dimension-size-125)
261
+ );--spectrum-tabs-quiet-textonly-tabitem-focus-ring-padding-x:var(
262
+ --spectrum-tabs-xl-quiet-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-125)
263
+ );--spectrum-tabs-quiet-textonly-tabitem-height:var(
264
+ --spectrum-tabs-xl-quiet-textonly-tabitem-height,var(--spectrum-global-dimension-size-800)
265
+ );--spectrum-tabs-quiet-textonly-divider-size:var(
266
+ --spectrum-tabs-xl-quiet-textonly-divider-size,var(--spectrum-alias-border-size-thick)
267
+ );--spectrum-tabs-emphasized-texticon-tabitem-icon-color-selected:var(
268
+ --spectrum-tabs-xl-emphasized-texticon-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)
269
+ );--spectrum-tabs-emphasized-texticon-tabitem-text-color-selected:var(
270
+ --spectrum-tabs-xl-emphasized-texticon-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)
271
+ );--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected:var(
272
+ --spectrum-tabs-xl-emphasized-texticon-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-selection-indicator-color-emphasized)
273
+ );--spectrum-tabs-emphasized-textonly-divider-background-color:var(
274
+ --spectrum-tabs-xl-emphasized-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)
275
+ );--spectrum-tabs-texticon-tabitem-text-size:var(
276
+ --spectrum-tabs-xl-texticon-tabitem-text-size,var(--spectrum-global-dimension-font-size-300)
277
+ );--spectrum-tabs-texticon-tabitem-selection-indicator-animation-duration:var(
278
+ --spectrum-tabs-xl-texticon-tabitem-selection-indicator-animation-duration,var(--spectrum-global-animation-duration-100)
279
+ );--spectrum-tabs-texticon-tabitem-selection-indicator-animation-ease:var(
280
+ --spectrum-tabs-xl-texticon-tabitem-selection-indicator-animation-ease,var(--spectrum-global-animation-ease-in-out)
281
+ );--spectrum-tabs-textonly-tabitem-icon-color-selected:var(
282
+ --spectrum-tabs-xl-textonly-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-icon-color-selected)
283
+ );--spectrum-tabs-textonly-tabitem-text-color-selected:var(
284
+ --spectrum-tabs-xl-textonly-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)
285
+ );--spectrum-tabs-textonly-tabitem-selection-indicator-background-color-selected:var(
286
+ --spectrum-tabs-xl-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)
287
+ );--spectrum-tabs-textonly-tabitem-icon-color-selected-key-focus:var(
288
+ --spectrum-tabs-xl-textonly-tabitem-icon-color-selected-key-focus,var(--spectrum-alias-tabitem-icon-color-selected)
289
+ );--spectrum-tabs-textonly-tabitem-text-color-selected-key-focus:var(
290
+ --spectrum-tabs-xl-textonly-tabitem-text-color-selected-key-focus,var(--spectrum-alias-tabitem-text-color-selected-key-focus)
291
+ );--spectrum-tabs-textonly-tabitem-icon-color-disabled:var(
292
+ --spectrum-tabs-xl-textonly-tabitem-icon-color-disabled,var(--spectrum-alias-tabitem-icon-color-disabled)
293
+ );--spectrum-tabs-textonly-tabitem-text-color-disabled:var(
294
+ --spectrum-tabs-xl-textonly-tabitem-text-color-disabled,var(--spectrum-alias-text-color-disabled)
295
+ );--spectrum-tabs-textonly-tabitem-icon-color:var(
296
+ --spectrum-tabs-xl-textonly-tabitem-icon-color,var(--spectrum-alias-tabitem-icon-color-default)
297
+ );--spectrum-tabs-textonly-tabitem-text-color:var(
298
+ --spectrum-tabs-xl-textonly-tabitem-text-color,var(--spectrum-alias-tabitem-text-color-default)
299
+ );--spectrum-tabs-textonly-tabitem-icon-color-hover:var(
300
+ --spectrum-tabs-xl-textonly-tabitem-icon-color-hover,var(--spectrum-alias-tabitem-icon-color-hover)
301
+ );--spectrum-tabs-textonly-tabitem-text-color-hover:var(
302
+ --spectrum-tabs-xl-textonly-tabitem-text-color-hover,var(--spectrum-alias-tabitem-text-color-hover)
303
+ );--spectrum-tabs-textonly-tabitem-focus-ring-border-color-key-focus:var(
304
+ --spectrum-tabs-xl-textonly-tabitem-focus-ring-border-color-key-focus,var(--spectrum-alias-focus-ring-color)
305
+ );--spectrum-tabs-textonly-divider-background-color:var(
306
+ --spectrum-tabs-xl-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)
307
+ );--spectrum-tabs-textonly-tabitem-text-font-weight:var(
308
+ --spectrum-tabs-xl-textonly-tabitem-text-font-weight,var(--spectrum-alias-body-text-font-weight)
309
+ );--spectrum-tabs-textonly-tabitem-focus-ring-size:var(
310
+ --spectrum-tabs-xl-textonly-tabitem-focus-ring-size,var(--spectrum-alias-focus-ring-size)
311
+ );--spectrum-tabs-textonly-tabitem-focus-ring-height:var(
312
+ --spectrum-tabs-xl-textonly-tabitem-focus-ring-height,var(--spectrum-global-dimension-size-600)
313
+ );--spectrum-tabs-textonly-tabitem-focus-ring-padding-x:var(
314
+ --spectrum-tabs-xl-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-125)
315
+ );--spectrum-tabs-textonly-tabitem-focus-ring-border-radius:var(
316
+ --spectrum-tabs-xl-textonly-tabitem-focus-ring-border-radius,var(--spectrum-alias-border-radius-regular)
317
+ );--spectrum-tabs-textonly-tabitem-margin-right:var(
318
+ --spectrum-tabs-xl-textonly-tabitem-margin-right,var(--spectrum-global-dimension-size-300)
319
+ );--spectrum-tabs-textonly-divider-border-radius:var(
320
+ --spectrum-tabs-xl-textonly-divider-border-radius,var(--spectrum-global-dimension-static-size-10)
321
+ );--spectrum-tabs-vertical-quiet-textonly-divider-background-color:var(
322
+ --spectrum-tabs-xl-vertical-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)
323
+ );--spectrum-tabs-vertical-textonly-tabitem-selection-indicator-background-color-selected:var(
324
+ --spectrum-tabs-xl-vertical-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)
325
+ );--spectrum-tabs-vertical-textonly-divider-background-color:var(
326
+ --spectrum-tabs-xl-vertical-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)
327
+ );--spectrum-tabs-vertical-textonly-tabitem-height:var(
328
+ --spectrum-tabs-xl-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-750)
329
+ );--spectrum-tabs-vertical-textonly-tabitem-gap:var(
330
+ --spectrum-tabs-xl-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-125)
331
+ );--spectrum-tabs-compact-textonly-divider-size:var(
332
+ --spectrum-tabs-xl-compact-textonly-divider-size,var(--spectrum-alias-border-size-thick)
333
+ );--spectrum-tabs-compact-textonly-height:var(
334
+ --spectrum-tabs-xl-compact-textonly-height,var(--spectrum-global-dimension-size-600)
335
+ );--spectrum-tabs-compact-vertical-textonly-tabitem-height:var(
336
+ --spectrum-tabs-xl-compact-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-600)
337
+ );--spectrum-tabs-compact-vertical-textonly-tabitem-gap:var(
338
+ --spectrum-tabs-xl-compact-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-125)
339
+ )}:host{--spectrum-tabs-compact-item-height:calc(var(--spectrum-tabs-compact-textonly-height) - var(--spectrum-tabs-compact-textonly-divider-size))}#list{display:flex;margin:0;padding-bottom:0;padding-top:0;position:relative;vertical-align:top;z-index:0}:host([dir=ltr]) ::slotted(:not([slot])):before{left:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-padding-x)*-1)}:host([dir=rtl]) ::slotted(:not([slot])):before{right:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-padding-x)*-1)}:host([dir=ltr]) ::slotted(:not([slot])):before{right:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-padding-x)*-1)}:host([dir=rtl]) ::slotted(:not([slot])):before{left:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-padding-x)*-1)}:host([dir=ltr]) #selection-indicator{left:0}:host([dir=rtl]) #selection-indicator{right:0}#selection-indicator{border-radius:var(--spectrum-tabs-textonly-divider-border-radius);position:absolute;transform-origin:top left;transition:transform var(
340
+ --spectrum-tabs-texticon-tabitem-selection-indicator-animation-duration
341
+ ) var(--spectrum-tabs-texticon-tabitem-selection-indicator-animation-ease);z-index:0}:host([compact]) ::slotted(:not([slot])){height:var(
342
+ --spectrum-tabs-compact-item-height
343
+ );line-height:var(--spectrum-tabs-compact-item-height)}:host([direction^=horizontal]) #list{align-items:center;border-bottom:var(--spectrum-tabs-quiet-textonly-divider-size) solid}:host([direction^=horizontal]) ::slotted(:not([slot])){vertical-align:top}:host([dir=ltr][direction^=horizontal]) ::slotted(:not([slot]):not(:first-child)){margin-left:var(
344
+ --spectrum-tabs-textonly-tabitem-margin-right
345
+ )}:host([dir=rtl][direction^=horizontal]) ::slotted(:not([slot]):not(:first-child)){margin-right:var(
346
+ --spectrum-tabs-textonly-tabitem-margin-right
347
+ )}:host([direction^=horizontal]) #selection-indicator{bottom:0;bottom:calc(var(--spectrum-tabs-quiet-textonly-divider-size)*-1);height:var(--spectrum-tabs-quiet-textonly-divider-size);position:absolute}:host([direction^=horizontal][compact]) #list{align-items:end;box-sizing:content-box;height:var(--spectrum-tabs-compact-item-height)}:host([quiet]) #list{display:inline-flex}:host([dir=ltr][direction^=vertical]) #list{border-left:var(--spectrum-tabs-quiet-textonly-divider-size) solid}:host([dir=rtl][direction^=vertical]) #list{border-right:var(--spectrum-tabs-quiet-textonly-divider-size) solid}:host([direction^=vertical]) #list{display:inline-flex;flex-direction:column;padding:0}:host([dir=ltr][direction^=vertical]) ::slotted(:not([slot])){margin-left:calc(var(--spectrum-tabs-vertical-textonly-tabitem-gap)/2)}:host([dir=rtl][direction^=vertical]) ::slotted(:not([slot])){margin-right:calc(var(--spectrum-tabs-vertical-textonly-tabitem-gap)/2)}:host([direction^=vertical]) ::slotted(:not([slot])){height:var(
348
+ --spectrum-tabs-vertical-textonly-tabitem-height
349
+ );line-height:var(--spectrum-tabs-vertical-textonly-tabitem-height);margin-bottom:var(--spectrum-tabs-vertical-textonly-tabitem-gap);padding-bottom:0;padding-left:var(
350
+ --spectrum-tabs-quiet-textonly-tabitem-focus-ring-padding-x
351
+ );padding-right:var(
352
+ --spectrum-tabs-quiet-textonly-tabitem-focus-ring-padding-x
353
+ );padding-top:0}:host([dir=ltr][direction^=vertical]) ::slotted(:not([slot])):before{left:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-size)*-1)}:host([dir=rtl][direction^=vertical]) ::slotted(:not([slot])):before{right:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-size)*-1)}:host([dir=ltr][direction^=vertical]) ::slotted(:not([slot])):before{right:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-size)*-1)}:host([dir=rtl][direction^=vertical]) ::slotted(:not([slot])):before{left:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-size)*-1)}:host([direction^=vertical]) .spectrum-Icon{height:var(
354
+ --spectrum-tabs-vertical-textonly-tabitem-height
355
+ );line-height:var(--spectrum-tabs-vertical-textonly-tabitem-height)}:host([direction^=vertical][compact]) #list ::slotted(:not([slot])){height:var(
356
+ --spectrum-tabs-compact-vertical-textonly-tabitem-height
357
+ );line-height:var(--spectrum-tabs-compact-vertical-textonly-tabitem-height);margin-bottom:var(--spectrum-tabs-compact-vertical-textonly-tabitem-gap)}:host([dir=ltr][direction^=vertical]) #selection-indicator{left:0}:host([dir=rtl][direction^=vertical]) #selection-indicator{right:0}:host([dir=ltr][direction^=vertical]) #selection-indicator{left:calc(var(--spectrum-tabs-quiet-textonly-divider-size)*-1)}:host([dir=rtl][direction^=vertical]) #selection-indicator{right:calc(var(--spectrum-tabs-quiet-textonly-divider-size)*-1)}:host([direction^=vertical]) #selection-indicator{position:absolute;width:var(--spectrum-tabs-quiet-textonly-divider-size)}#list{border-bottom-color:var(
358
+ --spectrum-tabs-textonly-divider-background-color
359
+ )}:host([dir=ltr][direction^=vertical]) #list{border-left-color:var(
360
+ --spectrum-tabs-vertical-textonly-divider-background-color
361
+ )}:host([dir=rtl][direction^=vertical]) #list{border-right-color:var(
362
+ --spectrum-tabs-vertical-textonly-divider-background-color
363
+ )}#selection-indicator{background-color:var(
364
+ --spectrum-tabs-textonly-tabitem-selection-indicator-background-color-selected
365
+ )}:host([emphasized]) #selection-indicator{background-color:var(
366
+ --spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected
367
+ )}:host([emphasized]) ::slotted([selected]:not([slot])){color:var(
368
+ --spectrum-tabs-emphasized-texticon-tabitem-text-color-selected
369
+ )}:host([emphasized]) ::slotted([selected]:not([slot])) .spectrum-Icon{color:var(
370
+ --spectrum-tabs-emphasized-texticon-tabitem-icon-color-selected
371
+ )}:host([quiet]) #list{border-bottom-color:var(
372
+ --spectrum-tabs-quiet-textonly-divider-background-color
373
+ )}:host([quiet]) #selection-indicator{background-color:var(
374
+ --spectrum-tabs-quiet-textonly-tabitem-selection-indicator-background-color-selected
375
+ )}:host([quiet][emphasized]) #list #selection-indicator{background-color:var(
376
+ --spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected
377
+ )}:host([dir=ltr][direction^=vertical][compact]) #list,:host([dir=ltr][direction^=vertical][quiet]) #list{border-left-color:var(
378
+ --spectrum-tabs-vertical-quiet-textonly-divider-background-color
379
+ )}:host([dir=rtl][direction^=vertical][compact]) #list,:host([dir=rtl][direction^=vertical][quiet]) #list{border-right-color:var(
380
+ --spectrum-tabs-vertical-quiet-textonly-divider-background-color
381
+ )}:host([direction^=vertical][compact]) #list #selection-indicator,:host([direction^=vertical][quiet]) #list #selection-indicator{background-color:var(
382
+ --spectrum-tabs-vertical-textonly-tabitem-selection-indicator-background-color-selected
383
+ )}:host([dir=ltr][direction^=vertical][emphasized]) #list{border-left-color:var(
384
+ --spectrum-tabs-emphasized-textonly-divider-background-color
385
+ )}:host([dir=rtl][direction^=vertical][emphasized]) #list{border-right-color:var(
386
+ --spectrum-tabs-emphasized-textonly-divider-background-color
387
+ )}:host([direction^=vertical][emphasized]) #list #selection-indicator{background-color:var(
388
+ --spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected
389
+ )}@media (forced-colors:active){#list{--spectrum-tabs-emphasized-texticon-tabitem-icon-color-selected:HighlightText;--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected:Highlight;--spectrum-tabs-emphasized-texticon-tabitem-text-color-selected:HighlightText;--spectrum-tabs-emphasized-textonly-divider-background-color:transparent;--spectrum-tabs-quiet-textonly-divider-background-color:transparent;--spectrum-tabs-quiet-textonly-tabitem-selection-indicator-background-color-selected:Highlight;--spectrum-tabs-textonly-divider-background-color:transparent;--spectrum-tabs-textonly-tabitem-focus-ring-border-color-key-focus:ButtonText;--spectrum-tabs-textonly-tabitem-icon-color-disabled:GrayText;--spectrum-tabs-textonly-tabitem-icon-color-hover:ButtonText;--spectrum-tabs-textonly-tabitem-icon-color-selected-key-focus:ButtonText;--spectrum-tabs-textonly-tabitem-icon-color-selected:HighlightText;--spectrum-tabs-textonly-tabitem-selection-indicator-background-color-selected:Highlight;--spectrum-tabs-textonly-tabitem-text-color-disabled:GrayText;--spectrum-tabs-textonly-tabitem-text-color-hover:ButtonText;--spectrum-tabs-textonly-tabitem-text-color-selected-key-focus:ButtonText;--spectrum-tabs-textonly-tabitem-text-color-selected:HighlightText;--spectrum-tabs-textonly-tabitem-text-color:ButtonText;--spectrum-tabs-vertical-quiet-textonly-divider-background-color:transparent;--spectrum-tabs-vertical-textonly-divider-background-color:transparent;--spectrum-tabs-vertical-textonly-tabitem-selection-indicator-background-color-selected:Highlight;forced-color-adjust:none}::slotted(:not([slot])):before{background-color:ButtonFace}::slotted([selected]:not([slot])){color:HighlightText}::slotted([selected]:not([slot])):before{background-color:Highlight;color:HighlightText}:host([emphasized]) #list ::slotted(:not([slot])):before{background-color:ButtonFace}:host([emphasized]) #list ::slotted([selected]:not([slot])){color:HighlightText}:host([emphasized]) #list ::slotted([selected]:not([slot])):before{background-color:Highlight;color:HighlightText}}:host{--spectrum-tabs-emphasized-textonly-divider-background-color:transparent;--spectrum-tabs-quiet-textonly-divider-background-color:transparent;--spectrum-tabs-textonly-divider-background-color:transparent;--spectrum-tabs-vertical-quiet-textonly-divider-background-color:transparent;--spectrum-tabs-vertical-textonly-divider-background-color:transparent;display:grid}:host([direction^=vertical]){grid-template-columns:auto 1fr}:host([direction=vertical]){gap:var(--spectrum-tabs-textonly-tabitem-focus-ring-size)}#selection-indicator{border-radius:0}:host([disabled]) #selection-indicator{background-color:var(
390
+ --spectrum-tabs-m-text-color-disabled,var(--spectrum-alias-text-color-disabled)
391
+ )}:host([disabled]) ::slotted(sp-tab){color:var(
392
+ --spectrum-tabs-m-text-color-disabled,var(--spectrum-alias-text-color-disabled)
393
+ )}#list{justify-content:var(--swc-tabs-list-justify-content)}:host([disabled]) #list{pointer-events:none}:host([direction=vertical-right]) #selection-indicator,:host([direction=vertical]) #selection-indicator{height:1px;top:0}:host([compact]){--spectrum-tabs-height:var(--spectrum-tabs-quiet-compact-height)}:host([direction=horizontal]:not([quiet])) #list{border-bottom-color:var(
394
+ --spectrum-tabs-rule-color,var(--spectrum-global-color-gray-200)
395
+ )}:host([dir][direction=horizontal]) #selection-indicator{width:1px}:host([dir=ltr][direction=vertical-right]) #list{border-left:0;border-right:var(
396
+ --spectrum-tabs-vertical-rule-width,var(--spectrum-alias-border-size-thick)
397
+ ) solid;border-right-color:var(
398
+ --spectrum-tabs-vertical-rule-color,var(--spectrum-global-color-gray-200)
399
+ )}:host([dir=rtl][direction=vertical-right]) #list{border-left:var(
400
+ --spectrum-tabs-vertical-rule-width,var(--spectrum-alias-border-size-thick)
401
+ ) solid;border-left-color:var(
402
+ --spectrum-tabs-vertical-rule-color,var(--spectrum-global-color-gray-200)
403
+ );border-right:0}:host([dir=ltr][direction=vertical-right]) #selection-indicator{left:auto;right:calc(var(--spectrum-tabs-vertical-rule-width, var(--spectrum-alias-border-size-thick))*-1)}:host([dir=rtl][direction=vertical-right]) #selection-indicator{left:calc(var(--spectrum-tabs-vertical-rule-width, var(--spectrum-alias-border-size-thick))*-1);right:auto}#selection-indicator.first-position{transition:none}
404
+ `;
405
+ export default styles;
406
+ //# sourceMappingURL=tabs.css.dev.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["tabs.css.ts"],
4
+ "sourcesContent": ["/*\nCopyright 2022 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host([size=s]){--spectrum-tabs-quiet-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-s-quiet-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-quiet-textonly-divider-background-color:var(\n--spectrum-tabs-s-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)\n);--spectrum-tabs-quiet-textonly-tabitem-icon-gap:var(\n--spectrum-tabs-s-quiet-textonly-tabitem-icon-gap,var(--spectrum-global-dimension-size-85)\n);--spectrum-tabs-quiet-textonly-tabitem-focus-ring-padding-x:var(\n--spectrum-tabs-s-quiet-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-85)\n);--spectrum-tabs-quiet-textonly-tabitem-height:var(\n--spectrum-tabs-s-quiet-textonly-tabitem-height,var(--spectrum-global-dimension-size-500)\n);--spectrum-tabs-quiet-textonly-divider-size:var(\n--spectrum-tabs-s-quiet-textonly-divider-size,var(--spectrum-alias-border-size-thick)\n);--spectrum-tabs-emphasized-texticon-tabitem-icon-color-selected:var(\n--spectrum-tabs-s-emphasized-texticon-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)\n);--spectrum-tabs-emphasized-texticon-tabitem-text-color-selected:var(\n--spectrum-tabs-s-emphasized-texticon-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)\n);--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-s-emphasized-texticon-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-selection-indicator-color-emphasized)\n);--spectrum-tabs-emphasized-textonly-divider-background-color:var(\n--spectrum-tabs-s-emphasized-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-texticon-tabitem-text-size:var(\n--spectrum-tabs-s-texticon-tabitem-text-size,var(--spectrum-global-dimension-font-size-75)\n);--spectrum-tabs-texticon-tabitem-selection-indicator-animation-duration:var(\n--spectrum-tabs-s-texticon-tabitem-selection-indicator-animation-duration,var(--spectrum-global-animation-duration-100)\n);--spectrum-tabs-texticon-tabitem-selection-indicator-animation-ease:var(\n--spectrum-tabs-s-texticon-tabitem-selection-indicator-animation-ease,var(--spectrum-global-animation-ease-in-out)\n);--spectrum-tabs-textonly-tabitem-icon-color-selected:var(\n--spectrum-tabs-s-textonly-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-icon-color-selected)\n);--spectrum-tabs-textonly-tabitem-text-color-selected:var(\n--spectrum-tabs-s-textonly-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-s-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-textonly-tabitem-icon-color-selected-key-focus:var(\n--spectrum-tabs-s-textonly-tabitem-icon-color-selected-key-focus,var(--spectrum-alias-tabitem-icon-color-selected)\n);--spectrum-tabs-textonly-tabitem-text-color-selected-key-focus:var(\n--spectrum-tabs-s-textonly-tabitem-text-color-selected-key-focus,var(--spectrum-alias-tabitem-text-color-selected-key-focus)\n);--spectrum-tabs-textonly-tabitem-icon-color-disabled:var(\n--spectrum-tabs-s-textonly-tabitem-icon-color-disabled,var(--spectrum-alias-tabitem-icon-color-disabled)\n);--spectrum-tabs-textonly-tabitem-text-color-disabled:var(\n--spectrum-tabs-s-textonly-tabitem-text-color-disabled,var(--spectrum-alias-text-color-disabled)\n);--spectrum-tabs-textonly-tabitem-icon-color:var(\n--spectrum-tabs-s-textonly-tabitem-icon-color,var(--spectrum-alias-tabitem-icon-color-default)\n);--spectrum-tabs-textonly-tabitem-text-color:var(\n--spectrum-tabs-s-textonly-tabitem-text-color,var(--spectrum-alias-tabitem-text-color-default)\n);--spectrum-tabs-textonly-tabitem-icon-color-hover:var(\n--spectrum-tabs-s-textonly-tabitem-icon-color-hover,var(--spectrum-alias-tabitem-icon-color-hover)\n);--spectrum-tabs-textonly-tabitem-text-color-hover:var(\n--spectrum-tabs-s-textonly-tabitem-text-color-hover,var(--spectrum-alias-tabitem-text-color-hover)\n);--spectrum-tabs-textonly-tabitem-focus-ring-border-color-key-focus:var(\n--spectrum-tabs-s-textonly-tabitem-focus-ring-border-color-key-focus,var(--spectrum-alias-focus-ring-color)\n);--spectrum-tabs-textonly-divider-background-color:var(\n--spectrum-tabs-s-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-textonly-tabitem-text-font-weight:var(\n--spectrum-tabs-s-textonly-tabitem-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);--spectrum-tabs-textonly-tabitem-focus-ring-size:var(\n--spectrum-tabs-s-textonly-tabitem-focus-ring-size,var(--spectrum-alias-focus-ring-size)\n);--spectrum-tabs-textonly-tabitem-focus-ring-height:var(\n--spectrum-tabs-s-textonly-tabitem-focus-ring-height,var(--spectrum-global-dimension-size-300)\n);--spectrum-tabs-textonly-tabitem-focus-ring-padding-x:var(\n--spectrum-tabs-s-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-85)\n);--spectrum-tabs-textonly-tabitem-focus-ring-border-radius:var(\n--spectrum-tabs-s-textonly-tabitem-focus-ring-border-radius,var(--spectrum-alias-border-radius-regular)\n);--spectrum-tabs-textonly-tabitem-margin-right:var(\n--spectrum-tabs-s-textonly-tabitem-margin-right,var(--spectrum-global-dimension-size-300)\n);--spectrum-tabs-textonly-divider-border-radius:var(\n--spectrum-tabs-s-textonly-divider-border-radius,var(--spectrum-global-dimension-static-size-10)\n);--spectrum-tabs-vertical-quiet-textonly-divider-background-color:var(\n--spectrum-tabs-s-vertical-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)\n);--spectrum-tabs-vertical-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-s-vertical-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-vertical-textonly-divider-background-color:var(\n--spectrum-tabs-s-vertical-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-vertical-textonly-tabitem-height:var(\n--spectrum-tabs-s-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-450)\n);--spectrum-tabs-vertical-textonly-tabitem-gap:var(\n--spectrum-tabs-s-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-85)\n);--spectrum-tabs-compact-textonly-divider-size:var(\n--spectrum-tabs-s-compact-textonly-divider-size,var(--spectrum-alias-border-size-thick)\n);--spectrum-tabs-compact-textonly-height:var(\n--spectrum-tabs-s-compact-textonly-height,var(--spectrum-global-dimension-size-300)\n);--spectrum-tabs-compact-vertical-textonly-tabitem-height:var(\n--spectrum-tabs-s-compact-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-300)\n);--spectrum-tabs-compact-vertical-textonly-tabitem-gap:var(\n--spectrum-tabs-s-compact-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-85)\n)}:host([size=m]){--spectrum-tabs-quiet-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-m-quiet-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-quiet-textonly-divider-background-color:var(\n--spectrum-tabs-m-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)\n);--spectrum-tabs-quiet-textonly-tabitem-icon-gap:var(\n--spectrum-tabs-m-quiet-textonly-tabitem-icon-gap,var(--spectrum-global-dimension-size-100)\n);--spectrum-tabs-quiet-textonly-tabitem-focus-ring-padding-x:var(\n--spectrum-tabs-m-quiet-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-100)\n);--spectrum-tabs-quiet-textonly-tabitem-height:var(\n--spectrum-tabs-m-quiet-textonly-tabitem-height,var(--spectrum-global-dimension-size-600)\n);--spectrum-tabs-quiet-textonly-divider-size:var(\n--spectrum-tabs-m-quiet-textonly-divider-size,var(--spectrum-alias-border-size-thick)\n);--spectrum-tabs-emphasized-texticon-tabitem-icon-color-selected:var(\n--spectrum-tabs-m-emphasized-texticon-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)\n);--spectrum-tabs-emphasized-texticon-tabitem-text-color-selected:var(\n--spectrum-tabs-m-emphasized-texticon-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)\n);--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-m-emphasized-texticon-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-selection-indicator-color-emphasized)\n);--spectrum-tabs-emphasized-textonly-divider-background-color:var(\n--spectrum-tabs-m-emphasized-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-texticon-tabitem-text-size:var(\n--spectrum-tabs-m-texticon-tabitem-text-size,var(--spectrum-global-dimension-font-size-100)\n);--spectrum-tabs-texticon-tabitem-selection-indicator-animation-duration:var(\n--spectrum-tabs-m-texticon-tabitem-selection-indicator-animation-duration,var(--spectrum-global-animation-duration-100)\n);--spectrum-tabs-texticon-tabitem-selection-indicator-animation-ease:var(\n--spectrum-tabs-m-texticon-tabitem-selection-indicator-animation-ease,var(--spectrum-global-animation-ease-in-out)\n);--spectrum-tabs-textonly-tabitem-icon-color-selected:var(\n--spectrum-tabs-m-textonly-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-icon-color-selected)\n);--spectrum-tabs-textonly-tabitem-text-color-selected:var(\n--spectrum-tabs-m-textonly-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-m-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-textonly-tabitem-icon-color-selected-key-focus:var(\n--spectrum-tabs-m-textonly-tabitem-icon-color-selected-key-focus,var(--spectrum-alias-tabitem-icon-color-selected)\n);--spectrum-tabs-textonly-tabitem-text-color-selected-key-focus:var(\n--spectrum-tabs-m-textonly-tabitem-text-color-selected-key-focus,var(--spectrum-alias-tabitem-text-color-selected-key-focus)\n);--spectrum-tabs-textonly-tabitem-icon-color-disabled:var(\n--spectrum-tabs-m-textonly-tabitem-icon-color-disabled,var(--spectrum-alias-tabitem-icon-color-disabled)\n);--spectrum-tabs-textonly-tabitem-text-color-disabled:var(\n--spectrum-tabs-m-textonly-tabitem-text-color-disabled,var(--spectrum-alias-text-color-disabled)\n);--spectrum-tabs-textonly-tabitem-icon-color:var(\n--spectrum-tabs-m-textonly-tabitem-icon-color,var(--spectrum-alias-tabitem-icon-color-default)\n);--spectrum-tabs-textonly-tabitem-text-color:var(\n--spectrum-tabs-m-textonly-tabitem-text-color,var(--spectrum-alias-tabitem-text-color-default)\n);--spectrum-tabs-textonly-tabitem-icon-color-hover:var(\n--spectrum-tabs-m-textonly-tabitem-icon-color-hover,var(--spectrum-alias-tabitem-icon-color-hover)\n);--spectrum-tabs-textonly-tabitem-text-color-hover:var(\n--spectrum-tabs-m-textonly-tabitem-text-color-hover,var(--spectrum-alias-tabitem-text-color-hover)\n);--spectrum-tabs-textonly-tabitem-focus-ring-border-color-key-focus:var(\n--spectrum-tabs-m-textonly-tabitem-focus-ring-border-color-key-focus,var(--spectrum-alias-focus-ring-color)\n);--spectrum-tabs-textonly-divider-background-color:var(\n--spectrum-tabs-m-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-textonly-tabitem-text-font-weight:var(\n--spectrum-tabs-m-textonly-tabitem-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);--spectrum-tabs-textonly-tabitem-focus-ring-size:var(\n--spectrum-tabs-m-textonly-tabitem-focus-ring-size,var(--spectrum-alias-focus-ring-size)\n);--spectrum-tabs-textonly-tabitem-focus-ring-height:var(\n--spectrum-tabs-m-textonly-tabitem-focus-ring-height,var(--spectrum-global-dimension-size-400)\n);--spectrum-tabs-textonly-tabitem-focus-ring-padding-x:var(\n--spectrum-tabs-m-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-100)\n);--spectrum-tabs-textonly-tabitem-focus-ring-border-radius:var(\n--spectrum-tabs-m-textonly-tabitem-focus-ring-border-radius,var(--spectrum-alias-border-radius-regular)\n);--spectrum-tabs-textonly-tabitem-margin-right:var(\n--spectrum-tabs-m-textonly-tabitem-margin-right,var(--spectrum-global-dimension-size-300)\n);--spectrum-tabs-textonly-divider-border-radius:var(\n--spectrum-tabs-m-textonly-divider-border-radius,var(--spectrum-global-dimension-static-size-10)\n);--spectrum-tabs-vertical-quiet-textonly-divider-background-color:var(\n--spectrum-tabs-m-vertical-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)\n);--spectrum-tabs-vertical-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-m-vertical-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-vertical-textonly-divider-background-color:var(\n--spectrum-tabs-m-vertical-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-vertical-textonly-tabitem-height:var(\n--spectrum-tabs-m-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-550)\n);--spectrum-tabs-vertical-textonly-tabitem-gap:var(\n--spectrum-tabs-m-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-100)\n);--spectrum-tabs-compact-textonly-divider-size:var(\n--spectrum-tabs-m-compact-textonly-divider-size,var(--spectrum-alias-border-size-thick)\n);--spectrum-tabs-compact-textonly-height:var(\n--spectrum-tabs-m-compact-textonly-height,var(--spectrum-global-dimension-size-400)\n);--spectrum-tabs-compact-vertical-textonly-tabitem-height:var(\n--spectrum-tabs-m-compact-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-400)\n);--spectrum-tabs-compact-vertical-textonly-tabitem-gap:var(\n--spectrum-tabs-m-compact-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-100)\n)}:host([size=l]){--spectrum-tabs-quiet-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-l-quiet-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-quiet-textonly-divider-background-color:var(\n--spectrum-tabs-l-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)\n);--spectrum-tabs-quiet-textonly-tabitem-icon-gap:var(\n--spectrum-tabs-l-quiet-textonly-tabitem-icon-gap,var(--spectrum-global-dimension-size-115)\n);--spectrum-tabs-quiet-textonly-tabitem-focus-ring-padding-x:var(\n--spectrum-tabs-l-quiet-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-115)\n);--spectrum-tabs-quiet-textonly-tabitem-height:var(\n--spectrum-tabs-l-quiet-textonly-tabitem-height,var(--spectrum-global-dimension-size-700)\n);--spectrum-tabs-quiet-textonly-divider-size:var(\n--spectrum-tabs-l-quiet-textonly-divider-size,var(--spectrum-alias-border-size-thick)\n);--spectrum-tabs-emphasized-texticon-tabitem-icon-color-selected:var(\n--spectrum-tabs-l-emphasized-texticon-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)\n);--spectrum-tabs-emphasized-texticon-tabitem-text-color-selected:var(\n--spectrum-tabs-l-emphasized-texticon-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)\n);--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-l-emphasized-texticon-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-selection-indicator-color-emphasized)\n);--spectrum-tabs-emphasized-textonly-divider-background-color:var(\n--spectrum-tabs-l-emphasized-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-texticon-tabitem-text-size:var(\n--spectrum-tabs-l-texticon-tabitem-text-size,var(--spectrum-global-dimension-font-size-200)\n);--spectrum-tabs-texticon-tabitem-selection-indicator-animation-duration:var(\n--spectrum-tabs-l-texticon-tabitem-selection-indicator-animation-duration,var(--spectrum-global-animation-duration-100)\n);--spectrum-tabs-texticon-tabitem-selection-indicator-animation-ease:var(\n--spectrum-tabs-l-texticon-tabitem-selection-indicator-animation-ease,var(--spectrum-global-animation-ease-in-out)\n);--spectrum-tabs-textonly-tabitem-icon-color-selected:var(\n--spectrum-tabs-l-textonly-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-icon-color-selected)\n);--spectrum-tabs-textonly-tabitem-text-color-selected:var(\n--spectrum-tabs-l-textonly-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-l-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-textonly-tabitem-icon-color-selected-key-focus:var(\n--spectrum-tabs-l-textonly-tabitem-icon-color-selected-key-focus,var(--spectrum-alias-tabitem-icon-color-selected)\n);--spectrum-tabs-textonly-tabitem-text-color-selected-key-focus:var(\n--spectrum-tabs-l-textonly-tabitem-text-color-selected-key-focus,var(--spectrum-alias-tabitem-text-color-selected-key-focus)\n);--spectrum-tabs-textonly-tabitem-icon-color-disabled:var(\n--spectrum-tabs-l-textonly-tabitem-icon-color-disabled,var(--spectrum-alias-tabitem-icon-color-disabled)\n);--spectrum-tabs-textonly-tabitem-text-color-disabled:var(\n--spectrum-tabs-l-textonly-tabitem-text-color-disabled,var(--spectrum-alias-text-color-disabled)\n);--spectrum-tabs-textonly-tabitem-icon-color:var(\n--spectrum-tabs-l-textonly-tabitem-icon-color,var(--spectrum-alias-tabitem-icon-color-default)\n);--spectrum-tabs-textonly-tabitem-text-color:var(\n--spectrum-tabs-l-textonly-tabitem-text-color,var(--spectrum-alias-tabitem-text-color-default)\n);--spectrum-tabs-textonly-tabitem-icon-color-hover:var(\n--spectrum-tabs-l-textonly-tabitem-icon-color-hover,var(--spectrum-alias-tabitem-icon-color-hover)\n);--spectrum-tabs-textonly-tabitem-text-color-hover:var(\n--spectrum-tabs-l-textonly-tabitem-text-color-hover,var(--spectrum-alias-tabitem-text-color-hover)\n);--spectrum-tabs-textonly-tabitem-focus-ring-border-color-key-focus:var(\n--spectrum-tabs-l-textonly-tabitem-focus-ring-border-color-key-focus,var(--spectrum-alias-focus-ring-color)\n);--spectrum-tabs-textonly-divider-background-color:var(\n--spectrum-tabs-l-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-textonly-tabitem-text-font-weight:var(\n--spectrum-tabs-l-textonly-tabitem-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);--spectrum-tabs-textonly-tabitem-focus-ring-size:var(\n--spectrum-tabs-l-textonly-tabitem-focus-ring-size,var(--spectrum-alias-focus-ring-size)\n);--spectrum-tabs-textonly-tabitem-focus-ring-height:var(\n--spectrum-tabs-l-textonly-tabitem-focus-ring-height,var(--spectrum-global-dimension-size-500)\n);--spectrum-tabs-textonly-tabitem-focus-ring-padding-x:var(\n--spectrum-tabs-l-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-115)\n);--spectrum-tabs-textonly-tabitem-focus-ring-border-radius:var(\n--spectrum-tabs-l-textonly-tabitem-focus-ring-border-radius,var(--spectrum-alias-border-radius-regular)\n);--spectrum-tabs-textonly-tabitem-margin-right:var(\n--spectrum-tabs-l-textonly-tabitem-margin-right,var(--spectrum-global-dimension-size-300)\n);--spectrum-tabs-textonly-divider-border-radius:var(\n--spectrum-tabs-l-textonly-divider-border-radius,var(--spectrum-global-dimension-static-size-10)\n);--spectrum-tabs-vertical-quiet-textonly-divider-background-color:var(\n--spectrum-tabs-l-vertical-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)\n);--spectrum-tabs-vertical-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-l-vertical-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-vertical-textonly-divider-background-color:var(\n--spectrum-tabs-l-vertical-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-vertical-textonly-tabitem-height:var(\n--spectrum-tabs-l-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-650)\n);--spectrum-tabs-vertical-textonly-tabitem-gap:var(\n--spectrum-tabs-l-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-115)\n);--spectrum-tabs-compact-textonly-divider-size:var(\n--spectrum-tabs-l-compact-textonly-divider-size,var(--spectrum-alias-border-size-thick)\n);--spectrum-tabs-compact-textonly-height:var(\n--spectrum-tabs-l-compact-textonly-height,var(--spectrum-global-dimension-size-500)\n);--spectrum-tabs-compact-vertical-textonly-tabitem-height:var(\n--spectrum-tabs-l-compact-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-500)\n);--spectrum-tabs-compact-vertical-textonly-tabitem-gap:var(\n--spectrum-tabs-l-compact-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-115)\n)}:host([size=xl]){--spectrum-tabs-quiet-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-xl-quiet-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-quiet-textonly-divider-background-color:var(\n--spectrum-tabs-xl-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)\n);--spectrum-tabs-quiet-textonly-tabitem-icon-gap:var(\n--spectrum-tabs-xl-quiet-textonly-tabitem-icon-gap,var(--spectrum-global-dimension-size-125)\n);--spectrum-tabs-quiet-textonly-tabitem-focus-ring-padding-x:var(\n--spectrum-tabs-xl-quiet-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-125)\n);--spectrum-tabs-quiet-textonly-tabitem-height:var(\n--spectrum-tabs-xl-quiet-textonly-tabitem-height,var(--spectrum-global-dimension-size-800)\n);--spectrum-tabs-quiet-textonly-divider-size:var(\n--spectrum-tabs-xl-quiet-textonly-divider-size,var(--spectrum-alias-border-size-thick)\n);--spectrum-tabs-emphasized-texticon-tabitem-icon-color-selected:var(\n--spectrum-tabs-xl-emphasized-texticon-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)\n);--spectrum-tabs-emphasized-texticon-tabitem-text-color-selected:var(\n--spectrum-tabs-xl-emphasized-texticon-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)\n);--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-xl-emphasized-texticon-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-selection-indicator-color-emphasized)\n);--spectrum-tabs-emphasized-textonly-divider-background-color:var(\n--spectrum-tabs-xl-emphasized-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-texticon-tabitem-text-size:var(\n--spectrum-tabs-xl-texticon-tabitem-text-size,var(--spectrum-global-dimension-font-size-300)\n);--spectrum-tabs-texticon-tabitem-selection-indicator-animation-duration:var(\n--spectrum-tabs-xl-texticon-tabitem-selection-indicator-animation-duration,var(--spectrum-global-animation-duration-100)\n);--spectrum-tabs-texticon-tabitem-selection-indicator-animation-ease:var(\n--spectrum-tabs-xl-texticon-tabitem-selection-indicator-animation-ease,var(--spectrum-global-animation-ease-in-out)\n);--spectrum-tabs-textonly-tabitem-icon-color-selected:var(\n--spectrum-tabs-xl-textonly-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-icon-color-selected)\n);--spectrum-tabs-textonly-tabitem-text-color-selected:var(\n--spectrum-tabs-xl-textonly-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-xl-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-textonly-tabitem-icon-color-selected-key-focus:var(\n--spectrum-tabs-xl-textonly-tabitem-icon-color-selected-key-focus,var(--spectrum-alias-tabitem-icon-color-selected)\n);--spectrum-tabs-textonly-tabitem-text-color-selected-key-focus:var(\n--spectrum-tabs-xl-textonly-tabitem-text-color-selected-key-focus,var(--spectrum-alias-tabitem-text-color-selected-key-focus)\n);--spectrum-tabs-textonly-tabitem-icon-color-disabled:var(\n--spectrum-tabs-xl-textonly-tabitem-icon-color-disabled,var(--spectrum-alias-tabitem-icon-color-disabled)\n);--spectrum-tabs-textonly-tabitem-text-color-disabled:var(\n--spectrum-tabs-xl-textonly-tabitem-text-color-disabled,var(--spectrum-alias-text-color-disabled)\n);--spectrum-tabs-textonly-tabitem-icon-color:var(\n--spectrum-tabs-xl-textonly-tabitem-icon-color,var(--spectrum-alias-tabitem-icon-color-default)\n);--spectrum-tabs-textonly-tabitem-text-color:var(\n--spectrum-tabs-xl-textonly-tabitem-text-color,var(--spectrum-alias-tabitem-text-color-default)\n);--spectrum-tabs-textonly-tabitem-icon-color-hover:var(\n--spectrum-tabs-xl-textonly-tabitem-icon-color-hover,var(--spectrum-alias-tabitem-icon-color-hover)\n);--spectrum-tabs-textonly-tabitem-text-color-hover:var(\n--spectrum-tabs-xl-textonly-tabitem-text-color-hover,var(--spectrum-alias-tabitem-text-color-hover)\n);--spectrum-tabs-textonly-tabitem-focus-ring-border-color-key-focus:var(\n--spectrum-tabs-xl-textonly-tabitem-focus-ring-border-color-key-focus,var(--spectrum-alias-focus-ring-color)\n);--spectrum-tabs-textonly-divider-background-color:var(\n--spectrum-tabs-xl-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-textonly-tabitem-text-font-weight:var(\n--spectrum-tabs-xl-textonly-tabitem-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);--spectrum-tabs-textonly-tabitem-focus-ring-size:var(\n--spectrum-tabs-xl-textonly-tabitem-focus-ring-size,var(--spectrum-alias-focus-ring-size)\n);--spectrum-tabs-textonly-tabitem-focus-ring-height:var(\n--spectrum-tabs-xl-textonly-tabitem-focus-ring-height,var(--spectrum-global-dimension-size-600)\n);--spectrum-tabs-textonly-tabitem-focus-ring-padding-x:var(\n--spectrum-tabs-xl-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-125)\n);--spectrum-tabs-textonly-tabitem-focus-ring-border-radius:var(\n--spectrum-tabs-xl-textonly-tabitem-focus-ring-border-radius,var(--spectrum-alias-border-radius-regular)\n);--spectrum-tabs-textonly-tabitem-margin-right:var(\n--spectrum-tabs-xl-textonly-tabitem-margin-right,var(--spectrum-global-dimension-size-300)\n);--spectrum-tabs-textonly-divider-border-radius:var(\n--spectrum-tabs-xl-textonly-divider-border-radius,var(--spectrum-global-dimension-static-size-10)\n);--spectrum-tabs-vertical-quiet-textonly-divider-background-color:var(\n--spectrum-tabs-xl-vertical-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)\n);--spectrum-tabs-vertical-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-xl-vertical-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-vertical-textonly-divider-background-color:var(\n--spectrum-tabs-xl-vertical-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-vertical-textonly-tabitem-height:var(\n--spectrum-tabs-xl-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-750)\n);--spectrum-tabs-vertical-textonly-tabitem-gap:var(\n--spectrum-tabs-xl-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-125)\n);--spectrum-tabs-compact-textonly-divider-size:var(\n--spectrum-tabs-xl-compact-textonly-divider-size,var(--spectrum-alias-border-size-thick)\n);--spectrum-tabs-compact-textonly-height:var(\n--spectrum-tabs-xl-compact-textonly-height,var(--spectrum-global-dimension-size-600)\n);--spectrum-tabs-compact-vertical-textonly-tabitem-height:var(\n--spectrum-tabs-xl-compact-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-600)\n);--spectrum-tabs-compact-vertical-textonly-tabitem-gap:var(\n--spectrum-tabs-xl-compact-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-125)\n)}:host{--spectrum-tabs-compact-item-height:calc(var(--spectrum-tabs-compact-textonly-height) - var(--spectrum-tabs-compact-textonly-divider-size))}#list{display:flex;margin:0;padding-bottom:0;padding-top:0;position:relative;vertical-align:top;z-index:0}:host([dir=ltr]) ::slotted(:not([slot])):before{left:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-padding-x)*-1)}:host([dir=rtl]) ::slotted(:not([slot])):before{right:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-padding-x)*-1)}:host([dir=ltr]) ::slotted(:not([slot])):before{right:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-padding-x)*-1)}:host([dir=rtl]) ::slotted(:not([slot])):before{left:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-padding-x)*-1)}:host([dir=ltr]) #selection-indicator{left:0}:host([dir=rtl]) #selection-indicator{right:0}#selection-indicator{border-radius:var(--spectrum-tabs-textonly-divider-border-radius);position:absolute;transform-origin:top left;transition:transform var(\n--spectrum-tabs-texticon-tabitem-selection-indicator-animation-duration\n) var(--spectrum-tabs-texticon-tabitem-selection-indicator-animation-ease);z-index:0}:host([compact]) ::slotted(:not([slot])){height:var(\n--spectrum-tabs-compact-item-height\n);line-height:var(--spectrum-tabs-compact-item-height)}:host([direction^=horizontal]) #list{align-items:center;border-bottom:var(--spectrum-tabs-quiet-textonly-divider-size) solid}:host([direction^=horizontal]) ::slotted(:not([slot])){vertical-align:top}:host([dir=ltr][direction^=horizontal]) ::slotted(:not([slot]):not(:first-child)){margin-left:var(\n--spectrum-tabs-textonly-tabitem-margin-right\n)}:host([dir=rtl][direction^=horizontal]) ::slotted(:not([slot]):not(:first-child)){margin-right:var(\n--spectrum-tabs-textonly-tabitem-margin-right\n)}:host([direction^=horizontal]) #selection-indicator{bottom:0;bottom:calc(var(--spectrum-tabs-quiet-textonly-divider-size)*-1);height:var(--spectrum-tabs-quiet-textonly-divider-size);position:absolute}:host([direction^=horizontal][compact]) #list{align-items:end;box-sizing:content-box;height:var(--spectrum-tabs-compact-item-height)}:host([quiet]) #list{display:inline-flex}:host([dir=ltr][direction^=vertical]) #list{border-left:var(--spectrum-tabs-quiet-textonly-divider-size) solid}:host([dir=rtl][direction^=vertical]) #list{border-right:var(--spectrum-tabs-quiet-textonly-divider-size) solid}:host([direction^=vertical]) #list{display:inline-flex;flex-direction:column;padding:0}:host([dir=ltr][direction^=vertical]) ::slotted(:not([slot])){margin-left:calc(var(--spectrum-tabs-vertical-textonly-tabitem-gap)/2)}:host([dir=rtl][direction^=vertical]) ::slotted(:not([slot])){margin-right:calc(var(--spectrum-tabs-vertical-textonly-tabitem-gap)/2)}:host([direction^=vertical]) ::slotted(:not([slot])){height:var(\n--spectrum-tabs-vertical-textonly-tabitem-height\n);line-height:var(--spectrum-tabs-vertical-textonly-tabitem-height);margin-bottom:var(--spectrum-tabs-vertical-textonly-tabitem-gap);padding-bottom:0;padding-left:var(\n--spectrum-tabs-quiet-textonly-tabitem-focus-ring-padding-x\n);padding-right:var(\n--spectrum-tabs-quiet-textonly-tabitem-focus-ring-padding-x\n);padding-top:0}:host([dir=ltr][direction^=vertical]) ::slotted(:not([slot])):before{left:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-size)*-1)}:host([dir=rtl][direction^=vertical]) ::slotted(:not([slot])):before{right:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-size)*-1)}:host([dir=ltr][direction^=vertical]) ::slotted(:not([slot])):before{right:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-size)*-1)}:host([dir=rtl][direction^=vertical]) ::slotted(:not([slot])):before{left:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-size)*-1)}:host([direction^=vertical]) .spectrum-Icon{height:var(\n--spectrum-tabs-vertical-textonly-tabitem-height\n);line-height:var(--spectrum-tabs-vertical-textonly-tabitem-height)}:host([direction^=vertical][compact]) #list ::slotted(:not([slot])){height:var(\n--spectrum-tabs-compact-vertical-textonly-tabitem-height\n);line-height:var(--spectrum-tabs-compact-vertical-textonly-tabitem-height);margin-bottom:var(--spectrum-tabs-compact-vertical-textonly-tabitem-gap)}:host([dir=ltr][direction^=vertical]) #selection-indicator{left:0}:host([dir=rtl][direction^=vertical]) #selection-indicator{right:0}:host([dir=ltr][direction^=vertical]) #selection-indicator{left:calc(var(--spectrum-tabs-quiet-textonly-divider-size)*-1)}:host([dir=rtl][direction^=vertical]) #selection-indicator{right:calc(var(--spectrum-tabs-quiet-textonly-divider-size)*-1)}:host([direction^=vertical]) #selection-indicator{position:absolute;width:var(--spectrum-tabs-quiet-textonly-divider-size)}#list{border-bottom-color:var(\n--spectrum-tabs-textonly-divider-background-color\n)}:host([dir=ltr][direction^=vertical]) #list{border-left-color:var(\n--spectrum-tabs-vertical-textonly-divider-background-color\n)}:host([dir=rtl][direction^=vertical]) #list{border-right-color:var(\n--spectrum-tabs-vertical-textonly-divider-background-color\n)}#selection-indicator{background-color:var(\n--spectrum-tabs-textonly-tabitem-selection-indicator-background-color-selected\n)}:host([emphasized]) #selection-indicator{background-color:var(\n--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected\n)}:host([emphasized]) ::slotted([selected]:not([slot])){color:var(\n--spectrum-tabs-emphasized-texticon-tabitem-text-color-selected\n)}:host([emphasized]) ::slotted([selected]:not([slot])) .spectrum-Icon{color:var(\n--spectrum-tabs-emphasized-texticon-tabitem-icon-color-selected\n)}:host([quiet]) #list{border-bottom-color:var(\n--spectrum-tabs-quiet-textonly-divider-background-color\n)}:host([quiet]) #selection-indicator{background-color:var(\n--spectrum-tabs-quiet-textonly-tabitem-selection-indicator-background-color-selected\n)}:host([quiet][emphasized]) #list #selection-indicator{background-color:var(\n--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected\n)}:host([dir=ltr][direction^=vertical][compact]) #list,:host([dir=ltr][direction^=vertical][quiet]) #list{border-left-color:var(\n--spectrum-tabs-vertical-quiet-textonly-divider-background-color\n)}:host([dir=rtl][direction^=vertical][compact]) #list,:host([dir=rtl][direction^=vertical][quiet]) #list{border-right-color:var(\n--spectrum-tabs-vertical-quiet-textonly-divider-background-color\n)}:host([direction^=vertical][compact]) #list #selection-indicator,:host([direction^=vertical][quiet]) #list #selection-indicator{background-color:var(\n--spectrum-tabs-vertical-textonly-tabitem-selection-indicator-background-color-selected\n)}:host([dir=ltr][direction^=vertical][emphasized]) #list{border-left-color:var(\n--spectrum-tabs-emphasized-textonly-divider-background-color\n)}:host([dir=rtl][direction^=vertical][emphasized]) #list{border-right-color:var(\n--spectrum-tabs-emphasized-textonly-divider-background-color\n)}:host([direction^=vertical][emphasized]) #list #selection-indicator{background-color:var(\n--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected\n)}@media (forced-colors:active){#list{--spectrum-tabs-emphasized-texticon-tabitem-icon-color-selected:HighlightText;--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected:Highlight;--spectrum-tabs-emphasized-texticon-tabitem-text-color-selected:HighlightText;--spectrum-tabs-emphasized-textonly-divider-background-color:transparent;--spectrum-tabs-quiet-textonly-divider-background-color:transparent;--spectrum-tabs-quiet-textonly-tabitem-selection-indicator-background-color-selected:Highlight;--spectrum-tabs-textonly-divider-background-color:transparent;--spectrum-tabs-textonly-tabitem-focus-ring-border-color-key-focus:ButtonText;--spectrum-tabs-textonly-tabitem-icon-color-disabled:GrayText;--spectrum-tabs-textonly-tabitem-icon-color-hover:ButtonText;--spectrum-tabs-textonly-tabitem-icon-color-selected-key-focus:ButtonText;--spectrum-tabs-textonly-tabitem-icon-color-selected:HighlightText;--spectrum-tabs-textonly-tabitem-selection-indicator-background-color-selected:Highlight;--spectrum-tabs-textonly-tabitem-text-color-disabled:GrayText;--spectrum-tabs-textonly-tabitem-text-color-hover:ButtonText;--spectrum-tabs-textonly-tabitem-text-color-selected-key-focus:ButtonText;--spectrum-tabs-textonly-tabitem-text-color-selected:HighlightText;--spectrum-tabs-textonly-tabitem-text-color:ButtonText;--spectrum-tabs-vertical-quiet-textonly-divider-background-color:transparent;--spectrum-tabs-vertical-textonly-divider-background-color:transparent;--spectrum-tabs-vertical-textonly-tabitem-selection-indicator-background-color-selected:Highlight;forced-color-adjust:none}::slotted(:not([slot])):before{background-color:ButtonFace}::slotted([selected]:not([slot])){color:HighlightText}::slotted([selected]:not([slot])):before{background-color:Highlight;color:HighlightText}:host([emphasized]) #list ::slotted(:not([slot])):before{background-color:ButtonFace}:host([emphasized]) #list ::slotted([selected]:not([slot])){color:HighlightText}:host([emphasized]) #list ::slotted([selected]:not([slot])):before{background-color:Highlight;color:HighlightText}}:host{--spectrum-tabs-emphasized-textonly-divider-background-color:transparent;--spectrum-tabs-quiet-textonly-divider-background-color:transparent;--spectrum-tabs-textonly-divider-background-color:transparent;--spectrum-tabs-vertical-quiet-textonly-divider-background-color:transparent;--spectrum-tabs-vertical-textonly-divider-background-color:transparent;display:grid}:host([direction^=vertical]){grid-template-columns:auto 1fr}:host([direction=vertical]){gap:var(--spectrum-tabs-textonly-tabitem-focus-ring-size)}#selection-indicator{border-radius:0}:host([disabled]) #selection-indicator{background-color:var(\n--spectrum-tabs-m-text-color-disabled,var(--spectrum-alias-text-color-disabled)\n)}:host([disabled]) ::slotted(sp-tab){color:var(\n--spectrum-tabs-m-text-color-disabled,var(--spectrum-alias-text-color-disabled)\n)}#list{justify-content:var(--swc-tabs-list-justify-content)}:host([disabled]) #list{pointer-events:none}:host([direction=vertical-right]) #selection-indicator,:host([direction=vertical]) #selection-indicator{height:1px;top:0}:host([compact]){--spectrum-tabs-height:var(--spectrum-tabs-quiet-compact-height)}:host([direction=horizontal]:not([quiet])) #list{border-bottom-color:var(\n--spectrum-tabs-rule-color,var(--spectrum-global-color-gray-200)\n)}:host([dir][direction=horizontal]) #selection-indicator{width:1px}:host([dir=ltr][direction=vertical-right]) #list{border-left:0;border-right:var(\n--spectrum-tabs-vertical-rule-width,var(--spectrum-alias-border-size-thick)\n) solid;border-right-color:var(\n--spectrum-tabs-vertical-rule-color,var(--spectrum-global-color-gray-200)\n)}:host([dir=rtl][direction=vertical-right]) #list{border-left:var(\n--spectrum-tabs-vertical-rule-width,var(--spectrum-alias-border-size-thick)\n) solid;border-left-color:var(\n--spectrum-tabs-vertical-rule-color,var(--spectrum-global-color-gray-200)\n);border-right:0}:host([dir=ltr][direction=vertical-right]) #selection-indicator{left:auto;right:calc(var(--spectrum-tabs-vertical-rule-width, var(--spectrum-alias-border-size-thick))*-1)}:host([dir=rtl][direction=vertical-right]) #selection-indicator{left:calc(var(--spectrum-tabs-vertical-rule-width, var(--spectrum-alias-border-size-thick))*-1);right:auto}#selection-indicator.first-position{transition:none}\n`;\nexport default styles;"],
5
+ "mappings": "AAWA;AACA,MAAM,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAmZf,eAAe;",
6
+ "names": []
7
+ }
package/src/tabs.css.js CHANGED
@@ -1,16 +1,5 @@
1
- /*
2
- Copyright 2022 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 { css } from '@spectrum-web-components/base';
13
- const styles = css `
1
+ import { css } from "@spectrum-web-components/base";
2
+ const styles = css`
14
3
  :host([size=s]){--spectrum-tabs-quiet-textonly-tabitem-selection-indicator-background-color-selected:var(
15
4
  --spectrum-tabs-s-quiet-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)
16
5
  );--spectrum-tabs-quiet-textonly-divider-background-color:var(
@@ -414,4 +403,4 @@ const styles = css `
414
403
  );border-right:0}:host([dir=ltr][direction=vertical-right]) #selection-indicator{left:auto;right:calc(var(--spectrum-tabs-vertical-rule-width, var(--spectrum-alias-border-size-thick))*-1)}:host([dir=rtl][direction=vertical-right]) #selection-indicator{left:calc(var(--spectrum-tabs-vertical-rule-width, var(--spectrum-alias-border-size-thick))*-1);right:auto}#selection-indicator.first-position{transition:none}
415
404
  `;
416
405
  export default styles;
417
- //# sourceMappingURL=tabs.css.js.map
406
+ //# sourceMappingURL=tabs.css.js.map