@carbon/themes 11.26.0 → 11.27.0

package/es/index.js

@@ -1,4 +1,4 @@
-import { white as white$2, gray80, blue60, gray80Hover, gray10, gray30, gray10Hover, gray20, gray20Hover, whiteHover, gray100, gray50, gray40, gray70, gray60, red60, blue70, blue40, purple60, blue30, green50, yellow30, red50, green40, blue50, orange40, blue20, rgba, blue10, gray90, gray70Hover, gray60Hover, gray50Hover, red30, purple40, red40, purple50, gray90Hover, black, gray30Hover, blue80, green60, red80, red20, red70, red20Hover, red70Hover, magenta20, magenta70, magenta80, magenta20Hover, magenta70Hover, purple20, purple70, purple80, purple20Hover, purple70Hover, blue20Hover, blue70Hover, cyan20, cyan70, cyan80, cyan20Hover, cyan70Hover, teal20, teal70, teal80, teal20Hover, teal70Hover, green20, green70, green80, green20Hover, green70Hover, coolGray20, coolGray70, coolGray80, coolGray20Hover, coolGray70Hover, warmGray20, warmGray70, warmGray80, warmGray20Hover, warmGray70Hover, red10, green10, white0 } from '@carbon/colors';
+import { white as white$2, gray80, blue60, gray80Hover, gray10, gray30, gray10Hover, gray20, gray20Hover, whiteHover, gray100, gray50, gray40, gray70, gray60, red60, blue70, blue40, purple60, blue30, green50, yellow30, red50, green40, blue50, orange40, blue20, rgba, blue10, coolGray10, gray90, gray70Hover, gray60Hover, gray50Hover, red30, purple40, red40, purple50, gray90Hover, black, gray30Hover, blue80, green60, red80, red20, red70, red20Hover, red70Hover, magenta20, magenta70, magenta80, magenta20Hover, magenta70Hover, purple20, purple70, purple80, purple20Hover, purple70Hover, blue20Hover, blue70Hover, cyan20, cyan70, cyan80, cyan20Hover, cyan70Hover, teal20, teal70, teal80, teal20Hover, teal70Hover, green20, green70, green80, green20Hover, green70Hover, coolGray20, coolGray70, coolGray80, coolGray20Hover, coolGray70Hover, warmGray20, warmGray70, warmGray80, warmGray20Hover, warmGray70Hover, red10, green10, 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';
@@ -683,7 +683,8 @@ var overlay$7 = 'rgba(22, 22, 22, 0.5)';
 var toggleOff$7 = gray50;
 var shadow$7 = 'rgba(0, 0, 0, 0.3)';
 
-// AI
+//// AI - Experimental (Use at your own risk)
+// Slug tokens
 var slugBackground$3 = gray70;
 var slugGradient$3 = "".concat(gray100, " linear-gradient(135deg, ").concat(gray40, " 0%, rgba(").concat(white$2, ", 0) 100%)");
 var slugBackgroundHover$3 = gray60;
@@ -693,6 +694,10 @@ var slugCalloutGradientTop$3 = rgba(gray10, 0.85);
 var slugCalloutGradientBottom$3 = rgba(gray20, 0.85);
 var slugCalloutAuraStart$3 = rgba(blue10, 0.6);
 var slugCalloutAuraEnd$3 = rgba(white$2, 0);
+// Linear gradient tokens
+var aiGradientStart01$3 = rgba(coolGray10, 0.5);
+var aiGradientStart02$3 = rgba(blue10, 0.5);
+var aiGradientEnd$3 = rgba(white$2, 0);
 
 var white$1 = /*#__PURE__*/Object.freeze({
   __proto__: null,
@@ -805,6 +810,9 @@ var white$1 = /*#__PURE__*/Object.freeze({
   slugCalloutGradientBottom: slugCalloutGradientBottom$3,
   slugCalloutAuraStart: slugCalloutAuraStart$3,
   slugCalloutAuraEnd: slugCalloutAuraEnd$3,
+  aiGradientStart01: aiGradientStart01$3,
+  aiGradientStart02: aiGradientStart02$3,
+  aiGradientEnd: aiGradientEnd$3,
   caption01: caption01,
   caption02: caption02,
   label01: label01,
@@ -1042,7 +1050,8 @@ var overlay$6 = 'rgba(22, 22, 22, 0.5)';
 var toggleOff$6 = gray50;
 var shadow$6 = 'rgba(0, 0, 0, 0.3)';
 
-// AI
+//// AI - Experimental (Use at your own risk)
+// Slug tokens
 var slugBackground$2 = gray70;
 var slugGradient$2 = "".concat(gray100, " linear-gradient(135deg, ").concat(gray40, " 0%, rgba(").concat(white$2, ", 0) 100%)");
 var slugBackgroundHover$2 = gray60;
@@ -1052,6 +1061,10 @@ var slugCalloutGradientTop$2 = rgba(gray10, 0.85);
 var slugCalloutGradientBottom$2 = rgba(gray20, 0.85);
 var slugCalloutAuraStart$2 = rgba(blue10, 0.6);
 var slugCalloutAuraEnd$2 = rgba(white$2, 0);
+// Linear gradient tokens
+var aiGradientStart01$2 = rgba(coolGray10, 0.5);
+var aiGradientStart02$2 = rgba(blue10, 0.5);
+var aiGradientEnd$2 = rgba(white$2, 0);
 
 var g10$1 = /*#__PURE__*/Object.freeze({
   __proto__: null,
@@ -1164,6 +1177,9 @@ var g10$1 = /*#__PURE__*/Object.freeze({
   slugCalloutGradientBottom: slugCalloutGradientBottom$2,
   slugCalloutAuraStart: slugCalloutAuraStart$2,
   slugCalloutAuraEnd: slugCalloutAuraEnd$2,
+  aiGradientStart01: aiGradientStart01$2,
+  aiGradientStart02: aiGradientStart02$2,
+  aiGradientEnd: aiGradientEnd$2,
   caption01: caption01,
   caption02: caption02,
   label01: label01,
@@ -1401,7 +1417,8 @@ var overlay$5 = rgba(black, 0.65);
 var toggleOff$5 = gray50;
 var shadow$5 = rgba(black, 0.8);
 
-// AI
+//// AI - Experimental (Use at your own risk)
+// Slug tokens
 var slugBackground$1 = gray30;
 var slugGradient$1 = "".concat(gray50, " linear-gradient(135deg, ").concat(gray10, " 0%, rgba(").concat(white$2, ", 0) 100%)");
 var slugBackgroundHover$1 = gray20;
@@ -1411,6 +1428,10 @@ var slugCalloutGradientTop$1 = rgba(gray100, 0.85);
 var slugCalloutGradientBottom$1 = rgba(gray90, 0.85);
 var slugCalloutAuraStart$1 = rgba(blue20, 0.2);
 var slugCalloutAuraEnd$1 = rgba(gray100, 0);
+// Linear gradient tokens
+var aiGradientStart01$1 = rgba(blue20, 0.2);
+var aiGradientStart02$1 = 'transparent';
+var aiGradientEnd$1 = 'rgba(38, 38, 38, 0)';
 
 var g90$1 = /*#__PURE__*/Object.freeze({
   __proto__: null,
@@ -1523,6 +1544,9 @@ var g90$1 = /*#__PURE__*/Object.freeze({
   slugCalloutGradientBottom: slugCalloutGradientBottom$1,
   slugCalloutAuraStart: slugCalloutAuraStart$1,
   slugCalloutAuraEnd: slugCalloutAuraEnd$1,
+  aiGradientStart01: aiGradientStart01$1,
+  aiGradientStart02: aiGradientStart02$1,
+  aiGradientEnd: aiGradientEnd$1,
   caption01: caption01,
   caption02: caption02,
   label01: label01,
@@ -1760,7 +1784,8 @@ var overlay$4 = rgba(black, 0.65);
 var toggleOff$4 = gray60;
 var shadow$4 = rgba(black, 0.8);
 
-// AI
+//// AI - Experimental (Use at your own risk)
+// Slug tokens
 var slugBackground = gray30;
 var slugGradient = "".concat(gray50, " linear-gradient(135deg, ").concat(gray10, " 0%, rgba(").concat(white$2, ", 0) 100%)");
 var slugBackgroundHover = gray20;
@@ -1770,6 +1795,10 @@ var slugCalloutGradientTop = rgba(gray100, 0.85);
 var slugCalloutGradientBottom = rgba(gray90, 0.85);
 var slugCalloutAuraStart = rgba(blue20, 0.2);
 var slugCalloutAuraEnd = rgba(gray100, 0);
+// Linear gradient tokens
+var aiGradientStart01 = rgba(blue20, 0.2);
+var aiGradientStart02 = 'transparent';
+var aiGradientEnd = 'rgba(38, 38, 38, 0)';
 
 var g100$1 = /*#__PURE__*/Object.freeze({
   __proto__: null,
@@ -1882,6 +1911,9 @@ var g100$1 = /*#__PURE__*/Object.freeze({
   slugCalloutGradientBottom: slugCalloutGradientBottom,
   slugCalloutAuraStart: slugCalloutAuraStart,
   slugCalloutAuraEnd: slugCalloutAuraEnd,
+  aiGradientStart01: aiGradientStart01,
+  aiGradientStart02: aiGradientStart02,
+  aiGradientEnd: aiGradientEnd,
   caption01: caption01,
   caption02: caption02,
   label01: label01,
@@ -4778,7 +4810,7 @@ var contextual = TokenGroup.create({
 var ai = TokenGroup.create({
   name: 'AI',
   properties: ['background'],
-  tokens: ['slug-background', 'slug-gradient', 'slug-background-hover', 'slug-gradient-hover', 'slug-hollow-hover', 'slug-callout-gradient-top', 'slug-callout-gradient-bottom', 'slug-callout-aura-start', 'slug-callout-aura-end']
+  tokens: ['slug-background', 'slug-gradient', 'slug-background-hover', 'slug-gradient-hover', 'slug-hollow-hover', 'slug-callout-gradient-top', 'slug-callout-gradient-bottom', 'slug-callout-aura-start', 'slug-callout-aura-end', 'ai-gradient-start-01', 'ai-gradient-start-02', 'ai-gradient-end']
 });
 var group = TokenGroup.create({
   name: 'All',
@@ -4934,4 +4966,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, borderTile01$3 as borderTile01, borderTile02$3 as borderTile02, borderTile03$3 as borderTile03, 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, iconInteractive$3 as iconInteractive, 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, slugBackground$3 as slugBackground, slugBackgroundHover$3 as slugBackgroundHover, slugCalloutAuraEnd$3 as slugCalloutAuraEnd, slugCalloutAuraStart$3 as slugCalloutAuraStart, slugCalloutGradientBottom$3 as slugCalloutGradientBottom, slugCalloutGradientTop$3 as slugCalloutGradientTop, slugGradient$3 as slugGradient, slugGradientHover$3 as slugGradientHover, slugHollowHover$3 as slugHollowHover, 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 };
+export { aiGradientEnd$3 as aiGradientEnd, aiGradientStart01$3 as aiGradientStart01, aiGradientStart02$3 as aiGradientStart02, 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, borderTile01$3 as borderTile01, borderTile02$3 as borderTile02, borderTile03$3 as borderTile03, 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, iconInteractive$3 as iconInteractive, 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, slugBackground$3 as slugBackground, slugBackgroundHover$3 as slugBackgroundHover, slugCalloutAuraEnd$3 as slugCalloutAuraEnd, slugCalloutAuraStart$3 as slugCalloutAuraStart, slugCalloutGradientBottom$3 as slugCalloutGradientBottom, slugCalloutGradientTop$3 as slugCalloutGradientTop, slugGradient$3 as slugGradient, slugGradientHover$3 as slugGradientHover, slugHollowHover$3 as slugHollowHover, 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

@@ -689,7 +689,8 @@ var overlay$7 = 'rgba(22, 22, 22, 0.5)';
 var toggleOff$7 = colors$1.gray50;
 var shadow$7 = 'rgba(0, 0, 0, 0.3)';
 
-// AI
+//// AI - Experimental (Use at your own risk)
+// Slug tokens
 var slugBackground$3 = colors$1.gray70;
 var slugGradient$3 = "".concat(colors$1.gray100, " linear-gradient(135deg, ").concat(colors$1.gray40, " 0%, rgba(").concat(colors$1.white, ", 0) 100%)");
 var slugBackgroundHover$3 = colors$1.gray60;
@@ -699,6 +700,10 @@ var slugCalloutGradientTop$3 = colors$1.rgba(colors$1.gray10, 0.85);
 var slugCalloutGradientBottom$3 = colors$1.rgba(colors$1.gray20, 0.85);
 var slugCalloutAuraStart$3 = colors$1.rgba(colors$1.blue10, 0.6);
 var slugCalloutAuraEnd$3 = colors$1.rgba(colors$1.white, 0);
+// Linear gradient tokens
+var aiGradientStart01$3 = colors$1.rgba(colors$1.coolGray10, 0.5);
+var aiGradientStart02$3 = colors$1.rgba(colors$1.blue10, 0.5);
+var aiGradientEnd$3 = colors$1.rgba(colors$1.white, 0);
 
 var white$1 = /*#__PURE__*/Object.freeze({
   __proto__: null,
@@ -811,6 +816,9 @@ var white$1 = /*#__PURE__*/Object.freeze({
   slugCalloutGradientBottom: slugCalloutGradientBottom$3,
   slugCalloutAuraStart: slugCalloutAuraStart$3,
   slugCalloutAuraEnd: slugCalloutAuraEnd$3,
+  aiGradientStart01: aiGradientStart01$3,
+  aiGradientStart02: aiGradientStart02$3,
+  aiGradientEnd: aiGradientEnd$3,
   caption01: type$2.caption01,
   caption02: type$2.caption02,
   label01: type$2.label01,
@@ -1048,7 +1056,8 @@ var overlay$6 = 'rgba(22, 22, 22, 0.5)';
 var toggleOff$6 = colors$1.gray50;
 var shadow$6 = 'rgba(0, 0, 0, 0.3)';
 
-// AI
+//// AI - Experimental (Use at your own risk)
+// Slug tokens
 var slugBackground$2 = colors$1.gray70;
 var slugGradient$2 = "".concat(colors$1.gray100, " linear-gradient(135deg, ").concat(colors$1.gray40, " 0%, rgba(").concat(colors$1.white, ", 0) 100%)");
 var slugBackgroundHover$2 = colors$1.gray60;
@@ -1058,6 +1067,10 @@ var slugCalloutGradientTop$2 = colors$1.rgba(colors$1.gray10, 0.85);
 var slugCalloutGradientBottom$2 = colors$1.rgba(colors$1.gray20, 0.85);
 var slugCalloutAuraStart$2 = colors$1.rgba(colors$1.blue10, 0.6);
 var slugCalloutAuraEnd$2 = colors$1.rgba(colors$1.white, 0);
+// Linear gradient tokens
+var aiGradientStart01$2 = colors$1.rgba(colors$1.coolGray10, 0.5);
+var aiGradientStart02$2 = colors$1.rgba(colors$1.blue10, 0.5);
+var aiGradientEnd$2 = colors$1.rgba(colors$1.white, 0);
 
 var g10$1 = /*#__PURE__*/Object.freeze({
   __proto__: null,
@@ -1170,6 +1183,9 @@ var g10$1 = /*#__PURE__*/Object.freeze({
   slugCalloutGradientBottom: slugCalloutGradientBottom$2,
   slugCalloutAuraStart: slugCalloutAuraStart$2,
   slugCalloutAuraEnd: slugCalloutAuraEnd$2,
+  aiGradientStart01: aiGradientStart01$2,
+  aiGradientStart02: aiGradientStart02$2,
+  aiGradientEnd: aiGradientEnd$2,
   caption01: type$2.caption01,
   caption02: type$2.caption02,
   label01: type$2.label01,
@@ -1407,7 +1423,8 @@ var overlay$5 = colors$1.rgba(colors$1.black, 0.65);
 var toggleOff$5 = colors$1.gray50;
 var shadow$5 = colors$1.rgba(colors$1.black, 0.8);
 
-// AI
+//// AI - Experimental (Use at your own risk)
+// Slug tokens
 var slugBackground$1 = colors$1.gray30;
 var slugGradient$1 = "".concat(colors$1.gray50, " linear-gradient(135deg, ").concat(colors$1.gray10, " 0%, rgba(").concat(colors$1.white, ", 0) 100%)");
 var slugBackgroundHover$1 = colors$1.gray20;
@@ -1417,6 +1434,10 @@ var slugCalloutGradientTop$1 = colors$1.rgba(colors$1.gray100, 0.85);
 var slugCalloutGradientBottom$1 = colors$1.rgba(colors$1.gray90, 0.85);
 var slugCalloutAuraStart$1 = colors$1.rgba(colors$1.blue20, 0.2);
 var slugCalloutAuraEnd$1 = colors$1.rgba(colors$1.gray100, 0);
+// Linear gradient tokens
+var aiGradientStart01$1 = colors$1.rgba(colors$1.blue20, 0.2);
+var aiGradientStart02$1 = 'transparent';
+var aiGradientEnd$1 = 'rgba(38, 38, 38, 0)';
 
 var g90$1 = /*#__PURE__*/Object.freeze({
   __proto__: null,
@@ -1529,6 +1550,9 @@ var g90$1 = /*#__PURE__*/Object.freeze({
   slugCalloutGradientBottom: slugCalloutGradientBottom$1,
   slugCalloutAuraStart: slugCalloutAuraStart$1,
   slugCalloutAuraEnd: slugCalloutAuraEnd$1,
+  aiGradientStart01: aiGradientStart01$1,
+  aiGradientStart02: aiGradientStart02$1,
+  aiGradientEnd: aiGradientEnd$1,
   caption01: type$2.caption01,
   caption02: type$2.caption02,
   label01: type$2.label01,
@@ -1766,7 +1790,8 @@ var overlay$4 = colors$1.rgba(colors$1.black, 0.65);
 var toggleOff$4 = colors$1.gray60;
 var shadow$4 = colors$1.rgba(colors$1.black, 0.8);
 
-// AI
+//// AI - Experimental (Use at your own risk)
+// Slug tokens
 var slugBackground = colors$1.gray30;
 var slugGradient = "".concat(colors$1.gray50, " linear-gradient(135deg, ").concat(colors$1.gray10, " 0%, rgba(").concat(colors$1.white, ", 0) 100%)");
 var slugBackgroundHover = colors$1.gray20;
@@ -1776,6 +1801,10 @@ var slugCalloutGradientTop = colors$1.rgba(colors$1.gray100, 0.85);
 var slugCalloutGradientBottom = colors$1.rgba(colors$1.gray90, 0.85);
 var slugCalloutAuraStart = colors$1.rgba(colors$1.blue20, 0.2);
 var slugCalloutAuraEnd = colors$1.rgba(colors$1.gray100, 0);
+// Linear gradient tokens
+var aiGradientStart01 = colors$1.rgba(colors$1.blue20, 0.2);
+var aiGradientStart02 = 'transparent';
+var aiGradientEnd = 'rgba(38, 38, 38, 0)';
 
 var g100$1 = /*#__PURE__*/Object.freeze({
   __proto__: null,
@@ -1888,6 +1917,9 @@ var g100$1 = /*#__PURE__*/Object.freeze({
   slugCalloutGradientBottom: slugCalloutGradientBottom,
   slugCalloutAuraStart: slugCalloutAuraStart,
   slugCalloutAuraEnd: slugCalloutAuraEnd,
+  aiGradientStart01: aiGradientStart01,
+  aiGradientStart02: aiGradientStart02,
+  aiGradientEnd: aiGradientEnd,
   caption01: type$2.caption01,
   caption02: type$2.caption02,
   label01: type$2.label01,
@@ -4784,7 +4816,7 @@ var contextual = TokenGroup.create({
 var ai = TokenGroup.create({
   name: 'AI',
   properties: ['background'],
-  tokens: ['slug-background', 'slug-gradient', 'slug-background-hover', 'slug-gradient-hover', 'slug-hollow-hover', 'slug-callout-gradient-top', 'slug-callout-gradient-bottom', 'slug-callout-aura-start', 'slug-callout-aura-end']
+  tokens: ['slug-background', 'slug-gradient', 'slug-background-hover', 'slug-gradient-hover', 'slug-hollow-hover', 'slug-callout-gradient-top', 'slug-callout-gradient-bottom', 'slug-callout-aura-start', 'slug-callout-aura-end', 'ai-gradient-start-01', 'ai-gradient-start-02', 'ai-gradient-end']
 });
 var group = TokenGroup.create({
   name: 'All',
@@ -5224,6 +5256,9 @@ Object.defineProperty(exports, 'spacing13', {
   enumerable: true,
   get: function () { return layout$2.spacing13; }
 });
+exports.aiGradientEnd = aiGradientEnd$3;
+exports.aiGradientStart01 = aiGradientStart01$3;
+exports.aiGradientStart02 = aiGradientStart02$3;
 exports.background = background$8;
 exports.backgroundActive = backgroundActive$7;
 exports.backgroundBrand = backgroundBrand$7;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/themes",
   "description": "Themes for applying color in the Carbon Design System",
-  "version": "11.26.0",
+  "version": "11.27.0",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -49,5 +49,5 @@
     "rimraf": "^5.0.0"
   },
   "sideEffects": false,
-  "gitHead": "abe693e46a9b76731f51e47104f3634b6346f845"
+  "gitHead": "7e1982e232895b6223b88bca246f754ecd2609ac"
 }

package/scss/generated/_themes.scss

@@ -12,6 +12,9 @@
 @use '../utilities';
 
 $white: (
+  ai-gradient-end: rgba(255, 255, 255, 0),
+  ai-gradient-start-01: rgba(242, 244, 248, 0.5),
+  ai-gradient-start-02: rgba(237, 245, 255, 0.5),
   background: #ffffff,
   background-active: rgba(141, 141, 141, 0.5),
   background-brand: #0f62fe,
@@ -132,6 +135,9 @@ $white: utilities.merge(
 );
 
 $g10: (
+  ai-gradient-end: rgba(255, 255, 255, 0),
+  ai-gradient-start-01: rgba(242, 244, 248, 0.5),
+  ai-gradient-start-02: rgba(237, 245, 255, 0.5),
   background: #f4f4f4,
   background-active: rgba(141, 141, 141, 0.5),
   background-brand: #0f62fe,
@@ -252,6 +258,9 @@ $g10: utilities.merge(
 );
 
 $g90: (
+  ai-gradient-end: rgba(38, 38, 38, 0),
+  ai-gradient-start-01: rgba(208, 226, 255, 0.2),
+  ai-gradient-start-02: unquote('transparent'),
   background: #262626,
   background-active: rgba(141, 141, 141, 0.4),
   background-brand: #0f62fe,
@@ -372,6 +381,9 @@ $g90: utilities.merge(
 );
 
 $g100: (
+  ai-gradient-end: rgba(38, 38, 38, 0),
+  ai-gradient-start-01: rgba(208, 226, 255, 0.2),
+  ai-gradient-start-02: unquote('transparent'),
   background: #161616,
   background-active: rgba(141, 141, 141, 0.4),
   background-brand: #0f62fe,

package/scss/generated/_tokens.scss

@@ -319,6 +319,15 @@ $slug-callout-aura-start: _get('slug-callout-aura-start') !default;
 /// The CSS Custom Property for the `slug-callout-aura-end` token
 $slug-callout-aura-end: _get('slug-callout-aura-end') !default;
 
+/// The CSS Custom Property for the `ai-gradient-start-01` token
+$ai-gradient-start-01: _get('ai-gradient-start-01') !default;
+
+/// The CSS Custom Property for the `ai-gradient-start-02` token
+$ai-gradient-start-02: _get('ai-gradient-start-02') !default;
+
+/// The CSS Custom Property for the `ai-gradient-end` token
+$ai-gradient-end: _get('ai-gradient-end') !default;
+
 /// The CSS Custom Property for the `highlight` token
 $highlight: _get('highlight') !default;
 

package/src/g10.js

@@ -14,6 +14,9 @@ import {
   blue60,
   blue70,
 
+  // CoolGray
+  coolGray10,
+
   // Gray
   gray10,
   gray10Hover,
@@ -202,7 +205,8 @@ export const overlay = 'rgba(22, 22, 22, 0.5)';
 export const toggleOff = gray50;
 export const shadow = 'rgba(0, 0, 0, 0.3)';
 
-// AI
+//// AI - Experimental (Use at your own risk)
+// Slug tokens
 export const slugBackground = gray70;
 export const slugGradient = `${gray100} linear-gradient(135deg, ${gray40} 0%, rgba(${white}, 0) 100%)`;
 export const slugBackgroundHover = gray60;
@@ -212,6 +216,10 @@ export const slugCalloutGradientTop = rgba(gray10, 0.85);
 export const slugCalloutGradientBottom = rgba(gray20, 0.85);
 export const slugCalloutAuraStart = rgba(blue10, 0.6);
 export const slugCalloutAuraEnd = rgba(white, 0);
+// Linear gradient tokens
+export const aiGradientStart01 = rgba(coolGray10, 0.5);
+export const aiGradientStart02 = rgba(blue10, 0.5);
+export const aiGradientEnd = rgba(white, 0);
 
 export {
   // Type

package/src/g100.js

@@ -210,7 +210,8 @@ export const overlay = rgba(black, 0.65);
 export const toggleOff = gray60;
 export const shadow = rgba(black, 0.8);
 
-// AI
+//// AI - Experimental (Use at your own risk)
+// Slug tokens
 export const slugBackground = gray30;
 export const slugGradient = `${gray50} linear-gradient(135deg, ${gray10} 0%, rgba(${white}, 0) 100%)`;
 export const slugBackgroundHover = gray20;
@@ -220,6 +221,10 @@ export const slugCalloutGradientTop = rgba(gray100, 0.85);
 export const slugCalloutGradientBottom = rgba(gray90, 0.85);
 export const slugCalloutAuraStart = rgba(blue20, 0.2);
 export const slugCalloutAuraEnd = rgba(gray100, 0);
+// Linear gradient tokens
+export const aiGradientStart01 = rgba(blue20, 0.2);
+export const aiGradientStart02 = 'transparent';
+export const aiGradientEnd = 'rgba(38, 38, 38, 0)';
 
 export {
   // Type

package/src/g90.js

@@ -210,7 +210,8 @@ export const overlay = rgba(black, 0.65);
 export const toggleOff = gray50;
 export const shadow = rgba(black, 0.8);
 
-// AI
+//// AI - Experimental (Use at your own risk)
+// Slug tokens
 export const slugBackground = gray30;
 export const slugGradient = `${gray50} linear-gradient(135deg, ${gray10} 0%, rgba(${white}, 0) 100%)`;
 export const slugBackgroundHover = gray20;
@@ -220,6 +221,10 @@ export const slugCalloutGradientTop = rgba(gray100, 0.85);
 export const slugCalloutGradientBottom = rgba(gray90, 0.85);
 export const slugCalloutAuraStart = rgba(blue20, 0.2);
 export const slugCalloutAuraEnd = rgba(gray100, 0);
+// Linear gradient tokens
+export const aiGradientStart01 = rgba(blue20, 0.2);
+export const aiGradientStart02 = 'transparent';
+export const aiGradientEnd = 'rgba(38, 38, 38, 0)';
 
 export {
   // Type

package/src/tokens/v11TokenGroup.js

@@ -354,6 +354,9 @@ export const ai = TokenGroup.create({
     'slug-callout-gradient-bottom',
     'slug-callout-aura-start',
     'slug-callout-aura-end',
+    'ai-gradient-start-01',
+    'ai-gradient-start-02',
+    'ai-gradient-end',
   ],
 });
 

package/src/white.js

@@ -14,6 +14,9 @@ import {
   blue60,
   blue70,
 
+  // CoolGray
+  coolGray10,
+
   // Gray
   gray10,
   gray10Hover,
@@ -202,7 +205,8 @@ export const overlay = 'rgba(22, 22, 22, 0.5)';
 export const toggleOff = gray50;
 export const shadow = 'rgba(0, 0, 0, 0.3)';
 
-// AI
+//// AI - Experimental (Use at your own risk)
+// Slug tokens
 export const slugBackground = gray70;
 export const slugGradient = `${gray100} linear-gradient(135deg, ${gray40} 0%, rgba(${white}, 0) 100%)`;
 export const slugBackgroundHover = gray60;
@@ -212,6 +216,10 @@ export const slugCalloutGradientTop = rgba(gray10, 0.85);
 export const slugCalloutGradientBottom = rgba(gray20, 0.85);
 export const slugCalloutAuraStart = rgba(blue10, 0.6);
 export const slugCalloutAuraEnd = rgba(white, 0);
+// Linear gradient tokens
+export const aiGradientStart01 = rgba(coolGray10, 0.5);
+export const aiGradientStart02 = rgba(blue10, 0.5);
+export const aiGradientEnd = rgba(white, 0);
 
 // Type
 export {

package/umd/index.js

@@ -686,7 +686,8 @@
   var toggleOff$7 = colors$1.gray50;
   var shadow$7 = 'rgba(0, 0, 0, 0.3)';
 
-  // AI
+  //// AI - Experimental (Use at your own risk)
+  // Slug tokens
   var slugBackground$3 = colors$1.gray70;
   var slugGradient$3 = "".concat(colors$1.gray100, " linear-gradient(135deg, ").concat(colors$1.gray40, " 0%, rgba(").concat(colors$1.white, ", 0) 100%)");
   var slugBackgroundHover$3 = colors$1.gray60;
@@ -696,6 +697,10 @@
   var slugCalloutGradientBottom$3 = colors$1.rgba(colors$1.gray20, 0.85);
   var slugCalloutAuraStart$3 = colors$1.rgba(colors$1.blue10, 0.6);
   var slugCalloutAuraEnd$3 = colors$1.rgba(colors$1.white, 0);
+  // Linear gradient tokens
+  var aiGradientStart01$3 = colors$1.rgba(colors$1.coolGray10, 0.5);
+  var aiGradientStart02$3 = colors$1.rgba(colors$1.blue10, 0.5);
+  var aiGradientEnd$3 = colors$1.rgba(colors$1.white, 0);
 
   var white$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
@@ -808,6 +813,9 @@
     slugCalloutGradientBottom: slugCalloutGradientBottom$3,
     slugCalloutAuraStart: slugCalloutAuraStart$3,
     slugCalloutAuraEnd: slugCalloutAuraEnd$3,
+    aiGradientStart01: aiGradientStart01$3,
+    aiGradientStart02: aiGradientStart02$3,
+    aiGradientEnd: aiGradientEnd$3,
     caption01: type$2.caption01,
     caption02: type$2.caption02,
     label01: type$2.label01,
@@ -1045,7 +1053,8 @@
   var toggleOff$6 = colors$1.gray50;
   var shadow$6 = 'rgba(0, 0, 0, 0.3)';
 
-  // AI
+  //// AI - Experimental (Use at your own risk)
+  // Slug tokens
   var slugBackground$2 = colors$1.gray70;
   var slugGradient$2 = "".concat(colors$1.gray100, " linear-gradient(135deg, ").concat(colors$1.gray40, " 0%, rgba(").concat(colors$1.white, ", 0) 100%)");
   var slugBackgroundHover$2 = colors$1.gray60;
@@ -1055,6 +1064,10 @@
   var slugCalloutGradientBottom$2 = colors$1.rgba(colors$1.gray20, 0.85);
   var slugCalloutAuraStart$2 = colors$1.rgba(colors$1.blue10, 0.6);
   var slugCalloutAuraEnd$2 = colors$1.rgba(colors$1.white, 0);
+  // Linear gradient tokens
+  var aiGradientStart01$2 = colors$1.rgba(colors$1.coolGray10, 0.5);
+  var aiGradientStart02$2 = colors$1.rgba(colors$1.blue10, 0.5);
+  var aiGradientEnd$2 = colors$1.rgba(colors$1.white, 0);
 
   var g10$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
@@ -1167,6 +1180,9 @@
     slugCalloutGradientBottom: slugCalloutGradientBottom$2,
     slugCalloutAuraStart: slugCalloutAuraStart$2,
     slugCalloutAuraEnd: slugCalloutAuraEnd$2,
+    aiGradientStart01: aiGradientStart01$2,
+    aiGradientStart02: aiGradientStart02$2,
+    aiGradientEnd: aiGradientEnd$2,
     caption01: type$2.caption01,
     caption02: type$2.caption02,
     label01: type$2.label01,
@@ -1404,7 +1420,8 @@
   var toggleOff$5 = colors$1.gray50;
   var shadow$5 = colors$1.rgba(colors$1.black, 0.8);
 
-  // AI
+  //// AI - Experimental (Use at your own risk)
+  // Slug tokens
   var slugBackground$1 = colors$1.gray30;
   var slugGradient$1 = "".concat(colors$1.gray50, " linear-gradient(135deg, ").concat(colors$1.gray10, " 0%, rgba(").concat(colors$1.white, ", 0) 100%)");
   var slugBackgroundHover$1 = colors$1.gray20;
@@ -1414,6 +1431,10 @@
   var slugCalloutGradientBottom$1 = colors$1.rgba(colors$1.gray90, 0.85);
   var slugCalloutAuraStart$1 = colors$1.rgba(colors$1.blue20, 0.2);
   var slugCalloutAuraEnd$1 = colors$1.rgba(colors$1.gray100, 0);
+  // Linear gradient tokens
+  var aiGradientStart01$1 = colors$1.rgba(colors$1.blue20, 0.2);
+  var aiGradientStart02$1 = 'transparent';
+  var aiGradientEnd$1 = 'rgba(38, 38, 38, 0)';
 
   var g90$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
@@ -1526,6 +1547,9 @@
     slugCalloutGradientBottom: slugCalloutGradientBottom$1,
     slugCalloutAuraStart: slugCalloutAuraStart$1,
     slugCalloutAuraEnd: slugCalloutAuraEnd$1,
+    aiGradientStart01: aiGradientStart01$1,
+    aiGradientStart02: aiGradientStart02$1,
+    aiGradientEnd: aiGradientEnd$1,
     caption01: type$2.caption01,
     caption02: type$2.caption02,
     label01: type$2.label01,
@@ -1763,7 +1787,8 @@
   var toggleOff$4 = colors$1.gray60;
   var shadow$4 = colors$1.rgba(colors$1.black, 0.8);
 
-  // AI
+  //// AI - Experimental (Use at your own risk)
+  // Slug tokens
   var slugBackground = colors$1.gray30;
   var slugGradient = "".concat(colors$1.gray50, " linear-gradient(135deg, ").concat(colors$1.gray10, " 0%, rgba(").concat(colors$1.white, ", 0) 100%)");
   var slugBackgroundHover = colors$1.gray20;
@@ -1773,6 +1798,10 @@
   var slugCalloutGradientBottom = colors$1.rgba(colors$1.gray90, 0.85);
   var slugCalloutAuraStart = colors$1.rgba(colors$1.blue20, 0.2);
   var slugCalloutAuraEnd = colors$1.rgba(colors$1.gray100, 0);
+  // Linear gradient tokens
+  var aiGradientStart01 = colors$1.rgba(colors$1.blue20, 0.2);
+  var aiGradientStart02 = 'transparent';
+  var aiGradientEnd = 'rgba(38, 38, 38, 0)';
 
   var g100$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
@@ -1885,6 +1914,9 @@
     slugCalloutGradientBottom: slugCalloutGradientBottom,
     slugCalloutAuraStart: slugCalloutAuraStart,
     slugCalloutAuraEnd: slugCalloutAuraEnd,
+    aiGradientStart01: aiGradientStart01,
+    aiGradientStart02: aiGradientStart02,
+    aiGradientEnd: aiGradientEnd,
     caption01: type$2.caption01,
     caption02: type$2.caption02,
     label01: type$2.label01,
@@ -4781,7 +4813,7 @@
   var ai = TokenGroup.create({
     name: 'AI',
     properties: ['background'],
-    tokens: ['slug-background', 'slug-gradient', 'slug-background-hover', 'slug-gradient-hover', 'slug-hollow-hover', 'slug-callout-gradient-top', 'slug-callout-gradient-bottom', 'slug-callout-aura-start', 'slug-callout-aura-end']
+    tokens: ['slug-background', 'slug-gradient', 'slug-background-hover', 'slug-gradient-hover', 'slug-hollow-hover', 'slug-callout-gradient-top', 'slug-callout-gradient-bottom', 'slug-callout-aura-start', 'slug-callout-aura-end', 'ai-gradient-start-01', 'ai-gradient-start-02', 'ai-gradient-end']
   });
   var group = TokenGroup.create({
     name: 'All',
@@ -5221,6 +5253,9 @@
     enumerable: true,
     get: function () { return layout$2.spacing13; }
   });
+  exports.aiGradientEnd = aiGradientEnd$3;
+  exports.aiGradientStart01 = aiGradientStart01$3;
+  exports.aiGradientStart02 = aiGradientStart02$3;
   exports.background = background$8;
   exports.backgroundActive = backgroundActive$7;
   exports.backgroundBrand = backgroundBrand$7;