@carbon/ibm-products 2.0.0-rc.0 → 2.0.0-rc.10

package/lib/global/js/hooks/useResetCreateComponent.js

@@ -7,6 +7,8 @@ exports.useResetCreateComponent = void 0;
 
 var _react = require("react");
 
+var _getNumberOfHiddenSteps = require("../utils/getNumberOfHiddenSteps");
+
 /**
  * Copyright IBM Corp. 2021, 2022
  *
@@ -21,6 +23,7 @@ var _react = require("react");
  * @param {object} useResetCreateComponent.previousState
  * @param {boolean} useResetCreateComponent.open
  * @param {Function} useResetCreateComponent.setCurrentStep
+ * @param {object} useResetCreateComponent.stepData
  * @param {number} useResetCreateComponent.initialStep
  * @param {number} useResetCreateComponent.totalSteps
  * @param {string} useResetCreateComponent.componentName
@@ -30,13 +33,15 @@ var useResetCreateComponent = function useResetCreateComponent(_ref) {
       previousState = _ref.previousState,
       open = _ref.open,
       setCurrentStep = _ref.setCurrentStep,
+      stepData = _ref.stepData,
       initialStep = _ref.initialStep,
       totalSteps = _ref.totalSteps,
       componentName = _ref.componentName;
   (0, _react.useEffect)(function () {
     if (!(previousState !== null && previousState !== void 0 && previousState.open) && open) {
       if (initialStep && totalSteps && Number(initialStep) <= Number(totalSteps) && Number(initialStep) > 0) {
-        setCurrentStep(Number(initialStep));
+        var numberOfHiddenSteps = (0, _getNumberOfHiddenSteps.getNumberOfHiddenSteps)(stepData, initialStep);
+        setCurrentStep(Number(initialStep + numberOfHiddenSteps));
       } else {
         // default should be fist includedStep instead of just 1
         setCurrentStep(firstIncludedStep);
@@ -47,7 +52,7 @@ var useResetCreateComponent = function useResetCreateComponent(_ref) {
         console.warn("".concat(componentName, ": An invalid `initialStep` prop was supplied. The `initialStep` prop should be a number that is greater than 0 or less than or equal to the number of steps your ").concat(componentName, " has."));
       }
     }
-  }, [firstIncludedStep, open, previousState, setCurrentStep, initialStep, totalSteps, componentName]);
+  }, [firstIncludedStep, open, previousState, setCurrentStep, stepData, initialStep, totalSteps, componentName]);
 };
 
 exports.useResetCreateComponent = useResetCreateComponent;

package/lib/global/js/package-settings.js

@@ -40,6 +40,7 @@ var defaults = {
     HTTPErrorOther: true,
     ImportModal: true,
     InlineEdit: true,
+    InlineEditV1: true,
     NotificationsPanel: true,
     NoDataEmptyState: true,
     NoTagsEmptyState: true,
@@ -57,6 +58,9 @@ var defaults = {
     TearsheetNarrow: true,
     UnauthorizedEmptyState: true,
     UserProfileImage: true,
+    WebTerminal: true,
+    WebTerminalContentWrapper: true,
+    WebTerminalProvider: true,
     // other public components not yet reviewed and released:
     MultiAddSelect: false,
     SingleAddSelect: false,
@@ -64,16 +68,15 @@ var defaults = {
     Toolbar: false,
     ToolbarButton: false,
     ToolbarGroup: false,
-    WebTerminal: false,
-    WebTerminalContentWrapper: false,
-    WebTerminalProvider: false,
     EditSidePanel: false,
     CancelableTextEdit: false,
     DataSpreadsheet: false,
     Datagrid: false,
     EditTearsheet: false,
     EditTearsheetNarrow: false,
-    EditFullPage: false
+    EditFullPage: false,
+    EditUpdateCards: false,
+    InlineEditV2: false
     /* new component flags here - comment used by generate CLI */
 
   },

package/lib/global/js/utils/getBezierValues.js

@@ -0,0 +1,29 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getBezierValues = void 0;
+
+var _motion = require("@carbon/motion");
+
+/**
+ * This function turns a cubic-bezier() string to an
+ * array of values that we can use with framer-motion
+ * @param {string} type - The carbon motion type, either 'standard', 'entrance', or 'exit'
+ * @param {string} mode - The carbon motion mode, either 'productive', or 'expressive'
+ */
+var getBezierValues = function getBezierValues(type, mode) {
+  var cubicBezier = (0, _motion.motion)(type, mode);
+  var extractStringFromParens = /\(([^)]+)\)/;
+  var desiredBezierStrings = extractStringFromParens.exec(cubicBezier)[1];
+  var formattedDesiredBezierStrings = desiredBezierStrings.trim().split(',').map(Number);
+
+  if (Array.isArray(formattedDesiredBezierStrings)) {
+    return formattedDesiredBezierStrings;
+  }
+
+  return [];
+};
+
+exports.getBezierValues = getBezierValues;

package/lib/global/js/utils/getNumberOfHiddenSteps.js

@@ -0,0 +1,28 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getNumberOfHiddenSteps = void 0;
+
+/**
+ * Copyright IBM Corp. 2022, 2022
+ *
+ * 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 getNumberOfHiddenSteps = function getNumberOfHiddenSteps(stepData, initialStep) {
+  var numberOfHiddenSteps = 0;
+  stepData.forEach(function (step, stepIndex) {
+    if (stepIndex + 1 > initialStep) {
+      return;
+    }
+
+    if (step.shouldIncludeStep === false) {
+      numberOfHiddenSteps += 1;
+    }
+  });
+  return numberOfHiddenSteps;
+};
+
+exports.getNumberOfHiddenSteps = getNumberOfHiddenSteps;

package/lib/global/js/utils/motionConstants.js

@@ -0,0 +1,55 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.EASINGS = exports.DURATIONS = void 0;
+
+var _getBezierValues = require("./getBezierValues");
+
+var _motion = require("@carbon/motion");
+
+/**
+ * Copyright IBM Corp. 2022, 2022
+ *
+ * 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 cleanMotionValue = function cleanMotionValue(val) {
+  return parseInt(val) / 1000;
+};
+
+var DURATIONS = {
+  // Micro-interactions such as button and toggle
+  fast01: cleanMotionValue(_motion.fast01),
+  // '70ms'
+  // Micro-interactions such as fade
+  fast02: cleanMotionValue(_motion.fast02),
+  // '110ms'
+  // Micro-interactions, small expansion, short distance movements
+  moderate01: cleanMotionValue(_motion.moderate01),
+  // '150ms'
+  // Expansion, system communication, toast
+  moderate02: cleanMotionValue(_motion.moderate02),
+  // '240ms'
+  // Large expansion, important system notifications
+  slow01: cleanMotionValue(_motion.slow01),
+  // '400ms'
+  //  Background dimming
+  slow02: cleanMotionValue(_motion.slow02) // '700ms'
+
+};
+exports.DURATIONS = DURATIONS;
+var EASINGS = {
+  productive: {
+    entrance: (0, _getBezierValues.getBezierValues)('entrance', 'productive'),
+    standard: (0, _getBezierValues.getBezierValues)('standard', 'productive'),
+    exit: (0, _getBezierValues.getBezierValues)('exit', 'productive')
+  },
+  expressive: {
+    entrance: (0, _getBezierValues.getBezierValues)('entrance', 'expressive'),
+    standard: (0, _getBezierValues.getBezierValues)('standard', 'expressive'),
+    exit: (0, _getBezierValues.getBezierValues)('exit', 'expressive')
+  }
+};
+exports.EASINGS = EASINGS;

package/lib/global/js/utils/rangeWithCallback.js

@@ -0,0 +1,22 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.rangeWithCallback = void 0;
+
+/**
+ * Copyright IBM Corp. 2022, 2022
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+// Iterates through a numeric range and calls callback
+// function for each iteration
+var rangeWithCallback = function rangeWithCallback(start, end, fn) {
+  for (var i = start; i <= end; i++) {
+    fn(i);
+  }
+};
+
+exports.rangeWithCallback = rangeWithCallback;

package/lib/global/js/utils/story-helper.js

@@ -46,7 +46,11 @@ var getStoryTitle = function getStoryTitle(componentName) {
 
 exports.getStoryTitle = getStoryTitle;
 
-var getStoryId = function getStoryId(componentName, scenario) {
+var getStoryId = function getStoryId(componentName, scenario, subdirectory) {
+  if (subdirectory) {
+    return "".concat((0, _csf.sanitize)(getStoryTitle(componentName)), "-").concat((0, _csf.sanitize)(subdirectory), "--").concat(scenario);
+  }
+
   return "".concat((0, _csf.sanitize)(getStoryTitle(componentName)), "--").concat(scenario);
 };
 /**

package/lib/global/js/utils/uuidv4.spec.js

@@ -9,11 +9,15 @@ describe('uuidv4', function () {
     jest.resetAllMocks();
   });
   it('Uses Math.random when window is not defined', function () {
+    var _window = window,
+        crypto = _window.crypto;
+    delete window.crypto;
     var mockMath = Object.create(global.Math);
     var mockMathRandom = jest.fn().mockReturnValue(0.5);
     mockMath.random = mockMathRandom;
     global.Math = mockMath;
     expect((0, _uuidv.default)()).toEqual('98888888-9888-4888-a888-988888888888');
+    window.crypto = crypto;
   });
   it('Uses crypto from window when window is defined', function () {
     var mGetRandomValues = jest.fn().mockReturnValue(new Uint32Array(10));

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/ibm-products",
   "description": "Carbon for IBM Products",
-  "version": "2.0.0-rc.0",
+  "version": "2.0.0-rc.10",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -36,11 +36,12 @@
     "access": "public"
   },
   "scripts": {
-    "build": "run-s clean build-first build-all",
+    "build": "run-s clean build-first build-all build-css-update-maps",
     "build-all": "run-p 'build:*'",
     "build-first": "copyfiles 'src/**/*.scss' scss -u 1",
     "build:css-dev": "sass --style=expanded --load-path node_modules --load-path ../../node_modules scss:css",
     "build:css-min": "sass --style=compressed --load-path node_modules --load-path ../../node_modules scss/index.scss:css/index.min.css scss/index-full-carbon.scss:css/index-full-carbon.min.css scss/index-without-carbon.scss:css/index-without-carbon.min.css scss/index-without-carbon-released-only.scss:css/index-without-carbon-released-only.min.css",
+    "build-css-update-maps": "node ../../scripts/updateSourceMaps.js",
     "build:js-esm": "cross-env BABEL_ENV=esm yarn build:js:modules -d es",
     "build:js-cjs": "cross-env BABEL_ENV=cjs yarn build:js:modules -d lib",
     "build:js:modules": "babel src --ignore '**/__tests__','**/*.test.js','**/*.stories.js','src/utils/**/*'",
@@ -54,33 +55,28 @@
   },
   "devDependencies": {
     "@babel/cli": "^7.18.10",
-    "@babel/core": "^7.18.10",
-    "babel-preset-ibm-cloud-cognitive": "^0.14.18",
+    "@babel/core": "^7.18.13",
+    "babel-preset-ibm-cloud-cognitive": "^0.14.19",
     "chalk": "^4.1.2",
     "change-case": "^4.1.2",
     "copyfiles": "^2.4.1",
     "cross-env": "^7.0.3",
     "fs-extra": "^10.1.0",
     "glob": "^8.0.3",
-    "jest": "^28.1.3",
-    "jest-config-ibm-cloud-cognitive": "^0.24.3",
-    "jest-environment-jsdom": "^28.1.3",
+    "jest": "^29.0.1",
+    "jest-config-ibm-cloud-cognitive": "^0.24.5",
+    "jest-environment-jsdom": "^29.0.1",
     "namor": "^1.1.2",
-    "npm-check-updates": "^16.0.5",
+    "npm-check-updates": "^16.0.6",
     "npm-run-all": "^4.1.5",
     "rimraf": "^3.0.2",
-    "sass": "^1.54.0",
+    "sass": "^1.54.8",
     "yargs": "^17.5.1"
   },
   "dependencies": {
     "@babel/runtime": "^7.18.9",
-    "@carbon/grid": "^11.3.0",
-    "@carbon/layout": "^11.3.0",
-    "@carbon/motion": "^11.2.0",
-    "@carbon/react": "^1.9.0-rc.0",
     "@carbon/telemetry": "^0.1.0",
-    "@carbon/themes": "^11.4.0",
-    "@carbon/type": "^11.4.0",
+    "framer-motion": "^6.5.1",
     "immutability-helper": "^3.1.1",
     "react-dnd": "^15.1.2",
     "react-dnd-html5-backend": "^15.1.3",
@@ -89,8 +85,14 @@
     "react-window": "^1.8.7"
   },
   "peerDependencies": {
+    "@carbon/grid": "^11.3.0",
+    "@carbon/layout": "^11.3.0",
+    "@carbon/motion": "^11.2.0",
+    "@carbon/react": "^1.13.0",
+    "@carbon/themes": "^11.4.0",
+    "@carbon/type": "^11.4.0",
     "react": "^16.8.6 || ^17.0.1",
     "react-dom": "^16.8.6 || ^17.0.1"
   },
-  "gitHead": "a6d3c1295dbe9918e95c1eb75d53188b7770fb8e"
+  "gitHead": "f366a6fd9163f004b89aec79e0486f31a4b9a8d2"
 }

package/scss/components/AboutModal/_about-modal.scss

@@ -54,7 +54,8 @@ $block-class: #{c4p-settings.$pkg-prefix}--about-modal;
 
 .#{$block-class}.#{$block-class}--with-tabs
   .#{c4p-settings.$carbon-prefix}--modal-content--overflow-indicator {
-  bottom: calc(#{$spacing-09} +#{$spacing-08});
+  // stylelint-disable-next-line carbon/layout-token-use
+  bottom: calc(#{$spacing-09} + #{$spacing-08});
 }
 
 .#{$block-class}

package/scss/components/ActionSet/_action-set.scss

@@ -22,15 +22,20 @@ $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set;
 .#{$action-set-block-class} .#{$action-set-block-class}__action-button {
   @include type.type-style('body-short-01');
 
-  height: $spacing-10;
   align-items: center;
-  padding-top: $spacing-05;
-  padding-bottom: $spacing-07;
   margin: 0;
+
+  &.#{$action-set-block-class}__action-button--expressive {
+    height: $spacing-10;
+    padding-top: $spacing-05;
+    padding-bottom: $spacing-07;
+  }
 }
 
 .#{$action-set-block-class}.#{c4p-settings.$carbon-prefix}--btn-set
-  .#{$action-set-block-class}__action-button.#{c4p-settings.$carbon-prefix}--btn.#{c4p-settings.$carbon-prefix}--btn--expressive {
+  .#{$action-set-block-class}__action-button.#{c4p-settings.$carbon-prefix}--btn.#{c4p-settings.$carbon-prefix}--btn--expressive,
+.#{$action-set-block-class}.#{c4p-settings.$carbon-prefix}--btn-set
+  .#{$action-set-block-class}__action-button.#{c4p-settings.$carbon-prefix}--btn {
   max-width: none;
 }
 

package/scss/components/AddSelect/_add-select.scss

@@ -1,5 +1,5 @@
 //
-// Copyright IBM Corp. 2021
+// Copyright IBM Corp. 2022, 2022
 //
 // This source code is licensed under the Apache-2.0 license found in the
 // LICENSE file in the root directory of this source tree.
@@ -30,7 +30,6 @@ $tearsheet-class: #{$pkg-prefix}--tearsheet;
 /* stylelint-disable max-nesting-depth */
 .#{$block-class}__selections {
   &.#{$carbon-prefix}--structured-list {
-    border-top: 1px solid $layer-accent-01;
     margin-bottom: 0;
   }
 
@@ -40,8 +39,11 @@ $tearsheet-class: #{$pkg-prefix}--tearsheet;
 
   &-cell-wrapper {
     display: flex;
+    height: 3rem;
     align-items: center;
     justify-content: space-between;
+    padding: 0 $spacing-05;
+    border-bottom: 1px solid $layer-accent-01;
   }
 
   &-cell-title {
@@ -56,7 +58,15 @@ $tearsheet-class: #{$pkg-prefix}--tearsheet;
     color: $text-secondary;
   }
 
-  &-cell:hover .#{$block-class}__selections-hidden-hover {
+  &-cell {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+  }
+
+  &-cell:hover .#{$block-class}__selections-hidden-hover,
+  .#{$carbon-prefix}--structured-list-row:focus-within
+    .#{$block-class}__selections-hidden-hover {
     visibility: visible;
   }
 
@@ -64,12 +74,9 @@ $tearsheet-class: #{$pkg-prefix}--tearsheet;
     visibility: hidden;
   }
 
-  &-row-selected {
-    background: #e5e5e5;
-  }
-
-  &-row-selected .#{$block-class}__selections-hidden-hover {
-    visibility: visible;
+  &-row--selected.#{$carbon-prefix}--structured-list-row {
+    border-bottom: 1px solid $layer-selected-01;
+    background-color: $layer-selected-01;
   }
 
   &-checkbox {
@@ -79,7 +86,7 @@ $tearsheet-class: #{$pkg-prefix}--tearsheet;
 
   &-checkbox-label-wrapper {
     display: flex;
-    margin-left: $spacing-03;
+    margin-left: $spacing-05;
   }
 
   &-checkbox-label-text {
@@ -102,6 +109,15 @@ $tearsheet-class: #{$pkg-prefix}--tearsheet;
   &-cell-icon {
     margin-right: $spacing-03;
   }
+
+  &-row {
+    border-left: 0.125rem solid transparent;
+  }
+
+  &-row-meta--selected {
+    border-left: 0.125rem solid $interactive;
+    background-color: $layer-hover-01;
+  }
 }
 
 .#{$block-class} .#{$block-class}__selections-row:hover {
@@ -124,13 +140,27 @@ $tearsheet-class: #{$pkg-prefix}--tearsheet;
   display: flex;
   align-items: flex-end;
   justify-content: space-between;
+
+  &-multi {
+    padding: 0 $spacing-05;
+  }
+}
+
+.#{$block-class} .#{$carbon-prefix}--structured-list-row {
+  border-bottom: 0;
+}
+
+.#{$block-class}
+  .#{$carbon-prefix}--structured-list--selection
+  .#{$carbon-prefix}--structured-list-row:hover:not(.#{$carbon-prefix}--structured-list-row--header-row):not(.#{$carbon-prefix}--structured-list-row--selected) {
+  border-bottom: 0;
 }
 
 // sidebar
 
 .#{$block-class}__sidebar-header {
   display: flex;
-  padding: $spacing-06 $spacing-05 $spacing-03 $spacing-05;
+  padding: $spacing-07 $spacing-05 $spacing-03 $spacing-05;
   border-bottom: 1px solid $layer-accent-01;
 
   .#{$block-class}__sidebar-title {
@@ -155,7 +185,7 @@ $tearsheet-class: #{$pkg-prefix}--tearsheet;
 }
 
 .#{$block-class}__sidebar-body {
-  padding: $spacing-05;
+  padding: 0 $spacing-05;
 }
 
 .#{$block-class} .#{$block-class}__sidebar-item-header {
@@ -186,22 +216,52 @@ $tearsheet-class: #{$pkg-prefix}--tearsheet;
 .#{$block-class}__columns {
   display: flex;
   flex-direction: row;
+  flex-grow: 1;
   overflow-x: auto;
+
+  .#{$block-class}__selections-checkbox-label-wrapper {
+    margin-left: $spacing-03;
+  }
+
+  .#{$block-class}__selections-row.#{$carbon-prefix}--structured-list-row {
+    border-left: 0;
+  }
+
+  .#{$block-class}__selections .#{$block-class}__selections-cell {
+    padding: 0;
+  }
+
+  .#{$block-class}__selections-cell-wrapper {
+    height: auto;
+    padding: 0 $spacing-03;
+  }
+
+  .#{$block-class}__tags {
+    padding: 0 $spacing-03;
+    margin-bottom: 0;
+  }
+
+  .#{$block-class}__selections-wrapper-multi {
+    padding: 0;
+  }
+
+  .#{$block-class}__selections.#{$carbon-prefix}--structured-list {
+    border-top: 0;
+  }
 }
 
-// table override
-.#{$block-class}
-  .#{$block-class}__columns
-  .#{$carbon-prefix}--structured-list-td {
-  height: 0;
-  // stylelint-disable-next-line
-  padding: 0 !important;
+.#{$block-class}__selections-wrapper-multi .#{$block-class}__selections-cell {
+  padding: 0 $spacing-05;
+}
+
+.#{$block-class}__selections-row:first-child
+  .#{$block-class}__selections-cell-wrapper {
+  border-top: 1px solid $border-subtle-01;
 }
 
 .#{$block-class}__column {
   overflow: auto;
-  max-width: 15rem;
-  flex: 1 0 15rem;
+  flex: 0 0 20rem;
   padding: $spacing-05;
   border-top: 1px solid $border-subtle-01;
   border-right: 1px solid $border-subtle-01;
@@ -223,7 +283,7 @@ $tearsheet-class: #{$pkg-prefix}--tearsheet;
   }
 }
 
-.#{$block-class}__tag-container {
+.#{$block-class}__tags {
   display: flex;
   align-items: center;
   margin-top: $spacing-05;
@@ -308,27 +368,23 @@ button.#{$block-class}__global-filter-toggle {
   @include type.type-style('productive-heading-01');
 }
 
-.#{$block-class} .#{$carbon-prefix}--structured-list-td {
-  height: $spacing-09;
-  padding-top: 0;
-  padding-bottom: 0;
-  vertical-align: middle;
-}
-
 .#{$block-class}__meta-panel p.#{$block-class}__meta-panel-entry-body {
   @include type.type-style('body-short-01');
 }
 
 // overrides
 
-.#{$block-class}__tag-container .#{$carbon-prefix}--tag {
+.#{$block-class}__selections .#{$carbon-prefix}--list-box__menu {
+  left: auto;
+}
+
+.#{$block-class}__tags .#{$carbon-prefix}--tag {
   margin: 0;
 }
 
 // the influencer sidebar needs to be even with the buttons
 .#{$block-class}.#{$tearsheet-class} .#{$tearsheet-class}__influencer {
-  max-width: 29rem;
-  flex: 0 0 50%;
+  flex-basis: 22.5rem;
 }
 
 .#{$block-class}.#{$tearsheet-class} .#{$tearsheet-class}__header-description {
@@ -340,6 +396,12 @@ button.#{$block-class}__global-filter-toggle {
   flex-direction: column;
 }
 
+.#{$block-class}.#{$block-class}__multi
+  .#{$pkg-prefix}--action-set.#{$carbon-prefix}--btn-set.#{$pkg-prefix}--action-set--max
+  .#{$pkg-prefix}--action-set__action-button {
+  max-width: 11.25rem;
+}
+
 .#{$block-class} .#{$block-class}__items-label {
   @include type.type-style('productive-heading-01');
 }
@@ -351,6 +413,7 @@ button.#{$block-class}__global-filter-toggle {
   padding-right: 0;
 }
 
+// TODO check if we can remove – C10/C11 conflict
 .#{$block-class} .#{$carbon-prefix}--structured-list-td {
   height: 4rem;
   padding: $spacing-05;
@@ -385,7 +448,42 @@ button.#{$block-class}__global-filter-toggle {
   padding-left: $spacing-03;
 }
 
-.#{$carbon-prefix}--tooltip,
-.#{$carbon-prefix}--overflow-menu-options {
+.#{$block-class}__multi .#{$pkg-prefix}--empty-state {
+  max-width: 16rem;
+  margin-top: $spacing-09;
+}
+
+.#{$block-class} .#{$carbon-prefix}--accordion__arrow {
+  transform: rotate(0deg);
+}
+
+.#{$block-class}
+  .#{$carbon-prefix}--accordion__item--active
+  .#{$carbon-prefix}--accordion__arrow {
+  transform: rotate(90deg);
+}
+
+.#{$block-class}
+  .#{$carbon-prefix}--accordion--start
+  .#{$carbon-prefix}--accordion__arrow {
+  margin: 0 0 0 $spacing-05;
+}
+
+.#{$block-class}
+  .#{$carbon-prefix}--accordion--start
+  .#{$carbon-prefix}--accordion__title {
+  margin: 0 $spacing-05 0 $spacing-03;
+}
+
+.#{$block-class}
+  .#{$carbon-prefix}--accordion__item--active
+  .#{$carbon-prefix}--accordion__content {
+  padding-top: 0;
+  padding-bottom: 0;
+  margin-top: $spacing-03;
+}
+
+.#{$block-class} .#{$carbon-prefix}--tooltip,
+.#{$block-class} .#{$carbon-prefix}--overflow-menu-options {
   z-index: 9000;
 }

package/scss/components/AddSelect/_index.scss

@@ -1,5 +1,5 @@
 //
-// Copyright IBM Corp. 2021
+// Copyright IBM Corp. 2022, 2022
 //
 // This source code is licensed under the Apache-2.0 license found in the
 // LICENSE file in the root directory of this source tree.

package/scss/components/AddSelect/_storybook-styles.scss

@@ -1,5 +1,5 @@
 //
-// Copyright IBM Corp. 2021
+// Copyright IBM Corp. 2022, 2022
 //
 // This source code is licensed under the Apache-2.0 license found in the
 // LICENSE file in the root directory of this source tree.

package/scss/components/Card/_card.scss

@@ -21,6 +21,7 @@ $block-class: #{c4p-settings.$pkg-prefix}--card;
 
 .#{$block-class}__clickable {
   cursor: pointer;
+  // stylelint-disable-next-line carbon/motion-easing-use
   transition: background $duration-fast-02;
 }