@carbon/ibm-products 1.67.0 → 1.68.0

package/es/components/Datagrid/useNestedRows.js

@@ -1,6 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 /**
- * 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.
@@ -9,46 +9,63 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import { pkg } from '../../settings';
 import cx from 'classnames';
 import useNestedRowExpander from './useNestedRowExpander';
+import { useEffect } from 'react';
 var blockClass = "".concat(pkg.prefix, "--datagrid");
 var useNestedRows = function useNestedRows(hooks) {
   useNestedRowExpander(hooks);
-  var marginLeft = 24;
-  var getRowProps = function getRowProps(props, _ref) {
-    var _cx;
-    var row = _ref.row;
-    return [props, {
-      className: cx((_cx = {}, _defineProperty(_cx, "".concat(blockClass, "__carbon-nested-row"), row.depth > 0), _defineProperty(_cx, "".concat(blockClass, "__carbon-row-expanded"), row.isExpanded), _cx))
-    }];
-  };
-  var getRowStyles = function getRowStyles(props, _ref2) {
-    var row = _ref2.row;
-    return [props, {
-      style: {
-        paddingLeft: "".concat(row.depth > 1 ? marginLeft * 2 + (row.depth - 1) * (marginLeft + marginLeft / 3) : row.depth === 1 ? marginLeft * 2 : 0, "px")
-      }
-    }];
-  };
-  var getCellProps = function getCellProps(props, _ref3) {
-    var cell = _ref3.cell,
-      instance = _ref3.instance;
-    // reduce the "first cell"s width to compensate added (left) margin
-    var isFirstCell = instance.columns.findIndex(function (c) {
-      return c.id === cell.column.id;
-    }) === 0;
-    return [props, {
-      style: {
-        marginRight: "".concat(isFirstCell && cell.row.depth > 0 ? "".concat(-32 * cell.row.depth - 18, "px") : '')
-      }
-    }];
-  };
   var useInstance = function useInstance(instance) {
+    // This useEffect will expand rows if they exist in the initialState obj
+    useEffect(function () {
+      var rows = instance.rows,
+        initialState = instance.initialState;
+      var expandedRowIds = initialState.expandedRowIds;
+      if (expandedRowIds) {
+        Object.keys(expandedRowIds).forEach(function (key) {
+          var row = rows.filter(function (r) {
+            return r.id.toString() === key.toString();
+          });
+          if (row.length && key.toString() === row[0].id.toString()) {
+            row[0].toggleRowExpanded();
+          }
+        });
+      }
+    }, [instance]);
+    var marginLeft = 24;
+    var getRowProps = function getRowProps(props, _ref) {
+      var _cx;
+      var row = _ref.row;
+      return [props, {
+        className: cx((_cx = {}, _defineProperty(_cx, "".concat(blockClass, "__carbon-nested-row"), row.depth > 0), _defineProperty(_cx, "".concat(blockClass, "__carbon-row-expanded"), row.isExpanded), _cx))
+      }];
+    };
+    var getRowStyles = function getRowStyles(props, _ref2) {
+      var row = _ref2.row;
+      return [props, {
+        style: {
+          paddingLeft: "".concat(row.depth > 1 ? marginLeft * 2 + (row.depth - 1) * (marginLeft + marginLeft / 3) : row.depth === 1 ? marginLeft * 2 : 0, "px")
+        }
+      }];
+    };
+    var getCellProps = function getCellProps(props, _ref3) {
+      var cell = _ref3.cell,
+        instance = _ref3.instance;
+      // reduce the "first cell"s width to compensate added (left) margin
+      var isFirstCell = instance.columns.findIndex(function (c) {
+        return c.id === cell.column.id;
+      }) === 0;
+      return [props, {
+        style: {
+          marginRight: "".concat(isFirstCell && cell.row.depth > 0 ? "".concat(-32 * cell.row.depth - 18, "px") : '')
+        }
+      }];
+    };
     Object.assign(instance, {
       withNestedRows: true
     });
+    hooks.getRowProps.push(getRowProps);
+    hooks.getRowProps.push(getRowStyles);
+    hooks.getCellProps.push(getCellProps);
   };
-  hooks.getRowProps.push(getRowProps);
-  hooks.getRowProps.push(getRowStyles);
-  hooks.getCellProps.push(getCellProps);
   hooks.useInstance.push(useInstance);
 };
 export default useNestedRows;

package/es/components/Datagrid/useOnRowClick.js

@@ -29,7 +29,7 @@ var useOnRowClick = function useOnRowClick(hooks) {
               row.classList.remove("".concat(carbon.prefix, "--data-table--selected"));
             });
           }
-          var closestRow = event.target.closest(".".concat(pkg.prefix, "--datagrid__carbon-row"));
+          var closestRow = event.target.closest('tr');
           closestRow.classList.add("".concat(carbon.prefix, "--data-table--selected"));
           if (!withSelectRows) {
             instance.selectedFlatRows && instance.selectedFlatRows.map(function (toggleRow) {

package/es/components/index.js

@@ -7,6 +7,7 @@
 
 export { AboutModal } from './AboutModal';
 export { APIKeyModal } from './APIKeyModal';
+export { ButtonMenu } from './ButtonMenu';
 export { Cascade } from './Cascade';
 export { ComboButton, ComboButtonItem } from './ComboButton';
 export { CreateFullPage, CreateFullPageStep } from './CreateFullPage';

package/lib/components/Datagrid/useNestedRows.js

@@ -9,8 +9,9 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _settings = require("../../settings");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _useNestedRowExpander = _interopRequireDefault(require("./useNestedRowExpander"));
+var _react = require("react");
 /**
- * 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.
@@ -19,43 +20,59 @@ var _useNestedRowExpander = _interopRequireDefault(require("./useNestedRowExpand
 var blockClass = "".concat(_settings.pkg.prefix, "--datagrid");
 var useNestedRows = function useNestedRows(hooks) {
   (0, _useNestedRowExpander.default)(hooks);
-  var marginLeft = 24;
-  var getRowProps = function getRowProps(props, _ref) {
-    var _cx;
-    var row = _ref.row;
-    return [props, {
-      className: (0, _classnames.default)((_cx = {}, (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__carbon-nested-row"), row.depth > 0), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__carbon-row-expanded"), row.isExpanded), _cx))
-    }];
-  };
-  var getRowStyles = function getRowStyles(props, _ref2) {
-    var row = _ref2.row;
-    return [props, {
-      style: {
-        paddingLeft: "".concat(row.depth > 1 ? marginLeft * 2 + (row.depth - 1) * (marginLeft + marginLeft / 3) : row.depth === 1 ? marginLeft * 2 : 0, "px")
-      }
-    }];
-  };
-  var getCellProps = function getCellProps(props, _ref3) {
-    var cell = _ref3.cell,
-      instance = _ref3.instance;
-    // reduce the "first cell"s width to compensate added (left) margin
-    var isFirstCell = instance.columns.findIndex(function (c) {
-      return c.id === cell.column.id;
-    }) === 0;
-    return [props, {
-      style: {
-        marginRight: "".concat(isFirstCell && cell.row.depth > 0 ? "".concat(-32 * cell.row.depth - 18, "px") : '')
-      }
-    }];
-  };
   var useInstance = function useInstance(instance) {
+    // This useEffect will expand rows if they exist in the initialState obj
+    (0, _react.useEffect)(function () {
+      var rows = instance.rows,
+        initialState = instance.initialState;
+      var expandedRowIds = initialState.expandedRowIds;
+      if (expandedRowIds) {
+        Object.keys(expandedRowIds).forEach(function (key) {
+          var row = rows.filter(function (r) {
+            return r.id.toString() === key.toString();
+          });
+          if (row.length && key.toString() === row[0].id.toString()) {
+            row[0].toggleRowExpanded();
+          }
+        });
+      }
+    }, [instance]);
+    var marginLeft = 24;
+    var getRowProps = function getRowProps(props, _ref) {
+      var _cx;
+      var row = _ref.row;
+      return [props, {
+        className: (0, _classnames.default)((_cx = {}, (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__carbon-nested-row"), row.depth > 0), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__carbon-row-expanded"), row.isExpanded), _cx))
+      }];
+    };
+    var getRowStyles = function getRowStyles(props, _ref2) {
+      var row = _ref2.row;
+      return [props, {
+        style: {
+          paddingLeft: "".concat(row.depth > 1 ? marginLeft * 2 + (row.depth - 1) * (marginLeft + marginLeft / 3) : row.depth === 1 ? marginLeft * 2 : 0, "px")
+        }
+      }];
+    };
+    var getCellProps = function getCellProps(props, _ref3) {
+      var cell = _ref3.cell,
+        instance = _ref3.instance;
+      // reduce the "first cell"s width to compensate added (left) margin
+      var isFirstCell = instance.columns.findIndex(function (c) {
+        return c.id === cell.column.id;
+      }) === 0;
+      return [props, {
+        style: {
+          marginRight: "".concat(isFirstCell && cell.row.depth > 0 ? "".concat(-32 * cell.row.depth - 18, "px") : '')
+        }
+      }];
+    };
     Object.assign(instance, {
       withNestedRows: true
     });
+    hooks.getRowProps.push(getRowProps);
+    hooks.getRowProps.push(getRowStyles);
+    hooks.getCellProps.push(getCellProps);
   };
-  hooks.getRowProps.push(getRowProps);
-  hooks.getRowProps.push(getRowStyles);
-  hooks.getCellProps.push(getCellProps);
   hooks.useInstance.push(useInstance);
 };
 var _default = useNestedRows;

package/lib/components/Datagrid/useOnRowClick.js

@@ -35,7 +35,7 @@ var useOnRowClick = function useOnRowClick(hooks) {
               row.classList.remove("".concat(_settings.carbon.prefix, "--data-table--selected"));
             });
           }
-          var closestRow = event.target.closest(".".concat(_settings.pkg.prefix, "--datagrid__carbon-row"));
+          var closestRow = event.target.closest('tr');
           closestRow.classList.add("".concat(_settings.carbon.prefix, "--data-table--selected"));
           if (!withSelectRows) {
             instance.selectedFlatRows && instance.selectedFlatRows.map(function (toggleRow) {

package/lib/components/index.js

@@ -15,6 +15,12 @@ Object.defineProperty(exports, "AboutModal", {
     return _AboutModal.AboutModal;
   }
 });
+Object.defineProperty(exports, "ButtonMenu", {
+  enumerable: true,
+  get: function get() {
+    return _ButtonMenu.ButtonMenu;
+  }
+});
 Object.defineProperty(exports, "Cascade", {
   enumerable: true,
   get: function get() {
@@ -587,6 +593,7 @@ Object.defineProperty(exports, "useWebTerminal", {
 });
 var _AboutModal = require("./AboutModal");
 var _APIKeyModal = require("./APIKeyModal");
+var _ButtonMenu = require("./ButtonMenu");
 var _Cascade = require("./Cascade");
 var _ComboButton = require("./ComboButton");
 var _CreateFullPage = require("./CreateFullPage");

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/ibm-products",
   "description": "Carbon for IBM Products",
-  "version": "1.67.0",
+  "version": "1.68.0",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -97,5 +97,5 @@
     "react": "^16.8.6 || ^17.0.1",
     "react-dom": "^16.8.6 || ^17.0.1"
   },
-  "gitHead": "9d38cf405fc58bb75d8bab999816bf18c8d63167"
+  "gitHead": "d1c99ff4199bf3da40a4088dae72668f302d4268"
 }

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

@@ -542,13 +542,14 @@
 }
 
 .#{$block-class}
-  .#{$carbon-prefix}--data-table--selected:not(.#{$block-class}__active-row) {
+  .#{$carbon-prefix}--data-table--selected:not(.#{$block-class}__active-row)
+  td:first-child {
   position: relative;
 }
 
 .#{$block-class}
   .#{$carbon-prefix}--data-table--selected:not(.#{$block-class}__active-row)
-  :first-child:not(.#{$carbon-prefix}--checkbox--inline)::before {
+  td:first-child:not(.#{$carbon-prefix}--checkbox--inline)::before {
   position: absolute;
   top: 0;
   left: 0;