@elliemae/ds-datagrids 2.2.0-alpha.4 → 3.0.0-next.2

package/esm/plugins/filterable/index.js

@@ -1,6 +1 @@
-import * as React from "react";
-import { FilterablePlugin } from "./FilterablePlugin";
-export {
-  FilterablePlugin
-};
-//# sourceMappingURL=index.js.map
+export { FilterablePlugin } from './FilterablePlugin.js';

package/esm/plugins/filterable/useFilterableState.js

@@ -1,12 +1,20 @@
-import * as React from "react";
-import { useMemo, useState, useEffect } from "react";
-import { v4 as uuidv4 } from "uuid";
-import {
-  buildFilterArray,
-  getFilterValue,
-  parseFiltersToQuery
-} from "./helper";
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import { useState, useEffect, useMemo } from 'react';
+import { v4 } from 'uuid';
+import { parseFiltersToQuery, getFilterValue, buildFilterArray } from './helper.js';
+
+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(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,
@@ -21,55 +29,70 @@ function useFilterableState(grid) {
       setFilters(filtersProp);
     }
   }, [filtersProp]);
-  const queryFromFilters = useMemo(() => parseFiltersToQuery(filters || []), [
-    filters
-  ]);
-  const handleFiltersChange = (nextFilters) => {
+  const queryFromFilters = useMemo(() => parseFiltersToQuery(filters || []), [filters]);
+
+  const handleFiltersChange = nextFilters => {
     const {
-      refs: { body }
+      refs: {
+        body
+      }
     } = grid.getInstance();
     body.current.scrollTop = 0;
     setFilters(nextFilters);
-    grid.observeRows((rows) => onFiltersChange(nextFilters, queryFromFilters, rows));
+    grid.observeRows(rows => onFiltersChange(nextFilters, queryFromFilters, rows));
   };
+
   const addFilter = (filter, column) => {
     let hasBeenCalled = false;
-    const trimmedFilter = {
-      ...filter,
+
+    const trimmedFilter = _objectSpread(_objectSpread({}, filter), {}, {
       value: String(filter.value).trim()
-    };
-    const parsedFilter = !filter.group ? {
-      ...trimmedFilter,
+    });
+    /* eslint-disable indent */
+
+
+    const parsedFilter = !filter.group ? _objectSpread(_objectSpread({}, trimmedFilter), {}, {
       value: String(filter.value).trim(),
-      group: "all",
-      label: "All",
-      id: uuidv4()
-    } : {
-      ...trimmedFilter,
+      group: 'all',
+      label: 'All',
+      id: v4()
+    }) : _objectSpread(_objectSpread({}, trimmedFilter), {}, {
       value: String(filter.value).trim(),
-      id: uuidv4(),
+      id: v4(),
       label: column && column.filterLabel || trimmedFilter.label,
       originalProperty: column.originalProperty || column.property,
       customValue: getFilterValue(trimmedFilter, column)
-    };
-    setFilters((prevFilters) => {
+    });
+    /* 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 = buildFilterArray(parsedFilter, prevFilters);
-      handleFiltersChange(nextFilters, true);
+      handleFiltersChange(nextFilters);
       onAddFilter(parsedFilter, nextFilters, column);
     });
   };
-  const removeFilter = ({ group, pill, nextFilters }) => {
+
+  const removeFilter = _ref => {
+    let {
+      group,
+      pill,
+      nextFilters
+    } = _ref;
     onRemoveFilter(group, pill.value, nextFilters);
     handleFiltersChange(nextFilters);
   };
+
   const removeAllFilters = () => {
     onRemoveAllFilters();
     handleFiltersChange([]);
   };
+
   return {
     actions: {
       addFilter,
@@ -82,7 +105,5 @@ function useFilterableState(grid) {
     }
   };
 }
-export {
-  useFilterableState
-};
-//# sourceMappingURL=useFilterableState.js.map
+
+export { useFilterableState };

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

@@ -1,10 +1,12 @@
-import * as React from "react";
-import { createInstancePlugin } from "@elliemae/ds-shared/createDataInstance/createInstancePlugin";
-import { groupBy } from "lodash";
+import 'core-js/modules/esnext.async-iterator.map.js';
+import 'core-js/modules/esnext.iterator.map.js';
+import createInstancePlugin from '@elliemae/ds-shared/createDataInstance/createInstancePlugin';
+import { groupBy } from 'lodash';
+
 const groupedByData = (groupedBy, composedRows) => {
   const grouped = groupBy(composedRows, groupedBy);
   return Object.keys(grouped).map((c, key) => ({
-    id: `grouped-by-${groupedBy}-${key}`,
+    id: "grouped-by-".concat(groupedBy, "-").concat(key),
     key: groupedBy,
     value: c,
     children: grouped[c],
@@ -12,17 +14,19 @@ const groupedByData = (groupedBy, composedRows) => {
     isGroup: true
   }));
 };
-const GroupingByPlugin = createInstancePlugin("groupedByRows", {
+
+const GroupingByPlugin = createInstancePlugin('groupedByRows', {
   decorateGrid(grid) {
     const {
       composedRows,
-      props: { groupedBy }
+      props: {
+        groupedBy
+      }
     } = grid.getInstance();
     grid.composedRows = groupedBy ? groupedByData(groupedBy, composedRows) : composedRows;
     return grid;
   }
+
 });
-export {
-  GroupingByPlugin
-};
-//# sourceMappingURL=GroupingByPlugin.js.map
+
+export { GroupingByPlugin };

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

@@ -1,39 +1,65 @@
-import * as React from "react";
-import React2, { useMemo } from "react";
-import { createInstancePlugin } from "@elliemae/ds-shared/createDataInstance/createInstancePlugin";
-import { aggregatedClasses } from "@elliemae/ds-classnames";
-import { VariableSizeList } from "react-window";
-import { walkTreeStrategy } from "./walkStrategy";
-import { RowSizes } from "../../rowSizes";
-import { dataGridBlockName } from "../../blockNames";
-const blockName = `${dataGridBlockName}-group-row-header`;
-const GroupRowHeaderWrapper = aggregatedClasses("div")(blockName);
-const GroupRowHeaderTitle = aggregatedClasses("div")(blockName, "title");
-const GroupingPlugin = createInstancePlugin("groupedRows", {
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.map.js';
+import 'core-js/modules/esnext.iterator.map.js';
+import 'core-js/modules/esnext.async-iterator.reduce.js';
+import 'core-js/modules/esnext.iterator.reduce.js';
+import { useMemo } from 'react';
+import createInstancePlugin from '@elliemae/ds-shared/createDataInstance/createInstancePlugin';
+import { aggregatedClasses } from '@elliemae/ds-classnames';
+import { VariableSizeList } from 'react-window';
+import { walkTreeStrategy } from './walkStrategy.js';
+import { RowSizes } from '../../rowSizes.js';
+import { dataGridBlockName } from '../../blockNames.js';
+import { jsx, Fragment } from 'react/jsx-runtime';
+
+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(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(dataGridBlockName, "-group-row-header");
+const GroupRowHeaderWrapper = aggregatedClasses('div')(blockName);
+const GroupRowHeaderTitle = aggregatedClasses('div')(blockName, 'title');
+const GroupingPlugin = createInstancePlugin('groupedRows', {
   decorateGrid(grid) {
-    const { columns, composedRows } = grid.getInstance();
-    const detailColumns = useMemo(() => columns.map((column) => ({
-      ...column,
+    const {
+      columns,
+      composedRows
+    } = grid.getInstance(); // eslint-disable-next-line react-hooks/rules-of-hooks
+
+    const detailColumns = useMemo(() => columns.map(column => _objectSpread(_objectSpread({}, column), {}, {
       customRenderer: column.detailCustomRenderer
-    })).filter((col) => !col.expandableColumn), [columns]);
+    })).filter(col => !col.expandableColumn), [columns]);
     const flatRows = [];
     walkTreeStrategy({
       data: composedRows,
-      cb: (n) => flatRows.push(n)
+      cb: n => flatRows.push(n)
     });
     return {
       detailColumns,
       composedRows: flatRows
     };
   },
+
   getBodyProps(bodyProps, grid) {
-    const { composedRows: rows } = grid.getInstance();
-    const getItemSize = (index) => {
+    const {
+      composedRows: rows
+    } = grid.getInstance(); // implementation of expandable row single column with aggregation
+
+    const getItemSize = index => {
       const rowData = rows[index];
-      if (!rowData)
-        return RowSizes.normal;
+      if (!rowData) return RowSizes.normal;
       return rowData._isGroup || rowData.isGroup ? RowSizes.compact : RowSizes.normal;
-    };
+    }; // eslint-disable-next-line no-unused-vars
+
+
     const getListHeight = () => {
       const size = rows.reduce((h, r) => {
         const rowHeight = r._isGroup || r.isGroup ? RowSizes.compact : RowSizes.normal;
@@ -41,57 +67,72 @@ const GroupingPlugin = createInstancePlugin("groupedRows", {
       }, 0);
       return size;
     };
-    return {
-      ...bodyProps,
+
+    return _objectSpread(_objectSpread({}, bodyProps), {}, {
       getListHeight,
       listComponent: VariableSizeList,
-      listProps: { itemSize: getItemSize }
-    };
+      listProps: {
+        itemSize: getItemSize
+      }
+    });
   },
+
   composeRows: (rows, grid) => {
     const {
       composedRows,
-      props: { rowKey }
+      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) => ({
-        ...r.data,
-        children: Array.isArray(r.data.children) ? r.data.children.filter((c) => filterIds.includes(c[rowKey])) : r.data.children,
+      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 === void 0 || g.children.length > 0);
+      })).filter(g => g.children === undefined || g.children.length > 0);
     }
-    return {
-      ...rows,
-      allRows: rows.allRows.map((r) => ({
-        ...r.data,
+
+    return _objectSpread(_objectSpread({}, rows), {}, {
+      allRows: rows.allRows.map(r => _objectSpread(_objectSpread({}, r.data), {}, {
         _isGroup: r.isGroup
       })),
-      rows: rows.rows.map((r) => ({
-        ...r.data,
+      rows: rows.rows.map(r => _objectSpread(_objectSpread({}, r.data), {}, {
         _isGroup: r.isGroup
       }))
-    };
+    });
   },
+
   decorateRenderers(renderers, grid) {
-    const Row = renderers.body.row;
-    renderers.body.row = useMemo(() => ({ isExpanded, ...rowProps }) => {
-      const { composedRows } = grid.getInstance();
+    const Row = renderers.body.row; // eslint-disable-next-line react-hooks/rules-of-hooks
+
+    renderers.body.row = useMemo(() => // eslint-disable-next-line react/display-name
+    // eslint-disable-next-line react/prop-types
+    _ref => {
+      let rowProps = _objectWithoutProperties(_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;
+      const {
+        groupedRowsRenderHeader
+      } = grid.props; // eslint-disable-next-line no-underscore-dangle
+
       if (node && node._isGroup) {
-        return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement(GroupRowHeaderWrapper, {
-          ...rowProps
-        }, /* @__PURE__ */ React2.createElement(GroupRowHeaderTitle, null, groupedRowsRenderHeader ? groupedRowsRenderHeader(node) : "Group")));
+        return /*#__PURE__*/jsx(Fragment, {
+          children: /*#__PURE__*/jsx(GroupRowHeaderWrapper, _objectSpread(_objectSpread({}, rowProps), {}, {
+            children: /*#__PURE__*/_jsx(GroupRowHeaderTitle, {}, void 0, groupedRowsRenderHeader ? groupedRowsRenderHeader(node) : 'Group')
+          }))
+        });
       }
-      return /* @__PURE__ */ React2.createElement(Row, {
-        ...rowProps
-      });
+
+      return /*#__PURE__*/jsx(Row, _objectSpread({}, rowProps));
     }, []);
     return renderers;
   }
+
 });
-export {
-  GroupingPlugin
-};
-//# sourceMappingURL=GroupingPlugin.js.map
+
+export { GroupingPlugin };

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

@@ -1,18 +1,22 @@
-import * as React from "react";
+import 'core-js/modules/web.dom-collections.iterator.js';
+
 function getPath(parentNode, index, childrenKey) {
-  if (!parentNode)
-    return [index];
+  if (!parentNode) return [index];
   return [...parentNode.path, childrenKey, index];
 }
-function walkTreeStrategy({
-  data,
-  childrenKey = "children",
-  level = 0,
-  getId = (item) => item.id,
-  parentNode,
-  shouldWalkChildren = () => true,
-  cb
-}) {
+
+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];
@@ -26,10 +30,13 @@ function walkTreeStrategy({
       nestingLevel: currLevel,
       parentNode: parentNode || {
         isGroup: true,
-        data: { children: data }
+        data: {
+          children: data
+        }
       }
     };
     cb(node);
+
     if (shouldWalkChildren(node) && children && children.length) {
       walkTreeStrategy({
         data: children,
@@ -41,7 +48,5 @@ function walkTreeStrategy({
     }
   }
 }
-export {
-  walkTreeStrategy
-};
-//# sourceMappingURL=walkStrategy.js.map
+
+export { walkTreeStrategy };

package/esm/plugins/index.js

@@ -1,39 +1,19 @@
-import * as React from "react";
-import { BodyHeaderScrollSyncPlugin } from "./body-header-scroll-sync";
-import { DndColumnsPlugin } from "./column-dnd";
-import { ColumnSizingPlugin } from "./column-sizing";
-import { CustomRendererPlugin } from "./custom-cell-renderer";
-import { EditablePlugin, ComboBox, TextBox } from "./editable";
-import { ExpandableColumn, ExpandablePlugin } from "./expandable-grid";
-import { FilterablePlugin } from "./filterable";
-import { InfiniteScrollPlugin } from "./infinite-scrolling";
-import { PaginationPlugin } from "./pagination";
-import { ResizablePlugin } from "./resizable";
-import { DndRowsPlugin } from "./row-dnd";
-import { SelectablePlugin } from "./selectable";
-import { SortablePlugin } from "./sortable";
-import { ToolbarPlugin } from "./toolbar";
-import { ExportDataPlugin } from "./export-data";
-import { VirtualizationPlugin } from "./virtualization";
-export {
-  BodyHeaderScrollSyncPlugin,
-  ColumnSizingPlugin,
-  ComboBox,
-  CustomRendererPlugin,
-  DndColumnsPlugin,
-  DndRowsPlugin,
-  EditablePlugin,
-  ExpandableColumn,
-  ExpandablePlugin,
-  ExportDataPlugin,
-  FilterablePlugin,
-  InfiniteScrollPlugin,
-  PaginationPlugin,
-  ResizablePlugin,
-  SelectablePlugin,
-  SortablePlugin,
-  TextBox,
-  ToolbarPlugin,
-  VirtualizationPlugin
-};
-//# sourceMappingURL=index.js.map
+export { BodyHeaderScrollSyncPlugin } from './body-header-scroll-sync/BodyHeaderScrollSyncPlugin.js';
+export { DndColumnsPlugin } from './column-dnd/DndColumnsPlugin.js';
+export { ColumnSizingPlugin } from './column-sizing/ColumnSizingPlugin.js';
+export { CustomRendererPlugin } from './custom-cell-renderer/CustomRendererPlugin.js';
+export { EditablePlugin } from './editable/EditablePlugin.js';
+export { default as ComboBox } from './editable/EditableComponents/ComboBox.js';
+export { default as TextBox } from './editable/EditableComponents/TextBox.js';
+export { ExpandablePlugin } from './expandable-grid/ExpandablePlugin.js';
+export { default as ExpandableColumn } from './expandable-grid/ExpandableColumn.js';
+export { FilterablePlugin } from './filterable/FilterablePlugin.js';
+export { InfiniteScrollPlugin } from './infinite-scrolling/InfiniteScrollPlugin.js';
+export { PaginationPlugin } from './pagination/PaginationPlugin.js';
+export { ResizablePlugin } from './resizable/ResizablePlugin.js';
+export { DndRowsPlugin } from './row-dnd/DndRowsPlugin.js';
+export { SelectablePlugin } from './selectable/SelectablePlugin.js';
+export { SortablePlugin } from './sortable/SortablePlugin.js';
+export { ToolbarPlugin } from './toolbar/ToolbarPlugin.js';
+export { ExportDataPlugin, getColumnValue, getExportedData, getVisibleRowData } from './export-data/ExportDataPlugin.js';
+export { VirtualizationPlugin } from './virtualization/VirtualizationPlugin.js';

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

@@ -1,71 +1,114 @@
-import * as React from "react";
-import { useRef, useEffect, useState } from "react";
-import { createInstancePlugin } from "@elliemae/ds-shared/createDataInstance/createInstancePlugin";
-const registerStateHook = (grid) => {
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+import { useRef, useState, useEffect } from 'react';
+import createInstancePlugin from '@elliemae/ds-shared/createDataInstance/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(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 }
+    props: {
+      getData,
+      onInfiniteScrolling = () => null
+    },
+    actions: {
+      updateRows
+    }
   } = grid;
   const loading = useRef(false);
-  const addMoreData = (data = []) => {
+
+  const addMoreData = function () {
+    let data = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
     loading.current = false;
-    updateRows((prevRows) => prevRows.concat(data || []));
+    updateRows(prevRows => prevRows.concat(data || []));
   };
-  const doLoadData = async (currentRows) => {
+
+  const doLoadData = async currentRows => {
     loading.current = true;
     return Promise.resolve(getData(currentRows)).then(addMoreData);
   };
-  const loadMoreData = (currentRows) => {
+
+  const loadMoreData = currentRows => {
     onInfiniteScrolling(currentRows);
-    if (loading.current || !getData)
-      return;
+    if (loading.current || !getData) return;
     doLoadData(currentRows);
   };
+
   return {
     actions: {
       loadMoreData
     }
   };
 };
-const getBodyProps = ({ children, ...props }, grid) => {
-  const { loadMoreData } = grid.getInstance().actions;
+
+const getBodyProps = (_ref, grid) => {
+  let props = _objectWithoutProperties(_ref, _excluded);
+
+  const {
+    loadMoreData
+  } = grid.getInstance().actions;
   const [bodyNode, setBodyRef] = useState();
   const prevScroll = useRef();
   prevScroll.current = 0;
+
   const handleBodyScroll = (event, s) => {
-    const { target } = event;
-    const { scrollHeight, scrollTop, offsetHeight, scrollLeft } = target;
-    const { composedRows } = grid.getInstance();
+    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;
-    }
-    if (bodyNode !== target)
-      return;
+    } // todo: clean this. Better approach using another component for the infinite scroll
+
+
+    if (bodyNode !== target) return;
+
     if (scrollTop + offsetHeight >= scrollHeight - 1) {
       loadMoreData(composedRows);
     }
   };
+
   useEffect(() => {
     if (bodyNode) {
-      bodyNode.addEventListener("scroll", handleBodyScroll);
+      bodyNode.addEventListener('scroll', handleBodyScroll);
     }
+
     return () => {
       if (bodyNode) {
-        bodyNode.removeEventListener("scroll", handleBodyScroll);
+        bodyNode.removeEventListener('scroll', handleBodyScroll);
       }
     };
   }, [bodyNode]);
-  return {
-    ...props,
-    listProps: { outerRef: setBodyRef }
-  };
+  return _objectSpread(_objectSpread({}, props), {}, {
+    listProps: {
+      outerRef: setBodyRef
+    }
+  });
 };
-const InfiniteScrollPlugin = createInstancePlugin("infinite-scroll", {
+
+const InfiniteScrollPlugin = createInstancePlugin('infinite-scroll', {
   registerStateHook,
   getBodyProps
 });
-export {
-  InfiniteScrollPlugin
-};
-//# sourceMappingURL=InfiniteScrollPlugin.js.map
+
+export { InfiniteScrollPlugin };

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

@@ -1,6 +1 @@
-import * as React from "react";
-import { InfiniteScrollPlugin } from "./InfiniteScrollPlugin";
-export {
-  InfiniteScrollPlugin
-};
-//# sourceMappingURL=index.js.map
+export { InfiniteScrollPlugin } from './InfiniteScrollPlugin.js';