@carbon/ibm-products 2.27.0 → 2.28.0-alpha.4

package/lib/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.js

@@ -11,16 +11,17 @@ 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/prop-types/index.js');
 var icons = require('@carbon/react/icons');
 var react = require('@carbon/react');
-var index = require('../../../../../node_modules/classnames/index.js');
+var cx = require('classnames');
 var RowSizeRadioGroup = require('./RowSizeRadioGroup.js');
 var settings = require('../../../../../settings.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 _Settings;
 var _excluded = ["align", "legendText"];
@@ -75,7 +76,7 @@ var RowSizeDropdown = function RowSizeDropdown(_ref) {
     kind: "ghost",
     onClick: onClickHandler,
     label: legendText,
-    className: index["default"]("".concat(blockClass, "-button"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__row-settings-trigger--open"), isOpen))
+    className: cx__default["default"]("".concat(blockClass, "-button"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__row-settings-trigger--open"), isOpen))
   }, _Settings || (_Settings = /*#__PURE__*/React__default["default"].createElement(icons.Settings, {
     size: 16
   }))), /*#__PURE__*/React__default["default"].createElement(react.PopoverContent, null, /*#__PURE__*/React__default["default"].createElement(react.Layer, null, /*#__PURE__*/React__default["default"].createElement(RowSizeRadioGroup["default"], _rollupPluginBabelHelpers["extends"]({
@@ -86,11 +87,11 @@ var RowSizeDropdown = function RowSizeDropdown(_ref) {
 };
 RowSizeDropdown.propTypes = {
   align: react.IconButton.propTypes.align,
-  datagridName: index$1["default"].string,
-  legendText: index$1["default"].string,
-  light: index$1["default"].bool,
-  onChange: index$1["default"].func.isRequired,
-  selectedOption: index$1["default"].string
+  datagridName: index["default"].string,
+  legendText: index["default"].string,
+  light: index["default"].bool,
+  onChange: index["default"].func.isRequired,
+  selectedOption: index["default"].string
 };
 var RowSizeDropdown$1 = RowSizeDropdown;
 

package/lib/components/Datagrid/useActionsColumn.js

@@ -11,7 +11,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
-var index = require('../../node_modules/classnames/index.js');
+var cx = require('classnames');
 var react = require('@carbon/react');
 var settings = require('../../settings.js');
 var propsHelper = require('../../global/js/utils/props-helper.js');
@@ -19,6 +19,7 @@ var propsHelper = require('../../global/js/utils/props-helper.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 = ["align", "id", "itemText", "onClick", "icon", "shouldHideMenuItem"],
   _excluded2 = ["id", "onClick", "shouldHideMenuItem", "shouldDisableMenuItem", "disabled"];
@@ -54,7 +55,7 @@ var useActionsColumn = function useActionsColumn(hooks) {
               style: {
                 display: 'flex'
               }
-            }, rowActions.map(function (action, index$1) {
+            }, rowActions.map(function (action, index) {
               var preparedActionProps = propsHelper.prepareProps(action, ['isDelete']);
               var align = preparedActionProps.align,
                 id = preparedActionProps.id,
@@ -69,15 +70,15 @@ var useActionsColumn = function useActionsColumn(hooks) {
               }
               var Icon = icon;
               return /*#__PURE__*/React__default["default"].createElement("div", {
-                className: index["default"]("".concat(blockClass, "__actions-column-button"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__disabled-row-action-button"), getDisabledState(row.index))),
-                key: "".concat(itemText, "__").concat(index$1)
+                className: cx__default["default"]("".concat(blockClass, "__actions-column-button"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__disabled-row-action-button"), getDisabledState(row.index))),
+                key: "".concat(itemText, "__").concat(index)
               }, /*#__PURE__*/React__default["default"].createElement(react.IconButton, _rollupPluginBabelHelpers["extends"]({}, rest, {
                 align: align || 'top',
                 label: itemText,
                 kind: "ghost",
                 name: itemText //for test use
                 ,
-                className: index["default"](_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__disabled-row-action"), getDisabledState(row.index))),
+                className: cx__default["default"](_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__disabled-row-action"), getDisabledState(row.index))),
                 onClick: function onClick(e) {
                   if (getDisabledState(row.index)) {
                     // Row actions should be disabled if row is selected and batchActions toolbar is active
@@ -117,7 +118,7 @@ var useActionsColumn = function useActionsColumn(hooks) {
                 key: id
               }));
             })))),
-            className: index["default"](_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__actions-column-cell"), true), "".concat(blockClass, "__cell"), true), "".concat(blockClass, "__actions-column-cell-non-sticky"), !isColumnSticky)),
+            className: cx__default["default"](_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__actions-column-cell"), true), "".concat(blockClass, "__cell"), true), "".concat(blockClass, "__actions-column-cell-non-sticky"), !isColumnSticky)),
             style: {
               width: rowActions.length > 2 || isColumnSticky ? 48 : 96
             }

package/lib/components/Datagrid/useColumnCenterAlign.js

@@ -11,18 +11,19 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
-var index = require('../../node_modules/classnames/index.js');
+var cx = require('classnames');
 var settings = require('../../settings.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 blockClass = "".concat(settings.pkg.prefix, "--datagrid");
 var useColumnCenterAlign = function useColumnCenterAlign(hooks) {
   var centerAlignRenderer = function centerAlignRenderer(tableProps, column) {
     return /*#__PURE__*/React__default["default"].createElement("div", {
-      className: index["default"]("".concat(blockClass, "__center-align-cell-renderer"), {
+      className: cx__default["default"]("".concat(blockClass, "__center-align-cell-renderer"), {
         sortDisabled: !tableProps.isTableSortable || tableProps.column.disableSortBy === true
       })
     }, column.Cell(tableProps));

package/lib/components/Datagrid/useColumnRightAlign.js

@@ -11,18 +11,19 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
-var index = require('../../node_modules/classnames/index.js');
+var cx = require('classnames');
 var settings = require('../../settings.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 blockClass = "".concat(settings.pkg.prefix, "--datagrid");
 var useColumnRightAlign = function useColumnRightAlign(hooks) {
   var RightAlignRenderer = function RightAlignRenderer(tableProps, column) {
     return /*#__PURE__*/React__default["default"].createElement("div", {
-      className: index["default"]("".concat(blockClass, "__right-align-cell-renderer"), {
+      className: cx__default["default"]("".concat(blockClass, "__right-align-cell-renderer"), {
         sortDisabled: !tableProps.isTableSortable || tableProps.column.disableSortBy === true
       })
     }, column.Cell(tableProps));

package/lib/components/Datagrid/useDefaultStringRenderer.js

@@ -11,24 +11,25 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
-var index = require('../../node_modules/classnames/index.js');
+var cx = require('classnames');
 var settings = require('../../settings.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 blockClass = "".concat(settings.pkg.prefix, "--datagrid");
 var useDefaultStringRenderer = function useDefaultStringRenderer(hooks) {
   var StringRenderer = function StringRenderer(tableProps) {
     var _tableProps$column;
     return /*#__PURE__*/React__default["default"].createElement("div", {
-      className: index["default"]("".concat(blockClass, "__defaultStringRenderer"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__defaultStringRenderer--multiline"), ((_tableProps$column = tableProps.column) === null || _tableProps$column === void 0 ? void 0 : _tableProps$column.multiLineWrap) || (tableProps === null || tableProps === void 0 ? void 0 : tableProps.multiLineWrapAll)))
+      className: cx__default["default"]("".concat(blockClass, "__defaultStringRenderer"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__defaultStringRenderer--multiline"), ((_tableProps$column = tableProps.column) === null || _tableProps$column === void 0 ? void 0 : _tableProps$column.multiLineWrap) || (tableProps === null || tableProps === void 0 ? void 0 : tableProps.multiLineWrapAll)))
     }, tableProps.value);
   };
   var HeaderRenderer = function HeaderRenderer(header, slug) {
     return /*#__PURE__*/React__default["default"].createElement("div", {
-      className: index["default"]("".concat(blockClass, "__defaultStringRenderer"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__defaultStringRenderer--slug"), slug && /*#__PURE__*/React__default["default"].isValidElement(slug))),
+      className: cx__default["default"]("".concat(blockClass, "__defaultStringRenderer"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__defaultStringRenderer--slug"), slug && /*#__PURE__*/React__default["default"].isValidElement(slug))),
       title: typeof header === 'string' ? header : '',
       key: typeof header === 'string' ? header : ''
     }, header);

package/lib/components/Datagrid/useFiltering.js

@@ -14,56 +14,57 @@ var React = require('react');
 var constants = require('./Datagrid/addons/Filtering/constants.js');
 var FilterFlyout = require('./Datagrid/addons/Filtering/FilterFlyout.js');
 
+var handleMultiFilter = function handleMultiFilter(rows, id, value) {
+  // gets all the items that are selected and returns their value
+  var selectedItems = value.filter(function (item) {
+    return item.selected;
+  }).map(function (item) {
+    return item.value;
+  });
+
+  // if the user removed all checkboxes then display all rows
+  if (selectedItems.length === 0) {
+    return rows;
+  }
+  return rows.filter(function (row) {
+    var rowValue = row.values[id];
+    return selectedItems.includes(rowValue);
+  });
+};
 var useFiltering = function useFiltering(hooks) {
   /* istanbul ignore next */
   var filterTypes = React.useMemo(function () {
-    return {
-      date: function date(rows, id, _ref) {
-        var _ref2 = _rollupPluginBabelHelpers.slicedToArray(_ref, 2),
-          startDate = _ref2[0],
-          endDate = _ref2[1];
-        return rows.filter(function (row) {
-          var rowValue = row.values[id];
-          var startDateObj = _rollupPluginBabelHelpers["typeof"](startDate) === 'object' ? startDate : new Date(startDate);
-          var endDateObj = _rollupPluginBabelHelpers["typeof"](endDate) === 'object' ? endDate : new Date(endDate);
-          var rowValueDateObj = _rollupPluginBabelHelpers["typeof"](rowValue) === 'object' ? rowValue : new Date(rowValue);
-          if (rowValueDateObj.getTime() <= endDateObj.getTime() && rowValueDateObj.getTime() >= startDateObj.getTime()) {
-            // In date range
-            return true;
-          } else {
-            // Not in date range
-            return false;
-          }
-        });
-      },
-      number: function number(rows, id, value) {
-        if (value === '') {
-          return rows;
-        }
-        var parsedValue = parseInt(value);
-        return rows.filter(function (row) {
-          var rowValue = row.values[id];
-          return rowValue === parsedValue;
-        });
-      },
-      checkbox: function checkbox(rows, id, value) {
-        // gets all the items that are selected and returns their value
-        var selectedItems = value.filter(function (item) {
-          return item.selected;
-        }).map(function (item) {
-          return item.value;
-        });
-
-        // if the user removed all checkboxes then display all rows
-        if (selectedItems.length === 0) {
-          return rows;
+    return _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, constants.DATE, function (rows, id, _ref) {
+      var _ref2 = _rollupPluginBabelHelpers.slicedToArray(_ref, 2),
+        startDate = _ref2[0],
+        endDate = _ref2[1];
+      return rows.filter(function (row) {
+        var rowValue = row.values[id];
+        var startDateObj = _rollupPluginBabelHelpers["typeof"](startDate) === 'object' ? startDate : new Date(startDate);
+        var endDateObj = _rollupPluginBabelHelpers["typeof"](endDate) === 'object' ? endDate : new Date(endDate);
+        var rowValueDateObj = _rollupPluginBabelHelpers["typeof"](rowValue) === 'object' ? rowValue : new Date(rowValue);
+        if (rowValueDateObj.getTime() <= endDateObj.getTime() && rowValueDateObj.getTime() >= startDateObj.getTime()) {
+          // In date range
+          return true;
+        } else {
+          // Not in date range
+          return false;
         }
-        return rows.filter(function (row) {
-          var rowValue = row.values[id];
-          return selectedItems.includes(rowValue);
-        });
+      });
+    }), constants.NUMBER, function (rows, id, value) {
+      if (value === '') {
+        return rows;
       }
-    };
+      var parsedValue = parseInt(value);
+      return rows.filter(function (row) {
+        var rowValue = row.values[id];
+        return rowValue === parsedValue;
+      });
+    }), constants.CHECKBOX, function (rows, id, value) {
+      return handleMultiFilter(rows, id, value);
+    }), constants.MULTISELECT, function (rows, id, value) {
+      return handleMultiFilter(rows, id, value);
+    });
   }, []);
   hooks.useInstance.push(function (instance) {
     var filterProps = instance.filterProps,

package/lib/components/Datagrid/useFloatingScroll.js

@@ -10,9 +10,13 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
-var index = require('../../node_modules/classnames/index.js');
+var cx = require('classnames');
 var settings = require('../../settings.js');
 
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
+
 var blockClass = "".concat(settings.pkg.prefix, "--datagrid");
 var useFloatingScroll = function useFloatingScroll(hooks) {
   var useInstance = function useInstance(instance) {
@@ -38,7 +42,7 @@ var useFloatingScroll = function useFloatingScroll(hooks) {
     }
     var addStickyClass = function addStickyClass(props) {
       return [props, {
-        className: index["default"](props.className, "".concat(blockClass, "__sticky"))
+        className: cx__default["default"](props.className, "".concat(blockClass, "__sticky"))
       }];
     };
     hooks.getTableProps.push(addStickyClass);

package/lib/components/Datagrid/useInlineEdit.js

@@ -12,12 +12,13 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 var settings = require('../../settings.js');
-var index = require('../../node_modules/classnames/index.js');
+var cx = require('classnames');
 var InlineEditCell = require('./Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.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 blockClass = "".concat(settings.pkg.prefix, "--datagrid");
 var useInlineEdit = function useInlineEdit(hooks, usingEditableCell) {
@@ -47,11 +48,11 @@ var useInlineEdit = function useInlineEdit(hooks, usingEditableCell) {
     };
     if (cell.column.id === 'spacer') {
       return [props, {
-        className: index["default"]("".concat(blockClass, "__cell"), "".concat(blockClass, "__cell--spacer"))
+        className: cx__default["default"]("".concat(blockClass, "__cell"), "".concat(blockClass, "__cell--spacer"))
       }];
     }
     return [props, {
-      className: index["default"]("".concat(blockClass, "__cell"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__cell-inline-edit"), !!usingEditableCell || settings.pkg.isFeatureEnabled('Datagrid.useInlineEdit') ? true : '')),
+      className: cx__default["default"]("".concat(blockClass, "__cell"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__cell-inline-edit"), !!usingEditableCell || settings.pkg.isFeatureEnabled('Datagrid.useInlineEdit') ? true : '')),
       role: 'gridcell',
       children: (!!usingEditableCell || settings.pkg.isFeatureEnabled('Datagrid.useInlineEdit')) && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, inlineEditType === 'text' && renderInlineEditComponent(inlineEditType), inlineEditType === 'number' && renderInlineEditComponent(inlineEditType), inlineEditType === 'selection' && renderInlineEditComponent(inlineEditType), inlineEditType === 'date' && renderInlineEditComponent(inlineEditType), !inlineEditType && /*#__PURE__*/React__default["default"].createElement(InlineEditCell.InlineEditCell, {
         config: columnInlineEditConfig,

package/lib/components/Datagrid/useNestedRowExpander.js

@@ -12,13 +12,14 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 var icons = require('@carbon/react/icons');
-var index = require('../../node_modules/classnames/index.js');
+var cx = require('classnames');
 var settings = require('../../settings.js');
 var useFocusRowExpander = require('./useFocusRowExpander.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 blockClass = "".concat(settings.pkg.prefix, "--datagrid");
 var useNestedRowExpander = function useNestedRowExpander(hooks) {
@@ -55,11 +56,11 @@ var useNestedRowExpander = function useNestedRowExpander(hooks) {
         return row.canExpand && /*#__PURE__*/React__default["default"].createElement("button", _rollupPluginBabelHelpers["extends"]({
           type: "button",
           "aria-label": expanderTitle,
-          className: index["default"]("".concat(blockClass, "__row-expander"), "".concat(settings.carbon.prefix, "--btn"), "".concat(settings.carbon.prefix, "--btn--ghost"))
+          className: cx__default["default"]("".concat(blockClass, "__row-expander"), "".concat(settings.carbon.prefix, "--btn"), "".concat(settings.carbon.prefix, "--btn--ghost"))
         }, expanderButtonProps, {
           title: expanderTitle
         }), /*#__PURE__*/React__default["default"].createElement(icons.ChevronRight, {
-          className: index["default"]("".concat(blockClass, "__expander-icon"), _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__expander-icon--not-open"), !row.isExpanded), "".concat(blockClass, "__expander-icon--open"), row.isExpanded))
+          className: cx__default["default"]("".concat(blockClass, "__expander-icon"), _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__expander-icon--not-open"), !row.isExpanded), "".concat(blockClass, "__expander-icon--open"), row.isExpanded))
         }));
       },
       width: 48,

package/lib/components/Datagrid/useNestedRows.js

@@ -10,11 +10,15 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
-var index = require('../../node_modules/classnames/index.js');
+var cx = require('classnames');
 var settings = require('../../settings.js');
 var useNestedRowExpander = require('./useNestedRowExpander.js');
 var React = require('react');
 
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
+
 var blockClass = "".concat(settings.pkg.prefix, "--datagrid");
 var useNestedRows = function useNestedRows(hooks) {
   useNestedRowExpander["default"](hooks);
@@ -39,7 +43,7 @@ var useNestedRows = function useNestedRows(hooks) {
     var getRowProps = function getRowProps(props, _ref) {
       var row = _ref.row;
       return [props, {
-        className: index["default"](_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__carbon-nested-row"), row.depth > 0), "".concat(blockClass, "__carbon-row-expanded"), row.isExpanded))
+        className: cx__default["default"](_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__carbon-nested-row"), row.depth > 0), "".concat(blockClass, "__carbon-row-expanded"), row.isExpanded))
       }];
     };
     var getRowStyles = function getRowStyles(props, _ref2) {

package/lib/components/Datagrid/useRowExpander.js

@@ -13,12 +13,13 @@ var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelper
 var React = require('react');
 var icons = require('@carbon/react/icons');
 var settings = require('../../settings.js');
-var index = require('../../node_modules/classnames/index.js');
+var cx = require('classnames');
 var useFocusRowExpander = require('./useFocusRowExpander.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 blockClass = "".concat(settings.pkg.prefix, "--datagrid");
 var useRowExpander = function useRowExpander(hooks) {
@@ -57,7 +58,7 @@ var useRowExpander = function useRowExpander(hooks) {
         return row.canExpand && /*#__PURE__*/React__default["default"].createElement("button", _rollupPluginBabelHelpers["extends"]({
           type: "button",
           "aria-label": expanderTitle,
-          className: index["default"]("".concat(blockClass, "__row-expander"), "".concat(settings.carbon.prefix, "--btn"), "".concat(settings.carbon.prefix, "--btn--ghost"))
+          className: cx__default["default"]("".concat(blockClass, "__row-expander"), "".concat(settings.carbon.prefix, "--btn"), "".concat(settings.carbon.prefix, "--btn--ghost"))
         }, expanderButtonProps, {
           title: expanderTitle
         }), row.isExpanded ? /*#__PURE__*/React__default["default"].createElement(icons.ChevronUp, {

package/lib/components/Datagrid/useSelectAllToggle.js

@@ -11,7 +11,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
-var index = require('../../node_modules/classnames/index.js');
+var cx = require('classnames');
 var commonColumnIds = require('./common-column-ids.js');
 var DatagridSelectAllWithToggle = require('./Datagrid/DatagridSelectAllWithToggle.js');
 var settings = require('../../settings.js');
@@ -20,6 +20,7 @@ var useIsomorphicEffect = require('../../global/js/hooks/useIsomorphicEffect.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 blockClass = "".concat(settings.pkg.prefix, "--datagrid__select-all");
 var useSelectAllToggle = function useSelectAllToggle(hooks) {
@@ -69,7 +70,7 @@ var useAddClassNameToSelectRow = function useAddClassNameToSelectRow(hooks) {
     var isFirstColumnStickyLeft = ((_columns$ = columns[0]) === null || _columns$ === void 0 ? void 0 : _columns$.sticky) === 'left' && withStickyColumn;
     if (column.id === commonColumnIds.selectionColumnId && DatagridPagination) {
       return [props, {
-        className: index["default"]("".concat(blockClass, "-toggle-on"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "-sticky-left"), isFirstColumnStickyLeft && windowSize > 671))
+        className: cx__default["default"]("".concat(blockClass, "-toggle-on"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "-sticky-left"), isFirstColumnStickyLeft && windowSize > 671))
       }];
     }
     return [props];

package/lib/components/Datagrid/useSelectRows.js

@@ -11,7 +11,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
-var index = require('../../node_modules/classnames/index.js');
+var cx = require('classnames');
 var react = require('@carbon/react');
 var DatagridSelectAll = require('./Datagrid/DatagridSelectAll.js');
 var commonColumnIds = require('./common-column-ids.js');
@@ -21,6 +21,7 @@ var stateReducer = require('./Datagrid/addons/stateReducer.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 = ["onChange", "title"];
 var blockClass = "".concat(settings.pkg.prefix, "--datagrid");
@@ -69,7 +70,7 @@ var useHighlightSelection = function useHighlightSelection(hooks) {
     var _row$getToggleRowSele = row.getToggleRowSelectedProps(),
       checked = _row$getToggleRowSele.checked;
     return [props, {
-      className: index["default"](["".concat(blockClass, "__carbon-row"), _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(settings.carbon.prefix, "--data-table--selected"), checked), "".concat(blockClass, "__active-row"), checked)])
+      className: cx__default["default"](["".concat(blockClass, "__carbon-row"), _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(settings.carbon.prefix, "--data-table--selected"), checked), "".concat(blockClass, "__active-row"), checked)])
     }];
   };
   hooks.getRowProps.push(getRowProps);
@@ -126,13 +127,13 @@ var SelectRow = function SelectRow(datagridState) {
     selectProps = _rollupPluginBabelHelpers.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);
+  var rowId = "".concat(tableId, "-").concat(row.id, "-").concat(row.index);
   return /*#__PURE__*/React__default["default"].createElement(react.TableSelectRow, _rollupPluginBabelHelpers["extends"]({}, cellProps, selectProps, {
     radio: radio,
     onSelect: onSelectHandler,
     id: rowId,
     name: "".concat(rowId, "-name"),
-    className: index["default"]([checkboxClass, cellProps.className, _rollupPluginBabelHelpers.defineProperty({}, "".concat(checkboxClass, "-sticky-left"), isFirstColumnStickyLeft && windowSize > 671)]),
+    className: cx__default["default"]([checkboxClass, cellProps.className, _rollupPluginBabelHelpers.defineProperty({}, "".concat(checkboxClass, "-sticky-left"), isFirstColumnStickyLeft && windowSize > 671)]),
     ariaLabel: title,
     disabled: selectDisabled
   }));

package/lib/components/Datagrid/useSortableColumns.js

@@ -11,7 +11,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
-var index = require('../../node_modules/classnames/index.js');
+var cx = require('classnames');
 var settings = require('../../settings.js');
 var react = require('@carbon/react');
 var icons = require('@carbon/react/icons');
@@ -21,6 +21,7 @@ var DatagridSlug = require('./Datagrid/addons/Slug/DatagridSlug.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 blockClass = "".concat(settings.pkg.prefix, "--datagrid");
 var ordering = {
@@ -119,7 +120,7 @@ var useSortableColumns = function useSortableColumns(hooks) {
               slug: headerProp === null || headerProp === void 0 || (_headerProp$column = headerProp.column) === null || _headerProp$column === void 0 ? void 0 : _headerProp$column.slug
             }), icon(headerProp === null || headerProp === void 0 ? void 0 : headerProp.column, props));
           },
-          className: index["default"]("".concat(settings.carbon.prefix, "--table-sort ").concat(blockClass, "--table-sort"), _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "--table-sort--desc"), headerProp === null || headerProp === void 0 ? void 0 : headerProp.column.isSortedDesc), "".concat(blockClass, "--table-sort--asc"), (headerProp === null || headerProp === void 0 ? void 0 : headerProp.column.isSortedDesc) === false))
+          className: cx__default["default"]("".concat(settings.carbon.prefix, "--table-sort ").concat(blockClass, "--table-sort"), _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "--table-sort--desc"), headerProp === null || headerProp === void 0 ? void 0 : headerProp.column.isSortedDesc), "".concat(blockClass, "--table-sort--asc"), (headerProp === null || headerProp === void 0 ? void 0 : headerProp.column.isSortedDesc) === false))
         }, column.Header);
       };
       return _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, column), {}, {

package/lib/components/Datagrid/useStickyColumn.js

@@ -12,12 +12,13 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 var debounce = require('lodash/debounce');
-var index = require('../../node_modules/classnames/index.js');
+var cx = require('classnames');
 var settings = require('../../settings.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var debounce__default = /*#__PURE__*/_interopDefaultLegacy(debounce);
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
 var blockClass = "".concat(settings.pkg.prefix, "--datagrid");
 var styleClassPrefix = "".concat(blockClass, "__right-sticky-column");
@@ -149,7 +150,7 @@ var changeProps = function changeProps(elementName, headerCellRef, windowSize, p
   var column = data.column || data.cell.column;
   if (column.sticky === 'right') {
     return [props, _rollupPluginBabelHelpers.objectSpread2({
-      className: index["default"](_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(styleClassPrefix, "-").concat(elementName), true), "".concat(blockClass, "__resizableColumn"), false), "".concat(blockClass, "__sortableColumn"), false))
+      className: cx__default["default"](_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(styleClassPrefix, "-").concat(elementName), true), "".concat(blockClass, "__resizableColumn"), false), "".concat(blockClass, "__sortableColumn"), false))
     }, headerCellRef && {
       ref: headerCellRef
     })];
@@ -157,7 +158,7 @@ var changeProps = function changeProps(elementName, headerCellRef, windowSize, p
   if (column.sticky === 'left') {
     var _data$instance;
     return [props, _rollupPluginBabelHelpers.objectSpread2({
-      className: index["default"](_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(leftStickyStyleClassPrefix, "-").concat(elementName), windowSize > 671), "".concat(leftStickyStyleClassPrefix, "-").concat(elementName, "--with-extra-select-column"), (data === null || data === void 0 || (_data$instance = data.instance) === null || _data$instance === void 0 ? void 0 : _data$instance.withSelectRows) && windowSize > 671))
+      className: cx__default["default"](_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(leftStickyStyleClassPrefix, "-").concat(elementName), windowSize > 671), "".concat(leftStickyStyleClassPrefix, "-").concat(elementName, "--with-extra-select-column"), (data === null || data === void 0 || (_data$instance = data.instance) === null || _data$instance === void 0 ? void 0 : _data$instance.withSelectRows) && windowSize > 671))
     }, headerCellRef && {
       ref: headerCellRef
     })];

package/lib/components/DelimitedList/DelimitedList.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 devtools = require('../../global/js/utils/devtools.js');
 var settings = require('../../settings.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 = ["className", "delimiter", "items", "truncate"];
 var blockClass = "".concat(settings.pkg.prefix, "--delimited-list");
@@ -43,7 +44,7 @@ exports.DelimitedList = /*#__PURE__*/React__default["default"].forwardRef(functi
     truncate = _ref$truncate === void 0 ? defaults.truncate : _ref$truncate,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({}, rest, {
-    className: index["default"](blockClass, className, [truncate && "".concat(blockClass, "-truncate")]),
+    className: cx__default["default"](blockClass, className, [truncate && "".concat(blockClass, "-truncate")]),
     ref: ref
   }, devtools.getDevtoolsProps(componentName)), items.length > 0 ? items.join(delimiter) : '–');
 });
@@ -62,17 +63,17 @@ exports.DelimitedList.propTypes = {
   /**
    * Provide an optional class to be applied to the containing node.
    */
-  className: index$1["default"].string,
+  className: index["default"].string,
   /**
    * The character(s) used to separate the items.
    */
-  delimiter: index$1["default"].string,
+  delimiter: index["default"].string,
   /**
    * Array of items to be listed.
    */
-  items: index$1["default"].arrayOf(index$1["default"].any),
+  items: index["default"].arrayOf(index["default"].any),
   /**
    * Toggle the component's ability to truncate or not.
    */
-  truncate: index$1["default"].bool
+  truncate: index["default"].bool
 };