Merge branch 'master' into modal-content-margin

CODEOWNERS

@@ -10,3 +10,8 @@
 
 # Brand
 /packages/colors/artifacts/ @lisalind-ibm
+
+# Release team should be notified of Public API changes in the following
+# packages
+/packages/react/__tests__/PublicAPI-test.js @carbon-design-system/developers-system @carbon-design-system/release
+/packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap @carbon-design-system/developers-system @carbon-design-system/release

package.json

@@ -42,7 +42,7 @@
     "@babel/preset-env": "^7.7.7",
     "@babel/preset-react": "^7.7.4",
     "@babel/runtime": "^7.7.7",
-    "@carbon/cli": "10.7.0",
+    "@carbon/cli": "10.8.0",
     "@commitlint/cli": "^8.3.5",
     "@commitlint/config-conventional": "^8.3.4",
     "@ibma/aat": "https://able.ibm.com/tools/dist/ibma-aat-2.0.6.tgz",
@@ -56,11 +56,11 @@
     "enzyme-adapter-react-16": "^1.14.0",
     "enzyme-to-json": "^3.3.5",
     "eslint": "^6.8.0",
-    "eslint-config-carbon": "10.4.0",
+    "eslint-config-carbon": "10.5.0",
     "fs-extra": "^8.1.0",
     "glob": "^7.1.4",
     "husky": "^4.0.10",
-    "jest": "^24.9.0",
+    "jest": "^25.1.0",
     "jest-circus": "^24.9.0",
     "jest-junit": "^10.0.0",
     "lerna": "^3.20.2",
@@ -175,8 +175,8 @@
     ],
     "testMatch": [
       "<rootDir>/**/__tests__/**/*.js?(x)",
-      "<rootDir>/**/?(*.)(spec|test).js?(x)",
-      "<rootDir>/**/?(*-)(spec|test).js?(x)"
+      "<rootDir>/**/*.(spec|test).js?(x)",
+      "<rootDir>/**/*-(spec|test).js?(x)"
     ],
     "transform": {
       "^.+\\.(js|jsx)$": "./tasks/jest/jsTransform.js",

packages/bundler/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/bundler",
   "description": "Bundler used for libraries in the Carbon Design System",
-  "version": "10.5.0",
+  "version": "10.6.0",
   "license": "Apache-2.0",
   "bin": {
     "bundler": "./bin/bundler.js"
@@ -23,7 +23,7 @@
   "dependencies": {
     "@babel/core": "^7.7.7",
     "@babel/preset-env": "^7.7.7",
-    "@carbon/cli-reporter": "10.3.0",
+    "@carbon/cli-reporter": "^10.3.0",
     "@commitlint/parse": "^8.3.4",
     "autoprefixer": "^9.7.4",
     "babel-plugin-macros": "^2.4.2",

packages/cli/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/cli",
   "description": "Task automation for working with the Carbon Design System",
-  "version": "10.7.0",
+  "version": "10.8.0",
   "license": "Apache-2.0",
   "bin": {
     "carbon-cli": "./bin/carbon-cli.js"
@@ -19,7 +19,7 @@
     "access": "public"
   },
   "dependencies": {
-    "@carbon/cli-reporter": "10.3.0",
+    "@carbon/cli-reporter": "^10.3.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.7.0",
+  "version": "10.8.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.5.0",
-    "@carbon/cli-reporter": "10.3.0",
-    "@carbon/scss-generator": "^10.5.0",
-    "@carbon/test-utils": "^10.6.0",
+    "@carbon/bundler": "^10.6.0",
+    "@carbon/cli-reporter": "^10.3.0",
+    "@carbon/scss-generator": "^10.6.0",
+    "@carbon/test-utils": "^10.7.0",
     "change-case": "^4.1.1",
     "core-js": "^3.0.1",
     "fs-extra": "^8.1.0",

packages/components/docs/sass.md

@@ -5989,7 +5989,6 @@ $interactive-01: if(
   - [date-picker [mixin]](#date-picker-mixin)
   - [pseudo-underline [mixin]](#pseudo-underline-mixin)
   - [progress-indicator [mixin]](#progress-indicator-mixin)
-  - [tabs [mixin]](#tabs-mixin)
   - [tooltip--definition--legacy [mixin]](#tooltip--definition--legacy-mixin)
   - [tooltip [mixin]](#tooltip-mixin)
 
@@ -18804,16 +18803,16 @@ Modal styles
 
   .#{$prefix}--modal-footer {
     display: flex;
+    justify-content: flex-end;
     margin-top: auto;
     height: 4rem;
-    background-color: $modal-footer-background-color;
 
     grid-row: -1/-1;
     grid-column: 1/-1;
 
     button.#{$prefix}--btn {
       max-width: none;
-      flex: 1;
+      flex: 0 1 50%;
       height: 4rem;
       margin: 0;
       padding-top: $spacing-05;
@@ -21604,7 +21603,6 @@ Slider styles
   .#{$prefix}-slider-text-input {
     width: rem(64px);
     height: rem(40px);
-    padding: 0;
     text-align: center;
     -moz-appearance: textfield;
 
@@ -22071,16 +22069,12 @@ Tabs styles
 
     @include carbon--breakpoint(md) {
       display: flex;
-      .#{$prefix}--tabs__nav-link {
-        color: $text-01;
-        @include type-style('productive-heading-01');
-        border-bottom: 3px solid $interactive-01;
-      }
-
+      .#{$prefix}--tabs__nav-link,
       .#{$prefix}--tabs__nav-link:focus,
       .#{$prefix}--tabs__nav-link:active {
+        @include type-style('productive-heading-01');
         color: $text-01;
-        border-bottom: 2px solid $interactive-01;
+        border-bottom: 2px solid $interactive-04;
       }
     }
   }
@@ -22113,7 +22107,8 @@ Tabs styles
   //-----------------------------
   a.#{$prefix}--tabs__nav-link {
     @include focus-outline('reset');
-    display: inline-block;
+    display: inline-flex;
+    align-items: flex-end;
     color: $text-02;
     text-decoration: none;
     font-weight: 400;
@@ -22131,10 +22126,10 @@ Tabs styles
 
     &:focus,
     &:active {
+      @include focus-outline('outline');
       width: 100%;
       margin: 0;
       padding-left: 16px;
-      @include focus-outline('outline');
     }
 
     @include carbon--breakpoint(md) {
@@ -22271,9 +22266,8 @@ Tabs styles
   - [hover-selected-ui [variable]](#hover-selected-ui-variable)
   - [disabled-02 [variable]](#disabled-02-variable)
   - [disabled-03 [variable]](#disabled-03-variable)
-  - [interactive-01 [variable]](#interactive-01-variable)
-  - [spacing-03 [variable]](#spacing-03-variable)
   - [interactive-04 [variable]](#interactive-04-variable)
+  - [spacing-03 [variable]](#spacing-03-variable)
   - [text-02 [variable]](#text-02-variable)
   - [spacing-04 [variable]](#spacing-04-variable)
   - [carbon--spacing-05 [variable]](#carbon--spacing-05-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.9.0",
+  "version": "10.10.1",
   "license": "Apache-2.0",
   "main": "umd/index.js",
   "module": "es/index.js",
@@ -80,10 +80,10 @@
     "@babel/preset-env": "^7.7.7",
     "@babel/preset-react": "^7.7.4",
     "@babel/runtime": "^7.7.7",
-    "@carbon/elements": "^10.9.0",
-    "@carbon/icons-handlebars": "^10.8.0",
-    "@carbon/icons-react": "^10.8.0",
-    "@carbon/test-utils": "^10.6.0",
+    "@carbon/elements": "^10.10.1",
+    "@carbon/icons-handlebars": "^10.9.1",
+    "@carbon/icons-react": "^10.9.1",
+    "@carbon/test-utils": "^10.7.0",
     "@frctl/fractal": "^1.1.0",
     "adaro": "1.0.4",
     "autoprefixer": "^9.7.4",
@@ -94,7 +94,7 @@
     "babel-plugin-rewire": "^1.1.0",
     "bluebird": "~3.1.1",
     "browser-sync": "^2.26.3",
-    "browserslist-config-carbon": "10.4.0",
+    "browserslist-config-carbon": "^10.4.0",
     "carbon-components": "^9.0.0",
     "carbon-components-react": "^6.0.0",
     "chokidar": "^2.0.0",

packages/components/src/components/modal/_modal.scss

@@ -292,16 +292,16 @@
 
   .#{$prefix}--modal-footer {
     display: flex;
+    justify-content: flex-end;
     margin-top: auto;
     height: 4rem;
-    background-color: $modal-footer-background-color;
 
     grid-row: -1/-1;
     grid-column: 1/-1;
 
     button.#{$prefix}--btn {
       max-width: none;
-      flex: 1;
+      flex: 0 1 50%;
       height: 4rem;
       margin: 0;
       padding-top: $spacing-05;

packages/components/src/components/slider/_slider.scss

@@ -117,7 +117,6 @@
   .#{$prefix}-slider-text-input {
     width: rem(64px);
     height: rem(40px);
-    padding: 0;
     text-align: center;
     -moz-appearance: textfield;
 

packages/components/src/components/tabs/_tabs.scss

@@ -254,16 +254,12 @@
 
     @include carbon--breakpoint(md) {
       display: flex;
-      .#{$prefix}--tabs__nav-link {
-        color: $text-01;
-        @include type-style('productive-heading-01');
-        border-bottom: 3px solid $interactive-01;
-      }
-
+      .#{$prefix}--tabs__nav-link,
       .#{$prefix}--tabs__nav-link:focus,
       .#{$prefix}--tabs__nav-link:active {
+        @include type-style('productive-heading-01');
         color: $text-01;
-        border-bottom: 2px solid $interactive-01;
+        border-bottom: 2px solid $interactive-04;
       }
     }
   }
@@ -296,7 +292,8 @@
   //-----------------------------
   a.#{$prefix}--tabs__nav-link {
     @include focus-outline('reset');
-    display: inline-block;
+    display: inline-flex;
+    align-items: flex-end;
     color: $text-02;
     text-decoration: none;
     font-weight: 400;
@@ -314,10 +311,10 @@
 
     &:focus,
     &:active {
+      @include focus-outline('outline');
       width: 100%;
       margin: 0;
       padding-left: 16px;
-      @include focus-outline('outline');
     }
 
     @include carbon--breakpoint(md) {

packages/components/src/globals/scss/__tests__/themes-test.js

@@ -81,7 +81,6 @@ const classic = [
 
   // Modal
   'modal-border-top',
-  'modal-footer-background-color',
 
   // Progress Indicator
   'progress-indicator-bar-width',

packages/components/src/globals/scss/_theme-tokens.scss

@@ -255,6 +255,7 @@ $modal-border-top: $brand-01 4px solid !default;
 /// @type Color
 /// @access public
 /// @group modal
+/// @deprecated
 $modal-footer-background-color: $ui-03 !default;
 
 // Notification
@@ -336,12 +337,12 @@ $structured-list-text-transform: none !default;
 /// @type Value
 /// @access public
 /// @group tabs
-$tab-underline-color: 3px solid $ui-03 !default;
+$tab-underline-color: 2px solid $ui-03 !default;
 
 /// @type Value
 /// @access public
 /// @group tabs
-$tab-underline-color-hover: 3px solid $ui-04 !default;
+$tab-underline-color-hover: 2px solid $ui-04 !default;
 
 /// @type Color
 /// @access public
@@ -351,7 +352,7 @@ $tab-text-disabled: $disabled-02 !default;
 /// @type Value
 /// @access public
 /// @group tabs
-$tab-underline-disabled: 3px solid $disabled-01 !default;
+$tab-underline-disabled: 2px solid $disabled-01 !default;
 
 // Skeleton Loading
 

packages/components/tools/copy-vendor-styles.sh

@@ -21,7 +21,7 @@ root_path=$PWD
 echo "Cleaning vendor directory..."
 
 VENDOR_DIR="$PWD/src/globals/scss/vendor"
-rm -rf $VENDOR_DIR
+rm -rf "$VENDOR_DIR"
 
 for package in node_modules/@carbon/*; do
   PKG_NAME="@carbon/$(basename $package)"
@@ -30,8 +30,8 @@ for package in node_modules/@carbon/*; do
 
   if [ -d "$SCSS_FILES" ]; then
     echo "Copying scss files for package: $PKG_NAME to $TARGET_DIR"
-    mkdir -p $TARGET_DIR
-    cp -R $SCSS_FILES $TARGET_DIR
+    mkdir -p "$TARGET_DIR"
+    cp -R $SCSS_FILES "$TARGET_DIR"
   fi
 done
 
@@ -44,8 +44,8 @@ for symlink in $(find ../../node_modules/@carbon -type l -maxdepth 1); do
 
   if [ -d "$SCSS_FILES" ]; then
     echo "Copying scss files for package: $PKG_NAME to $TARGET_DIR"
-    mkdir -p $TARGET_DIR
-    cp -R $SCSS_FILES $TARGET_DIR
+    mkdir -p "$TARGET_DIR"
+    cp -R $SCSS_FILES "$TARGET_DIR"
   fi
 done
 

packages/elements/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/elements",
   "description": "A collection of design elements in code for the IBM Design Language",
-  "version": "10.9.0",
+  "version": "10.10.1",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -31,17 +31,17 @@
     "clean": "rimraf es lib umd && node tasks/clean.js"
   },
   "dependencies": {
-    "@carbon/colors": "^10.7.0",
-    "@carbon/grid": "^10.8.0",
-    "@carbon/icons": "^10.8.0",
-    "@carbon/import-once": "10.3.0",
-    "@carbon/layout": "^10.7.0",
-    "@carbon/motion": "^10.5.0",
-    "@carbon/themes": "^10.9.0",
-    "@carbon/type": "^10.8.0"
+    "@carbon/colors": "^10.8.0",
+    "@carbon/grid": "^10.9.1",
+    "@carbon/icons": "^10.9.1",
+    "@carbon/import-once": "^10.3.0",
+    "@carbon/layout": "^10.8.1",
+    "@carbon/motion": "^10.6.0",
+    "@carbon/themes": "^10.10.1",
+    "@carbon/type": "^10.9.1"
   },
   "devDependencies": {
-    "@carbon/bundler": "^10.5.0",
+    "@carbon/bundler": "^10.6.0",
     "fs-extra": "^8.1.0",
     "klaw-sync": "^6.0.0",
     "replace-in-file": "^3.4.2",