@carbon/themes 11.47.0 → 11.48.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, purple40, blue30, green50, yellow30, red50, green40, blue50, orange40, blue20, rgba, blue10, black, blue100, gray90, gray70Hover, gray60Hover, gray50Hover, red30, red40, purple50, gray90Hover, blue80, blue90, green60, red80, red20, red70, red20Hover, red70Hover, magenta20, magenta70, magenta20Hover, magenta70Hover, purple20, purple70, purple20Hover, purple70Hover, blue20Hover, blue70Hover, cyan20, cyan70, cyan20Hover, cyan70Hover, teal20, teal70, teal20Hover, teal70Hover, green20, green70, green20Hover, green70Hover, coolGray20, coolGray70, coolGray100, coolGray10, coolGray20Hover, coolGray70Hover, warmGray20, warmGray70, warmGray100, warmGray10, warmGray20Hover, warmGray70Hover, cyan40, cyan50, teal40, teal50, magenta40, magenta50, coolGray40, coolGray50, warmGray40, warmGray50, red10, green10, yellow10, 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, purple40, blue30, green50, yellow30, red50, green40, blue50, orange40, blue20, rgba, blue10, black, blue100, gray90, gray70Hover, gray60Hover, gray50Hover, red30, red40, purple50, gray90Hover, blue80, blue90, green60, red80, red20, red70, red20Hover, red70Hover, magenta20, magenta70, magenta20Hover, magenta70Hover, purple20, purple70, purple20Hover, purple70Hover, blue20Hover, blue70Hover, cyan20, cyan70, cyan20Hover, cyan70Hover, teal20, teal70, teal20Hover, teal70Hover, green20, green70, green20Hover, green70Hover, coolGray20, coolGray70, coolGray100, coolGray10, coolGray20Hover, coolGray70Hover, warmGray20, warmGray70, warmGray100, warmGray10, warmGray20Hover, warmGray70Hover, cyan40, cyan50, teal40, teal50, magenta40, magenta50, coolGray40, coolGray50, warmGray40, warmGray50, red10, green10, yellow10, white0, orange60, yellow60 } 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';
@@ -4647,12 +4647,20 @@ var statusOrange = {
   g90: orange40,
   g100: orange40
 };
+var statusOrangeOutline = {
+  whiteTheme: orange60,
+  g10: orange60
+};
 var statusYellow = {
   whiteTheme: yellow30,
   g10: yellow30,
   g90: yellow30,
   g100: yellow30
 };
+var statusYellowOutline = {
+  whiteTheme: yellow60,
+  g10: yellow60
+};
 var statusPurple = {
   whiteTheme: purple60,
   g10: purple60,
@@ -4688,7 +4696,9 @@ var tokens = /*#__PURE__*/Object.freeze({
   __proto__: null,
   statusRed: statusRed,
   statusOrange: statusOrange,
+  statusOrangeOutline: statusOrangeOutline,
   statusYellow: statusYellow,
+  statusYellowOutline: statusYellowOutline,
   statusPurple: statusPurple,
   statusGreen: statusGreen,
   statusBlue: statusBlue,
@@ -5242,7 +5252,7 @@ var tag = TokenGroup.create({
 var status = TokenGroup.create({
   name: 'Status',
   properties: [],
-  tokens: ['status-red', 'status-orange', 'status-yellow', 'status-purple', 'status-green', 'status-blue', 'status-gray']
+  tokens: ['status-red', 'status-orange', 'status-orange-outline', 'status-yellow', 'status-yellow-outline', 'status-purple', 'status-green', 'status-blue', 'status-gray']
 });
 
 var components = /*#__PURE__*/Object.freeze({

package/lib/index.js

@@ -4653,12 +4653,20 @@ var statusOrange = {
   g90: colors$1.orange40,
   g100: colors$1.orange40
 };
+var statusOrangeOutline = {
+  whiteTheme: colors$1.orange60,
+  g10: colors$1.orange60
+};
 var statusYellow = {
   whiteTheme: colors$1.yellow30,
   g10: colors$1.yellow30,
   g90: colors$1.yellow30,
   g100: colors$1.yellow30
 };
+var statusYellowOutline = {
+  whiteTheme: colors$1.yellow60,
+  g10: colors$1.yellow60
+};
 var statusPurple = {
   whiteTheme: colors$1.purple60,
   g10: colors$1.purple60,
@@ -4694,7 +4702,9 @@ var tokens = /*#__PURE__*/Object.freeze({
   __proto__: null,
   statusRed: statusRed,
   statusOrange: statusOrange,
+  statusOrangeOutline: statusOrangeOutline,
   statusYellow: statusYellow,
+  statusYellowOutline: statusYellowOutline,
   statusPurple: statusPurple,
   statusGreen: statusGreen,
   statusBlue: statusBlue,
@@ -5248,7 +5258,7 @@ var tag = TokenGroup.create({
 var status = TokenGroup.create({
   name: 'Status',
   properties: [],
-  tokens: ['status-red', 'status-orange', 'status-yellow', 'status-purple', 'status-green', 'status-blue', 'status-gray']
+  tokens: ['status-red', 'status-orange', 'status-orange-outline', 'status-yellow', 'status-yellow-outline', 'status-purple', 'status-green', 'status-blue', 'status-gray']
 });
 
 var components = /*#__PURE__*/Object.freeze({

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/themes",
   "description": "Themes for applying color in the Carbon Design System",
-  "version": "11.47.0",
+  "version": "11.48.0",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -51,5 +51,5 @@
     "rimraf": "^6.0.0"
   },
   "sideEffects": false,
-  "gitHead": "2a32901cb1c74c149164122f0742305440716d35"
+  "gitHead": "7ffd4731509c6e3d768cfb9029478b27db8f807d"
 }

package/scss/generated/_status-tokens.scss

@@ -43,6 +43,11 @@ $status-orange: (
   g-100: #ff832b,
 ) !default;
 
+$status-orange-outline: (
+  white-theme: #ba4e00,
+  g-10: #ba4e00,
+) !default;
+
 $status-purple: (
   white-theme: #8a3ffc,
   g-10: #8a3ffc,
@@ -63,3 +68,8 @@ $status-yellow: (
   g-90: #f1c21b,
   g-100: #f1c21b,
 ) !default;
+
+$status-yellow-outline: (
+  white-theme: #8e6a00,
+  g-10: #8e6a00,
+) !default;

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

@@ -2,7 +2,9 @@ import {
   red50,
   red60,
   orange40,
+  orange60,
   yellow30,
+  yellow60,
   purple50,
   purple60,
   green40,
@@ -29,6 +31,11 @@ export const statusOrange = {
   g100: orange40,
 };
 
+export const statusOrangeOutline = {
+  whiteTheme: orange60,
+  g10: orange60,
+};
+
 export const statusYellow = {
   whiteTheme: yellow30,
   g10: yellow30,
@@ -36,6 +43,11 @@ export const statusYellow = {
   g100: yellow30,
 };
 
+export const statusYellowOutline = {
+  whiteTheme: yellow60,
+  g10: yellow60,
+};
+
 export const statusPurple = {
   whiteTheme: purple60,
   g10: purple60,

package/src/tokens/components.js

@@ -99,7 +99,9 @@ export const status = TokenGroup.create({
   tokens: [
     'status-red',
     'status-orange',
+    'status-orange-outline',
     'status-yellow',
+    'status-yellow-outline',
     'status-purple',
     'status-green',
     'status-blue',

package/umd/index.js

@@ -4650,12 +4650,20 @@
     g90: colors$1.orange40,
     g100: colors$1.orange40
   };
+  var statusOrangeOutline = {
+    whiteTheme: colors$1.orange60,
+    g10: colors$1.orange60
+  };
   var statusYellow = {
     whiteTheme: colors$1.yellow30,
     g10: colors$1.yellow30,
     g90: colors$1.yellow30,
     g100: colors$1.yellow30
   };
+  var statusYellowOutline = {
+    whiteTheme: colors$1.yellow60,
+    g10: colors$1.yellow60
+  };
   var statusPurple = {
     whiteTheme: colors$1.purple60,
     g10: colors$1.purple60,
@@ -4691,7 +4699,9 @@
     __proto__: null,
     statusRed: statusRed,
     statusOrange: statusOrange,
+    statusOrangeOutline: statusOrangeOutline,
     statusYellow: statusYellow,
+    statusYellowOutline: statusYellowOutline,
     statusPurple: statusPurple,
     statusGreen: statusGreen,
     statusBlue: statusBlue,
@@ -5245,7 +5255,7 @@
   var status = TokenGroup.create({
     name: 'Status',
     properties: [],
-    tokens: ['status-red', 'status-orange', 'status-yellow', 'status-purple', 'status-green', 'status-blue', 'status-gray']
+    tokens: ['status-red', 'status-orange', 'status-orange-outline', 'status-yellow', 'status-yellow-outline', 'status-purple', 'status-green', 'status-blue', 'status-gray']
   });
 
   var components = /*#__PURE__*/Object.freeze({