@elliemae/ds-datagrids 1.61.0 → 2.0.0-alpha.12

package/cjs/plugins/virtualization/VirtualizationPlugin.js

@@ -2,110 +2,107 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var _extends = require('@babel/runtime/helpers/extends');
+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 _jsx = require('@babel/runtime/helpers/jsx');
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var React = require('react');
 var lodash = require('lodash');
 var FocusGridManager = require('@elliemae/ds-shared/FocusGroup/FocusGrid');
 var dsUtilities = require('@elliemae/ds-utilities');
 var createInstancePlugin = require('@elliemae/ds-shared/createDataInstance/createInstancePlugin');
-var plugins_virtualization_VirtualizedBody = require('./VirtualizedBody.js');
-require('@babel/runtime/helpers/slicedToArray');
-require('prop-types');
-require('../../components/NoResults.js');
-require('@babel/runtime/helpers/objectWithoutProperties');
-require('styled-components');
-require('@elliemae/ds-system');
-require('./VirtualizedBodyRow.js');
-require('../../rowSizes.js');
-require('./helper.js');
+var VirtualizedBody = require('./VirtualizedBody.js');
+var jsxRuntime = require('react/jsx-runtime');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var FocusGridManager__default = /*#__PURE__*/_interopDefaultLegacy(FocusGridManager);
 var createInstancePlugin__default = /*#__PURE__*/_interopDefaultLegacy(createInstancePlugin);
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-var VirtualizationPlugin = createInstancePlugin__default['default']('virtualization', {
-  decorateRenderers: function decorateRenderers(renderers, grid) {
-    var BodyWrapper = renderers.body.wrapper; // eslint-disable-next-line react/display-name
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+const VirtualizationPlugin = createInstancePlugin__default["default"]('virtualization', {
+  decorateRenderers(renderers, grid) {
+    const BodyWrapper = renderers.body.wrapper; // eslint-disable-next-line react/display-name
 
-    renderers.body.wrapper = React.useMemo(function () {
-      return function (props) {
-        var _props$listProps = props.listProps,
-            listProps = _props$listProps === void 0 ? {} : _props$listProps,
-            rows = props.rows;
+    renderers.body.wrapper = React.useMemo(() => props => {
+      const {
+        listProps = {},
+        rows
+      } = props;
+      const {
+        hotKeys,
+        props: {
+          autoHeight,
+          autoScrollToId,
+          expandable,
+          overscanCount,
+          rowSize
+        },
+        refs: {
+          innerBody
+        },
+        setHasScroll,
+        state: {
+          filters
+        }
+      } = grid.getInstance();
+      const listRef = React.useRef();
 
-        var _grid$getInstance = grid.getInstance(),
-            hotKeys = _grid$getInstance.hotKeys,
-            _grid$getInstance$pro = _grid$getInstance.props,
-            autoHeight = _grid$getInstance$pro.autoHeight,
-            autoScrollToId = _grid$getInstance$pro.autoScrollToId,
-            expandable = _grid$getInstance$pro.expandable,
-            overscanCount = _grid$getInstance$pro.overscanCount,
-            rowSize = _grid$getInstance$pro.rowSize,
-            innerBody = _grid$getInstance.refs.innerBody,
-            setHasScroll = _grid$getInstance.setHasScroll,
-            filters = _grid$getInstance.state.filters;
+      const nextListProps = _objectSpread(_objectSpread({}, listProps), {}, {
+        ref: dsUtilities.mergeRefs(listRef, listProps.ref)
+      });
 
-        var listRef = React.useRef();
-
-        var nextListProps = _objectSpread(_objectSpread({}, listProps), {}, {
-          ref: dsUtilities.mergeRefs(listRef, listProps.ref)
-        });
-
-        return /*#__PURE__*/React__default['default'].createElement(FocusGridManager__default['default'], {
-          hotKeys: hotKeys,
-          keyBindings: function keyBindings(_ref) {
-            var defaultBindings = _ref.defaultBindings;
-            return _objectSpread(_objectSpread({}, defaultBindings), {}, {
-              // todo: this is kind of hacky, since it's virtualized and there's
-              //  the possibility that the firsts or lasts rows aren't rendered
-              Home: dsUtilities.runAll(function (e) {
-                if (e.ctrlKey) {
-                  listRef.current.scrollToItem(0);
-                  setTimeout(function () {
-                    return defaultBindings.Home(e);
-                  }, 10);
-                } else {
-                  defaultBindings.Home(e);
-                }
-              }),
-              End: dsUtilities.runAll(function (e) {
-                if (e.ctrlKey) {
-                  listRef.current.scrollToItem(rows.length - 1);
-                  setTimeout(function () {
-                    return defaultBindings.End(e);
-                  }, 10);
-                } else {
-                  defaultBindings.End(e);
-                }
-              })
-            });
-          },
-          shouldRefocus: false
-        }, /*#__PURE__*/React__default['default'].createElement(plugins_virtualization_VirtualizedBody, _extends__default['default']({}, props, {
-          autoScrollToId: autoScrollToId,
-          autoHeight: autoHeight,
-          component: BodyWrapper,
-          expandable: expandable,
-          innerBody: innerBody,
-          listProps: nextListProps,
-          overscanCount: overscanCount,
-          rowSize: rowSize,
-          setHasScroll: setHasScroll,
-          filters: filters
-        })));
-      };
+      return /*#__PURE__*/_jsx__default["default"](FocusGridManager__default["default"], {
+        hotKeys: hotKeys,
+        keyBindings: _ref => {
+          let {
+            defaultBindings
+          } = _ref;
+          return _objectSpread(_objectSpread({}, defaultBindings), {}, {
+            // todo: this is kind of hacky, since it's virtualized and there's
+            //  the possibility that the firsts or lasts rows aren't rendered
+            Home: dsUtilities.runAll(e => {
+              if (e.ctrlKey) {
+                listRef.current.scrollToItem(0);
+                setTimeout(() => defaultBindings.Home(e), 10);
+              } else {
+                defaultBindings.Home(e);
+              }
+            }),
+            End: dsUtilities.runAll(e => {
+              if (e.ctrlKey) {
+                listRef.current.scrollToItem(rows.length - 1);
+                setTimeout(() => defaultBindings.End(e), 10);
+              } else {
+                defaultBindings.End(e);
+              }
+            })
+          });
+        },
+        shouldRefocus: false
+      }, void 0, /*#__PURE__*/jsxRuntime.jsx(VirtualizedBody, _objectSpread(_objectSpread({}, props), {}, {
+        autoScrollToId: autoScrollToId,
+        autoHeight: autoHeight,
+        component: BodyWrapper,
+        expandable: expandable,
+        innerBody: innerBody,
+        listProps: nextListProps,
+        overscanCount: overscanCount,
+        rowSize: rowSize,
+        setHasScroll: setHasScroll,
+        filters: filters
+      })));
     }, [lodash.get(grid.getInstance(), 'rows.length')]);
     return renderers;
   }
+
 });
 
 exports.VirtualizationPlugin = VirtualizationPlugin;
-//# sourceMappingURL=VirtualizationPlugin.js.map

package/cjs/plugins/virtualization/VirtualizedBody.js

@@ -1,122 +1,92 @@
 'use strict';
 
-var _extends = require('@babel/runtime/helpers/extends');
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
-var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
+var _jsx = require('@babel/runtime/helpers/jsx');
+require('core-js/modules/web.dom-collections.iterator.js');
+require('core-js/modules/esnext.async-iterator.reduce.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.reduce.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.filter.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 PropTypes = require('prop-types');
 var dsUtilities = require('@elliemae/ds-utilities');
-var components_NoResults = require('../../components/NoResults.js');
-var plugins_virtualization_VirtualizedBodyRow = require('./VirtualizedBodyRow.js');
+var NoResults = require('../../components/NoResults.js');
+var VirtualizedBodyRow = require('./VirtualizedBodyRow.js');
 var rowSizes = require('../../rowSizes.js');
-var plugins_virtualization_helper = require('./helper.js');
-require('@babel/runtime/helpers/objectWithoutProperties');
-require('styled-components');
-require('@elliemae/ds-system');
+var helper = require('./helper.js');
+var jsxRuntime = require('react/jsx-runtime');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
 var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
-var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-var wrapperSafari = {};
-var wrapperGeneric = {
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+const wrapperSafari = {};
+const wrapperGeneric = {
   overflowY: 'auto',
   overflowX: 'visible'
 };
 
-var VirtualizedBody = function VirtualizedBody(props) {
-  var autoScrollToId = props.autoScrollToId,
-      columns = props.columns,
-      Component = props.component,
-      expandable = props.expandable,
-      innerRef = props.innerRef,
-      innerBody = props.innerBody,
-      isPlaceholderActive = props.isPlaceholderActive,
-      listProps = props.listProps,
-      noResultsPlaceholder = props.noResultsPlaceholder,
-      overscanCount = props.overscanCount,
-      rows = props.rows,
-      defaultRowHeight = props.rowHeight,
-      rowKey = props.rowKey,
-      rowRenderer = props.rowRenderer,
-      rowSize = props.rowSize,
-      setHasScroll = props.setHasScroll,
-      filters = props.filters;
-  var rowHeight = defaultRowHeight || rowSizes.RowSizes[rowSize];
-
-  var _useState = React.useState(0),
-      _useState2 = _slicedToArray__default['default'](_useState, 2),
-      scrollTop = _useState2[0],
-      setScrollTop = _useState2[1];
-
-  var _useState3 = React.useState(0),
-      _useState4 = _slicedToArray__default['default'](_useState3, 2),
-      visibleHeight = _useState4[0],
-      setVisibleHeight = _useState4[1];
-
-  var _useState5 = React.useState(false),
-      _useState6 = _slicedToArray__default['default'](_useState5, 2),
-      hasScrollBar = _useState6[0],
-      setHasScrollBar = _useState6[1];
-
-  var rowStyleCache = React.useRef({});
-
-  var _useState7 = React.useState([0, 30]),
-      _useState8 = _slicedToArray__default['default'](_useState7, 2),
-      renderedIndexes = _useState8[0],
-      setRenderedIndexes = _useState8[1];
-
-  var getCalculatedHeightBetweenIndexes = function getCalculatedHeightBetweenIndexes(start, end) {
-    var _listProps$itemSize = listProps.itemSize,
-        itemSize = _listProps$itemSize === void 0 ? function () {
-      return rowHeight;
-    } : _listProps$itemSize;
+const VirtualizedBody = props => {
+  const {
+    autoScrollToId,
+    columns,
+    component: Component,
+    expandable,
+    innerRef,
+    innerBody,
+    isPlaceholderActive,
+    listProps,
+    noResultsPlaceholder,
+    overscanCount,
+    rows,
+    rowHeight: defaultRowHeight,
+    rowKey,
+    rowRenderer,
+    rowSize,
+    setHasScroll,
+    filters // hack to reset the scrollTop to 0 if filters change
+
+  } = props;
+  const rowHeight = defaultRowHeight || rowSizes.RowSizes[rowSize];
+  const [scrollTop, setScrollTop] = React.useState(0);
+  const [visibleHeight, setVisibleHeight] = React.useState(0);
+  const [hasScrollBar, setHasScrollBar] = React.useState(false);
+  const rowStyleCache = React.useRef({});
+  const [renderedIndexes, setRenderedIndexes] = React.useState([0, 30]);
+
+  const getCalculatedHeightBetweenIndexes = (start, end) => {
+    const {
+      itemSize = () => rowHeight
+    } = listProps;
 
     if (expandable) {
-      return rows.slice(start, end).map(function (_, idx) {
-        return idx;
-      }).map(function (idx) {
-        return itemSize(idx);
-      }).reduce(function (acc, curr) {
-        return acc + curr;
-      }, 0);
+      return rows.slice(start, end).map((_, idx) => idx).map(idx => itemSize(idx)).reduce((acc, curr) => acc + curr, 0);
     }
 
     return (end - start) * rowHeight;
   };
 
-  var generateRowPositionMap = function generateRowPositionMap() {
-    return rows.map(function (row, idx) {
-      return getCalculatedHeightBetweenIndexes(0, idx);
-    });
-  };
+  const generateRowPositionMap = () => rows.map((row, idx) => getCalculatedHeightBetweenIndexes(0, idx));
 
-  var rowPositionMap = React.useRef(generateRowPositionMap());
-
-  var _useState9 = React.useState(null),
-      _useState10 = _slicedToArray__default['default'](_useState9, 2),
-      virtualizedBodyRef = _useState10[0],
-      setVirtualizedBodyRef = _useState10[1];
-
-  var handlerRef = React.useRef();
-  var autoScrollTo = React.useCallback(function (scrollHeight) {
-    var _listProps$itemSize2 = listProps.itemSize,
-        itemSize = _listProps$itemSize2 === void 0 ? function () {
-      return rowHeight;
-    } : _listProps$itemSize2;
-    var idx = rows.findIndex(function (item) {
-      return item[rowKey] === autoScrollToId;
-    });
-    var val = rowPositionMap.current[idx] || 0;
-    var lastPositionIdx = rowPositionMap.current.length - 1;
-    var lastPosition = 0;
+  const rowPositionMap = React.useRef(generateRowPositionMap());
+  const [virtualizedBodyRef, setVirtualizedBodyRef] = React.useState(null);
+  const handlerRef = React.useRef();
+  const autoScrollTo = React.useCallback(scrollHeight => {
+    const {
+      itemSize = () => rowHeight
+    } = listProps;
+    const idx = rows.findIndex(item => item[rowKey] === autoScrollToId);
+    let val = rowPositionMap.current[idx] || 0;
+    const lastPositionIdx = rowPositionMap.current.length - 1;
+    let lastPosition = 0;
 
     if (lastPositionIdx > -1) {
       lastPosition = rowPositionMap.current[lastPositionIdx] - scrollHeight + itemSize(lastPositionIdx);
@@ -133,38 +103,36 @@ var VirtualizedBody = function VirtualizedBody(props) {
       }
     }
   }, [rows, virtualizedBodyRef]);
-  React.useEffect(function () {
+  React.useEffect(() => {
     autoScrollTo(visibleHeight);
   }, [autoScrollToId, visibleHeight]);
-  var handler = React.useCallback(dsUtilities.debounce(function (_ref) {
-    var target = _ref.target;
+  const handler = React.useCallback(dsUtilities.debounce(_ref => {
+    let {
+      target
+    } = _ref;
     // Update coordinates
     setScrollTop(target.scrollTop || 0);
   }, 100), [setScrollTop]);
-  React.useEffect(function () {
+  React.useEffect(() => {
     setScrollTop(0);
   }, [filters]);
-  React.useEffect(function () {
+  React.useEffect(() => {
     handlerRef.current = handler;
   }, [handler]);
-  React.useLayoutEffect(function () {
-    var top = Math.ceil(scrollTop / rowHeight);
-    var bot = Math.ceil((scrollTop + visibleHeight) / rowHeight);
+  React.useLayoutEffect(() => {
+    let top = Math.ceil(scrollTop / rowHeight);
+    let bot = Math.ceil((scrollTop + visibleHeight) / rowHeight);
 
     if (expandable) {
       // updateMapperFirst
       rowPositionMap.current = generateRowPositionMap();
-      top = rowPositionMap.current.findIndex(function (item) {
-        return item > scrollTop;
-      });
-      bot = rowPositionMap.current.findIndex(function (item) {
-        return item > scrollTop + visibleHeight;
-      });
+      top = rowPositionMap.current.findIndex(item => item > scrollTop);
+      bot = rowPositionMap.current.findIndex(item => item > scrollTop + visibleHeight);
       if (bot === -1) bot = rowPositionMap.current.length;
     }
 
-    var upperBound = top - 1 - overscanCount;
-    var lowerBound = bot - 1 + overscanCount;
+    let upperBound = top - 1 - overscanCount;
+    let lowerBound = bot - 1 + overscanCount;
 
     if (upperBound < 0) {
       upperBound = 0;
@@ -182,9 +150,9 @@ var VirtualizedBody = function VirtualizedBody(props) {
     setHasScroll(visibleHeight < getHeight());
     setRenderedIndexes([upperBound, lowerBound]);
   }, [visibleHeight, scrollTop, rows]);
-  React.useLayoutEffect(function () {
+  React.useLayoutEffect(() => {
     if (virtualizedBodyRef) {
-      var parsedVisibleHeight = parseFloat(window.getComputedStyle(virtualizedBodyRef, null).getPropertyValue('height')); // eslint-disable-next-line no-restricted-globals
+      const parsedVisibleHeight = parseFloat(window.getComputedStyle(virtualizedBodyRef, null).getPropertyValue('height')); // eslint-disable-next-line no-restricted-globals
 
       if (!dsUtilities.isNaN(parsedVisibleHeight)) {
         setVisibleHeight(parsedVisibleHeight);
@@ -192,25 +160,21 @@ var VirtualizedBody = function VirtualizedBody(props) {
       }
     }
   }, [rows, virtualizedBodyRef]);
-  React.useEffect(function () {
+  React.useEffect(() => {
     if (virtualizedBodyRef) {
-      var eventListener = function eventListener(event) {
-        return handlerRef.current(event);
-      };
+      const eventListener = event => handlerRef.current(event);
 
       virtualizedBodyRef.addEventListener('scroll', eventListener);
-      return function () {
+      return () => {
         virtualizedBodyRef.removeEventListener('scroll', eventListener);
       };
     }
 
-    return function () {
-      return null;
-    };
+    return () => null;
   }, [virtualizedBodyRef]);
 
-  var getHeight = function getHeight() {
-    var returnHeight = 0;
+  const getHeight = () => {
+    let returnHeight = 0;
 
     if (expandable) {
       returnHeight = getCalculatedHeightBetweenIndexes(0, rows.length) + 8;
@@ -228,8 +192,10 @@ var VirtualizedBody = function VirtualizedBody(props) {
     return returnHeight;
   };
 
-  var getRowStyle = function getRowStyle(row, index, specificRowHeight) {
-    var itemSize = listProps.itemSize;
+  const getRowStyle = (row, index, specificRowHeight) => {
+    const {
+      itemSize
+    } = listProps;
 
     if (!expandable && rowStyleCache.current[index]) {
       return rowStyleCache.current[index];
@@ -245,90 +211,65 @@ var VirtualizedBody = function VirtualizedBody(props) {
     return rowStyleCache.current[index];
   };
 
-  var generateRenderedRows = function generateRenderedRows() {
-    return rows.slice(renderedIndexes[0], renderedIndexes[1] + 1).map(function (_, index) {
-      return /*#__PURE__*/React__default['default'].createElement(plugins_virtualization_VirtualizedBodyRow, {
-        data: {
-          rows: rows,
-          columns: columns,
-          rowKey: rowKey,
-          renderer: {
-            rowRenderer: rowRenderer
-          }
-        },
-        index: renderedIndexes[0] + index,
-        key: rows[renderedIndexes[0] + index][rowKey],
-        style: getRowStyle(rows[renderedIndexes[0] + index], renderedIndexes[0] + index, rowHeight)
-      });
-    });
-  };
+  const generateRenderedRows = () => rows.slice(renderedIndexes[0], renderedIndexes[1] + 1).map((_, index) => /*#__PURE__*/_jsx__default["default"](VirtualizedBodyRow, {
+    data: {
+      rows,
+      columns,
+      rowKey,
+      renderer: {
+        rowRenderer
+      }
+    },
+    index: renderedIndexes[0] + index,
+    style: getRowStyle(rows[renderedIndexes[0] + index], renderedIndexes[0] + index, rowHeight)
+  }, rows[renderedIndexes[0] + index][rowKey]));
 
-  var wrapperStyle = _objectSpread({
+  const wrapperStyle = _objectSpread({
     height: '100%'
-  }, plugins_virtualization_helper.isSafari ? wrapperSafari : wrapperGeneric);
+  }, helper.isSafari ? wrapperSafari : wrapperGeneric);
 
-  var bodyStyle = {
+  const bodyStyle = {
     height: getHeight(),
     willChange: 'transform',
     backfaceVisibility: 'hidden'
   };
-  return /*#__PURE__*/React__default['default'].createElement(Component, _extends__default['default']({}, props, {
-    innerRef: innerRef
-  }), !isPlaceholderActive ? /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "virtualized-body-wrapper",
-    style: wrapperStyle,
-    ref: function ref(elem) {
-      if (elem) {
-        if (plugins_virtualization_helper.isSafari) {
-          setVirtualizedBodyRef(elem.parentElement); // eslint-disable-next-line no-param-reassign
-
-          elem.parentElement.scrollTop = scrollTop;
-          dsUtilities.mergeRefs(listProps.outerRef)(elem.parentElement);
-        } else {
-          setVirtualizedBodyRef(elem);
-          dsUtilities.mergeRefs(listProps.outerRef)(elem);
-        }
-      }
-    }
-  }, /*#__PURE__*/React__default['default'].createElement("div", {
-    "data-testid": "virtualized-body",
-    className: "virtualized-body".concat(hasScrollBar ? ' with-scrollbar' : ''),
-    style: bodyStyle,
-    ref: function ref(r) {
-      dsUtilities.mergeRefs(innerBody)(r);
-    }
-  }, generateRenderedRows())) : /*#__PURE__*/React__default['default'].createElement(components_NoResults, {
+  return /*#__PURE__*/jsxRuntime.jsx(Component, _objectSpread(_objectSpread({}, props), {}, {
     innerRef: innerRef,
-    rowRenderer: rowRenderer
-  }, noResultsPlaceholder));
+    children: !isPlaceholderActive ? /*#__PURE__*/jsxRuntime.jsx("div", {
+      className: "virtualized-body-wrapper",
+      style: wrapperStyle,
+      ref: elem => {
+        if (elem) {
+          if (helper.isSafari) {
+            setVirtualizedBodyRef(elem.parentElement); // eslint-disable-next-line no-param-reassign
+
+            elem.parentElement.scrollTop = scrollTop;
+            dsUtilities.mergeRefs(listProps.outerRef)(elem.parentElement);
+          } else {
+            setVirtualizedBodyRef(elem);
+            dsUtilities.mergeRefs(listProps.outerRef)(elem);
+          }
+        }
+      },
+      children: /*#__PURE__*/jsxRuntime.jsx("div", {
+        "data-testid": "virtualized-body",
+        className: "virtualized-body".concat(hasScrollBar ? ' with-scrollbar' : ''),
+        style: bodyStyle,
+        ref: r => {
+          dsUtilities.mergeRefs(innerBody)(r);
+        },
+        children: generateRenderedRows()
+      })
+    }) : /*#__PURE__*/_jsx__default["default"](NoResults, {
+      innerRef: innerRef,
+      rowRenderer: rowRenderer
+    }, void 0, noResultsPlaceholder)
+  }));
 };
 
 VirtualizedBody.defaultProps = {
   rows: [],
   overscanCount: 10
 };
-VirtualizedBody.propTypes = {
-  autoScrollToId: PropTypes__default['default'].number,
-  columns: PropTypes__default['default'].arrayOf(PropTypes__default['default'].shape({})),
-  component: PropTypes__default['default'].element,
-  expandable: PropTypes__default['default'].bool,
-  filters: PropTypes__default['default'].any,
-  innerRef: PropTypes__default['default'].any,
-  innerBody: PropTypes__default['default'].any,
-  isPlaceholderActive: PropTypes__default['default'].bool,
-  listProps: PropTypes__default['default'].shape({
-    itemSize: PropTypes__default['default'].func,
-    outerRef: PropTypes__default['default'].any
-  }),
-  noResultsPlaceholder: PropTypes__default['default'].oneOf([PropTypes__default['default'].string, PropTypes__default['default'].element]),
-  overscanCount: PropTypes__default['default'].number,
-  rows: PropTypes__default['default'].arrayOf(PropTypes__default['default'].shape({})),
-  rowHeight: PropTypes__default['default'].number,
-  rowKey: PropTypes__default['default'].string,
-  rowRenderer: PropTypes__default['default'].element,
-  rowSize: PropTypes__default['default'].any,
-  setHasScroll: PropTypes__default['default'].func
-};
 
 module.exports = VirtualizedBody;
-//# sourceMappingURL=VirtualizedBody.js.map