@carbon/ibm-products 2.0.0 → 2.0.1

package/lib/components/Datagrid/useRowExpander.js

@@ -0,0 +1,50 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _react = _interopRequireDefault(require("react"));
+var _icons = require("@carbon/react/icons");
+var _settings = require("../../settings");
+var _classnames = _interopRequireDefault(require("classnames"));
+/* eslint-disable react/prop-types */
+/*
+ * 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.
+ */
+
+var blockClass = "".concat(_settings.pkg.prefix, "--datagrid");
+var useRowExpander = function useRowExpander(hooks) {
+  var visibleColumns = function visibleColumns(columns) {
+    var expanderColumn = {
+      id: 'expander',
+      Cell: function Cell(_ref) {
+        var row = _ref.row;
+        return row.canExpand && /*#__PURE__*/_react.default.createElement("button", (0, _extends2.default)({
+          type: "button",
+          "aria-label": "Expand current row",
+          className: (0, _classnames.default)("".concat(blockClass, "__row-expander"), "".concat(_settings.carbon.prefix, "--btn"), "".concat(_settings.carbon.prefix, "--btn--ghost"))
+        }, row.getToggleRowExpandedProps()), row.isExpanded ? /*#__PURE__*/_react.default.createElement(_icons.ChevronUp, {
+          className: "".concat(blockClass, "__row-expander--icon")
+        }) : /*#__PURE__*/_react.default.createElement(_icons.ChevronDown, {
+          className: "".concat(blockClass, "__row-expander--icon")
+        }));
+      },
+      width: 48,
+      disableResizing: true,
+      disableSortBy: true,
+      Header: ''
+    };
+    return [expanderColumn].concat((0, _toConsumableArray2.default)(columns));
+  };
+  hooks.visibleColumns.push(visibleColumns);
+};
+var _default = useRowExpander;
+exports.default = _default;

package/lib/components/Datagrid/useRowIsMouseOver.js

@@ -0,0 +1,58 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = require("react");
+var _debounce = _interopRequireDefault(require("lodash/debounce"));
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } /*
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          * 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.
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          */
+var useRowIsMouseOver = function useRowIsMouseOver(hooks) {
+  var useInstance = function useInstance(instance) {
+    var _useState = (0, _react.useState)(),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      mouseOverRowIndex = _useState2[0],
+      setMouseOverRowIndex = _useState2[1];
+    var onMouseChange = useDebounce(function (datagridState) {
+      var row = datagridState.row;
+      setMouseOverRowIndex(row.index);
+    }, 100);
+    var getRowProps = function getRowProps(props, datagridState) {
+      var onMouseOver = function onMouseOver() {
+        return onMouseChange(datagridState);
+      };
+      return [props, {
+        onMouseOver: onMouseOver
+      }];
+    };
+    var rows = instance.rows;
+    var rowsWithMouseOver = rows.map(function (row) {
+      return _objectSpread(_objectSpread({}, row), {}, {
+        isMouseOver: row.index === mouseOverRowIndex
+      });
+    });
+    Object.assign(instance, {
+      rows: rowsWithMouseOver
+    });
+    hooks.getRowProps.push(getRowProps);
+  };
+  hooks.useInstance.push(useInstance);
+};
+var useDebounce = function useDebounce(fn, wait) {
+  return (
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    (0, _react.useCallback)((0, _debounce.default)(fn, wait), [])
+  );
+};
+var _default = useRowIsMouseOver;
+exports.default = _default;

package/lib/components/Datagrid/useRowRenderer.js

@@ -0,0 +1,34 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _DatagridRow = _interopRequireDefault(require("./Datagrid/DatagridRow"));
+/*
+ * 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.
+ */
+
+var useRowRenderer = function useRowRenderer(hooks) {
+  var useInstance = function useInstance(instance) {
+    var rows = instance.rows;
+    var addRowRenderer = function addRowRenderer(row) {
+      return Object.assign(row, {
+        RowRenderer: _DatagridRow.default,
+        subRows: (row.subRows || []).map(addRowRenderer)
+      });
+    };
+    var rowsWithRenderer = rows.map(addRowRenderer);
+    Object.assign(instance, {
+      rows: rowsWithRenderer
+    });
+  };
+  hooks.useInstance.push(useInstance);
+};
+var _default = useRowRenderer;
+exports.default = _default;

package/lib/components/Datagrid/useRowSize.js

@@ -0,0 +1,61 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = require("react");
+var _RowSize = require("./Datagrid/addons/RowSize");
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } /*
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          * Licensed Materials - Property of IBM
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          * 5724-Q36
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          * (c) Copyright IBM Corp. 2020, 2021
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          * US Government Users Restricted Rights - Use, duplication or disclosure
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          * restricted by GSA ADP Schedule Contract with IBM Corp.
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          */
+var useRowSize = function useRowSize(hooks) {
+  var _useState = (0, _react.useState)(''),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    internalRowSize = _useState2[0],
+    setRowSize = _useState2[1];
+  hooks.useInstance.push(function (instance) {
+    var rowSizeProps = instance.rowSizeProps,
+      rowSizes = instance.rowSizes,
+      rowSize = instance.rowSize,
+      onRowSizeChange = instance.onRowSizeChange;
+    var _ref = rowSizeProps || {},
+      labels = _ref.labels;
+    Object.assign(instance, {
+      rowSize: internalRowSize || rowSize,
+      rowSizeDropdownProps: _objectSpread(_objectSpread({
+        rowSizes: rowSizes
+      }, labels), {}, {
+        selectedOption: internalRowSize || rowSize,
+        onChange: function onChange(value) {
+          setRowSize(value);
+          if (typeof onRowSizeChange === 'function') {
+            onRowSizeChange(value);
+          }
+        }
+      }),
+      RowSizeDropdown: _RowSize.RowSizeDropdown
+    });
+  });
+  var getTableProps = function getTableProps(props, _ref2) {
+    var instance = _ref2.instance;
+    var rowSize = instance.rowSize;
+    if (!rowSize) {
+      return props;
+    }
+    return [props, {
+      size: rowSize
+    }];
+  };
+  hooks.getTableProps.push(getTableProps);
+};
+var _default = useRowSize;
+exports.default = _default;

package/lib/components/Datagrid/useSelectAllToggle.js

@@ -0,0 +1,102 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = _interopRequireWildcard(require("react"));
+var _classnames = _interopRequireDefault(require("classnames"));
+var _commonColumnIds = require("./common-column-ids");
+var _DatagridSelectAllWithToggle = _interopRequireDefault(require("./Datagrid/DatagridSelectAllWithToggle"));
+var _settings = require("../../settings");
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+/*
+ * 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.
+ */
+// @flow
+
+var blockClass = "".concat(_settings.pkg.prefix, "--datagrid");
+var useSelectAllToggle = function useSelectAllToggle(hooks) {
+  useSelectAllWithToggleComponent(hooks);
+  useAddClassNameToSelectRow(hooks);
+};
+var useSelectAllWithToggleComponent = function useSelectAllWithToggleComponent(hooks) {
+  var useInstance = function useInstance(instance) {
+    var headers = instance.headers,
+      DatagridPagination = instance.DatagridPagination;
+    var headersWithSelectAllToggle = headers.map(function (header) {
+      if (header.id === _commonColumnIds.selectionColumnId && DatagridPagination) {
+        Object.assign(header, {
+          Header: Header
+        });
+      }
+      return header;
+    });
+    Object.assign(instance, {
+      headers: headersWithSelectAllToggle
+    });
+  };
+  hooks.useInstance.push(useInstance);
+};
+var useAddClassNameToSelectRow = function useAddClassNameToSelectRow(hooks) {
+  var _useState = (0, _react.useState)(window.innerWidth),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    windowSize = _useState2[0],
+    setWindowSize = _useState2[1];
+  (0, _react.useLayoutEffect)(function () {
+    function updateSize() {
+      setWindowSize(window.innerWidth);
+    }
+    window.addEventListener('resize', updateSize);
+    return function () {
+      return window.removeEventListener('resize', updateSize);
+    };
+  }, []);
+  hooks.getCellProps.push(function (props, data) {
+    var _columns$;
+    var column = data.cell.column;
+    var _data$instance = data.instance,
+      DatagridPagination = _data$instance.DatagridPagination,
+      columns = _data$instance.columns,
+      withStickyColumn = _data$instance.withStickyColumn;
+    var isFirstColumnStickyLeft = ((_columns$ = columns[0]) === null || _columns$ === void 0 ? void 0 : _columns$.sticky) === 'left' && withStickyColumn;
+    if (column.id === _commonColumnIds.selectionColumnId && DatagridPagination) {
+      return [props, {
+        className: (0, _classnames.default)("".concat(blockClass, "__select-all-toggle-on"), (0, _defineProperty2.default)({}, "".concat(blockClass, "__select-all-sticky-left"), isFirstColumnStickyLeft && windowSize > 671))
+      }];
+    }
+    return [props];
+  });
+};
+var Header = function Header(gridState) {
+  var tableId = gridState.tableId,
+    isFetching = gridState.isFetching,
+    selectAllToggle = gridState.selectAllToggle,
+    getToggleAllPageRowsSelectedProps = gridState.getToggleAllPageRowsSelectedProps,
+    getToggleAllRowsSelectedProps = gridState.getToggleAllRowsSelectedProps,
+    isAllRowsSelected = gridState.isAllRowsSelected,
+    withStickyColumn = gridState.withStickyColumn,
+    columns = gridState.columns;
+  var props = {
+    tableId: tableId,
+    isFetching: isFetching,
+    selectAllToggle: selectAllToggle,
+    getToggleAllPageRowsSelectedProps: getToggleAllPageRowsSelectedProps,
+    getToggleAllRowsSelectedProps: getToggleAllRowsSelectedProps,
+    isAllRowsSelected: isAllRowsSelected,
+    withStickyColumn: withStickyColumn,
+    columns: columns
+  };
+  return /*#__PURE__*/_react.default.createElement(_DatagridSelectAllWithToggle.default, props);
+};
+var _default = useSelectAllToggle;
+exports.default = _default;

package/lib/components/Datagrid/useSelectRows.js

@@ -0,0 +1,126 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireWildcard(require("react"));
+var _classnames = _interopRequireDefault(require("classnames"));
+var _react2 = require("@carbon/react");
+var _DatagridSelectAll = require("./Datagrid/DatagridSelectAll");
+var _commonColumnIds = require("./common-column-ids");
+var _settings = require("../../settings");
+var _excluded = ["onChange"];
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } /*
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          * 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.
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          */ // @flow
+var blockClass = "".concat(_settings.pkg.prefix, "--datagrid");
+var useSelectRows = function useSelectRows(hooks) {
+  useHighlightSelection(hooks);
+  var useInstance = function useInstance(instance) {
+    var rows = instance.rows;
+    var rowsWithSelect = rows.map(function (row) {
+      return _objectSpread(_objectSpread({}, row), {}, {
+        isSelectable: true
+      });
+    });
+    Object.assign(instance, {
+      rows: rowsWithSelect
+    });
+  };
+  hooks.useInstance.push(useInstance);
+  hooks.useInstance.push(function (instance) {
+    Object.assign(instance, {
+      withSelectRows: true
+    });
+  });
+  hooks.visibleColumns.push(function (columns) {
+    return [{
+      id: _commonColumnIds.selectionColumnId,
+      Header: function Header(gridState) {
+        return /*#__PURE__*/_react.default.createElement(_DatagridSelectAll.SelectAll, gridState);
+      },
+      Cell: function Cell(gridState) {
+        return /*#__PURE__*/_react.default.createElement(SelectRow, gridState);
+      }
+    }].concat((0, _toConsumableArray2.default)(columns));
+  });
+};
+var useHighlightSelection = function useHighlightSelection(hooks) {
+  var getRowProps = function getRowProps(props, _ref) {
+    var row = _ref.row;
+    return [props, {
+      className: (0, _classnames.default)("".concat(blockClass, "__carbon-row"), row.getToggleRowSelectedProps().checked ? "".concat(_settings.carbon.prefix, "--data-table--selected ").concat(blockClass, "__active-row") : '')
+    }];
+  };
+  hooks.getRowProps.push(getRowProps);
+};
+var SelectRow = function SelectRow(datagridState) {
+  var _columns$;
+  var _datagridState$isFetc = datagridState.isFetching,
+    isFetching = _datagridState$isFetc === void 0 ? false : _datagridState$isFetc,
+    tableId = datagridState.tableId,
+    row = datagridState.row,
+    cell = datagridState.cell,
+    radio = datagridState.radio,
+    toggleAllRowsSelected = datagridState.toggleAllRowsSelected,
+    onRadioSelect = datagridState.onRadioSelect,
+    onRowSelect = datagridState.onRowSelect,
+    columns = datagridState.columns,
+    withStickyColumn = datagridState.withStickyColumn;
+  var _useState = (0, _react.useState)(window.innerWidth),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    windowSize = _useState2[0],
+    setWindowSize = _useState2[1];
+  (0, _react.useLayoutEffect)(function () {
+    function updateSize() {
+      setWindowSize(window.innerWidth);
+    }
+    window.addEventListener('resize', updateSize);
+    return function () {
+      return window.removeEventListener('resize', updateSize);
+    };
+  }, []);
+  var selectDisabled = isFetching || row.getRowProps().selectDisabled;
+  var _row$getToggleRowSele = row.getToggleRowSelectedProps(),
+    onChange = _row$getToggleRowSele.onChange,
+    selectProps = (0, _objectWithoutProperties2.default)(_row$getToggleRowSele, _excluded);
+  var cellProps = cell.getCellProps();
+  var isFirstColumnStickyLeft = ((_columns$ = columns[0]) === null || _columns$ === void 0 ? void 0 : _columns$.sticky) === 'left' && withStickyColumn;
+  return /*#__PURE__*/_react.default.createElement(_react2.TableSelectRow, (0, _extends2.default)({}, 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 ? void 0 : onRowSelect(row, e);
+    },
+    id: "".concat(tableId, "-").concat(row.index),
+    name: "".concat(tableId, "-").concat(row.index, "-name"),
+    className: (0, _classnames.default)("".concat(blockClass, "__checkbox-cell"), cellProps.className, (0, _defineProperty2.default)({}, "".concat(blockClass, "__checkbox-cell-sticky-left"), isFirstColumnStickyLeft && windowSize > 671)),
+    ariaLabel: "".concat(tableId, "-row-").concat(row.index) // TODO: aria label should be i18n'ed
+    ,
+    disabled: selectDisabled
+  }));
+};
+var _default = useSelectRows;
+exports.default = _default;

package/lib/components/Datagrid/useSkeletonRows.js

@@ -0,0 +1,35 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _toConsumableArray2 = _interopRequireDefault(require("@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.
+ */
+var useSkeletons = function useSkeletons(hooks) {
+  var useInstance = function useInstance(instance) {
+    var isFetching = instance.isFetching,
+      rows = instance.rows;
+    var skeletonRow = function skeletonRow(id) {
+      return {
+        isSkeleton: true,
+        values: 'skeleton',
+        id: id
+      };
+    };
+    var rowsWithSkeletons = [].concat((0, _toConsumableArray2.default)(rows), [skeletonRow('skeleton-row-1'), skeletonRow('skeleton-row-2'), skeletonRow('skeleton-row-3')]);
+    Object.assign(instance, {
+      rows: isFetching ? rowsWithSkeletons : rows
+    });
+  };
+  hooks.useInstance.push(useInstance);
+};
+var _default = useSkeletons;
+exports.default = _default;

package/lib/components/Datagrid/useSortableColumns.js

@@ -0,0 +1,121 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _react = _interopRequireDefault(require("react"));
+var _classnames = _interopRequireDefault(require("classnames"));
+var _settings = require("../../settings");
+var _react2 = require("@carbon/react");
+var _icons = require("@carbon/react/icons");
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } /**
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          * 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 blockClass = "".concat(_settings.pkg.prefix, "--datagrid");
+var ordering = {
+  ASC: 'ASC',
+  DESC: 'DESC',
+  NONE: 'NONE'
+};
+var useSortableColumns = function useSortableColumns(hooks) {
+  var sortableVisibleColumns = function sortableVisibleColumns(visibleColumns, _ref) {
+    var _instance$customizeCo;
+    var instance = _ref.instance;
+    var onSort = instance.onSort;
+    var onSortClick = function onSortClick(column) {
+      var key = column.id;
+      var sortDesc = column.isSortedDesc;
+      var _getNewSortOrder = getNewSortOrder(sortDesc),
+        newSortDesc = _getNewSortOrder.newSortDesc,
+        newOrder = _getNewSortOrder.newOrder;
+      if (onSort) {
+        onSort(key, newOrder);
+      }
+      instance.toggleSortBy(key, newSortDesc, false);
+    };
+    var sortableColumns = visibleColumns.map(function (column) {
+      var icon = function icon(col, props) {
+        if (col !== null && col !== void 0 && col.isSorted) {
+          switch (col.isSortedDesc) {
+            case false:
+              return /*#__PURE__*/_react.default.createElement(_icons.ArrowUp, (0, _extends2.default)({
+                size: 16
+              }, props, {
+                className: "".concat(blockClass, "__sortable-icon ").concat(_settings.carbon.prefix, "--btn__icon")
+              }));
+            case true:
+              return /*#__PURE__*/_react.default.createElement(_icons.ArrowDown, (0, _extends2.default)({
+                size: 16
+              }, props, {
+                className: "".concat(blockClass, "__sortable-icon ").concat(_settings.carbon.prefix, "--btn__icon")
+              }));
+            default:
+              return /*#__PURE__*/_react.default.createElement(_icons.ArrowsVertical, (0, _extends2.default)({
+                size: 16
+              }, props, {
+                className: "".concat(blockClass, "__sortable-icon ").concat(_settings.carbon.prefix, "--btn__icon")
+              }));
+          }
+        }
+        return /*#__PURE__*/_react.default.createElement(_icons.ArrowsVertical, (0, _extends2.default)({
+          size: 16
+        }, props, {
+          className: "".concat(blockClass, "__sortable-icon ").concat(_settings.carbon.prefix, "--btn__icon")
+        }));
+      };
+      var Header = function Header(headerProp) {
+        var _cx;
+        return column.disableSortBy === true ? column.Header : /*#__PURE__*/_react.default.createElement(_react2.Button, {
+          onClick: function onClick() {
+            return onSortClick(headerProp === null || headerProp === void 0 ? void 0 : headerProp.column);
+          },
+          kind: "ghost",
+          renderIcon: function renderIcon(props) {
+            return icon(headerProp === null || headerProp === void 0 ? void 0 : headerProp.column, props);
+          },
+          className: (0, _classnames.default)("".concat(_settings.carbon.prefix, "--table-sort ").concat(blockClass, "--table-sort"), (_cx = {}, (0, _defineProperty2.default)(_cx, "".concat(blockClass, "--table-sort--desc"), headerProp === null || headerProp === void 0 ? void 0 : headerProp.column.isSortedDesc), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "--table-sort--asc"), (headerProp === null || headerProp === void 0 ? void 0 : headerProp.column.isSortedDesc) === false), _cx))
+        }, column.Header);
+      };
+      return _objectSpread(_objectSpread({}, column), {}, {
+        Header: Header,
+        minWidth: column.disableSortBy === true ? 0 : 90
+      });
+    });
+    return (_instance$customizeCo = instance.customizeColumnsProps) !== null && _instance$customizeCo !== void 0 && _instance$customizeCo.isTearsheetOpen ? visibleColumns : (0, _toConsumableArray2.default)(sortableColumns);
+  };
+  var sortInstanceProps = function sortInstanceProps(instance) {
+    var onSort = instance.onSort;
+    Object.assign(instance, {
+      manualSortBy: !!onSort,
+      isTableSortable: true
+    });
+  };
+  var getNewSortOrder = function getNewSortOrder(sortOrder) {
+    var order = {
+      newSortDesc: undefined,
+      newOrder: ordering.NONE
+    };
+    if (sortOrder === false) {
+      order.newOrder = ordering.DESC;
+      order.newSortDesc = true;
+    }
+    if (sortOrder === undefined) {
+      order.newOrder = ordering.ASC;
+      order.newSortDesc = false;
+    }
+    return order;
+  };
+  hooks.visibleColumns.push(sortableVisibleColumns);
+  hooks.useInstance.push(sortInstanceProps);
+};
+var _default = useSortableColumns;
+exports.default = _default;