@carbon/ibm-products 1.13.0 → 1.16.0

package/lib/components/Datagrid/useCustomizeColumns.js

@@ -0,0 +1,55 @@
+"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 _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var React = _interopRequireWildcard(require("react"));
+
+var _CustomizeColumns = require("./Datagrid/addons/CustomizeColumns");
+
+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; }
+
+var useCustomizeColumns = function useCustomizeColumns(hooks) {
+  var _React$useState = React.useState(false),
+      _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+      isModalOpen = _React$useState2[0],
+      setIsModalOpen = _React$useState2[1];
+
+  hooks.useInstance.push(function (instance) {
+    var customizeColumnsProps = instance.customizeColumnsProps;
+    Object.assign(instance, {
+      customizeColumnsProps: _objectSpread(_objectSpread({}, customizeColumnsProps), {}, {
+        isModalOpen: isModalOpen,
+        setIsModalOpen: setIsModalOpen
+      }),
+      CustomizeColumnsButton: function CustomizeColumnsButton(props) {
+        return /*#__PURE__*/React.createElement(_CustomizeColumns.ToggleButtonWrapper, (0, _extends2.default)({
+          isModalOpen: isModalOpen,
+          setIsModalOpen: setIsModalOpen
+        }, props));
+      },
+      CustomizeColumnsModal: _CustomizeColumns.CustomizeColumnsModalWrapper
+    });
+  });
+};
+
+var _default = useCustomizeColumns;
+exports.default = _default;

package/lib/components/Datagrid/useDatagrid.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 _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+
+var _react = require("react");
+
+var _reactTable = require("react-table");
+
+var _uniqueId = _interopRequireDefault(require("lodash/uniqueId"));
+
+var _useSkeletonRows = _interopRequireDefault(require("./useSkeletonRows"));
+
+var _useDefaultStringRenderer = _interopRequireDefault(require("./useDefaultStringRenderer"));
+
+var _useRowRenderer = _interopRequireDefault(require("./useRowRenderer"));
+
+var _useRowSize = _interopRequireDefault(require("./useRowSize"));
+
+var _DatagridHeaderRow = _interopRequireDefault(require("./Datagrid/DatagridHeaderRow"));
+
+var _useFlexResize = _interopRequireDefault(require("./useFlexResize"));
+
+var _useFloatingScroll = _interopRequireDefault(require("./useFloatingScroll"));
+
+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; }
+
+var useDatagrid = function useDatagrid(params) {
+  var defaultPlugins = [_reactTable.useFlexLayout, _DatagridHeaderRow.default, _useSkeletonRows.default, _reactTable.useResizeColumns, _useRowRenderer.default, _useDefaultStringRenderer.default, _useRowSize.default, _reactTable.useFilters, _reactTable.useGlobalFilter, _reactTable.useSortBy, _reactTable.useExpanded];
+  var defaultEndPlugins = [_reactTable.usePagination, _reactTable.useRowSelect, _useFlexResize.default, _useFloatingScroll.default];
+  var clientEndPlugins = params.endPlugins || [];
+  var tableId = (0, _react.useMemo)(function () {
+    return (0, _uniqueId.default)('datagrid-table-id');
+  }, []);
+
+  for (var _len = arguments.length, plugins = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+    plugins[_key - 1] = arguments[_key];
+  }
+
+  var tableState = _reactTable.useTable.apply(void 0, [_objectSpread({
+    tableId: tableId
+  }, params)].concat(defaultPlugins, plugins, defaultEndPlugins, (0, _toConsumableArray2.default)(clientEndPlugins)));
+
+  return tableState;
+};
+
+var _default = useDatagrid;
+exports.default = _default;

package/lib/components/Datagrid/useDefaultStringRenderer.js

@@ -0,0 +1,54 @@
+"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 _react = _interopRequireDefault(require("react"));
+
+var _settings = require("../../settings");
+
+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; }
+
+var blockClass = "".concat(_settings.pkg.prefix, "--datagrid");
+
+var useDefaultStringRenderer = function useDefaultStringRenderer(hooks) {
+  var StringRenderer = function StringRenderer(tableProps) {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: "".concat(blockClass, "__defaultStringRenderer"),
+      title: tableProps.value
+    }, tableProps.value);
+  };
+
+  var HeaderRenderer = function HeaderRenderer(header) {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: "".concat(blockClass, "__defaultStringRenderer"),
+      title: typeof header === 'string' ? header : ''
+    }, header);
+  };
+
+  var visibleColumns = function visibleColumns(columns) {
+    var columnsWithDefaultCells = columns.map(function (column) {
+      return _objectSpread(_objectSpread({
+        Cell: StringRenderer
+      }, column), {}, {
+        Header: column.HeaderRenderer || HeaderRenderer(column.Header)
+      });
+    });
+    return (0, _toConsumableArray2.default)(columnsWithDefaultCells);
+  };
+
+  hooks.visibleColumns.push(visibleColumns);
+};
+
+var _default = useDefaultStringRenderer;
+exports.default = _default;

package/lib/components/Datagrid/useDisableSelectRows.js

@@ -0,0 +1,92 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+/*
+ * 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 useDisableSelectRows = function useDisableSelectRows(hooks) {
+  updateSelectAll(hooks);
+  updatePageSelectAll(hooks);
+
+  var getRowProps = function getRowProps(props, _ref) {
+    var row = _ref.row,
+        instance = _ref.instance;
+    return [props, {
+      selectDisabled: instance.shouldDisableSelectRow && instance.shouldDisableSelectRow(row)
+    }];
+  };
+
+  hooks.getRowProps.push(getRowProps);
+};
+
+var updateSelectAll = function updateSelectAll(hooks) {
+  var getToggleAllRowsSelectedProps = function getToggleAllRowsSelectedProps(props, _ref2) {
+    var instance = _ref2.instance;
+    var selectableRows = instance.rows.filter(function (row) {
+      return !(instance.shouldDisableSelectRow && instance.shouldDisableSelectRow(row));
+    });
+    var isAllRowsSelected = selectableRows.length > 0 && selectableRows.every(function (_ref3) {
+      var id = _ref3.id;
+      return instance.state.selectedRowIds[id];
+    });
+    return [props, {
+      onChange: function onChange(e) {
+        selectableRows.forEach(function (row) {
+          return row.toggleRowSelected(e.target.checked);
+        });
+      },
+      style: {
+        cursor: 'pointer'
+      },
+      checked: isAllRowsSelected,
+      disabled: instance.disableSelectAll,
+      title: 'Toggle All Rows Selected',
+      indeterminate: Boolean(!isAllRowsSelected && Object.keys(instance.state.selectedRowIds).length)
+    }];
+  };
+
+  hooks.getToggleAllRowsSelectedProps.push(getToggleAllRowsSelectedProps);
+};
+
+var updatePageSelectAll = function updatePageSelectAll(hooks) {
+  var getToggleAllPageRowsSelectedProps = function getToggleAllPageRowsSelectedProps(props, _ref4) {
+    var instance = _ref4.instance;
+    var selectableRows = instance.page.filter(function (row) {
+      return !(instance.shouldDisableSelectRow && instance.shouldDisableSelectRow(row));
+    });
+    var isAllRowsSelected = selectableRows.length > 0 && selectableRows.every(function (_ref5) {
+      var id = _ref5.id;
+      return instance.state.selectedRowIds[id];
+    });
+    return [props, {
+      onChange: function onChange(e) {
+        selectableRows.forEach(function (row) {
+          return row.toggleRowSelected(e.target.checked);
+        });
+      },
+      style: {
+        cursor: 'pointer'
+      },
+      checked: isAllRowsSelected,
+      disabled: instance.disableSelectAll,
+      title: 'Toggle All Rows Selected',
+      indeterminate: Boolean(!isAllRowsSelected && instance.page.some(function (_ref6) {
+        var id = _ref6.id;
+        return instance.state.selectedRowIds[id];
+      }))
+    }];
+  };
+
+  hooks.getToggleAllPageRowsSelectedProps.push(getToggleAllPageRowsSelectedProps);
+};
+
+var _default = useDisableSelectRows;
+exports.default = _default;

package/lib/components/Datagrid/useExpandedRow.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 _DatagridExpandedRow = _interopRequireDefault(require("./Datagrid/DatagridExpandedRow"));
+
+var _useRowExpander = _interopRequireDefault(require("./useRowExpander"));
+
+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; }
+
+var useExpandedRow = function useExpandedRow(hooks) {
+  (0, _useRowExpander.default)(hooks);
+
+  var useInstance = function useInstance(instance) {
+    var rows = instance.rows,
+        expandedContentHeight = instance.expandedContentHeight,
+        ExpandedRowContentComponent = instance.ExpandedRowContentComponent;
+
+    var _useState = (0, _react.useState)({}),
+        _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+        expandedRowsHeight = _useState2[0],
+        setExpandedRowsHeight = _useState2[1];
+
+    var setExpandedRowHeight = function setExpandedRowHeight(rowIndex, height) {
+      return setExpandedRowsHeight(_objectSpread(_objectSpread({}, expandedRowsHeight), {}, (0, _defineProperty2.default)({}, rowIndex, height)));
+    };
+
+    var rowsWithExpand = rows.map(function (row) {
+      return _objectSpread(_objectSpread({}, row), {}, {
+        canExpand: row.original && !row.original.notExpandable,
+        expandedContentHeight: expandedRowsHeight[row.index] || expandedContentHeight,
+        RowRenderer: (0, _DatagridExpandedRow.default)(row.RowRenderer, ExpandedRowContentComponent)
+      });
+    });
+    Object.assign(instance, {
+      rows: rowsWithExpand,
+      setExpandedRowHeight: setExpandedRowHeight
+    });
+  };
+
+  hooks.useInstance.push(useInstance);
+};
+
+var _default = useExpandedRow;
+exports.default = _default;

package/lib/components/Datagrid/useFlexResize.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 _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 useFlexResize = function useFlexResize(hooks) {
+  var spacerColumn = {
+    id: 'spacer',
+    width: 0,
+    disableSortBy: true,
+    disableResizing: true
+  };
+  hooks.visibleColumns.push(function (columns) {
+    return [].concat((0, _toConsumableArray2.default)(columns), [spacerColumn]);
+  });
+
+  var changeProps = function changeProps(props, data) {
+    var column = data.column;
+
+    if (!column && data.cell) {
+      column = data.cell.column;
+    }
+
+    if (column.id === spacerColumn.id) {
+      return [props, {
+        style: {
+          flex: '1 1 0'
+        }
+      }];
+    }
+
+    return [props, {
+      style: {
+        flex: '0 0 auto'
+      }
+    }];
+  };
+
+  hooks.getHeaderProps.push(function (props, data) {
+    return changeProps(props, data);
+  });
+  hooks.getCellProps.push(function (props, data) {
+    return changeProps(props, data);
+  });
+};
+
+var _default = useFlexResize;
+exports.default = _default;

package/lib/components/Datagrid/useFloatingScroll.js

@@ -0,0 +1,101 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = require("react");
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _settings = require("../../settings");
+
+/*
+ * 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.
+ */
+var blockClass = "".concat(_settings.pkg.prefix, "--datagrid");
+
+var useFloatingScroll = function useFloatingScroll(hooks) {
+  var useInstance = function useInstance(instance) {
+    var tableId = instance.tableId,
+        withVirtualScroll = instance.withVirtualScroll,
+        ExpandedRowContentComponent = instance.ExpandedRowContentComponent;
+    (0, _react.useEffect)(function () {
+      // Floating scroll doesn't work with expanded rows and virtual scroll
+      if (withVirtualScroll || ExpandedRowContentComponent) {
+        return;
+      }
+
+      var datagrid = document.getElementById(tableId); // eslint-disable-next-line no-unused-expressions
+
+      datagrid === null || datagrid === void 0 ? void 0 : datagrid.classList.add("".concat(blockClass, "__sticky"));
+    }, [ExpandedRowContentComponent, tableId, withVirtualScroll]);
+  };
+
+  var useAddStickyClass = function useAddStickyClass(instance) {
+    var withVirtualScroll = instance.withVirtualScroll,
+        ExpandedRowContentComponent = instance.ExpandedRowContentComponent; // Floating scroll doesn't work with expanded rows and virtual scroll
+
+    if (withVirtualScroll || ExpandedRowContentComponent) {
+      return;
+    }
+
+    var addStickyClass = function addStickyClass(props) {
+      return [props, {
+        className: (0, _classnames.default)(props.className, "".concat(blockClass, "__sticky"))
+      }];
+    };
+
+    hooks.getTableProps.push(addStickyClass);
+    hooks.getTableBodyProps.push(addStickyClass);
+    hooks.getHeaderGroupProps.push(addStickyClass);
+  };
+
+  var useAddScrollListener = function useAddScrollListener(instance) {
+    var withVirtualScroll = instance.withVirtualScroll,
+        ExpandedRowContentComponent = instance.ExpandedRowContentComponent,
+        tableId = instance.tableId; // Floating scroll doesn't work with expanded rows and virtual scroll
+
+    if (withVirtualScroll || ExpandedRowContentComponent) {
+      return;
+    }
+
+    var memoHead;
+
+    var addOnScroll = function addOnScroll(props) {
+      return [props, {
+        onScroll: function onScroll(e) {
+          var simpleThead;
+
+          if (memoHead) {
+            simpleThead = memoHead;
+          } else {
+            var datagrid = document.getElementById(tableId);
+            simpleThead = datagrid === null || datagrid === void 0 ? void 0 : datagrid.querySelector(".".concat(blockClass, "__table-simple thead > div"));
+            memoHead = simpleThead;
+          }
+
+          if (simpleThead) {
+            simpleThead.scrollLeft = e.target.scrollLeft;
+          }
+        }
+      }];
+    };
+
+    hooks.getTableBodyProps.push(addOnScroll);
+  };
+
+  hooks.useInstance.push(useAddStickyClass);
+  hooks.useInstance.push(useAddScrollListener);
+  hooks.useInstance.push(useInstance);
+};
+
+var _default = useFloatingScroll;
+exports.default = _default;

package/lib/components/Datagrid/useInfiniteScroll.js

@@ -0,0 +1,67 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = require("react");
+
+var _debounce = _interopRequireDefault(require("lodash/debounce"));
+
+var _useParentDimensions = _interopRequireDefault(require("./useParentDimensions"));
+
+var _useResizeTable = _interopRequireDefault(require("./useResizeTable"));
+
+/*
+ * 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 useInfiniteScroll = function useInfiniteScroll(hooks) {
+  (0, _useParentDimensions.default)(hooks);
+  (0, _useResizeTable.default)(hooks);
+
+  var useInstance = function useInstance(instance) {
+    var isFetching = instance.isFetching,
+        tableHeight = instance.tableHeight,
+        innerListRef = instance.innerListRef,
+        fetchMoreData = instance.fetchMoreData;
+    var loadMoreThreshold = 200;
+
+    var emptyFetchData = function emptyFetchData() {}; // eslint-disable-next-line react-hooks/exhaustive-deps
+
+
+    var fetchMore = (0, _react.useCallback)((0, _debounce.default)(fetchMoreData || emptyFetchData, 3000, {
+      leading: true,
+      trailing: false
+    }), [fetchMoreData]);
+
+    var onScroll = function onScroll(_ref) {
+      var scrollDirection = _ref.scrollDirection,
+          scrollOffset = _ref.scrollOffset;
+
+      if (innerListRef && innerListRef.current) {
+        if (!isFetching && scrollDirection === 'forward' && scrollOffset + tableHeight >= innerListRef.current.clientHeight - loadMoreThreshold) {
+          if (fetchMoreData) {
+            fetchMore();
+          }
+        }
+      }
+    };
+
+    Object.assign(instance, {
+      onScroll: onScroll,
+      withVirtualScroll: true
+    });
+  };
+
+  hooks.useInstance.push(useInstance);
+};
+
+var _default = useInfiniteScroll;
+exports.default = _default;

package/lib/components/Datagrid/useNestedRows.js

@@ -0,0 +1,65 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _useRowExpander = _interopRequireDefault(require("./useRowExpander"));
+
+var _settings = require("../../settings");
+
+/*
+ * 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 useNestedRows = function useNestedRows(hooks) {
+  (0, _useRowExpander.default)(hooks);
+  var marginLeft = 24;
+
+  var getRowProps = function getRowProps(props, _ref) {
+    var row = _ref.row;
+    return [props, {
+      className: row.depth > 0 ? "".concat(blockClass, "__carbon-nested-row") : ''
+    }];
+  };
+
+  var getRowStyles = function getRowStyles(props, _ref2) {
+    var row = _ref2.row;
+    return [props, {
+      style: {
+        marginLeft: "".concat(row.depth > 0 ? marginLeft : 0, "px"),
+        paddingLeft: "".concat(row.depth > 1 ? marginLeft * (row.depth - 1) + marginLeft : row.depth === 1 ? marginLeft : 0, "px"),
+        maxWidth: "calc(100% - ".concat(marginLeft * row.depth, "px)")
+      }
+    }];
+  };
+
+  var getCellProps = function getCellProps(props, _ref3) {
+    var cell = _ref3.cell,
+        instance = _ref3.instance;
+    // reduce the "first cell"s width to compensate added (left) margin
+    var isFirstCell = instance.columns.findIndex(function (c) {
+      return c.id === cell.column.id;
+    }) === 0;
+    return [props, {
+      style: {
+        marginRight: "".concat(isFirstCell && cell.row.depth > 0 ? "-".concat(marginLeft * (cell.row.depth + 1), "px") : '')
+      }
+    }];
+  };
+
+  hooks.getRowProps.push(getRowProps);
+  hooks.getRowProps.push(getRowStyles);
+  hooks.getCellProps.push(getCellProps);
+};
+
+var _default = useNestedRows;
+exports.default = _default;

package/lib/components/Datagrid/useOnRowClick.js

@@ -0,0 +1,45 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+/*
+ * 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 useOnRowClick = function useOnRowClick(hooks) {
+  var useInstance = function useInstance(instance) {
+    var onRowClick = instance.onRowClick;
+
+    var getRowProps = function getRowProps(props, datagridState) {
+      var isFetching = datagridState.isFetching,
+          row = datagridState.row;
+
+      var onClick = function onClick() {
+        if (!isFetching && onRowClick) {
+          onRowClick(row);
+        }
+      };
+
+      return [props, {
+        onClick: onClick
+      }, {
+        style: {
+          cursor: 'pointer'
+        }
+      }];
+    };
+
+    hooks.getRowProps.push(getRowProps);
+  };
+
+  hooks.useInstance.push(useInstance);
+};
+
+var _default = useOnRowClick;
+exports.default = _default;