@elliemae/ds-data-table 1.61.0 → 2.0.0-alpha.12

package/esm/addons/Filters/index.js

@@ -1,93 +1,7 @@
-export { C as CurrencyRangeFilter, f as DateRangeFilter, g as DateSwitcherFilter, M as MultiSelectFilter, N as NumberRangeFilter, h as SingleDateFilter, S as SingleSelectFilter, i as TextInputFilter } from '../../styled-f76a0cd1.js';
-import 'styled-components';
-import '@elliemae/ds-grid';
-import '@elliemae/ds-icons';
-import '../../helpers/sizeToCss.js';
-import '../../configs/constants.js';
-import '../../helpers/cellPadding.js';
-import 'react';
-import '@babel/runtime/helpers/esm/slicedToArray';
-import 'react-virtual';
-import '../../configs/useRowFlattenization.js';
-import '../../helpers/getIdFromUniqueRowAccessor.js';
-import '@babel/runtime/helpers/esm/toConsumableArray';
-import '@babel/runtime/helpers/esm/defineProperty';
-import '@elliemae/ds-form';
-import '@babel/runtime/helpers/esm/extends';
-import 'react-redux';
-import '../../DataTableContext.js';
-import '../Pagination/Pagination.js';
-import '@elliemae/ds-pagination';
-import '@elliemae/ds-indeterminate-progress-indicator';
-import '@elliemae/ds-circular-progress-indicator';
-import '../../parts/EmptyContent.js';
-import '@elliemae/ds-system';
-import '@elliemae/ds-button';
-import 'prop-types';
-import '../../helpers/refs-helpers.js';
-import '../../parts/HoC/SortableItemContext.js';
-import '../../parts/HoC/withDnDSortableRowContext.js';
-import '@dnd-kit/sortable';
-import '../../parts/HoC/withConditionalDnDRowContext.js';
-import '@dnd-kit/core';
-import '../../helpers/dndkit/tree/useTreeDndkitConfig.js';
-import '../../helpers/dndkit/tree/useTreePreviewHandlers.js';
-import '../../helpers/dndkit/tree/getTreeKeyboardCoordinates.js';
-import '../../helpers/dndkit/utilities.js';
-import '../../helpers/dndkit/tree/useTreeActionHandlers.js';
-import 'lodash';
-import '../../helpers/dndkit/tree/customCollisionDetection.js';
-import '../../helpers/dndkit/tree/useTreeAnnouncements.js';
-import '../../parts/HoC/DragOverlayContext.js';
-import '@elliemae/ds-popperjs';
-import '../../redux/reducers/index.js';
-import 'redux';
-import '../../redux/reducers/headersReducers/headersReducers.js';
-import '@reduxjs/toolkit';
-import '../../redux/reducers/headersReducers/logic.js';
-import '../../redux/reducers/headersReducers/defaults.js';
-import '../../redux/reducers/headersReducers/useDispatchHeadersActions.js';
-import '../../redux/reducers/rowsReducers/rowsReducer.js';
-import '../../redux/reducers/rowsReducers/logic.js';
-import '../../redux/reducers/rowsReducers/defaults.js';
-import '../../redux/reducers/rowsReducers/useDispatchRowsActions.js';
-import '../../parts/Footer.js';
-import '@elliemae/ds-utilities';
-import 'uid';
-import '../../exported-related/RowVariants.js';
-import '../../exported-related/Filters/singleSelectFilterFn.js';
-import '../../exported-related/Filters/multiSelectFilterFn.js';
-import '../../exported-related/Filters/textFilterFn.js';
-import 'moment';
-import '../../exported-related/Filters/numberRangeFilterFn.js';
-import '../../exported-related/Filters/currencyRangeFilterFn.js';
-import '../../exported-related/FilterTypes.js';
-import '../Columns/ColumnAction/ColumnAction.js';
-import '../../hooks/useRecoverFocusRow.js';
-import '@elliemae/ds-truncated-tooltip-text';
-import '../../prop-types.js';
-import '../../parts/Cells/useCellStyle.js';
-import '../../exported-related/RowRenderer/useRowRendererProperties.js';
-import '../../exported-related/RowRenderer/useRowStyle.js';
-import '../../parts/DropIndicator.js';
-import '../../configs/zIndexInternalConfig.js';
-import '../../helpers/addCellData.js';
-import '../../helpers/dndkit/hierarchy/useHierarchyActionHandlers.js';
-import '../../helpers/dndkit/hierarchy/useHierarchyAnnouncements.js';
-import '../../parts/SortByCaret.js';
-import '@elliemae/ds-controlled-form';
-import '@elliemae/ds-form-layout-blocks';
-import '@elliemae/ds-grid/';
-import '@elliemae/ds-form/ComboBox';
-import '../../helpers/columnsToGrid.js';
-import '../../parts/Headers/useHeaderCellHandlers.js';
-import '../../parts/Headers/useHeaderCellConfig.js';
-import '../../hooks/useRecoverFocusCol.js';
-import '../../parts/Headers/RequiredDot.js';
-import '../../parts/SortableHeaderCell.js';
-import '@babel/runtime/helpers/esm/objectWithoutProperties';
-import '../../parts/HoC/withConditionalDnDSortableContext.js';
-import '../../parts/Headers/EmptyChildrenGroup.js';
-import '../../configs/fixedSizes.js';
-import '../../parts/Loader.js';
-//# sourceMappingURL=index.js.map
+export { DateRangeFilter } from './Components/DateRangeFilter/index.js';
+export { DateSwitcherFilter } from './Components/DateSwitcherFilter/index.js';
+export { NumberRangeFilter } from './Components/NumberRangeFilter/index.js';
+export { CurrencyRangeFilter } from './Components/CurrencyRangeFilter/index.js';
+export { SingleSelectFilter } from './Components/SelectFilter/SingleSelectFilter.js';
+export { MultiSelectFilter } from './Components/SelectFilter/MultiSelectFilter.js';
+export { SingleDateFilter } from './Components/SingleDateFilter/index.js';

package/esm/addons/Pagination/Pagination.js

@@ -1,28 +1,37 @@
-import _extends from '@babel/runtime/helpers/esm/extends';
-import React, { useContext, useMemo, useEffect } from 'react';
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import 'core-js/modules/esnext.async-iterator.map.js';
+import 'core-js/modules/esnext.iterator.map.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 { useContext, useMemo, useEffect } from 'react';
 import { DSPagination } from '@elliemae/ds-pagination';
 import DataTableContext from '../../DataTableContext.js';
-import '../../configs/constants.js';
+import { jsx } from 'react/jsx-runtime';
 
-var Pagination = function Pagination() {
-  var _useContext = useContext(DataTableContext),
-      onPageChanged = _useContext.tableProps.onPageChanged,
-      paginationHelpers = _useContext.paginationHelpers,
-      page = _useContext.flattenedData,
-      totalColumnsWidth = _useContext.layoutHelpers.totalColumnsWidth;
+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; }
 
-  var originalPage = useMemo(function () {
-    return page.map(function (row) {
-      return row.original;
-    });
-  }, [page]);
-  useEffect(function () {
+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(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 Pagination = () => {
+  const {
+    tableProps: {
+      onPageChanged
+    },
+    paginationHelpers,
+    flattenedData: page,
+    layoutHelpers: {
+      totalColumnsWidth
+    }
+  } = useContext(DataTableContext);
+  const originalPage = useMemo(() => page.map(row => row.original), [page]);
+  useEffect(() => {
     onPageChanged(originalPage);
   }, [onPageChanged, originalPage]);
-  return /*#__PURE__*/React.createElement(DSPagination, _extends({}, paginationHelpers, {
+  return /*#__PURE__*/jsx(DSPagination, _objectSpread(_objectSpread({}, paginationHelpers), {}, {
     width: totalColumnsWidth
   }));
 };
 
 export { Pagination };
-//# sourceMappingURL=Pagination.js.map

package/esm/addons/Pagination/index.js

@@ -1,7 +1 @@
 export { Pagination } from './Pagination.js';
-import '@babel/runtime/helpers/esm/extends';
-import 'react';
-import '@elliemae/ds-pagination';
-import '../../DataTableContext.js';
-import '../../configs/constants.js';
-//# sourceMappingURL=index.js.map

package/esm/configs/constants.js

@@ -1,12 +1,12 @@
-var momentFormat = 'MM/DD/YYYY';
-var ColsLayoutStyle;
+const momentFormat = 'MM/DD/YYYY';
+let ColsLayoutStyle;
 
 (function (ColsLayoutStyle) {
   ColsLayoutStyle["Fixed"] = "fixed";
   ColsLayoutStyle["Auto"] = "auto";
 })(ColsLayoutStyle || (ColsLayoutStyle = {}));
 
-var DATA_TESTID = {
+const DATA_TESTID = {
   DATA_TABLE_WRAPPER: 'data-table-wrapper',
   DATA_TABLE_GLOBAL_EXPAND_CELL: 'data-table-global-expand-cell',
   DATA_TABLE_ICON_ARROW_DOWN: 'ic-arrow-head-down',
@@ -42,4 +42,3 @@ var DATA_TESTID = {
 };
 
 export { ColsLayoutStyle, DATA_TESTID, momentFormat };
-//# sourceMappingURL=constants.js.map

package/esm/configs/fixedSizes.js

@@ -1,6 +1,5 @@
-var FIXED_SIZES = {
+const FIXED_SIZES = {
   PAGINATION_HEIGHT: 42
 };
 
 export { FIXED_SIZES };
-//# sourceMappingURL=fixedSizes.js.map

package/esm/configs/index.js

@@ -3,94 +3,3 @@ export { FIXED_SIZES } from './fixedSizes.js';
 export { useDatatableConfig } from './useDatatableConfig.js';
 export { useRowFlattenization } from './useRowFlattenization.js';
 export { ZIndexDataTable } from './zIndexInternalConfig.js';
-import '@babel/runtime/helpers/esm/slicedToArray';
-import 'react';
-import 'react-virtual';
-import '../helpers/columnsToGrid.js';
-import '../helpers/sizeToCss.js';
-import './usePaginationConfig.js';
-import './useTableColsWithAddons.js';
-import '@babel/runtime/helpers/esm/toConsumableArray';
-import '@babel/runtime/helpers/esm/defineProperty';
-import '../addons/Columns/ColumnAction/ColumnAction.js';
-import '../styled-f76a0cd1.js';
-import 'styled-components';
-import '@elliemae/ds-grid';
-import '@elliemae/ds-icons';
-import '../helpers/cellPadding.js';
-import '@elliemae/ds-form';
-import '@babel/runtime/helpers/esm/extends';
-import 'react-redux';
-import '../DataTableContext.js';
-import '../addons/Pagination/Pagination.js';
-import '@elliemae/ds-pagination';
-import '@elliemae/ds-indeterminate-progress-indicator';
-import '@elliemae/ds-circular-progress-indicator';
-import '../parts/EmptyContent.js';
-import '@elliemae/ds-system';
-import '@elliemae/ds-button';
-import 'prop-types';
-import '../helpers/refs-helpers.js';
-import '../parts/HoC/SortableItemContext.js';
-import '../parts/HoC/withDnDSortableRowContext.js';
-import '@dnd-kit/sortable';
-import '../parts/HoC/withConditionalDnDRowContext.js';
-import '@dnd-kit/core';
-import '../helpers/dndkit/tree/useTreeDndkitConfig.js';
-import '../helpers/dndkit/tree/useTreePreviewHandlers.js';
-import '../helpers/dndkit/tree/getTreeKeyboardCoordinates.js';
-import '../helpers/dndkit/utilities.js';
-import '../helpers/dndkit/tree/useTreeActionHandlers.js';
-import 'lodash';
-import '../helpers/dndkit/tree/customCollisionDetection.js';
-import '../helpers/dndkit/tree/useTreeAnnouncements.js';
-import '../parts/HoC/DragOverlayContext.js';
-import '@elliemae/ds-popperjs';
-import '../redux/reducers/index.js';
-import 'redux';
-import '../redux/reducers/headersReducers/headersReducers.js';
-import '@reduxjs/toolkit';
-import '../redux/reducers/headersReducers/logic.js';
-import '../redux/reducers/headersReducers/defaults.js';
-import '../redux/reducers/headersReducers/useDispatchHeadersActions.js';
-import '../redux/reducers/rowsReducers/rowsReducer.js';
-import '../redux/reducers/rowsReducers/logic.js';
-import '../redux/reducers/rowsReducers/defaults.js';
-import '../redux/reducers/rowsReducers/useDispatchRowsActions.js';
-import '../parts/Footer.js';
-import '@elliemae/ds-utilities';
-import 'uid';
-import '../exported-related/RowVariants.js';
-import '../exported-related/Filters/singleSelectFilterFn.js';
-import '../exported-related/Filters/multiSelectFilterFn.js';
-import '../exported-related/Filters/textFilterFn.js';
-import 'moment';
-import '../exported-related/Filters/numberRangeFilterFn.js';
-import '../exported-related/Filters/currencyRangeFilterFn.js';
-import '../exported-related/FilterTypes.js';
-import '../hooks/useRecoverFocusRow.js';
-import '@elliemae/ds-truncated-tooltip-text';
-import '../prop-types.js';
-import '../parts/Cells/useCellStyle.js';
-import '../exported-related/RowRenderer/useRowRendererProperties.js';
-import '../exported-related/RowRenderer/useRowStyle.js';
-import '../parts/DropIndicator.js';
-import '../helpers/addCellData.js';
-import '../helpers/dndkit/hierarchy/useHierarchyActionHandlers.js';
-import '../helpers/dndkit/hierarchy/useHierarchyAnnouncements.js';
-import '../parts/SortByCaret.js';
-import '@elliemae/ds-controlled-form';
-import '@elliemae/ds-form-layout-blocks';
-import '@elliemae/ds-grid/';
-import '@elliemae/ds-form/ComboBox';
-import '../parts/Headers/useHeaderCellHandlers.js';
-import '../parts/Headers/useHeaderCellConfig.js';
-import '../hooks/useRecoverFocusCol.js';
-import '../parts/Headers/RequiredDot.js';
-import '../parts/SortableHeaderCell.js';
-import '@babel/runtime/helpers/esm/objectWithoutProperties';
-import '../parts/HoC/withConditionalDnDSortableContext.js';
-import '../parts/Headers/EmptyChildrenGroup.js';
-import '../parts/Loader.js';
-import '../helpers/getIdFromUniqueRowAccessor.js';
-//# sourceMappingURL=index.js.map

package/esm/configs/useDatatableConfig.js

@@ -1,4 +1,9 @@
-import _slicedToArray from '@babel/runtime/helpers/esm/slicedToArray';
+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/web.dom-collections.iterator.js';
+import 'core-js/modules/esnext.async-iterator.reduce.js';
+import 'core-js/modules/esnext.iterator.reduce.js';
 import { useRef, useMemo, useState, useEffect } from 'react';
 import { useVirtual } from 'react-virtual';
 import { columnsToGrid } from '../helpers/columnsToGrid.js';
@@ -6,118 +11,24 @@ import { useRowFlattenization } from './useRowFlattenization.js';
 import { usePaginationConfig } from './usePaginationConfig.js';
 import useTableColsWithAddons from './useTableColsWithAddons.js';
 import { ColsLayoutStyle } from './constants.js';
-import '../helpers/sizeToCss.js';
-import '../helpers/getIdFromUniqueRowAccessor.js';
-import '@babel/runtime/helpers/esm/toConsumableArray';
-import '@babel/runtime/helpers/esm/defineProperty';
-import '../addons/Columns/ColumnAction/ColumnAction.js';
-import '../styled-f76a0cd1.js';
-import 'styled-components';
-import '@elliemae/ds-grid';
-import '@elliemae/ds-icons';
-import '../helpers/cellPadding.js';
-import '@elliemae/ds-form';
-import '@babel/runtime/helpers/esm/extends';
-import 'react-redux';
-import '../DataTableContext.js';
-import '../addons/Pagination/Pagination.js';
-import '@elliemae/ds-pagination';
-import '@elliemae/ds-indeterminate-progress-indicator';
-import '@elliemae/ds-circular-progress-indicator';
-import '../parts/EmptyContent.js';
-import '@elliemae/ds-system';
-import '@elliemae/ds-button';
-import 'prop-types';
-import '../helpers/refs-helpers.js';
-import '../parts/HoC/SortableItemContext.js';
-import '../parts/HoC/withDnDSortableRowContext.js';
-import '@dnd-kit/sortable';
-import '../parts/HoC/withConditionalDnDRowContext.js';
-import '@dnd-kit/core';
-import '../helpers/dndkit/tree/useTreeDndkitConfig.js';
-import '../helpers/dndkit/tree/useTreePreviewHandlers.js';
-import '../helpers/dndkit/tree/getTreeKeyboardCoordinates.js';
-import '../helpers/dndkit/utilities.js';
-import '../helpers/dndkit/tree/useTreeActionHandlers.js';
-import 'lodash';
-import '../helpers/dndkit/tree/customCollisionDetection.js';
-import '../helpers/dndkit/tree/useTreeAnnouncements.js';
-import '../parts/HoC/DragOverlayContext.js';
-import '@elliemae/ds-popperjs';
-import '../redux/reducers/index.js';
-import 'redux';
-import '../redux/reducers/headersReducers/headersReducers.js';
-import '@reduxjs/toolkit';
-import '../redux/reducers/headersReducers/logic.js';
-import '../redux/reducers/headersReducers/defaults.js';
-import '../redux/reducers/headersReducers/useDispatchHeadersActions.js';
-import '../redux/reducers/rowsReducers/rowsReducer.js';
-import '../redux/reducers/rowsReducers/logic.js';
-import '../redux/reducers/rowsReducers/defaults.js';
-import '../redux/reducers/rowsReducers/useDispatchRowsActions.js';
-import '../parts/Footer.js';
-import '@elliemae/ds-utilities';
-import 'uid';
-import '../exported-related/RowVariants.js';
-import '../exported-related/Filters/singleSelectFilterFn.js';
-import '../exported-related/Filters/multiSelectFilterFn.js';
-import '../exported-related/Filters/textFilterFn.js';
-import 'moment';
-import '../exported-related/Filters/numberRangeFilterFn.js';
-import '../exported-related/Filters/currencyRangeFilterFn.js';
-import '../exported-related/FilterTypes.js';
-import '../hooks/useRecoverFocusRow.js';
-import '@elliemae/ds-truncated-tooltip-text';
-import '../prop-types.js';
-import '../parts/Cells/useCellStyle.js';
-import '../exported-related/RowRenderer/useRowRendererProperties.js';
-import '../exported-related/RowRenderer/useRowStyle.js';
-import '../parts/DropIndicator.js';
-import './zIndexInternalConfig.js';
-import '../helpers/addCellData.js';
-import '../helpers/dndkit/hierarchy/useHierarchyActionHandlers.js';
-import '../helpers/dndkit/hierarchy/useHierarchyAnnouncements.js';
-import '../parts/SortByCaret.js';
-import '@elliemae/ds-controlled-form';
-import '@elliemae/ds-form-layout-blocks';
-import '@elliemae/ds-grid/';
-import '@elliemae/ds-form/ComboBox';
-import '../parts/Headers/useHeaderCellHandlers.js';
-import '../parts/Headers/useHeaderCellConfig.js';
-import '../hooks/useRecoverFocusCol.js';
-import '../parts/Headers/RequiredDot.js';
-import '../parts/SortableHeaderCell.js';
-import '@babel/runtime/helpers/esm/objectWithoutProperties';
-import '../parts/HoC/withConditionalDnDSortableContext.js';
-import '../parts/Headers/EmptyChildrenGroup.js';
-import './fixedSizes.js';
-import '../parts/Loader.js';
 
-var useDatatableConfig = function useDatatableConfig(props) {
+const useDatatableConfig = props => {
   var _columnHeaderRef$curr, _columnHeaderRef$curr2, _columnHeaderRef$curr3;
 
-  var virtualListRef = useRef(null);
-  var columnHeaderRef = useRef(null); // ===========================================================================
+  const virtualListRef = useRef(null);
+  const columnHeaderRef = useRef(null); // ===========================================================================
   // Column config
   // ===========================================================================
 
-  var tableColsWithAddons = useTableColsWithAddons(props);
-  var visibleColumns = useMemo(function () {
-    return tableColsWithAddons.filter(function (col) {
-      return !props.hiddenColumns.includes(col.accessor);
-    });
-  }, [props.hiddenColumns, tableColsWithAddons]); // ===========================================================================
+  const tableColsWithAddons = useTableColsWithAddons(props);
+  const visibleColumns = useMemo(() => tableColsWithAddons.filter(col => !props.hiddenColumns.includes(col.accessor)), [props.hiddenColumns, tableColsWithAddons]); // ===========================================================================
   // Virtualization
   // ===========================================================================
 
-  var _useState = useState(1),
-      _useState2 = _slicedToArray(_useState, 2),
-      dataLength = _useState2[0],
-      setDataLength = _useState2[1]; // estimateSize should not be really required given what was stated on
+  const [dataLength, setDataLength] = useState(1); // estimateSize should not be really required given what was stated on
   // https://github.com/tannerlinsley/react-virtual/issues/23
 
-
-  var virtualListHelpers = useVirtual({
+  const virtualListHelpers = useVirtual({
     size: dataLength,
     parentRef: virtualListRef,
     overscan: 15,
@@ -126,7 +37,7 @@ var useDatatableConfig = function useDatatableConfig(props) {
   // Action ref setup
   // ===========================================================================
 
-  useEffect(function () {
+  useEffect(() => {
     if (props.actionRef) {
       props.actionRef.current.scrollToIndex = virtualListHelpers.scrollToIndex;
       props.actionRef.current.scrollToOffset = virtualListHelpers.scrollToOffset;
@@ -135,53 +46,32 @@ var useDatatableConfig = function useDatatableConfig(props) {
   // Data flattenization and pagination
   // ===========================================================================
 
-  var _useRowFlattenization = useRowFlattenization(props),
-      _useRowFlattenization2 = _slicedToArray(_useRowFlattenization, 2),
-      flattenedData = _useRowFlattenization2[0],
-      allDataFlattened = _useRowFlattenization2[1];
-
-  var _usePaginationConfig = usePaginationConfig(props, flattenedData),
-      _usePaginationConfig2 = _slicedToArray(_usePaginationConfig, 2),
-      paginatedData = _usePaginationConfig2[0],
-      paginationHelpers = _usePaginationConfig2[1]; // Redo virtualization until we match the lengths
-
+  const [flattenedData, allDataFlattened] = useRowFlattenization(props);
+  const [paginatedData, paginationHelpers] = usePaginationConfig(props, flattenedData); // Redo virtualization until we match the lengths
 
   if (dataLength !== (paginatedData || flattenedData).length) setDataLength((paginatedData || flattenedData).length); // ===========================================================================
   // Layout config
   // ===========================================================================
 
-  var _useState3 = useState(columnsToGrid(visibleColumns, props.colsLayoutStyle)),
-      _useState4 = _slicedToArray(_useState3, 2),
-      gridLayout = _useState4[0],
-      setGridLayout = _useState4[1];
-
-  var totalColumnsWidth = useMemo(function () {
-    return props.colsLayoutStyle === ColsLayoutStyle.Fixed ? gridLayout.reduce(function (acc, cur) {
-      return acc + Number.parseInt(cur, 10);
-    }, 0) : '100%';
-  }, [props.colsLayoutStyle, gridLayout]);
-  var layoutHelpers = useMemo(function () {
-    return {
-      gridLayout: gridLayout,
-      setGridLayout: setGridLayout,
-      totalColumnsWidth: totalColumnsWidth
-    };
-  }, [gridLayout, setGridLayout, totalColumnsWidth]);
-  var ctx = useMemo(function () {
-    return {
-      tableProps: props,
-      layoutHelpers: layoutHelpers,
-      paginationHelpers: paginationHelpers,
-      visibleColumns: visibleColumns,
-      virtualListHelpers: virtualListHelpers,
-      flattenedData: paginatedData || flattenedData,
-      allDataFlattened: allDataFlattened,
-      virtualListRef: virtualListRef,
-      columnHeaderRef: columnHeaderRef
-    };
-  }, [props, layoutHelpers, paginationHelpers, visibleColumns, virtualListHelpers, paginatedData, flattenedData, allDataFlattened, virtualListRef, columnHeaderRef]);
+  const [gridLayout, setGridLayout] = useState(columnsToGrid(visibleColumns, props.colsLayoutStyle));
+  const totalColumnsWidth = useMemo(() => props.colsLayoutStyle === ColsLayoutStyle.Fixed ? gridLayout.reduce((acc, cur) => acc + Number.parseInt(cur, 10), 0) : '100%', [props.colsLayoutStyle, gridLayout]);
+  const layoutHelpers = useMemo(() => ({
+    gridLayout,
+    setGridLayout,
+    totalColumnsWidth
+  }), [gridLayout, setGridLayout, totalColumnsWidth]);
+  const ctx = useMemo(() => ({
+    tableProps: props,
+    layoutHelpers,
+    paginationHelpers,
+    visibleColumns,
+    virtualListHelpers,
+    flattenedData: paginatedData || flattenedData,
+    allDataFlattened,
+    virtualListRef,
+    columnHeaderRef
+  }), [props, layoutHelpers, paginationHelpers, visibleColumns, virtualListHelpers, paginatedData, flattenedData, allDataFlattened, virtualListRef, columnHeaderRef]);
   return ctx;
 };
 
 export { useDatatableConfig };
-//# sourceMappingURL=useDatatableConfig.js.map

package/esm/configs/usePaginationConfig.js

@@ -1,77 +1,58 @@
 import { useMemo } from 'react';
 
-var noPagination = {};
+const noPagination = {};
 
-var emptyFunc = function emptyFunc() {
-  return null;
-};
+const emptyFunc = () => null;
 
-var usePaginationConfig = function usePaginationConfig(props, flattenedData) {
-  var pagination = props.pagination;
-  var hasPagination = !!pagination; // Set default values
+const usePaginationConfig = (props, flattenedData) => {
+  const {
+    pagination
+  } = props;
+  const hasPagination = !!pagination; // Set default values
 
-  var _ref = pagination || noPagination,
-      _ref$pageIndex = _ref.pageIndex,
-      pageIndex = _ref$pageIndex === void 0 ? 1 : _ref$pageIndex,
-      _ref$canPreviousPage = _ref.canPreviousPage,
-      canPreviousPage = _ref$canPreviousPage === void 0 ? true : _ref$canPreviousPage,
-      _ref$canNextPage = _ref.canNextPage,
-      canNextPage = _ref$canNextPage === void 0 ? true : _ref$canNextPage,
-      _ref$pageSize = _ref.pageSize,
-      pageSize = _ref$pageSize === void 0 ? 10 : _ref$pageSize,
-      _ref$perPageOptions = _ref.perPageOptions,
-      perPageOptions = _ref$perPageOptions === void 0 ? [10] : _ref$perPageOptions,
-      _ref$onPageSizeChange = _ref.onPageSizeChange,
-      onPageSizeChange = _ref$onPageSizeChange === void 0 ? emptyFunc : _ref$onPageSizeChange,
-      _ref$onPreviousPage = _ref.onPreviousPage,
-      onPreviousPage = _ref$onPreviousPage === void 0 ? emptyFunc : _ref$onPreviousPage,
-      _ref$onNextPage = _ref.onNextPage,
-      onNextPage = _ref$onNextPage === void 0 ? emptyFunc : _ref$onNextPage,
-      _ref$onPageChange = _ref.onPageChange,
-      onPageChange = _ref$onPageChange === void 0 ? emptyFunc : _ref$onPageChange,
-      _ref$pageCount = _ref.pageCount,
-      pageCount = _ref$pageCount === void 0 ? Math.ceil(flattenedData.length / pageSize) : _ref$pageCount,
-      _ref$perPageStep = _ref.perPageStep,
-      perPageStep = _ref$perPageStep === void 0 ? 5 : _ref$perPageStep,
-      _ref$minPerPage = _ref.minPerPage,
-      minPerPage = _ref$minPerPage === void 0 ? 0 : _ref$minPerPage,
-      _ref$maxPerPage = _ref.maxPerPage,
-      maxPerPage = _ref$maxPerPage === void 0 ? 100 : _ref$maxPerPage,
-      _ref$showPerPageSelec = _ref.showPerPageSelector,
-      showPerPageSelector = _ref$showPerPageSelec === void 0 ? true : _ref$showPerPageSelec,
-      _ref$pageDetails = _ref.pageDetails,
-      pageDetails = _ref$pageDetails === void 0 ? [] : _ref$pageDetails,
-      _ref$pageDetailsTitle = _ref.pageDetailsTitle,
-      pageDetailsTitle = _ref$pageDetailsTitle === void 0 ? '' : _ref$pageDetailsTitle; // pagination can be false
+  const {
+    pageIndex = 1,
+    canPreviousPage = true,
+    canNextPage = true,
+    pageSize = 10,
+    perPageOptions = [10],
+    onPageSizeChange = emptyFunc,
+    onPreviousPage = emptyFunc,
+    onNextPage = emptyFunc,
+    onPageChange = emptyFunc,
+    pageCount = Math.ceil(flattenedData.length / pageSize),
+    perPageStep = 5,
+    minPerPage = 0,
+    maxPerPage = 100,
+    showPerPageSelector = true,
+    pageDetails = [],
+    pageDetailsTitle = ''
+  } = pagination || noPagination; // pagination can be false
   // Get the needed page
 
-
-  var page = useMemo(function () {
+  const page = useMemo(() => {
     if (!hasPagination) return null;
     return flattenedData.slice((pageIndex - 1) * pageSize, pageIndex * pageSize);
   }, [flattenedData, pageIndex, pageSize, hasPagination]);
-  var paginationHelpers = useMemo(function () {
-    return {
-      pageIndex: pageIndex - 1,
-      canPreviousPage: canPreviousPage,
-      canNextPage: canNextPage,
-      pageSize: pageSize,
-      perPageOptions: perPageOptions,
-      onPageSizeChange: onPageSizeChange,
-      onPreviousPage: onPreviousPage,
-      onNextPage: onNextPage,
-      onPageChange: onPageChange,
-      pageCount: pageCount,
-      perPageStep: perPageStep,
-      minPerPage: minPerPage,
-      maxPerPage: maxPerPage,
-      showPerPageSelector: showPerPageSelector,
-      pageDetails: pageDetails,
-      pageDetailsTitle: pageDetailsTitle
-    };
-  }, [pageIndex, canPreviousPage, canNextPage, pageSize, perPageOptions, onPageSizeChange, onPreviousPage, onNextPage, onPageChange, pageCount, perPageStep, minPerPage, maxPerPage, showPerPageSelector, pageDetails, pageDetailsTitle]);
+  const paginationHelpers = useMemo(() => ({
+    pageIndex: pageIndex - 1,
+    canPreviousPage,
+    canNextPage,
+    pageSize,
+    perPageOptions,
+    onPageSizeChange,
+    onPreviousPage,
+    onNextPage,
+    onPageChange,
+    pageCount,
+    perPageStep,
+    minPerPage,
+    maxPerPage,
+    showPerPageSelector,
+    pageDetails,
+    pageDetailsTitle
+  }), [pageIndex, canPreviousPage, canNextPage, pageSize, perPageOptions, onPageSizeChange, onPreviousPage, onNextPage, onPageChange, pageCount, perPageStep, minPerPage, maxPerPage, showPerPageSelector, pageDetails, pageDetailsTitle]);
   return [page, paginationHelpers];
 };
 
 export { usePaginationConfig };
-//# sourceMappingURL=usePaginationConfig.js.map