@carbon/themes 11.11.0-rc.0 → 11.11.1-rc.0

package/es/index.js

@@ -1,4 +1,4 @@
-import { white as white$2, gray80, blue60, gray50, gray80Hover, gray10, gray30, gray10Hover, gray20, gray20Hover, whiteHover, gray100, gray40, gray70, gray60, red60, blue70, blue40, purple60, blue30, green60, yellow30, red50, green40, blue50, orange40, blue20, gray90, gray70Hover, gray60Hover, gray50Hover, red30, purple40, red40, green50, purple50, gray90Hover, rgba, black, blue80, red80, red20, red70, red70Hover, magenta20, magenta70, magenta80, magenta30, magenta70Hover, purple20, purple70, purple80, purple30, purple70Hover, blue70Hover, cyan20, cyan70, cyan80, cyan30, cyan70Hover, teal20, teal70, teal80, teal30, teal70Hover, green20, green70, green80, green30, green70Hover, coolGray20, coolGray70, coolGray80, coolGray30, coolGray70Hover, warmGray20, warmGray70, warmGray80, warmGray30, warmGray70Hover } from '@carbon/colors';
+import { white as white$2, gray80, blue60, gray50, gray80Hover, gray10, gray30, gray10Hover, gray20, gray20Hover, whiteHover, gray100, gray40, gray70, gray60, red60, blue70, blue40, purple60, blue30, green60, yellow30, red50, green40, blue50, orange40, blue20, gray90, gray70Hover, gray60Hover, gray50Hover, red30, purple40, red40, green50, purple50, gray90Hover, rgba, black, blue80, red80, red20, red70, red70Hover, magenta20, magenta70, magenta80, magenta30, magenta70Hover, purple20, purple70, purple80, purple30, purple70Hover, blue70Hover, cyan20, cyan70, cyan80, cyan30, cyan70Hover, teal20, teal70, teal80, teal30, teal70Hover, green20, green70, green80, green30, green70Hover, coolGray20, coolGray70, coolGray80, coolGray30, coolGray70Hover, warmGray20, warmGray70, warmGray80, warmGray30, warmGray70Hover, red10, green10, blue10, white0 } from '@carbon/colors';
 import Color from 'color';
 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, legal01, legal02, bodyCompact01, bodyCompact02, body01, body02, headingCompact01, headingCompact02, heading03, heading04, heading05, heading06, heading07, fluidHeading03, fluidHeading04, fluidHeading05, fluidHeading06, fluidParagraph01, fluidQuotation01, fluidQuotation02, fluidDisplay01, fluidDisplay02, fluidDisplay03, fluidDisplay04, unstable_tokens } from '@carbon/type';
 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';
@@ -3360,7 +3360,7 @@ var colors = [// Core
 // TO-DO: remove fallback color when v11 is released and assign carbon colors to new tokens
 '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', 'shadow', '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', 'borderDisabled', 'textDisabled', 'buttonDisabled', 'iconDisabled', 'textOnColorDisabled', 'iconOnColorDisabled', 'layerSelectedDisabled', 'skeletonBackground', 'skeletonElement', // Deprecated
 'brand01', 'brand02', 'brand03', 'active01', 'hoverField', 'danger'];
-var tokens$2 = {
+var tokens$3 = {
   colors: colors,
   type: unstable_tokens,
   layout: unstable_tokens$1
@@ -3379,14 +3379,14 @@ var themes$1 = {
   g100: g100
 };
 
-var index$2 = /*#__PURE__*/Object.freeze({
+var index$3 = /*#__PURE__*/Object.freeze({
   __proto__: null,
   white: white,
   g10: g10,
   g90: g90,
   g100: g100,
   themes: themes$1,
-  tokens: tokens$2,
+  tokens: tokens$3,
   caption01: caption01,
   caption02: caption02,
   label01: label01,
@@ -3716,7 +3716,7 @@ var buttonDisabled = {
   g100: 'rgb(141 141 141 / 30%)'
 };
 
-var tokens$1 = /*#__PURE__*/Object.freeze({
+var tokens$2 = /*#__PURE__*/Object.freeze({
   __proto__: null,
   buttonSeparator: buttonSeparator,
   buttonPrimary: buttonPrimary,
@@ -3735,9 +3735,9 @@ var tokens$1 = /*#__PURE__*/Object.freeze({
   buttonDisabled: buttonDisabled
 });
 
-var index$1 = /*#__PURE__*/Object.freeze({
+var index$2 = /*#__PURE__*/Object.freeze({
   __proto__: null,
-  buttonTokens: tokens$1
+  buttonTokens: tokens$2
 });
 
 var tagBackgroundRed = {
@@ -3921,7 +3921,7 @@ var tagHoverWarmGray = {
   g100: warmGray70Hover
 };
 
-var tokens = /*#__PURE__*/Object.freeze({
+var tokens$1 = /*#__PURE__*/Object.freeze({
   __proto__: null,
   tagBackgroundRed: tagBackgroundRed,
   tagColorRed: tagColorRed,
@@ -3955,9 +3955,92 @@ var tokens = /*#__PURE__*/Object.freeze({
   tagHoverWarmGray: tagHoverWarmGray
 });
 
+var index$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  tagTokens: tokens$1
+});
+
+var notificationBackgroundError = {
+  whiteTheme: red10,
+  g10: red10,
+  g90: gray80,
+  g100: gray90
+};
+var notificationBackgroundSuccess = {
+  whiteTheme: green10,
+  g10: green10,
+  g90: gray80,
+  g100: gray90
+};
+var notificationBackgroundInfo = {
+  whiteTheme: blue10,
+  g10: blue10,
+  g90: gray80,
+  g100: gray90
+};
+var colorMap = {
+  yellow30: yellow30,
+  white0: white0
+};
+var notificationBackgroundWarning = {
+  whiteTheme: colorMap,
+  g10: colorMap,
+  g90: gray80,
+  g100: gray90
+};
+var notificationActionHover = {
+  whiteTheme: white0,
+  g10: white0
+};
+var notificationActionTertiaryInverse = {
+  whiteTheme: buttonTertiary.g100,
+  g10: buttonTertiary.g90,
+  g90: buttonTertiary.g10,
+  g100: buttonTertiary.whiteTheme
+};
+var notificationActionTertiaryInverseActive = {
+  whiteTheme: buttonTertiaryActive.g100,
+  g10: buttonTertiaryActive.g90,
+  g90: buttonTertiaryActive.g10,
+  g100: buttonTertiaryActive.whiteTheme
+};
+var notificationActionTertiaryInverseHover = {
+  whiteTheme: buttonTertiaryHover.g100,
+  g10: buttonTertiaryHover.g90,
+  g90: buttonTertiaryHover.g10,
+  g100: buttonTertiaryHover.whiteTheme
+};
+var notificationActionTertiaryInverseText = {
+  whiteTheme: textInverse$4,
+  g10: textInverse$5,
+  g90: textInverse$6,
+  g100: textInverse$7
+};
+var notificationActionTertiaryInverseTextOnColorDisabled = {
+  whiteTheme: textOnColorDisabled$4,
+  g10: textOnColorDisabled$5,
+  g90: textOnColorDisabled$6,
+  g100: textOnColorDisabled$7
+};
+
+var tokens = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  notificationBackgroundError: notificationBackgroundError,
+  notificationBackgroundSuccess: notificationBackgroundSuccess,
+  notificationBackgroundInfo: notificationBackgroundInfo,
+  colorMap: colorMap,
+  notificationBackgroundWarning: notificationBackgroundWarning,
+  notificationActionHover: notificationActionHover,
+  notificationActionTertiaryInverse: notificationActionTertiaryInverse,
+  notificationActionTertiaryInverseActive: notificationActionTertiaryInverseActive,
+  notificationActionTertiaryInverseHover: notificationActionTertiaryInverseHover,
+  notificationActionTertiaryInverseText: notificationActionTertiaryInverseText,
+  notificationActionTertiaryInverseTextOnColorDisabled: notificationActionTertiaryInverseTextOnColorDisabled
+});
+
 var index = /*#__PURE__*/Object.freeze({
   __proto__: null,
-  tagTokens: tokens
+  notificationTokens: tokens
 });
 
 /**
@@ -4646,4 +4729,4 @@ var themes = {
   g100: g100$1
 };
 
-export { background$8 as background, backgroundActive$7 as backgroundActive, backgroundBrand$7 as backgroundBrand, backgroundHover$7 as backgroundHover, backgroundInverse$7 as backgroundInverse, backgroundInverseHover$7 as backgroundInverseHover, backgroundSelected$7 as backgroundSelected, backgroundSelectedHover$7 as backgroundSelectedHover, borderDisabled$7 as borderDisabled, borderInteractive$7 as borderInteractive, borderInverse$7 as borderInverse, borderStrong01$3 as borderStrong01, borderStrong02$3 as borderStrong02, borderStrong03$3 as borderStrong03, borderSubtle00$3 as borderSubtle00, borderSubtle01$3 as borderSubtle01, borderSubtle02$3 as borderSubtle02, borderSubtle03$3 as borderSubtle03, borderSubtleSelected01$3 as borderSubtleSelected01, borderSubtleSelected02$3 as borderSubtleSelected02, borderSubtleSelected03$3 as borderSubtleSelected03, index$1 as buttonTokens, field01$7 as field01, field02$7 as field02, field03$3 as field03, fieldHover01$3 as fieldHover01, fieldHover02$3 as fieldHover02, fieldHover03$3 as fieldHover03, focus$8 as focus, focusInset$7 as focusInset, focusInverse$7 as focusInverse, formatTokenName, g10$1 as g10, g100$1 as g100, g90$1 as g90, highlight$7 as highlight, iconDisabled$7 as iconDisabled, iconInverse$7 as iconInverse, iconOnColor$7 as iconOnColor, iconOnColorDisabled$7 as iconOnColorDisabled, iconPrimary$7 as iconPrimary, iconSecondary$7 as iconSecondary, interactive$7 as interactive, layer01$3 as layer01, layer02$3 as layer02, layer03$3 as layer03, layerAccent01$3 as layerAccent01, layerAccent02$3 as layerAccent02, layerAccent03$3 as layerAccent03, layerAccentActive01$3 as layerAccentActive01, layerAccentActive02$3 as layerAccentActive02, layerAccentActive03$3 as layerAccentActive03, layerAccentHover01$3 as layerAccentHover01, layerAccentHover02$3 as layerAccentHover02, layerAccentHover03$3 as layerAccentHover03, layerActive01$3 as layerActive01, layerActive02$3 as layerActive02, layerActive03$3 as layerActive03, layerHover01$3 as layerHover01, layerHover02$3 as layerHover02, layerHover03$3 as layerHover03, layerSelected01$3 as layerSelected01, layerSelected02$3 as layerSelected02, layerSelected03$3 as layerSelected03, layerSelectedDisabled$7 as layerSelectedDisabled, layerSelectedHover01$3 as layerSelectedHover01, layerSelectedHover02$3 as layerSelectedHover02, layerSelectedHover03$3 as layerSelectedHover03, layerSelectedInverse$7 as layerSelectedInverse, linkInverse$7 as linkInverse, linkInverseActive$3 as linkInverseActive, linkInverseHover$3 as linkInverseHover, linkPrimary$7 as linkPrimary, linkPrimaryHover$7 as linkPrimaryHover, linkSecondary$7 as linkSecondary, linkVisited$7 as linkVisited, overlay$7 as overlay, shadow$7 as shadow, skeletonBackground$7 as skeletonBackground, skeletonElement$7 as skeletonElement, supportCautionMajor$3 as supportCautionMajor, supportCautionMinor$3 as supportCautionMinor, supportCautionUndefined$3 as supportCautionUndefined, supportError$7 as supportError, supportErrorInverse$7 as supportErrorInverse, supportInfo$7 as supportInfo, supportInfoInverse$7 as supportInfoInverse, supportSuccess$7 as supportSuccess, supportSuccessInverse$7 as supportSuccessInverse, supportWarning$7 as supportWarning, supportWarningInverse$7 as supportWarningInverse, index as tagTokens, textDisabled$7 as textDisabled, textError$7 as textError, textHelper$7 as textHelper, textInverse$7 as textInverse, textOnColor$7 as textOnColor, textOnColorDisabled$7 as textOnColorDisabled, textPlaceholder$7 as textPlaceholder, textPrimary$7 as textPrimary, textSecondary$7 as textSecondary, themes, toggleOff$7 as toggleOff, unstable_metadata, index$2 as v10, white$1 as white };
+export { background$8 as background, backgroundActive$7 as backgroundActive, backgroundBrand$7 as backgroundBrand, backgroundHover$7 as backgroundHover, backgroundInverse$7 as backgroundInverse, backgroundInverseHover$7 as backgroundInverseHover, backgroundSelected$7 as backgroundSelected, backgroundSelectedHover$7 as backgroundSelectedHover, borderDisabled$7 as borderDisabled, borderInteractive$7 as borderInteractive, borderInverse$7 as borderInverse, borderStrong01$3 as borderStrong01, borderStrong02$3 as borderStrong02, borderStrong03$3 as borderStrong03, borderSubtle00$3 as borderSubtle00, borderSubtle01$3 as borderSubtle01, borderSubtle02$3 as borderSubtle02, borderSubtle03$3 as borderSubtle03, borderSubtleSelected01$3 as borderSubtleSelected01, borderSubtleSelected02$3 as borderSubtleSelected02, borderSubtleSelected03$3 as borderSubtleSelected03, index$2 as buttonTokens, field01$7 as field01, field02$7 as field02, field03$3 as field03, fieldHover01$3 as fieldHover01, fieldHover02$3 as fieldHover02, fieldHover03$3 as fieldHover03, focus$8 as focus, focusInset$7 as focusInset, focusInverse$7 as focusInverse, formatTokenName, g10$1 as g10, g100$1 as g100, g90$1 as g90, highlight$7 as highlight, iconDisabled$7 as iconDisabled, iconInverse$7 as iconInverse, iconOnColor$7 as iconOnColor, iconOnColorDisabled$7 as iconOnColorDisabled, iconPrimary$7 as iconPrimary, iconSecondary$7 as iconSecondary, interactive$7 as interactive, layer01$3 as layer01, layer02$3 as layer02, layer03$3 as layer03, layerAccent01$3 as layerAccent01, layerAccent02$3 as layerAccent02, layerAccent03$3 as layerAccent03, layerAccentActive01$3 as layerAccentActive01, layerAccentActive02$3 as layerAccentActive02, layerAccentActive03$3 as layerAccentActive03, layerAccentHover01$3 as layerAccentHover01, layerAccentHover02$3 as layerAccentHover02, layerAccentHover03$3 as layerAccentHover03, layerActive01$3 as layerActive01, layerActive02$3 as layerActive02, layerActive03$3 as layerActive03, layerHover01$3 as layerHover01, layerHover02$3 as layerHover02, layerHover03$3 as layerHover03, layerSelected01$3 as layerSelected01, layerSelected02$3 as layerSelected02, layerSelected03$3 as layerSelected03, layerSelectedDisabled$7 as layerSelectedDisabled, layerSelectedHover01$3 as layerSelectedHover01, layerSelectedHover02$3 as layerSelectedHover02, layerSelectedHover03$3 as layerSelectedHover03, layerSelectedInverse$7 as layerSelectedInverse, linkInverse$7 as linkInverse, linkInverseActive$3 as linkInverseActive, linkInverseHover$3 as linkInverseHover, linkPrimary$7 as linkPrimary, linkPrimaryHover$7 as linkPrimaryHover, linkSecondary$7 as linkSecondary, linkVisited$7 as linkVisited, index as notificationTokens, overlay$7 as overlay, shadow$7 as shadow, skeletonBackground$7 as skeletonBackground, skeletonElement$7 as skeletonElement, supportCautionMajor$3 as supportCautionMajor, supportCautionMinor$3 as supportCautionMinor, supportCautionUndefined$3 as supportCautionUndefined, supportError$7 as supportError, supportErrorInverse$7 as supportErrorInverse, supportInfo$7 as supportInfo, supportInfoInverse$7 as supportInfoInverse, supportSuccess$7 as supportSuccess, supportSuccessInverse$7 as supportSuccessInverse, supportWarning$7 as supportWarning, supportWarningInverse$7 as supportWarningInverse, index$1 as tagTokens, textDisabled$7 as textDisabled, textError$7 as textError, textHelper$7 as textHelper, textInverse$7 as textInverse, textOnColor$7 as textOnColor, textOnColorDisabled$7 as textOnColorDisabled, textPlaceholder$7 as textPlaceholder, textPrimary$7 as textPrimary, textSecondary$7 as textSecondary, themes, toggleOff$7 as toggleOff, unstable_metadata, index$3 as v10, white$1 as white };

package/lib/index.js

@@ -3366,7 +3366,7 @@ var colors = [// Core
 // TO-DO: remove fallback color when v11 is released and assign carbon colors to new tokens
 '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', 'shadow', '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', 'borderDisabled', 'textDisabled', 'buttonDisabled', 'iconDisabled', 'textOnColorDisabled', 'iconOnColorDisabled', 'layerSelectedDisabled', 'skeletonBackground', 'skeletonElement', // Deprecated
 'brand01', 'brand02', 'brand03', 'active01', 'hoverField', 'danger'];
-var tokens$2 = {
+var tokens$3 = {
   colors: colors,
   type: type$2.unstable_tokens,
   layout: layout$2.unstable_tokens
@@ -3385,14 +3385,14 @@ var themes$1 = {
   g100: g100
 };
 
-var index$2 = /*#__PURE__*/Object.freeze({
+var index$3 = /*#__PURE__*/Object.freeze({
   __proto__: null,
   white: white,
   g10: g10,
   g90: g90,
   g100: g100,
   themes: themes$1,
-  tokens: tokens$2,
+  tokens: tokens$3,
   caption01: type$2.caption01,
   caption02: type$2.caption02,
   label01: type$2.label01,
@@ -3722,7 +3722,7 @@ var buttonDisabled = {
   g100: 'rgb(141 141 141 / 30%)'
 };
 
-var tokens$1 = /*#__PURE__*/Object.freeze({
+var tokens$2 = /*#__PURE__*/Object.freeze({
   __proto__: null,
   buttonSeparator: buttonSeparator,
   buttonPrimary: buttonPrimary,
@@ -3741,9 +3741,9 @@ var tokens$1 = /*#__PURE__*/Object.freeze({
   buttonDisabled: buttonDisabled
 });
 
-var index$1 = /*#__PURE__*/Object.freeze({
+var index$2 = /*#__PURE__*/Object.freeze({
   __proto__: null,
-  buttonTokens: tokens$1
+  buttonTokens: tokens$2
 });
 
 var tagBackgroundRed = {
@@ -3927,7 +3927,7 @@ var tagHoverWarmGray = {
   g100: colors$1.warmGray70Hover
 };
 
-var tokens = /*#__PURE__*/Object.freeze({
+var tokens$1 = /*#__PURE__*/Object.freeze({
   __proto__: null,
   tagBackgroundRed: tagBackgroundRed,
   tagColorRed: tagColorRed,
@@ -3961,9 +3961,92 @@ var tokens = /*#__PURE__*/Object.freeze({
   tagHoverWarmGray: tagHoverWarmGray
 });
 
+var index$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  tagTokens: tokens$1
+});
+
+var notificationBackgroundError = {
+  whiteTheme: colors$1.red10,
+  g10: colors$1.red10,
+  g90: colors$1.gray80,
+  g100: colors$1.gray90
+};
+var notificationBackgroundSuccess = {
+  whiteTheme: colors$1.green10,
+  g10: colors$1.green10,
+  g90: colors$1.gray80,
+  g100: colors$1.gray90
+};
+var notificationBackgroundInfo = {
+  whiteTheme: colors$1.blue10,
+  g10: colors$1.blue10,
+  g90: colors$1.gray80,
+  g100: colors$1.gray90
+};
+var colorMap = {
+  yellow30: colors$1.yellow30,
+  white0: colors$1.white0
+};
+var notificationBackgroundWarning = {
+  whiteTheme: colorMap,
+  g10: colorMap,
+  g90: colors$1.gray80,
+  g100: colors$1.gray90
+};
+var notificationActionHover = {
+  whiteTheme: colors$1.white0,
+  g10: colors$1.white0
+};
+var notificationActionTertiaryInverse = {
+  whiteTheme: buttonTertiary.g100,
+  g10: buttonTertiary.g90,
+  g90: buttonTertiary.g10,
+  g100: buttonTertiary.whiteTheme
+};
+var notificationActionTertiaryInverseActive = {
+  whiteTheme: buttonTertiaryActive.g100,
+  g10: buttonTertiaryActive.g90,
+  g90: buttonTertiaryActive.g10,
+  g100: buttonTertiaryActive.whiteTheme
+};
+var notificationActionTertiaryInverseHover = {
+  whiteTheme: buttonTertiaryHover.g100,
+  g10: buttonTertiaryHover.g90,
+  g90: buttonTertiaryHover.g10,
+  g100: buttonTertiaryHover.whiteTheme
+};
+var notificationActionTertiaryInverseText = {
+  whiteTheme: textInverse$4,
+  g10: textInverse$5,
+  g90: textInverse$6,
+  g100: textInverse$7
+};
+var notificationActionTertiaryInverseTextOnColorDisabled = {
+  whiteTheme: textOnColorDisabled$4,
+  g10: textOnColorDisabled$5,
+  g90: textOnColorDisabled$6,
+  g100: textOnColorDisabled$7
+};
+
+var tokens = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  notificationBackgroundError: notificationBackgroundError,
+  notificationBackgroundSuccess: notificationBackgroundSuccess,
+  notificationBackgroundInfo: notificationBackgroundInfo,
+  colorMap: colorMap,
+  notificationBackgroundWarning: notificationBackgroundWarning,
+  notificationActionHover: notificationActionHover,
+  notificationActionTertiaryInverse: notificationActionTertiaryInverse,
+  notificationActionTertiaryInverseActive: notificationActionTertiaryInverseActive,
+  notificationActionTertiaryInverseHover: notificationActionTertiaryInverseHover,
+  notificationActionTertiaryInverseText: notificationActionTertiaryInverseText,
+  notificationActionTertiaryInverseTextOnColorDisabled: notificationActionTertiaryInverseTextOnColorDisabled
+});
+
 var index = /*#__PURE__*/Object.freeze({
   __proto__: null,
-  tagTokens: tokens
+  notificationTokens: tokens
 });
 
 /**
@@ -4929,7 +5012,7 @@ exports.borderSubtle03 = borderSubtle03$3;
 exports.borderSubtleSelected01 = borderSubtleSelected01$3;
 exports.borderSubtleSelected02 = borderSubtleSelected02$3;
 exports.borderSubtleSelected03 = borderSubtleSelected03$3;
-exports.buttonTokens = index$1;
+exports.buttonTokens = index$2;
 exports.field01 = field01$7;
 exports.field02 = field02$7;
 exports.field03 = field03$3;
@@ -4984,6 +5067,7 @@ exports.linkPrimary = linkPrimary$7;
 exports.linkPrimaryHover = linkPrimaryHover$7;
 exports.linkSecondary = linkSecondary$7;
 exports.linkVisited = linkVisited$7;
+exports.notificationTokens = index;
 exports.overlay = overlay$7;
 exports.shadow = shadow$7;
 exports.skeletonBackground = skeletonBackground$7;
@@ -4999,7 +5083,7 @@ exports.supportSuccess = supportSuccess$7;
 exports.supportSuccessInverse = supportSuccessInverse$7;
 exports.supportWarning = supportWarning$7;
 exports.supportWarningInverse = supportWarningInverse$7;
-exports.tagTokens = index;
+exports.tagTokens = index$1;
 exports.textDisabled = textDisabled$7;
 exports.textError = textError$7;
 exports.textHelper = textHelper$7;
@@ -5012,5 +5096,5 @@ exports.textSecondary = textSecondary$7;
 exports.themes = themes;
 exports.toggleOff = toggleOff$7;
 exports.unstable_metadata = unstable_metadata;
-exports.v10 = index$2;
+exports.v10 = index$3;
 exports.white = white$1;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/themes",
   "description": "Themes for applying color in the Carbon Design System",
-  "version": "11.11.0-rc.0",
+  "version": "11.11.1-rc.0",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -29,9 +29,9 @@
     "build": "yarn clean && carbon-cli bundle src/index.js --name CarbonThemes && babel-node --presets '@babel/preset-env' tasks/build.js && carbon-cli check \"scss/*.scss\""
   },
   "dependencies": {
-    "@carbon/colors": "^11.7.0-rc.0",
+    "@carbon/colors": "^11.7.1-rc.0",
     "@carbon/layout": "^11.7.0",
-    "@carbon/type": "^11.11.0-rc.0",
+    "@carbon/type": "^11.11.0",
     "color": "^4.0.0"
   },
   "devDependencies": {
@@ -48,5 +48,5 @@
     "rimraf": "^3.0.0"
   },
   "sideEffects": false,
-  "gitHead": "a55b418b5a33d88d224b9c35f62ebd09c9586764"
+  "gitHead": "01475a0713de3b5243b747ffe7036f652ae5c22f"
 }

package/scss/_component-tokens.scss

@@ -7,3 +7,4 @@
 
 @forward 'generated/button-tokens';
 @forward 'generated/tag-tokens';
+@forward 'generated/notification-tokens';

package/scss/generated/_notification-tokens.scss

@@ -0,0 +1,88 @@
+// Code generated by @carbon/themes. DO NOT EDIT.
+//
+// Copyright IBM Corp. 2018, 2019
+//
+// This source code is licensed under the Apache-2.0 license found in the
+// LICENSE file in the root directory of this source tree.
+//
+
+@use 'sass:map';
+
+$color-map: (
+  yellow-30: #f1c21b,
+  white-0: #ffffff,
+) !default;
+
+$notification-action-hover: (
+  white-theme: #ffffff,
+  g-10: #ffffff,
+) !default;
+
+$notification-action-tertiary-inverse: (
+  white-theme: #ffffff,
+  g-10: #ffffff,
+  g-90: #0f62fe,
+  g-100: #0f62fe,
+) !default;
+
+$notification-action-tertiary-inverse-active: (
+  white-theme: #c6c6c6,
+  g-10: #c6c6c6,
+  g-90: #002d9c,
+  g-100: #002d9c,
+) !default;
+
+$notification-action-tertiary-inverse-hover: (
+  white-theme: #f4f4f4,
+  g-10: #f4f4f4,
+  g-90: #0050e6,
+  g-100: #0050e6,
+) !default;
+
+$notification-action-tertiary-inverse-text: (
+  white-theme: #161616,
+  g-10: #161616,
+  g-90: #ffffff,
+  g-100: #ffffff,
+) !default;
+
+$notification-action-tertiary-inverse-text-on-color-disabled: (
+  white-theme: rgba(255, 255, 255, 0.25),
+  g-10: rgba(255, 255, 255, 0.25),
+  g-90: #8d8d8d,
+  g-100: #8d8d8d,
+) !default;
+
+$notification-background-error: (
+  white-theme: #fff1f1,
+  g-10: #fff1f1,
+  g-90: #393939,
+  g-100: #262626,
+) !default;
+
+$notification-background-info: (
+  white-theme: #edf5ff,
+  g-10: #edf5ff,
+  g-90: #393939,
+  g-100: #262626,
+) !default;
+
+$notification-background-success: (
+  white-theme: #defbe6,
+  g-10: #defbe6,
+  g-90: #393939,
+  g-100: #262626,
+) !default;
+
+$notification-background-warning: (
+  white-theme: (
+    yellow-30: #f1c21b,
+    white-0: #ffffff,
+  ),
+  g-10: (
+    yellow-30: #f1c21b,
+    white-0: #ffffff,
+  ),
+  g-90: #393939,
+  g-100: #262626,
+) !default;

package/src/component-tokens/notification/index.js

@@ -0,0 +1 @@
+export * as notificationTokens from './tokens';

package/src/component-tokens/notification/tokens.js

@@ -0,0 +1,103 @@
+import {
+  red10,
+  gray80,
+  gray90,
+  green10,
+  blue10,
+  yellow30,
+  white0,
+} from '@carbon/colors';
+import {
+  textInverse as textInverseWhite,
+  textOnColorDisabled as textOnColorDisabledWhite,
+} from '../../white';
+import {
+  textInverse as textInverseG10,
+  textOnColorDisabled as textOnColorDisabledG10,
+} from '../../g10';
+import {
+  textInverse as textInverseG90,
+  textOnColorDisabled as textOnColorDisabledG90,
+} from '../../g90';
+import {
+  textInverse as textInverseG100,
+  textOnColorDisabled as textOnColorDisabledG100,
+} from '../../g100';
+import {
+  buttonTertiaryActive,
+  buttonTertiaryHover,
+  buttonTertiary,
+} from '../button/tokens';
+
+export const notificationBackgroundError = {
+  whiteTheme: red10,
+  g10: red10,
+  g90: gray80,
+  g100: gray90,
+};
+
+export const notificationBackgroundSuccess = {
+  whiteTheme: green10,
+  g10: green10,
+  g90: gray80,
+  g100: gray90,
+};
+
+export const notificationBackgroundInfo = {
+  whiteTheme: blue10,
+  g10: blue10,
+  g90: gray80,
+  g100: gray90,
+};
+
+export const colorMap = {
+  yellow30,
+  white0,
+};
+
+export const notificationBackgroundWarning = {
+  whiteTheme: colorMap,
+  g10: colorMap,
+  g90: gray80,
+  g100: gray90,
+};
+
+export const notificationActionHover = {
+  whiteTheme: white0,
+  g10: white0,
+};
+
+export const notificationActionTertiaryInverse = {
+  whiteTheme: buttonTertiary.g100,
+  g10: buttonTertiary.g90,
+  g90: buttonTertiary.g10,
+  g100: buttonTertiary.whiteTheme,
+};
+
+export const notificationActionTertiaryInverseActive = {
+  whiteTheme: buttonTertiaryActive.g100,
+  g10: buttonTertiaryActive.g90,
+  g90: buttonTertiaryActive.g10,
+  g100: buttonTertiaryActive.whiteTheme,
+};
+
+export const notificationActionTertiaryInverseHover = {
+  whiteTheme: buttonTertiaryHover.g100,
+  g10: buttonTertiaryHover.g90,
+  g90: buttonTertiaryHover.g10,
+  g100: buttonTertiaryHover.whiteTheme,
+};
+
+export const notificationActionTertiaryInverseText = {
+  whiteTheme: textInverseG100,
+  g10: textInverseG90,
+  g90: textInverseG10,
+  g100: textInverseWhite,
+};
+
+export const notificationActionTertiaryInverseTextOnColorDisabled = {
+  whiteTheme: textOnColorDisabledG100,
+  g10: textOnColorDisabledG90,
+  g90: textOnColorDisabledG10,
+  g100: textOnColorDisabledWhite,
+};

package/src/index.js

@@ -12,6 +12,7 @@ import * as g100 from './g100';
 import * as v10 from './v10';
 import * as buttonTokens from './component-tokens/button';
 import * as tagTokens from './component-tokens/tag';
+import * as notificationTokens from './component-tokens/notification';
 import { formatTokenName } from './tools';
 import { unstable_metadata } from './tokens';
 
@@ -32,6 +33,7 @@ export {
   v10,
   buttonTokens,
   tagTokens,
+  notificationTokens,
   unstable_metadata,
   formatTokenName,
 };

package/umd/index.js

@@ -3363,7 +3363,7 @@
   // TO-DO: remove fallback color when v11 is released and assign carbon colors to new tokens
   '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', 'shadow', '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', 'borderDisabled', 'textDisabled', 'buttonDisabled', 'iconDisabled', 'textOnColorDisabled', 'iconOnColorDisabled', 'layerSelectedDisabled', 'skeletonBackground', 'skeletonElement', // Deprecated
   'brand01', 'brand02', 'brand03', 'active01', 'hoverField', 'danger'];
-  var tokens$2 = {
+  var tokens$3 = {
     colors: colors,
     type: type$2.unstable_tokens,
     layout: layout$2.unstable_tokens
@@ -3382,14 +3382,14 @@
     g100: g100
   };
 
-  var index$2 = /*#__PURE__*/Object.freeze({
+  var index$3 = /*#__PURE__*/Object.freeze({
     __proto__: null,
     white: white,
     g10: g10,
     g90: g90,
     g100: g100,
     themes: themes$1,
-    tokens: tokens$2,
+    tokens: tokens$3,
     caption01: type$2.caption01,
     caption02: type$2.caption02,
     label01: type$2.label01,
@@ -3719,7 +3719,7 @@
     g100: 'rgb(141 141 141 / 30%)'
   };
 
-  var tokens$1 = /*#__PURE__*/Object.freeze({
+  var tokens$2 = /*#__PURE__*/Object.freeze({
     __proto__: null,
     buttonSeparator: buttonSeparator,
     buttonPrimary: buttonPrimary,
@@ -3738,9 +3738,9 @@
     buttonDisabled: buttonDisabled
   });
 
-  var index$1 = /*#__PURE__*/Object.freeze({
+  var index$2 = /*#__PURE__*/Object.freeze({
     __proto__: null,
-    buttonTokens: tokens$1
+    buttonTokens: tokens$2
   });
 
   var tagBackgroundRed = {
@@ -3924,7 +3924,7 @@
     g100: colors$1.warmGray70Hover
   };
 
-  var tokens = /*#__PURE__*/Object.freeze({
+  var tokens$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
     tagBackgroundRed: tagBackgroundRed,
     tagColorRed: tagColorRed,
@@ -3958,9 +3958,92 @@
     tagHoverWarmGray: tagHoverWarmGray
   });
 
+  var index$1 = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    tagTokens: tokens$1
+  });
+
+  var notificationBackgroundError = {
+    whiteTheme: colors$1.red10,
+    g10: colors$1.red10,
+    g90: colors$1.gray80,
+    g100: colors$1.gray90
+  };
+  var notificationBackgroundSuccess = {
+    whiteTheme: colors$1.green10,
+    g10: colors$1.green10,
+    g90: colors$1.gray80,
+    g100: colors$1.gray90
+  };
+  var notificationBackgroundInfo = {
+    whiteTheme: colors$1.blue10,
+    g10: colors$1.blue10,
+    g90: colors$1.gray80,
+    g100: colors$1.gray90
+  };
+  var colorMap = {
+    yellow30: colors$1.yellow30,
+    white0: colors$1.white0
+  };
+  var notificationBackgroundWarning = {
+    whiteTheme: colorMap,
+    g10: colorMap,
+    g90: colors$1.gray80,
+    g100: colors$1.gray90
+  };
+  var notificationActionHover = {
+    whiteTheme: colors$1.white0,
+    g10: colors$1.white0
+  };
+  var notificationActionTertiaryInverse = {
+    whiteTheme: buttonTertiary.g100,
+    g10: buttonTertiary.g90,
+    g90: buttonTertiary.g10,
+    g100: buttonTertiary.whiteTheme
+  };
+  var notificationActionTertiaryInverseActive = {
+    whiteTheme: buttonTertiaryActive.g100,
+    g10: buttonTertiaryActive.g90,
+    g90: buttonTertiaryActive.g10,
+    g100: buttonTertiaryActive.whiteTheme
+  };
+  var notificationActionTertiaryInverseHover = {
+    whiteTheme: buttonTertiaryHover.g100,
+    g10: buttonTertiaryHover.g90,
+    g90: buttonTertiaryHover.g10,
+    g100: buttonTertiaryHover.whiteTheme
+  };
+  var notificationActionTertiaryInverseText = {
+    whiteTheme: textInverse$4,
+    g10: textInverse$5,
+    g90: textInverse$6,
+    g100: textInverse$7
+  };
+  var notificationActionTertiaryInverseTextOnColorDisabled = {
+    whiteTheme: textOnColorDisabled$4,
+    g10: textOnColorDisabled$5,
+    g90: textOnColorDisabled$6,
+    g100: textOnColorDisabled$7
+  };
+
+  var tokens = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    notificationBackgroundError: notificationBackgroundError,
+    notificationBackgroundSuccess: notificationBackgroundSuccess,
+    notificationBackgroundInfo: notificationBackgroundInfo,
+    colorMap: colorMap,
+    notificationBackgroundWarning: notificationBackgroundWarning,
+    notificationActionHover: notificationActionHover,
+    notificationActionTertiaryInverse: notificationActionTertiaryInverse,
+    notificationActionTertiaryInverseActive: notificationActionTertiaryInverseActive,
+    notificationActionTertiaryInverseHover: notificationActionTertiaryInverseHover,
+    notificationActionTertiaryInverseText: notificationActionTertiaryInverseText,
+    notificationActionTertiaryInverseTextOnColorDisabled: notificationActionTertiaryInverseTextOnColorDisabled
+  });
+
   var index = /*#__PURE__*/Object.freeze({
     __proto__: null,
-    tagTokens: tokens
+    notificationTokens: tokens
   });
 
   /**
@@ -4926,7 +5009,7 @@
   exports.borderSubtleSelected01 = borderSubtleSelected01$3;
   exports.borderSubtleSelected02 = borderSubtleSelected02$3;
   exports.borderSubtleSelected03 = borderSubtleSelected03$3;
-  exports.buttonTokens = index$1;
+  exports.buttonTokens = index$2;
   exports.field01 = field01$7;
   exports.field02 = field02$7;
   exports.field03 = field03$3;
@@ -4981,6 +5064,7 @@
   exports.linkPrimaryHover = linkPrimaryHover$7;
   exports.linkSecondary = linkSecondary$7;
   exports.linkVisited = linkVisited$7;
+  exports.notificationTokens = index;
   exports.overlay = overlay$7;
   exports.shadow = shadow$7;
   exports.skeletonBackground = skeletonBackground$7;
@@ -4996,7 +5080,7 @@
   exports.supportSuccessInverse = supportSuccessInverse$7;
   exports.supportWarning = supportWarning$7;
   exports.supportWarningInverse = supportWarningInverse$7;
-  exports.tagTokens = index;
+  exports.tagTokens = index$1;
   exports.textDisabled = textDisabled$7;
   exports.textError = textError$7;
   exports.textHelper = textHelper$7;
@@ -5009,7 +5093,7 @@
   exports.themes = themes;
   exports.toggleOff = toggleOff$7;
   exports.unstable_metadata = unstable_metadata;
-  exports.v10 = index$2;
+  exports.v10 = index$3;
   exports.white = white$1;
 
   Object.defineProperty(exports, '__esModule', { value: true });