@carbon/ibm-products 2.27.0 → 2.28.0

package/lib/components/WebTerminal/WebTerminal.js

@@ -11,8 +11,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
-var index$2 = require('../../node_modules/prop-types/index.js');
-var index$1 = require('../../node_modules/classnames/index.js');
+var index$1 = require('../../node_modules/prop-types/index.js');
+var cx = require('classnames');
 var settings = require('../../settings.js');
 var icons = require('@carbon/react/icons');
 var react = require('@carbon/react');
@@ -23,6 +23,7 @@ var devtools = require('../../global/js/utils/devtools.js');
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
 var _excluded = ["actions", "children", "className", "closeIconDescription", "documentationLinks", "documentationLinksIconDescription", "isInitiallyOpen"];
 
@@ -105,7 +106,7 @@ exports.WebTerminal = /*#__PURE__*/React__default["default"].forwardRef(function
   };
   return shouldRender ? /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({}, _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, rest), devtools.getDevtoolsProps(componentName)), {
     ref: ref,
-    className: index$1["default"]([blockClass, className, _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "--open"), open), "".concat(blockClass, "--closed"), !open)]),
+    className: cx__default["default"]([blockClass, className, _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "--open"), open), "".concat(blockClass, "--closed"), !open)]),
     style: {
       animation: !prefersReducedMotion && webTerminalAnimationName
     },
@@ -176,33 +177,33 @@ exports.WebTerminal.propTypes = {
   /**
    * An array of actions to be displayed in the web terminal header bar
    */
-  actions: index$2["default"].arrayOf(index$2["default"].shape({
-    renderIcon: index$2["default"].func.isRequired,
-    onClick: index$2["default"].func.isRequired,
-    iconDescription: index$2["default"].string.isRequired
+  actions: index$1["default"].arrayOf(index$1["default"].shape({
+    renderIcon: index$1["default"].func.isRequired,
+    onClick: index$1["default"].func.isRequired,
+    iconDescription: index$1["default"].string.isRequired
   })),
   /**
    * Provide your own terminal component as children to show up in the web terminal
    */
-  children: index$2["default"].oneOfType([index$2["default"].arrayOf(index$2["default"].node), index$2["default"].node]).isRequired,
+  children: index$1["default"].oneOfType([index$1["default"].arrayOf(index$1["default"].node), index$1["default"].node]).isRequired,
   /**
    * Custom classname for additional styling of the web terminal
    */
-  className: index$2["default"].string,
+  className: index$1["default"].string,
   /**
    * Icon description for the close button
    */
-  closeIconDescription: index$2["default"].string.isRequired,
+  closeIconDescription: index$1["default"].string.isRequired,
   /**
    * Array of objects for each documentation link. Each documentation link uses the prop types of OverflowMenuItems. See more: https://react.carbondesignsystem.com/?path=/docs/components-overflowmenu--default
    */
-  documentationLinks: index$2["default"].arrayOf(index$2["default"].shape(_rollupPluginBabelHelpers.objectSpread2({}, react.OverflowMenuItem.propTypes))),
+  documentationLinks: index$1["default"].arrayOf(index$1["default"].shape(_rollupPluginBabelHelpers.objectSpread2({}, react.OverflowMenuItem.propTypes))),
   /**
    * Description for the documentation link overflow menu tooltip
    */
-  documentationLinksIconDescription: index$2["default"].string,
+  documentationLinksIconDescription: index$1["default"].string,
   /**
    * Optionally pass if the web terminal should be open by default
    */
-  isInitiallyOpen: index$2["default"].bool
+  isInitiallyOpen: index$1["default"].bool
 };

package/lib/components/WebTerminal/WebTerminalContentWrapper.js

@@ -11,14 +11,15 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
-var index$2 = require('../../node_modules/prop-types/index.js');
-var index$1 = require('../../node_modules/classnames/index.js');
+var index$1 = require('../../node_modules/prop-types/index.js');
+var cx = require('classnames');
 var settings = require('../../settings.js');
 var index = require('./hooks/index.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
 var _excluded = ["children"];
 
@@ -32,7 +33,7 @@ exports.WebTerminalContentWrapper = /*#__PURE__*/React__default["default"].forwa
     open = _useWebTerminal.open;
   return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({
     ref: ref,
-    className: index$1["default"]([blockClass, _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "--open"), open)])
+    className: cx__default["default"]([blockClass, _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "--open"), open)])
   }, rest), children);
 });
 
@@ -50,5 +51,5 @@ exports.WebTerminalContentWrapper.propTypes = {
   /**
    * Pass in content as children.
    */
-  children: index$2["default"].oneOfType([index$2["default"].arrayOf(index$2["default"].node), index$2["default"].node]).isRequired
+  children: index$1["default"].oneOfType([index$1["default"].arrayOf(index$1["default"].node), index$1["default"].node]).isRequired
 };

package/lib/components/_Canary/Canary.js

@@ -11,14 +11,15 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
-var index$1 = require('../../node_modules/prop-types/index.js');
-var index = require('../../node_modules/classnames/index.js');
+var index = require('../../node_modules/prop-types/index.js');
+var cx = require('classnames');
 var packageSettings = require('../../global/js/package-settings.js');
 var react = require('@carbon/react');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
 var _p, _br, _p2, _br2, _p3;
 var _excluded = ["className", "componentName"];
@@ -35,7 +36,7 @@ var Canary = function Canary(_ref /*, originalArgs*/) {
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
   var instructions = "\nimport { pkg } from '@carbon/ibm-products';\n// NOTE: must happen before component is first used\npkg.component.".concat(componentName, " = true;\n");
   return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({}, rest, {
-    className: index["default"](blockClass, className)
+    className: cx__default["default"](blockClass, className)
   }), /*#__PURE__*/React__default["default"].createElement("h2", null, "This component ", /*#__PURE__*/React__default["default"].createElement("strong", null, componentName), " is not ready yet."), _p || (_p = /*#__PURE__*/React__default["default"].createElement("p", null, "To enable it, initialize package flags before the component is first used.")), _br || (_br = /*#__PURE__*/React__default["default"].createElement("br", null)), _p2 || (_p2 = /*#__PURE__*/React__default["default"].createElement("p", null, "e.g. in main.js")), /*#__PURE__*/React__default["default"].createElement(react.CodeSnippet, {
     type: "multi"
   }, instructions), _br2 || (_br2 = /*#__PURE__*/React__default["default"].createElement("br", null)), _p3 || (_p3 = /*#__PURE__*/React__default["default"].createElement("p", null, "View a live example on", ' ', /*#__PURE__*/React__default["default"].createElement("a", {
@@ -44,9 +45,9 @@ var Canary = function Canary(_ref /*, originalArgs*/) {
 };
 Canary.propTypes = {
   /** Provide an optional class to be applied to the containing node */
-  className: index$1["default"].string,
+  className: index["default"].string,
   /** Name of the component that is not ready yet */
-  componentName: index$1["default"].string.isRequired
+  componentName: index["default"].string.isRequired
 };
 
 exports.Canary = Canary;

package/lib/node_modules/prop-types/index.js

@@ -10,7 +10,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var _commonjsHelpers = require('../../_virtual/_commonjsHelpers.js');
-var index = require('../../_virtual/index2.js');
+var index = require('../../_virtual/index.js');
 var require$$0 = require('react-is');
 var factoryWithTypeCheckers = require('./factoryWithTypeCheckers.js');
 var factoryWithThrowingShims = require('./factoryWithThrowingShims.js');

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/ibm-products",
   "description": "Carbon for IBM Products",
-  "version": "2.27.0",
+  "version": "2.28.0",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -70,6 +70,7 @@
     "babel-preset-ibm-cloud-cognitive": "^0.14.40",
     "chalk": "^4.1.2",
     "change-case": "4.1.2",
+    "classnames": "^2.5.1",
     "copyfiles": "^2.4.1",
     "cross-env": "^7.0.3",
     "fs-extra": "^11.2.0",
@@ -89,7 +90,7 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.23.9",
-    "@carbon/ibm-products-styles": "^2.26.0",
+    "@carbon/ibm-products-styles": "^2.27.0",
     "@carbon/telemetry": "^0.1.0",
     "@dnd-kit/core": "^6.0.8",
     "@dnd-kit/sortable": "^8.0.0",
@@ -106,11 +107,11 @@
     "@carbon/grid": "^11.21.1",
     "@carbon/layout": "^11.20.1",
     "@carbon/motion": "^11.16.1",
-    "@carbon/react": "^1.50.0",
-    "@carbon/themes": "^11.31.0",
+    "@carbon/react": "^1.51.0",
+    "@carbon/themes": "^11.32.0",
     "@carbon/type": "^11.25.1",
     "react": "^16.8.6 || ^17.0.1 || ^18.2.0",
     "react-dom": "^16.8.6 || ^17.0.1 || ^18.2.0"
   },
-  "gitHead": "c42c0c622d6ad2a1dfc2e2122d0dd53337780243"
+  "gitHead": "5a37d0d36cb8ecb342f0c295dcf4a647384d5aa3"
 }

package/scss/components/BreadcrumbWithOverflow/_breadcrumb-with-overflow.scss

@@ -91,6 +91,5 @@ $_block-class: #{c4p-settings.$pkg-prefix}--breadcrumb-with-overflow;
 }
 
 .#{$_block-class}__overflow-menu-options.#{$_block-class}__overflow-menu-options {
-  // Need to disable stylelint until dart sass namespace support is added
   z-index: utilities.z('header');
 }

package/scss/components/Datagrid/styles/_datagrid.scss

@@ -1,5 +1,5 @@
 //
-// Copyright IBM Corp. 2020, 2023
+// Copyright IBM Corp. 2020, 2024
 //
 // This source code is licensed under the Apache-2.0 license found in the
 // LICENSE file in the root directory of this source tree.
@@ -159,18 +159,72 @@
 }
 
 .#{$block-class} th.#{$block-class}__with-slug {
-  @include ai-gradient('top', 100%);
+  /* stylelint-disable-next-line carbon/theme-token-use */
+  box-shadow: inset 0 1px $ai-border-strong;
 }
 
+.#{$block-class} th.#{$block-class}__with-slug,
+.#{$block-class} td.#{$block-class}__slug--cell {
+  @include ai-table-gradient();
+}
+
+.#{$block-class}
+  .#{c4p-settings.$carbon-prefix}--data-table
+  tbody
+  tr.#{$block-class}__slug--row,
 .#{$block-class}
   .#{c4p-settings.$carbon-prefix}--data-table
   tbody
-  tr:has(> .#{$block-class}__table-row-ai-enabled) {
-  @include ai-gradient('left', 50%);
+  tr.#{$block-class}__slug--row
+  + .#{$block-class}__expanded-row {
+  @include ai-table-gradient();
 
   background-attachment: fixed;
 }
 
+.#{$block-class}
+  .#{c4p-settings.$carbon-prefix}--data-table
+  tbody
+  tr.#{$block-class}__slug--row {
+  /* stylelint-disable-next-line carbon/theme-token-use */
+  box-shadow: inset 1px 0 $ai-border-strong;
+}
+
+.#{$block-class}
+  .#{c4p-settings.$carbon-prefix}--data-table
+  tbody
+  tr.#{$block-class}__slug--row:hover,
+.#{$block-class}
+  .#{c4p-settings.$carbon-prefix}--data-table
+  tbody
+  tr.#{$block-class}__slug--row.#{c4p-settings.$carbon-prefix}--data-table--selected:hover,
+.#{$block-class}
+  .#{c4p-settings.$carbon-prefix}--data-table
+  tbody
+  tr.#{$block-class}__slug--row.#{$block-class}__carbon-row-expanded:hover
+  + .#{$block-class}__expanded-row,
+.#{$block-class}
+  .#{c4p-settings.$carbon-prefix}--data-table
+  tbody
+  tr.#{$block-class}__expandable-row--hover.#{$block-class}__slug--row {
+  @include ai-table-gradient('hover');
+}
+
+.#{$block-class}
+  .#{c4p-settings.$carbon-prefix}--data-table
+  tbody
+  tr.#{$block-class}__expandable-row--hover.#{$block-class}__slug--row
+  td {
+  background-color: transparent;
+}
+
+.#{$block-class}
+  .#{c4p-settings.$carbon-prefix}--data-table
+  tbody
+  tr.#{$block-class}__slug--row.#{c4p-settings.$carbon-prefix}--data-table--selected {
+  @include ai-table-gradient('selected');
+}
+
 .#{$block-class}
   th.#{$block-class}__with-slug
   .#{c4p-settings.$carbon-prefix}--slug {
@@ -804,6 +858,9 @@
 .#{$block-class} .#{$block-class}__table-row-ai-enabled {
   display: flex;
   align-items: center;
+  &.#{$block-class}__slug--expanded {
+    border: none;
+  }
 }
 
 .#{$block-class} .#{$block-class}__table-row-ai-spacer,

package/scss/components/SidePanel/_side-panel.scss

@@ -306,6 +306,9 @@ $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set;
 
   &.#{$block-class}--has-slug .#{$block-class}--scrolls {
     @include utilities.callout-gradient('default', 0, 'layer');
+
+    box-shadow: inset 0 -80px 70px -65px $ai-inner-shadow,
+      0 4px 10px 2px $ai-drop-shadow;
   }
 
   .#{$block-class}__inner-content.#{$block-class}--scrolls {
@@ -441,10 +444,14 @@ $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set;
 
 .#{$block-class}__overlay {
   position: fixed;
-  // Need to disable stylelint until dart sass namespace support is added
   z-index: utilities.z('overlay');
   width: 100%;
   height: 100%;
   background-color: $overlay;
   inset: 0;
 }
+
+.#{$block-class}--has-slug + .#{$block-class}__overlay {
+  /* stylelint-disable-next-line carbon/theme-token-use */
+  background-color: $ai-overlay;
+}

package/scss/components/Tearsheet/_tearsheet.scss

@@ -29,7 +29,6 @@ $motion-duration: $duration-moderate-02;
 
 @include block-wrap($block-class) {
   &.#{$block-class} {
-    // Need to disable stylelint until dart sass namespace support is added
     z-index: utilities.z('modal') + 1;
     align-items: flex-end;
     color: $text-primary;
@@ -42,7 +41,6 @@ $motion-duration: $duration-moderate-02;
   }
 
   &.is-visible {
-    // Need to disable stylelint until dart sass namespace support is added
     z-index: utilities.z('modal');
     align-items: flex-end;
     // stylelint-disable-next-line carbon/motion-duration-use, carbon/motion-easing-use
@@ -55,21 +53,18 @@ $motion-duration: $duration-moderate-02;
   }
 
   &.#{$block-class}--stacked-1-of-2 {
-    // Need to disable stylelint until dart sass namespace support is added
     z-index: utilities.z('modal') - 1;
     // stylelint-disable-next-line carbon/theme-token-use
     background-color: rgba($overlay-color, 0.33);
   }
 
   &.#{$block-class}--stacked-1-of-3 {
-    // Need to disable stylelint until dart sass namespace support is added
     z-index: utilities.z('modal') - 2;
     // stylelint-disable-next-line carbon/theme-token-use
     background-color: rgba($overlay-color, 0.11);
   }
 
   &.#{$block-class}--stacked-2-of-3 {
-    // Need to disable stylelint until dart sass namespace support is added
     z-index: utilities.z('modal') - 1;
     // stylelint-disable-next-line carbon/theme-token-use
     background-color: rgba($overlay-color, 0.25);
@@ -96,6 +91,8 @@ $motion-duration: $duration-moderate-02;
   &.#{$block-class}.#{$block-class}.#{$block-class}.#{$block-class}--has-slug
     .#{$block-class}__container {
     border: 1px solid transparent;
+    border-bottom: 0;
+
     /* override carbon ai removing background gradient */
     background: linear-gradient(to top, var(--cds-layer), var(--cds-layer))
         padding-box,
@@ -316,6 +313,8 @@ $motion-duration: $duration-moderate-02;
 
   &.#{$block-class}--has-slug .#{$block-class}__main {
     @include utilities.callout-gradient('default', 0);
+
+    box-shadow: inset 0 -80px 70px -65px $ai-inner-shadow;
   }
 
   &.#{$block-class}--wide .#{$block-class}__content {

package/scss/components/UserAvatar/_user-avatar.scss

@@ -64,6 +64,12 @@ $sizes: (
   }
 }
 
+@mixin photo-styling {
+  position: fixed;
+  border-radius: 100%;
+  object-fit: fill;
+}
+
 @mixin setBgColor($color) {
   // stylelint-disable-next-line carbon/theme-token-use
   background-color: $color;
@@ -95,3 +101,24 @@ $sizes: (
   @include size('sm');
   @include type.type-style('label-01');
 }
+
+.#{$block-class}__photo {
+  border-radius: 100%;
+  object-fit: contain;
+}
+.#{$block-class}__photo--xl {
+  @include photo-styling;
+  @include size('xl');
+}
+.#{$block-class}__photo--lg {
+  @include photo-styling;
+  @include size('lg');
+}
+.#{$block-class}__photo--md {
+  @include photo-styling;
+  @include size('md');
+}
+.#{$block-class}__photo--sm {
+  @include photo-styling;
+  @include size('sm');
+}

package/es/_virtual/index2.js

@@ -1,10 +0,0 @@
-/**
- * Copyright IBM Corp. 2020, 2024
- *
- * 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 propTypes = {exports: {}};
-
-export { propTypes as __module };

package/es/node_modules/classnames/index.js

@@ -1,70 +0,0 @@
-/**
- * Copyright IBM Corp. 2020, 2024
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-import { typeof as _typeof } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import { getDefaultExportFromCjs } from '../../_virtual/_commonjsHelpers.js';
-import { __module as classnames } from '../../_virtual/index.js';
-
-classnames.exports;
-(function (module) {
-  /* global define */
-
-  (function () {
-
-    var hasOwn = {}.hasOwnProperty;
-    function classNames() {
-      var classes = '';
-      for (var i = 0; i < arguments.length; i++) {
-        var arg = arguments[i];
-        if (arg) {
-          classes = appendClass(classes, parseValue(arg));
-        }
-      }
-      return classes;
-    }
-    function parseValue(arg) {
-      if (typeof arg === 'string' || typeof arg === 'number') {
-        return arg;
-      }
-      if (_typeof(arg) !== 'object') {
-        return '';
-      }
-      if (Array.isArray(arg)) {
-        return classNames.apply(null, arg);
-      }
-      if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {
-        return arg.toString();
-      }
-      var classes = '';
-      for (var key in arg) {
-        if (hasOwn.call(arg, key) && arg[key]) {
-          classes = appendClass(classes, key);
-        }
-      }
-      return classes;
-    }
-    function appendClass(value, newClass) {
-      if (!newClass) {
-        return value;
-      }
-      if (value) {
-        return value + ' ' + newClass;
-      }
-      return value + newClass;
-    }
-    if (module.exports) {
-      classNames.default = classNames;
-      module.exports = classNames;
-    } else {
-      window.classNames = classNames;
-    }
-  })();
-})(classnames);
-var classnamesExports = classnames.exports;
-var cx = /*@__PURE__*/getDefaultExportFromCjs(classnamesExports);
-
-export { cx as default };

package/lib/_virtual/index2.js

@@ -1,14 +0,0 @@
-/**
- * Copyright IBM Corp. 2020, 2024
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var propTypes = {exports: {}};
-
-exports.__module = propTypes;

package/lib/node_modules/classnames/index.js

@@ -1,74 +0,0 @@
-/**
- * Copyright IBM Corp. 2020, 2024
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
-var _commonjsHelpers = require('../../_virtual/_commonjsHelpers.js');
-var index = require('../../_virtual/index.js');
-
-index.__module.exports;
-(function (module) {
-  /* global define */
-
-  (function () {
-
-    var hasOwn = {}.hasOwnProperty;
-    function classNames() {
-      var classes = '';
-      for (var i = 0; i < arguments.length; i++) {
-        var arg = arguments[i];
-        if (arg) {
-          classes = appendClass(classes, parseValue(arg));
-        }
-      }
-      return classes;
-    }
-    function parseValue(arg) {
-      if (typeof arg === 'string' || typeof arg === 'number') {
-        return arg;
-      }
-      if (_rollupPluginBabelHelpers["typeof"](arg) !== 'object') {
-        return '';
-      }
-      if (Array.isArray(arg)) {
-        return classNames.apply(null, arg);
-      }
-      if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {
-        return arg.toString();
-      }
-      var classes = '';
-      for (var key in arg) {
-        if (hasOwn.call(arg, key) && arg[key]) {
-          classes = appendClass(classes, key);
-        }
-      }
-      return classes;
-    }
-    function appendClass(value, newClass) {
-      if (!newClass) {
-        return value;
-      }
-      if (value) {
-        return value + ' ' + newClass;
-      }
-      return value + newClass;
-    }
-    if (module.exports) {
-      classNames.default = classNames;
-      module.exports = classNames;
-    } else {
-      window.classNames = classNames;
-    }
-  })();
-})(index.__module);
-var classnamesExports = index.__module.exports;
-var cx = /*@__PURE__*/_commonjsHelpers.getDefaultExportFromCjs(classnamesExports);
-
-exports["default"] = cx;