@bigbinary/neetoui 8.3.17 → 8.3.18

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -26,7 +26,7 @@ import 'react-i18next';
26
26
  import './useRecentlyUsedColors-CJe4G0Xs.js';
27
27
  import './Dropdown.js';
28
28
  import './index-BCP3m_SF.js';
29
- export { D as default } from './index-ffKXwGCh.js';
29
+ export { D as default } from './index-DqcLcdQ2.js';
30
30
  import './Input.js';
31
31
  import './Label.js';
32
32
  import './MultiEmailInput.js';
@@ -62,7 +62,7 @@ import './Switch.js';
62
62
  import './Tab.js';
63
63
  import 'antd/lib/table';
64
64
  import 'react-drag-listview';
65
- import './useRestoreScrollPosition-B3J6xSHt.js';
65
+ import './useRestoreScrollPosition-9jPpcAT1.js';
66
66
  import 'react-resizable';
67
67
  import './Tag.js';
68
68
  import './Toastr.js';
package/dist/Table.js CHANGED
@@ -20,7 +20,7 @@ import { u as useQueryParams } from './useQueryParams-b60CHFUx.js';
20
20
  import Button from './Button.js';
21
21
  import Callout from './Callout.js';
22
22
  import Typography from './Typography.js';
23
- import { T as TABLE_SORT_ORDERS, U as URL_SORT_ORDERS, H as HeaderCellMenu, C as COLUMN_FIXED_VALUES, S as SELECT_ALL_ROWS_CALLOUT_MOBILE_HEIGHT, a as SELECT_ALL_ROWS_CALLOUT_DESKTOP_HEIGHT, u as useRestoreScrollPosition } from './useRestoreScrollPosition-B3J6xSHt.js';
23
+ import { T as TABLE_SORT_ORDERS, U as URL_SORT_ORDERS, H as HeaderCellMenu, a as TABLE_PAGINATION_HEIGHT, b as TABLE_ROW_HEIGHT, C as COLUMN_FIXED_VALUES, S as SELECT_ALL_ROWS_CALLOUT_MOBILE_HEIGHT, c as SELECT_ALL_ROWS_CALLOUT_DESKTOP_HEIGHT, u as useRestoreScrollPosition, d as TABLE_DEFAULT_HEADER_HEIGHT } from './useRestoreScrollPosition-9jPpcAT1.js';
24
24
  import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
25
25
  import Popover from './Popover.js';
26
26
  import { Resizable } from 'react-resizable';
@@ -206,6 +206,7 @@ var TitleWithInfoIcon = function TitleWithInfoIcon(_ref) {
206
206
  style: "body2"
207
207
  }, description))));
208
208
  };
209
+ var TitleWithInfoIcon$1 = /*#__PURE__*/React__default.memo(TitleWithInfoIcon);
209
210
 
210
211
  var _excluded$4 = ["children", "isSortable", "isAddEnabled", "sortedInfo", "onSort", "isHidable", "isDeletable", "isFixedColumn", "isColumnFreezeEnabled", "onColumnHide", "onAddColumn", "onColumnDelete", "onColumnFreeze", "onMoreActionClick", "column", "moreActions"];
211
212
  var CellContent = function CellContent(_ref) {
@@ -260,6 +261,7 @@ var CellContent = function CellContent(_ref) {
260
261
  isHidable: isColumnHidable
261
262
  })));
262
263
  };
264
+ var CellContent$1 = /*#__PURE__*/React__default.memo(CellContent);
263
265
 
264
266
  var _excluded$3 = ["onResize", "width", "onResizeStop", "className"];
265
267
  var HeaderCell = function HeaderCell(props) {
@@ -269,7 +271,7 @@ var HeaderCell = function HeaderCell(props) {
269
271
  className = props.className,
270
272
  restProps = _objectWithoutProperties(props, _excluded$3);
271
273
  if (!width) {
272
- return /*#__PURE__*/React__default.createElement(CellContent, _extends({}, restProps, {
274
+ return /*#__PURE__*/React__default.createElement(CellContent$1, _extends({}, restProps, {
273
275
  className: classnames(className, "drag-handler")
274
276
  }));
275
277
  }
@@ -290,10 +292,11 @@ var HeaderCell = function HeaderCell(props) {
290
292
  onResizeStart: function onResizeStart(e) {
291
293
  e.preventDefault();
292
294
  }
293
- }, /*#__PURE__*/React__default.createElement(CellContent, _extends({}, restProps, {
295
+ }, /*#__PURE__*/React__default.createElement(CellContent$1, _extends({}, restProps, {
294
296
  className: classnames(className, "drag-handler")
295
297
  })));
296
298
  };
299
+ var HeaderCell$1 = /*#__PURE__*/React__default.memo(HeaderCell);
297
300
 
298
301
  var _excluded$2 = ["onResize", "width", "onResizeStop", "onResizeStart"];
299
302
  var ResizableHeaderCell = function ResizableHeaderCell(props) {
@@ -307,7 +310,7 @@ var ResizableHeaderCell = function ResizableHeaderCell(props) {
307
310
  isResizing = _useState2[0],
308
311
  setIsResizing = _useState2[1];
309
312
  if (!width) {
310
- return /*#__PURE__*/React__default.createElement(CellContent, restProps);
313
+ return /*#__PURE__*/React__default.createElement(CellContent$1, restProps);
311
314
  }
312
315
  return /*#__PURE__*/React__default.createElement(Resizable, _defineProperty({
313
316
  onResize: onResize,
@@ -335,14 +338,15 @@ var ResizableHeaderCell = function ResizableHeaderCell(props) {
335
338
  }, "onResizeStop", function onResizeStop(e, data) {
336
339
  setIsResizing(false);
337
340
  _onResizeStop === null || _onResizeStop === void 0 || _onResizeStop(e, data);
338
- }), /*#__PURE__*/React__default.createElement(CellContent, restProps));
341
+ }), /*#__PURE__*/React__default.createElement(CellContent$1, restProps));
339
342
  };
343
+ var ResizableHeaderCell$1 = /*#__PURE__*/React__default.memo(ResizableHeaderCell);
340
344
 
341
345
  var _excluded$1 = ["className"];
342
346
  var ReorderableHeaderCell = function ReorderableHeaderCell(_ref) {
343
347
  var className = _ref.className,
344
348
  props = _objectWithoutProperties(_ref, _excluded$1);
345
- return /*#__PURE__*/React__default.createElement(CellContent, _extends({}, props, {
349
+ return /*#__PURE__*/React__default.createElement(CellContent$1, _extends({}, props, {
346
350
  className: classnames(className, "drag-handler")
347
351
  }));
348
352
  };
@@ -362,16 +366,16 @@ var getHeaderCell = function getHeaderCell(_ref) {
362
366
  var enableColumnResize = _ref.enableColumnResize,
363
367
  enableColumnReorder = _ref.enableColumnReorder;
364
368
  if (enableColumnReorder && enableColumnResize) return {
365
- cell: HeaderCell
369
+ cell: HeaderCell$1
366
370
  };
367
371
  if (enableColumnResize) return {
368
- cell: ResizableHeaderCell
372
+ cell: ResizableHeaderCell$1
369
373
  };
370
374
  if (enableColumnReorder) return {
371
375
  cell: ReorderableHeaderCell
372
376
  };
373
377
  return {
374
- cell: CellContent
378
+ cell: CellContent$1
375
379
  };
376
380
  };
377
381
  var isIncludedIn = function isIncludedIn(array1, array2) {
@@ -423,6 +427,11 @@ var getSortField = function getSortField(field) {
423
427
  }
424
428
  return camelToSnakeCase(field);
425
429
  };
430
+ var calculateRowsPerPage = function calculateRowsPerPage() {
431
+ var viewportHeight = window.innerHeight;
432
+ var rowsPerPage = Math.floor((viewportHeight - TABLE_PAGINATION_HEIGHT) / TABLE_ROW_HEIGHT * 3);
433
+ return Math.ceil(rowsPerPage / 10) * 10;
434
+ };
426
435
 
427
436
  function ownKeys$2(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; }
428
437
  function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$2(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$2(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -488,7 +497,7 @@ var useResizableColumns = function useResizableColumns(_ref) {
488
497
  sortOrder: getColumnSortOrder(col, sortedInfo),
489
498
  fixed: fixed,
490
499
  title: col.description ? function (props) {
491
- return /*#__PURE__*/React__default.createElement(TitleWithInfoIcon, _extends({}, props, {
500
+ return /*#__PURE__*/React__default.createElement(TitleWithInfoIcon$1, _extends({}, props, {
492
501
  description: col.description,
493
502
  title: col.title
494
503
  }));
@@ -588,6 +597,63 @@ var useColumns = function useColumns(_ref) {
588
597
  };
589
598
  };
590
599
 
600
+ var useScroll = function useScroll(_ref) {
601
+ var fixedHeight = _ref.fixedHeight,
602
+ enableColumnReorder = _ref.enableColumnReorder,
603
+ loading = _ref.loading,
604
+ otherProps = _ref.otherProps,
605
+ rowData = _ref.rowData,
606
+ pageSize = _ref.pageSize,
607
+ shouldShowSelectAllRowsCallout = _ref.shouldShowSelectAllRowsCallout,
608
+ shouldShowAllRowsSelectedCallout = _ref.shouldShowAllRowsSelectedCallout,
609
+ headerHeight = _ref.headerHeight;
610
+ var _useState = useState(0),
611
+ _useState2 = _slicedToArray(_useState, 2),
612
+ containerHeight = _useState2[0],
613
+ setContainerHeight = _useState2[1];
614
+ var resizeObserver = useRef(new ResizeObserver(function (_ref2) {
615
+ var _ref3 = _slicedToArray(_ref2, 1),
616
+ entry = _ref3[0];
617
+ return setContainerHeight(entry.contentRect.height);
618
+ }));
619
+ var scrollRef = useRef(null);
620
+ var tableRef = useCallback(function (table) {
621
+ scrollRef.current = table;
622
+ if (!fixedHeight) return;
623
+ var observer = resizeObserver.current;
624
+ if (table !== null) {
625
+ var _table$parentNode;
626
+ var targetNode = enableColumnReorder ? table === null || table === void 0 || (_table$parentNode = table.parentNode) === null || _table$parentNode === void 0 ? void 0 : _table$parentNode.parentNode : table === null || table === void 0 ? void 0 : table.parentNode;
627
+ observer.observe(targetNode);
628
+ } else if (observer) {
629
+ observer.disconnect();
630
+ }
631
+ }, [resizeObserver.current, fixedHeight, enableColumnReorder]);
632
+ var _useRestoreScrollPosi = useRestoreScrollPosition({
633
+ tableRef: tableRef,
634
+ scrollRef: scrollRef,
635
+ loading: loading
636
+ }),
637
+ handleScroll = _useRestoreScrollPosi.handleScroll;
638
+ var calculateTableContainerHeight = function calculateTableContainerHeight() {
639
+ var isPaginationVisible = otherProps.pagination !== false && rowData.length > pageSize;
640
+ var selectAllRowsCalloutHeight = 0;
641
+ if (shouldShowSelectAllRowsCallout || shouldShowAllRowsSelectedCallout) {
642
+ selectAllRowsCalloutHeight = getSelectAllRowsCalloutHeight();
643
+ }
644
+ return containerHeight - headerHeight - (isPaginationVisible ? TABLE_PAGINATION_HEIGHT : 0) - selectAllRowsCalloutHeight;
645
+ };
646
+ return {
647
+ tableRef: tableRef,
648
+ tableContainerRef: null,
649
+ handleScroll: handleScroll,
650
+ calculatedScroll: {
651
+ x: "max-content",
652
+ y: calculateTableContainerHeight()
653
+ }
654
+ };
655
+ };
656
+
591
657
  var useTableSort = function useTableSort() {
592
658
  var queryParams = useQueryParams();
593
659
  var _useState = useState(function () {
@@ -616,12 +682,58 @@ var useTableSort = function useTableSort() {
616
682
  };
617
683
  };
618
684
 
619
- var _excluded = ["allowRowClick", "enableColumnResize", "enableColumnReorder", "enableColumnFreeze", "enableAddColumn", "className", "columnData", "currentPageNumber", "defaultPageSize", "handlePageChange", "loading", "onRowClick", "onRowSelect", "rowData", "totalCount", "selectedRowKeys", "fixedHeight", "paginationProps", "rowKey", "scroll", "rowSelection", "shouldDynamicallyRenderRowSize", "bordered", "onColumnUpdate", "components", "onColumnHide", "onColumnAdd", "onColumnDelete", "onChange", "onMoreActionClick", "bulkSelectAllRowsProps", "localStorageKeyPrefix"];
685
+ var useVirtualScroll = function useVirtualScroll(_ref) {
686
+ var otherProps = _ref.otherProps,
687
+ rowData = _ref.rowData,
688
+ pageSize = _ref.pageSize,
689
+ shouldShowSelectAllRowsCallout = _ref.shouldShowSelectAllRowsCallout,
690
+ shouldShowAllRowsSelectedCallout = _ref.shouldShowAllRowsSelectedCallout,
691
+ headerHeight = _ref.headerHeight;
692
+ var _useState = useState({
693
+ top: 0,
694
+ left: 0
695
+ }),
696
+ _useState2 = _slicedToArray(_useState, 2),
697
+ containerRect = _useState2[0],
698
+ setContainerRect = _useState2[1];
699
+ var tableContainerRef = useRef(null);
700
+ useEffect(function () {
701
+ var updateContainerRect = function updateContainerRect() {
702
+ if (!tableContainerRef.current) return;
703
+ var rect = tableContainerRef.current.getBoundingClientRect();
704
+ setContainerRect(rect);
705
+ };
706
+ updateContainerRect();
707
+ window.addEventListener("scroll", updateContainerRect);
708
+ window.addEventListener("resize", updateContainerRect);
709
+ return function () {
710
+ window.removeEventListener("scroll", updateContainerRect);
711
+ window.removeEventListener("resize", updateContainerRect);
712
+ };
713
+ }, []);
714
+ var calculateTableContainerHeight = function calculateTableContainerHeight() {
715
+ var isPaginationVisible = otherProps.pagination !== false && rowData.length > pageSize;
716
+ var selectAllRowsCalloutHeight = 0;
717
+ if (shouldShowSelectAllRowsCallout || shouldShowAllRowsSelectedCallout) {
718
+ selectAllRowsCalloutHeight = getSelectAllRowsCalloutHeight();
719
+ }
720
+ var containerHeight = window.innerHeight - containerRect.top;
721
+ return containerHeight - headerHeight - (isPaginationVisible ? TABLE_PAGINATION_HEIGHT : 0) - selectAllRowsCalloutHeight;
722
+ };
723
+ return {
724
+ tableRef: null,
725
+ tableContainerRef: tableContainerRef,
726
+ handleScroll: noop,
727
+ calculatedScroll: {
728
+ x: window.innerWidth - (containerRect === null || containerRect === void 0 ? void 0 : containerRect.left),
729
+ y: calculateTableContainerHeight()
730
+ }
731
+ };
732
+ };
733
+
734
+ var _excluded = ["allowRowClick", "enableColumnResize", "enableColumnReorder", "enableColumnFreeze", "enableAddColumn", "className", "columnData", "currentPageNumber", "defaultPageSize", "handlePageChange", "loading", "onRowClick", "onRowSelect", "rowData", "totalCount", "selectedRowKeys", "fixedHeight", "paginationProps", "rowKey", "scroll", "rowSelection", "shouldDynamicallyRenderRowSize", "bordered", "onColumnUpdate", "components", "onColumnHide", "onColumnAdd", "onColumnDelete", "onChange", "onMoreActionClick", "bulkSelectAllRowsProps", "localStorageKeyPrefix", "virtual"];
620
735
  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; }
621
736
  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; }
622
- var TABLE_PAGINATION_HEIGHT = 64;
623
- var TABLE_DEFAULT_HEADER_HEIGHT = 40;
624
- var TABLE_ROW_HEIGHT = 52;
625
737
  var Table = function Table(_ref) {
626
738
  var _ref$allowRowClick = _ref.allowRowClick,
627
739
  allowRowClick = _ref$allowRowClick === void 0 ? true : _ref$allowRowClick,
@@ -677,29 +789,27 @@ var Table = function Table(_ref) {
677
789
  onMoreActionClick = _ref.onMoreActionClick,
678
790
  bulkSelectAllRowsProps = _ref.bulkSelectAllRowsProps,
679
791
  localStorageKeyPrefix = _ref.localStorageKeyPrefix,
792
+ _ref$virtual = _ref.virtual,
793
+ virtual = _ref$virtual === void 0 ? false : _ref$virtual,
680
794
  otherProps = _objectWithoutProperties(_ref, _excluded);
681
795
  var _useTranslation = useTranslation(),
682
796
  i18n = _useTranslation.i18n;
683
- var _useState = useState(null),
797
+ var _useState = useState(TABLE_DEFAULT_HEADER_HEIGHT),
684
798
  _useState2 = _slicedToArray(_useState, 2),
685
- containerHeight = _useState2[0],
686
- setContainerHeight = _useState2[1];
687
- var _useState3 = useState(TABLE_DEFAULT_HEADER_HEIGHT),
799
+ headerHeight = _useState2[0],
800
+ setHeaderHeight = _useState2[1];
801
+ var _useState3 = useState(columnData),
688
802
  _useState4 = _slicedToArray(_useState3, 2),
689
- headerHeight = _useState4[0],
690
- setHeaderHeight = _useState4[1];
691
- var _useState5 = useState(columnData),
803
+ columns = _useState4[0],
804
+ setColumns = _useState4[1];
805
+ var _useState5 = useState(false),
692
806
  _useState6 = _slicedToArray(_useState5, 2),
693
- columns = _useState6[0],
694
- setColumns = _useState6[1];
695
- var _useState7 = useState(false),
807
+ bulkSelectedAllRows = _useState6[0],
808
+ setBulkSelectedAllRows = _useState6[1];
809
+ var _useState7 = useState({}),
696
810
  _useState8 = _slicedToArray(_useState7, 2),
697
- bulkSelectedAllRows = _useState8[0],
698
- setBulkSelectedAllRows = _useState8[1];
699
- var _useState9 = useState({}),
700
- _useState10 = _slicedToArray(_useState9, 2),
701
- columnChanges = _useState10[0],
702
- setColumnChanges = _useState10[1];
811
+ columnChanges = _useState8[0],
812
+ setColumnChanges = _useState8[1];
703
813
  var _useTableSort = useTableSort(),
704
814
  handleTableSortChange = _useTableSort.handleTableChange,
705
815
  sortedInfo = _useTableSort.sortedInfo,
@@ -710,30 +820,6 @@ var Table = function Table(_ref) {
710
820
  var history = useHistory();
711
821
  var headerRef = useRef();
712
822
  var tableOnChangeProps = useRef({});
713
- var resizeObserver = useRef(new ResizeObserver(function (_ref3) {
714
- var _ref4 = _slicedToArray(_ref3, 1),
715
- entry = _ref4[0];
716
- return setContainerHeight(entry.contentRect.height);
717
- }));
718
- var scrollRef = useRef(null);
719
- var tableRef = useCallback(function (table) {
720
- scrollRef.current = table;
721
- if (!fixedHeight) return;
722
- var observer = resizeObserver.current;
723
- if (table !== null) {
724
- var _table$parentNode;
725
- var targetNode = enableColumnReorder ? table === null || table === void 0 || (_table$parentNode = table.parentNode) === null || _table$parentNode === void 0 ? void 0 : _table$parentNode.parentNode : table === null || table === void 0 ? void 0 : table.parentNode;
726
- observer.observe(targetNode);
727
- } else if (observer) {
728
- observer.disconnect();
729
- }
730
- }, [resizeObserver.current, fixedHeight, enableColumnReorder]);
731
- var _useRestoreScrollPosi = useRestoreScrollPosition({
732
- tableRef: tableRef,
733
- scrollRef: scrollRef,
734
- loading: loading
735
- }),
736
- handleScroll = _useRestoreScrollPosi.handleScroll;
737
823
  useTimeout(function () {
738
824
  var headerHeight = headerRef.current ? headerRef.current.offsetHeight : TABLE_DEFAULT_HEADER_HEIGHT;
739
825
  setHeaderHeight(headerHeight);
@@ -800,6 +886,22 @@ var Table = function Table(_ref) {
800
886
  }, [selectedRowKeys, rowKey, rowData, totalCount, bulkSelectedAllRows]);
801
887
  var shouldShowSelectAllRowsCallout = bulkSelectAllRowsProps && showBulkSelectionCallout;
802
888
  var shouldShowAllRowsSelectedCallout = bulkSelectAllRowsProps && bulkSelectedAllRows;
889
+ var pageSize = shouldDynamicallyRenderRowSize ? calculateRowsPerPage() : paginationProps.pageSize || defaultPageSize;
890
+ var _ref3 = (virtual ? useVirtualScroll : useScroll)({
891
+ fixedHeight: fixedHeight,
892
+ enableColumnReorder: enableColumnReorder,
893
+ loading: loading,
894
+ otherProps: otherProps,
895
+ rowData: rowData,
896
+ pageSize: pageSize,
897
+ shouldShowSelectAllRowsCallout: shouldShowSelectAllRowsCallout,
898
+ shouldShowAllRowsSelectedCallout: shouldShowAllRowsSelectedCallout,
899
+ headerHeight: headerHeight
900
+ }),
901
+ tableRef = _ref3.tableRef,
902
+ tableContainerRef = _ref3.tableContainerRef,
903
+ handleScroll = _ref3.handleScroll,
904
+ calculatedScroll = _ref3.calculatedScroll;
803
905
  var handleRowChange = function handleRowChange(selectedRowKeys, selectedRows) {
804
906
  var tableWrapper = document.querySelector('[data-testid="table-wrapper"]');
805
907
  if (selectedRowKeys.length !== defaultPageSize) {
@@ -813,7 +915,8 @@ var Table = function Table(_ref) {
813
915
  };
814
916
  var rowSelectionProps = rowSelection ? _objectSpread(_objectSpread({
815
917
  type: "checkbox",
816
- preserveSelectedRowKeys: true
918
+ preserveSelectedRowKeys: true,
919
+ columnWidth: 48
817
920
  }, rowSelection), {}, {
818
921
  onChange: handleRowChange,
819
922
  selectedRowKeys: selectedRowKeys
@@ -835,20 +938,6 @@ var Table = function Table(_ref) {
835
938
  enableColumnReorder: enableColumnReorder
836
939
  })
837
940
  });
838
- var calculateRowsPerPage = function calculateRowsPerPage() {
839
- var viewportHeight = window.innerHeight;
840
- var rowsPerPage = Math.floor((viewportHeight - TABLE_PAGINATION_HEIGHT) / TABLE_ROW_HEIGHT * 3);
841
- return Math.ceil(rowsPerPage / 10) * 10;
842
- };
843
- var pageSize = shouldDynamicallyRenderRowSize ? calculateRowsPerPage() : paginationProps.pageSize || defaultPageSize;
844
- var calculateTableContainerHeight = function calculateTableContainerHeight() {
845
- var isPaginationVisible = otherProps.pagination !== false && rowData.length > pageSize;
846
- var selectAllRowsCalloutHeight = 0;
847
- if (shouldShowSelectAllRowsCallout || shouldShowAllRowsSelectedCallout) {
848
- selectAllRowsCalloutHeight = getSelectAllRowsCalloutHeight();
849
- }
850
- return containerHeight - headerHeight - (isPaginationVisible ? TABLE_PAGINATION_HEIGHT : 0) - selectAllRowsCalloutHeight;
851
- };
852
941
  var calculatePageSizeOptions = function calculatePageSizeOptions() {
853
942
  return dynamicArray(5, function (index) {
854
943
  return (index + 1) * pageSize;
@@ -959,6 +1048,7 @@ var Table = function Table(_ref) {
959
1048
  bordered: bordered,
960
1049
  locale: locale,
961
1050
  rowKey: rowKey,
1051
+ virtual: virtual,
962
1052
  columns: sortedColumns,
963
1053
  components: componentOverrides,
964
1054
  dataSource: rowData,
@@ -968,6 +1058,7 @@ var Table = function Table(_ref) {
968
1058
  },
969
1059
  ref: tableRef,
970
1060
  rowSelection: rowSelectionProps,
1061
+ scroll: _objectSpread(_objectSpread({}, calculatedScroll), scroll),
971
1062
  showSorterTooltip: false,
972
1063
  pagination: _objectSpread(_objectSpread({
973
1064
  hideOnSinglePage: true
@@ -983,10 +1074,6 @@ var Table = function Table(_ref) {
983
1074
  rowClassName: classnames("neeto-ui-table--row", {
984
1075
  "neeto-ui-table--row_hover": allowRowClick
985
1076
  }, [className]),
986
- scroll: _objectSpread({
987
- x: "max-content",
988
- y: calculateTableContainerHeight()
989
- }, scroll),
990
1077
  onChange: handleTableChange,
991
1078
  onScroll: handleScroll,
992
1079
  onHeaderRow: function onHeaderRow() {
@@ -1007,7 +1094,12 @@ var Table = function Table(_ref) {
1007
1094
  }
1008
1095
  }, otherProps)));
1009
1096
  };
1010
- return enableColumnReorder ? /*#__PURE__*/React__default.createElement(ReactDragListView.DragColumn, dragProps, renderTable()) : renderTable();
1097
+ var renderTableVirtual = function renderTableVirtual() {
1098
+ return virtual ? /*#__PURE__*/React__default.createElement("div", {
1099
+ ref: tableContainerRef
1100
+ }, renderTable()) : renderTable();
1101
+ };
1102
+ return enableColumnReorder ? /*#__PURE__*/React__default.createElement(ReactDragListView.DragColumn, dragProps, renderTableVirtual()) : renderTableVirtual();
1011
1103
  };
1012
1104
 
1013
1105
  export { Table as default };