@carbon/themes 10.34.0-rc.0 → 10.36.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.
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, gray90, red40, blue30, purple40, red30, yellow30 } from '@carbon/colors';
2
+ import { blue60, gray80, white as white$1, gray10, gray20, gray50, gray100, gray70, gray40, gray60, red60, blue70, blue40, green60, yellow, red50, green40, blue50, rgba, blue80, gray30, red80, purple60, blue20, gray90, red40, blue30, green50, purple40, red30, yellow30 } from '@carbon/colors';
3
3
  import { caption01, caption02, label01, label02, helperText01, helperText02, 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, caption02, code01, code02, display01, display02, display03, display04, expressiveHeading01, expressiveHeading02, expressiveHeading03, expressiveHeading04, expressiveHeading05, expressiveHeading06, expressiveParagraph01, heading01, heading02, helperText01, helperText02, label01, label02, 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, 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';
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, sizeXSmall, sizeSmall, sizeMedium, sizeLarge, sizeXLarge, size2XLarge, 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, size2XLarge, sizeLarge, sizeMedium, sizeSmall, sizeXLarge, sizeXSmall, spacing01, spacing02, spacing03, spacing04, spacing05, spacing06, spacing07, spacing08, spacing09, spacing10, spacing11, spacing12, spacing13 } from '@carbon/layout';
7
7
 
8
8
  function ownKeys(object, enumerableOnly) {
9
9
  var keys = Object.keys(object);
@@ -108,7 +108,7 @@ var field02$5 = white$1;
108
108
  var inverse01$5 = white$1;
109
109
  var inverse02$5 = gray80;
110
110
  var support01$5 = red60;
111
- var support02$5 = green50;
111
+ var support02$5 = green60;
112
112
  var support03$5 = yellow;
113
113
  var support04$5 = blue70;
114
114
  var inverseSupport01$5 = red50;
@@ -153,6 +153,8 @@ var skeleton02$5 = gray30; // New color tokens
153
153
  var background$5 = uiBackground$5;
154
154
  var layer$5 = ui01$5;
155
155
  var layerAccent$5 = ui03$5;
156
+ var layerAccentActive$5 = gray40;
157
+ var layerAccentHover$5 = adjustLightness(layerAccent$5, -6);
156
158
  var field$5 = field01$5;
157
159
  var backgroundInverse$5 = inverse02$5;
158
160
  var backgroundBrand$5 = interactive01$5;
@@ -303,6 +305,8 @@ var white = /*#__PURE__*/Object.freeze({
303
305
  background: background$5,
304
306
  layer: layer$5,
305
307
  layerAccent: layerAccent$5,
308
+ layerAccentActive: layerAccentActive$5,
309
+ layerAccentHover: layerAccentHover$5,
306
310
  field: field$5,
307
311
  backgroundInverse: backgroundInverse$5,
308
312
  backgroundBrand: backgroundBrand$5,
@@ -443,6 +447,12 @@ var white = /*#__PURE__*/Object.freeze({
443
447
  container03: container03,
444
448
  container04: container04,
445
449
  container05: container05,
450
+ sizeXSmall: sizeXSmall,
451
+ sizeSmall: sizeSmall,
452
+ sizeMedium: sizeMedium,
453
+ sizeLarge: sizeLarge,
454
+ sizeXLarge: sizeXLarge,
455
+ size2XLarge: size2XLarge,
446
456
  iconSize01: iconSize01,
447
457
  iconSize02: iconSize02
448
458
  });
@@ -480,7 +490,7 @@ var field02$4 = gray10;
480
490
  var inverse01$4 = white$1;
481
491
  var inverse02$4 = gray80;
482
492
  var support01$4 = red60;
483
- var support02$4 = green50;
493
+ var support02$4 = green60;
484
494
  var support03$4 = yellow;
485
495
  var support04$4 = blue70;
486
496
  var inverseSupport01$4 = red50;
@@ -525,6 +535,8 @@ var skeleton02$4 = gray30; // New color tokens
525
535
  var background$4 = uiBackground$4;
526
536
  var layer$4 = ui01$4;
527
537
  var layerAccent$4 = ui03$4;
538
+ var layerAccentActive$4 = gray40;
539
+ var layerAccentHover$4 = adjustLightness(layerAccent$4, -6);
528
540
  var field$4 = field01$4;
529
541
  var backgroundInverse$4 = inverse02$4;
530
542
  var backgroundBrand$4 = interactive01$4;
@@ -675,6 +687,8 @@ var g10 = /*#__PURE__*/Object.freeze({
675
687
  background: background$4,
676
688
  layer: layer$4,
677
689
  layerAccent: layerAccent$4,
690
+ layerAccentActive: layerAccentActive$4,
691
+ layerAccentHover: layerAccentHover$4,
678
692
  field: field$4,
679
693
  backgroundInverse: backgroundInverse$4,
680
694
  backgroundBrand: backgroundBrand$4,
@@ -815,6 +829,12 @@ var g10 = /*#__PURE__*/Object.freeze({
815
829
  container03: container03,
816
830
  container04: container04,
817
831
  container05: container05,
832
+ sizeXSmall: sizeXSmall,
833
+ sizeSmall: sizeSmall,
834
+ sizeMedium: sizeMedium,
835
+ sizeLarge: sizeLarge,
836
+ sizeXLarge: sizeXLarge,
837
+ size2XLarge: size2XLarge,
818
838
  iconSize01: iconSize01,
819
839
  iconSize02: iconSize02
820
840
  });
@@ -897,6 +917,8 @@ var skeleton02$3 = gray70; // New color tokens
897
917
  var background$3 = uiBackground$3;
898
918
  var layer$3 = ui01$3;
899
919
  var layerAccent$3 = ui03$3;
920
+ var layerAccentActive$3 = gray60;
921
+ var layerAccentHover$3 = adjustLightness(layerAccent$3, +6);
900
922
  var field$3 = field01$3;
901
923
  var backgroundInverse$3 = inverse02$3;
902
924
  var backgroundBrand$3 = interactive01$3;
@@ -1047,6 +1069,8 @@ var g100 = /*#__PURE__*/Object.freeze({
1047
1069
  background: background$3,
1048
1070
  layer: layer$3,
1049
1071
  layerAccent: layerAccent$3,
1072
+ layerAccentActive: layerAccentActive$3,
1073
+ layerAccentHover: layerAccentHover$3,
1050
1074
  field: field$3,
1051
1075
  backgroundInverse: backgroundInverse$3,
1052
1076
  backgroundBrand: backgroundBrand$3,
@@ -1187,6 +1211,12 @@ var g100 = /*#__PURE__*/Object.freeze({
1187
1211
  container03: container03,
1188
1212
  container04: container04,
1189
1213
  container05: container05,
1214
+ sizeXSmall: sizeXSmall,
1215
+ sizeSmall: sizeSmall,
1216
+ sizeMedium: sizeMedium,
1217
+ sizeLarge: sizeLarge,
1218
+ sizeXLarge: sizeXLarge,
1219
+ size2XLarge: size2XLarge,
1190
1220
  iconSize01: iconSize01,
1191
1221
  iconSize02: iconSize02
1192
1222
  });
@@ -1202,6 +1232,8 @@ var g100 = /*#__PURE__*/Object.freeze({
1202
1232
  var background$2 = gray80;
1203
1233
  var layer$2 = gray70;
1204
1234
  var layerAccent$2 = gray60;
1235
+ var layerAccentActive$2 = gray70;
1236
+ var layerAccentHover$2 = adjustLightness(layerAccent$2, -7);
1205
1237
  var field$2 = gray70;
1206
1238
  var backgroundInverse$2 = gray10;
1207
1239
  var backgroundBrand$2 = blue60;
@@ -1356,6 +1388,8 @@ var g80 = /*#__PURE__*/Object.freeze({
1356
1388
  background: background$2,
1357
1389
  layer: layer$2,
1358
1390
  layerAccent: layerAccent$2,
1391
+ layerAccentActive: layerAccentActive$2,
1392
+ layerAccentHover: layerAccentHover$2,
1359
1393
  field: field$2,
1360
1394
  backgroundInverse: backgroundInverse$2,
1361
1395
  backgroundBrand: backgroundBrand$2,
@@ -1562,6 +1596,12 @@ var g80 = /*#__PURE__*/Object.freeze({
1562
1596
  container03: container03,
1563
1597
  container04: container04,
1564
1598
  container05: container05,
1599
+ sizeXSmall: sizeXSmall,
1600
+ sizeSmall: sizeSmall,
1601
+ sizeMedium: sizeMedium,
1602
+ sizeLarge: sizeLarge,
1603
+ sizeXLarge: sizeXLarge,
1604
+ size2XLarge: size2XLarge,
1565
1605
  iconSize01: iconSize01,
1566
1606
  iconSize02: iconSize02
1567
1607
  });
@@ -1644,6 +1684,8 @@ var skeleton02$1 = gray70; // New color tokens
1644
1684
  var background$1 = uiBackground$1;
1645
1685
  var layer$1 = ui01$1;
1646
1686
  var layerAccent$1 = ui03$1;
1687
+ var layerAccentActive$1 = gray50;
1688
+ var layerAccentHover$1 = adjustLightness(layerAccent$1, +7);
1647
1689
  var field$1 = field01$1;
1648
1690
  var backgroundInverse$1 = inverse02$1;
1649
1691
  var backgroundBrand$1 = interactive01$1;
@@ -1794,6 +1836,8 @@ var g90 = /*#__PURE__*/Object.freeze({
1794
1836
  background: background$1,
1795
1837
  layer: layer$1,
1796
1838
  layerAccent: layerAccent$1,
1839
+ layerAccentActive: layerAccentActive$1,
1840
+ layerAccentHover: layerAccentHover$1,
1797
1841
  field: field$1,
1798
1842
  backgroundInverse: backgroundInverse$1,
1799
1843
  backgroundBrand: backgroundBrand$1,
@@ -1934,6 +1978,12 @@ var g90 = /*#__PURE__*/Object.freeze({
1934
1978
  container03: container03,
1935
1979
  container04: container04,
1936
1980
  container05: container05,
1981
+ sizeXSmall: sizeXSmall,
1982
+ sizeSmall: sizeSmall,
1983
+ sizeMedium: sizeMedium,
1984
+ sizeLarge: sizeLarge,
1985
+ sizeXLarge: sizeXLarge,
1986
+ size2XLarge: size2XLarge,
1937
1987
  iconSize01: iconSize01,
1938
1988
  iconSize02: iconSize02
1939
1989
  });
@@ -2016,6 +2066,8 @@ var skeleton02 = 'rgba(61, 112, 178, .1)'; // New color tokens
2016
2066
  var background = uiBackground;
2017
2067
  var layer = ui01;
2018
2068
  var layerAccent = ui03;
2069
+ var layerAccentActive = gray40;
2070
+ var layerAccentHover = adjustLightness(layerAccent, -6);
2019
2071
  var field = field01;
2020
2072
  var backgroundInverse = inverse02;
2021
2073
  var backgroundBrand = interactive01;
@@ -2166,6 +2218,8 @@ var v9 = /*#__PURE__*/Object.freeze({
2166
2218
  background: background,
2167
2219
  layer: layer,
2168
2220
  layerAccent: layerAccent,
2221
+ layerAccentActive: layerAccentActive,
2222
+ layerAccentHover: layerAccentHover,
2169
2223
  field: field,
2170
2224
  backgroundInverse: backgroundInverse,
2171
2225
  backgroundBrand: backgroundBrand,
@@ -2306,6 +2360,12 @@ var v9 = /*#__PURE__*/Object.freeze({
2306
2360
  container03: container03,
2307
2361
  container04: container04,
2308
2362
  container05: container05,
2363
+ sizeXSmall: sizeXSmall,
2364
+ sizeSmall: sizeSmall,
2365
+ sizeMedium: sizeMedium,
2366
+ sizeLarge: sizeLarge,
2367
+ sizeXLarge: sizeXLarge,
2368
+ size2XLarge: size2XLarge,
2309
2369
  iconSize01: iconSize01,
2310
2370
  iconSize02: iconSize02
2311
2371
  });
@@ -2322,7 +2382,7 @@ var colors = [// Core
2322
2382
  '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
2323
2383
  '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
2324
2384
  // TO-DO: remove fallback color when v11 is released and assign carbon colors to new tokens
2325
- '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
2385
+ 'background', 'layer', 'layerAccent', 'layerAccentHover', 'layerAccentActive', '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
2326
2386
  'brand01', 'brand02', 'brand03', 'active01', 'hoverField', 'danger'];
2327
2387
  var numbers = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'];
2328
2388
  /**
@@ -2372,7 +2432,7 @@ var unstable__meta = {
2372
2432
  colors: [{
2373
2433
  type: 'core',
2374
2434
  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
2375
- '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']
2435
+ 'background', 'layer', 'layerAccent', 'layerAccentHover', 'layerAccentActive', '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']
2376
2436
  }, {
2377
2437
  type: 'interactive',
2378
2438
  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
@@ -2396,4 +2456,4 @@ var themes = {
2396
2456
  v9: v9
2397
2457
  };
2398
2458
 
2399
- export { active01$5 as active01, activeDanger$5 as activeDanger, activeLightUI$5 as activeLightUI, activePrimary$5 as activePrimary, activeSecondary$5 as activeSecondary, activeTertiary$5 as activeTertiary, activeUI$5 as activeUI, background$5 as background, backgroundActive$5 as backgroundActive, backgroundBrand$5 as backgroundBrand, backgroundHover$5 as backgroundHover, backgroundInverse$5 as backgroundInverse, backgroundInverseHover$5 as backgroundInverseHover, backgroundSelected$5 as backgroundSelected, backgroundSelectedHover$5 as backgroundSelectedHover, borderDisabled$5 as borderDisabled, borderInteractive$5 as borderInteractive, borderInverse$5 as borderInverse, borderStrong$5 as borderStrong, borderSubtle$5 as borderSubtle, borderSubtleSelected$5 as borderSubtleSelected, brand01$5 as brand01, brand02$5 as brand02, brand03$5 as brand03, buttonDangerActive$5 as buttonDangerActive, buttonDangerHover$5 as buttonDangerHover, buttonDangerPrimary$5 as buttonDangerPrimary, buttonDangerSecondary$5 as buttonDangerSecondary, buttonDisabled$5 as buttonDisabled, buttonPrimary$5 as buttonPrimary, buttonPrimaryActive$5 as buttonPrimaryActive, buttonPrimaryHover$5 as buttonPrimaryHover, buttonSecondary$5 as buttonSecondary, buttonSecondaryActive$5 as buttonSecondaryActive, buttonSecondaryHover$5 as buttonSecondaryHover, buttonSeparator$5 as buttonSeparator, buttonTertiary$5 as buttonTertiary, buttonTertiaryActive$5 as buttonTertiaryActive, buttonTertiaryHover$5 as buttonTertiaryHover, danger$5 as danger, danger01$5 as danger01, danger02$5 as danger02, decorative01$5 as decorative01, disabled01$5 as disabled01, disabled02$5 as disabled02, disabled03$5 as disabled03, field$5 as field, field01$5 as field01, field02$5 as field02, fieldDisabled$5 as fieldDisabled, fieldHover$5 as fieldHover, focus$5 as focus, focusInset$5 as focusInset, focusInverse$5 as focusInverse, formatTokenName, g10, g100, g80, g90, highlight$5 as highlight, hoverDanger$5 as hoverDanger, hoverField$5 as hoverField, hoverLightUI$5 as hoverLightUI, hoverPrimary$5 as hoverPrimary, hoverPrimaryText$5 as hoverPrimaryText, hoverRow$5 as hoverRow, hoverSecondary$5 as hoverSecondary, hoverSelectedUI$5 as hoverSelectedUI, hoverTertiary$5 as hoverTertiary, hoverUI$5 as hoverUI, icon01$5 as icon01, icon02$5 as icon02, icon03$5 as icon03, iconDisabled$5 as iconDisabled, iconInverse$5 as iconInverse, iconOnColor$5 as iconOnColor, iconOnColorDisabled$5 as iconOnColorDisabled, iconPrimary$5 as iconPrimary, iconSecondary$5 as iconSecondary, interactive$5 as interactive, interactive01$5 as interactive01, interactive02$5 as interactive02, interactive03$5 as interactive03, interactive04$5 as interactive04, inverse01$5 as inverse01, inverse02$5 as inverse02, inverseFocusUi$5 as inverseFocusUi, inverseHoverUI$5 as inverseHoverUI, inverseLink$5 as inverseLink, inverseSupport01$5 as inverseSupport01, inverseSupport02$5 as inverseSupport02, inverseSupport03$5 as inverseSupport03, inverseSupport04$5 as inverseSupport04, layer$5 as layer, layerAccent$5 as layerAccent, layerActive$5 as layerActive, layerDisabled$5 as layerDisabled, layerHover$5 as layerHover, layerSelected$5 as layerSelected, layerSelectedDisabled$5 as layerSelectedDisabled, layerSelectedHover$5 as layerSelectedHover, layerSelectedInverse$5 as layerSelectedInverse, link01$5 as link01, link02$5 as link02, linkInverse$5 as linkInverse, linkPrimary$5 as linkPrimary, linkPrimaryHover$5 as linkPrimaryHover, linkSecondary$5 as linkSecondary, linkVisited$5 as linkVisited, overlay$5 as overlay, overlay01$5 as overlay01, selectedLightUI$5 as selectedLightUI, selectedUI$5 as selectedUI, skeleton01$5 as skeleton01, skeleton02$5 as skeleton02, skeletonBackground$5 as skeletonBackground, skeletonElement$5 as skeletonElement, support01$5 as support01, support02$5 as support02, support03$5 as support03, support04$5 as support04, supportError$5 as supportError, supportErrorInverse$5 as supportErrorInverse, supportInfo$5 as supportInfo, supportInfoInverse$5 as supportInfoInverse, supportSuccess$5 as supportSuccess, supportSuccessInverse$5 as supportSuccessInverse, supportWarning$5 as supportWarning, supportWarningInverse$5 as supportWarningInverse, text01$5 as text01, text02$5 as text02, text03$5 as text03, text04$5 as text04, text05$5 as text05, textDisabled$5 as textDisabled, textError$5 as textError, textHelper$5 as textHelper, textInverse$5 as textInverse, textOnColor$5 as textOnColor, textOnColorDisabled$5 as textOnColorDisabled, textPlaceholder$5 as textPlaceholder, textPrimary$5 as textPrimary, textSecondary$5 as textSecondary, themes, toggleOff$5 as toggleOff, tokens, ui01$5 as ui01, ui02$5 as ui02, ui03$5 as ui03, ui04$5 as ui04, ui05$5 as ui05, uiBackground$5 as uiBackground, unstable__meta, v9, visitedLink$5 as visitedLink, white };
2459
+ export { active01$5 as active01, activeDanger$5 as activeDanger, activeLightUI$5 as activeLightUI, activePrimary$5 as activePrimary, activeSecondary$5 as activeSecondary, activeTertiary$5 as activeTertiary, activeUI$5 as activeUI, background$5 as background, backgroundActive$5 as backgroundActive, backgroundBrand$5 as backgroundBrand, backgroundHover$5 as backgroundHover, backgroundInverse$5 as backgroundInverse, backgroundInverseHover$5 as backgroundInverseHover, backgroundSelected$5 as backgroundSelected, backgroundSelectedHover$5 as backgroundSelectedHover, borderDisabled$5 as borderDisabled, borderInteractive$5 as borderInteractive, borderInverse$5 as borderInverse, borderStrong$5 as borderStrong, borderSubtle$5 as borderSubtle, borderSubtleSelected$5 as borderSubtleSelected, brand01$5 as brand01, brand02$5 as brand02, brand03$5 as brand03, buttonDangerActive$5 as buttonDangerActive, buttonDangerHover$5 as buttonDangerHover, buttonDangerPrimary$5 as buttonDangerPrimary, buttonDangerSecondary$5 as buttonDangerSecondary, buttonDisabled$5 as buttonDisabled, buttonPrimary$5 as buttonPrimary, buttonPrimaryActive$5 as buttonPrimaryActive, buttonPrimaryHover$5 as buttonPrimaryHover, buttonSecondary$5 as buttonSecondary, buttonSecondaryActive$5 as buttonSecondaryActive, buttonSecondaryHover$5 as buttonSecondaryHover, buttonSeparator$5 as buttonSeparator, buttonTertiary$5 as buttonTertiary, buttonTertiaryActive$5 as buttonTertiaryActive, buttonTertiaryHover$5 as buttonTertiaryHover, danger$5 as danger, danger01$5 as danger01, danger02$5 as danger02, decorative01$5 as decorative01, disabled01$5 as disabled01, disabled02$5 as disabled02, disabled03$5 as disabled03, field$5 as field, field01$5 as field01, field02$5 as field02, fieldDisabled$5 as fieldDisabled, fieldHover$5 as fieldHover, focus$5 as focus, focusInset$5 as focusInset, focusInverse$5 as focusInverse, formatTokenName, g10, g100, g80, g90, highlight$5 as highlight, hoverDanger$5 as hoverDanger, hoverField$5 as hoverField, hoverLightUI$5 as hoverLightUI, hoverPrimary$5 as hoverPrimary, hoverPrimaryText$5 as hoverPrimaryText, hoverRow$5 as hoverRow, hoverSecondary$5 as hoverSecondary, hoverSelectedUI$5 as hoverSelectedUI, hoverTertiary$5 as hoverTertiary, hoverUI$5 as hoverUI, icon01$5 as icon01, icon02$5 as icon02, icon03$5 as icon03, iconDisabled$5 as iconDisabled, iconInverse$5 as iconInverse, iconOnColor$5 as iconOnColor, iconOnColorDisabled$5 as iconOnColorDisabled, iconPrimary$5 as iconPrimary, iconSecondary$5 as iconSecondary, interactive$5 as interactive, interactive01$5 as interactive01, interactive02$5 as interactive02, interactive03$5 as interactive03, interactive04$5 as interactive04, inverse01$5 as inverse01, inverse02$5 as inverse02, inverseFocusUi$5 as inverseFocusUi, inverseHoverUI$5 as inverseHoverUI, inverseLink$5 as inverseLink, inverseSupport01$5 as inverseSupport01, inverseSupport02$5 as inverseSupport02, inverseSupport03$5 as inverseSupport03, inverseSupport04$5 as inverseSupport04, layer$5 as layer, layerAccent$5 as layerAccent, layerAccentActive$5 as layerAccentActive, layerAccentHover$5 as layerAccentHover, layerActive$5 as layerActive, layerDisabled$5 as layerDisabled, layerHover$5 as layerHover, layerSelected$5 as layerSelected, layerSelectedDisabled$5 as layerSelectedDisabled, layerSelectedHover$5 as layerSelectedHover, layerSelectedInverse$5 as layerSelectedInverse, link01$5 as link01, link02$5 as link02, linkInverse$5 as linkInverse, linkPrimary$5 as linkPrimary, linkPrimaryHover$5 as linkPrimaryHover, linkSecondary$5 as linkSecondary, linkVisited$5 as linkVisited, overlay$5 as overlay, overlay01$5 as overlay01, selectedLightUI$5 as selectedLightUI, selectedUI$5 as selectedUI, skeleton01$5 as skeleton01, skeleton02$5 as skeleton02, skeletonBackground$5 as skeletonBackground, skeletonElement$5 as skeletonElement, support01$5 as support01, support02$5 as support02, support03$5 as support03, support04$5 as support04, supportError$5 as supportError, supportErrorInverse$5 as supportErrorInverse, supportInfo$5 as supportInfo, supportInfoInverse$5 as supportInfoInverse, supportSuccess$5 as supportSuccess, supportSuccessInverse$5 as supportSuccessInverse, supportWarning$5 as supportWarning, supportWarningInverse$5 as supportWarningInverse, text01$5 as text01, text02$5 as text02, text03$5 as text03, text04$5 as text04, text05$5 as text05, textDisabled$5 as textDisabled, textError$5 as textError, textHelper$5 as textHelper, textInverse$5 as textInverse, textOnColor$5 as textOnColor, textOnColorDisabled$5 as textOnColorDisabled, textPlaceholder$5 as textPlaceholder, textPrimary$5 as textPrimary, textSecondary$5 as textSecondary, themes, toggleOff$5 as toggleOff, tokens, ui01$5 as ui01, ui02$5 as ui02, ui03$5 as ui03, ui04$5 as ui04, ui05$5 as ui05, uiBackground$5 as uiBackground, unstable__meta, v9, visitedLink$5 as visitedLink, white };
package/index.scss CHANGED
@@ -7,3 +7,4 @@
7
7
 
8
8
  @forward 'scss/modules/themes';
9
9
  @forward 'scss/modules/theme';
10
+ @forward 'scss/modules/tokens';
package/lib/index.js CHANGED
@@ -114,7 +114,7 @@ var field02$5 = colors$1.white;
114
114
  var inverse01$5 = colors$1.white;
115
115
  var inverse02$5 = colors$1.gray80;
116
116
  var support01$5 = colors$1.red60;
117
- var support02$5 = colors$1.green50;
117
+ var support02$5 = colors$1.green60;
118
118
  var support03$5 = colors$1.yellow;
119
119
  var support04$5 = colors$1.blue70;
120
120
  var inverseSupport01$5 = colors$1.red50;
@@ -159,6 +159,8 @@ var skeleton02$5 = colors$1.gray30; // New color tokens
159
159
  var background$5 = uiBackground$5;
160
160
  var layer$5 = ui01$5;
161
161
  var layerAccent$5 = ui03$5;
162
+ var layerAccentActive$5 = colors$1.gray40;
163
+ var layerAccentHover$5 = adjustLightness(layerAccent$5, -6);
162
164
  var field$5 = field01$5;
163
165
  var backgroundInverse$5 = inverse02$5;
164
166
  var backgroundBrand$5 = interactive01$5;
@@ -309,6 +311,8 @@ var white = /*#__PURE__*/Object.freeze({
309
311
  background: background$5,
310
312
  layer: layer$5,
311
313
  layerAccent: layerAccent$5,
314
+ layerAccentActive: layerAccentActive$5,
315
+ layerAccentHover: layerAccentHover$5,
312
316
  field: field$5,
313
317
  backgroundInverse: backgroundInverse$5,
314
318
  backgroundBrand: backgroundBrand$5,
@@ -449,6 +453,12 @@ var white = /*#__PURE__*/Object.freeze({
449
453
  container03: layout.container03,
450
454
  container04: layout.container04,
451
455
  container05: layout.container05,
456
+ sizeXSmall: layout.sizeXSmall,
457
+ sizeSmall: layout.sizeSmall,
458
+ sizeMedium: layout.sizeMedium,
459
+ sizeLarge: layout.sizeLarge,
460
+ sizeXLarge: layout.sizeXLarge,
461
+ size2XLarge: layout.size2XLarge,
452
462
  iconSize01: layout.iconSize01,
453
463
  iconSize02: layout.iconSize02
454
464
  });
@@ -486,7 +496,7 @@ var field02$4 = colors$1.gray10;
486
496
  var inverse01$4 = colors$1.white;
487
497
  var inverse02$4 = colors$1.gray80;
488
498
  var support01$4 = colors$1.red60;
489
- var support02$4 = colors$1.green50;
499
+ var support02$4 = colors$1.green60;
490
500
  var support03$4 = colors$1.yellow;
491
501
  var support04$4 = colors$1.blue70;
492
502
  var inverseSupport01$4 = colors$1.red50;
@@ -531,6 +541,8 @@ var skeleton02$4 = colors$1.gray30; // New color tokens
531
541
  var background$4 = uiBackground$4;
532
542
  var layer$4 = ui01$4;
533
543
  var layerAccent$4 = ui03$4;
544
+ var layerAccentActive$4 = colors$1.gray40;
545
+ var layerAccentHover$4 = adjustLightness(layerAccent$4, -6);
534
546
  var field$4 = field01$4;
535
547
  var backgroundInverse$4 = inverse02$4;
536
548
  var backgroundBrand$4 = interactive01$4;
@@ -681,6 +693,8 @@ var g10 = /*#__PURE__*/Object.freeze({
681
693
  background: background$4,
682
694
  layer: layer$4,
683
695
  layerAccent: layerAccent$4,
696
+ layerAccentActive: layerAccentActive$4,
697
+ layerAccentHover: layerAccentHover$4,
684
698
  field: field$4,
685
699
  backgroundInverse: backgroundInverse$4,
686
700
  backgroundBrand: backgroundBrand$4,
@@ -821,6 +835,12 @@ var g10 = /*#__PURE__*/Object.freeze({
821
835
  container03: layout.container03,
822
836
  container04: layout.container04,
823
837
  container05: layout.container05,
838
+ sizeXSmall: layout.sizeXSmall,
839
+ sizeSmall: layout.sizeSmall,
840
+ sizeMedium: layout.sizeMedium,
841
+ sizeLarge: layout.sizeLarge,
842
+ sizeXLarge: layout.sizeXLarge,
843
+ size2XLarge: layout.size2XLarge,
824
844
  iconSize01: layout.iconSize01,
825
845
  iconSize02: layout.iconSize02
826
846
  });
@@ -903,6 +923,8 @@ var skeleton02$3 = colors$1.gray70; // New color tokens
903
923
  var background$3 = uiBackground$3;
904
924
  var layer$3 = ui01$3;
905
925
  var layerAccent$3 = ui03$3;
926
+ var layerAccentActive$3 = colors$1.gray60;
927
+ var layerAccentHover$3 = adjustLightness(layerAccent$3, +6);
906
928
  var field$3 = field01$3;
907
929
  var backgroundInverse$3 = inverse02$3;
908
930
  var backgroundBrand$3 = interactive01$3;
@@ -1053,6 +1075,8 @@ var g100 = /*#__PURE__*/Object.freeze({
1053
1075
  background: background$3,
1054
1076
  layer: layer$3,
1055
1077
  layerAccent: layerAccent$3,
1078
+ layerAccentActive: layerAccentActive$3,
1079
+ layerAccentHover: layerAccentHover$3,
1056
1080
  field: field$3,
1057
1081
  backgroundInverse: backgroundInverse$3,
1058
1082
  backgroundBrand: backgroundBrand$3,
@@ -1193,6 +1217,12 @@ var g100 = /*#__PURE__*/Object.freeze({
1193
1217
  container03: layout.container03,
1194
1218
  container04: layout.container04,
1195
1219
  container05: layout.container05,
1220
+ sizeXSmall: layout.sizeXSmall,
1221
+ sizeSmall: layout.sizeSmall,
1222
+ sizeMedium: layout.sizeMedium,
1223
+ sizeLarge: layout.sizeLarge,
1224
+ sizeXLarge: layout.sizeXLarge,
1225
+ size2XLarge: layout.size2XLarge,
1196
1226
  iconSize01: layout.iconSize01,
1197
1227
  iconSize02: layout.iconSize02
1198
1228
  });
@@ -1208,6 +1238,8 @@ var g100 = /*#__PURE__*/Object.freeze({
1208
1238
  var background$2 = colors$1.gray80;
1209
1239
  var layer$2 = colors$1.gray70;
1210
1240
  var layerAccent$2 = colors$1.gray60;
1241
+ var layerAccentActive$2 = colors$1.gray70;
1242
+ var layerAccentHover$2 = adjustLightness(layerAccent$2, -7);
1211
1243
  var field$2 = colors$1.gray70;
1212
1244
  var backgroundInverse$2 = colors$1.gray10;
1213
1245
  var backgroundBrand$2 = colors$1.blue60;
@@ -1362,6 +1394,8 @@ var g80 = /*#__PURE__*/Object.freeze({
1362
1394
  background: background$2,
1363
1395
  layer: layer$2,
1364
1396
  layerAccent: layerAccent$2,
1397
+ layerAccentActive: layerAccentActive$2,
1398
+ layerAccentHover: layerAccentHover$2,
1365
1399
  field: field$2,
1366
1400
  backgroundInverse: backgroundInverse$2,
1367
1401
  backgroundBrand: backgroundBrand$2,
@@ -1568,6 +1602,12 @@ var g80 = /*#__PURE__*/Object.freeze({
1568
1602
  container03: layout.container03,
1569
1603
  container04: layout.container04,
1570
1604
  container05: layout.container05,
1605
+ sizeXSmall: layout.sizeXSmall,
1606
+ sizeSmall: layout.sizeSmall,
1607
+ sizeMedium: layout.sizeMedium,
1608
+ sizeLarge: layout.sizeLarge,
1609
+ sizeXLarge: layout.sizeXLarge,
1610
+ size2XLarge: layout.size2XLarge,
1571
1611
  iconSize01: layout.iconSize01,
1572
1612
  iconSize02: layout.iconSize02
1573
1613
  });
@@ -1650,6 +1690,8 @@ var skeleton02$1 = colors$1.gray70; // New color tokens
1650
1690
  var background$1 = uiBackground$1;
1651
1691
  var layer$1 = ui01$1;
1652
1692
  var layerAccent$1 = ui03$1;
1693
+ var layerAccentActive$1 = colors$1.gray50;
1694
+ var layerAccentHover$1 = adjustLightness(layerAccent$1, +7);
1653
1695
  var field$1 = field01$1;
1654
1696
  var backgroundInverse$1 = inverse02$1;
1655
1697
  var backgroundBrand$1 = interactive01$1;
@@ -1800,6 +1842,8 @@ var g90 = /*#__PURE__*/Object.freeze({
1800
1842
  background: background$1,
1801
1843
  layer: layer$1,
1802
1844
  layerAccent: layerAccent$1,
1845
+ layerAccentActive: layerAccentActive$1,
1846
+ layerAccentHover: layerAccentHover$1,
1803
1847
  field: field$1,
1804
1848
  backgroundInverse: backgroundInverse$1,
1805
1849
  backgroundBrand: backgroundBrand$1,
@@ -1940,6 +1984,12 @@ var g90 = /*#__PURE__*/Object.freeze({
1940
1984
  container03: layout.container03,
1941
1985
  container04: layout.container04,
1942
1986
  container05: layout.container05,
1987
+ sizeXSmall: layout.sizeXSmall,
1988
+ sizeSmall: layout.sizeSmall,
1989
+ sizeMedium: layout.sizeMedium,
1990
+ sizeLarge: layout.sizeLarge,
1991
+ sizeXLarge: layout.sizeXLarge,
1992
+ size2XLarge: layout.size2XLarge,
1943
1993
  iconSize01: layout.iconSize01,
1944
1994
  iconSize02: layout.iconSize02
1945
1995
  });
@@ -2022,6 +2072,8 @@ var skeleton02 = 'rgba(61, 112, 178, .1)'; // New color tokens
2022
2072
  var background = uiBackground;
2023
2073
  var layer = ui01;
2024
2074
  var layerAccent = ui03;
2075
+ var layerAccentActive = colors$1.gray40;
2076
+ var layerAccentHover = adjustLightness(layerAccent, -6);
2025
2077
  var field = field01;
2026
2078
  var backgroundInverse = inverse02;
2027
2079
  var backgroundBrand = interactive01;
@@ -2172,6 +2224,8 @@ var v9 = /*#__PURE__*/Object.freeze({
2172
2224
  background: background,
2173
2225
  layer: layer,
2174
2226
  layerAccent: layerAccent,
2227
+ layerAccentActive: layerAccentActive,
2228
+ layerAccentHover: layerAccentHover,
2175
2229
  field: field,
2176
2230
  backgroundInverse: backgroundInverse,
2177
2231
  backgroundBrand: backgroundBrand,
@@ -2312,6 +2366,12 @@ var v9 = /*#__PURE__*/Object.freeze({
2312
2366
  container03: layout.container03,
2313
2367
  container04: layout.container04,
2314
2368
  container05: layout.container05,
2369
+ sizeXSmall: layout.sizeXSmall,
2370
+ sizeSmall: layout.sizeSmall,
2371
+ sizeMedium: layout.sizeMedium,
2372
+ sizeLarge: layout.sizeLarge,
2373
+ sizeXLarge: layout.sizeXLarge,
2374
+ size2XLarge: layout.size2XLarge,
2315
2375
  iconSize01: layout.iconSize01,
2316
2376
  iconSize02: layout.iconSize02
2317
2377
  });
@@ -2328,7 +2388,7 @@ var colors = [// Core
2328
2388
  '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
2329
2389
  '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
2330
2390
  // TO-DO: remove fallback color when v11 is released and assign carbon colors to new tokens
2331
- '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
2391
+ 'background', 'layer', 'layerAccent', 'layerAccentHover', 'layerAccentActive', '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
2332
2392
  'brand01', 'brand02', 'brand03', 'active01', 'hoverField', 'danger'];
2333
2393
  var numbers = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'];
2334
2394
  /**
@@ -2378,7 +2438,7 @@ var unstable__meta = {
2378
2438
  colors: [{
2379
2439
  type: 'core',
2380
2440
  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
2381
- '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']
2441
+ 'background', 'layer', 'layerAccent', 'layerAccentHover', 'layerAccentActive', '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']
2382
2442
  }, {
2383
2443
  type: 'interactive',
2384
2444
  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
@@ -2714,6 +2774,42 @@ Object.defineProperty(exports, 'layout07', {
2714
2774
  return layout.layout07;
2715
2775
  }
2716
2776
  });
2777
+ Object.defineProperty(exports, 'size2XLarge', {
2778
+ enumerable: true,
2779
+ get: function () {
2780
+ return layout.size2XLarge;
2781
+ }
2782
+ });
2783
+ Object.defineProperty(exports, 'sizeLarge', {
2784
+ enumerable: true,
2785
+ get: function () {
2786
+ return layout.sizeLarge;
2787
+ }
2788
+ });
2789
+ Object.defineProperty(exports, 'sizeMedium', {
2790
+ enumerable: true,
2791
+ get: function () {
2792
+ return layout.sizeMedium;
2793
+ }
2794
+ });
2795
+ Object.defineProperty(exports, 'sizeSmall', {
2796
+ enumerable: true,
2797
+ get: function () {
2798
+ return layout.sizeSmall;
2799
+ }
2800
+ });
2801
+ Object.defineProperty(exports, 'sizeXLarge', {
2802
+ enumerable: true,
2803
+ get: function () {
2804
+ return layout.sizeXLarge;
2805
+ }
2806
+ });
2807
+ Object.defineProperty(exports, 'sizeXSmall', {
2808
+ enumerable: true,
2809
+ get: function () {
2810
+ return layout.sizeXSmall;
2811
+ }
2812
+ });
2717
2813
  Object.defineProperty(exports, 'spacing01', {
2718
2814
  enumerable: true,
2719
2815
  get: function () {
@@ -2887,6 +2983,8 @@ exports.inverseSupport03 = inverseSupport03$5;
2887
2983
  exports.inverseSupport04 = inverseSupport04$5;
2888
2984
  exports.layer = layer$5;
2889
2985
  exports.layerAccent = layerAccent$5;
2986
+ exports.layerAccentActive = layerAccentActive$5;
2987
+ exports.layerAccentHover = layerAccentHover$5;
2890
2988
  exports.layerActive = layerActive$5;
2891
2989
  exports.layerDisabled = layerDisabled$5;
2892
2990
  exports.layerHover = layerHover$5;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@carbon/themes",
3
3
  "description": "Themes for applying color in the Carbon Design System",
4
- "version": "10.34.0-rc.0",
4
+ "version": "10.36.0",
5
5
  "license": "Apache-2.0",
6
6
  "main": "lib/index.js",
7
7
  "module": "es/index.js",
@@ -29,16 +29,16 @@
29
29
  "build": "yarn clean && carbon-cli bundle src/index.js --name CarbonThemes && node tasks/build.js && carbon-cli check \"scss/*.scss\""
30
30
  },
31
31
  "dependencies": {
32
- "@carbon/colors": "^10.25.0-rc.0",
33
- "@carbon/layout": "^10.24.0-rc.0",
34
- "@carbon/type": "^10.28.0-rc.0",
32
+ "@carbon/colors": "^10.26.0",
33
+ "@carbon/layout": "^10.25.0",
34
+ "@carbon/type": "^10.29.0",
35
35
  "color": "^3.1.2"
36
36
  },
37
37
  "devDependencies": {
38
- "@carbon/cli": "^10.23.0-rc.0",
38
+ "@carbon/cli": "^10.24.0",
39
39
  "@carbon/cli-reporter": "^10.4.0",
40
40
  "@carbon/scss-generator": "^10.13.0",
41
- "@carbon/test-utils": "^10.15.0",
41
+ "@carbon/test-utils": "^10.16.0",
42
42
  "change-case": "^4.1.1",
43
43
  "core-js": "^3.6.5",
44
44
  "fs-extra": "^8.1.0",
@@ -46,5 +46,5 @@
46
46
  "node-sass": "^4.13.1",
47
47
  "rimraf": "^3.0.0"
48
48
  },
49
- "gitHead": "14b4dc1010d7ea5bdf54edc92fb4b939065bc02c"
49
+ "gitHead": "72c0172ef78d89cd5ab53c6af211dda682275c2f"
50
50
  }