@elliemae/ds-datagrids 2.3.0-alpha.9 → 2.3.0-next.3

package/cjs/plugins/filterable/helper.js

@@ -0,0 +1,120 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.map.js');
+require('core-js/modules/esnext.iterator.map.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
+require('core-js/modules/web.dom-collections.iterator.js');
+require('core-js/modules/esnext.async-iterator.reduce.js');
+require('core-js/modules/esnext.iterator.reduce.js');
+var dsUtilities = require('@elliemae/ds-utilities');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
+
+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) { _defineProperty__default["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; }
+const getFilterLabel = (column, value) => column.filterLabels ? column.filterLabels[value] || value : value;
+const getFilterLabels = (column, rows) => dsUtilities.uniqBy(rows, dsUtilities.property(column.searchBy || column.property)).map(row => {
+  const value = dsUtilities.get(row, column.searchBy || column.property);
+  if (value === undefined) return {};
+  const rowColumnValue = String(dsUtilities.get(row, column.searchBy || column.property));
+
+  if (dsUtilities.isFunction(column.valueTransformation)) {
+    const nextValue = column.valueTransformation(rowColumnValue);
+    return {
+      id: nextValue,
+      label: nextValue
+    };
+  }
+
+  const label = getFilterLabel(column, rowColumnValue);
+  return {
+    id: rowColumnValue || label,
+    label
+  };
+}).filter(row => row.id).filter(row => {
+  if (row.id.startsWith) return !row.id.startsWith('grouped-by');
+  return true;
+});
+const getFilterLabelsGroup = (column, rows) => {
+  let flat = [];
+  rows.forEach(r => {
+    if (r.children) {
+      flat = [...flat, ...r.children];
+    }
+  });
+  return getFilterLabels(column, flat);
+};
+function getFilterValue(filter, column) {
+  const {
+    value
+  } = filter;
+  if (!column) return value;
+  const {
+    filterOptions,
+    filterLabels
+  } = column;
+
+  if (filterOptions) {
+    const foundOption = column.filterOptions.filter(option => option.id === value)[0];
+    if (foundOption) return foundOption.label;
+    return value;
+  }
+
+  if (filterLabels) {
+    return filterLabels[value];
+  }
+
+  return value;
+}
+function buildFilterArray(newFilter, filters) {
+  // if (newFilter.type && newFilter.type === 'date') return [...filters.slice(1), newFilter]
+  return dsUtilities.uniqBy([...filters, newFilter], v => [v.group, v.value].join());
+}
+const groupFilters = filters => filters.filter(filter => !filter.fixed);
+
+function parseFilterToRule(filter) {
+  return _objectSpread(_objectSpread({}, filter), {}, {
+    value: filter.filterParams || filter.value,
+    field: filter.group
+  });
+}
+
+function parseFiltersToQuery(filters) {
+  const groupedFilters = dsUtilities.groupBy(groupFilters(filters), filter => filter.group);
+  return Object.keys(groupedFilters).reduce((queryResult, field) => {
+    const filter = groupedFilters[field];
+
+    if (Array.isArray(filter) && filter.length > 1) {
+      // create query group with 'OR' condition
+      queryResult.rules.push({
+        condition: 'OR',
+        rules: filter.map(parseFilterToRule)
+      });
+    } else {
+      queryResult.rules.push(parseFilterToRule(filter[0]));
+    }
+
+    return queryResult;
+  }, {
+    condition: 'AND',
+    rules: []
+  });
+}
+
+exports.buildFilterArray = buildFilterArray;
+exports.getFilterLabel = getFilterLabel;
+exports.getFilterLabels = getFilterLabels;
+exports.getFilterLabelsGroup = getFilterLabelsGroup;
+exports.getFilterValue = getFilterValue;
+exports.groupFilters = groupFilters;
+exports.parseFiltersToQuery = parseFiltersToQuery;

package/cjs/plugins/filterable/index.js

@@ -0,0 +1,9 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var FilterablePlugin = require('./FilterablePlugin.js');
+
+
+
+exports.FilterablePlugin = FilterablePlugin.FilterablePlugin;

package/cjs/plugins/filterable/useFilterableState.js

@@ -0,0 +1,117 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+require('core-js/modules/web.dom-collections.iterator.js');
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
+var React = require('react');
+var uuid = require('uuid');
+var helper = require('./helper.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
+
+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) { _defineProperty__default["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; }
+
+const noop = () => null;
+
+function useFilterableState(grid) {
+  const {
+    filters: filtersProp,
+    onAddFilter = noop,
+    onRemoveFilter = noop,
+    onRemoveAllFilters = noop,
+    onFiltersChange = noop
+  } = grid.props;
+  const [filters, setFilters] = React.useState(filtersProp || []);
+  React.useEffect(() => {
+    if (filtersProp && filtersProp !== filters) {
+      setFilters(filtersProp);
+    }
+  }, [filtersProp]);
+  const queryFromFilters = React.useMemo(() => helper.parseFiltersToQuery(filters || []), [filters]);
+
+  const handleFiltersChange = nextFilters => {
+    const {
+      refs: {
+        body
+      }
+    } = grid.getInstance();
+    body.current.scrollTop = 0;
+    setFilters(nextFilters);
+    grid.observeRows(rows => onFiltersChange(nextFilters, queryFromFilters, rows));
+  };
+
+  const addFilter = (filter, column) => {
+    let hasBeenCalled = false;
+
+    const trimmedFilter = _objectSpread(_objectSpread({}, filter), {}, {
+      value: String(filter.value).trim()
+    });
+    /* eslint-disable indent */
+
+
+    const parsedFilter = !filter.group ? _objectSpread(_objectSpread({}, trimmedFilter), {}, {
+      value: String(filter.value).trim(),
+      group: 'all',
+      label: 'All',
+      id: uuid.v4()
+    }) : _objectSpread(_objectSpread({}, trimmedFilter), {}, {
+      value: String(filter.value).trim(),
+      id: uuid.v4(),
+      label: column && column.filterLabel || trimmedFilter.label,
+      originalProperty: column.originalProperty || column.property,
+      customValue: helper.getFilterValue(trimmedFilter, column)
+    });
+    /* eslint-enable indent */
+
+    setFilters(prevFilters => {
+      // This was setted for an issue that was recalling this function on the handleFiltersChange
+      if (hasBeenCalled) {
+        return;
+      }
+
+      hasBeenCalled = true;
+      const nextFilters = helper.buildFilterArray(parsedFilter, prevFilters);
+      handleFiltersChange(nextFilters);
+      onAddFilter(parsedFilter, nextFilters, column);
+    });
+  };
+
+  const removeFilter = _ref => {
+    let {
+      group,
+      pill,
+      nextFilters
+    } = _ref;
+    onRemoveFilter(group, pill.value, nextFilters);
+    handleFiltersChange(nextFilters);
+  };
+
+  const removeAllFilters = () => {
+    onRemoveAllFilters();
+    handleFiltersChange([]);
+  };
+
+  return {
+    actions: {
+      addFilter,
+      removeFilter,
+      removeAllFilters
+    },
+    state: {
+      query: queryFromFilters,
+      filters
+    }
+  };
+}
+
+exports.useFilterableState = useFilterableState;

package/cjs/plugins/grouping-by/GroupingByPlugin.js

@@ -0,0 +1,40 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+require('core-js/modules/esnext.async-iterator.map.js');
+require('core-js/modules/esnext.iterator.map.js');
+var createInstancePlugin = require('@elliemae/ds-shared/createDataInstance/createInstancePlugin');
+var lodash = require('lodash');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var createInstancePlugin__default = /*#__PURE__*/_interopDefaultLegacy(createInstancePlugin);
+
+const groupedByData = (groupedBy, composedRows) => {
+  const grouped = lodash.groupBy(composedRows, groupedBy);
+  return Object.keys(grouped).map((c, key) => ({
+    id: "grouped-by-".concat(groupedBy, "-").concat(key),
+    key: groupedBy,
+    value: c,
+    children: grouped[c],
+    _isGroup: true,
+    isGroup: true
+  }));
+};
+
+const GroupingByPlugin = createInstancePlugin__default["default"]('groupedByRows', {
+  decorateGrid(grid) {
+    const {
+      composedRows,
+      props: {
+        groupedBy
+      }
+    } = grid.getInstance();
+    grid.composedRows = groupedBy ? groupedByData(groupedBy, composedRows) : composedRows;
+    return grid;
+  }
+
+});
+
+exports.GroupingByPlugin = GroupingByPlugin;

package/cjs/plugins/grouping-grid/GroupingPlugin.js

@@ -0,0 +1,149 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _jsx = require('@babel/runtime/helpers/jsx');
+var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.map.js');
+require('core-js/modules/esnext.iterator.map.js');
+require('core-js/modules/esnext.async-iterator.reduce.js');
+require('core-js/modules/esnext.iterator.reduce.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
+var React = require('react');
+var createInstancePlugin = require('@elliemae/ds-shared/createDataInstance/createInstancePlugin');
+var dsClassnames = require('@elliemae/ds-classnames');
+var reactWindow = require('react-window');
+var walkStrategy = require('./walkStrategy.js');
+var rowSizes = require('../../rowSizes.js');
+var blockNames = require('../../blockNames.js');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
+var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
+var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
+var createInstancePlugin__default = /*#__PURE__*/_interopDefaultLegacy(createInstancePlugin);
+
+const _excluded = ["isExpanded"];
+
+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) { _defineProperty__default["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; }
+const blockName = "".concat(blockNames.dataGridBlockName, "-group-row-header");
+const GroupRowHeaderWrapper = dsClassnames.aggregatedClasses('div')(blockName);
+const GroupRowHeaderTitle = dsClassnames.aggregatedClasses('div')(blockName, 'title');
+const GroupingPlugin = createInstancePlugin__default["default"]('groupedRows', {
+  decorateGrid(grid) {
+    const {
+      columns,
+      composedRows
+    } = grid.getInstance(); // eslint-disable-next-line react-hooks/rules-of-hooks
+
+    const detailColumns = React.useMemo(() => columns.map(column => _objectSpread(_objectSpread({}, column), {}, {
+      customRenderer: column.detailCustomRenderer
+    })).filter(col => !col.expandableColumn), [columns]);
+    const flatRows = [];
+    walkStrategy.walkTreeStrategy({
+      data: composedRows,
+      cb: n => flatRows.push(n)
+    });
+    return {
+      detailColumns,
+      composedRows: flatRows
+    };
+  },
+
+  getBodyProps(bodyProps, grid) {
+    const {
+      composedRows: rows
+    } = grid.getInstance(); // implementation of expandable row single column with aggregation
+
+    const getItemSize = index => {
+      const rowData = rows[index];
+      if (!rowData) return rowSizes.RowSizes.normal;
+      return rowData._isGroup || rowData.isGroup ? rowSizes.RowSizes.compact : rowSizes.RowSizes.normal;
+    }; // eslint-disable-next-line no-unused-vars
+
+
+    const getListHeight = () => {
+      const size = rows.reduce((h, r) => {
+        const rowHeight = r._isGroup || r.isGroup ? rowSizes.RowSizes.compact : rowSizes.RowSizes.normal;
+        return h + rowHeight;
+      }, 0);
+      return size;
+    };
+
+    return _objectSpread(_objectSpread({}, bodyProps), {}, {
+      getListHeight,
+      listComponent: reactWindow.VariableSizeList,
+      listProps: {
+        itemSize: getItemSize
+      }
+    });
+  },
+
+  composeRows: (rows, grid) => {
+    const {
+      composedRows,
+      props: {
+        rowKey
+      }
+    } = grid.getInstance();
+
+    if (Array.isArray(rows)) {
+      const filterIds = rows.map(r => r.data[rowKey]);
+      return composedRows.filter(c => filterIds.includes(c.data[rowKey])).map(r => _objectSpread(_objectSpread({}, r.data), {}, {
+        children: Array.isArray(r.data.children) ? r.data.children.filter(c => filterIds.includes(c[rowKey])) : r.data.children,
+        _isGroup: r.isGroup
+      })).filter(g => g.children === undefined || g.children.length > 0);
+    }
+
+    return _objectSpread(_objectSpread({}, rows), {}, {
+      allRows: rows.allRows.map(r => _objectSpread(_objectSpread({}, r.data), {}, {
+        _isGroup: r.isGroup
+      })),
+      rows: rows.rows.map(r => _objectSpread(_objectSpread({}, r.data), {}, {
+        _isGroup: r.isGroup
+      }))
+    });
+  },
+
+  decorateRenderers(renderers, grid) {
+    const Row = renderers.body.row; // eslint-disable-next-line react-hooks/rules-of-hooks
+
+    renderers.body.row = React.useMemo(() => // eslint-disable-next-line react/display-name
+    // eslint-disable-next-line react/prop-types
+    _ref => {
+      let rowProps = _objectWithoutProperties__default["default"](_ref, _excluded);
+
+      const {
+        composedRows
+      } = grid.getInstance(); // // https://jira.elliemae.io/browse/PUI-1667
+
+      const node = composedRows[rowProps.index] ? composedRows[rowProps.index] : rowProps.rowData;
+      const {
+        groupedRowsRenderHeader
+      } = grid.props; // eslint-disable-next-line no-underscore-dangle
+
+      if (node && node._isGroup) {
+        return /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
+          children: /*#__PURE__*/jsxRuntime.jsx(GroupRowHeaderWrapper, _objectSpread(_objectSpread({}, rowProps), {}, {
+            children: /*#__PURE__*/_jsx__default["default"](GroupRowHeaderTitle, {}, void 0, groupedRowsRenderHeader ? groupedRowsRenderHeader(node) : 'Group')
+          }))
+        });
+      }
+
+      return /*#__PURE__*/jsxRuntime.jsx(Row, _objectSpread({}, rowProps));
+    }, []);
+    return renderers;
+  }
+
+});
+
+exports.GroupingPlugin = GroupingPlugin;

package/cjs/plugins/grouping-grid/walkStrategy.js

@@ -0,0 +1,56 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+require('core-js/modules/web.dom-collections.iterator.js');
+
+function getPath(parentNode, index, childrenKey) {
+  if (!parentNode) return [index];
+  return [...parentNode.path, childrenKey, index];
+}
+
+function walkTreeStrategy(_ref) {
+  let {
+    data,
+    childrenKey = 'children',
+    level = 0,
+    getId = item => item.id,
+    parentNode,
+    shouldWalkChildren = () => true,
+    cb
+  } = _ref;
+
+  // eslint-disable-next-line no-loops/no-loops,no-plusplus
+  for (let i = 0; i < data.length; i++) {
+    const currLevel = level + 1;
+    const children = data[i][childrenKey];
+    const isGroup = children && !!children.length;
+    const node = {
+      index: i,
+      id: getId(data[i]),
+      data: data[i],
+      path: getPath(parentNode, i, childrenKey),
+      isGroup,
+      nestingLevel: currLevel,
+      parentNode: parentNode || {
+        isGroup: true,
+        data: {
+          children: data
+        }
+      }
+    };
+    cb(node);
+
+    if (shouldWalkChildren(node) && children && children.length) {
+      walkTreeStrategy({
+        data: children,
+        level: currLevel,
+        parentNode: node,
+        shouldWalkChildren,
+        cb
+      });
+    }
+  }
+}
+
+exports.walkTreeStrategy = walkTreeStrategy;

package/cjs/plugins/index.js

@@ -0,0 +1,48 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var BodyHeaderScrollSyncPlugin = require('./body-header-scroll-sync/BodyHeaderScrollSyncPlugin.js');
+var DndColumnsPlugin = require('./column-dnd/DndColumnsPlugin.js');
+var ColumnSizingPlugin = require('./column-sizing/ColumnSizingPlugin.js');
+var CustomRendererPlugin = require('./custom-cell-renderer/CustomRendererPlugin.js');
+var EditablePlugin = require('./editable/EditablePlugin.js');
+var ComboBox = require('./editable/EditableComponents/ComboBox.js');
+var TextBox = require('./editable/EditableComponents/TextBox.js');
+var ExpandablePlugin = require('./expandable-grid/ExpandablePlugin.js');
+var ExpandableColumn = require('./expandable-grid/ExpandableColumn.js');
+var FilterablePlugin = require('./filterable/FilterablePlugin.js');
+var InfiniteScrollPlugin = require('./infinite-scrolling/InfiniteScrollPlugin.js');
+var PaginationPlugin = require('./pagination/PaginationPlugin.js');
+var ResizablePlugin = require('./resizable/ResizablePlugin.js');
+var DndRowsPlugin = require('./row-dnd/DndRowsPlugin.js');
+var SelectablePlugin = require('./selectable/SelectablePlugin.js');
+var SortablePlugin = require('./sortable/SortablePlugin.js');
+var ToolbarPlugin = require('./toolbar/ToolbarPlugin.js');
+var ExportDataPlugin = require('./export-data/ExportDataPlugin.js');
+var VirtualizationPlugin = require('./virtualization/VirtualizationPlugin.js');
+
+
+
+exports.BodyHeaderScrollSyncPlugin = BodyHeaderScrollSyncPlugin.BodyHeaderScrollSyncPlugin;
+exports.DndColumnsPlugin = DndColumnsPlugin.DndColumnsPlugin;
+exports.ColumnSizingPlugin = ColumnSizingPlugin.ColumnSizingPlugin;
+exports.CustomRendererPlugin = CustomRendererPlugin.CustomRendererPlugin;
+exports.EditablePlugin = EditablePlugin.EditablePlugin;
+exports.ComboBox = ComboBox;
+exports.TextBox = TextBox;
+exports.ExpandablePlugin = ExpandablePlugin.ExpandablePlugin;
+exports.ExpandableColumn = ExpandableColumn;
+exports.FilterablePlugin = FilterablePlugin.FilterablePlugin;
+exports.InfiniteScrollPlugin = InfiniteScrollPlugin.InfiniteScrollPlugin;
+exports.PaginationPlugin = PaginationPlugin.PaginationPlugin;
+exports.ResizablePlugin = ResizablePlugin.ResizablePlugin;
+exports.DndRowsPlugin = DndRowsPlugin.DndRowsPlugin;
+exports.SelectablePlugin = SelectablePlugin.SelectablePlugin;
+exports.SortablePlugin = SortablePlugin.SortablePlugin;
+exports.ToolbarPlugin = ToolbarPlugin.ToolbarPlugin;
+exports.ExportDataPlugin = ExportDataPlugin.ExportDataPlugin;
+exports.getColumnValue = ExportDataPlugin.getColumnValue;
+exports.getExportedData = ExportDataPlugin.getExportedData;
+exports.getVisibleRowData = ExportDataPlugin.getVisibleRowData;
+exports.VirtualizationPlugin = VirtualizationPlugin.VirtualizationPlugin;

package/cjs/plugins/infinite-scrolling/InfiniteScrollPlugin.js

@@ -0,0 +1,124 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+require('core-js/modules/web.dom-collections.iterator.js');
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
+var React = require('react');
+var createInstancePlugin = require('@elliemae/ds-shared/createDataInstance/createInstancePlugin');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
+var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
+var createInstancePlugin__default = /*#__PURE__*/_interopDefaultLegacy(createInstancePlugin);
+
+const _excluded = ["children"];
+
+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) { _defineProperty__default["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; }
+
+const registerStateHook = grid => {
+  const {
+    props: {
+      getData,
+      onInfiniteScrolling = () => null
+    },
+    actions: {
+      updateRows
+    }
+  } = grid;
+  const loading = React.useRef(false);
+
+  const addMoreData = function () {
+    let data = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+    loading.current = false;
+    updateRows(prevRows => prevRows.concat(data || []));
+  };
+
+  const doLoadData = async currentRows => {
+    loading.current = true;
+    return Promise.resolve(getData(currentRows)).then(addMoreData);
+  };
+
+  const loadMoreData = currentRows => {
+    onInfiniteScrolling(currentRows);
+    if (loading.current || !getData) return;
+    doLoadData(currentRows);
+  };
+
+  return {
+    actions: {
+      loadMoreData
+    }
+  };
+};
+
+const getBodyProps = (_ref, grid) => {
+  let props = _objectWithoutProperties__default["default"](_ref, _excluded);
+
+  const {
+    loadMoreData
+  } = grid.getInstance().actions;
+  const [bodyNode, setBodyRef] = React.useState();
+  const prevScroll = React.useRef();
+  prevScroll.current = 0;
+
+  const handleBodyScroll = (event, s) => {
+    const {
+      target
+    } = event;
+    const {
+      scrollHeight,
+      scrollTop,
+      offsetHeight,
+      scrollLeft
+    } = target;
+    const {
+      composedRows
+    } = grid.getInstance(); // prevent horizontal scroll triggering infinite scrolling callbacks
+
+    if (prevScroll.current !== scrollLeft) {
+      prevScroll.current = scrollLeft;
+      return;
+    } // todo: clean this. Better approach using another component for the infinite scroll
+
+
+    if (bodyNode !== target) return;
+
+    if (scrollTop + offsetHeight >= scrollHeight - 1) {
+      loadMoreData(composedRows);
+    }
+  };
+
+  React.useEffect(() => {
+    if (bodyNode) {
+      bodyNode.addEventListener('scroll', handleBodyScroll);
+    }
+
+    return () => {
+      if (bodyNode) {
+        bodyNode.removeEventListener('scroll', handleBodyScroll);
+      }
+    };
+  }, [bodyNode]);
+  return _objectSpread(_objectSpread({}, props), {}, {
+    listProps: {
+      outerRef: setBodyRef
+    }
+  });
+};
+
+const InfiniteScrollPlugin = createInstancePlugin__default["default"]('infinite-scroll', {
+  registerStateHook,
+  getBodyProps
+});
+
+exports.InfiniteScrollPlugin = InfiniteScrollPlugin;

package/cjs/plugins/infinite-scrolling/index.js

@@ -0,0 +1,9 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var InfiniteScrollPlugin = require('./InfiniteScrollPlugin.js');
+
+
+
+exports.InfiniteScrollPlugin = InfiniteScrollPlugin.InfiniteScrollPlugin;