@carbon/ibm-products 1.55.0 → 1.55.2

package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/DraggableItemsList.js

@@ -17,32 +17,49 @@ export var DraggableItemsList = function DraggableItemsList(_ref) {
     filterString = _ref.filterString,
     focusIndex = _ref.focusIndex,
     getNextIndex = _ref.getNextIndex,
-    isTableSortable = _ref.isTableSortable,
     moveElement = _ref.moveElement,
     onSelectColumn = _ref.onSelectColumn,
     setAriaRegionText = _ref.setAriaRegionText,
     setColumnsObject = _ref.setColumnsObject,
     setFocusIndex = _ref.setFocusIndex;
+  // This function recursively looks for the nested header element until we can find the key which contains the title.
+  // This can happen if multiple hooks are used together that manipulate the rendering of the column
+  // header, such as `useColumnCenterAlign` and `useSortableColumns`.
+  var getNestedTitle = function getNestedTitle(component) {
+    if (component && !component.key) {
+      return getNestedTitle(component.children);
+    }
+    if (component && component.key && typeof component.key === 'string') {
+      return component.key;
+    }
+  };
+  var getColTitle = function getColTitle(col) {
+    if (!col) {
+      return;
+    }
+    var checkTitle = function checkTitle() {
+      if (col.Header().props.children.props && col.Header().props.children.props.title) {
+        return col.Header().props.children.props.title;
+      }
+      return getNestedTitle(col.Header().props.children.props);
+    };
+    return typeof (col === null || col === void 0 ? void 0 : col.Header) === 'function' ? checkTitle() : col.Header.props.title;
+  };
   return /*#__PURE__*/React.createElement(React.Fragment, null, columns
   // hide the columns without Header, e.g the sticky actions, spacer
   .filter(function (colDef) {
-    var _colDef$Header$props$, _colDef$Header$props;
-    var sortableTitle = isTableSortable && ((_colDef$Header$props$ = colDef.Header().props.children.props) === null || _colDef$Header$props$ === void 0 ? void 0 : _colDef$Header$props$.title);
-    return !!colDef.Header.props && !!((_colDef$Header$props = colDef.Header.props) !== null && _colDef$Header$props !== void 0 && _colDef$Header$props.title) || isTableSortable && !!sortableTitle;
-  }).filter(function (colDef) {
+    return !!getColTitle(colDef);
+  }).filter(Boolean).filter(function (colDef) {
     return !colDef.isAction;
   }).filter(function (colDef) {
-    var _colDef$Header$props$2, _colDef$Header$props2, _colDef$Header$props3;
-    var sortableTitle = isTableSortable && ((_colDef$Header$props$2 = colDef.Header().props.children.props) === null || _colDef$Header$props$2 === void 0 ? void 0 : _colDef$Header$props$2.title);
-    return filterString.length === 0 || (isTableSortable ? sortableTitle === null || sortableTitle === void 0 ? void 0 : sortableTitle.toLowerCase().includes(filterString) : (_colDef$Header$props2 = colDef.Header.props) === null || _colDef$Header$props2 === void 0 ? void 0 : (_colDef$Header$props3 = _colDef$Header$props2.title) === null || _colDef$Header$props3 === void 0 ? void 0 : _colDef$Header$props3.toLowerCase().includes(filterString)) && colDef.id !== 'spacer';
+    var _getColTitle;
+    return filterString.length === 0 || ((_getColTitle = getColTitle(colDef)) === null || _getColTitle === void 0 ? void 0 : _getColTitle.toLowerCase().includes(filterString)) && colDef.id !== 'spacer';
   }).map(function (colDef, i) {
-    var _colDef$Header$props$3, _colDef$Header$props4, _colDef$Header$props5, _colDef$Header$props6, _colDef$Header$props7;
-    var isSortableColumn = !!colDef.canSort && !!isTableSortable;
-    var sortableTitle = isTableSortable && ((_colDef$Header$props$3 = colDef.Header().props.children.props) === null || _colDef$Header$props$3 === void 0 ? void 0 : _colDef$Header$props$3.title);
+    var colHeaderTitle = getColTitle(colDef);
     var searchString = new RegExp('(' + filterString + ')');
-    var res = filterString.length ? isSortableColumn ? sortableTitle.toLowerCase().split(searchString) : colDef.Header.props.title.toLowerCase().split(searchString) : null;
+    var res = filterString.length ? colHeaderTitle.toLowerCase().split(searchString) : null;
     var firstWord = res !== null ? res[0] === '' ? res[1].charAt(0).toUpperCase() + res[1].substring(1) : res[0].charAt(0).toUpperCase() + res[0].substring(1) : null;
-    var highlightedText = res !== null ? res[0] === '' ? "<strong>".concat(firstWord, "</strong>") + res[2] : firstWord + "<strong>".concat(res[1], "</strong>") + res[2] : isSortableColumn ? sortableTitle : (_colDef$Header$props4 = colDef.Header.props) === null || _colDef$Header$props4 === void 0 ? void 0 : _colDef$Header$props4.title;
+    var highlightedText = res !== null ? res[0] === '' ? "<strong>".concat(firstWord, "</strong>") + res[2] : firstWord + "<strong>".concat(res[1], "</strong>") + res[2] : colHeaderTitle;
     var isFrozenColumn = !!colDef.sticky;
     var listContents = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Checkbox, {
       wrapperClassName: "".concat(blockClass, "__customize-columns-checkbox-wrapper"),
@@ -50,8 +67,8 @@ export var DraggableItemsList = function DraggableItemsList(_ref) {
       disabled: isFrozenColumn,
       onChange: onSelectColumn.bind(null, colDef),
       id: "".concat(blockClass, "__customization-column-").concat(colDef.id),
-      labelText: isSortableColumn ? sortableTitle : (_colDef$Header$props5 = colDef.Header.props) === null || _colDef$Header$props5 === void 0 ? void 0 : _colDef$Header$props5.title,
-      title: isSortableColumn ? sortableTitle : (_colDef$Header$props6 = colDef.Header.props) === null || _colDef$Header$props6 === void 0 ? void 0 : _colDef$Header$props6.title,
+      labelText: colHeaderTitle,
+      title: colHeaderTitle,
       className: "".concat(blockClass, "__customize-columns-checkbox"),
       hideLabel: true
     }), /*#__PURE__*/React.createElement("div", {
@@ -67,7 +84,7 @@ export var DraggableItemsList = function DraggableItemsList(_ref) {
       id: "dnd-datagrid-columns-".concat(colDef.id),
       type: "column-customization",
       disabled: filterString.length > 0 || isFrozenColumn,
-      ariaLabel: isSortableColumn ? sortableTitle : (_colDef$Header$props7 = colDef.Header.props) === null || _colDef$Header$props7 === void 0 ? void 0 : _colDef$Header$props7.title,
+      ariaLabel: colHeaderTitle,
       onGrab: setAriaRegionText,
       isFocused: focusIndex === i,
       moveElement: moveElement,
@@ -96,7 +113,6 @@ DraggableItemsList.propTypes = {
   filterString: PropTypes.string.isRequired,
   focusIndex: PropTypes.number.isRequired,
   getNextIndex: PropTypes.func.isRequired,
-  isTableSortable: PropTypes.bool,
   moveElement: PropTypes.func.isRequired,
   onSelectColumn: PropTypes.func.isRequired,
   setAriaRegionText: PropTypes.func.isRequired,

package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/TearsheetWrapper.js

@@ -21,7 +21,6 @@ var TearsheetWrapper = function TearsheetWrapper(_ref) {
     rest = _objectWithoutProperties(_instance$customizeCo, _excluded);
   return /*#__PURE__*/React.createElement(CustomizeColumnsTearsheet, _extends({}, rest, labels, {
     isOpen: isTearsheetOpen,
-    isTableSortable: instance === null || instance === void 0 ? void 0 : instance.isTableSortable,
     setIsTearsheetOpen: setIsTearsheetOpen,
     columnDefinitions: instance.allColumns,
     originalColumnDefinitions: instance.columns,

package/es/components/Datagrid/useDefaultStringRenderer.js

@@ -24,7 +24,8 @@ var useDefaultStringRenderer = function useDefaultStringRenderer(hooks) {
   var HeaderRenderer = function HeaderRenderer(header) {
     return /*#__PURE__*/React.createElement("div", {
       className: "".concat(blockClass, "__defaultStringRenderer"),
-      title: typeof header === 'string' ? header : ''
+      title: typeof header === 'string' ? header : '',
+      key: typeof header === 'string' ? header : ''
     }, header);
   };
   var visibleColumns = function visibleColumns(columns) {

package/es/components/Datagrid/useSortableColumns.js

@@ -24,8 +24,12 @@ var getAriaSortValue = function getAriaSortValue(col, _ref) {
   var ascendingSortableLabelText = _ref.ascendingSortableLabelText,
     descendingSortableLabelText = _ref.descendingSortableLabelText,
     defaultSortableLabelText = _ref.defaultSortableLabelText;
-  var isSorted = col.isSorted,
-    isSortedDesc = col.isSortedDesc;
+  if (!col) {
+    return;
+  }
+  var _ref2 = col || {},
+    isSorted = _ref2.isSorted,
+    isSortedDesc = _ref2.isSortedDesc;
   if (!isSorted) {
     return defaultSortableLabelText || 'none';
   }
@@ -37,9 +41,9 @@ var getAriaSortValue = function getAriaSortValue(col, _ref) {
   }
 };
 var useSortableColumns = function useSortableColumns(hooks) {
-  var sortableVisibleColumns = function sortableVisibleColumns(visibleColumns, _ref2) {
+  var sortableVisibleColumns = function sortableVisibleColumns(visibleColumns, _ref3) {
     var _instance$customizeCo;
-    var instance = _ref2.instance;
+    var instance = _ref3.instance;
     var onSort = instance.onSort,
       ascendingSortableLabelText = instance.ascendingSortableLabelText,
       descendingSortableLabelText = instance.descendingSortableLabelText,

package/es/global/js/utils/test-helper.js

@@ -109,7 +109,7 @@ var makeMatcherArray = function makeMatcherArray(args) {
  * A helper function to enable a test to expect a single call to
  * console.warn, for example when intentionally using a deprecated prop
  * or supplying invalid parameters for the purposes of the test.
- * @param {string|regex|function|[]} message the expected parameters for the call to
+ * @param {string|regex|Function|[]} message the expected parameters for the call to
  * console.warn, which must be called exactly once. A single string or regex or an
  * expect matcher can be used to match a single-argument call to console.warn (most common),
  * while an array of strings and/or regex and/or expect matchers can be used to match a
@@ -194,7 +194,7 @@ var checkLogging = function checkLogging(mock, message) {
  * A helper function to enable a test to expect a single call to
  * console.error, for example when intentionally omitting a required prop
  * or supplying an invalid prop type or value for the purposes of the test.
- * @param {errors: {string|regex|function|[]}, warnings: {string|regex|function|[]}} messages the expected parameters for the call to
+ * @param {errors: {string|regex|Function|[]}, warnings: {string|regex|Function|[]}} messages the expected parameters for the call to
  * console.error or console.warn, which must be called exactly once. A single string or regex or an
  * expect matcher can be used to match a single-argument call to console.error (most common),
  * while an array of strings and/or regex and/or expect matchers can be used to match a
@@ -220,7 +220,7 @@ export var expectLogging = function expectLogging(_ref2, test) {
  * A helper function to enable a test to expect a single call to
  * console.error, for example when intentionally omitting a required prop
  * or supplying an invalid prop type or value for the purposes of the test.
- * @param {string|regex|function|[]} message the expected parameters for the call to
+ * @param {string|regex|Function|[]} message the expected parameters for the call to
  * console.error, which must be called exactly once. A single string or regex or an
  * expect matcher can be used to match a single-argument call to console.error (most common),
  * while an array of strings and/or regex and/or expect matchers can be used to match a

package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/Columns.js

@@ -42,8 +42,7 @@ var Columns = function Columns(_ref) {
     onSelectColumn = _ref.onSelectColumn,
     assistiveTextInstructionsLabel = _ref.assistiveTextInstructionsLabel,
     assistiveTextDisabledInstructionsLabel = _ref.assistiveTextDisabledInstructionsLabel,
-    selectAllLabel = _ref.selectAllLabel,
-    isTableSortable = _ref.isTableSortable;
+    selectAllLabel = _ref.selectAllLabel;
   var _React$useState = _react.default.useState(''),
     _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
     ariaRegionText = _React$useState2[0],
@@ -99,7 +98,6 @@ var Columns = function Columns(_ref) {
     filterString: filterString,
     focusIndex: focusIndex,
     getNextIndex: getNextIndex,
-    isTableSortable: isTableSortable,
     moveElement: moveElement,
     onSelectColumn: onSelectColumn,
     setAriaRegionText: setAriaRegionText,
@@ -115,7 +113,6 @@ Columns.propTypes = {
   filterString: _propTypes.default.string.isRequired,
   getVisibleColumnsCount: _propTypes.default.func.isRequired,
   instructionsLabel: _propTypes.default.string,
-  isTableSortable: _propTypes.default.bool.isRequired,
   onSelectColumn: _propTypes.default.func.isRequired,
   selectAllLabel: _propTypes.default.string,
   setColumnStatus: _propTypes.default.func,

package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/CustomizeColumnsTearsheet.js

@@ -43,8 +43,7 @@ var CustomizeColumnsTearsheet = function CustomizeColumnsTearsheet(_ref) {
     _ref$assistiveTextDis = _ref.assistiveTextDisabledInstructionsLabel,
     assistiveTextDisabledInstructionsLabel = _ref$assistiveTextDis === void 0 ? 'Reordering columns are disabled because they are filtered currently.' : _ref$assistiveTextDis,
     _ref$selectAllLabel = _ref.selectAllLabel,
-    selectAllLabel = _ref$selectAllLabel === void 0 ? 'Column name' : _ref$selectAllLabel,
-    isTableSortable = _ref.isTableSortable;
+    selectAllLabel = _ref$selectAllLabel === void 0 ? 'Column name' : _ref$selectAllLabel;
   var _useState = (0, _react.useState)(''),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     visibleColumnsCount = _useState2[0],
@@ -154,8 +153,7 @@ var CustomizeColumnsTearsheet = function CustomizeColumnsTearsheet(_ref) {
       setColumnObjects(cols);
       setDirty();
     },
-    selectAllLabel: selectAllLabel,
-    isTableSortable: isTableSortable
+    selectAllLabel: selectAllLabel
   }));
 };
 CustomizeColumnsTearsheet.propTypes = {
@@ -166,7 +164,6 @@ CustomizeColumnsTearsheet.propTypes = {
   findColumnPlaceholderLabel: _propTypes.default.string,
   instructionsLabel: _propTypes.default.string,
   isOpen: _propTypes.default.bool.isRequired,
-  isTableSortable: _propTypes.default.bool.isRequired,
   onSaveColumnPrefs: _propTypes.default.func.isRequired,
   originalColumnDefinitions: _propTypes.default.array.isRequired,
   primaryButtonTextLabel: _propTypes.default.string,

package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/DraggableItemsList.js

@@ -24,32 +24,49 @@ var DraggableItemsList = function DraggableItemsList(_ref) {
     filterString = _ref.filterString,
     focusIndex = _ref.focusIndex,
     getNextIndex = _ref.getNextIndex,
-    isTableSortable = _ref.isTableSortable,
     moveElement = _ref.moveElement,
     onSelectColumn = _ref.onSelectColumn,
     setAriaRegionText = _ref.setAriaRegionText,
     setColumnsObject = _ref.setColumnsObject,
     setFocusIndex = _ref.setFocusIndex;
+  // This function recursively looks for the nested header element until we can find the key which contains the title.
+  // This can happen if multiple hooks are used together that manipulate the rendering of the column
+  // header, such as `useColumnCenterAlign` and `useSortableColumns`.
+  var getNestedTitle = function getNestedTitle(component) {
+    if (component && !component.key) {
+      return getNestedTitle(component.children);
+    }
+    if (component && component.key && typeof component.key === 'string') {
+      return component.key;
+    }
+  };
+  var getColTitle = function getColTitle(col) {
+    if (!col) {
+      return;
+    }
+    var checkTitle = function checkTitle() {
+      if (col.Header().props.children.props && col.Header().props.children.props.title) {
+        return col.Header().props.children.props.title;
+      }
+      return getNestedTitle(col.Header().props.children.props);
+    };
+    return typeof (col === null || col === void 0 ? void 0 : col.Header) === 'function' ? checkTitle() : col.Header.props.title;
+  };
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, columns
   // hide the columns without Header, e.g the sticky actions, spacer
   .filter(function (colDef) {
-    var _colDef$Header$props$, _colDef$Header$props;
-    var sortableTitle = isTableSortable && ((_colDef$Header$props$ = colDef.Header().props.children.props) === null || _colDef$Header$props$ === void 0 ? void 0 : _colDef$Header$props$.title);
-    return !!colDef.Header.props && !!((_colDef$Header$props = colDef.Header.props) !== null && _colDef$Header$props !== void 0 && _colDef$Header$props.title) || isTableSortable && !!sortableTitle;
-  }).filter(function (colDef) {
+    return !!getColTitle(colDef);
+  }).filter(Boolean).filter(function (colDef) {
     return !colDef.isAction;
   }).filter(function (colDef) {
-    var _colDef$Header$props$2, _colDef$Header$props2, _colDef$Header$props3;
-    var sortableTitle = isTableSortable && ((_colDef$Header$props$2 = colDef.Header().props.children.props) === null || _colDef$Header$props$2 === void 0 ? void 0 : _colDef$Header$props$2.title);
-    return filterString.length === 0 || (isTableSortable ? sortableTitle === null || sortableTitle === void 0 ? void 0 : sortableTitle.toLowerCase().includes(filterString) : (_colDef$Header$props2 = colDef.Header.props) === null || _colDef$Header$props2 === void 0 ? void 0 : (_colDef$Header$props3 = _colDef$Header$props2.title) === null || _colDef$Header$props3 === void 0 ? void 0 : _colDef$Header$props3.toLowerCase().includes(filterString)) && colDef.id !== 'spacer';
+    var _getColTitle;
+    return filterString.length === 0 || ((_getColTitle = getColTitle(colDef)) === null || _getColTitle === void 0 ? void 0 : _getColTitle.toLowerCase().includes(filterString)) && colDef.id !== 'spacer';
   }).map(function (colDef, i) {
-    var _colDef$Header$props$3, _colDef$Header$props4, _colDef$Header$props5, _colDef$Header$props6, _colDef$Header$props7;
-    var isSortableColumn = !!colDef.canSort && !!isTableSortable;
-    var sortableTitle = isTableSortable && ((_colDef$Header$props$3 = colDef.Header().props.children.props) === null || _colDef$Header$props$3 === void 0 ? void 0 : _colDef$Header$props$3.title);
+    var colHeaderTitle = getColTitle(colDef);
     var searchString = new RegExp('(' + filterString + ')');
-    var res = filterString.length ? isSortableColumn ? sortableTitle.toLowerCase().split(searchString) : colDef.Header.props.title.toLowerCase().split(searchString) : null;
+    var res = filterString.length ? colHeaderTitle.toLowerCase().split(searchString) : null;
     var firstWord = res !== null ? res[0] === '' ? res[1].charAt(0).toUpperCase() + res[1].substring(1) : res[0].charAt(0).toUpperCase() + res[0].substring(1) : null;
-    var highlightedText = res !== null ? res[0] === '' ? "<strong>".concat(firstWord, "</strong>") + res[2] : firstWord + "<strong>".concat(res[1], "</strong>") + res[2] : isSortableColumn ? sortableTitle : (_colDef$Header$props4 = colDef.Header.props) === null || _colDef$Header$props4 === void 0 ? void 0 : _colDef$Header$props4.title;
+    var highlightedText = res !== null ? res[0] === '' ? "<strong>".concat(firstWord, "</strong>") + res[2] : firstWord + "<strong>".concat(res[1], "</strong>") + res[2] : colHeaderTitle;
     var isFrozenColumn = !!colDef.sticky;
     var listContents = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Checkbox, {
       wrapperClassName: "".concat(blockClass, "__customize-columns-checkbox-wrapper"),
@@ -57,8 +74,8 @@ var DraggableItemsList = function DraggableItemsList(_ref) {
       disabled: isFrozenColumn,
       onChange: onSelectColumn.bind(null, colDef),
       id: "".concat(blockClass, "__customization-column-").concat(colDef.id),
-      labelText: isSortableColumn ? sortableTitle : (_colDef$Header$props5 = colDef.Header.props) === null || _colDef$Header$props5 === void 0 ? void 0 : _colDef$Header$props5.title,
-      title: isSortableColumn ? sortableTitle : (_colDef$Header$props6 = colDef.Header.props) === null || _colDef$Header$props6 === void 0 ? void 0 : _colDef$Header$props6.title,
+      labelText: colHeaderTitle,
+      title: colHeaderTitle,
       className: "".concat(blockClass, "__customize-columns-checkbox"),
       hideLabel: true
     }), /*#__PURE__*/_react.default.createElement("div", {
@@ -74,7 +91,7 @@ var DraggableItemsList = function DraggableItemsList(_ref) {
       id: "dnd-datagrid-columns-".concat(colDef.id),
       type: "column-customization",
       disabled: filterString.length > 0 || isFrozenColumn,
-      ariaLabel: isSortableColumn ? sortableTitle : (_colDef$Header$props7 = colDef.Header.props) === null || _colDef$Header$props7 === void 0 ? void 0 : _colDef$Header$props7.title,
+      ariaLabel: colHeaderTitle,
       onGrab: setAriaRegionText,
       isFocused: focusIndex === i,
       moveElement: moveElement,
@@ -104,7 +121,6 @@ DraggableItemsList.propTypes = {
   filterString: _propTypes.PropTypes.string.isRequired,
   focusIndex: _propTypes.PropTypes.number.isRequired,
   getNextIndex: _propTypes.PropTypes.func.isRequired,
-  isTableSortable: _propTypes.PropTypes.bool,
   moveElement: _propTypes.PropTypes.func.isRequired,
   onSelectColumn: _propTypes.PropTypes.func.isRequired,
   setAriaRegionText: _propTypes.PropTypes.func.isRequired,

package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/TearsheetWrapper.js

@@ -24,7 +24,6 @@ var TearsheetWrapper = function TearsheetWrapper(_ref) {
     rest = (0, _objectWithoutProperties2.default)(_instance$customizeCo, _excluded);
   return /*#__PURE__*/React.createElement(_CustomizeColumnsTearsheet.default, (0, _extends2.default)({}, rest, labels, {
     isOpen: isTearsheetOpen,
-    isTableSortable: instance === null || instance === void 0 ? void 0 : instance.isTableSortable,
     setIsTearsheetOpen: setIsTearsheetOpen,
     columnDefinitions: instance.allColumns,
     originalColumnDefinitions: instance.columns,

package/lib/components/Datagrid/useDefaultStringRenderer.js

@@ -24,7 +24,8 @@ var useDefaultStringRenderer = function useDefaultStringRenderer(hooks) {
   var HeaderRenderer = function HeaderRenderer(header) {
     return /*#__PURE__*/_react.default.createElement("div", {
       className: "".concat(blockClass, "__defaultStringRenderer"),
-      title: typeof header === 'string' ? header : ''
+      title: typeof header === 'string' ? header : '',
+      key: typeof header === 'string' ? header : ''
     }, header);
   };
   var visibleColumns = function visibleColumns(columns) {

package/lib/components/Datagrid/useSortableColumns.js

@@ -24,8 +24,12 @@ var getAriaSortValue = function getAriaSortValue(col, _ref) {
   var ascendingSortableLabelText = _ref.ascendingSortableLabelText,
     descendingSortableLabelText = _ref.descendingSortableLabelText,
     defaultSortableLabelText = _ref.defaultSortableLabelText;
-  var isSorted = col.isSorted,
-    isSortedDesc = col.isSortedDesc;
+  if (!col) {
+    return;
+  }
+  var _ref2 = col || {},
+    isSorted = _ref2.isSorted,
+    isSortedDesc = _ref2.isSortedDesc;
   if (!isSorted) {
     return defaultSortableLabelText || 'none';
   }
@@ -37,9 +41,9 @@ var getAriaSortValue = function getAriaSortValue(col, _ref) {
   }
 };
 var useSortableColumns = function useSortableColumns(hooks) {
-  var sortableVisibleColumns = function sortableVisibleColumns(visibleColumns, _ref2) {
+  var sortableVisibleColumns = function sortableVisibleColumns(visibleColumns, _ref3) {
     var _instance$customizeCo;
-    var instance = _ref2.instance;
+    var instance = _ref3.instance;
     var onSort = instance.onSort,
       ascendingSortableLabelText = instance.ascendingSortableLabelText,
       descendingSortableLabelText = instance.descendingSortableLabelText,

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

@@ -119,7 +119,7 @@ var makeMatcherArray = function makeMatcherArray(args) {
  * A helper function to enable a test to expect a single call to
  * console.warn, for example when intentionally using a deprecated prop
  * or supplying invalid parameters for the purposes of the test.
- * @param {string|regex|function|[]} message the expected parameters for the call to
+ * @param {string|regex|Function|[]} message the expected parameters for the call to
  * console.warn, which must be called exactly once. A single string or regex or an
  * expect matcher can be used to match a single-argument call to console.warn (most common),
  * while an array of strings and/or regex and/or expect matchers can be used to match a
@@ -207,7 +207,7 @@ var checkLogging = function checkLogging(mock, message) {
  * A helper function to enable a test to expect a single call to
  * console.error, for example when intentionally omitting a required prop
  * or supplying an invalid prop type or value for the purposes of the test.
- * @param {errors: {string|regex|function|[]}, warnings: {string|regex|function|[]}} messages the expected parameters for the call to
+ * @param {errors: {string|regex|Function|[]}, warnings: {string|regex|Function|[]}} messages the expected parameters for the call to
  * console.error or console.warn, which must be called exactly once. A single string or regex or an
  * expect matcher can be used to match a single-argument call to console.error (most common),
  * while an array of strings and/or regex and/or expect matchers can be used to match a
@@ -233,7 +233,7 @@ var expectLogging = function expectLogging(_ref2, test) {
  * A helper function to enable a test to expect a single call to
  * console.error, for example when intentionally omitting a required prop
  * or supplying an invalid prop type or value for the purposes of the test.
- * @param {string|regex|function|[]} message the expected parameters for the call to
+ * @param {string|regex|Function|[]} message the expected parameters for the call to
  * console.error, which must be called exactly once. A single string or regex or an
  * expect matcher can be used to match a single-argument call to console.error (most common),
  * while an array of strings and/or regex and/or expect matchers can be used to match a

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/ibm-products",
   "description": "Carbon for IBM Products",
-  "version": "1.55.0",
+  "version": "1.55.2",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -76,6 +76,7 @@
     "framer-motion": "^6.5.1 <7",
     "immutability-helper": "^3.1.1",
     "lodash": "^4.17.21",
+    "lottie-web": "^5.11.0",
     "react-dnd": "^15.1.2",
     "react-dnd-html5-backend": "^15.1.3",
     "react-table": "^7.8.0",
@@ -83,17 +84,17 @@
   },
   "peerDependencies": {
     "@carbon/colors": "^10.37.1",
-    "@carbon/icons-react": "^10.49.0",
+    "@carbon/icons-react": "^10.49.1",
     "@carbon/import-once": "^10.7.0",
     "@carbon/layout": "^10.37.1",
-    "@carbon/motion": "^10.29.0",
-    "@carbon/themes": "^10.55.1",
-    "@carbon/type": "^10.45.1",
-    "carbon-components": "^10.58.7",
-    "carbon-components-react": "^7.59.8",
+    "@carbon/motion": "^10.29.1",
+    "@carbon/themes": "^10.55.2",
+    "@carbon/type": "^10.45.2",
+    "carbon-components": "^10.58.8",
+    "carbon-components-react": "^7.59.9",
     "carbon-icons": "^7.0.7",
     "react": "^16.8.6 || ^17.0.1",
     "react-dom": "^16.8.6 || ^17.0.1"
   },
-  "gitHead": "4a7110b38042c4dabcddc49901ce68169dd7f18b"
+  "gitHead": "33f2fa8f015f9d04c83142badc07c9f0905130c8"
 }

package/scss/components/Datagrid/styles/_useColumnCenterAlign.scss

@@ -1,19 +1,19 @@
-/*
-* 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 './variables';
 
-.#{$block-class}__center-align-header {
+.#{$block-class}__center-align-header,
+.#{$block-class}__center-align-header .#{$block-class}--table-sort {
   width: 100%;
   text-align: center;
 }
 
-.#{$block-class}__center-align-cell-renderer.sortDisabled {
+.#{$block-class}__center-align-cell-renderer {
   margin-right: auto;
   margin-left: auto;
 }