Merge branch 'master' into feat-btn-loader

package.json

@@ -35,7 +35,7 @@
     "@babel/preset-env": "^7.4.4",
     "@babel/preset-react": "^7.0.0",
     "@babel/runtime": "^7.4.4",
-    "@carbon/cli": "10.3.0",
+    "@carbon/cli": "10.4.0-rc.0",
     "@commitlint/cli": "^7.5.2",
     "@commitlint/config-conventional": "^7.5.0",
     "babel-jest": "^24.8.0",
@@ -46,7 +46,7 @@
     "enzyme-adapter-react-16": "^1.14.0",
     "enzyme-to-json": "^3.3.5",
     "eslint": "^6.0.0",
-    "eslint-config-carbon": "10.3.0",
+    "eslint-config-carbon": "10.4.0-rc.0",
     "fs-extra": "^7.0.1",
     "glob": "^7.1.4",
     "husky": "^2.1.0",

packages/browserslist-config-carbon/package.json

@@ -1,7 +1,7 @@
 {
   "name": "browserslist-config-carbon",
   "description": "Browserslist config for the Carbon Design System",
-  "version": "10.3.0",
+  "version": "10.4.0-rc.0",
   "license": "Apache-2.0",
   "main": "index.js",
   "repository": "https://github.com/carbon-design-system/carbon/tree/master/packages/browserslist-config-carbon",

packages/bundler/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/bundler",
   "description": "Bundler used for libraries in the Carbon Design System",
-  "version": "10.2.0",
+  "version": "10.3.0-rc.0",
   "license": "Apache-2.0",
   "bin": {
     "bundler": "./bin/bundler.js"
@@ -23,7 +23,7 @@
   "dependencies": {
     "@babel/core": "^7.1.6",
     "@babel/preset-env": "^7.1.6",
-    "@carbon/cli-reporter": "10.2.0",
+    "@carbon/cli-reporter": "10.3.0-rc.0",
     "autoprefixer": "^9.4.3",
     "babel-plugin-macros": "^2.4.2",
     "chalk": "^2.4.1",

packages/cli-reporter/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/cli-reporter",
   "description": "Reporter for CLI-based tools in the Carbon Design System",
-  "version": "10.2.0",
+  "version": "10.3.0-rc.0",
   "license": "Apache-2.0",
   "main": "index.js",
   "repository": "https://github.com/carbon-design-system/carbon/tree/master/packages/cli-reporter",

packages/cli/README.md

@@ -0,0 +1,52 @@
+# @carbon/cli
+
+> Task automation for working with the Carbon Design System
+
+## Getting started
+
+To install `@carbon/cli` in your project, you will need to run the following
+command using [npm](https://www.npmjs.com/):
+
+```bash
+npm install -S @carbon/cli
+```
+
+If you prefer [Yarn](https://yarnpkg.com/en/), use the following command
+instead:
+
+```bash
+yarn add @carbon/cli
+```
+
+## Usage
+
+You can install `@carbon/cli` in your project, or use a tool like
+[`npx`](https://medium.com/@maybekatz/introducing-npx-an-npm-package-runner-55f7d4bd282b)
+by running the following command in your project:
+
+```bash
+npx @carbon/cli --help
+```
+
+The output of the `--help` option is:
+
+```bash
+Usage: @carbon/cli [options]
+
+Commands:
+  @carbon/cli contribute <command>  get started contributing with Carbon
+
+Options:
+  --help     Show help                                                 [boolean]
+  --version  Show version number                                       [boolean]
+```
+
+## 🙌 Contributing
+
+We're always looking for contributors to help us fix bugs, build new features,
+or help us improve the project documentation. If you're interested, definitely
+check out our [Contributing Guide](/.github/CONTRIBUTING.md)! 👀
+
+## 📝 License
+
+Licensed under the [Apache 2.0 License](/LICENSE).

packages/cli/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/cli",
-  "private": true,
-  "version": "10.3.0",
+  "description": "Task automation for working with the Carbon Design System",
+  "version": "10.4.0-rc.0",
   "license": "Apache-2.0",
   "bin": {
     "carbon-cli": "./bin/carbon-cli.js"
@@ -19,7 +19,7 @@
     "access": "public"
   },
   "dependencies": {
-    "@carbon/cli-reporter": "10.2.0",
+    "@carbon/cli-reporter": "10.3.0-rc.0",
     "@octokit/plugin-retry": "^2.2.0",
     "@octokit/plugin-throttling": "^2.6.0",
     "@octokit/rest": "^16.28.1",

packages/colors/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/colors",
   "description": "Colors for digital and software products using the Carbon Design System",
-  "version": "10.2.0",
+  "version": "10.3.0-rc.0",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -31,10 +31,10 @@
     "clean": "rimraf css es lib umd scss"
   },
   "devDependencies": {
-    "@carbon/bundler": "10.2.0",
-    "@carbon/cli-reporter": "10.2.0",
-    "@carbon/scss-generator": "10.2.0",
-    "@carbon/test-utils": "10.2.0",
+    "@carbon/bundler": "10.3.0-rc.0",
+    "@carbon/cli-reporter": "10.3.0-rc.0",
+    "@carbon/scss-generator": "10.3.0-rc.0",
+    "@carbon/test-utils": "10.3.0-rc.0",
     "change-case": "^3.0.2",
     "core-js": "^3.0.1",
     "fs-extra": "^7.0.0",

packages/components/docs/sass.md

@@ -4306,6 +4306,8 @@ $ui-background: map-get($carbon--theme, 'ui-background');
 - **Type**: `Color`
 - **Used by**:
   - [carbon--theme [mixin]](#carbon--theme-mixin)
+  - [dropdown [mixin]](#dropdown-mixin)
+  - [listbox [mixin]](#listbox-mixin)
 
 ### ✅ui-01 [variable]
 
@@ -5364,7 +5366,6 @@ $disabled-02: map-get($carbon--theme, 'disabled-02');
   - [checkbox [mixin]](#checkbox-mixin)
   - [combo-box [mixin]](#combo-box-mixin)
   - [content-switcher [mixin]](#content-switcher-mixin)
-  - [dropdown [mixin]](#dropdown-mixin)
   - [form [mixin]](#form-mixin)
   - [link [mixin]](#link-mixin)
   - [listbox [mixin]](#listbox-mixin)
@@ -5395,6 +5396,8 @@ $disabled-03: map-get($carbon--theme, 'disabled-03');
   - [carbon--theme [mixin]](#carbon--theme-mixin)
   - [button [mixin]](#button-mixin)
   - [content-switcher [mixin]](#content-switcher-mixin)
+  - [dropdown [mixin]](#dropdown-mixin)
+  - [listbox [mixin]](#listbox-mixin)
 
 ### ✅highlight [variable]
 
@@ -8875,7 +8878,7 @@ Button styles
     padding: $button-padding-sm;
   }
 
-  &.#{$prefix}--btn--field {
+  .#{$prefix}--btn--field {
     height: 40px;
     min-height: 40px;
     padding: $button-padding-field;
@@ -12215,11 +12218,11 @@ Dropdown styles
     }
 
     .#{$prefix}--dropdown-text {
-      color: $disabled-02;
+      color: $disabled-03;
     }
 
     .#{$prefix}--dropdown__arrow {
-      fill: $disabled-02;
+      fill: $disabled-03;
     }
 
     &.#{$prefix}--dropdown--light:hover {
@@ -12238,15 +12241,15 @@ Dropdown styles
     border-bottom-color: transparent;
     width: auto;
     height: rem(32px);
-    background-color: $field-02;
+    background-color: $ui-background;
     transition: background $duration--fast-01 motion(entrance, productive);
 
     &:hover {
       background-color: $hover-ui;
     }
 
     &.#{$prefix}--dropdown--disabled {
-      background-color: $field-02;
+      background-color: $ui-background;
     }
 
     .#{$prefix}--dropdown__arrow {
@@ -12269,7 +12272,7 @@ Dropdown styles
 
   .#{$prefix}--dropdown--inline.#{$prefix}--dropdown--disabled
     .#{$prefix}--dropdown-text {
-    color: $disabled-02;
+    color: $disabled-03;
   }
 
   .#{$prefix}--dropdown--inline.#{$prefix}--dropdown--disabled:focus
@@ -12329,7 +12332,8 @@ Dropdown styles
   - [ui-01 [variable]](#ui-01-variable)
   - [selected-ui [variable]](#selected-ui-variable)
   - [text-02 [variable]](#text-02-variable)
-  - [disabled-02 [variable]](#disabled-02-variable)
+  - [disabled-03 [variable]](#disabled-03-variable)
+  - [ui-background [variable]](#ui-background-variable)
 
 ## file-uploader
 
@@ -13060,11 +13064,11 @@ List box styles
   .#{$prefix}--list-box--disabled .#{$prefix}--list-box__label,
   .#{$prefix}--list-box--disabled.#{$prefix}--list-box--inline
     .#{$prefix}--list-box__label {
-    color: $disabled-02;
+    color: $disabled-03;
   }
 
   .#{$prefix}--list-box--disabled .#{$prefix}--list-box__menu-icon > svg {
-    fill: $disabled-02;
+    fill: $disabled-03;
   }
 
   .#{$prefix}--list-box--disabled,
@@ -13098,7 +13102,7 @@ List box styles
 
   // Inline variant for a `list-box`
   .#{$prefix}--list-box.#{$prefix}--list-box--inline {
-    background-color: $field-02;
+    background-color: $ui-background;
     border-width: 0;
 
     &:hover {
@@ -13478,8 +13482,10 @@ List box styles
   - [carbon--spacing-08 [variable]](#carbon--spacing-08-variable)
   - [support-01 [variable]](#support-01-variable)
   - [carbon--spacing-03 [variable]](#carbon--spacing-03-variable)
+  - [disabled-03 [variable]](#disabled-03-variable)
   - [disabled-02 [variable]](#disabled-02-variable)
   - [carbon--spacing-09 [variable]](#carbon--spacing-09-variable)
+  - [ui-background [variable]](#ui-background-variable)
   - [carbon--spacing-07 [variable]](#carbon--spacing-07-variable)
   - [carbon--spacing-05 [variable]](#carbon--spacing-05-variable)
   - [icon-01 [variable]](#icon-01-variable)

packages/components/package.json

@@ -1,7 +1,7 @@
 {
   "name": "carbon-components",
   "description": "The Carbon Design System is IBM’s open-source design system for products and experiences.",
-  "version": "10.3.2",
+  "version": "10.4.0-rc.0",
   "license": "Apache-2.0",
   "main": "umd/index.js",
   "module": "es/index.js",
@@ -80,10 +80,10 @@
     "@babel/preset-env": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
     "@babel/runtime": "^7.0.0",
-    "@carbon/elements": "^10.3.1",
-    "@carbon/icons-handlebars": "10.3.0",
-    "@carbon/icons-react": "^10.3.0",
-    "@carbon/test-utils": "10.2.0",
+    "@carbon/elements": "10.4.0-rc.0",
+    "@carbon/icons-handlebars": "10.4.0-rc.0",
+    "@carbon/icons-react": "10.4.0-rc.0",
+    "@carbon/test-utils": "10.3.0-rc.0",
     "@frctl/fractal": "^1.1.0",
     "adaro": "1.0.4",
     "autoprefixer": "^8.2.0",
@@ -94,7 +94,7 @@
     "babel-plugin-rewire": "^1.1.0",
     "bluebird": "~3.1.1",
     "browser-sync": "^2.26.3",
-    "browserslist-config-carbon": "10.3.0",
+    "browserslist-config-carbon": "10.4.0-rc.0",
     "carbon-components": "^9.0.0",
     "carbon-components-react": "^6.0.0",
     "chokidar": "^2.0.0",

packages/components/src/components/button/_button.scss

@@ -222,7 +222,7 @@
     padding: $button-padding-sm;
   }
 
-  &.#{$prefix}--btn--field {
+  .#{$prefix}--btn--field {
     height: 40px;
     min-height: 40px;
     padding: $button-padding-field;

packages/components/src/components/dropdown/_dropdown.scss

@@ -239,11 +239,11 @@
     }
 
     .#{$prefix}--dropdown-text {
-      color: $disabled-02;
+      color: $disabled-03;
     }
 
     .#{$prefix}--dropdown__arrow {
-      fill: $disabled-02;
+      fill: $disabled-03;
     }
 
     &.#{$prefix}--dropdown--light:hover {
@@ -262,15 +262,15 @@
     border-bottom-color: transparent;
     width: auto;
     height: rem(32px);
-    background-color: $field-02;
+    background-color: $ui-background;
     transition: background $duration--fast-01 motion(entrance, productive);
 
     &:hover {
       background-color: $hover-ui;
     }
 
     &.#{$prefix}--dropdown--disabled {
-      background-color: $field-02;
+      background-color: $ui-background;
     }
 
     .#{$prefix}--dropdown__arrow {
@@ -293,7 +293,7 @@
 
   .#{$prefix}--dropdown--inline.#{$prefix}--dropdown--disabled
     .#{$prefix}--dropdown-text {
-    color: $disabled-02;
+    color: $disabled-03;
   }
 
   .#{$prefix}--dropdown--inline.#{$prefix}--dropdown--disabled:focus

packages/components/src/components/list-box/_list-box.scss

@@ -152,11 +152,11 @@ $list-box-menu-width: rem(300px);
   .#{$prefix}--list-box--disabled .#{$prefix}--list-box__label,
   .#{$prefix}--list-box--disabled.#{$prefix}--list-box--inline
     .#{$prefix}--list-box__label {
-    color: $disabled-02;
+    color: $disabled-03;
   }
 
   .#{$prefix}--list-box--disabled .#{$prefix}--list-box__menu-icon > svg {
-    fill: $disabled-02;
+    fill: $disabled-03;
   }
 
   .#{$prefix}--list-box--disabled,
@@ -190,7 +190,7 @@ $list-box-menu-width: rem(300px);
 
   // Inline variant for a `list-box`
   .#{$prefix}--list-box.#{$prefix}--list-box--inline {
-    background-color: $field-02;
+    background-color: $ui-background;
     border-width: 0;
 
     &:hover {