@carbon/themes 10.4.0-rc.3 → 10.5.0

package/lib/index.js

@@ -11,7 +11,7 @@ var colors = require('@carbon/colors');
  * LICENSE file in the root directory of this source tree.
  */
 var interactive01 = colors.blue60;
-var interactive02 = colors.gray100;
+var interactive02 = colors.gray80;
 var interactive03 = colors.blue60;
 var interactive04 = colors.blue60;
 var uiBackground = colors.white;
@@ -28,6 +28,7 @@ var icon01 = colors.gray100;
 var icon02 = colors.gray70;
 var icon03 = colors.white;
 var link01 = colors.blue60;
+var inverseLink = colors.blue40;
 var field01 = colors.gray10;
 var field02 = colors.white;
 var inverse01 = colors.white;
@@ -53,6 +54,7 @@ var activeTertiary = colors.blue80;
 var hoverUI = '#e5e5e5';
 var activeUI = colors.gray30;
 var selectedUI = colors.gray20;
+var inverseHoverUI = '#4c4c4c';
 var hoverSelectedUI = '#cacaca';
 var hoverDanger = '#ba1b23';
 var activeDanger = colors.red80;
@@ -90,6 +92,7 @@ var white = /*#__PURE__*/Object.freeze({
   icon02: icon02,
   icon03: icon03,
   link01: link01,
+  inverseLink: inverseLink,
   field01: field01,
   field02: field02,
   inverse01: inverse01,
@@ -114,6 +117,7 @@ var white = /*#__PURE__*/Object.freeze({
   hoverUI: hoverUI,
   activeUI: activeUI,
   selectedUI: selectedUI,
+  inverseHoverUI: inverseHoverUI,
   hoverSelectedUI: hoverSelectedUI,
   hoverDanger: hoverDanger,
   activeDanger: activeDanger,
@@ -139,7 +143,7 @@ var white = /*#__PURE__*/Object.freeze({
  * LICENSE file in the root directory of this source tree.
  */
 var interactive01$1 = colors.blue60;
-var interactive02$1 = colors.gray100;
+var interactive02$1 = colors.gray80;
 var interactive03$1 = colors.blue60;
 var interactive04$1 = colors.blue60;
 var uiBackground$1 = colors.gray10;
@@ -156,6 +160,7 @@ var icon01$1 = colors.gray100;
 var icon02$1 = colors.gray70;
 var icon03$1 = colors.white;
 var link01$1 = colors.blue60;
+var inverseLink$1 = colors.blue40;
 var field01$1 = colors.white;
 var field02$1 = colors.gray10;
 var inverse01$1 = colors.white;
@@ -181,6 +186,7 @@ var activeTertiary$1 = colors.blue80;
 var hoverUI$1 = '#e5e5e5';
 var activeUI$1 = colors.gray30;
 var selectedUI$1 = colors.gray20;
+var inverseHoverUI$1 = '#4c4c4c';
 var hoverSelectedUI$1 = '#cacaca';
 var hoverDanger$1 = '#ba1b23';
 var activeDanger$1 = colors.red80;
@@ -218,6 +224,7 @@ var g10 = /*#__PURE__*/Object.freeze({
   icon02: icon02$1,
   icon03: icon03$1,
   link01: link01$1,
+  inverseLink: inverseLink$1,
   field01: field01$1,
   field02: field02$1,
   inverse01: inverse01$1,
@@ -242,6 +249,7 @@ var g10 = /*#__PURE__*/Object.freeze({
   hoverUI: hoverUI$1,
   activeUI: activeUI$1,
   selectedUI: selectedUI$1,
+  inverseHoverUI: inverseHoverUI$1,
   hoverSelectedUI: hoverSelectedUI$1,
   hoverDanger: hoverDanger$1,
   activeDanger: activeDanger$1,
@@ -284,6 +292,7 @@ var icon01$2 = colors.gray10;
 var icon02$2 = colors.gray30;
 var icon03$2 = colors.white;
 var link01$2 = colors.blue40;
+var inverseLink$2 = colors.blue60;
 var field01$2 = colors.gray90;
 var field02$2 = colors.gray80;
 var inverse01$2 = colors.gray100;
@@ -309,6 +318,7 @@ var activeTertiary$2 = colors.gray30;
 var hoverUI$2 = '#353535';
 var activeUI$2 = colors.gray70;
 var selectedUI$2 = colors.gray80;
+var inverseHoverUI$2 = '#e5e5e5';
 var hoverSelectedUI$2 = '#4c4c4c';
 var hoverDanger$2 = '#ba1b23';
 var activeDanger$2 = colors.red80;
@@ -346,6 +356,7 @@ var g100 = /*#__PURE__*/Object.freeze({
   icon02: icon02$2,
   icon03: icon03$2,
   link01: link01$2,
+  inverseLink: inverseLink$2,
   field01: field01$2,
   field02: field02$2,
   inverse01: inverse01$2,
@@ -370,6 +381,7 @@ var g100 = /*#__PURE__*/Object.freeze({
   hoverUI: hoverUI$2,
   activeUI: activeUI$2,
   selectedUI: selectedUI$2,
+  inverseHoverUI: inverseHoverUI$2,
   hoverSelectedUI: hoverSelectedUI$2,
   hoverDanger: hoverDanger$2,
   activeDanger: activeDanger$2,
@@ -412,6 +424,7 @@ var icon01$3 = colors.gray10;
 var icon02$3 = colors.gray30;
 var icon03$3 = colors.white;
 var link01$3 = colors.blue40;
+var inverseLink$3 = colors.blue60;
 var field01$3 = colors.gray80;
 var field02$3 = colors.gray70;
 var inverse01$3 = colors.gray100;
@@ -437,6 +450,7 @@ var activeTertiary$3 = colors.gray30;
 var hoverUI$3 = '#4c4c4c';
 var activeUI$3 = colors.gray60;
 var selectedUI$3 = colors.gray70;
+var inverseHoverUI$3 = '#e5e5e5';
 var hoverSelectedUI$3 = '#656565';
 var hoverDanger$3 = '#ba1b23';
 var activeDanger$3 = colors.red80;
@@ -474,6 +488,7 @@ var g90 = /*#__PURE__*/Object.freeze({
   icon02: icon02$3,
   icon03: icon03$3,
   link01: link01$3,
+  inverseLink: inverseLink$3,
   field01: field01$3,
   field02: field02$3,
   inverse01: inverse01$3,
@@ -498,6 +513,7 @@ var g90 = /*#__PURE__*/Object.freeze({
   hoverUI: hoverUI$3,
   activeUI: activeUI$3,
   selectedUI: selectedUI$3,
+  inverseHoverUI: inverseHoverUI$3,
   hoverSelectedUI: hoverSelectedUI$3,
   hoverDanger: hoverDanger$3,
   activeDanger: activeDanger$3,
@@ -516,6 +532,138 @@ var g90 = /*#__PURE__*/Object.freeze({
   hoverField: hoverField$3
 });
 
+/**
+ * Copyright IBM Corp. 2018, 2018
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var interactive01$4 = '#3d70b2';
+var interactive02$4 = '#5a6872';
+var interactive03$4 = '#5a6872';
+var interactive04$4 = '#3d70b2';
+var uiBackground$4 = '#f4f7fb';
+var ui01$4 = colors.white;
+var ui02$4 = '#f4f7fb';
+var ui03$4 = '#dfe3e6';
+var ui04$4 = '#8897a2';
+var ui05$4 = '#5a6872';
+var text01$4 = '#152935';
+var text02$4 = '#5a6872';
+var text03$4 = '#cdd1d4';
+var text04$4 = colors.white;
+var icon01$4 = '#3d70b2';
+var icon02$4 = '#5a6872';
+var icon03$4 = colors.white;
+var link01$4 = '#3d70b2';
+var inverseLink$4 = '#5596e6';
+var field01$4 = colors.white;
+var field02$4 = '#f4f7fb';
+var inverse01$4 = colors.white;
+var inverse02$4 = '#272d33';
+var support01$4 = '#e0182d';
+var support02$4 = '#5aa700';
+var support03$4 = '#efc100';
+var support04$4 = '#5aaafa';
+var inverseSupport01$4 = '#ff5050';
+var inverseSupport02$4 = '#8cd211';
+var inverseSupport03$4 = '#FDD600';
+var inverseSupport04$4 = '#5aaafa';
+var overlay01$4 = 'rgba(223, 227, 230, 0.5)'; // Interaction states
+
+var focus$4 = '#3d70b2';
+var hoverPrimary$4 = '#30588c';
+var activePrimary$4 = '#30588c';
+var hoverPrimaryText$4 = '#294c86';
+var hoverSecondary$4 = '#4d5b65';
+var activeSecondary$4 = '#414f59';
+var hoverTertiary$4 = '#5a6872';
+var activeTertiary$4 = '#414f59';
+var hoverUI$4 = '#EEF4FC';
+var activeUI$4 = '#DFEAFA';
+var selectedUI$4 = '#EEF4FC';
+var inverseHoverUI$4 = '#4c4c4c';
+var hoverSelectedUI$4 = '#DFEAFA';
+var hoverDanger$4 = '#c70014';
+var activeDanger$4 = '#AD1625';
+var hoverRow$4 = '#eef4fc';
+var visitedLink$4 = '#294c86';
+var disabled01$4 = '#fafbfd';
+var disabled02$4 = '#dfe3e6';
+var disabled03$4 = '#cdd1d4';
+var highlight$4 = '#f4f7fb';
+var skeleton01$4 = 'rgba(61, 112, 178, .1)';
+var skeleton02$4 = 'rgba(61, 112, 178, .1)'; // Deprecated ☠️
+
+var brand01$4 = interactive01$4;
+var brand02$4 = interactive02$4;
+var brand03$4 = interactive03$4;
+var active01$4 = activeUI$4;
+var hoverField$4 = hoverUI$4;
+
+var v9 = /*#__PURE__*/Object.freeze({
+  interactive01: interactive01$4,
+  interactive02: interactive02$4,
+  interactive03: interactive03$4,
+  interactive04: interactive04$4,
+  uiBackground: uiBackground$4,
+  ui01: ui01$4,
+  ui02: ui02$4,
+  ui03: ui03$4,
+  ui04: ui04$4,
+  ui05: ui05$4,
+  text01: text01$4,
+  text02: text02$4,
+  text03: text03$4,
+  text04: text04$4,
+  icon01: icon01$4,
+  icon02: icon02$4,
+  icon03: icon03$4,
+  link01: link01$4,
+  inverseLink: inverseLink$4,
+  field01: field01$4,
+  field02: field02$4,
+  inverse01: inverse01$4,
+  inverse02: inverse02$4,
+  support01: support01$4,
+  support02: support02$4,
+  support03: support03$4,
+  support04: support04$4,
+  inverseSupport01: inverseSupport01$4,
+  inverseSupport02: inverseSupport02$4,
+  inverseSupport03: inverseSupport03$4,
+  inverseSupport04: inverseSupport04$4,
+  overlay01: overlay01$4,
+  focus: focus$4,
+  hoverPrimary: hoverPrimary$4,
+  activePrimary: activePrimary$4,
+  hoverPrimaryText: hoverPrimaryText$4,
+  hoverSecondary: hoverSecondary$4,
+  activeSecondary: activeSecondary$4,
+  hoverTertiary: hoverTertiary$4,
+  activeTertiary: activeTertiary$4,
+  hoverUI: hoverUI$4,
+  activeUI: activeUI$4,
+  selectedUI: selectedUI$4,
+  inverseHoverUI: inverseHoverUI$4,
+  hoverSelectedUI: hoverSelectedUI$4,
+  hoverDanger: hoverDanger$4,
+  activeDanger: activeDanger$4,
+  hoverRow: hoverRow$4,
+  visitedLink: visitedLink$4,
+  disabled01: disabled01$4,
+  disabled02: disabled02$4,
+  disabled03: disabled03$4,
+  highlight: highlight$4,
+  skeleton01: skeleton01$4,
+  skeleton02: skeleton02$4,
+  brand01: brand01$4,
+  brand02: brand02$4,
+  brand03: brand03$4,
+  active01: active01$4,
+  hoverField: hoverField$4
+});
+
 /**
  * Copyright IBM Corp. 2018, 2018
  *
@@ -525,8 +673,8 @@ var g90 = /*#__PURE__*/Object.freeze({
 // The color token names for a Carbon theme, value corresponds to what they're
 // exported as in JavaScript
 var colors$1 = [// Core
-'interactive01', 'interactive02', 'interactive03', 'interactive04', 'uiBackground', 'ui01', 'ui02', 'ui03', 'ui04', 'ui05', 'text01', 'text02', 'text03', 'text04', 'icon01', 'icon02', 'icon03', 'link01', 'field01', 'field02', 'inverse01', 'inverse02', 'support01', 'support02', 'support03', 'support04', 'inverseSupport01', 'inverseSupport02', 'inverseSupport03', 'inverseSupport04', 'overlay01', // Interactive states
-'focus', 'hoverPrimary', 'activePrimary', 'hoverPrimaryText', 'hoverSecondary', 'activeSecondary', 'hoverTertiary', 'activeTertiary', 'hoverUI', 'activeUI', 'selectedUI', 'hoverSelectedUI', 'hoverDanger', 'activeDanger', 'hoverRow', 'visitedLink', 'disabled01', 'disabled02', 'disabled03', 'highlight', 'skeleton01', 'skeleton02', // Deprecated
+'interactive01', 'interactive02', 'interactive03', 'interactive04', 'uiBackground', 'ui01', 'ui02', 'ui03', 'ui04', 'ui05', 'text01', 'text02', 'text03', 'text04', 'icon01', 'icon02', 'icon03', 'link01', 'inverseLink', 'field01', 'field02', 'inverse01', 'inverse02', 'support01', 'support02', 'support03', 'support04', 'inverseSupport01', 'inverseSupport02', 'inverseSupport03', 'inverseSupport04', 'overlay01', // Interactive states
+'focus', 'hoverPrimary', 'activePrimary', 'hoverPrimaryText', 'hoverSecondary', 'activeSecondary', 'hoverTertiary', 'activeTertiary', 'hoverUI', 'activeUI', 'selectedUI', 'hoverSelectedUI', 'inverseHoverUI', 'hoverDanger', 'activeDanger', 'hoverRow', 'visitedLink', 'disabled01', 'disabled02', 'disabled03', 'highlight', 'skeleton01', 'skeleton02', // Deprecated
 'brand01', 'brand02', 'brand03', 'active01', 'hoverField'];
 var numbers = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'];
 /**
@@ -570,6 +718,16 @@ function formatTokenName(token) {
 var tokens = {
   colors: colors$1
 };
+var unstable__meta = {
+  colors: [{
+    type: 'core',
+    tokens: ['uiBackground', 'interactive01', 'interactive02', 'interactive03', 'interactive04', 'brand01', 'brand02', 'brand03', 'ui01', 'ui02', 'ui03', 'ui04', 'ui05', 'text01', 'text02', 'text03', 'text04', 'link01', 'icon01', 'icon02', 'icon03', 'field01', 'field02', 'inverse01', 'inverse02', 'inverseLink', 'support01', 'support02', 'support03', 'support04', 'inverseSupport01', 'inverseSupport02', 'inverseSupport03', 'inverseSupport04', 'overlay01']
+  }, {
+    type: 'interactive',
+    tokens: ['focus', 'hoverPrimary', 'hoverPrimaryText', 'hoverSecondary', 'hoverTertiary', 'hoverUI', 'hoverSelectedUI', 'hoverDanger', 'hoverRow', 'activePrimary', 'activeSecondary', 'activeTertiary', 'activeUI', 'activeDanger', 'selectedUI', 'highlight', 'skeleton01', 'skeleton02', 'visitedLink', 'disabled01', 'disabled02', 'disabled03', 'inverseHoverUI', 'active01', 'hoverField']
+  }],
+  deprecated: ['brand01', 'brand02', 'brand03', 'active01']
+};
 
 /**
  * Copyright IBM Corp. 2018, 2018
@@ -581,15 +739,18 @@ var themes = {
   white: white,
   g10: g10,
   g90: g90,
-  g100: g100
+  g100: g100,
+  v9: v9
 };
 
 exports.g10 = g10;
 exports.g90 = g90;
 exports.g100 = g100;
 exports.white = white;
+exports.v9 = v9;
 exports.tokens = tokens;
 exports.formatTokenName = formatTokenName;
+exports.unstable__meta = unstable__meta;
 exports.themes = themes;
 exports.interactive01 = interactive01;
 exports.interactive02 = interactive02;
@@ -609,6 +770,7 @@ exports.icon01 = icon01;
 exports.icon02 = icon02;
 exports.icon03 = icon03;
 exports.link01 = link01;
+exports.inverseLink = inverseLink;
 exports.field01 = field01;
 exports.field02 = field02;
 exports.inverse01 = inverse01;
@@ -633,6 +795,7 @@ exports.activeTertiary = activeTertiary;
 exports.hoverUI = hoverUI;
 exports.activeUI = activeUI;
 exports.selectedUI = selectedUI;
+exports.inverseHoverUI = inverseHoverUI;
 exports.hoverSelectedUI = hoverSelectedUI;
 exports.hoverDanger = hoverDanger;
 exports.activeDanger = activeDanger;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/themes",
   "description": "Themes for applying color in the Carbon Design System",
-  "version": "10.4.0-rc.3",
+  "version": "10.5.0",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -24,12 +24,12 @@
     "build": "yarn clean && bundler bundle src/index.js --name CarbonThemes && node tasks/build.js && bundler check \"scss/*.scss\" && bundler sassdoc \"scss/*.scss\""
   },
   "dependencies": {
-    "@carbon/colors": "10.3.0-rc.3"
+    "@carbon/colors": "10.4.0"
   },
   "devDependencies": {
-    "@carbon/cli-reporter": "10.3.0-rc.3",
-    "@carbon/scss-generator": "10.3.0-rc.3",
-    "@carbon/test-utils": "10.3.0-rc.3",
+    "@carbon/cli-reporter": "10.3.0",
+    "@carbon/scss-generator": "10.3.0",
+    "@carbon/test-utils": "10.3.0",
     "change-case": "^3.0.2",
     "core-js": "^3.0.1",
     "fs-extra": "^7.0.1",
@@ -37,5 +37,5 @@
     "node-sass": "^4.11.0",
     "rimraf": "^2.6.3"
   },
-  "gitHead": "8ff9500b61ec590a2a66f395f227b58cff690849"
+  "gitHead": "99fd2683b9bc303f704bad86d229d1e364ac68d2"
 }

package/scss/_mixins.scss

@@ -48,6 +48,7 @@
   $icon-02: map-get($theme, 'icon-02') !global;
   $icon-03: map-get($theme, 'icon-03') !global;
   $link-01: map-get($theme, 'link-01') !global;
+  $inverse-link: map-get($theme, 'inverse-link') !global;
   $field-01: map-get($theme, 'field-01') !global;
   $field-02: map-get($theme, 'field-02') !global;
   $inverse-01: map-get($theme, 'inverse-01') !global;
@@ -73,6 +74,7 @@
   $active-ui: map-get($theme, 'active-ui') !global;
   $selected-ui: map-get($theme, 'selected-ui') !global;
   $hover-selected-ui: map-get($theme, 'hover-selected-ui') !global;
+  $inverse-hover-ui: map-get($theme, 'inverse-hover-ui') !global;
   $hover-danger: map-get($theme, 'hover-danger') !global;
   $active-danger: map-get($theme, 'active-danger') !global;
   $hover-row: map-get($theme, 'hover-row') !global;
@@ -108,6 +110,7 @@
     --icon-02: #{map-get($theme, 'icon-02')};
     --icon-03: #{map-get($theme, 'icon-03')};
     --link-01: #{map-get($theme, 'link-01')};
+    --inverse-link: #{map-get($theme, 'inverse-link')};
     --field-01: #{map-get($theme, 'field-01')};
     --field-02: #{map-get($theme, 'field-02')};
     --inverse-01: #{map-get($theme, 'inverse-01')};
@@ -133,6 +136,7 @@
     --active-ui: #{map-get($theme, 'active-ui')};
     --selected-ui: #{map-get($theme, 'selected-ui')};
     --hover-selected-ui: #{map-get($theme, 'hover-selected-ui')};
+    --inverse-hover-ui: #{map-get($theme, 'inverse-hover-ui')};
     --hover-danger: #{map-get($theme, 'hover-danger')};
     --active-danger: #{map-get($theme, 'active-danger')};
     --hover-row: #{map-get($theme, 'hover-row')};

package/scss/_theme-maps.scss

@@ -11,7 +11,7 @@
 /// @group @carbon/themes
 $carbon--theme--white: (
   interactive-01: #0062ff,
-  interactive-02: #171717,
+  interactive-02: #3d3d3d,
   interactive-03: #0062ff,
   interactive-04: #0062ff,
   ui-background: #ffffff,
@@ -28,6 +28,7 @@ $carbon--theme--white: (
   icon-02: #565656,
   icon-03: #ffffff,
   link-01: #0062ff,
+  inverse-link: #6ea6ff,
   field-01: #f3f3f3,
   field-02: #ffffff,
   inverse-01: #ffffff,
@@ -52,6 +53,7 @@ $carbon--theme--white: (
   hover-ui: #e5e5e5,
   active-ui: #bebebe,
   selected-ui: #dcdcdc,
+  inverse-hover-ui: #4c4c4c,
   hover-selected-ui: #cacaca,
   hover-danger: #ba1b23,
   active-danger: #750e13,
@@ -64,7 +66,7 @@ $carbon--theme--white: (
   skeleton-01: #e5e5e5,
   skeleton-02: #bebebe,
   brand-01: #0062ff,
-  brand-02: #171717,
+  brand-02: #3d3d3d,
   brand-03: #0062ff,
   active-01: #bebebe,
   hover-field: #e5e5e5,
@@ -75,7 +77,7 @@ $carbon--theme--white: (
 /// @group @carbon/themes
 $carbon--theme--g10: (
   interactive-01: #0062ff,
-  interactive-02: #171717,
+  interactive-02: #3d3d3d,
   interactive-03: #0062ff,
   interactive-04: #0062ff,
   ui-background: #f3f3f3,
@@ -92,6 +94,7 @@ $carbon--theme--g10: (
   icon-02: #565656,
   icon-03: #ffffff,
   link-01: #0062ff,
+  inverse-link: #6ea6ff,
   field-01: #ffffff,
   field-02: #f3f3f3,
   inverse-01: #ffffff,
@@ -116,6 +119,7 @@ $carbon--theme--g10: (
   hover-ui: #e5e5e5,
   active-ui: #bebebe,
   selected-ui: #dcdcdc,
+  inverse-hover-ui: #4c4c4c,
   hover-selected-ui: #cacaca,
   hover-danger: #ba1b23,
   active-danger: #750e13,
@@ -128,7 +132,7 @@ $carbon--theme--g10: (
   skeleton-01: #e5e5e5,
   skeleton-02: #bebebe,
   brand-01: #0062ff,
-  brand-02: #171717,
+  brand-02: #3d3d3d,
   brand-03: #0062ff,
   active-01: #bebebe,
   hover-field: #e5e5e5,
@@ -156,6 +160,7 @@ $carbon--theme--g90: (
   icon-02: #bebebe,
   icon-03: #ffffff,
   link-01: #6ea6ff,
+  inverse-link: #0062ff,
   field-01: #3d3d3d,
   field-02: #565656,
   inverse-01: #171717,
@@ -180,6 +185,7 @@ $carbon--theme--g90: (
   hover-ui: #4c4c4c,
   active-ui: #6f6f6f,
   selected-ui: #565656,
+  inverse-hover-ui: #e5e5e5,
   hover-selected-ui: #656565,
   hover-danger: #ba1b23,
   active-danger: #750e13,
@@ -220,6 +226,7 @@ $carbon--theme--g100: (
   icon-02: #bebebe,
   icon-03: #ffffff,
   link-01: #6ea6ff,
+  inverse-link: #0062ff,
   field-01: #282828,
   field-02: #3d3d3d,
   inverse-01: #171717,
@@ -244,6 +251,7 @@ $carbon--theme--g100: (
   hover-ui: #353535,
   active-ui: #565656,
   selected-ui: #3d3d3d,
+  inverse-hover-ui: #e5e5e5,
   hover-selected-ui: #4c4c4c,
   hover-danger: #ba1b23,
   active-danger: #750e13,
@@ -261,6 +269,72 @@ $carbon--theme--g100: (
   active-01: #565656,
   hover-field: #353535,
 ) !default;
+/// Carbon's v9 color theme
+/// @type Map
+/// @access public
+/// @group @carbon/themes
+$carbon--theme--v9: (
+  interactive-01: #3d70b2,
+  interactive-02: #5a6872,
+  interactive-03: #5a6872,
+  interactive-04: #3d70b2,
+  ui-background: #f4f7fb,
+  ui-01: #ffffff,
+  ui-02: #f4f7fb,
+  ui-03: #dfe3e6,
+  ui-04: #8897a2,
+  ui-05: #5a6872,
+  text-01: #152935,
+  text-02: #5a6872,
+  text-03: #cdd1d4,
+  text-04: #ffffff,
+  icon-01: #3d70b2,
+  icon-02: #5a6872,
+  icon-03: #ffffff,
+  link-01: #3d70b2,
+  inverse-link: #5596e6,
+  field-01: #ffffff,
+  field-02: #f4f7fb,
+  inverse-01: #ffffff,
+  inverse-02: #272d33,
+  support-01: #e0182d,
+  support-02: #5aa700,
+  support-03: #efc100,
+  support-04: #5aaafa,
+  inverse-support-01: #ff5050,
+  inverse-support-02: #8cd211,
+  inverse-support-03: #fdd600,
+  inverse-support-04: #5aaafa,
+  overlay-01: rgba(223, 227, 230, 0.5),
+  focus: #3d70b2,
+  hover-primary: #30588c,
+  active-primary: #30588c,
+  hover-primary-text: #294c86,
+  hover-secondary: #4d5b65,
+  active-secondary: #414f59,
+  hover-tertiary: #5a6872,
+  active-tertiary: #414f59,
+  hover-ui: #eef4fc,
+  active-ui: #dfeafa,
+  selected-ui: #eef4fc,
+  inverse-hover-ui: #4c4c4c,
+  hover-selected-ui: #dfeafa,
+  hover-danger: #c70014,
+  active-danger: #ad1625,
+  hover-row: #eef4fc,
+  visited-link: #294c86,
+  disabled-01: #fafbfd,
+  disabled-02: #dfe3e6,
+  disabled-03: #cdd1d4,
+  highlight: #f4f7fb,
+  skeleton-01: rgba(61, 112, 178, 0.1),
+  skeleton-02: rgba(61, 112, 178, 0.1),
+  brand-01: #3d70b2,
+  brand-02: #5a6872,
+  brand-03: #5a6872,
+  active-01: #dfeafa,
+  hover-field: #eef4fc,
+) !default;
 /// Carbon's default theme
 /// @type Map
 /// @access public

package/scss/_tokens.scss

@@ -96,6 +96,10 @@ $icon-03: map-get($carbon--theme, 'icon-03') !default;
 /// @access public
 /// @group @carbon/themes
 $link-01: map-get($carbon--theme, 'link-01') !default;
+/// @type Color
+/// @access public
+/// @group @carbon/themes
+$inverse-link: map-get($carbon--theme, 'inverse-link') !default;
 /// Default input fields; Field color on $ui-backgrounds
 /// @type Color
 /// @access public
@@ -221,6 +225,10 @@ $selected-ui: map-get($carbon--theme, 'selected-ui') !default;
 /// @access public
 /// @group @carbon/themes
 $hover-selected-ui: map-get($carbon--theme, 'hover-selected-ui') !default;
+/// @type Color
+/// @access public
+/// @group @carbon/themes
+$inverse-hover-ui: map-get($carbon--theme, 'inverse-hover-ui') !default;
 /// Danger hover; `$support-01` hover
 /// @type Color
 /// @access public

package/src/g10.js

@@ -8,6 +8,7 @@
 import {
   // Blue
   blue20,
+  blue40,
   blue60,
   blue70,
   blue80,
@@ -40,7 +41,7 @@ import {
 } from '@carbon/colors';
 
 export const interactive01 = blue60;
-export const interactive02 = gray100;
+export const interactive02 = gray80;
 export const interactive03 = blue60;
 export const interactive04 = blue60;
 
@@ -63,6 +64,8 @@ export const icon03 = white;
 
 export const link01 = blue60;
 
+export const inverseLink = blue40;
+
 export const field01 = white;
 export const field02 = gray10;
 
@@ -98,6 +101,7 @@ export const activeTertiary = blue80;
 export const hoverUI = '#e5e5e5';
 export const activeUI = gray30;
 export const selectedUI = gray20;
+export const inverseHoverUI = '#4c4c4c';
 
 export const hoverSelectedUI = '#cacaca';
 

package/src/g100.js

@@ -62,6 +62,8 @@ export const icon03 = white;
 
 export const link01 = blue40;
 
+export const inverseLink = blue60;
+
 export const field01 = gray90;
 export const field02 = gray80;
 
@@ -97,6 +99,7 @@ export const activeTertiary = gray30;
 export const hoverUI = '#353535';
 export const activeUI = gray70;
 export const selectedUI = gray80;
+export const inverseHoverUI = '#e5e5e5';
 
 export const hoverSelectedUI = '#4c4c4c';
 

package/src/g90.js

@@ -64,6 +64,8 @@ export const icon03 = white;
 
 export const link01 = blue40;
 
+export const inverseLink = blue60;
+
 export const field01 = gray80;
 export const field02 = gray70;
 
@@ -99,6 +101,7 @@ export const activeTertiary = gray30;
 export const hoverUI = '#4c4c4c';
 export const activeUI = gray60;
 export const selectedUI = gray70;
+export const inverseHoverUI = '#e5e5e5';
 
 export const hoverSelectedUI = '#656565';
 

package/src/index.js

@@ -11,13 +11,15 @@ import * as g10 from './g10';
 import * as g100 from './g100';
 import * as white from './white';
 import * as g90 from './g90';
-import { tokens, formatTokenName } from './tokens';
+import * as v9 from './v9';
+import { tokens, formatTokenName, unstable__meta } from './tokens';
 
-export { g10, g90, g100, white };
-export { tokens, formatTokenName };
+export { g10, g90, g100, white, v9 };
+export { tokens, formatTokenName, unstable__meta };
 export const themes = {
   white,
   g10,
   g90,
   g100,
+  v9,
 };