@carbon/themes 10.30.0 → 10.32.0

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 (15) hide show
  1. package/README.md +3 -18
  2. package/es/index.js +1343 -584
  3. package/lib/index.js +1495 -656
  4. package/package.json +6 -6
  5. package/scss/generated/_mixins.scss +1421 -146
  6. package/scss/generated/_themes.scss +718 -1
  7. package/scss/generated/_tokens.scss +750 -0
  8. package/scss/modules/generated/_themes.scss +201 -1
  9. package/src/g10.js +97 -2
  10. package/src/g100.js +95 -0
  11. package/src/g90.js +95 -0
  12. package/src/tokens.js +186 -0
  13. package/src/v9.js +95 -0
  14. package/src/white.js +95 -0
  15. package/umd/index.js +1495 -656
package/es/index.js CHANGED
@@ -1,9 +1,9 @@
1
1
  import Color from 'color';
2
- import { blue60, gray80, white as white$1, gray10, gray20, gray50, gray100, gray70, gray40, gray60, red60, blue70, blue40, green50, yellow, red50, green40, blue50, rgba, blue80, gray30, red80, purple60, blue20, blue10, gray90, red40, blue30, purple40, red30 } from '@carbon/colors';
2
+ import { blue60, gray80, white as white$1, gray10, gray20, gray50, gray100, gray70, gray40, gray60, red60, blue70, blue40, green50, yellow, red50, green40, blue50, rgba, blue80, gray30, red80, purple60, blue20, gray90, red40, blue30, purple40, red30 } from '@carbon/colors';
3
3
  import { caption01, label01, helperText01, bodyShort01, bodyLong01, bodyShort02, bodyLong02, code01, code02, heading01, productiveHeading01, heading02, productiveHeading02, productiveHeading03, productiveHeading04, productiveHeading05, productiveHeading06, productiveHeading07, expressiveHeading01, expressiveHeading02, expressiveHeading03, expressiveHeading04, expressiveHeading05, expressiveHeading06, expressiveParagraph01, quotation01, quotation02, display01, display02, display03, display04, unstable_tokens } from '@carbon/type';
4
4
  export { bodyLong01, bodyLong02, bodyShort01, bodyShort02, caption01, code01, code02, display01, display02, display03, display04, expressiveHeading01, expressiveHeading02, expressiveHeading03, expressiveHeading04, expressiveHeading05, expressiveHeading06, expressiveParagraph01, heading01, heading02, helperText01, label01, productiveHeading01, productiveHeading02, productiveHeading03, productiveHeading04, productiveHeading05, productiveHeading06, productiveHeading07, quotation01, quotation02 } from '@carbon/type';
5
- import { spacing01, spacing02, spacing03, spacing04, spacing05, spacing06, spacing07, spacing08, spacing09, spacing10, spacing11, spacing12, fluidSpacing01, fluidSpacing02, fluidSpacing03, fluidSpacing04, layout01, layout02, layout03, layout04, layout05, layout06, layout07, container01, container02, container03, container04, container05, iconSize01, iconSize02, unstable_tokens as unstable_tokens$1 } from '@carbon/layout';
6
- export { container01, container02, container03, container04, container05, fluidSpacing01, fluidSpacing02, fluidSpacing03, fluidSpacing04, iconSize01, iconSize02, layout01, layout02, layout03, layout04, layout05, layout06, layout07, spacing01, spacing02, spacing03, spacing04, spacing05, spacing06, spacing07, spacing08, spacing09, spacing10, spacing11, spacing12 } from '@carbon/layout';
5
+ import { spacing01, spacing02, spacing03, spacing04, spacing05, spacing06, spacing07, spacing08, spacing09, spacing10, spacing11, spacing12, spacing13, fluidSpacing01, fluidSpacing02, fluidSpacing03, fluidSpacing04, layout01, layout02, layout03, layout04, layout05, layout06, layout07, container01, container02, container03, container04, container05, iconSize01, iconSize02, unstable_tokens as unstable_tokens$1 } from '@carbon/layout';
6
+ export { container01, container02, container03, container04, container05, fluidSpacing01, fluidSpacing02, fluidSpacing03, fluidSpacing04, iconSize01, iconSize02, layout01, layout02, layout03, layout04, layout05, layout06, layout07, spacing01, spacing02, spacing03, spacing04, spacing05, spacing06, spacing07, spacing08, spacing09, spacing10, spacing11, spacing12, spacing13 } from '@carbon/layout';
7
7
 
8
8
  function _defineProperty(obj, key, value) {
9
9
  if (key in obj) {
@@ -77,155 +77,305 @@ function adjustLightness(token, shift) {
77
77
  * This source code is licensed under the Apache-2.0 license found in the
78
78
  * LICENSE file in the root directory of this source tree.
79
79
  */
80
- var interactive01 = blue60;
81
- var interactive02 = gray80;
82
- var interactive03 = blue60;
83
- var interactive04 = blue60;
84
- var uiBackground = white$1;
85
- var ui01 = gray10;
86
- var ui02 = white$1;
87
- var ui03 = gray20;
88
- var ui04 = gray50;
89
- var ui05 = gray100;
90
- var text01 = gray100;
91
- var text02 = gray70;
92
- var text03 = gray40;
93
- var text04 = white$1;
94
- var text05 = gray60;
95
- var textError = red60;
96
- var icon01 = gray100;
97
- var icon02 = gray70;
98
- var icon03 = white$1;
99
- var link01 = blue60;
100
- var link02 = blue70;
101
- var inverseLink = blue40;
102
- var field01 = gray10;
103
- var field02 = white$1;
104
- var inverse01 = white$1;
105
- var inverse02 = gray80;
106
- var support01 = red60;
107
- var support02 = green50;
108
- var support03 = yellow;
109
- var support04 = blue70;
110
- var inverseSupport01 = red50;
111
- var inverseSupport02 = green40;
112
- var inverseSupport03 = yellow;
113
- var inverseSupport04 = blue50;
114
- var overlay01 = rgba(gray100, 0.5);
115
- var danger01 = red60;
116
- var danger02 = red60; // Interaction states
80
+ var interactive01$4 = blue60;
81
+ var interactive02$4 = gray80;
82
+ var interactive03$4 = blue60;
83
+ var interactive04$4 = blue60;
84
+ var uiBackground$4 = white$1;
85
+ var ui01$4 = gray10;
86
+ var ui02$4 = white$1;
87
+ var ui03$4 = gray20;
88
+ var ui04$4 = gray50;
89
+ var ui05$4 = gray100;
90
+ var text01$4 = gray100;
91
+ var text02$4 = gray70;
92
+ var text03$4 = gray40;
93
+ var text04$4 = white$1;
94
+ var text05$4 = gray60;
95
+ var textError$4 = red60;
96
+ var icon01$4 = gray100;
97
+ var icon02$4 = gray70;
98
+ var icon03$4 = white$1;
99
+ var link01$4 = blue60;
100
+ var link02$4 = blue70;
101
+ var inverseLink$4 = blue40;
102
+ var field01$4 = gray10;
103
+ var field02$4 = white$1;
104
+ var inverse01$4 = white$1;
105
+ var inverse02$4 = gray80;
106
+ var support01$4 = red60;
107
+ var support02$4 = green50;
108
+ var support03$4 = yellow;
109
+ var support04$4 = blue70;
110
+ var inverseSupport01$4 = red50;
111
+ var inverseSupport02$4 = green40;
112
+ var inverseSupport03$4 = yellow;
113
+ var inverseSupport04$4 = blue50;
114
+ var overlay01$4 = rgba(gray100, 0.5);
115
+ var danger01$4 = red60;
116
+ var danger02$4 = red60; // Interaction states
117
117
 
118
- var focus = blue60;
119
- var inverseFocusUi = white$1;
120
- var hoverPrimary = '#0353e9';
121
- var activePrimary = blue80;
122
- var hoverPrimaryText = blue70;
123
- var hoverSecondary = '#4c4c4c';
124
- var activeSecondary = gray60;
125
- var hoverTertiary = '#0353e9';
126
- var activeTertiary = blue80;
127
- var hoverUI = '#e5e5e5';
128
- var hoverLightUI = '#e5e5e5';
129
- var activeUI = gray30;
130
- var activeLightUI = gray30;
131
- var selectedUI = gray20;
132
- var selectedLightUI = gray20;
133
- var inverseHoverUI = '#4c4c4c';
134
- var hoverSelectedUI = '#cacaca';
135
- var hoverDanger = adjustLightness(danger01, -8);
136
- var activeDanger = red80;
137
- var hoverRow = '#e5e5e5';
138
- var visitedLink = purple60;
139
- var disabled01 = gray10;
140
- var disabled02 = gray30;
141
- var disabled03 = gray50;
142
- var highlight = blue20;
143
- var decorative01 = gray20;
144
- var buttonSeparator = '#e0e0e0';
145
- var skeleton01 = '#e5e5e5';
146
- var skeleton02 = gray30; // Type
118
+ var focus$4 = blue60;
119
+ var inverseFocusUi$4 = white$1;
120
+ var hoverPrimary$4 = '#0353e9';
121
+ var activePrimary$4 = blue80;
122
+ var hoverPrimaryText$4 = blue70;
123
+ var hoverSecondary$4 = '#4c4c4c';
124
+ var activeSecondary$4 = gray60;
125
+ var hoverTertiary$4 = '#0353e9';
126
+ var activeTertiary$4 = blue80;
127
+ var hoverUI$4 = '#e5e5e5';
128
+ var hoverLightUI$4 = '#e5e5e5';
129
+ var activeUI$4 = gray30;
130
+ var activeLightUI$4 = gray30;
131
+ var selectedUI$4 = gray20;
132
+ var selectedLightUI$4 = gray20;
133
+ var inverseHoverUI$4 = '#4c4c4c';
134
+ var hoverSelectedUI$4 = '#cacaca';
135
+ var hoverDanger$4 = adjustLightness(danger01$4, -8);
136
+ var activeDanger$4 = red80;
137
+ var hoverRow$4 = '#e5e5e5';
138
+ var visitedLink$4 = purple60;
139
+ var disabled01$4 = gray10;
140
+ var disabled02$4 = gray30;
141
+ var disabled03$4 = gray50;
142
+ var highlight$4 = blue20;
143
+ var decorative01$4 = gray20;
144
+ var buttonSeparator$4 = '#e0e0e0';
145
+ var skeleton01$4 = '#e5e5e5';
146
+ var skeleton02$4 = gray30; // New color tokens
147
+ // TO-DO: remove fallback color when v11 is released and assign carbon colors to new tokens
147
148
 
148
- var brand01 = interactive01;
149
- var brand02 = interactive02;
150
- var brand03 = interactive03;
151
- var active01 = activeUI;
152
- var hoverField = hoverUI;
153
- var danger = danger01;
149
+ var background$4 = uiBackground$4;
150
+ var layer$4 = ui01$4;
151
+ var layerAccent$4 = ui03$4;
152
+ var field$4 = field01$4;
153
+ var backgroundInverse$4 = inverse02$4;
154
+ var backgroundBrand$4 = interactive01$4;
155
+ var interactive$4 = interactive04$4;
156
+ var borderSubtle$4 = ui03$4;
157
+ var borderStrong$4 = ui04$4;
158
+ var borderInverse$4 = ui05$4;
159
+ var borderInteractive$4 = interactive04$4;
160
+ var textPrimary$4 = text01$4;
161
+ var textSecondary$4 = text02$4;
162
+ var textPlaceholder$4 = text03$4;
163
+ var textHelper$4 = text05$4;
164
+ var textOnColor$4 = text04$4;
165
+ var textInverse$4 = inverse01$4;
166
+ var linkPrimary$4 = link01$4;
167
+ var linkSecondary$4 = link02$4;
168
+ var linkVisited$4 = visitedLink$4;
169
+ var linkInverse$4 = inverseLink$4;
170
+ var iconPrimary$4 = icon01$4;
171
+ var iconSecondary$4 = icon02$4;
172
+ var iconOnColor$4 = icon03$4;
173
+ var iconInverse$4 = inverse01$4;
174
+ var supportError$4 = support01$4;
175
+ var supportSuccess$4 = support02$4;
176
+ var supportWarning$4 = support03$4;
177
+ var supportInfo$4 = support04$4;
178
+ var supportErrorInverse$4 = inverseSupport01$4;
179
+ var supportSuccessInverse$4 = inverseSupport02$4;
180
+ var supportWarningInverse$4 = inverseSupport03$4;
181
+ var supportInfoInverse$4 = inverseSupport04$4;
182
+ var overlay$4 = overlay01$4;
183
+ var toggleOff$4 = ui04$4;
184
+ var buttonPrimary$4 = interactive01$4;
185
+ var buttonSecondary$4 = interactive02$4;
186
+ var buttonTertiary$4 = interactive03$4;
187
+ var buttonDangerPrimary$4 = danger01$4;
188
+ var buttonDangerSecondary$4 = danger02$4;
189
+ var backgroundActive$4 = activeUI$4;
190
+ var layerActive$4 = activeUI$4;
191
+ var buttonDangerActive$4 = activeDanger$4;
192
+ var buttonPrimaryActive$4 = activePrimary$4;
193
+ var buttonSecondaryActive$4 = activeSecondary$4;
194
+ var buttonTertiaryActive$4 = activeTertiary$4;
195
+ var focusInset$4 = inverse01$4;
196
+ var focusInverse$4 = inverseFocusUi$4;
197
+ var backgroundHover$4 = hoverUI$4;
198
+ var layerHover$4 = hoverUI$4;
199
+ var fieldHover$4 = hoverUI$4;
200
+ var backgroundInverseHover$4 = inverseHoverUI$4;
201
+ var linkPrimaryHover$4 = hoverPrimaryText$4;
202
+ var buttonDangerHover$4 = hoverDanger$4;
203
+ var buttonPrimaryHover$4 = hoverPrimary$4;
204
+ var buttonSecondaryHover$4 = hoverSecondary$4;
205
+ var buttonTertiaryHover$4 = hoverTertiary$4;
206
+ var backgroundSelected$4 = selectedUI$4;
207
+ var backgroundSelectedHover$4 = hoverSelectedUI$4;
208
+ var layerSelected$4 = selectedUI$4;
209
+ var layerSelectedHover$4 = hoverSelectedUI$4;
210
+ var layerSelectedInverse$4 = ui05$4;
211
+ var borderSubtleSelected$4 = activeUI$4;
212
+ var layerDisabled$4 = disabled01$4;
213
+ var fieldDisabled$4 = disabled01$4;
214
+ var borderDisabled$4 = disabled01$4;
215
+ var textDisabled$4 = disabled02$4;
216
+ var buttonDisabled$4 = disabled02$4;
217
+ var iconDisabled$4 = disabled02$4;
218
+ var textOnColorDisabled$4 = disabled03$4;
219
+ var iconOnColorDisabled$4 = disabled03$4;
220
+ var layerSelectedDisabled$4 = disabled03$4;
221
+ var skeletonBackground$4 = skeleton01$4;
222
+ var skeletonElement$4 = skeleton02$4; // Type
223
+
224
+ var brand01$4 = interactive01$4;
225
+ var brand02$4 = interactive02$4;
226
+ var brand03$4 = interactive03$4;
227
+ var active01$4 = activeUI$4;
228
+ var hoverField$4 = hoverUI$4;
229
+ var danger$4 = danger01$4;
154
230
 
155
231
  var white = /*#__PURE__*/Object.freeze({
156
232
  __proto__: null,
157
- interactive01: interactive01,
158
- interactive02: interactive02,
159
- interactive03: interactive03,
160
- interactive04: interactive04,
161
- uiBackground: uiBackground,
162
- ui01: ui01,
163
- ui02: ui02,
164
- ui03: ui03,
165
- ui04: ui04,
166
- ui05: ui05,
167
- text01: text01,
168
- text02: text02,
169
- text03: text03,
170
- text04: text04,
171
- text05: text05,
172
- textError: textError,
173
- icon01: icon01,
174
- icon02: icon02,
175
- icon03: icon03,
176
- link01: link01,
177
- link02: link02,
178
- inverseLink: inverseLink,
179
- field01: field01,
180
- field02: field02,
181
- inverse01: inverse01,
182
- inverse02: inverse02,
183
- support01: support01,
184
- support02: support02,
185
- support03: support03,
186
- support04: support04,
187
- inverseSupport01: inverseSupport01,
188
- inverseSupport02: inverseSupport02,
189
- inverseSupport03: inverseSupport03,
190
- inverseSupport04: inverseSupport04,
191
- overlay01: overlay01,
192
- danger01: danger01,
193
- danger02: danger02,
194
- focus: focus,
195
- inverseFocusUi: inverseFocusUi,
196
- hoverPrimary: hoverPrimary,
197
- activePrimary: activePrimary,
198
- hoverPrimaryText: hoverPrimaryText,
199
- hoverSecondary: hoverSecondary,
200
- activeSecondary: activeSecondary,
201
- hoverTertiary: hoverTertiary,
202
- activeTertiary: activeTertiary,
203
- hoverUI: hoverUI,
204
- hoverLightUI: hoverLightUI,
205
- activeUI: activeUI,
206
- activeLightUI: activeLightUI,
207
- selectedUI: selectedUI,
208
- selectedLightUI: selectedLightUI,
209
- inverseHoverUI: inverseHoverUI,
210
- hoverSelectedUI: hoverSelectedUI,
211
- hoverDanger: hoverDanger,
212
- activeDanger: activeDanger,
213
- hoverRow: hoverRow,
214
- visitedLink: visitedLink,
215
- disabled01: disabled01,
216
- disabled02: disabled02,
217
- disabled03: disabled03,
218
- highlight: highlight,
219
- decorative01: decorative01,
220
- buttonSeparator: buttonSeparator,
221
- skeleton01: skeleton01,
222
- skeleton02: skeleton02,
223
- brand01: brand01,
224
- brand02: brand02,
225
- brand03: brand03,
226
- active01: active01,
227
- hoverField: hoverField,
228
- danger: danger,
233
+ interactive01: interactive01$4,
234
+ interactive02: interactive02$4,
235
+ interactive03: interactive03$4,
236
+ interactive04: interactive04$4,
237
+ uiBackground: uiBackground$4,
238
+ ui01: ui01$4,
239
+ ui02: ui02$4,
240
+ ui03: ui03$4,
241
+ ui04: ui04$4,
242
+ ui05: ui05$4,
243
+ text01: text01$4,
244
+ text02: text02$4,
245
+ text03: text03$4,
246
+ text04: text04$4,
247
+ text05: text05$4,
248
+ textError: textError$4,
249
+ icon01: icon01$4,
250
+ icon02: icon02$4,
251
+ icon03: icon03$4,
252
+ link01: link01$4,
253
+ link02: link02$4,
254
+ inverseLink: inverseLink$4,
255
+ field01: field01$4,
256
+ field02: field02$4,
257
+ inverse01: inverse01$4,
258
+ inverse02: inverse02$4,
259
+ support01: support01$4,
260
+ support02: support02$4,
261
+ support03: support03$4,
262
+ support04: support04$4,
263
+ inverseSupport01: inverseSupport01$4,
264
+ inverseSupport02: inverseSupport02$4,
265
+ inverseSupport03: inverseSupport03$4,
266
+ inverseSupport04: inverseSupport04$4,
267
+ overlay01: overlay01$4,
268
+ danger01: danger01$4,
269
+ danger02: danger02$4,
270
+ focus: focus$4,
271
+ inverseFocusUi: inverseFocusUi$4,
272
+ hoverPrimary: hoverPrimary$4,
273
+ activePrimary: activePrimary$4,
274
+ hoverPrimaryText: hoverPrimaryText$4,
275
+ hoverSecondary: hoverSecondary$4,
276
+ activeSecondary: activeSecondary$4,
277
+ hoverTertiary: hoverTertiary$4,
278
+ activeTertiary: activeTertiary$4,
279
+ hoverUI: hoverUI$4,
280
+ hoverLightUI: hoverLightUI$4,
281
+ activeUI: activeUI$4,
282
+ activeLightUI: activeLightUI$4,
283
+ selectedUI: selectedUI$4,
284
+ selectedLightUI: selectedLightUI$4,
285
+ inverseHoverUI: inverseHoverUI$4,
286
+ hoverSelectedUI: hoverSelectedUI$4,
287
+ hoverDanger: hoverDanger$4,
288
+ activeDanger: activeDanger$4,
289
+ hoverRow: hoverRow$4,
290
+ visitedLink: visitedLink$4,
291
+ disabled01: disabled01$4,
292
+ disabled02: disabled02$4,
293
+ disabled03: disabled03$4,
294
+ highlight: highlight$4,
295
+ decorative01: decorative01$4,
296
+ buttonSeparator: buttonSeparator$4,
297
+ skeleton01: skeleton01$4,
298
+ skeleton02: skeleton02$4,
299
+ background: background$4,
300
+ layer: layer$4,
301
+ layerAccent: layerAccent$4,
302
+ field: field$4,
303
+ backgroundInverse: backgroundInverse$4,
304
+ backgroundBrand: backgroundBrand$4,
305
+ interactive: interactive$4,
306
+ borderSubtle: borderSubtle$4,
307
+ borderStrong: borderStrong$4,
308
+ borderInverse: borderInverse$4,
309
+ borderInteractive: borderInteractive$4,
310
+ textPrimary: textPrimary$4,
311
+ textSecondary: textSecondary$4,
312
+ textPlaceholder: textPlaceholder$4,
313
+ textHelper: textHelper$4,
314
+ textOnColor: textOnColor$4,
315
+ textInverse: textInverse$4,
316
+ linkPrimary: linkPrimary$4,
317
+ linkSecondary: linkSecondary$4,
318
+ linkVisited: linkVisited$4,
319
+ linkInverse: linkInverse$4,
320
+ iconPrimary: iconPrimary$4,
321
+ iconSecondary: iconSecondary$4,
322
+ iconOnColor: iconOnColor$4,
323
+ iconInverse: iconInverse$4,
324
+ supportError: supportError$4,
325
+ supportSuccess: supportSuccess$4,
326
+ supportWarning: supportWarning$4,
327
+ supportInfo: supportInfo$4,
328
+ supportErrorInverse: supportErrorInverse$4,
329
+ supportSuccessInverse: supportSuccessInverse$4,
330
+ supportWarningInverse: supportWarningInverse$4,
331
+ supportInfoInverse: supportInfoInverse$4,
332
+ overlay: overlay$4,
333
+ toggleOff: toggleOff$4,
334
+ buttonPrimary: buttonPrimary$4,
335
+ buttonSecondary: buttonSecondary$4,
336
+ buttonTertiary: buttonTertiary$4,
337
+ buttonDangerPrimary: buttonDangerPrimary$4,
338
+ buttonDangerSecondary: buttonDangerSecondary$4,
339
+ backgroundActive: backgroundActive$4,
340
+ layerActive: layerActive$4,
341
+ buttonDangerActive: buttonDangerActive$4,
342
+ buttonPrimaryActive: buttonPrimaryActive$4,
343
+ buttonSecondaryActive: buttonSecondaryActive$4,
344
+ buttonTertiaryActive: buttonTertiaryActive$4,
345
+ focusInset: focusInset$4,
346
+ focusInverse: focusInverse$4,
347
+ backgroundHover: backgroundHover$4,
348
+ layerHover: layerHover$4,
349
+ fieldHover: fieldHover$4,
350
+ backgroundInverseHover: backgroundInverseHover$4,
351
+ linkPrimaryHover: linkPrimaryHover$4,
352
+ buttonDangerHover: buttonDangerHover$4,
353
+ buttonPrimaryHover: buttonPrimaryHover$4,
354
+ buttonSecondaryHover: buttonSecondaryHover$4,
355
+ buttonTertiaryHover: buttonTertiaryHover$4,
356
+ backgroundSelected: backgroundSelected$4,
357
+ backgroundSelectedHover: backgroundSelectedHover$4,
358
+ layerSelected: layerSelected$4,
359
+ layerSelectedHover: layerSelectedHover$4,
360
+ layerSelectedInverse: layerSelectedInverse$4,
361
+ borderSubtleSelected: borderSubtleSelected$4,
362
+ layerDisabled: layerDisabled$4,
363
+ fieldDisabled: fieldDisabled$4,
364
+ borderDisabled: borderDisabled$4,
365
+ textDisabled: textDisabled$4,
366
+ buttonDisabled: buttonDisabled$4,
367
+ iconDisabled: iconDisabled$4,
368
+ textOnColorDisabled: textOnColorDisabled$4,
369
+ iconOnColorDisabled: iconOnColorDisabled$4,
370
+ layerSelectedDisabled: layerSelectedDisabled$4,
371
+ skeletonBackground: skeletonBackground$4,
372
+ skeletonElement: skeletonElement$4,
373
+ brand01: brand01$4,
374
+ brand02: brand02$4,
375
+ brand03: brand03$4,
376
+ active01: active01$4,
377
+ hoverField: hoverField$4,
378
+ danger: danger$4,
229
379
  caption01: caption01,
230
380
  label01: label01,
231
381
  helperText01: helperText01,
@@ -269,6 +419,7 @@ var white = /*#__PURE__*/Object.freeze({
269
419
  spacing10: spacing10,
270
420
  spacing11: spacing11,
271
421
  spacing12: spacing12,
422
+ spacing13: spacing13,
272
423
  fluidSpacing01: fluidSpacing01,
273
424
  fluidSpacing02: fluidSpacing02,
274
425
  fluidSpacing03: fluidSpacing03,
@@ -295,155 +446,305 @@ var white = /*#__PURE__*/Object.freeze({
295
446
  * This source code is licensed under the Apache-2.0 license found in the
296
447
  * LICENSE file in the root directory of this source tree.
297
448
  */
298
- var interactive01$1 = blue60;
299
- var interactive02$1 = gray80;
300
- var interactive03$1 = blue60;
301
- var interactive04$1 = blue60;
302
- var uiBackground$1 = gray10;
303
- var ui01$1 = white$1;
304
- var ui02$1 = gray10;
305
- var ui03$1 = gray20;
306
- var ui04$1 = gray50;
307
- var ui05$1 = gray100;
308
- var text01$1 = gray100;
309
- var text02$1 = gray70;
310
- var text03$1 = gray40;
311
- var text04$1 = white$1;
312
- var text05$1 = gray60;
313
- var textError$1 = red60;
314
- var icon01$1 = gray100;
315
- var icon02$1 = gray70;
316
- var icon03$1 = white$1;
317
- var link01$1 = blue60;
318
- var link02$1 = blue70;
319
- var inverseLink$1 = blue40;
320
- var field01$1 = white$1;
321
- var field02$1 = gray10;
322
- var inverse01$1 = white$1;
323
- var inverse02$1 = gray80;
324
- var support01$1 = red60;
325
- var support02$1 = green50;
326
- var support03$1 = yellow;
327
- var support04$1 = blue70;
328
- var inverseSupport01$1 = red50;
329
- var inverseSupport02$1 = green40;
330
- var inverseSupport03$1 = yellow;
331
- var inverseSupport04$1 = blue50;
332
- var overlay01$1 = rgba(gray100, 0.5);
333
- var danger01$1 = red60;
334
- var danger02$1 = red60; // Interaction states
449
+ var interactive01$3 = blue60;
450
+ var interactive02$3 = gray80;
451
+ var interactive03$3 = blue60;
452
+ var interactive04$3 = blue60;
453
+ var uiBackground$3 = gray10;
454
+ var ui01$3 = white$1;
455
+ var ui02$3 = gray10;
456
+ var ui03$3 = gray20;
457
+ var ui04$3 = gray50;
458
+ var ui05$3 = gray100;
459
+ var text01$3 = gray100;
460
+ var text02$3 = gray70;
461
+ var text03$3 = gray40;
462
+ var text04$3 = white$1;
463
+ var text05$3 = gray60;
464
+ var textError$3 = red60;
465
+ var icon01$3 = gray100;
466
+ var icon02$3 = gray70;
467
+ var icon03$3 = white$1;
468
+ var link01$3 = blue60;
469
+ var link02$3 = blue70;
470
+ var inverseLink$3 = blue40;
471
+ var field01$3 = white$1;
472
+ var field02$3 = gray10;
473
+ var inverse01$3 = white$1;
474
+ var inverse02$3 = gray80;
475
+ var support01$3 = red60;
476
+ var support02$3 = green50;
477
+ var support03$3 = yellow;
478
+ var support04$3 = blue70;
479
+ var inverseSupport01$3 = red50;
480
+ var inverseSupport02$3 = green40;
481
+ var inverseSupport03$3 = yellow;
482
+ var inverseSupport04$3 = blue50;
483
+ var overlay01$3 = rgba(gray100, 0.5);
484
+ var danger01$3 = red60;
485
+ var danger02$3 = red60; // Interaction states
335
486
 
336
- var focus$1 = blue60;
337
- var inverseFocusUi$1 = white$1;
338
- var hoverPrimary$1 = '#0353e9';
339
- var activePrimary$1 = blue80;
340
- var hoverPrimaryText$1 = blue70;
341
- var hoverSecondary$1 = '#4c4c4c';
342
- var activeSecondary$1 = gray60;
343
- var hoverTertiary$1 = '#0353e9';
344
- var activeTertiary$1 = blue80;
345
- var hoverUI$1 = '#e5e5e5';
346
- var hoverLightUI$1 = '#e5e5e5';
347
- var activeUI$1 = gray30;
348
- var activeLightUI$1 = gray30;
349
- var selectedUI$1 = gray20;
350
- var selectedLightUI$1 = gray20;
351
- var inverseHoverUI$1 = '#4c4c4c';
352
- var hoverSelectedUI$1 = '#cacaca';
353
- var hoverDanger$1 = adjustLightness(danger01$1, -8);
354
- var activeDanger$1 = red80;
355
- var hoverRow$1 = '#e5e5e5';
356
- var visitedLink$1 = purple60;
357
- var disabled01$1 = white$1;
358
- var disabled02$1 = gray30;
359
- var disabled03$1 = gray50;
360
- var highlight$1 = blue10;
361
- var decorative01$1 = gray20;
362
- var buttonSeparator$1 = '#e0e0e0';
363
- var skeleton01$1 = '#e5e5e5';
364
- var skeleton02$1 = gray30;
487
+ var focus$3 = blue60;
488
+ var inverseFocusUi$3 = white$1;
489
+ var hoverPrimary$3 = '#0353e9';
490
+ var activePrimary$3 = blue80;
491
+ var hoverPrimaryText$3 = blue70;
492
+ var hoverSecondary$3 = '#4c4c4c';
493
+ var activeSecondary$3 = gray60;
494
+ var hoverTertiary$3 = '#0353e9';
495
+ var activeTertiary$3 = blue80;
496
+ var hoverUI$3 = '#e5e5e5';
497
+ var hoverLightUI$3 = '#e5e5e5';
498
+ var activeUI$3 = gray30;
499
+ var activeLightUI$3 = gray30;
500
+ var selectedUI$3 = gray20;
501
+ var selectedLightUI$3 = gray20;
502
+ var inverseHoverUI$3 = '#4c4c4c';
503
+ var hoverSelectedUI$3 = '#cacaca';
504
+ var hoverDanger$3 = adjustLightness(danger01$3, -8);
505
+ var activeDanger$3 = red80;
506
+ var hoverRow$3 = '#e5e5e5';
507
+ var visitedLink$3 = purple60;
508
+ var disabled01$3 = white$1;
509
+ var disabled02$3 = gray30;
510
+ var disabled03$3 = gray50;
511
+ var highlight$3 = blue20;
512
+ var decorative01$3 = gray20;
513
+ var buttonSeparator$3 = '#e0e0e0';
514
+ var skeleton01$3 = '#e5e5e5';
515
+ var skeleton02$3 = gray30; // New color tokens
516
+ // TO-DO: remove fallback color when v11 is released and assign carbon colors to new tokens
365
517
 
366
- var brand01$1 = interactive01$1;
367
- var brand02$1 = interactive02$1;
368
- var brand03$1 = interactive03$1;
369
- var active01$1 = activeUI$1;
370
- var hoverField$1 = hoverUI$1;
371
- var danger$1 = danger01$1;
518
+ var background$3 = uiBackground$3;
519
+ var layer$3 = ui01$3;
520
+ var layerAccent$3 = ui03$3;
521
+ var field$3 = field01$3;
522
+ var backgroundInverse$3 = inverse02$3;
523
+ var backgroundBrand$3 = interactive01$3;
524
+ var interactive$3 = interactive04$3;
525
+ var borderSubtle$3 = ui03$3;
526
+ var borderStrong$3 = ui04$3;
527
+ var borderInverse$3 = ui05$3;
528
+ var borderInteractive$3 = interactive04$3;
529
+ var textPrimary$3 = text01$3;
530
+ var textSecondary$3 = text02$3;
531
+ var textPlaceholder$3 = text03$3;
532
+ var textHelper$3 = text05$3;
533
+ var textOnColor$3 = text04$3;
534
+ var textInverse$3 = inverse01$3;
535
+ var linkPrimary$3 = link01$3;
536
+ var linkSecondary$3 = link02$3;
537
+ var linkVisited$3 = visitedLink$3;
538
+ var linkInverse$3 = inverseLink$3;
539
+ var iconPrimary$3 = icon01$3;
540
+ var iconSecondary$3 = icon02$3;
541
+ var iconOnColor$3 = icon03$3;
542
+ var iconInverse$3 = inverse01$3;
543
+ var supportError$3 = support01$3;
544
+ var supportSuccess$3 = support02$3;
545
+ var supportWarning$3 = support03$3;
546
+ var supportInfo$3 = support04$3;
547
+ var supportErrorInverse$3 = inverseSupport01$3;
548
+ var supportSuccessInverse$3 = inverseSupport02$3;
549
+ var supportWarningInverse$3 = inverseSupport03$3;
550
+ var supportInfoInverse$3 = inverseSupport04$3;
551
+ var overlay$3 = overlay01$3;
552
+ var toggleOff$3 = ui04$3;
553
+ var buttonPrimary$3 = interactive01$3;
554
+ var buttonSecondary$3 = interactive02$3;
555
+ var buttonTertiary$3 = interactive03$3;
556
+ var buttonDangerPrimary$3 = danger01$3;
557
+ var buttonDangerSecondary$3 = danger02$3;
558
+ var backgroundActive$3 = activeUI$3;
559
+ var layerActive$3 = activeUI$3;
560
+ var buttonDangerActive$3 = activeDanger$3;
561
+ var buttonPrimaryActive$3 = activePrimary$3;
562
+ var buttonSecondaryActive$3 = activeSecondary$3;
563
+ var buttonTertiaryActive$3 = activeTertiary$3;
564
+ var focusInset$3 = inverse01$3;
565
+ var focusInverse$3 = inverseFocusUi$3;
566
+ var backgroundHover$3 = hoverUI$3;
567
+ var layerHover$3 = hoverUI$3;
568
+ var fieldHover$3 = hoverUI$3;
569
+ var backgroundInverseHover$3 = inverseHoverUI$3;
570
+ var linkPrimaryHover$3 = hoverPrimaryText$3;
571
+ var buttonDangerHover$3 = hoverDanger$3;
572
+ var buttonPrimaryHover$3 = hoverPrimary$3;
573
+ var buttonSecondaryHover$3 = hoverSecondary$3;
574
+ var buttonTertiaryHover$3 = hoverTertiary$3;
575
+ var backgroundSelected$3 = selectedUI$3;
576
+ var backgroundSelectedHover$3 = hoverSelectedUI$3;
577
+ var layerSelected$3 = selectedUI$3;
578
+ var layerSelectedHover$3 = hoverSelectedUI$3;
579
+ var layerSelectedInverse$3 = ui05$3;
580
+ var borderSubtleSelected$3 = activeUI$3;
581
+ var layerDisabled$3 = disabled01$3;
582
+ var fieldDisabled$3 = disabled01$3;
583
+ var borderDisabled$3 = disabled01$3;
584
+ var textDisabled$3 = disabled02$3;
585
+ var buttonDisabled$3 = disabled02$3;
586
+ var iconDisabled$3 = disabled02$3;
587
+ var textOnColorDisabled$3 = disabled03$3;
588
+ var iconOnColorDisabled$3 = disabled03$3;
589
+ var layerSelectedDisabled$3 = disabled03$3;
590
+ var skeletonBackground$3 = skeleton01$3;
591
+ var skeletonElement$3 = skeleton02$3;
592
+
593
+ var brand01$3 = interactive01$3;
594
+ var brand02$3 = interactive02$3;
595
+ var brand03$3 = interactive03$3;
596
+ var active01$3 = activeUI$3;
597
+ var hoverField$3 = hoverUI$3;
598
+ var danger$3 = danger01$3;
372
599
 
373
600
  var g10 = /*#__PURE__*/Object.freeze({
374
601
  __proto__: null,
375
- interactive01: interactive01$1,
376
- interactive02: interactive02$1,
377
- interactive03: interactive03$1,
378
- interactive04: interactive04$1,
379
- uiBackground: uiBackground$1,
380
- ui01: ui01$1,
381
- ui02: ui02$1,
382
- ui03: ui03$1,
383
- ui04: ui04$1,
384
- ui05: ui05$1,
385
- text01: text01$1,
386
- text02: text02$1,
387
- text03: text03$1,
388
- text04: text04$1,
389
- text05: text05$1,
390
- textError: textError$1,
391
- icon01: icon01$1,
392
- icon02: icon02$1,
393
- icon03: icon03$1,
394
- link01: link01$1,
395
- link02: link02$1,
396
- inverseLink: inverseLink$1,
397
- field01: field01$1,
398
- field02: field02$1,
399
- inverse01: inverse01$1,
400
- inverse02: inverse02$1,
401
- support01: support01$1,
402
- support02: support02$1,
403
- support03: support03$1,
404
- support04: support04$1,
405
- inverseSupport01: inverseSupport01$1,
406
- inverseSupport02: inverseSupport02$1,
407
- inverseSupport03: inverseSupport03$1,
408
- inverseSupport04: inverseSupport04$1,
409
- overlay01: overlay01$1,
410
- danger01: danger01$1,
411
- danger02: danger02$1,
412
- focus: focus$1,
413
- inverseFocusUi: inverseFocusUi$1,
414
- hoverPrimary: hoverPrimary$1,
415
- activePrimary: activePrimary$1,
416
- hoverPrimaryText: hoverPrimaryText$1,
417
- hoverSecondary: hoverSecondary$1,
418
- activeSecondary: activeSecondary$1,
419
- hoverTertiary: hoverTertiary$1,
420
- activeTertiary: activeTertiary$1,
421
- hoverUI: hoverUI$1,
422
- hoverLightUI: hoverLightUI$1,
423
- activeUI: activeUI$1,
424
- activeLightUI: activeLightUI$1,
425
- selectedUI: selectedUI$1,
426
- selectedLightUI: selectedLightUI$1,
427
- inverseHoverUI: inverseHoverUI$1,
428
- hoverSelectedUI: hoverSelectedUI$1,
429
- hoverDanger: hoverDanger$1,
430
- activeDanger: activeDanger$1,
431
- hoverRow: hoverRow$1,
432
- visitedLink: visitedLink$1,
433
- disabled01: disabled01$1,
434
- disabled02: disabled02$1,
435
- disabled03: disabled03$1,
436
- highlight: highlight$1,
437
- decorative01: decorative01$1,
438
- buttonSeparator: buttonSeparator$1,
439
- skeleton01: skeleton01$1,
440
- skeleton02: skeleton02$1,
441
- brand01: brand01$1,
442
- brand02: brand02$1,
443
- brand03: brand03$1,
444
- active01: active01$1,
445
- hoverField: hoverField$1,
446
- danger: danger$1,
602
+ interactive01: interactive01$3,
603
+ interactive02: interactive02$3,
604
+ interactive03: interactive03$3,
605
+ interactive04: interactive04$3,
606
+ uiBackground: uiBackground$3,
607
+ ui01: ui01$3,
608
+ ui02: ui02$3,
609
+ ui03: ui03$3,
610
+ ui04: ui04$3,
611
+ ui05: ui05$3,
612
+ text01: text01$3,
613
+ text02: text02$3,
614
+ text03: text03$3,
615
+ text04: text04$3,
616
+ text05: text05$3,
617
+ textError: textError$3,
618
+ icon01: icon01$3,
619
+ icon02: icon02$3,
620
+ icon03: icon03$3,
621
+ link01: link01$3,
622
+ link02: link02$3,
623
+ inverseLink: inverseLink$3,
624
+ field01: field01$3,
625
+ field02: field02$3,
626
+ inverse01: inverse01$3,
627
+ inverse02: inverse02$3,
628
+ support01: support01$3,
629
+ support02: support02$3,
630
+ support03: support03$3,
631
+ support04: support04$3,
632
+ inverseSupport01: inverseSupport01$3,
633
+ inverseSupport02: inverseSupport02$3,
634
+ inverseSupport03: inverseSupport03$3,
635
+ inverseSupport04: inverseSupport04$3,
636
+ overlay01: overlay01$3,
637
+ danger01: danger01$3,
638
+ danger02: danger02$3,
639
+ focus: focus$3,
640
+ inverseFocusUi: inverseFocusUi$3,
641
+ hoverPrimary: hoverPrimary$3,
642
+ activePrimary: activePrimary$3,
643
+ hoverPrimaryText: hoverPrimaryText$3,
644
+ hoverSecondary: hoverSecondary$3,
645
+ activeSecondary: activeSecondary$3,
646
+ hoverTertiary: hoverTertiary$3,
647
+ activeTertiary: activeTertiary$3,
648
+ hoverUI: hoverUI$3,
649
+ hoverLightUI: hoverLightUI$3,
650
+ activeUI: activeUI$3,
651
+ activeLightUI: activeLightUI$3,
652
+ selectedUI: selectedUI$3,
653
+ selectedLightUI: selectedLightUI$3,
654
+ inverseHoverUI: inverseHoverUI$3,
655
+ hoverSelectedUI: hoverSelectedUI$3,
656
+ hoverDanger: hoverDanger$3,
657
+ activeDanger: activeDanger$3,
658
+ hoverRow: hoverRow$3,
659
+ visitedLink: visitedLink$3,
660
+ disabled01: disabled01$3,
661
+ disabled02: disabled02$3,
662
+ disabled03: disabled03$3,
663
+ highlight: highlight$3,
664
+ decorative01: decorative01$3,
665
+ buttonSeparator: buttonSeparator$3,
666
+ skeleton01: skeleton01$3,
667
+ skeleton02: skeleton02$3,
668
+ background: background$3,
669
+ layer: layer$3,
670
+ layerAccent: layerAccent$3,
671
+ field: field$3,
672
+ backgroundInverse: backgroundInverse$3,
673
+ backgroundBrand: backgroundBrand$3,
674
+ interactive: interactive$3,
675
+ borderSubtle: borderSubtle$3,
676
+ borderStrong: borderStrong$3,
677
+ borderInverse: borderInverse$3,
678
+ borderInteractive: borderInteractive$3,
679
+ textPrimary: textPrimary$3,
680
+ textSecondary: textSecondary$3,
681
+ textPlaceholder: textPlaceholder$3,
682
+ textHelper: textHelper$3,
683
+ textOnColor: textOnColor$3,
684
+ textInverse: textInverse$3,
685
+ linkPrimary: linkPrimary$3,
686
+ linkSecondary: linkSecondary$3,
687
+ linkVisited: linkVisited$3,
688
+ linkInverse: linkInverse$3,
689
+ iconPrimary: iconPrimary$3,
690
+ iconSecondary: iconSecondary$3,
691
+ iconOnColor: iconOnColor$3,
692
+ iconInverse: iconInverse$3,
693
+ supportError: supportError$3,
694
+ supportSuccess: supportSuccess$3,
695
+ supportWarning: supportWarning$3,
696
+ supportInfo: supportInfo$3,
697
+ supportErrorInverse: supportErrorInverse$3,
698
+ supportSuccessInverse: supportSuccessInverse$3,
699
+ supportWarningInverse: supportWarningInverse$3,
700
+ supportInfoInverse: supportInfoInverse$3,
701
+ overlay: overlay$3,
702
+ toggleOff: toggleOff$3,
703
+ buttonPrimary: buttonPrimary$3,
704
+ buttonSecondary: buttonSecondary$3,
705
+ buttonTertiary: buttonTertiary$3,
706
+ buttonDangerPrimary: buttonDangerPrimary$3,
707
+ buttonDangerSecondary: buttonDangerSecondary$3,
708
+ backgroundActive: backgroundActive$3,
709
+ layerActive: layerActive$3,
710
+ buttonDangerActive: buttonDangerActive$3,
711
+ buttonPrimaryActive: buttonPrimaryActive$3,
712
+ buttonSecondaryActive: buttonSecondaryActive$3,
713
+ buttonTertiaryActive: buttonTertiaryActive$3,
714
+ focusInset: focusInset$3,
715
+ focusInverse: focusInverse$3,
716
+ backgroundHover: backgroundHover$3,
717
+ layerHover: layerHover$3,
718
+ fieldHover: fieldHover$3,
719
+ backgroundInverseHover: backgroundInverseHover$3,
720
+ linkPrimaryHover: linkPrimaryHover$3,
721
+ buttonDangerHover: buttonDangerHover$3,
722
+ buttonPrimaryHover: buttonPrimaryHover$3,
723
+ buttonSecondaryHover: buttonSecondaryHover$3,
724
+ buttonTertiaryHover: buttonTertiaryHover$3,
725
+ backgroundSelected: backgroundSelected$3,
726
+ backgroundSelectedHover: backgroundSelectedHover$3,
727
+ layerSelected: layerSelected$3,
728
+ layerSelectedHover: layerSelectedHover$3,
729
+ layerSelectedInverse: layerSelectedInverse$3,
730
+ borderSubtleSelected: borderSubtleSelected$3,
731
+ layerDisabled: layerDisabled$3,
732
+ fieldDisabled: fieldDisabled$3,
733
+ borderDisabled: borderDisabled$3,
734
+ textDisabled: textDisabled$3,
735
+ buttonDisabled: buttonDisabled$3,
736
+ iconDisabled: iconDisabled$3,
737
+ textOnColorDisabled: textOnColorDisabled$3,
738
+ iconOnColorDisabled: iconOnColorDisabled$3,
739
+ layerSelectedDisabled: layerSelectedDisabled$3,
740
+ skeletonBackground: skeletonBackground$3,
741
+ skeletonElement: skeletonElement$3,
742
+ brand01: brand01$3,
743
+ brand02: brand02$3,
744
+ brand03: brand03$3,
745
+ active01: active01$3,
746
+ hoverField: hoverField$3,
747
+ danger: danger$3,
447
748
  caption01: caption01,
448
749
  label01: label01,
449
750
  helperText01: helperText01,
@@ -487,6 +788,7 @@ var g10 = /*#__PURE__*/Object.freeze({
487
788
  spacing10: spacing10,
488
789
  spacing11: spacing11,
489
790
  spacing12: spacing12,
791
+ spacing13: spacing13,
490
792
  fluidSpacing01: fluidSpacing01,
491
793
  fluidSpacing02: fluidSpacing02,
492
794
  fluidSpacing03: fluidSpacing03,
@@ -579,7 +881,83 @@ var highlight$2 = blue80;
579
881
  var decorative01$2 = gray70;
580
882
  var buttonSeparator$2 = '#161616';
581
883
  var skeleton01$2 = '#353535';
582
- var skeleton02$2 = gray70;
884
+ var skeleton02$2 = gray70; // New color tokens
885
+ // TO-DO: remove fallback color when v11 is released and assign carbon colors to new tokens
886
+
887
+ var background$2 = uiBackground$2;
888
+ var layer$2 = ui01$2;
889
+ var layerAccent$2 = ui03$2;
890
+ var field$2 = field01$2;
891
+ var backgroundInverse$2 = inverse02$2;
892
+ var backgroundBrand$2 = interactive01$2;
893
+ var interactive$2 = interactive04$2;
894
+ var borderSubtle$2 = ui03$2;
895
+ var borderStrong$2 = ui04$2;
896
+ var borderInverse$2 = ui05$2;
897
+ var borderInteractive$2 = interactive04$2;
898
+ var textPrimary$2 = text01$2;
899
+ var textSecondary$2 = text02$2;
900
+ var textPlaceholder$2 = text03$2;
901
+ var textHelper$2 = text05$2;
902
+ var textOnColor$2 = text04$2;
903
+ var textInverse$2 = inverse01$2;
904
+ var linkPrimary$2 = link01$2;
905
+ var linkSecondary$2 = link02$2;
906
+ var linkVisited$2 = visitedLink$2;
907
+ var linkInverse$2 = inverseLink$2;
908
+ var iconPrimary$2 = icon01$2;
909
+ var iconSecondary$2 = icon02$2;
910
+ var iconOnColor$2 = icon03$2;
911
+ var iconInverse$2 = inverse01$2;
912
+ var supportError$2 = support01$2;
913
+ var supportSuccess$2 = support02$2;
914
+ var supportWarning$2 = support03$2;
915
+ var supportInfo$2 = support04$2;
916
+ var supportErrorInverse$2 = inverseSupport01$2;
917
+ var supportSuccessInverse$2 = inverseSupport02$2;
918
+ var supportWarningInverse$2 = inverseSupport03$2;
919
+ var supportInfoInverse$2 = inverseSupport04$2;
920
+ var overlay$2 = overlay01$2;
921
+ var toggleOff$2 = ui04$2;
922
+ var buttonPrimary$2 = interactive01$2;
923
+ var buttonSecondary$2 = interactive02$2;
924
+ var buttonTertiary$2 = interactive03$2;
925
+ var buttonDangerPrimary$2 = danger01$2;
926
+ var buttonDangerSecondary$2 = danger02$2;
927
+ var backgroundActive$2 = activeUI$2;
928
+ var layerActive$2 = activeUI$2;
929
+ var buttonDangerActive$2 = activeDanger$2;
930
+ var buttonPrimaryActive$2 = activePrimary$2;
931
+ var buttonSecondaryActive$2 = activeSecondary$2;
932
+ var buttonTertiaryActive$2 = activeTertiary$2;
933
+ var focusInset$2 = inverse01$2;
934
+ var focusInverse$2 = inverseFocusUi$2;
935
+ var backgroundHover$2 = hoverUI$2;
936
+ var layerHover$2 = hoverUI$2;
937
+ var fieldHover$2 = hoverUI$2;
938
+ var backgroundInverseHover$2 = inverseHoverUI$2;
939
+ var linkPrimaryHover$2 = hoverPrimaryText$2;
940
+ var buttonDangerHover$2 = hoverDanger$2;
941
+ var buttonPrimaryHover$2 = hoverPrimary$2;
942
+ var buttonSecondaryHover$2 = hoverSecondary$2;
943
+ var buttonTertiaryHover$2 = hoverTertiary$2;
944
+ var backgroundSelected$2 = selectedUI$2;
945
+ var backgroundSelectedHover$2 = hoverSelectedUI$2;
946
+ var layerSelected$2 = selectedUI$2;
947
+ var layerSelectedHover$2 = hoverSelectedUI$2;
948
+ var layerSelectedInverse$2 = ui05$2;
949
+ var borderSubtleSelected$2 = activeUI$2;
950
+ var layerDisabled$2 = disabled01$2;
951
+ var fieldDisabled$2 = disabled01$2;
952
+ var borderDisabled$2 = disabled01$2;
953
+ var textDisabled$2 = disabled02$2;
954
+ var buttonDisabled$2 = disabled02$2;
955
+ var iconDisabled$2 = disabled02$2;
956
+ var textOnColorDisabled$2 = disabled03$2;
957
+ var iconOnColorDisabled$2 = disabled03$2;
958
+ var layerSelectedDisabled$2 = disabled03$2;
959
+ var skeletonBackground$2 = skeleton01$2;
960
+ var skeletonElement$2 = skeleton02$2;
583
961
 
584
962
  var brand01$2 = interactive01$2;
585
963
  var brand02$2 = interactive02$2;
@@ -656,6 +1034,80 @@ var g100 = /*#__PURE__*/Object.freeze({
656
1034
  buttonSeparator: buttonSeparator$2,
657
1035
  skeleton01: skeleton01$2,
658
1036
  skeleton02: skeleton02$2,
1037
+ background: background$2,
1038
+ layer: layer$2,
1039
+ layerAccent: layerAccent$2,
1040
+ field: field$2,
1041
+ backgroundInverse: backgroundInverse$2,
1042
+ backgroundBrand: backgroundBrand$2,
1043
+ interactive: interactive$2,
1044
+ borderSubtle: borderSubtle$2,
1045
+ borderStrong: borderStrong$2,
1046
+ borderInverse: borderInverse$2,
1047
+ borderInteractive: borderInteractive$2,
1048
+ textPrimary: textPrimary$2,
1049
+ textSecondary: textSecondary$2,
1050
+ textPlaceholder: textPlaceholder$2,
1051
+ textHelper: textHelper$2,
1052
+ textOnColor: textOnColor$2,
1053
+ textInverse: textInverse$2,
1054
+ linkPrimary: linkPrimary$2,
1055
+ linkSecondary: linkSecondary$2,
1056
+ linkVisited: linkVisited$2,
1057
+ linkInverse: linkInverse$2,
1058
+ iconPrimary: iconPrimary$2,
1059
+ iconSecondary: iconSecondary$2,
1060
+ iconOnColor: iconOnColor$2,
1061
+ iconInverse: iconInverse$2,
1062
+ supportError: supportError$2,
1063
+ supportSuccess: supportSuccess$2,
1064
+ supportWarning: supportWarning$2,
1065
+ supportInfo: supportInfo$2,
1066
+ supportErrorInverse: supportErrorInverse$2,
1067
+ supportSuccessInverse: supportSuccessInverse$2,
1068
+ supportWarningInverse: supportWarningInverse$2,
1069
+ supportInfoInverse: supportInfoInverse$2,
1070
+ overlay: overlay$2,
1071
+ toggleOff: toggleOff$2,
1072
+ buttonPrimary: buttonPrimary$2,
1073
+ buttonSecondary: buttonSecondary$2,
1074
+ buttonTertiary: buttonTertiary$2,
1075
+ buttonDangerPrimary: buttonDangerPrimary$2,
1076
+ buttonDangerSecondary: buttonDangerSecondary$2,
1077
+ backgroundActive: backgroundActive$2,
1078
+ layerActive: layerActive$2,
1079
+ buttonDangerActive: buttonDangerActive$2,
1080
+ buttonPrimaryActive: buttonPrimaryActive$2,
1081
+ buttonSecondaryActive: buttonSecondaryActive$2,
1082
+ buttonTertiaryActive: buttonTertiaryActive$2,
1083
+ focusInset: focusInset$2,
1084
+ focusInverse: focusInverse$2,
1085
+ backgroundHover: backgroundHover$2,
1086
+ layerHover: layerHover$2,
1087
+ fieldHover: fieldHover$2,
1088
+ backgroundInverseHover: backgroundInverseHover$2,
1089
+ linkPrimaryHover: linkPrimaryHover$2,
1090
+ buttonDangerHover: buttonDangerHover$2,
1091
+ buttonPrimaryHover: buttonPrimaryHover$2,
1092
+ buttonSecondaryHover: buttonSecondaryHover$2,
1093
+ buttonTertiaryHover: buttonTertiaryHover$2,
1094
+ backgroundSelected: backgroundSelected$2,
1095
+ backgroundSelectedHover: backgroundSelectedHover$2,
1096
+ layerSelected: layerSelected$2,
1097
+ layerSelectedHover: layerSelectedHover$2,
1098
+ layerSelectedInverse: layerSelectedInverse$2,
1099
+ borderSubtleSelected: borderSubtleSelected$2,
1100
+ layerDisabled: layerDisabled$2,
1101
+ fieldDisabled: fieldDisabled$2,
1102
+ borderDisabled: borderDisabled$2,
1103
+ textDisabled: textDisabled$2,
1104
+ buttonDisabled: buttonDisabled$2,
1105
+ iconDisabled: iconDisabled$2,
1106
+ textOnColorDisabled: textOnColorDisabled$2,
1107
+ iconOnColorDisabled: iconOnColorDisabled$2,
1108
+ layerSelectedDisabled: layerSelectedDisabled$2,
1109
+ skeletonBackground: skeletonBackground$2,
1110
+ skeletonElement: skeletonElement$2,
659
1111
  brand01: brand01$2,
660
1112
  brand02: brand02$2,
661
1113
  brand03: brand03$2,
@@ -705,6 +1157,7 @@ var g100 = /*#__PURE__*/Object.freeze({
705
1157
  spacing10: spacing10,
706
1158
  spacing11: spacing11,
707
1159
  spacing12: spacing12,
1160
+ spacing13: spacing13,
708
1161
  fluidSpacing01: fluidSpacing01,
709
1162
  fluidSpacing02: fluidSpacing02,
710
1163
  fluidSpacing03: fluidSpacing03,
@@ -731,155 +1184,305 @@ var g100 = /*#__PURE__*/Object.freeze({
731
1184
  * This source code is licensed under the Apache-2.0 license found in the
732
1185
  * LICENSE file in the root directory of this source tree.
733
1186
  */
734
- var interactive01$3 = blue60;
735
- var interactive02$3 = gray60;
736
- var interactive03$3 = white$1;
737
- var interactive04$3 = blue50;
738
- var uiBackground$3 = gray90;
739
- var ui01$3 = gray80;
740
- var ui02$3 = gray70;
741
- var ui03$3 = gray70;
742
- var ui04$3 = gray50;
743
- var ui05$3 = gray10;
744
- var text01$3 = gray10;
745
- var text02$3 = gray30;
746
- var text03$3 = gray60;
747
- var text04$3 = white$1;
748
- var text05$3 = gray50;
749
- var textError$3 = red30;
750
- var icon01$3 = gray10;
751
- var icon02$3 = gray30;
752
- var icon03$3 = white$1;
753
- var link01$3 = blue40;
754
- var link02$3 = blue30;
755
- var inverseLink$3 = blue60;
756
- var field01$3 = gray80;
757
- var field02$3 = gray70;
758
- var inverse01$3 = gray100;
759
- var inverse02$3 = gray10;
760
- var support01$3 = red40;
761
- var support02$3 = green40;
762
- var support03$3 = yellow;
763
- var support04$3 = blue50;
764
- var inverseSupport01$3 = red60;
765
- var inverseSupport02$3 = green50;
766
- var inverseSupport03$3 = yellow;
767
- var inverseSupport04$3 = blue60;
768
- var overlay01$3 = rgba(gray100, 0.7);
769
- var danger01$3 = red60;
770
- var danger02$3 = red40; // Interaction states
1187
+ var interactive01$1 = blue60;
1188
+ var interactive02$1 = gray60;
1189
+ var interactive03$1 = white$1;
1190
+ var interactive04$1 = blue50;
1191
+ var uiBackground$1 = gray90;
1192
+ var ui01$1 = gray80;
1193
+ var ui02$1 = gray70;
1194
+ var ui03$1 = gray70;
1195
+ var ui04$1 = gray50;
1196
+ var ui05$1 = gray10;
1197
+ var text01$1 = gray10;
1198
+ var text02$1 = gray30;
1199
+ var text03$1 = gray60;
1200
+ var text04$1 = white$1;
1201
+ var text05$1 = gray50;
1202
+ var textError$1 = red30;
1203
+ var icon01$1 = gray10;
1204
+ var icon02$1 = gray30;
1205
+ var icon03$1 = white$1;
1206
+ var link01$1 = blue40;
1207
+ var link02$1 = blue30;
1208
+ var inverseLink$1 = blue60;
1209
+ var field01$1 = gray80;
1210
+ var field02$1 = gray70;
1211
+ var inverse01$1 = gray100;
1212
+ var inverse02$1 = gray10;
1213
+ var support01$1 = red40;
1214
+ var support02$1 = green40;
1215
+ var support03$1 = yellow;
1216
+ var support04$1 = blue50;
1217
+ var inverseSupport01$1 = red60;
1218
+ var inverseSupport02$1 = green50;
1219
+ var inverseSupport03$1 = yellow;
1220
+ var inverseSupport04$1 = blue60;
1221
+ var overlay01$1 = rgba(gray100, 0.7);
1222
+ var danger01$1 = red60;
1223
+ var danger02$1 = red40; // Interaction states
771
1224
 
772
- var focus$3 = white$1;
773
- var inverseFocusUi$3 = blue60;
774
- var hoverPrimary$3 = '#0353e9';
775
- var activePrimary$3 = blue80;
776
- var hoverPrimaryText$3 = blue30;
777
- var hoverSecondary$3 = '#606060';
778
- var activeSecondary$3 = gray80;
779
- var hoverTertiary$3 = gray10;
780
- var activeTertiary$3 = gray30;
781
- var hoverUI$3 = '#4c4c4c';
782
- var hoverLightUI$3 = '#656565';
783
- var activeUI$3 = gray60;
784
- var activeLightUI$3 = gray50;
785
- var selectedUI$3 = gray70;
786
- var selectedLightUI$3 = gray60;
787
- var inverseHoverUI$3 = '#e5e5e5';
788
- var hoverSelectedUI$3 = '#656565';
789
- var hoverDanger$3 = adjustLightness(danger01$3, -8);
790
- var activeDanger$3 = red80;
791
- var hoverRow$3 = '#4c4c4c';
792
- var visitedLink$3 = purple40;
793
- var disabled01$3 = gray80;
794
- var disabled02$3 = gray60;
795
- var disabled03$3 = gray40;
796
- var highlight$3 = blue70;
797
- var decorative01$3 = gray60;
798
- var buttonSeparator$3 = '#161616';
799
- var skeleton01$3 = '#353535';
800
- var skeleton02$3 = gray70;
1225
+ var focus$1 = white$1;
1226
+ var inverseFocusUi$1 = blue60;
1227
+ var hoverPrimary$1 = '#0353e9';
1228
+ var activePrimary$1 = blue80;
1229
+ var hoverPrimaryText$1 = blue30;
1230
+ var hoverSecondary$1 = '#606060';
1231
+ var activeSecondary$1 = gray80;
1232
+ var hoverTertiary$1 = gray10;
1233
+ var activeTertiary$1 = gray30;
1234
+ var hoverUI$1 = '#4c4c4c';
1235
+ var hoverLightUI$1 = '#656565';
1236
+ var activeUI$1 = gray60;
1237
+ var activeLightUI$1 = gray50;
1238
+ var selectedUI$1 = gray70;
1239
+ var selectedLightUI$1 = gray60;
1240
+ var inverseHoverUI$1 = '#e5e5e5';
1241
+ var hoverSelectedUI$1 = '#656565';
1242
+ var hoverDanger$1 = adjustLightness(danger01$1, -8);
1243
+ var activeDanger$1 = red80;
1244
+ var hoverRow$1 = '#4c4c4c';
1245
+ var visitedLink$1 = purple40;
1246
+ var disabled01$1 = gray80;
1247
+ var disabled02$1 = gray60;
1248
+ var disabled03$1 = gray40;
1249
+ var highlight$1 = blue70;
1250
+ var decorative01$1 = gray60;
1251
+ var buttonSeparator$1 = '#161616';
1252
+ var skeleton01$1 = '#353535';
1253
+ var skeleton02$1 = gray70; // New color tokens
1254
+ // TO-DO: remove fallback color when v11 is released and assign carbon colors to new tokens
801
1255
 
802
- var brand01$3 = interactive01$3;
803
- var brand02$3 = interactive02$3;
804
- var brand03$3 = interactive03$3;
805
- var active01$3 = activeUI$3;
806
- var hoverField$3 = hoverUI$3;
807
- var danger$3 = danger01$3;
1256
+ var background$1 = uiBackground$1;
1257
+ var layer$1 = ui01$1;
1258
+ var layerAccent$1 = ui03$1;
1259
+ var field$1 = field01$1;
1260
+ var backgroundInverse$1 = inverse02$1;
1261
+ var backgroundBrand$1 = interactive01$1;
1262
+ var interactive$1 = interactive04$1;
1263
+ var borderSubtle$1 = ui03$1;
1264
+ var borderStrong$1 = ui04$1;
1265
+ var borderInverse$1 = ui05$1;
1266
+ var borderInteractive$1 = interactive04$1;
1267
+ var textPrimary$1 = text01$1;
1268
+ var textSecondary$1 = text02$1;
1269
+ var textPlaceholder$1 = text03$1;
1270
+ var textHelper$1 = text05$1;
1271
+ var textOnColor$1 = text04$1;
1272
+ var textInverse$1 = inverse01$1;
1273
+ var linkPrimary$1 = link01$1;
1274
+ var linkSecondary$1 = link02$1;
1275
+ var linkVisited$1 = visitedLink$1;
1276
+ var linkInverse$1 = inverseLink$1;
1277
+ var iconPrimary$1 = icon01$1;
1278
+ var iconSecondary$1 = icon02$1;
1279
+ var iconOnColor$1 = icon03$1;
1280
+ var iconInverse$1 = inverse01$1;
1281
+ var supportError$1 = support01$1;
1282
+ var supportSuccess$1 = support02$1;
1283
+ var supportWarning$1 = support03$1;
1284
+ var supportInfo$1 = support04$1;
1285
+ var supportErrorInverse$1 = inverseSupport01$1;
1286
+ var supportSuccessInverse$1 = inverseSupport02$1;
1287
+ var supportWarningInverse$1 = inverseSupport03$1;
1288
+ var supportInfoInverse$1 = inverseSupport04$1;
1289
+ var overlay$1 = overlay01$1;
1290
+ var toggleOff$1 = ui04$1;
1291
+ var buttonPrimary$1 = interactive01$1;
1292
+ var buttonSecondary$1 = interactive02$1;
1293
+ var buttonTertiary$1 = interactive03$1;
1294
+ var buttonDangerPrimary$1 = danger01$1;
1295
+ var buttonDangerSecondary$1 = danger02$1;
1296
+ var backgroundActive$1 = activeUI$1;
1297
+ var layerActive$1 = activeUI$1;
1298
+ var buttonDangerActive$1 = activeDanger$1;
1299
+ var buttonPrimaryActive$1 = activePrimary$1;
1300
+ var buttonSecondaryActive$1 = activeSecondary$1;
1301
+ var buttonTertiaryActive$1 = activeTertiary$1;
1302
+ var focusInset$1 = inverse01$1;
1303
+ var focusInverse$1 = inverseFocusUi$1;
1304
+ var backgroundHover$1 = hoverUI$1;
1305
+ var layerHover$1 = hoverUI$1;
1306
+ var fieldHover$1 = hoverUI$1;
1307
+ var backgroundInverseHover$1 = inverseHoverUI$1;
1308
+ var linkPrimaryHover$1 = hoverPrimaryText$1;
1309
+ var buttonDangerHover$1 = hoverDanger$1;
1310
+ var buttonPrimaryHover$1 = hoverPrimary$1;
1311
+ var buttonSecondaryHover$1 = hoverSecondary$1;
1312
+ var buttonTertiaryHover$1 = hoverTertiary$1;
1313
+ var backgroundSelected$1 = selectedUI$1;
1314
+ var backgroundSelectedHover$1 = hoverSelectedUI$1;
1315
+ var layerSelected$1 = selectedUI$1;
1316
+ var layerSelectedHover$1 = hoverSelectedUI$1;
1317
+ var layerSelectedInverse$1 = ui05$1;
1318
+ var borderSubtleSelected$1 = activeUI$1;
1319
+ var layerDisabled$1 = disabled01$1;
1320
+ var fieldDisabled$1 = disabled01$1;
1321
+ var borderDisabled$1 = disabled01$1;
1322
+ var textDisabled$1 = disabled02$1;
1323
+ var buttonDisabled$1 = disabled02$1;
1324
+ var iconDisabled$1 = disabled02$1;
1325
+ var textOnColorDisabled$1 = disabled03$1;
1326
+ var iconOnColorDisabled$1 = disabled03$1;
1327
+ var layerSelectedDisabled$1 = disabled03$1;
1328
+ var skeletonBackground$1 = skeleton01$1;
1329
+ var skeletonElement$1 = skeleton02$1;
1330
+
1331
+ var brand01$1 = interactive01$1;
1332
+ var brand02$1 = interactive02$1;
1333
+ var brand03$1 = interactive03$1;
1334
+ var active01$1 = activeUI$1;
1335
+ var hoverField$1 = hoverUI$1;
1336
+ var danger$1 = danger01$1;
808
1337
 
809
1338
  var g90 = /*#__PURE__*/Object.freeze({
810
1339
  __proto__: null,
811
- interactive01: interactive01$3,
812
- interactive02: interactive02$3,
813
- interactive03: interactive03$3,
814
- interactive04: interactive04$3,
815
- uiBackground: uiBackground$3,
816
- ui01: ui01$3,
817
- ui02: ui02$3,
818
- ui03: ui03$3,
819
- ui04: ui04$3,
820
- ui05: ui05$3,
821
- text01: text01$3,
822
- text02: text02$3,
823
- text03: text03$3,
824
- text04: text04$3,
825
- text05: text05$3,
826
- textError: textError$3,
827
- icon01: icon01$3,
828
- icon02: icon02$3,
829
- icon03: icon03$3,
830
- link01: link01$3,
831
- link02: link02$3,
832
- inverseLink: inverseLink$3,
833
- field01: field01$3,
834
- field02: field02$3,
835
- inverse01: inverse01$3,
836
- inverse02: inverse02$3,
837
- support01: support01$3,
838
- support02: support02$3,
839
- support03: support03$3,
840
- support04: support04$3,
841
- inverseSupport01: inverseSupport01$3,
842
- inverseSupport02: inverseSupport02$3,
843
- inverseSupport03: inverseSupport03$3,
844
- inverseSupport04: inverseSupport04$3,
845
- overlay01: overlay01$3,
846
- danger01: danger01$3,
847
- danger02: danger02$3,
848
- focus: focus$3,
849
- inverseFocusUi: inverseFocusUi$3,
850
- hoverPrimary: hoverPrimary$3,
851
- activePrimary: activePrimary$3,
852
- hoverPrimaryText: hoverPrimaryText$3,
853
- hoverSecondary: hoverSecondary$3,
854
- activeSecondary: activeSecondary$3,
855
- hoverTertiary: hoverTertiary$3,
856
- activeTertiary: activeTertiary$3,
857
- hoverUI: hoverUI$3,
858
- hoverLightUI: hoverLightUI$3,
859
- activeUI: activeUI$3,
860
- activeLightUI: activeLightUI$3,
861
- selectedUI: selectedUI$3,
862
- selectedLightUI: selectedLightUI$3,
863
- inverseHoverUI: inverseHoverUI$3,
864
- hoverSelectedUI: hoverSelectedUI$3,
865
- hoverDanger: hoverDanger$3,
866
- activeDanger: activeDanger$3,
867
- hoverRow: hoverRow$3,
868
- visitedLink: visitedLink$3,
869
- disabled01: disabled01$3,
870
- disabled02: disabled02$3,
871
- disabled03: disabled03$3,
872
- highlight: highlight$3,
873
- decorative01: decorative01$3,
874
- buttonSeparator: buttonSeparator$3,
875
- skeleton01: skeleton01$3,
876
- skeleton02: skeleton02$3,
877
- brand01: brand01$3,
878
- brand02: brand02$3,
879
- brand03: brand03$3,
880
- active01: active01$3,
881
- hoverField: hoverField$3,
882
- danger: danger$3,
1340
+ interactive01: interactive01$1,
1341
+ interactive02: interactive02$1,
1342
+ interactive03: interactive03$1,
1343
+ interactive04: interactive04$1,
1344
+ uiBackground: uiBackground$1,
1345
+ ui01: ui01$1,
1346
+ ui02: ui02$1,
1347
+ ui03: ui03$1,
1348
+ ui04: ui04$1,
1349
+ ui05: ui05$1,
1350
+ text01: text01$1,
1351
+ text02: text02$1,
1352
+ text03: text03$1,
1353
+ text04: text04$1,
1354
+ text05: text05$1,
1355
+ textError: textError$1,
1356
+ icon01: icon01$1,
1357
+ icon02: icon02$1,
1358
+ icon03: icon03$1,
1359
+ link01: link01$1,
1360
+ link02: link02$1,
1361
+ inverseLink: inverseLink$1,
1362
+ field01: field01$1,
1363
+ field02: field02$1,
1364
+ inverse01: inverse01$1,
1365
+ inverse02: inverse02$1,
1366
+ support01: support01$1,
1367
+ support02: support02$1,
1368
+ support03: support03$1,
1369
+ support04: support04$1,
1370
+ inverseSupport01: inverseSupport01$1,
1371
+ inverseSupport02: inverseSupport02$1,
1372
+ inverseSupport03: inverseSupport03$1,
1373
+ inverseSupport04: inverseSupport04$1,
1374
+ overlay01: overlay01$1,
1375
+ danger01: danger01$1,
1376
+ danger02: danger02$1,
1377
+ focus: focus$1,
1378
+ inverseFocusUi: inverseFocusUi$1,
1379
+ hoverPrimary: hoverPrimary$1,
1380
+ activePrimary: activePrimary$1,
1381
+ hoverPrimaryText: hoverPrimaryText$1,
1382
+ hoverSecondary: hoverSecondary$1,
1383
+ activeSecondary: activeSecondary$1,
1384
+ hoverTertiary: hoverTertiary$1,
1385
+ activeTertiary: activeTertiary$1,
1386
+ hoverUI: hoverUI$1,
1387
+ hoverLightUI: hoverLightUI$1,
1388
+ activeUI: activeUI$1,
1389
+ activeLightUI: activeLightUI$1,
1390
+ selectedUI: selectedUI$1,
1391
+ selectedLightUI: selectedLightUI$1,
1392
+ inverseHoverUI: inverseHoverUI$1,
1393
+ hoverSelectedUI: hoverSelectedUI$1,
1394
+ hoverDanger: hoverDanger$1,
1395
+ activeDanger: activeDanger$1,
1396
+ hoverRow: hoverRow$1,
1397
+ visitedLink: visitedLink$1,
1398
+ disabled01: disabled01$1,
1399
+ disabled02: disabled02$1,
1400
+ disabled03: disabled03$1,
1401
+ highlight: highlight$1,
1402
+ decorative01: decorative01$1,
1403
+ buttonSeparator: buttonSeparator$1,
1404
+ skeleton01: skeleton01$1,
1405
+ skeleton02: skeleton02$1,
1406
+ background: background$1,
1407
+ layer: layer$1,
1408
+ layerAccent: layerAccent$1,
1409
+ field: field$1,
1410
+ backgroundInverse: backgroundInverse$1,
1411
+ backgroundBrand: backgroundBrand$1,
1412
+ interactive: interactive$1,
1413
+ borderSubtle: borderSubtle$1,
1414
+ borderStrong: borderStrong$1,
1415
+ borderInverse: borderInverse$1,
1416
+ borderInteractive: borderInteractive$1,
1417
+ textPrimary: textPrimary$1,
1418
+ textSecondary: textSecondary$1,
1419
+ textPlaceholder: textPlaceholder$1,
1420
+ textHelper: textHelper$1,
1421
+ textOnColor: textOnColor$1,
1422
+ textInverse: textInverse$1,
1423
+ linkPrimary: linkPrimary$1,
1424
+ linkSecondary: linkSecondary$1,
1425
+ linkVisited: linkVisited$1,
1426
+ linkInverse: linkInverse$1,
1427
+ iconPrimary: iconPrimary$1,
1428
+ iconSecondary: iconSecondary$1,
1429
+ iconOnColor: iconOnColor$1,
1430
+ iconInverse: iconInverse$1,
1431
+ supportError: supportError$1,
1432
+ supportSuccess: supportSuccess$1,
1433
+ supportWarning: supportWarning$1,
1434
+ supportInfo: supportInfo$1,
1435
+ supportErrorInverse: supportErrorInverse$1,
1436
+ supportSuccessInverse: supportSuccessInverse$1,
1437
+ supportWarningInverse: supportWarningInverse$1,
1438
+ supportInfoInverse: supportInfoInverse$1,
1439
+ overlay: overlay$1,
1440
+ toggleOff: toggleOff$1,
1441
+ buttonPrimary: buttonPrimary$1,
1442
+ buttonSecondary: buttonSecondary$1,
1443
+ buttonTertiary: buttonTertiary$1,
1444
+ buttonDangerPrimary: buttonDangerPrimary$1,
1445
+ buttonDangerSecondary: buttonDangerSecondary$1,
1446
+ backgroundActive: backgroundActive$1,
1447
+ layerActive: layerActive$1,
1448
+ buttonDangerActive: buttonDangerActive$1,
1449
+ buttonPrimaryActive: buttonPrimaryActive$1,
1450
+ buttonSecondaryActive: buttonSecondaryActive$1,
1451
+ buttonTertiaryActive: buttonTertiaryActive$1,
1452
+ focusInset: focusInset$1,
1453
+ focusInverse: focusInverse$1,
1454
+ backgroundHover: backgroundHover$1,
1455
+ layerHover: layerHover$1,
1456
+ fieldHover: fieldHover$1,
1457
+ backgroundInverseHover: backgroundInverseHover$1,
1458
+ linkPrimaryHover: linkPrimaryHover$1,
1459
+ buttonDangerHover: buttonDangerHover$1,
1460
+ buttonPrimaryHover: buttonPrimaryHover$1,
1461
+ buttonSecondaryHover: buttonSecondaryHover$1,
1462
+ buttonTertiaryHover: buttonTertiaryHover$1,
1463
+ backgroundSelected: backgroundSelected$1,
1464
+ backgroundSelectedHover: backgroundSelectedHover$1,
1465
+ layerSelected: layerSelected$1,
1466
+ layerSelectedHover: layerSelectedHover$1,
1467
+ layerSelectedInverse: layerSelectedInverse$1,
1468
+ borderSubtleSelected: borderSubtleSelected$1,
1469
+ layerDisabled: layerDisabled$1,
1470
+ fieldDisabled: fieldDisabled$1,
1471
+ borderDisabled: borderDisabled$1,
1472
+ textDisabled: textDisabled$1,
1473
+ buttonDisabled: buttonDisabled$1,
1474
+ iconDisabled: iconDisabled$1,
1475
+ textOnColorDisabled: textOnColorDisabled$1,
1476
+ iconOnColorDisabled: iconOnColorDisabled$1,
1477
+ layerSelectedDisabled: layerSelectedDisabled$1,
1478
+ skeletonBackground: skeletonBackground$1,
1479
+ skeletonElement: skeletonElement$1,
1480
+ brand01: brand01$1,
1481
+ brand02: brand02$1,
1482
+ brand03: brand03$1,
1483
+ active01: active01$1,
1484
+ hoverField: hoverField$1,
1485
+ danger: danger$1,
883
1486
  caption01: caption01,
884
1487
  label01: label01,
885
1488
  helperText01: helperText01,
@@ -923,6 +1526,7 @@ var g90 = /*#__PURE__*/Object.freeze({
923
1526
  spacing10: spacing10,
924
1527
  spacing11: spacing11,
925
1528
  spacing12: spacing12,
1529
+ spacing13: spacing13,
926
1530
  fluidSpacing01: fluidSpacing01,
927
1531
  fluidSpacing02: fluidSpacing02,
928
1532
  fluidSpacing03: fluidSpacing03,
@@ -949,155 +1553,305 @@ var g90 = /*#__PURE__*/Object.freeze({
949
1553
  * This source code is licensed under the Apache-2.0 license found in the
950
1554
  * LICENSE file in the root directory of this source tree.
951
1555
  */
952
- var interactive01$4 = '#3d70b2';
953
- var interactive02$4 = '#4d5358';
954
- var interactive03$4 = '#3d70b2';
955
- var interactive04$4 = '#3d70b2';
956
- var uiBackground$4 = '#f4f7fb';
957
- var ui01$4 = white$1;
958
- var ui02$4 = '#f4f7fb';
959
- var ui03$4 = '#dfe3e6';
960
- var ui04$4 = '#8897a2';
961
- var ui05$4 = '#5a6872';
962
- var text01$4 = '#152935';
963
- var text02$4 = '#5a6872';
964
- var text03$4 = '#cdd1d4';
965
- var text04$4 = white$1;
966
- var text05$4 = '#5a6872';
967
- var textError$4 = '#e0182d';
968
- var icon01$4 = '#3d70b2';
969
- var icon02$4 = '#5a6872';
970
- var icon03$4 = white$1;
971
- var link01$4 = '#3d70b2';
972
- var link02$4 = '#3d70b2';
973
- var inverseLink$4 = '#5596e6';
974
- var field01$4 = white$1;
975
- var field02$4 = '#f4f7fb';
976
- var inverse01$4 = white$1;
977
- var inverse02$4 = '#272d33';
978
- var support01$4 = '#e0182d';
979
- var support02$4 = '#5aa700';
980
- var support03$4 = '#efc100';
981
- var support04$4 = '#5aaafa';
982
- var inverseSupport01$4 = '#ff5050';
983
- var inverseSupport02$4 = '#8cd211';
984
- var inverseSupport03$4 = '#FDD600';
985
- var inverseSupport04$4 = '#5aaafa';
986
- var overlay01$4 = 'rgba(223, 227, 230, 0.5)';
987
- var danger01$4 = red60;
988
- var danger02$4 = red60; // Interaction states
1556
+ var interactive01 = '#3d70b2';
1557
+ var interactive02 = '#4d5358';
1558
+ var interactive03 = '#3d70b2';
1559
+ var interactive04 = '#3d70b2';
1560
+ var uiBackground = '#f4f7fb';
1561
+ var ui01 = white$1;
1562
+ var ui02 = '#f4f7fb';
1563
+ var ui03 = '#dfe3e6';
1564
+ var ui04 = '#8897a2';
1565
+ var ui05 = '#5a6872';
1566
+ var text01 = '#152935';
1567
+ var text02 = '#5a6872';
1568
+ var text03 = '#cdd1d4';
1569
+ var text04 = white$1;
1570
+ var text05 = '#5a6872';
1571
+ var textError = '#e0182d';
1572
+ var icon01 = '#3d70b2';
1573
+ var icon02 = '#5a6872';
1574
+ var icon03 = white$1;
1575
+ var link01 = '#3d70b2';
1576
+ var link02 = '#3d70b2';
1577
+ var inverseLink = '#5596e6';
1578
+ var field01 = white$1;
1579
+ var field02 = '#f4f7fb';
1580
+ var inverse01 = white$1;
1581
+ var inverse02 = '#272d33';
1582
+ var support01 = '#e0182d';
1583
+ var support02 = '#5aa700';
1584
+ var support03 = '#efc100';
1585
+ var support04 = '#5aaafa';
1586
+ var inverseSupport01 = '#ff5050';
1587
+ var inverseSupport02 = '#8cd211';
1588
+ var inverseSupport03 = '#FDD600';
1589
+ var inverseSupport04 = '#5aaafa';
1590
+ var overlay01 = 'rgba(223, 227, 230, 0.5)';
1591
+ var danger01 = red60;
1592
+ var danger02 = red60; // Interaction states
989
1593
 
990
- var focus$4 = '#3d70b2';
991
- var inverseFocusUi$4 = '#3d70b2';
992
- var hoverPrimary$4 = '#30588c';
993
- var activePrimary$4 = '#30588c';
994
- var hoverPrimaryText$4 = '#294c86';
995
- var hoverSecondary$4 = '#4d5b65';
996
- var activeSecondary$4 = '#414f59';
997
- var hoverTertiary$4 = '#5a6872';
998
- var activeTertiary$4 = '#414f59';
999
- var hoverUI$4 = '#EEF4FC';
1000
- var hoverLightUI$4 = '#EEF4FC';
1001
- var activeUI$4 = '#DFEAFA';
1002
- var activeLightUI$4 = '#DFEAFA';
1003
- var selectedUI$4 = '#EEF4FC';
1004
- var selectedLightUI$4 = '#EEF4FC';
1005
- var inverseHoverUI$4 = '#4c4c4c';
1006
- var hoverSelectedUI$4 = '#DFEAFA';
1007
- var hoverDanger$4 = '#c70014';
1008
- var activeDanger$4 = '#AD1625';
1009
- var hoverRow$4 = '#eef4fc';
1010
- var visitedLink$4 = '#294c86';
1011
- var disabled01$4 = '#fafbfd';
1012
- var disabled02$4 = '#dfe3e6';
1013
- var disabled03$4 = '#cdd1d4';
1014
- var highlight$4 = '#f4f7fb';
1015
- var decorative01$4 = '#EEF4FC';
1016
- var buttonSeparator$4 = '#e0e0e0';
1017
- var skeleton01$4 = 'rgba(61, 112, 178, .1)';
1018
- var skeleton02$4 = 'rgba(61, 112, 178, .1)';
1594
+ var focus = '#3d70b2';
1595
+ var inverseFocusUi = '#3d70b2';
1596
+ var hoverPrimary = '#30588c';
1597
+ var activePrimary = '#30588c';
1598
+ var hoverPrimaryText = '#294c86';
1599
+ var hoverSecondary = '#4d5b65';
1600
+ var activeSecondary = '#414f59';
1601
+ var hoverTertiary = '#5a6872';
1602
+ var activeTertiary = '#414f59';
1603
+ var hoverUI = '#EEF4FC';
1604
+ var hoverLightUI = '#EEF4FC';
1605
+ var activeUI = '#DFEAFA';
1606
+ var activeLightUI = '#DFEAFA';
1607
+ var selectedUI = '#EEF4FC';
1608
+ var selectedLightUI = '#EEF4FC';
1609
+ var inverseHoverUI = '#4c4c4c';
1610
+ var hoverSelectedUI = '#DFEAFA';
1611
+ var hoverDanger = '#c70014';
1612
+ var activeDanger = '#AD1625';
1613
+ var hoverRow = '#eef4fc';
1614
+ var visitedLink = '#294c86';
1615
+ var disabled01 = '#fafbfd';
1616
+ var disabled02 = '#dfe3e6';
1617
+ var disabled03 = '#cdd1d4';
1618
+ var highlight = '#f4f7fb';
1619
+ var decorative01 = '#EEF4FC';
1620
+ var buttonSeparator = '#e0e0e0';
1621
+ var skeleton01 = 'rgba(61, 112, 178, .1)';
1622
+ var skeleton02 = 'rgba(61, 112, 178, .1)'; // New color tokens
1623
+ // TO-DO: remove fallback color when v11 is released and assign carbon colors to new tokens
1019
1624
 
1020
- var brand01$4 = interactive01$4;
1021
- var brand02$4 = interactive02$4;
1022
- var brand03$4 = interactive03$4;
1023
- var active01$4 = activeUI$4;
1024
- var hoverField$4 = hoverUI$4;
1025
- var danger$4 = danger01$4;
1625
+ var background = uiBackground;
1626
+ var layer = ui01;
1627
+ var layerAccent = ui03;
1628
+ var field = field01;
1629
+ var backgroundInverse = inverse02;
1630
+ var backgroundBrand = interactive01;
1631
+ var interactive = interactive04;
1632
+ var borderSubtle = ui03;
1633
+ var borderStrong = ui04;
1634
+ var borderInverse = ui05;
1635
+ var borderInteractive = interactive04;
1636
+ var textPrimary = text01;
1637
+ var textSecondary = text02;
1638
+ var textPlaceholder = text03;
1639
+ var textHelper = text05;
1640
+ var textOnColor = text04;
1641
+ var textInverse = inverse01;
1642
+ var linkPrimary = link01;
1643
+ var linkSecondary = link02;
1644
+ var linkVisited = visitedLink;
1645
+ var linkInverse = inverseLink;
1646
+ var iconPrimary = icon01;
1647
+ var iconSecondary = icon02;
1648
+ var iconOnColor = icon03;
1649
+ var iconInverse = inverse01;
1650
+ var supportError = support01;
1651
+ var supportSuccess = support02;
1652
+ var supportWarning = support03;
1653
+ var supportInfo = support04;
1654
+ var supportErrorInverse = inverseSupport01;
1655
+ var supportSuccessInverse = inverseSupport02;
1656
+ var supportWarningInverse = inverseSupport03;
1657
+ var supportInfoInverse = inverseSupport04;
1658
+ var overlay = overlay01;
1659
+ var toggleOff = ui04;
1660
+ var buttonPrimary = interactive01;
1661
+ var buttonSecondary = interactive02;
1662
+ var buttonTertiary = interactive03;
1663
+ var buttonDangerPrimary = danger01;
1664
+ var buttonDangerSecondary = danger02;
1665
+ var backgroundActive = activeUI;
1666
+ var layerActive = activeUI;
1667
+ var buttonDangerActive = activeDanger;
1668
+ var buttonPrimaryActive = activePrimary;
1669
+ var buttonSecondaryActive = activeSecondary;
1670
+ var buttonTertiaryActive = activeTertiary;
1671
+ var focusInset = inverse01;
1672
+ var focusInverse = inverseFocusUi;
1673
+ var backgroundHover = hoverUI;
1674
+ var layerHover = hoverUI;
1675
+ var fieldHover = hoverUI;
1676
+ var backgroundInverseHover = inverseHoverUI;
1677
+ var linkPrimaryHover = hoverPrimaryText;
1678
+ var buttonDangerHover = hoverDanger;
1679
+ var buttonPrimaryHover = hoverPrimary;
1680
+ var buttonSecondaryHover = hoverSecondary;
1681
+ var buttonTertiaryHover = hoverTertiary;
1682
+ var backgroundSelected = selectedUI;
1683
+ var backgroundSelectedHover = hoverSelectedUI;
1684
+ var layerSelected = selectedUI;
1685
+ var layerSelectedHover = hoverSelectedUI;
1686
+ var layerSelectedInverse = ui05;
1687
+ var borderSubtleSelected = activeUI;
1688
+ var layerDisabled = disabled01;
1689
+ var fieldDisabled = disabled01;
1690
+ var borderDisabled = disabled01;
1691
+ var textDisabled = disabled02;
1692
+ var buttonDisabled = disabled02;
1693
+ var iconDisabled = disabled02;
1694
+ var textOnColorDisabled = disabled03;
1695
+ var iconOnColorDisabled = disabled03;
1696
+ var layerSelectedDisabled = disabled03;
1697
+ var skeletonBackground = skeleton01;
1698
+ var skeletonElement = skeleton02;
1699
+
1700
+ var brand01 = interactive01;
1701
+ var brand02 = interactive02;
1702
+ var brand03 = interactive03;
1703
+ var active01 = activeUI;
1704
+ var hoverField = hoverUI;
1705
+ var danger = danger01;
1026
1706
 
1027
1707
  var v9 = /*#__PURE__*/Object.freeze({
1028
1708
  __proto__: null,
1029
- interactive01: interactive01$4,
1030
- interactive02: interactive02$4,
1031
- interactive03: interactive03$4,
1032
- interactive04: interactive04$4,
1033
- uiBackground: uiBackground$4,
1034
- ui01: ui01$4,
1035
- ui02: ui02$4,
1036
- ui03: ui03$4,
1037
- ui04: ui04$4,
1038
- ui05: ui05$4,
1039
- text01: text01$4,
1040
- text02: text02$4,
1041
- text03: text03$4,
1042
- text04: text04$4,
1043
- text05: text05$4,
1044
- textError: textError$4,
1045
- icon01: icon01$4,
1046
- icon02: icon02$4,
1047
- icon03: icon03$4,
1048
- link01: link01$4,
1049
- link02: link02$4,
1050
- inverseLink: inverseLink$4,
1051
- field01: field01$4,
1052
- field02: field02$4,
1053
- inverse01: inverse01$4,
1054
- inverse02: inverse02$4,
1055
- support01: support01$4,
1056
- support02: support02$4,
1057
- support03: support03$4,
1058
- support04: support04$4,
1059
- inverseSupport01: inverseSupport01$4,
1060
- inverseSupport02: inverseSupport02$4,
1061
- inverseSupport03: inverseSupport03$4,
1062
- inverseSupport04: inverseSupport04$4,
1063
- overlay01: overlay01$4,
1064
- danger01: danger01$4,
1065
- danger02: danger02$4,
1066
- focus: focus$4,
1067
- inverseFocusUi: inverseFocusUi$4,
1068
- hoverPrimary: hoverPrimary$4,
1069
- activePrimary: activePrimary$4,
1070
- hoverPrimaryText: hoverPrimaryText$4,
1071
- hoverSecondary: hoverSecondary$4,
1072
- activeSecondary: activeSecondary$4,
1073
- hoverTertiary: hoverTertiary$4,
1074
- activeTertiary: activeTertiary$4,
1075
- hoverUI: hoverUI$4,
1076
- hoverLightUI: hoverLightUI$4,
1077
- activeUI: activeUI$4,
1078
- activeLightUI: activeLightUI$4,
1079
- selectedUI: selectedUI$4,
1080
- selectedLightUI: selectedLightUI$4,
1081
- inverseHoverUI: inverseHoverUI$4,
1082
- hoverSelectedUI: hoverSelectedUI$4,
1083
- hoverDanger: hoverDanger$4,
1084
- activeDanger: activeDanger$4,
1085
- hoverRow: hoverRow$4,
1086
- visitedLink: visitedLink$4,
1087
- disabled01: disabled01$4,
1088
- disabled02: disabled02$4,
1089
- disabled03: disabled03$4,
1090
- highlight: highlight$4,
1091
- decorative01: decorative01$4,
1092
- buttonSeparator: buttonSeparator$4,
1093
- skeleton01: skeleton01$4,
1094
- skeleton02: skeleton02$4,
1095
- brand01: brand01$4,
1096
- brand02: brand02$4,
1097
- brand03: brand03$4,
1098
- active01: active01$4,
1099
- hoverField: hoverField$4,
1100
- danger: danger$4,
1709
+ interactive01: interactive01,
1710
+ interactive02: interactive02,
1711
+ interactive03: interactive03,
1712
+ interactive04: interactive04,
1713
+ uiBackground: uiBackground,
1714
+ ui01: ui01,
1715
+ ui02: ui02,
1716
+ ui03: ui03,
1717
+ ui04: ui04,
1718
+ ui05: ui05,
1719
+ text01: text01,
1720
+ text02: text02,
1721
+ text03: text03,
1722
+ text04: text04,
1723
+ text05: text05,
1724
+ textError: textError,
1725
+ icon01: icon01,
1726
+ icon02: icon02,
1727
+ icon03: icon03,
1728
+ link01: link01,
1729
+ link02: link02,
1730
+ inverseLink: inverseLink,
1731
+ field01: field01,
1732
+ field02: field02,
1733
+ inverse01: inverse01,
1734
+ inverse02: inverse02,
1735
+ support01: support01,
1736
+ support02: support02,
1737
+ support03: support03,
1738
+ support04: support04,
1739
+ inverseSupport01: inverseSupport01,
1740
+ inverseSupport02: inverseSupport02,
1741
+ inverseSupport03: inverseSupport03,
1742
+ inverseSupport04: inverseSupport04,
1743
+ overlay01: overlay01,
1744
+ danger01: danger01,
1745
+ danger02: danger02,
1746
+ focus: focus,
1747
+ inverseFocusUi: inverseFocusUi,
1748
+ hoverPrimary: hoverPrimary,
1749
+ activePrimary: activePrimary,
1750
+ hoverPrimaryText: hoverPrimaryText,
1751
+ hoverSecondary: hoverSecondary,
1752
+ activeSecondary: activeSecondary,
1753
+ hoverTertiary: hoverTertiary,
1754
+ activeTertiary: activeTertiary,
1755
+ hoverUI: hoverUI,
1756
+ hoverLightUI: hoverLightUI,
1757
+ activeUI: activeUI,
1758
+ activeLightUI: activeLightUI,
1759
+ selectedUI: selectedUI,
1760
+ selectedLightUI: selectedLightUI,
1761
+ inverseHoverUI: inverseHoverUI,
1762
+ hoverSelectedUI: hoverSelectedUI,
1763
+ hoverDanger: hoverDanger,
1764
+ activeDanger: activeDanger,
1765
+ hoverRow: hoverRow,
1766
+ visitedLink: visitedLink,
1767
+ disabled01: disabled01,
1768
+ disabled02: disabled02,
1769
+ disabled03: disabled03,
1770
+ highlight: highlight,
1771
+ decorative01: decorative01,
1772
+ buttonSeparator: buttonSeparator,
1773
+ skeleton01: skeleton01,
1774
+ skeleton02: skeleton02,
1775
+ background: background,
1776
+ layer: layer,
1777
+ layerAccent: layerAccent,
1778
+ field: field,
1779
+ backgroundInverse: backgroundInverse,
1780
+ backgroundBrand: backgroundBrand,
1781
+ interactive: interactive,
1782
+ borderSubtle: borderSubtle,
1783
+ borderStrong: borderStrong,
1784
+ borderInverse: borderInverse,
1785
+ borderInteractive: borderInteractive,
1786
+ textPrimary: textPrimary,
1787
+ textSecondary: textSecondary,
1788
+ textPlaceholder: textPlaceholder,
1789
+ textHelper: textHelper,
1790
+ textOnColor: textOnColor,
1791
+ textInverse: textInverse,
1792
+ linkPrimary: linkPrimary,
1793
+ linkSecondary: linkSecondary,
1794
+ linkVisited: linkVisited,
1795
+ linkInverse: linkInverse,
1796
+ iconPrimary: iconPrimary,
1797
+ iconSecondary: iconSecondary,
1798
+ iconOnColor: iconOnColor,
1799
+ iconInverse: iconInverse,
1800
+ supportError: supportError,
1801
+ supportSuccess: supportSuccess,
1802
+ supportWarning: supportWarning,
1803
+ supportInfo: supportInfo,
1804
+ supportErrorInverse: supportErrorInverse,
1805
+ supportSuccessInverse: supportSuccessInverse,
1806
+ supportWarningInverse: supportWarningInverse,
1807
+ supportInfoInverse: supportInfoInverse,
1808
+ overlay: overlay,
1809
+ toggleOff: toggleOff,
1810
+ buttonPrimary: buttonPrimary,
1811
+ buttonSecondary: buttonSecondary,
1812
+ buttonTertiary: buttonTertiary,
1813
+ buttonDangerPrimary: buttonDangerPrimary,
1814
+ buttonDangerSecondary: buttonDangerSecondary,
1815
+ backgroundActive: backgroundActive,
1816
+ layerActive: layerActive,
1817
+ buttonDangerActive: buttonDangerActive,
1818
+ buttonPrimaryActive: buttonPrimaryActive,
1819
+ buttonSecondaryActive: buttonSecondaryActive,
1820
+ buttonTertiaryActive: buttonTertiaryActive,
1821
+ focusInset: focusInset,
1822
+ focusInverse: focusInverse,
1823
+ backgroundHover: backgroundHover,
1824
+ layerHover: layerHover,
1825
+ fieldHover: fieldHover,
1826
+ backgroundInverseHover: backgroundInverseHover,
1827
+ linkPrimaryHover: linkPrimaryHover,
1828
+ buttonDangerHover: buttonDangerHover,
1829
+ buttonPrimaryHover: buttonPrimaryHover,
1830
+ buttonSecondaryHover: buttonSecondaryHover,
1831
+ buttonTertiaryHover: buttonTertiaryHover,
1832
+ backgroundSelected: backgroundSelected,
1833
+ backgroundSelectedHover: backgroundSelectedHover,
1834
+ layerSelected: layerSelected,
1835
+ layerSelectedHover: layerSelectedHover,
1836
+ layerSelectedInverse: layerSelectedInverse,
1837
+ borderSubtleSelected: borderSubtleSelected,
1838
+ layerDisabled: layerDisabled,
1839
+ fieldDisabled: fieldDisabled,
1840
+ borderDisabled: borderDisabled,
1841
+ textDisabled: textDisabled,
1842
+ buttonDisabled: buttonDisabled,
1843
+ iconDisabled: iconDisabled,
1844
+ textOnColorDisabled: textOnColorDisabled,
1845
+ iconOnColorDisabled: iconOnColorDisabled,
1846
+ layerSelectedDisabled: layerSelectedDisabled,
1847
+ skeletonBackground: skeletonBackground,
1848
+ skeletonElement: skeletonElement,
1849
+ brand01: brand01,
1850
+ brand02: brand02,
1851
+ brand03: brand03,
1852
+ active01: active01,
1853
+ hoverField: hoverField,
1854
+ danger: danger,
1101
1855
  caption01: caption01,
1102
1856
  label01: label01,
1103
1857
  helperText01: helperText01,
@@ -1141,6 +1895,7 @@ var v9 = /*#__PURE__*/Object.freeze({
1141
1895
  spacing10: spacing10,
1142
1896
  spacing11: spacing11,
1143
1897
  spacing12: spacing12,
1898
+ spacing13: spacing13,
1144
1899
  fluidSpacing01: fluidSpacing01,
1145
1900
  fluidSpacing02: fluidSpacing02,
1146
1901
  fluidSpacing03: fluidSpacing03,
@@ -1171,7 +1926,9 @@ var v9 = /*#__PURE__*/Object.freeze({
1171
1926
 
1172
1927
  var colors = [// Core
1173
1928
  'interactive01', 'interactive02', 'interactive03', 'interactive04', 'uiBackground', 'ui01', 'ui02', 'ui03', 'ui04', 'ui05', 'text01', 'text02', 'text03', 'text04', 'text05', 'textError', 'icon01', 'icon02', 'icon03', 'link01', 'link02', 'inverseLink', 'field01', 'field02', 'inverse01', 'inverse02', 'support01', 'support02', 'support03', 'support04', 'inverseSupport01', 'inverseSupport02', 'inverseSupport03', 'inverseSupport04', 'overlay01', 'danger01', 'danger02', // Interactive states
1174
- 'focus', 'inverseFocusUi', 'hoverPrimary', 'activePrimary', 'hoverPrimaryText', 'hoverSecondary', 'activeSecondary', 'hoverTertiary', 'activeTertiary', 'hoverUI', 'hoverLightUI', 'hoverSelectedUI', 'activeUI', 'activeLightUI', 'selectedUI', 'selectedLightUI', 'inverseHoverUI', 'hoverDanger', 'activeDanger', 'hoverRow', 'visitedLink', 'disabled01', 'disabled02', 'disabled03', 'highlight', 'decorative01', 'buttonSeparator', 'skeleton01', 'skeleton02', // Deprecated
1929
+ 'focus', 'inverseFocusUi', 'hoverPrimary', 'activePrimary', 'hoverPrimaryText', 'hoverSecondary', 'activeSecondary', 'hoverTertiary', 'activeTertiary', 'hoverUI', 'hoverLightUI', 'hoverSelectedUI', 'activeUI', 'activeLightUI', 'selectedUI', 'selectedLightUI', 'inverseHoverUI', 'hoverDanger', 'activeDanger', 'hoverRow', 'visitedLink', 'disabled01', 'disabled02', 'disabled03', 'highlight', 'decorative01', 'buttonSeparator', 'skeleton01', 'skeleton02', // New color tokens
1930
+ // TO-DO: remove fallback color when v11 is released and assign carbon colors to new tokens
1931
+ 'background', 'layer', 'layerAccent', 'field', 'backgroundInverse', 'backgroundBrand', 'interactive', 'borderSubtle', 'borderStrong', 'borderInverse', 'borderInteractive', 'textPrimary', 'textSecondary', 'textPlaceholder', 'textHelper', 'textOnColor', 'textInverse', 'linkPrimary', 'linkSecondary', 'linkVisited', 'linkInverse', 'iconPrimary', 'iconSecondary', 'iconOnColor', 'iconInverse', 'supportError', 'supportSuccess', 'supportWarning', 'supportInfo', 'supportErrorInverse', 'supportSuccessInverse', 'supportWarningInverse', 'supportInfoInverse', 'overlay', 'toggleOff', 'buttonPrimary', 'buttonSecondary', 'buttonTertiary', 'buttonDangerPrimary', 'buttonDangerSecondary', 'backgroundActive', 'layerActive', 'buttonDangerActive', 'buttonPrimaryActive', 'buttonSecondaryActive', 'buttonTertiaryActive', 'focusInset', 'focusInverse', 'backgroundHover', 'layerHover', 'fieldHover', 'backgroundInverseHover', 'linkPrimaryHover', 'buttonDangerHover', 'buttonPrimaryHover', 'buttonSecondaryHover', 'buttonTertiaryHover', 'backgroundSelected', 'backgroundSelectedHover', 'layerSelected', 'layerSelectedHover', 'layerSelectedInverse', 'borderSubtleSelected', 'layerDisabled', 'fieldDisabled', 'borderDisabled', 'textDisabled', 'buttonDisabled', 'iconDisabled', 'textOnColorDisabled', 'iconOnColorDisabled', 'layerSelectedDisabled', 'skeletonBackground', 'skeletonElement', // Deprecated
1175
1932
  'brand01', 'brand02', 'brand03', 'active01', 'hoverField', 'danger'];
1176
1933
  var numbers = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'];
1177
1934
  /**
@@ -1220,10 +1977,12 @@ var tokens = {
1220
1977
  var unstable__meta = {
1221
1978
  colors: [{
1222
1979
  type: 'core',
1223
- tokens: ['uiBackground', 'interactive01', 'interactive02', 'interactive03', 'interactive04', 'brand01', 'brand02', 'brand03', 'danger', 'danger01', 'danger02', 'ui01', 'ui02', 'ui03', 'ui04', 'ui05', 'text01', 'text02', 'text03', 'text04', 'text05', 'textError', 'link01', 'link02', 'icon01', 'icon02', 'icon03', 'field01', 'field02', 'inverse01', 'inverse02', 'inverseLink', 'support01', 'support02', 'support03', 'support04', 'inverseSupport01', 'inverseSupport02', 'inverseSupport03', 'inverseSupport04', 'overlay01']
1980
+ tokens: ['uiBackground', 'interactive01', 'interactive02', 'interactive03', 'interactive04', 'brand01', 'brand02', 'brand03', 'danger', 'danger01', 'danger02', 'ui01', 'ui02', 'ui03', 'ui04', 'ui05', 'text01', 'text02', 'text03', 'text04', 'text05', 'textError', 'link01', 'link02', 'icon01', 'icon02', 'icon03', 'field01', 'field02', 'inverse01', 'inverse02', 'inverseLink', 'support01', 'support02', 'support03', 'support04', 'inverseSupport01', 'inverseSupport02', 'inverseSupport03', 'inverseSupport04', 'overlay01', //new tokens
1981
+ 'background', 'layer', 'layerAccent', 'field', 'backgroundInverse', 'backgroundBrand', 'interactive', 'borderSubtle', 'borderStrong', 'borderInverse', 'borderInteractive', 'textPrimary', 'textSecondary', 'textPlaceholder', 'textHelper', 'textOnColor', 'textInverse', 'linkPrimary', 'linkSecondary', 'linkVisited', 'linkInverse', 'iconPrimary', 'iconSecondary', 'iconOnColor', 'iconInverse', 'supportError', 'supportSuccess', 'supportWarning', 'supportInfo', 'supportErrorInverse', 'supportSuccessInverse', 'supportWarningInverse', 'supportInfoInverse', 'overlay', 'toggleOff', 'buttonPrimary', 'buttonSecondary', 'buttonTertiary', 'buttonDangerPrimary', 'buttonDangerSecondary']
1224
1982
  }, {
1225
1983
  type: 'interactive',
1226
- tokens: ['focus', 'inverseFocusUi', 'hoverPrimary', 'hoverPrimaryText', 'hoverSecondary', 'hoverTertiary', 'hoverUI', 'hoverLightUI', 'hoverSelectedUI', 'hoverDanger', 'hoverRow', 'activePrimary', 'activeSecondary', 'activeTertiary', 'activeUI', 'activeLightUI', 'activeDanger', 'selectedUI', 'selectedLightUI', 'highlight', 'skeleton01', 'skeleton02', 'visitedLink', 'disabled01', 'disabled02', 'disabled03', 'inverseHoverUI', 'active01', 'hoverField', 'decorative01', 'buttonSeparator']
1984
+ tokens: ['focus', 'inverseFocusUi', 'hoverPrimary', 'hoverPrimaryText', 'hoverSecondary', 'hoverTertiary', 'hoverUI', 'hoverLightUI', 'hoverSelectedUI', 'hoverDanger', 'hoverRow', 'activePrimary', 'activeSecondary', 'activeTertiary', 'activeUI', 'activeLightUI', 'activeDanger', 'selectedUI', 'selectedLightUI', 'highlight', 'skeleton01', 'skeleton02', 'visitedLink', 'disabled01', 'disabled02', 'disabled03', 'inverseHoverUI', 'active01', 'hoverField', 'decorative01', 'buttonSeparator', // new tokens
1985
+ 'backgroundActive', 'layerActive', 'buttonDangerActive', 'buttonPrimaryActive', 'buttonSecondaryActive', 'buttonTertiaryActive', 'focusInset', 'focusInverse', 'backgroundHover', 'layerHover', 'fieldHover', 'backgroundInverseHover', 'linkPrimaryHover', 'buttonDangerHover', 'buttonPrimaryHover', 'buttonSecondaryHover', 'buttonTertiaryHover', 'backgroundSelected', 'backgroundSelectedHover', 'layerSelected', 'layerSelectedHover', 'layerSelectedInverse', 'borderSubtleSelected', 'layerDisabled', 'fieldDisabled', 'borderDisabled', 'textDisabled', 'buttonDisabled', 'iconDisabled', 'textOnColorDisabled', 'iconOnColorDisabled', 'layerSelectedDisabled', 'skeletonBackground', 'skeletonElement']
1227
1986
  }],
1228
1987
  deprecated: ['brand01', 'brand02', 'brand03', 'active01', 'danger']
1229
1988
  };
@@ -1242,4 +2001,4 @@ var themes = {
1242
2001
  v9: v9
1243
2002
  };
1244
2003
 
1245
- export { active01, activeDanger, activeLightUI, activePrimary, activeSecondary, activeTertiary, activeUI, brand01, brand02, brand03, buttonSeparator, danger, danger01, danger02, decorative01, disabled01, disabled02, disabled03, field01, field02, focus, formatTokenName, g10, g100, g90, highlight, hoverDanger, hoverField, hoverLightUI, hoverPrimary, hoverPrimaryText, hoverRow, hoverSecondary, hoverSelectedUI, hoverTertiary, hoverUI, icon01, icon02, icon03, interactive01, interactive02, interactive03, interactive04, inverse01, inverse02, inverseFocusUi, inverseHoverUI, inverseLink, inverseSupport01, inverseSupport02, inverseSupport03, inverseSupport04, link01, link02, overlay01, selectedLightUI, selectedUI, skeleton01, skeleton02, support01, support02, support03, support04, text01, text02, text03, text04, text05, textError, themes, tokens, ui01, ui02, ui03, ui04, ui05, uiBackground, unstable__meta, v9, visitedLink, white };
2004
+ export { active01$4 as active01, activeDanger$4 as activeDanger, activeLightUI$4 as activeLightUI, activePrimary$4 as activePrimary, activeSecondary$4 as activeSecondary, activeTertiary$4 as activeTertiary, activeUI$4 as activeUI, background$4 as background, backgroundActive$4 as backgroundActive, backgroundBrand$4 as backgroundBrand, backgroundHover$4 as backgroundHover, backgroundInverse$4 as backgroundInverse, backgroundInverseHover$4 as backgroundInverseHover, backgroundSelected$4 as backgroundSelected, backgroundSelectedHover$4 as backgroundSelectedHover, borderDisabled$4 as borderDisabled, borderInteractive$4 as borderInteractive, borderInverse$4 as borderInverse, borderStrong$4 as borderStrong, borderSubtle$4 as borderSubtle, borderSubtleSelected$4 as borderSubtleSelected, brand01$4 as brand01, brand02$4 as brand02, brand03$4 as brand03, buttonDangerActive$4 as buttonDangerActive, buttonDangerHover$4 as buttonDangerHover, buttonDangerPrimary$4 as buttonDangerPrimary, buttonDangerSecondary$4 as buttonDangerSecondary, buttonDisabled$4 as buttonDisabled, buttonPrimary$4 as buttonPrimary, buttonPrimaryActive$4 as buttonPrimaryActive, buttonPrimaryHover$4 as buttonPrimaryHover, buttonSecondary$4 as buttonSecondary, buttonSecondaryActive$4 as buttonSecondaryActive, buttonSecondaryHover$4 as buttonSecondaryHover, buttonSeparator$4 as buttonSeparator, buttonTertiary$4 as buttonTertiary, buttonTertiaryActive$4 as buttonTertiaryActive, buttonTertiaryHover$4 as buttonTertiaryHover, danger$4 as danger, danger01$4 as danger01, danger02$4 as danger02, decorative01$4 as decorative01, disabled01$4 as disabled01, disabled02$4 as disabled02, disabled03$4 as disabled03, field$4 as field, field01$4 as field01, field02$4 as field02, fieldDisabled$4 as fieldDisabled, fieldHover$4 as fieldHover, focus$4 as focus, focusInset$4 as focusInset, focusInverse$4 as focusInverse, formatTokenName, g10, g100, g90, highlight$4 as highlight, hoverDanger$4 as hoverDanger, hoverField$4 as hoverField, hoverLightUI$4 as hoverLightUI, hoverPrimary$4 as hoverPrimary, hoverPrimaryText$4 as hoverPrimaryText, hoverRow$4 as hoverRow, hoverSecondary$4 as hoverSecondary, hoverSelectedUI$4 as hoverSelectedUI, hoverTertiary$4 as hoverTertiary, hoverUI$4 as hoverUI, icon01$4 as icon01, icon02$4 as icon02, icon03$4 as icon03, iconDisabled$4 as iconDisabled, iconInverse$4 as iconInverse, iconOnColor$4 as iconOnColor, iconOnColorDisabled$4 as iconOnColorDisabled, iconPrimary$4 as iconPrimary, iconSecondary$4 as iconSecondary, interactive$4 as interactive, interactive01$4 as interactive01, interactive02$4 as interactive02, interactive03$4 as interactive03, interactive04$4 as interactive04, inverse01$4 as inverse01, inverse02$4 as inverse02, inverseFocusUi$4 as inverseFocusUi, inverseHoverUI$4 as inverseHoverUI, inverseLink$4 as inverseLink, inverseSupport01$4 as inverseSupport01, inverseSupport02$4 as inverseSupport02, inverseSupport03$4 as inverseSupport03, inverseSupport04$4 as inverseSupport04, layer$4 as layer, layerAccent$4 as layerAccent, layerActive$4 as layerActive, layerDisabled$4 as layerDisabled, layerHover$4 as layerHover, layerSelected$4 as layerSelected, layerSelectedDisabled$4 as layerSelectedDisabled, layerSelectedHover$4 as layerSelectedHover, layerSelectedInverse$4 as layerSelectedInverse, link01$4 as link01, link02$4 as link02, linkInverse$4 as linkInverse, linkPrimary$4 as linkPrimary, linkPrimaryHover$4 as linkPrimaryHover, linkSecondary$4 as linkSecondary, linkVisited$4 as linkVisited, overlay$4 as overlay, overlay01$4 as overlay01, selectedLightUI$4 as selectedLightUI, selectedUI$4 as selectedUI, skeleton01$4 as skeleton01, skeleton02$4 as skeleton02, skeletonBackground$4 as skeletonBackground, skeletonElement$4 as skeletonElement, support01$4 as support01, support02$4 as support02, support03$4 as support03, support04$4 as support04, supportError$4 as supportError, supportErrorInverse$4 as supportErrorInverse, supportInfo$4 as supportInfo, supportInfoInverse$4 as supportInfoInverse, supportSuccess$4 as supportSuccess, supportSuccessInverse$4 as supportSuccessInverse, supportWarning$4 as supportWarning, supportWarningInverse$4 as supportWarningInverse, text01$4 as text01, text02$4 as text02, text03$4 as text03, text04$4 as text04, text05$4 as text05, textDisabled$4 as textDisabled, textError$4 as textError, textHelper$4 as textHelper, textInverse$4 as textInverse, textOnColor$4 as textOnColor, textOnColorDisabled$4 as textOnColorDisabled, textPlaceholder$4 as textPlaceholder, textPrimary$4 as textPrimary, textSecondary$4 as textSecondary, themes, toggleOff$4 as toggleOff, tokens, ui01$4 as ui01, ui02$4 as ui02, ui03$4 as ui03, ui04$4 as ui04, ui05$4 as ui05, uiBackground$4 as uiBackground, unstable__meta, v9, visitedLink$4 as visitedLink, white };