@elliemae/ds-data-table 2.0.0-alpha.1 → 2.0.0-alpha.13

package/cjs/parts/Filters/index.js

@@ -3,42 +3,53 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+require('core-js/modules/esnext.async-iterator.find.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.find.js');
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/web.dom-collections.iterator.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 index$2 = require('../../addons/Filters/Components/DateRangeFilter/index.js');
+var index$1 = require('../../addons/Filters/Components/DateRangeFilter/index.js');
+var index$2 = require('../../addons/Filters/Components/DateSwitcherFilter/index.js');
 var index$3 = require('../../addons/Filters/Components/NumberRangeFilter/index.js');
+var index$4 = require('../../addons/Filters/Components/CurrencyRangeFilter/index.js');
 var SingleSelectFilter = require('../../addons/Filters/Components/SelectFilter/SingleSelectFilter.js');
 var MultiSelectFilter = require('../../addons/Filters/Components/SelectFilter/MultiSelectFilter.js');
-var index$1 = require('../../addons/Filters/Components/SingleDateFilter/index.js');
-var index = require('../../addons/Filters/Components/TextInputFilter/index.js');
-require('../../exported-related/FilterPopover.js');
+var index = require('../../addons/Filters/Components/SingleDateFilter/index.js');
 require('@babel/runtime/helpers/jsx');
-require('../../styled.js');
-require('../../DataTableContext.js');
-var jsxRuntime = require('react/jsx-runtime');
-require('styled-components');
 require('@elliemae/ds-button');
-require('@elliemae/ds-icons/MoreOptionsVert');
+require('@elliemae/ds-popperjs');
+require('styled-components');
+require('../../redux/reducers/index.js');
 require('../../configs/constants.js');
+require('core-js/modules/esnext.async-iterator.reduce.js');
+require('core-js/modules/esnext.iterator.reduce.js');
 require('react-virtual');
 require('../../configs/useRowFlattenization.js');
-require('@elliemae/ds-icons/ArrowShortReturn');
+require('core-js/modules/esnext.async-iterator.map.js');
+require('core-js/modules/esnext.iterator.map.js');
 require('@elliemae/ds-icons');
-require('@elliemae/ds-form/Checkbox');
-require('@elliemae/ds-form/Radio');
+require('../../styled.js');
+var jsxRuntime = require('react/jsx-runtime');
+require('@elliemae/ds-form');
 require('../TableContent.js');
 require('@elliemae/ds-grid');
 require('@elliemae/ds-circular-progress-indicator');
-require('@elliemae/ds-icons/WarningTriangle');
 require('@elliemae/ds-system');
+require('../../DataTableContext.js');
 require('../Row.js');
 require('../Footer.js');
-require('@elliemae/ds-icons/GripperVertical');
 require('../HoC/SortableItemContext.js');
+require('@elliemae/ds-utilities');
 require('uid');
 var FilterTypes = require('../../exported-related/FilterTypes.js');
 require('../../exported-related/Filters/applyOutOfTheBoxFilters.js');
 require('moment');
-require('../../redux/reducers/index.js');
+require('core-js/modules/esnext.async-iterator.some.js');
+require('core-js/modules/esnext.iterator.some.js');
 var useDispatchHeadersActions = require('../../redux/reducers/headersReducers/useDispatchHeadersActions.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -47,14 +58,15 @@ var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_definePropert
 
 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; }
+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 FilterMapper = {
   [FilterTypes.FILTER_TYPES.SELECT]: SingleSelectFilter.SingleSelectFilter,
   [FilterTypes.FILTER_TYPES.MULTI_SELECT]: MultiSelectFilter.MultiSelectFilter,
-  [FilterTypes.FILTER_TYPES.TEXT]: index.TextInputFilter,
-  [FilterTypes.FILTER_TYPES.SINGLE_DATE]: index$1.SingleDateFilter,
-  [FilterTypes.FILTER_TYPES.DATE_RANGE]: index$2.DateRangeFilter,
-  [FilterTypes.FILTER_TYPES.NUMBER_RANGE]: index$3.NumberRangeFilter
+  [FilterTypes.FILTER_TYPES.SINGLE_DATE]: index.SingleDateFilter,
+  [FilterTypes.FILTER_TYPES.DATE_RANGE]: index$1.DateRangeFilter,
+  [FilterTypes.FILTER_TYPES.DATE_SWITCHER]: index$2.DateSwitcherFilter,
+  [FilterTypes.FILTER_TYPES.NUMBER_RANGE]: index$3.NumberRangeFilter,
+  [FilterTypes.FILTER_TYPES.CURRENCY_RANGE]: index$4.CurrencyRangeFilter
 };
 const FilterMapItem = props => {
   const {
@@ -96,7 +108,7 @@ const FilterMapItem = props => {
 
   if (typeof column.filter === 'string') {
     if (!(column.filter in FilterMapper)) {
-      throw new Error(`column.filter must be a supported out-of-the-box filter in ${column}`);
+      throw new Error("column.filter must be a supported out-of-the-box filter in ".concat(column));
     }
 
     const FilterComp = FilterMapper[column.filter];
@@ -105,7 +117,7 @@ const FilterMapItem = props => {
 
   if (column.Filter) {
     if (typeof column.Filter !== 'function') {
-      throw new Error(`column.Filter must be a component`);
+      throw new Error("column.Filter must be a component");
     }
 
     const FilterComp = column.Filter;

package/cjs/parts/Footer.js

@@ -8,14 +8,17 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 
-const Footer = ({
-  children
-}) => /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
-  children: children
-});
+const Footer = _ref => {
+  let {
+    children
+  } = _ref;
+  return /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
+    children: children
+  });
+};
 
 Footer.propTypes = {
-  children: PropTypes__default['default'].node
+  children: PropTypes__default["default"].node
 };
 
 module.exports = Footer;

package/cjs/parts/Headers/EmptyChildrenGroup.js

@@ -12,9 +12,9 @@ var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 
 var _StyledBox;
-const StyledBox = /*#__PURE__*/styled__default['default'].div.withConfig({
+const StyledBox = /*#__PURE__*/styled__default["default"].div.withConfig({
   componentId: "sc-1dcayi9-0"
 })(["height:24px;margin:0 ", ";border-top:1px solid ", ";"], props => props.theme.space.xxs, props => props.theme.colors.neutral[200]);
-const EmptyChildrenGroup = () => _StyledBox || (_StyledBox = /*#__PURE__*/_jsx__default['default'](StyledBox, {}));
+const EmptyChildrenGroup = () => _StyledBox || (_StyledBox = /*#__PURE__*/_jsx__default["default"](StyledBox, {}));
 
 exports.EmptyChildrenGroup = EmptyChildrenGroup;

package/cjs/parts/Headers/HeaderCell.js

@@ -2,6 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+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 _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var _jsx = require('@babel/runtime/helpers/jsx');
 var React = require('react');
@@ -14,7 +19,7 @@ var SortByCaret = require('../SortByCaret.js');
 require('../TableContent.js');
 require('@elliemae/ds-circular-progress-indicator');
 require('styled-components');
-require('@elliemae/ds-icons/WarningTriangle');
+require('@elliemae/ds-icons');
 require('@elliemae/ds-system');
 require('@elliemae/ds-button');
 require('../Row.js');
@@ -27,13 +32,15 @@ var useHeaderCellHandlers = require('./useHeaderCellHandlers.js');
 var useHeaderCellConfig = require('./useHeaderCellConfig.js');
 var useRecoverFocusCol = require('../../hooks/useRecoverFocusCol.js');
 var constants = require('../../configs/constants.js');
+require('core-js/modules/web.dom-collections.iterator.js');
+require('core-js/modules/esnext.async-iterator.reduce.js');
+require('core-js/modules/esnext.iterator.reduce.js');
 require('react-virtual');
 require('../../configs/useRowFlattenization.js');
-require('@elliemae/ds-icons/ArrowShortReturn');
-require('@elliemae/ds-icons');
+require('core-js/modules/esnext.async-iterator.map.js');
+require('core-js/modules/esnext.iterator.map.js');
 var jsxRuntime = require('react/jsx-runtime');
-require('@elliemae/ds-form/Checkbox');
-require('@elliemae/ds-form/Radio');
+require('@elliemae/ds-form');
 var HeaderCellTitle = require('./HeaderCellTitle.js');
 var useDispatchHeadersActions = require('../../redux/reducers/headersReducers/useDispatchHeadersActions.js');
 
@@ -45,7 +52,7 @@ var Grid__default = /*#__PURE__*/_interopDefaultLegacy(Grid);
 
 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; }
+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 buildScreenReaderInstructions = (colSpan, draggable, filterable, sortable) => {
   const preffix = colSpan === 1 ? '' : 'Column Group. ';
@@ -53,12 +60,12 @@ const buildScreenReaderInstructions = (colSpan, draggable, filterable, sortable)
   let message = sortable ? 'You can sort the data ascendingly/descendingly by this column. Use the up / down arrows keys to do so' : '';
 
   if (draggable && filterable) {
-    message = `This column is draggable and filterable. To enable these interactions press the enter key. ${message}`;
+    message = "This column is draggable and filterable. To enable these interactions press the enter key. ".concat(message);
   } else if (draggable || filterable) {
-    message = `This column is ${draggable ? 'draggable' : 'filterable'}. To enable this interaction press the enter key. ${message}`;
+    message = "This column is ".concat(draggable ? 'draggable' : 'filterable', ". To enable this interaction press the enter key. ").concat(message);
   }
 
-  return `${preffix}${message}`;
+  return "".concat(preffix).concat(message);
 };
 
 function mapStateToProps(state, ownProps) {
@@ -72,7 +79,7 @@ function mapStateToProps(state, ownProps) {
 const connector = reactRedux.connect(mapStateToProps);
 
 const HeaderCellComp = props => {
-  var _FilterMapItem;
+  var _FilterMapItem, _flattenedData$, _flattenedData$$origi;
 
   const {
     reduxHeader,
@@ -80,7 +87,7 @@ const HeaderCellComp = props => {
     isDragOverlay,
     colSpan
   } = props;
-  const ctx = React.useContext(DataTableContext['default']);
+  const ctx = React.useContext(DataTableContext["default"]);
   const {
     tableProps: {
       isResizeable,
@@ -89,14 +96,14 @@ const HeaderCellComp = props => {
       onFiltersChange,
       filters,
       textWrap
-    }
+    },
+    flattenedData
   } = ctx;
   const {
     patchHeader
   } = useDispatchHeadersActions.useDispatchHeadersActions();
   const dragHandleRef = React.useRef(null);
   const filterIconRef = React.useRef(null);
-  const headerRef = React.useRef(null);
   const {
     draggableProps
   } = React.useContext(SortableItemContext.SortableItemContext);
@@ -118,26 +125,26 @@ const HeaderCellComp = props => {
   useRecoverFocusCol.useRecoverFocusCol(isDragging, dragHandleRef);
   const rightIcons = React.useMemo(() => {
     if (!hasRightIcons) return null;
-    return /*#__PURE__*/_jsx__default['default'](styled.StyledHeaderRightIconsWrapper, {}, void 0, _FilterMapItem || (_FilterMapItem = /*#__PURE__*/_jsx__default['default'](index.FilterMapItem, {
+    return /*#__PURE__*/_jsx__default["default"](styled.StyledHeaderRightIconsWrapper, {}, void 0, _FilterMapItem || (_FilterMapItem = /*#__PURE__*/_jsx__default["default"](index.FilterMapItem, {
       column: column,
       ctx: ctx,
       onFiltersChange: onFiltersChange,
       reduxHeader: reduxHeader,
       filterValue: filters,
       innerRef: filterIconRef
-    })), hasSortingCaret && /*#__PURE__*/_jsx__default['default'](SortByCaret.SortByCaret, {
+    })), hasSortingCaret && /*#__PURE__*/_jsx__default["default"](SortByCaret.SortByCaret, {
       isSortedDesc: column.isSortedDesc
     }));
   }, [hasRightIcons, column, ctx, onFiltersChange, reduxHeader, filters, hasSortingCaret]);
-  const DnDHandleComponent = React.useMemo(() => /*#__PURE__*/_jsx__default['default'](Grid__default['default'], {
+  const DnDHandleComponent = React.useMemo(() => /*#__PURE__*/_jsx__default["default"](Grid__default["default"], {
     mr: "2px",
     alignItems: "center",
     style: {
       position: 'relative'
     }
-  }, void 0, /*#__PURE__*/_jsx__default['default'](styled.StyledFocusWithin, {
+  }, void 0, /*#__PURE__*/_jsx__default["default"](styled.StyledFocusWithin, {
     hideFocus: isDragging
-  }, void 0, /*#__PURE__*/_jsx__default['default'](DnDHandle, {
+  }, void 0, /*#__PURE__*/_jsx__default["default"](DnDHandle, {
     innerRef: dragHandleRef,
     isReachable: reduxHeader === null || reduxHeader === void 0 ? void 0 : reduxHeader.withTabStops,
     id: column.id,
@@ -152,34 +159,35 @@ const HeaderCellComp = props => {
     onColumnSortChange,
     dragHandleRef,
     filterIconRef,
-    headerRef
+    headerRef: column.ref
   });
   return /*#__PURE__*/jsxRuntime.jsxs(styled.StyledHeadTh, _objectSpread(_objectSpread({
     column: column
   }, handlers), {}, {
     role: colSpan === 1 ? 'columnheader' : 'group',
     colSpan: colSpan,
-    "aria-describedby": `${column.id}-instructions` // eslint-disable-next-line no-nested-ternary
+    "aria-describedby": "".concat(column.id, "-instructions") // eslint-disable-next-line no-nested-ternary
     ,
     "aria-sort": hasSortingCaret ? column.isSortedDesc ? 'descending' : 'ascending' : 'none',
     "data-testid": constants.DATA_TESTID.DATA_TABLE_HEADER,
+    isFirstRowGroup: !!((_flattenedData$ = flattenedData[0]) !== null && _flattenedData$ !== void 0 && (_flattenedData$$origi = _flattenedData$.original) !== null && _flattenedData$$origi !== void 0 && _flattenedData$$origi.dimsumHeaderValue),
     tabIndex: column.isFocuseable === false ? -1 : 0,
     isDragOverlay: isDragOverlay,
     isDraggingActive: draggableProps && draggableProps.active,
     shouldShowDnD: shouldShowDnD,
-    ref: headerRef,
-    children: [/*#__PURE__*/_jsx__default['default'](Grid__default['default'], {
+    ref: column.ref,
+    children: [/*#__PURE__*/_jsx__default["default"](Grid__default["default"], {
       width: "100%",
       cols: hCols
-    }, void 0, shouldShowDnD && DnDHandleComponent, /*#__PURE__*/_jsx__default['default'](HeaderCellTitle.HeaderCellTitle, {
+    }, void 0, shouldShowDnD && DnDHandleComponent, /*#__PURE__*/_jsx__default["default"](HeaderCellTitle.HeaderCellTitle, {
       column: column,
       ctx: ctx,
       draggableProps: draggableProps,
       textWrap: textWrap
-    }), rightIcons, isResizeable && column.canResize !== false && /*#__PURE__*/_jsx__default['default'](HeaderResizer.HeaderResizer, {
+    }), rightIcons, isResizeable && column.canResize !== false && /*#__PURE__*/_jsx__default["default"](HeaderResizer.HeaderResizer, {
       column: column
-    })), /*#__PURE__*/_jsx__default['default']("span", {
-      id: `${column.id}-instructions`,
+    })), /*#__PURE__*/_jsx__default["default"]("span", {
+      id: "".concat(column.id, "-instructions"),
       style: {
         display: 'none'
       },

package/cjs/parts/Headers/HeaderCellGroup.js

@@ -3,6 +3,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var _jsx = require('@babel/runtime/helpers/jsx');
+require('core-js/modules/esnext.async-iterator.map.js');
+require('core-js/modules/esnext.iterator.map.js');
 var React = require('react');
 var Grid = require('@elliemae/ds-grid');
 var styled = require('styled-components');
@@ -13,24 +15,28 @@ var DropIndicator = require('../DropIndicator.js');
 var SortableHeaderCell = require('../SortableHeaderCell.js');
 var EmptyChildrenGroup = require('./EmptyChildrenGroup.js');
 var constants = require('../../configs/constants.js');
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/web.dom-collections.iterator.js');
+require('core-js/modules/esnext.async-iterator.reduce.js');
+require('core-js/modules/esnext.iterator.reduce.js');
 require('react-virtual');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
 require('../../configs/useRowFlattenization.js');
 require('@babel/runtime/helpers/defineProperty');
-require('@elliemae/ds-icons/ArrowShortReturn');
 require('@elliemae/ds-icons');
 require('../../styled.js');
 var jsxRuntime = require('react/jsx-runtime');
-require('@elliemae/ds-form/Checkbox');
-require('@elliemae/ds-form/Radio');
+require('@elliemae/ds-form');
 require('../TableContent.js');
 require('@elliemae/ds-circular-progress-indicator');
-require('@elliemae/ds-icons/WarningTriangle');
 require('@elliemae/ds-system');
 require('@elliemae/ds-button');
 require('../../DataTableContext.js');
 require('../Row.js');
 require('../Footer.js');
-require('@elliemae/ds-icons/GripperVertical');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -38,44 +44,47 @@ var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 
 var _EmptyChildrenGroup;
-const StyledWrapper = /*#__PURE__*/styled__default['default'](Grid.Grid).withConfig({
+const StyledWrapper = /*#__PURE__*/styled__default["default"](Grid.Grid).withConfig({
   componentId: "sc-1dqaj8a-0"
 })(["position:relative;width:", ";grid-column:", ";background:", ";opacity:", ";box-shadow:0 2px 4px 0 ", ";"], props => props.isDragOverlay ? 'fit-content' : '100%', props => props.gridColumn, props => props.isDragging ? props.theme.colors.neutral['080'] : 'white', props => props.isDragging ? 0.8 : 1, props => props.isDragOverlay ? 'rgba(0,0,0,0.5)' : 'transparent');
 
-const HeaderCellGroupComp = ({
-  header,
-  isDragOverlay,
-  isDraggingParent,
-  isLast
-}) => {
+const HeaderCellGroupComp = _ref => {
+  var _children$length;
+
+  let {
+    header,
+    isDragOverlay,
+    isDraggingParent,
+    isLast
+  } = _ref;
   const {
     draggableProps
   } = React.useContext(SortableItemContext.SortableItemContext);
   const children = header.columns;
   const isDragging = draggableProps && draggableProps.isDragging || isDraggingParent;
   const dropIndicatorPosition = draggableProps && draggableProps.shouldShowDropIndicatorPosition && draggableProps.dropIndicatorPosition;
-  const ChildGroup = isDragOverlay ? NotSortableHeaderCellGroup : HeaderCellGroup;
-  const colSpan = (children === null || children === void 0 ? void 0 : children.length) ?? 1;
+  const ChildGroup = isDragOverlay ? HeaderCellGroup : HeaderCellGroupSortable;
+  const colSpan = (_children$length = children === null || children === void 0 ? void 0 : children.length) !== null && _children$length !== void 0 ? _children$length : 1;
   return /*#__PURE__*/jsxRuntime.jsxs(StyledWrapper, {
     ref: draggableProps ? draggableProps.setNodeRef : null,
-    gridColumn: isDragOverlay ? 'auto' : `span ${colSpan}`,
+    gridColumn: isDragOverlay ? 'auto' : "span ".concat(colSpan),
     isDragOverlay: isDragOverlay,
     isDragging: isDragging,
     cols: ['auto'],
     "data-testid": isDragOverlay ? constants.DATA_TESTID.DATA_TABLE_COLUMN_DRAG_OVERLAY : undefined,
-    children: [/*#__PURE__*/_jsx__default['default'](HeaderCell.HeaderCell, {
+    children: [/*#__PURE__*/_jsx__default["default"](HeaderCell.HeaderCell, {
       column: header,
       isDragOverlay: isDragOverlay,
       colSpan: colSpan
-    }), !!(children !== null && children !== void 0 && children.length) && !isDragOverlay && /*#__PURE__*/_jsx__default['default'](SortableHeaderCell.SortableHeaderCell, {
+    }), !!(children !== null && children !== void 0 && children.length) && !isDragOverlay && /*#__PURE__*/_jsx__default["default"](SortableHeaderCell.SortableHeaderCell, {
       items: children,
       isDragOverlay: isDragOverlay
-    }, void 0, children.map((h, index) => /*#__PURE__*/_jsx__default['default'](ChildGroup, {
+    }, void 0, children.map((h, index) => /*#__PURE__*/_jsx__default["default"](ChildGroup, {
       header: h,
       isDragOverlay: isDragOverlay,
       isDraggingParent: isDragging,
       isLast: index === children.length - 1
-    }, h.id))), (children === null || children === void 0 ? void 0 : children.length) && isDragOverlay && (_EmptyChildrenGroup || (_EmptyChildrenGroup = /*#__PURE__*/_jsx__default['default'](EmptyChildrenGroup.EmptyChildrenGroup, {}))), /*#__PURE__*/_jsx__default['default'](DropIndicator, {
+    }, h.id))), (children === null || children === void 0 ? void 0 : children.length) && isDragOverlay && (_EmptyChildrenGroup || (_EmptyChildrenGroup = /*#__PURE__*/_jsx__default["default"](EmptyChildrenGroup.EmptyChildrenGroup, {}))), /*#__PURE__*/_jsx__default["default"](DropIndicator, {
       vertical: true,
       dropIndicatorPosition: dropIndicatorPosition,
       isLast: isLast && isDragging
@@ -84,7 +93,8 @@ const HeaderCellGroupComp = ({
 };
 
 // We need to declare this because we MUST avoid the useSortable call in the recursive calls of the function
-const NotSortableHeaderCellGroup = HeaderCellGroupComp;
-const HeaderCellGroup = withDnDSortableColumnContext.withDnDSortableColumnContext(HeaderCellGroupComp);
+const HeaderCellGroup = HeaderCellGroupComp;
+const HeaderCellGroupSortable = withDnDSortableColumnContext.withDnDSortableColumnContext(HeaderCellGroupComp);
 
 exports.HeaderCellGroup = HeaderCellGroup;
+exports["default"] = HeaderCellGroupSortable;

package/cjs/parts/Headers/HeaderCellTitle.js

@@ -6,7 +6,34 @@ var _jsx = require('@babel/runtime/helpers/jsx');
 require('react');
 var dsTruncatedTooltipText = require('@elliemae/ds-truncated-tooltip-text');
 var RequiredDot = require('./RequiredDot.js');
+var constants = require('../../configs/constants.js');
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/web.dom-collections.iterator.js');
+require('core-js/modules/esnext.async-iterator.reduce.js');
+require('core-js/modules/esnext.iterator.reduce.js');
+require('react-virtual');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
+require('../../configs/useRowFlattenization.js');
+require('@babel/runtime/helpers/defineProperty');
+require('core-js/modules/esnext.async-iterator.map.js');
+require('core-js/modules/esnext.iterator.map.js');
+require('@elliemae/ds-icons');
+require('styled-components');
+require('../../styled.js');
 var jsxRuntime = require('react/jsx-runtime');
+require('@elliemae/ds-form');
+require('../TableContent.js');
+require('@elliemae/ds-grid');
+require('@elliemae/ds-circular-progress-indicator');
+require('@elliemae/ds-system');
+require('@elliemae/ds-button');
+require('../../DataTableContext.js');
+require('../Row.js');
+require('../Footer.js');
+require('../HoC/SortableItemContext.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -14,32 +41,39 @@ var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 
 var _RequiredDot;
 
-const StringTitle = ({
-  column,
-  textWrap
-}) => (column.textWrap || textWrap) === 'truncate' ? /*#__PURE__*/_jsx__default['default'](dsTruncatedTooltipText.SimpleTruncatedTooltipText, {
-  value: column.Header
-}) : /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
-  children: column.Header
-});
-
-const HeaderCellTitle = ({
-  column,
-  ctx,
-  draggableProps,
-  textWrap
-}) => /*#__PURE__*/_jsx__default['default']("div", {
-  style: {
-    display: 'flex',
-    alignItems: 'center'
-  }
-}, void 0, typeof column.Header === 'string' ? /*#__PURE__*/_jsx__default['default'](StringTitle, {
-  column: column,
-  textWrap: textWrap
-}) : /*#__PURE__*/_jsx__default['default'](column.Header, {
-  column: column,
-  ctx: ctx,
-  draggableProps: draggableProps
-}), column.required && (_RequiredDot || (_RequiredDot = /*#__PURE__*/_jsx__default['default'](RequiredDot.RequiredDot, {}))));
+const StringTitle = _ref => {
+  let {
+    column,
+    textWrap
+  } = _ref;
+  return (column.textWrap || textWrap) === 'truncate' ? /*#__PURE__*/_jsx__default["default"](dsTruncatedTooltipText.SimpleTruncatedTooltipText, {
+    value: column.Header
+  }) : /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
+    children: column.Header
+  });
+};
+
+const HeaderCellTitle = _ref2 => {
+  let {
+    column,
+    ctx,
+    draggableProps,
+    textWrap
+  } = _ref2;
+  return /*#__PURE__*/_jsx__default["default"]("div", {
+    style: {
+      display: 'flex',
+      alignItems: 'center'
+    },
+    "data-testid": constants.DATA_TESTID.DATA_TABLE_HEADER_CELL_TITLE
+  }, void 0, typeof column.Header === 'string' ? /*#__PURE__*/_jsx__default["default"](StringTitle, {
+    column: column,
+    textWrap: textWrap
+  }) : /*#__PURE__*/_jsx__default["default"](column.Header, {
+    column: column,
+    ctx: ctx,
+    draggableProps: draggableProps
+  }), column.required && (_RequiredDot || (_RequiredDot = /*#__PURE__*/_jsx__default["default"](RequiredDot.RequiredDot, {}))));
+};
 
 exports.HeaderCellTitle = HeaderCellTitle;

package/cjs/parts/Headers/HeaderResizer.js

@@ -3,29 +3,35 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+require('core-js/modules/web.dom-collections.iterator.js');
+require('core-js/modules/esnext.async-iterator.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.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
 var React = require('react');
 var constants = require('../../configs/constants.js');
+require('core-js/modules/esnext.async-iterator.reduce.js');
+require('core-js/modules/esnext.iterator.reduce.js');
 require('react-virtual');
 var columnsToGrid = require('../../helpers/columnsToGrid.js');
 require('../../configs/useRowFlattenization.js');
 require('@babel/runtime/helpers/jsx');
-require('@elliemae/ds-icons/ArrowShortReturn');
-require('styled-components');
 require('@elliemae/ds-icons');
+require('styled-components');
 var styled = require('../../styled.js');
 var jsxRuntime = require('react/jsx-runtime');
-require('@elliemae/ds-form/Checkbox');
-require('@elliemae/ds-form/Radio');
+require('@elliemae/ds-form');
 require('../TableContent.js');
 require('@elliemae/ds-grid');
 require('@elliemae/ds-circular-progress-indicator');
-require('@elliemae/ds-icons/WarningTriangle');
 require('@elliemae/ds-system');
 require('@elliemae/ds-button');
 var DataTableContext = require('../../DataTableContext.js');
 require('../Row.js');
 require('../Footer.js');
-require('@elliemae/ds-icons/GripperVertical');
 require('../HoC/SortableItemContext.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -34,13 +40,16 @@ var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_definePropert
 
 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; }
+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 narrow = (value, min, max) => Math.min(Math.max(value, min !== null && min !== void 0 ? min : 30), max !== null && max !== void 0 ? max : Infinity);
 
-const narrow = (value, min, max) => Math.min(Math.max(value, min ?? 30), max ?? Infinity);
+const HeaderResizer = _ref => {
+  var _column$width;
 
-const HeaderResizer = ({
-  column
-}) => {
+  let {
+    column
+  } = _ref;
   const {
     layoutHelpers: {
       setGridLayout
@@ -49,9 +58,9 @@ const HeaderResizer = ({
     tableProps: {
       onColumnResize
     }
-  } = React.useContext(DataTableContext['default']);
+  } = React.useContext(DataTableContext["default"]);
   const [isResizing, setIsResizing] = React.useState(false);
-  const [nextWidth, setNextWidth] = React.useState(column.width ?? 150);
+  const [nextWidth, setNextWidth] = React.useState((_column$width = column.width) !== null && _column$width !== void 0 ? _column$width : 150);
   const visibleColumnsCopy = React.useMemo(() => visibleColumns.map(col => _objectSpread({}, col)), [visibleColumns]);
   React.useEffect(() => {
     const realColumnIndex = visibleColumnsCopy.findIndex(visibleColumn => visibleColumn.id === column.id);

package/cjs/parts/Headers/RequiredDot.js

@@ -10,14 +10,14 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 
 var _circle;
-const RequiredDot = () => /*#__PURE__*/_jsx__default['default']("svg", {
+const RequiredDot = () => /*#__PURE__*/_jsx__default["default"]("svg", {
   height: "4",
   width: "4",
   style: {
     marginBottom: '6px',
     marginLeft: '4px'
   }
-}, void 0, _circle || (_circle = /*#__PURE__*/_jsx__default['default']("circle", {
+}, void 0, _circle || (_circle = /*#__PURE__*/_jsx__default["default"]("circle", {
   cx: "2",
   cy: "2",
   r: "2",