@carbon/ibm-products 2.15.0 → 2.15.2

package/es/components/Datagrid/Datagrid/DatagridVirtualBody.js

@@ -2,13 +2,13 @@ import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-/*
- * Licensed Materials - Property of IBM
- * 5724-Q36
- * (c) Copyright IBM Corp. 2020 - 2023
- * US Government Users Restricted Rights - Use, duplication or disclosure
- * restricted by GSA ADP Schedule Contract with IBM Corp.
+/**
+ * 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.
  */
+
 import React, { useEffect } from 'react';
 import { VariableSizeList } from 'react-window';
 import { TableBody } from '@carbon/react';
@@ -22,12 +22,7 @@ var rowSizeMap = {
   sm: 32,
   md: 40,
   lg: 48,
-  xl: 64,
-  // TODO: deprecate the below values in next major release (v8) on carbon-components-react
-  short: 32,
-  compact: 24,
-  normal: 48,
-  tall: 64
+  xl: 64
 };
 var defaultRowHeight = rowSizeMap.lg;
 var DatagridVirtualBody = function DatagridVirtualBody(datagridState) {
@@ -51,8 +46,8 @@ var DatagridVirtualBody = function DatagridVirtualBody(datagridState) {
     gridRefElement.style.width = gridRefElement === null || gridRefElement === void 0 ? void 0 : gridRefElement.clientWidth;
   };
   useResizeObserver(gridRef, handleVirtualGridResize);
-  var syncScroll = function syncScroll(e) {
-    var virtualBody = e.target;
+  var syncScroll = function syncScroll(event) {
+    var virtualBody = event.target;
     document.querySelector(".".concat(blockClass, "__head-wrap")).scrollLeft = virtualBody.scrollLeft;
     var spacerColumn = document.querySelector(".".concat(blockClass, "__head-wrap thead th:last-child"));
     spacerColumn.style.width = px(32 + (virtualBody.offsetWidth - virtualBody.clientWidth)); // scrollbar width to header column to fix header alignment
@@ -73,9 +68,7 @@ var DatagridVirtualBody = function DatagridVirtualBody(datagridState) {
       overflow: 'hidden'
     }
   }, /*#__PURE__*/React.createElement(DatagridHead, datagridState)), /*#__PURE__*/React.createElement(TableBody, _extends({}, getTableBodyProps(), {
-    onScroll: function onScroll(e) {
-      return syncScroll(e);
-    }
+    onScroll: syncScroll
   }), /*#__PURE__*/React.createElement(VariableSizeList, {
     height: virtualHeight || tableHeight,
     itemCount: visibleRows.length,
@@ -95,10 +88,13 @@ var DatagridVirtualBody = function DatagridVirtualBody(datagridState) {
       style = _ref.style;
     var row = visibleRows[index];
     prepareRow(row);
+    var _row$getRowProps = row.getRowProps(),
+      key = _row$getRowProps.key;
     return /*#__PURE__*/React.createElement("div", {
       style: _objectSpread({}, style)
     }, row.RowRenderer(_objectSpread(_objectSpread({}, datagridState), {}, {
-      row: row
+      row: row,
+      key: key
     })));
   })));
 };

package/es/components/Datagrid/Datagrid.docs-page.js

@@ -47,6 +47,12 @@ export var DocsPage = function DocsPage() {
         language: 'jsx',
         code: "\nuseDatagrid({\n  columns,\n  data,\n  onColResizeEnd: (currentColumn, allColumns) =>\n      console.log(currentColumn, allColumns),\n});\n          "
       }
+    }, {
+      description: 'Disabling the resizable columns is possible by specifying `disableResizing: true` within the `useDatagrid` hook.',
+      source: {
+        language: 'jsx',
+        code: "\nuseDatagrid({\n  columns,\n  data,\n  disableResizing: true,\n});\n          "
+      }
     }, {
       title: 'Rendering the table toolbar',
       image: /*#__PURE__*/React.createElement("img", {
@@ -80,7 +86,7 @@ export var DocsPage = function DocsPage() {
     }, {
       description: "Infinite scroll:\n- Include `useInfiniteScroll` hook\n- Add `fetchMoreData` property to `useDatagrid`, this will be a function that is called when the scroll threshold is met. Optionally change the height of the grid with the `virtualHeight` property.",
       source: {
-        code: "\nconst datagridState = useDatagrid(\n  {\n    columns,\n    data,\n    isFetching,\n    fetchMoreData: fetchData,\n    virtualHeight: 540,\n    emptyStateTitle: 'Empty state title',\n    emptyStateDescription: 'Description explaining why the table is empty',\n  },\n  useInfiniteScroll\n);"
+        code: "\nconst datagridState = useDatagrid(\n  {\n    columns,\n    data,\n    isFetching,\n    fetchMoreData: fetchData,\n    virtualHeight: 540,\n    loadMoreThreshold: 200,\n    emptyStateTitle: 'Empty state title',\n    emptyStateDescription: 'Description explaining why the table is empty',\n  },\n  useInfiniteScroll\n);"
       }
     }, {
       description: "Virtualized data:\n- Include `useInfiniteScroll` hook\n- The Datagrid will know to use virtualized data just by providing the `useInfiniteScroll` hook\n        ",

package/es/components/Datagrid/useActionsColumn.js

@@ -41,12 +41,13 @@ var useActionsColumn = function useActionsColumn(hooks) {
           column = cell.column;
         if (column.isAction) {
           var _cx3;
+          var isColumnSticky = !!column.sticky;
           return [props, {
             children: /*#__PURE__*/React.createElement("div", {
               className: "".concat(blockClass, "__actions-column-contents")
             }, isFetching && /*#__PURE__*/React.createElement(IconSkeleton, {
               className: "".concat(blockClass, "__actions-column-loading")
-            }), !isFetching && rowActions.length <= 2 && /*#__PURE__*/React.createElement("div", {
+            }), !isFetching && rowActions.length <= 2 && !isColumnSticky && /*#__PURE__*/React.createElement("div", {
               className: "".concat(blockClass, "_actions-column"),
               style: {
                 display: 'flex'
@@ -81,7 +82,7 @@ var useActionsColumn = function useActionsColumn(hooks) {
                   _onClick(id, row, e);
                 }
               })));
-            })), !isFetching && rowActions.length > 2 && /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(OverflowMenu, {
+            })), !isFetching && (rowActions.length > 2 || isColumnSticky) && /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(OverflowMenu, {
               align: "left",
               size: "sm",
               flipped: true,
@@ -111,9 +112,9 @@ var useActionsColumn = function useActionsColumn(hooks) {
                 key: id
               }));
             })))),
-            className: cx((_cx3 = {}, _defineProperty(_cx3, "".concat(blockClass, "__actions-column-cell"), true), _defineProperty(_cx3, "".concat(blockClass, "__cell"), true), _cx3)),
+            className: cx((_cx3 = {}, _defineProperty(_cx3, "".concat(blockClass, "__actions-column-cell"), true), _defineProperty(_cx3, "".concat(blockClass, "__cell"), true), _defineProperty(_cx3, "".concat(blockClass, "__actions-column-cell-non-sticky"), !isColumnSticky), _cx3)),
             style: {
-              width: rowActions.length > 2 ? 48 : 96
+              width: rowActions.length > 2 || isColumnSticky ? 48 : 96
             }
           }];
         }
@@ -128,9 +129,10 @@ var useActionsColumn = function useActionsColumn(hooks) {
       var addHeaderWidth = function addHeaderWidth(props, cellData) {
         var column = cellData.column;
         if (column.isAction) {
+          var isColumnSticky = !!column.sticky;
           return [props, {
             style: _objectSpread(_objectSpread({}, props.style), {}, {
-              width: rowActions.length > 2 ? 48 : 96 // set header width based on action length
+              width: rowActions.length > 2 || isColumnSticky ? 48 : 96 // set header width based on action length
             })
           }];
         }

package/es/components/Datagrid/useColumnCenterAlign.js

@@ -2,13 +2,13 @@ import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-/*
- * Licensed Materials - Property of IBM
- * 5724-Q36
- * (c) Copyright IBM Corp. 2020
- * US Government Users Restricted Rights - Use, duplication or disclosure
- * restricted by GSA ADP Schedule Contract with IBM Corp.
+/**
+ * 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.
  */
+
 import React from 'react';
 import cx from 'classnames';
 import { pkg } from '../../settings';

package/es/components/Datagrid/useColumnRightAlign.js

@@ -2,13 +2,13 @@ import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-/*
- * Licensed Materials - Property of IBM
- * 5724-Q36
- * (c) Copyright IBM Corp. 2020
- * US Government Users Restricted Rights - Use, duplication or disclosure
- * restricted by GSA ADP Schedule Contract with IBM Corp.
+/**
+ * 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.
  */
+
 import React from 'react';
 import cx from 'classnames';
 import { pkg } from '../../settings';

package/es/components/Datagrid/useDatagrid.js

@@ -22,6 +22,14 @@ import useFloatingScroll from './useFloatingScroll';
 import { stateReducer } from './Datagrid/addons/stateReducer';
 var useDatagrid = function useDatagrid(params) {
   var defaultPlugins = [useFlexLayout, useHeaderRow, useSkeletonRows, useResizeColumns, useRowRenderer, useDefaultStringRenderer, useRowSize, useFilters, useGlobalFilter, useSortBy, useExpanded];
+
+  // Disable resizing
+  if (params.disableResizing) {
+    var resizeIndex = defaultPlugins.findIndex(function (p) {
+      return p.pluginName === 'useResizeColumns';
+    });
+    defaultPlugins.splice(resizeIndex, 1);
+  }
   var defaultEndPlugins = [usePagination, useRowSelect, useFlexResize, useFloatingScroll];
   var clientEndPlugins = params.endPlugins || [];
   var tableId = useMemo(function () {

package/es/components/Datagrid/useInfiniteScroll.js

@@ -1,10 +1,10 @@
-/*
- * Licensed Materials - Property of IBM
- * 5724-Q36
- * (c) Copyright IBM Corp. 2020
- * US Government Users Restricted Rights - Use, duplication or disclosure
- * restricted by GSA ADP Schedule Contract with IBM Corp.
+/**
+ * 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.
  */
+
 import { useCallback, useEffect } from 'react';
 import debounce from 'lodash/debounce';
 import useParentDimensions from './useParentDimensions';
@@ -21,10 +21,11 @@ var useInfiniteScroll = function useInfiniteScroll(hooks) {
       tableHeight = instance.tableHeight,
       innerListRef = instance.innerListRef,
       fetchMoreData = instance.fetchMoreData,
-      tableId = instance.tableId;
+      tableId = instance.tableId,
+      loadMoreThreshold = instance.loadMoreThreshold;
     var tableElement = document.querySelector("#".concat(tableId));
     var totalTableHeight = tableHeight || (tableElement === null || tableElement === void 0 ? void 0 : tableElement.clientHeight);
-    var loadMoreThreshold = 200;
+    var loadMoreThresholdValue = typeof loadMoreThreshold === 'number' ? loadMoreThreshold : 200;
     var emptyFetchData = function emptyFetchData() {};
     // eslint-disable-next-line react-hooks/exhaustive-deps
     var fetchMore = useCallback(debounce(fetchMoreData || emptyFetchData, 3000, {
@@ -35,7 +36,7 @@ var useInfiniteScroll = function useInfiniteScroll(hooks) {
       var scrollDirection = _ref.scrollDirection,
         scrollOffset = _ref.scrollOffset;
       if (innerListRef && innerListRef.current) {
-        if (!isFetching && scrollDirection === 'forward' && scrollOffset + totalTableHeight >= innerListRef.current.clientHeight - loadMoreThreshold) {
+        if (!isFetching && scrollDirection === 'forward' && scrollOffset + totalTableHeight >= innerListRef.current.clientHeight - loadMoreThresholdValue) {
           if (fetchMoreData) {
             fetchMore();
           }

package/es/components/Datagrid/useNestedRowExpander.js

@@ -1,6 +1,8 @@
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 /* eslint-disable react/prop-types */
 /**
  * Copyright IBM Corp. 2020, 2023
@@ -25,6 +27,13 @@ var useNestedRowExpander = function useNestedRowExpander(hooks) {
       Cell: function Cell(_ref) {
         var _cx;
         var row = _ref.row;
+        var expanderButtonProps = _objectSpread(_objectSpread({}, row.getToggleRowExpandedProps()), {}, {
+          onClick: function onClick(event) {
+            // Prevents `onRowClick` from being called if `useOnRowClick` is included
+            event.stopPropagation();
+            row.toggleRowExpanded();
+          }
+        });
         var _ref2 = (tempState === null || tempState === void 0 ? void 0 : tempState.current) || {},
           _ref2$expanderButtonT = _ref2.expanderButtonTitleExpanded,
           expanderButtonTitleExpanded = _ref2$expanderButtonT === void 0 ? 'Collapse row' : _ref2$expanderButtonT,
@@ -35,7 +44,7 @@ var useNestedRowExpander = function useNestedRowExpander(hooks) {
           type: "button",
           "aria-label": expanderTitle,
           className: cx("".concat(blockClass, "__row-expander"), "".concat(carbon.prefix, "--btn"), "".concat(carbon.prefix, "--btn--ghost"))
-        }, row.getToggleRowExpandedProps(), {
+        }, expanderButtonProps, {
           title: expanderTitle
         }), /*#__PURE__*/React.createElement(ChevronRight, {
           className: cx("".concat(blockClass, "__expander-icon"), (_cx = {}, _defineProperty(_cx, "".concat(blockClass, "__expander-icon--not-open"), !row.isExpanded), _defineProperty(_cx, "".concat(blockClass, "__expander-icon--open"), row.isExpanded), _cx))

package/es/components/Datagrid/useParentDimensions.js

@@ -1,11 +1,11 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-/*
- * Licensed Materials - Property of IBM
- * 5724-Q36
- * (c) Copyright IBM Corp. 2020
- * US Government Users Restricted Rights - Use, duplication or disclosure
- * restricted by GSA ADP Schedule Contract with IBM Corp.
+/**
+ * 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.
  */
+
 import { useRef, useState } from 'react';
 var useParentDimensions = function useParentDimensions(hooks) {
   var rootRef = useRef();

package/es/components/Datagrid/useResizeTable.js

@@ -1,10 +1,10 @@
-/*
- * Licensed Materials - Property of IBM
- * 5724-Q36
- * (c) Copyright IBM Corp. 2020
- * US Government Users Restricted Rights - Use, duplication or disclosure
- * restricted by GSA ADP Schedule Contract with IBM Corp.
+/**
+ * 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.
  */
+
 import { useLayoutEffect } from 'react';
 var useResizeTable = function useResizeTable(hooks) {
   var useInstanceBeforeDimensions = function useInstanceBeforeDimensions(instance) {
@@ -26,7 +26,7 @@ var useResizeTable = function useResizeTable(hooks) {
           resizeObserver = null;
         };
       }
-      return console.error(' Could not resize table, no support for ResizeObserver');
+      return console.error('Could not resize table, no support for ResizeObserver');
     }, [handleResize, parent]);
   };
   hooks.useInstanceBeforeDimensions.push(useInstanceBeforeDimensions);

package/es/components/Datagrid/useRowExpander.js

@@ -1,5 +1,8 @@
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _extends from "@babel/runtime/helpers/extends";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 /* eslint-disable react/prop-types */
 /**
  * Copyright IBM Corp. 2020, 2023
@@ -23,6 +26,13 @@ var useRowExpander = function useRowExpander(hooks) {
       id: 'expander',
       Cell: function Cell(_ref) {
         var row = _ref.row;
+        var expanderButtonProps = _objectSpread(_objectSpread({}, row.getToggleRowExpandedProps()), {}, {
+          onClick: function onClick(event) {
+            // Prevents `onRowClick` from being called if `useOnRowClick` is included
+            event.stopPropagation();
+            row.toggleRowExpanded();
+          }
+        });
         var _ref2 = (tempState === null || tempState === void 0 ? void 0 : tempState.current) || {},
           _ref2$expanderButtonT = _ref2.expanderButtonTitleExpanded,
           expanderButtonTitleExpanded = _ref2$expanderButtonT === void 0 ? 'Collapse row' : _ref2$expanderButtonT,
@@ -33,7 +43,7 @@ var useRowExpander = function useRowExpander(hooks) {
           type: "button",
           "aria-label": expanderTitle,
           className: cx("".concat(blockClass, "__row-expander"), "".concat(carbon.prefix, "--btn"), "".concat(carbon.prefix, "--btn--ghost"))
-        }, row.getToggleRowExpandedProps(), {
+        }, expanderButtonProps, {
           title: expanderTitle
         }), row.isExpanded ? /*#__PURE__*/React.createElement(ChevronUp, {
           className: "".concat(blockClass, "__row-expander--icon")

package/es/components/Datagrid/useSelectAllToggle.js

@@ -13,7 +13,7 @@ import cx from 'classnames';
 import { selectionColumnId } from './common-column-ids';
 import SelectAllWithToggle from './Datagrid/DatagridSelectAllWithToggle';
 import { pkg } from '../../settings';
-var blockClass = "".concat(pkg.prefix, "--datagrid");
+var blockClass = "".concat(pkg.prefix, "--datagrid__select-all");
 var useSelectAllToggle = function useSelectAllToggle(hooks) {
   useSelectAllWithToggleComponent(hooks);
   useAddClassNameToSelectRow(hooks);
@@ -60,7 +60,7 @@ var useAddClassNameToSelectRow = function useAddClassNameToSelectRow(hooks) {
     var isFirstColumnStickyLeft = ((_columns$ = columns[0]) === null || _columns$ === void 0 ? void 0 : _columns$.sticky) === 'left' && withStickyColumn;
     if (column.id === selectionColumnId && DatagridPagination) {
       return [props, {
-        className: cx("".concat(blockClass, "__select-all-toggle-on"), _defineProperty({}, "".concat(blockClass, "__select-all-sticky-left"), isFirstColumnStickyLeft && windowSize > 671))
+        className: cx("".concat(blockClass, "-toggle-on"), _defineProperty({}, "".concat(blockClass, "-sticky-left"), isFirstColumnStickyLeft && windowSize > 671))
       }];
     }
     return [props];

package/es/components/Datagrid/useSelectRows.js

@@ -3,7 +3,7 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-var _excluded = ["onChange"];
+var _excluded = ["onChange", "title"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 /*
@@ -21,6 +21,7 @@ import { SelectAll } from './Datagrid/DatagridSelectAll';
 import { selectionColumnId } from './common-column-ids';
 import { pkg, carbon } from '../../settings';
 var blockClass = "".concat(pkg.prefix, "--datagrid");
+var checkboxClass = "".concat(pkg.prefix, "--datagrid__checkbox-cell");
 var useSelectRows = function useSelectRows(hooks) {
   useHighlightSelection(hooks);
   var useInstance = function useInstance(instance) {
@@ -54,9 +55,12 @@ var useSelectRows = function useSelectRows(hooks) {
 };
 var useHighlightSelection = function useHighlightSelection(hooks) {
   var getRowProps = function getRowProps(props, _ref) {
+    var _ref2;
     var row = _ref.row;
+    var _row$getToggleRowSele = row.getToggleRowSelectedProps(),
+      checked = _row$getToggleRowSele.checked;
     return [props, {
-      className: cx("".concat(blockClass, "__carbon-row"), row.getToggleRowSelectedProps().checked ? "".concat(carbon.prefix, "--data-table--selected ").concat(blockClass, "__active-row") : '')
+      className: cx(["".concat(blockClass, "__carbon-row"), (_ref2 = {}, _defineProperty(_ref2, "".concat(carbon.prefix, "--data-table--selected"), checked), _defineProperty(_ref2, "".concat(blockClass, "__active-row"), checked), _ref2)])
     }];
   };
   hooks.getRowProps.push(getRowProps);
@@ -87,30 +91,32 @@ var SelectRow = function SelectRow(datagridState) {
       return window.removeEventListener('resize', updateSize);
     };
   }, []);
+  var onSelectHandler = function onSelectHandler(e) {
+    e.stopPropagation(); // avoid triggering onRowClick
+    if (radio) {
+      toggleAllRowsSelected(false);
+      if (onRadioSelect) {
+        onRadioSelect(row);
+      }
+    }
+    onChange(e);
+    onRowSelect === null || onRowSelect === void 0 || onRowSelect(row, e);
+  };
   var selectDisabled = isFetching || row.getRowProps().disabled;
-  var _row$getToggleRowSele = row.getToggleRowSelectedProps(),
-    onChange = _row$getToggleRowSele.onChange,
-    selectProps = _objectWithoutProperties(_row$getToggleRowSele, _excluded);
+  var _row$getToggleRowSele2 = row.getToggleRowSelectedProps(),
+    onChange = _row$getToggleRowSele2.onChange,
+    title = _row$getToggleRowSele2.title,
+    selectProps = _objectWithoutProperties(_row$getToggleRowSele2, _excluded);
   var cellProps = cell.getCellProps();
   var isFirstColumnStickyLeft = ((_columns$ = columns[0]) === null || _columns$ === void 0 ? void 0 : _columns$.sticky) === 'left' && withStickyColumn;
+  var rowId = "".concat(tableId, "-").concat(row.index);
   return /*#__PURE__*/React.createElement(TableSelectRow, _extends({}, cellProps, selectProps, {
     radio: radio,
-    onSelect: function onSelect(e) {
-      e.stopPropagation(); // avoid triggering onRowClick
-      if (radio) {
-        toggleAllRowsSelected(false);
-        if (onRadioSelect) {
-          onRadioSelect(row);
-        }
-      }
-      onChange(e);
-      onRowSelect === null || onRowSelect === void 0 || onRowSelect(row, e);
-    },
-    id: "".concat(tableId, "-").concat(row.index),
-    name: "".concat(tableId, "-").concat(row.index, "-name"),
-    className: cx("".concat(blockClass, "__checkbox-cell"), cellProps.className, _defineProperty({}, "".concat(blockClass, "__checkbox-cell-sticky-left"), isFirstColumnStickyLeft && windowSize > 671)),
-    ariaLabel: "".concat(tableId, "-row-").concat(row.index) // TODO: aria label should be i18n'ed
-    ,
+    onSelect: onSelectHandler,
+    id: rowId,
+    name: "".concat(rowId, "-name"),
+    className: cx([checkboxClass, cellProps.className, _defineProperty({}, "".concat(checkboxClass, "-sticky-left"), isFirstColumnStickyLeft && windowSize > 671)]),
+    ariaLabel: title,
     disabled: selectDisabled
   }));
 };

package/es/components/Datagrid/useSkeletonRows.js

@@ -1,11 +1,11 @@
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
-/*
- * Licensed Materials - Property of IBM
- * 5724-Q36
- * (c) Copyright IBM Corp. 2020
- * US Government Users Restricted Rights - Use, duplication or disclosure
- * restricted by GSA ADP Schedule Contract with IBM Corp.
+/**
+ * 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.
  */
+
 var useSkeletons = function useSkeletons(hooks) {
   var useInstance = function useInstance(instance) {
     var isFetching = instance.isFetching,

package/es/components/Datagrid/useStickyColumn.js

@@ -2,12 +2,11 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-/*
- * Licensed Materials - Property of IBM
- * 5724-Q36
- * (c) Copyright IBM Corp. 2021
- * US Government Users Restricted Rights - Use, duplication or disclosure
- * restricted by GSA ADP Schedule Contract with IBM Corp.
+/**
+ * Copyright IBM Corp. 2021, 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.
  */
 
 import { useEffect, useRef, useLayoutEffect, useState } from 'react';
@@ -29,9 +28,11 @@ var useStickyColumn = function useStickyColumn(hooks) {
     setWindowSize(window.innerWidth);
   }, []);
   useLayoutEffect(function () {
+    /* istanbul ignore next */
     function updateSize() {
       setWindowSize(window.innerWidth);
     }
+    /* istanbul ignore next */
     window.addEventListener('resize', updateSize);
     return function () {
       return window.removeEventListener('resize', updateSize);
@@ -52,14 +53,17 @@ var useStickyColumn = function useStickyColumn(hooks) {
     useEffect(function () {
       var tableBodyElement = tableBodyRef.current;
       var headerCellElement = stickyHeaderCellRef.current;
+      /* istanbul ignore next */
       if (hasVertScroll(tableBodyElement) && headerCellElement) {
         headerCellElement.classList.add(OFFSET_SCROLL_CLASS);
       }
       var boundListener = debounce(onBodyResize.bind(null, tableBodyElement, headerCellElement), 250);
+      /* istanbul ignore next */
       if (typeof window !== 'undefined') {
         window.addEventListener('resize', boundListener);
       }
       return function () {
+        /* istanbul ignore next */
         if (typeof window !== 'undefined') {
           window.removeEventListener('resize', boundListener);
         }
@@ -158,6 +162,7 @@ var changeProps = function changeProps(elementName, headerCellRef, windowSize, p
 };
 var onBodyResize = function onBodyResize(tableBodyEle, headerCellEle) {
   if (headerCellEle) {
+    /* istanbul ignore next */
     if (hasVertScroll(tableBodyEle)) {
       headerCellEle.classList.add(OFFSET_SCROLL_CLASS);
     } else {
@@ -167,6 +172,7 @@ var onBodyResize = function onBodyResize(tableBodyEle, headerCellEle) {
   }
 };
 var toggleStickyShadow = function toggleStickyShadow(tableBodyEle, headerCellEle) {
+  /* istanbul ignore next */
   if (tableBodyEle && headerCellEle) {
     var isScrolledToRight = tableBodyEle.scrollLeft + tableBodyEle.clientWidth === tableBodyEle.scrollWidth;
     if (isScrolledToRight) {
@@ -179,6 +185,7 @@ var toggleStickyShadow = function toggleStickyShadow(tableBodyEle, headerCellEle
   }
 };
 var hasVertScroll = function hasVertScroll(element) {
+  /* istanbul ignore next */
   if (!element) {
     return false;
   }

package/lib/components/Datagrid/Datagrid/DatagridExpandedRow.js

@@ -46,7 +46,7 @@ var DatagridExpandedRow = function DatagridExpandedRow(ExpandedRowContentCompone
       style: {
         height: expandedContentHeight ? expandedContentHeight : null
       }
-    }, ExpandedRowContentComponent(datagridState)));
+    }, /*#__PURE__*/_react.default.createElement(ExpandedRowContentComponent, datagridState)));
   };
 };
 var _default = exports.default = DatagridExpandedRow;

package/lib/components/Datagrid/Datagrid/DatagridHeaderRow.js

@@ -88,13 +88,14 @@ var HeaderRow = function HeaderRow(datagridState, headRef, headerGroup) {
       dispatch = datagridState.dispatch,
       onColResizeEnd = datagridState.onColResizeEnd;
     var columnResizing = state.columnResizing;
-    var columnWidths = columnResizing.columnWidths;
+    var _ref4 = columnResizing || {},
+      columnWidths = _ref4.columnWidths;
     var originalCol = visibleColumns[index];
     return /*#__PURE__*/_react.default.createElement(_react2.TableHeader, (0, _extends2.default)({}, header.getHeaderProps(), {
-      className: (0, _classnames.default)((_cx = {}, (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__resizableColumn"), header.getResizerProps), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__isResizing"), header.isResizing), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__sortableColumn"), datagridState.isTableSortable && header.id !== 'spacer'), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__isSorted"), header.isSorted), _cx), header.getHeaderProps().className),
+      className: (0, _classnames.default)((_cx = {}, (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__resizableColumn"), header.getResizerProps), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__isResizing"), header.isResizing), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__sortableColumn"), datagridState.isTableSortable && header.id !== 'spacer'), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__isSorted"), header.isSorted), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__header-actions-column"), header.isAction), _cx), header.getHeaderProps().className),
       key: header.id,
       "aria-hidden": header.id === 'spacer' && 'true'
-    }, getAccessibilityProps(header)), header.render('Header'), header.getResizerProps && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("input", (0, _extends2.default)({}, header.getResizerProps(), {
+    }, getAccessibilityProps(header)), header.render('Header'), header.getResizerProps && !header.isAction && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("input", (0, _extends2.default)({}, header.getResizerProps(), {
       onKeyDown: function onKeyDown(event) {
         var key = event.key;
         if (key === 'ArrowLeft' || key === 'ArrowRight') {

package/lib/components/Datagrid/Datagrid/DatagridRefBody.js

@@ -32,8 +32,11 @@ var DatagridRefBody = function DatagridRefBody(datagridState) {
     className: (0, _classnames.default)("".concat(blockClass, "__simple-body"), getTableBodyProps().className)
   }), rows.map(function (row) {
     prepareRow(row);
+    var _row$getRowProps = row.getRowProps(),
+      key = _row$getRowProps.key;
     return row.RowRenderer(_objectSpread(_objectSpread({}, datagridState), {}, {
-      row: row
+      row: row,
+      key: key
     }));
   }));
 };

package/lib/components/Datagrid/Datagrid/DatagridRow.js

@@ -37,7 +37,8 @@ var DatagridRow = function DatagridRow(datagridState) {
   var row = datagridState.row,
     rowSize = datagridState.rowSize,
     withNestedRows = datagridState.withNestedRows,
-    prepareRow = datagridState.prepareRow;
+    prepareRow = datagridState.prepareRow,
+    key = datagridState.key;
   var getVisibleNestedRowCount = function getVisibleNestedRowCount(_ref) {
     var isExpanded = _ref.isExpanded,
       subRows = _ref.subRows;
@@ -95,7 +96,9 @@ var DatagridRow = function DatagridRow(datagridState) {
     }
   };
   var rowClassNames = (0, _classnames.default)("".concat(blockClass, "__carbon-row"), (_cx = {}, (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__carbon-row-expanded"), row.isExpanded), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__carbon-row-expandable"), row.canExpand), (0, _defineProperty2.default)(_cx, "".concat(_settings.carbon.prefix, "--data-table--selected"), row.isSelected), _cx));
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_react2.TableRow, (0, _extends2.default)({
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, {
+    key: key
+  }, /*#__PURE__*/_react.default.createElement(_react2.TableRow, (0, _extends2.default)({
     className: rowClassNames
   }, row.getRowProps(), {
     key: row.id,

package/lib/components/Datagrid/Datagrid/DatagridSimpleBody.js

@@ -28,8 +28,11 @@ var DatagridSimpleBody = function DatagridSimpleBody(datagridState) {
     className: (0, _classnames.default)("".concat(blockClass, "__simple-body"), getTableBodyProps().className)
   }), rows.map(function (row) {
     prepareRow(row);
+    var _row$getRowProps = row.getRowProps(),
+      key = _row$getRowProps.key;
     return row.RowRenderer(_objectSpread(_objectSpread({}, datagridState), {}, {
-      row: row
+      row: row,
+      key: key
     }));
   }));
 };