@carbon/themes 10.34.0-rc.0 → 10.36.0

package/umd/index.js

@@ -111,7 +111,7 @@
   var inverse01$5 = colors$1.white;
   var inverse02$5 = colors$1.gray80;
   var support01$5 = colors$1.red60;
-  var support02$5 = colors$1.green50;
+  var support02$5 = colors$1.green60;
   var support03$5 = colors$1.yellow;
   var support04$5 = colors$1.blue70;
   var inverseSupport01$5 = colors$1.red50;
@@ -156,6 +156,8 @@
   var background$5 = uiBackground$5;
   var layer$5 = ui01$5;
   var layerAccent$5 = ui03$5;
+  var layerAccentActive$5 = colors$1.gray40;
+  var layerAccentHover$5 = adjustLightness(layerAccent$5, -6);
   var field$5 = field01$5;
   var backgroundInverse$5 = inverse02$5;
   var backgroundBrand$5 = interactive01$5;
@@ -306,6 +308,8 @@
     background: background$5,
     layer: layer$5,
     layerAccent: layerAccent$5,
+    layerAccentActive: layerAccentActive$5,
+    layerAccentHover: layerAccentHover$5,
     field: field$5,
     backgroundInverse: backgroundInverse$5,
     backgroundBrand: backgroundBrand$5,
@@ -446,6 +450,12 @@
     container03: layout.container03,
     container04: layout.container04,
     container05: layout.container05,
+    sizeXSmall: layout.sizeXSmall,
+    sizeSmall: layout.sizeSmall,
+    sizeMedium: layout.sizeMedium,
+    sizeLarge: layout.sizeLarge,
+    sizeXLarge: layout.sizeXLarge,
+    size2XLarge: layout.size2XLarge,
     iconSize01: layout.iconSize01,
     iconSize02: layout.iconSize02
   });
@@ -483,7 +493,7 @@
   var inverse01$4 = colors$1.white;
   var inverse02$4 = colors$1.gray80;
   var support01$4 = colors$1.red60;
-  var support02$4 = colors$1.green50;
+  var support02$4 = colors$1.green60;
   var support03$4 = colors$1.yellow;
   var support04$4 = colors$1.blue70;
   var inverseSupport01$4 = colors$1.red50;
@@ -528,6 +538,8 @@
   var background$4 = uiBackground$4;
   var layer$4 = ui01$4;
   var layerAccent$4 = ui03$4;
+  var layerAccentActive$4 = colors$1.gray40;
+  var layerAccentHover$4 = adjustLightness(layerAccent$4, -6);
   var field$4 = field01$4;
   var backgroundInverse$4 = inverse02$4;
   var backgroundBrand$4 = interactive01$4;
@@ -678,6 +690,8 @@
     background: background$4,
     layer: layer$4,
     layerAccent: layerAccent$4,
+    layerAccentActive: layerAccentActive$4,
+    layerAccentHover: layerAccentHover$4,
     field: field$4,
     backgroundInverse: backgroundInverse$4,
     backgroundBrand: backgroundBrand$4,
@@ -818,6 +832,12 @@
     container03: layout.container03,
     container04: layout.container04,
     container05: layout.container05,
+    sizeXSmall: layout.sizeXSmall,
+    sizeSmall: layout.sizeSmall,
+    sizeMedium: layout.sizeMedium,
+    sizeLarge: layout.sizeLarge,
+    sizeXLarge: layout.sizeXLarge,
+    size2XLarge: layout.size2XLarge,
     iconSize01: layout.iconSize01,
     iconSize02: layout.iconSize02
   });
@@ -900,6 +920,8 @@
   var background$3 = uiBackground$3;
   var layer$3 = ui01$3;
   var layerAccent$3 = ui03$3;
+  var layerAccentActive$3 = colors$1.gray60;
+  var layerAccentHover$3 = adjustLightness(layerAccent$3, +6);
   var field$3 = field01$3;
   var backgroundInverse$3 = inverse02$3;
   var backgroundBrand$3 = interactive01$3;
@@ -1050,6 +1072,8 @@
     background: background$3,
     layer: layer$3,
     layerAccent: layerAccent$3,
+    layerAccentActive: layerAccentActive$3,
+    layerAccentHover: layerAccentHover$3,
     field: field$3,
     backgroundInverse: backgroundInverse$3,
     backgroundBrand: backgroundBrand$3,
@@ -1190,6 +1214,12 @@
     container03: layout.container03,
     container04: layout.container04,
     container05: layout.container05,
+    sizeXSmall: layout.sizeXSmall,
+    sizeSmall: layout.sizeSmall,
+    sizeMedium: layout.sizeMedium,
+    sizeLarge: layout.sizeLarge,
+    sizeXLarge: layout.sizeXLarge,
+    size2XLarge: layout.size2XLarge,
     iconSize01: layout.iconSize01,
     iconSize02: layout.iconSize02
   });
@@ -1205,6 +1235,8 @@
   var background$2 = colors$1.gray80;
   var layer$2 = colors$1.gray70;
   var layerAccent$2 = colors$1.gray60;
+  var layerAccentActive$2 = colors$1.gray70;
+  var layerAccentHover$2 = adjustLightness(layerAccent$2, -7);
   var field$2 = colors$1.gray70;
   var backgroundInverse$2 = colors$1.gray10;
   var backgroundBrand$2 = colors$1.blue60;
@@ -1359,6 +1391,8 @@
     background: background$2,
     layer: layer$2,
     layerAccent: layerAccent$2,
+    layerAccentActive: layerAccentActive$2,
+    layerAccentHover: layerAccentHover$2,
     field: field$2,
     backgroundInverse: backgroundInverse$2,
     backgroundBrand: backgroundBrand$2,
@@ -1565,6 +1599,12 @@
     container03: layout.container03,
     container04: layout.container04,
     container05: layout.container05,
+    sizeXSmall: layout.sizeXSmall,
+    sizeSmall: layout.sizeSmall,
+    sizeMedium: layout.sizeMedium,
+    sizeLarge: layout.sizeLarge,
+    sizeXLarge: layout.sizeXLarge,
+    size2XLarge: layout.size2XLarge,
     iconSize01: layout.iconSize01,
     iconSize02: layout.iconSize02
   });
@@ -1647,6 +1687,8 @@
   var background$1 = uiBackground$1;
   var layer$1 = ui01$1;
   var layerAccent$1 = ui03$1;
+  var layerAccentActive$1 = colors$1.gray50;
+  var layerAccentHover$1 = adjustLightness(layerAccent$1, +7);
   var field$1 = field01$1;
   var backgroundInverse$1 = inverse02$1;
   var backgroundBrand$1 = interactive01$1;
@@ -1797,6 +1839,8 @@
     background: background$1,
     layer: layer$1,
     layerAccent: layerAccent$1,
+    layerAccentActive: layerAccentActive$1,
+    layerAccentHover: layerAccentHover$1,
     field: field$1,
     backgroundInverse: backgroundInverse$1,
     backgroundBrand: backgroundBrand$1,
@@ -1937,6 +1981,12 @@
     container03: layout.container03,
     container04: layout.container04,
     container05: layout.container05,
+    sizeXSmall: layout.sizeXSmall,
+    sizeSmall: layout.sizeSmall,
+    sizeMedium: layout.sizeMedium,
+    sizeLarge: layout.sizeLarge,
+    sizeXLarge: layout.sizeXLarge,
+    size2XLarge: layout.size2XLarge,
     iconSize01: layout.iconSize01,
     iconSize02: layout.iconSize02
   });
@@ -2019,6 +2069,8 @@
   var background = uiBackground;
   var layer = ui01;
   var layerAccent = ui03;
+  var layerAccentActive = colors$1.gray40;
+  var layerAccentHover = adjustLightness(layerAccent, -6);
   var field = field01;
   var backgroundInverse = inverse02;
   var backgroundBrand = interactive01;
@@ -2169,6 +2221,8 @@
     background: background,
     layer: layer,
     layerAccent: layerAccent,
+    layerAccentActive: layerAccentActive,
+    layerAccentHover: layerAccentHover,
     field: field,
     backgroundInverse: backgroundInverse,
     backgroundBrand: backgroundBrand,
@@ -2309,6 +2363,12 @@
     container03: layout.container03,
     container04: layout.container04,
     container05: layout.container05,
+    sizeXSmall: layout.sizeXSmall,
+    sizeSmall: layout.sizeSmall,
+    sizeMedium: layout.sizeMedium,
+    sizeLarge: layout.sizeLarge,
+    sizeXLarge: layout.sizeXLarge,
+    size2XLarge: layout.size2XLarge,
     iconSize01: layout.iconSize01,
     iconSize02: layout.iconSize02
   });
@@ -2325,7 +2385,7 @@
   '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
   '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
   // TO-DO: remove fallback color when v11 is released and assign carbon colors to new tokens
-  '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
+  '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
   'brand01', 'brand02', 'brand03', 'active01', 'hoverField', 'danger'];
   var numbers = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'];
   /**
@@ -2375,7 +2435,7 @@
     colors: [{
       type: 'core',
       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
-      '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']
+      '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']
     }, {
       type: 'interactive',
       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
@@ -2711,6 +2771,42 @@
       return layout.layout07;
     }
   });
+  Object.defineProperty(exports, 'size2XLarge', {
+    enumerable: true,
+    get: function () {
+      return layout.size2XLarge;
+    }
+  });
+  Object.defineProperty(exports, 'sizeLarge', {
+    enumerable: true,
+    get: function () {
+      return layout.sizeLarge;
+    }
+  });
+  Object.defineProperty(exports, 'sizeMedium', {
+    enumerable: true,
+    get: function () {
+      return layout.sizeMedium;
+    }
+  });
+  Object.defineProperty(exports, 'sizeSmall', {
+    enumerable: true,
+    get: function () {
+      return layout.sizeSmall;
+    }
+  });
+  Object.defineProperty(exports, 'sizeXLarge', {
+    enumerable: true,
+    get: function () {
+      return layout.sizeXLarge;
+    }
+  });
+  Object.defineProperty(exports, 'sizeXSmall', {
+    enumerable: true,
+    get: function () {
+      return layout.sizeXSmall;
+    }
+  });
   Object.defineProperty(exports, 'spacing01', {
     enumerable: true,
     get: function () {
@@ -2884,6 +2980,8 @@
   exports.inverseSupport04 = inverseSupport04$5;
   exports.layer = layer$5;
   exports.layerAccent = layerAccent$5;
+  exports.layerAccentActive = layerAccentActive$5;
+  exports.layerAccentHover = layerAccentHover$5;
   exports.layerActive = layerActive$5;
   exports.layerDisabled = layerDisabled$5;
   exports.layerHover = layerHover$5;