@carbon/ibm-products 2.0.0-rc.22 → 2.0.0-rc.23

package/lib/components/Tearsheet/TearsheetShell.js

@@ -267,11 +267,13 @@ var TearsheetShell = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref)
     }, influencer), /*#__PURE__*/_react.default.createElement(_Wrap.Wrap, {
       className: "".concat(bc, "__right")
     }, /*#__PURE__*/_react.default.createElement(_Wrap.Wrap, {
+      className: "".concat(bc, "__main"),
       alwaysRender: includeActions,
-      className: "".concat(bc, "__main")
+      element: _react2.Layer
     }, /*#__PURE__*/_react.default.createElement(_Wrap.Wrap, {
+      className: "".concat(bc, "__content"),
       alwaysRender: influencer && influencerPosition === 'right',
-      className: "".concat(bc, "__content")
+      element: _react2.Layer
     }, children), /*#__PURE__*/_react.default.createElement(_Wrap.Wrap, {
       className: (0, _classnames.default)((_cx6 = {}, (0, _defineProperty2.default)(_cx6, "".concat(bc, "__influencer"), true), (0, _defineProperty2.default)(_cx6, "".concat(bc, "__influencer--wide"), influencerWidth === 'wide'), _cx6)),
       neverRender: influencerPosition !== 'right'

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/ibm-products",
   "description": "Carbon for IBM Products",
-  "version": "2.0.0-rc.22",
+  "version": "2.0.0-rc.23",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -94,5 +94,5 @@
     "react": "^16.8.6 || ^17.0.1",
     "react-dom": "^16.8.6 || ^17.0.1"
   },
-  "gitHead": "e8bca836f1a602f6288a9d3bcb29cd524a497000"
+  "gitHead": "9c7b2779466691e363e1c111f7049aa52623aba9"
 }

package/scss/components/Datagrid/styles/_useInlineEdit.scss

@@ -409,6 +409,10 @@ $row-heights: (
   outline-color: $support-error;
 }
 
+.#{variables.$block-class} .#{c4p-settings.$carbon-prefix}--text-input:focus {
+  background: $field-01;
+}
+
 .#{variables.$block-class}
   .#{variables.$block-class}__inline-edit--outer-cell-button--invalid
   .#{c4p-settings.$carbon-prefix}--number

package/scss/components/InlineEditV1/_inline-edit-v1.scss

@@ -34,8 +34,6 @@
 
 @mixin input-button-defaults($block-class) {
   display: inline-flex;
-  width: var(--#{$block-class}--size);
-  max-width: var(--#{$block-class}--size);
   height: 100%;
   min-height: initial;
   max-height: var(--#{$block-class}--size);
@@ -194,7 +192,7 @@ $block-class: #{c4p-settings.$pkg-prefix}--inline-edit;
     right: 0;
     display: flex;
     // width: room for validation, and two buttons
-    width: var(--#{$block-class}--toolbar-width);
+    // width: var(--#{$block-class}--toolbar-width);
     height: 100%;
     justify-content: space-between;
     cursor: text;

package/scss/components/Tearsheet/_carbon-imports.scss

@@ -1,5 +1,5 @@
 //
-// Copyright IBM Corp. 2022, 2022
+// Copyright IBM Corp. 2022, 2023
 //
 // This source code is licensed under the Apache-2.0 license found in the
 // LICENSE file in the root directory of this source tree.
@@ -8,3 +8,4 @@
 // Tearsheets use the following Carbon components:
 // Button, ComposedModal, ModalHeader, ModalBody,
 @use '@carbon/react/scss/components/modal';
+@use '@carbon/react/scss/layer';

package/scss/components/Tearsheet/_tearsheet.scss

@@ -1,5 +1,5 @@
 //
-// Copyright IBM Corp. 2020, 2022
+// Copyright IBM Corp. 2020, 2023
 //
 // This source code is licensed under the Apache-2.0 license found in the
 // LICENSE file in the root directory of this source tree.
@@ -266,6 +266,7 @@ $motion-duration: $duration-moderate-02;
   .#{$block-class}__main {
     display: flex;
     flex-direction: row;
+    background-color: $layer;
     grid-column: 1 / -1;
     grid-row: 1 / -1;
   }
@@ -281,9 +282,7 @@ $motion-duration: $duration-moderate-02;
   }
 
   &.#{$block-class}--wide .#{$block-class}__content {
-    background: $background;
-
-    // revert the background color overridden by #{$carbon-prefix}--modal styles
+    // Revert background color overridden by Carbon's modal - https://github.com/carbon-design-system/carbon/blob/main/packages/styles/scss/components/modal/_modal.scss#L54
     .#{$carbon-prefix}--pagination,
     .#{$carbon-prefix}--pagination__control-buttons,
     .#{$carbon-prefix}--text-input,
@@ -294,7 +293,7 @@ $motion-duration: $duration-moderate-02;
     .#{$carbon-prefix}--dropdown-list,
     .#{$carbon-prefix}--number input[type='number'],
     .#{$carbon-prefix}--date-picker__input {
-      background-color: $field-01;
+      background-color: $field;
     }
 
     .#{$carbon-prefix}--select--inline .#{$carbon-prefix}--select-input {