@elliemae/ds-data-table 2.0.0-alpha.3 → 2.0.0-alpha.7

package/cjs/DataTable.js

@@ -27,7 +27,7 @@ var _FiltersBar;
 
 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 DataTable = props => {
   const {
     withFilterBar
@@ -36,14 +36,14 @@ const DataTable = props => {
   const tableWrapperRef = React.useRef();
   const tableContentWrapperRef = React.useRef();
   const ctx = useDatatableConfig.useDatatableConfig(props);
-  return /*#__PURE__*/_jsx__default['default'](reactRedux.Provider, {
+  return /*#__PURE__*/_jsx__default["default"](reactRedux.Provider, {
     store: reduxStore
-  }, void 0, /*#__PURE__*/_jsx__default['default'](DataTableContext['default'].Provider, {
+  }, void 0, /*#__PURE__*/_jsx__default["default"](DataTableContext["default"].Provider, {
     value: ctx
   }, void 0, /*#__PURE__*/jsxRuntime.jsxs("div", {
     ref: tableWrapperRef,
     "data-testid": constants.DATA_TESTID.DATA_TABLE_WRAPPER,
-    children: [withFilterBar ? _FiltersBar || (_FiltersBar = /*#__PURE__*/_jsx__default['default'](FiltersBar.FiltersBar, {})) : null, /*#__PURE__*/jsxRuntime.jsx(TableContent, {
+    children: [withFilterBar ? _FiltersBar || (_FiltersBar = /*#__PURE__*/_jsx__default["default"](FiltersBar.FiltersBar, {})) : null, /*#__PURE__*/jsxRuntime.jsx(TableContent, {
       ref: tableContentWrapperRef
     })]
   })));

package/cjs/DataTableContext.js

@@ -69,6 +69,6 @@ const DataTableContext = /*#__PURE__*/React.createContext({
   columnHeaderRef: /*#__PURE__*/React.createRef()
 });
 
-exports['default'] = DataTableContext;
+exports["default"] = DataTableContext;
 exports.defaultProps = defaultProps;
 exports.defaultRelativeRowMouseCoord = defaultRelativeRowMouseCoord;

package/cjs/addons/Columns/ColumnDragHandle/ColumnDragHandle.js

@@ -28,7 +28,7 @@ const dragHandleColumn = {
   id: 'dragHandleColumn',
   // Make sure it has an ID
   // The header doesn't need anything for single selection
-  Header: () => _div || (_div = /*#__PURE__*/_jsx__default['default']("div", {})),
+  Header: () => _div || (_div = /*#__PURE__*/_jsx__default["default"]("div", {})),
   Cell: ({
     row,
     isRowSelected,
@@ -37,13 +37,13 @@ const dragHandleColumn = {
     draggableProps
   }) => {
     useRecoverFocusRow.useRecoverFocusRow(row, cell, isDragOverlay, draggableProps);
-    return /*#__PURE__*/_jsx__default['default'](styled.StyledFocusWithin, {
+    return /*#__PURE__*/_jsx__default["default"](styled.StyledFocusWithin, {
       style: {
         width: '100%',
         height: '100%'
       },
       hideFocus: draggableProps && draggableProps.isDragging
-    }, void 0, /*#__PURE__*/_jsx__default['default'](DnDHandle, {
+    }, void 0, /*#__PURE__*/_jsx__default["default"](DnDHandle, {
       id: row.uid,
       isReachable: isRowSelected,
       innerRef: _ref => {

package/cjs/addons/Columns/ColumnExpand/ColumnExpand.js

@@ -2,12 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var _jsx = require('@babel/runtime/helpers/jsx');
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var React = require('react');
-var ArrowShortReturn = require('@elliemae/ds-icons/ArrowShortReturn');
-var styled$1 = require('styled-components');
 var dsIcons = require('@elliemae/ds-icons');
+var styled$1 = require('styled-components');
 var styled = require('../../../styled.js');
 var constants = require('../../../configs/constants.js');
 require('react-virtual');
@@ -29,17 +28,16 @@ var jsxRuntime = require('react/jsx-runtime');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
 var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
-var ArrowShortReturn__default = /*#__PURE__*/_interopDefaultLegacy(ArrowShortReturn);
+var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
 var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled$1);
 
 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; }
-const StyledSpan = /*#__PURE__*/styled__default['default'].span.withConfig({
+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 StyledSpan = /*#__PURE__*/styled__default["default"].span.withConfig({
   componentId: "sc-1xp824d-0"
-})(["cursor:pointer;box-sizing:border-box;outline:none;"]);
+})(["cursor:pointer;box-sizing:border-box;outline:none;display:flex;justify-content:center;align-items:center;"]);
 const expandRowColumn = {
   // Build our expander column
   id: 'expander',
@@ -64,21 +62,33 @@ const expandRowColumn = {
     }, [allDataFlattened]);
     const isAllRowsExpanded = React.useMemo(() => Object.keys(allExpandable).length === Object.keys(expandedRows).length, [allExpandable, expandedRows]);
     const onExpandedAllHandler = React.useCallback(() => {
-      if (isAllRowsExpanded) onRowExpand({}, 'All');else onRowExpand(allExpandable, 'All');
+      if (isAllRowsExpanded) onRowExpand({}, 'All');else onRowExpand(_objectSpread({}, allExpandable), 'All');
     }, [allExpandable, isAllRowsExpanded, onRowExpand]);
     const GlobalExpandIcon = React.useMemo(() => {
-      if (isAllRowsExpanded) return /*#__PURE__*/_jsx__default['default'](dsIcons.CollapseAll, {
-        size: "m",
+      if (isAllRowsExpanded) return /*#__PURE__*/_jsx__default["default"](dsIcons.ArrowheadDown, {
+        size: "s",
         color: ['brand-primary', '600'],
         "data-testid": constants.DATA_TESTID.DATA_TABLE_ICON_ARROW_DOWN
-      });
-      return /*#__PURE__*/_jsx__default['default'](dsIcons.ExpandAll, {
-        size: "m",
+      }); // Mixed
+
+      if (Object.keys(expandedRows).length) {
+        return /*#__PURE__*/_jsx__default["default"](dsIcons.ArrowheadRight, {
+          size: "s",
+          color: ['brand-primary', '600'],
+          "data-testid": constants.DATA_TESTID.DATA_TABLE_ICON_ARROW_MIXED,
+          style: {
+            transform: 'rotate(45deg)'
+          }
+        });
+      }
+
+      return /*#__PURE__*/_jsx__default["default"](dsIcons.ArrowheadRight, {
+        size: "s",
         color: ['brand-primary', '600'],
         "data-testid": constants.DATA_TESTID.DATA_TABLE_ICON_ARROW_RIGHT
       });
-    }, [isAllRowsExpanded]);
-    return /*#__PURE__*/_jsx__default['default'](styled.StyledFocusWithin, {}, void 0, /*#__PURE__*/_jsx__default['default'](StyledSpan, {
+    }, [expandedRows, isAllRowsExpanded]);
+    return /*#__PURE__*/_jsx__default["default"](styled.StyledFocusWithin, {}, void 0, /*#__PURE__*/_jsx__default["default"](StyledSpan, {
       role: "button",
       tabIndex: 0,
       title: "Toggle All Rows Expanded",
@@ -91,7 +101,10 @@ const expandRowColumn = {
       },
       "data-testid": constants.DATA_TESTID.DATA_TABLE_GLOBAL_EXPAND_CELL,
       "aria-expanded": isAllRowsExpanded,
-      isRightArrow: !isAllRowsExpanded && Object.keys(expandedRows).length === 0
+      style: {
+        width: '24px',
+        height: '24px'
+      }
     }, void 0, GlobalExpandIcon));
   },
   Cell: ({
@@ -130,7 +143,7 @@ const expandRowColumn = {
     const indentStyle = React.useMemo(() => ({
       marginLeft: `${row.depth * 32}px`,
       marginRight: '18px',
-      paddingLeft: '1px',
+      paddingLeft: '2px',
       paddingRight: '2px',
       position: 'relative',
       height: '100%',
@@ -154,18 +167,18 @@ const expandRowColumn = {
       'aria-expanded': isExpanded,
       isRightArrow: !isExpanded || isDragging || isDragOverlay
     }), [row.uid, onRowExpandHandler, cell.ref, isRowSelected, isExpanded, isDragging, isDragOverlay]);
-    const PureCaretIcon = React.useMemo(() => isExpanded && !isDragging && !isDragOverlay ? /*#__PURE__*/_jsx__default['default'](dsIcons.ArrowheadDown, {
+    const PureCaretIcon = React.useMemo(() => isExpanded && !isDragging && !isDragOverlay ? /*#__PURE__*/_jsx__default["default"](dsIcons.ArrowheadDown, {
       "data-is-col-expanded": isExpanded,
       "data-role": "row-expander-col",
       size: "s",
       "data-testid": constants.DATA_TESTID.DATA_TABLE_ICON_ARROW_DOWN
-    }) : /*#__PURE__*/_jsx__default['default'](dsIcons.ArrowheadRight, {
+    }) : /*#__PURE__*/_jsx__default["default"](dsIcons.ArrowheadRight, {
       "data-is-col-expanded": isExpanded,
       "data-role": "row-expander-col",
       size: "s",
       "data-testid": constants.DATA_TESTID.DATA_TABLE_ICON_ARROW_RIGHT
     }), [isExpanded, isDragging, isDragOverlay]);
-    const ChildIcon = React.useMemo(() => /*#__PURE__*/_jsx__default['default'](ArrowShortReturn__default['default'], {
+    const ChildIcon = React.useMemo(() => /*#__PURE__*/_jsx__default["default"](dsIcons.ArrowShortReturn, {
       size: "s",
       "data-testid": constants.DATA_TESTID.DATA_TABLE_ICON_CHILD,
       style: {
@@ -173,15 +186,15 @@ const expandRowColumn = {
       },
       color: ['brand-primary', '600']
     }), []);
-    if (shouldPrintCaret) return /*#__PURE__*/_jsx__default['default'](styled.StyledFocusWithin, {
+    if (shouldPrintCaret) return /*#__PURE__*/_jsx__default["default"](styled.StyledFocusWithin, {
       style: indentStyle
     }, void 0, /*#__PURE__*/jsxRuntime.jsx(StyledSpan, _objectSpread(_objectSpread({}, rowProps), {}, {
       children: PureCaretIcon
     })));
-    if (row.depth !== 0) return /*#__PURE__*/_jsx__default['default']("span", {
+    if (row.depth !== 0) return /*#__PURE__*/_jsx__default["default"]("span", {
       style: indentStyle
     }, void 0, ChildIcon);
-    return /*#__PURE__*/_jsx__default['default']("div", {
+    return /*#__PURE__*/_jsx__default["default"]("div", {
       style: {
         width: '36px'
       }

package/cjs/addons/Columns/ColumnSelectMultiple/ColumnSelectMultiple.js

@@ -9,9 +9,8 @@ var DSCheckbox = require('@elliemae/ds-form/Checkbox');
 var constants = require('../../../configs/constants.js');
 require('react-virtual');
 require('../../../configs/useRowFlattenization.js');
-require('@elliemae/ds-icons/ArrowShortReturn');
-require('styled-components');
 require('@elliemae/ds-icons');
+require('styled-components');
 require('../../../styled.js');
 require('react/jsx-runtime');
 require('@elliemae/ds-form/Radio');
@@ -35,7 +34,7 @@ var DSCheckbox__default = /*#__PURE__*/_interopDefaultLegacy(DSCheckbox);
 
 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 multiSelectColumn = {
   // Build our multiSelecter column
   id: 'multiSelecter',
@@ -73,10 +72,10 @@ const multiSelectColumn = {
 
       return {};
     }, [newGlobalStateAfterToggle, allDataFlattened, disabledRows]);
-    const onChangeHandler = React.useCallback(() => {
-      onSelectionChange(newSelection);
+    const onChangeHandler = React.useCallback(e => {
+      onSelectionChange(newSelection, 'All', e);
     }, [newSelection, onSelectionChange]);
-    const PureHeaderCheckbox = React.useMemo(() => /*#__PURE__*/_jsx__default['default'](DSCheckbox__default['default'], {
+    const PureHeaderCheckbox = React.useMemo(() => /*#__PURE__*/_jsx__default["default"](DSCheckbox__default["default"], {
       "data-testid": constants.DATA_TESTID.DATA_TABLE_GLOBAL_CHECKBOX,
       title: "Toggle All Rows Selected",
       checked: currentGlobalState,
@@ -105,13 +104,13 @@ const multiSelectColumn = {
       uid
     } = row;
     const selectedState = selection === null || selection === void 0 ? void 0 : selection[uid];
-    const PureCheckboxCell = React.useMemo(() => /*#__PURE__*/_jsx__default['default'](DSCheckbox__default['default'], {
+    const PureCheckboxCell = React.useMemo(() => /*#__PURE__*/_jsx__default["default"](DSCheckbox__default["default"], {
       "data-testid": constants.DATA_TESTID.DATA_TABLE_CHECKBOX,
       title: "Toggle Row Selected",
       "aria-checked": selectedState,
       "aria-disabled": false,
       checked: selectedState,
-      onChange: () => {
+      onChange: e => {
         const newState = !selectedState;
 
         const newSelection = _objectSpread(_objectSpread({}, selection), {}, {
@@ -121,7 +120,7 @@ const multiSelectColumn = {
 
         if (!newState) delete newSelection[uid]; // if newState is false, remove from the new selection
 
-        onSelectionChange(newSelection);
+        onSelectionChange(newSelection, uid, e);
       },
       disabled: disabledRows[row.uid],
       innerRef: cell.ref,

package/cjs/addons/Columns/ColumnSelectSingle/ColumnSelectSingle.js

@@ -10,7 +10,6 @@ var constants = require('../../../configs/constants.js');
 require('react-virtual');
 require('../../../configs/useRowFlattenization.js');
 require('@babel/runtime/helpers/defineProperty');
-require('@elliemae/ds-icons/ArrowShortReturn');
 require('@elliemae/ds-icons');
 require('../../../styled.js');
 require('react/jsx-runtime');
@@ -34,10 +33,10 @@ var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 var DSRadio__default = /*#__PURE__*/_interopDefaultLegacy(DSRadio);
 
 var _div;
-const CenteredContent = /*#__PURE__*/styled__default['default'].div.withConfig({
+const CenteredContent = /*#__PURE__*/styled__default["default"].div.withConfig({
   componentId: "sc-1u47u8g-0"
 })(["display:flex;height:100%;width:100%;justify-content:center;align-items:center;"]);
-const StyledDSRadio = /*#__PURE__*/styled__default['default'](DSRadio__default['default']).withConfig({
+const StyledDSRadio = /*#__PURE__*/styled__default["default"](DSRadio__default["default"]).withConfig({
   componentId: "sc-1u47u8g-1"
 })(["padding-bottom:0;cursor:pointer;"]);
 const singleSelectColumn = {
@@ -45,7 +44,7 @@ const singleSelectColumn = {
   id: 'singleSelecter',
   // Make sure it has an ID
   // The header doesn't need anything for single selection
-  Header: () => _div || (_div = /*#__PURE__*/_jsx__default['default']("div", {})),
+  Header: () => _div || (_div = /*#__PURE__*/_jsx__default["default"]("div", {})),
   Cell: ({
     cell,
     row,
@@ -63,7 +62,7 @@ const singleSelectColumn = {
       uid
     } = row;
     const selectedState = selection === null || selection === void 0 ? void 0 : selection[uid];
-    const PureCheckBox = React.useMemo(() => /*#__PURE__*/_jsx__default['default'](CenteredContent, {}, void 0, /*#__PURE__*/_jsx__default['default'](StyledDSRadio // eslint-disable-next-line react/prop-types
+    const PureCheckBox = React.useMemo(() => /*#__PURE__*/_jsx__default["default"](CenteredContent, {}, void 0, /*#__PURE__*/_jsx__default["default"](StyledDSRadio // eslint-disable-next-line react/prop-types
     , {
       containerProps: {
         'aria-checked': selectedState,

package/cjs/addons/Editables/ComboboxEditableCell/ComboboxEditableCell.js

@@ -5,16 +5,14 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _jsx = require('@babel/runtime/helpers/jsx');
 var React = require('react');
 var ComboBoxFreeSolo = require('@elliemae/ds-form/ComboBoxFreeSolo');
-require('../../../exported-related/FilterPopover.js');
-var EditableCell = require('../../../exported-related/EditableCell.js');
-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('react-virtual');
 require('../../../configs/useRowFlattenization.js');
 require('@babel/runtime/helpers/defineProperty');
-require('@elliemae/ds-icons/ArrowShortReturn');
 require('@elliemae/ds-icons');
 require('../../../styled.js');
 require('react/jsx-runtime');
@@ -30,6 +28,8 @@ require('../../../parts/Row.js');
 require('../../../parts/Footer.js');
 require('@elliemae/ds-icons/GripperVertical');
 require('../../../parts/HoC/SortableItemContext.js');
+var EditableCell = require('../../../exported-related/EditableCell.js');
+require('@elliemae/ds-icons/MoreOptionsVert');
 require('uid');
 require('../../../exported-related/Filters/applyOutOfTheBoxFilters.js');
 require('moment');
@@ -50,7 +50,7 @@ const ComboboxEditableCell = props => {
       onCellValueChange
     },
     flattenedData
-  } = React.useContext(DataTableContext['default']);
+  } = React.useContext(DataTableContext["default"]);
   const cellValue = React.useMemo(() => cell.value, [cell.value]);
   const columnId = React.useMemo(() => cell.column.id, [cell.column.id]);
   const [value, setValue] = React.useState({
@@ -81,9 +81,9 @@ const ComboboxEditableCell = props => {
       rowIndex: cell.row.index
     });
   }, [columnId, onCellValueChange, value === null || value === void 0 ? void 0 : value.value, cell.row.index]);
-  return /*#__PURE__*/_jsx__default['default'](EditableCell.EditableCell, {
+  return /*#__PURE__*/_jsx__default["default"](EditableCell.EditableCell, {
     StandardRender: DefaultCellRender,
-    EditableRenderer: /*#__PURE__*/_jsx__default['default'](ComboBoxFreeSolo__default['default'], {
+    EditableRenderer: /*#__PURE__*/_jsx__default["default"](ComboBoxFreeSolo__default["default"], {
       value: value,
       autoFocus: true,
       onBlur: handleOnBlur,

package/cjs/addons/Editables/DateEditableCell/DateEditableCell.js

@@ -4,16 +4,14 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _jsx = require('@babel/runtime/helpers/jsx');
 var React = require('react');
-require('../../../exported-related/FilterPopover.js');
-var EditableCell = require('../../../exported-related/EditableCell.js');
-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('react-virtual');
 require('../../../configs/useRowFlattenization.js');
 require('@babel/runtime/helpers/defineProperty');
-require('@elliemae/ds-icons/ArrowShortReturn');
 require('@elliemae/ds-icons');
 require('../../../styled.js');
 require('react/jsx-runtime');
@@ -29,6 +27,8 @@ require('../../../parts/Row.js');
 require('../../../parts/Footer.js');
 require('@elliemae/ds-icons/GripperVertical');
 require('../../../parts/HoC/SortableItemContext.js');
+var EditableCell = require('../../../exported-related/EditableCell.js');
+require('@elliemae/ds-icons/MoreOptionsVert');
 require('uid');
 require('../../../exported-related/Filters/applyOutOfTheBoxFilters.js');
 require('moment');
@@ -46,7 +46,7 @@ function DateEditableCell(props) {
     tableProps: {
       onCellValueChange
     }
-  } = React.useContext(DataTableContext['default']);
+  } = React.useContext(DataTableContext["default"]);
   const [value, setValue] = React.useState(cell.value);
   const handleOnChange = React.useCallback(e => {
     const {
@@ -65,9 +65,9 @@ function DateEditableCell(props) {
       rowIndex
     });
   }, [value, onCellValueChange, cell.column.id, cell.row.index]);
-  return /*#__PURE__*/_jsx__default['default'](EditableCell.EditableCell, {
+  return /*#__PURE__*/_jsx__default["default"](EditableCell.EditableCell, {
     StandardRender: DefaultCellRender,
-    EditableRenderer: /*#__PURE__*/_jsx__default['default']("input", {
+    EditableRenderer: /*#__PURE__*/_jsx__default["default"]("input", {
       value: value,
       onChange: handleOnChange,
       onBlur: handleOnBlur,

package/cjs/addons/Editables/TextEditableCell/TextEditableCell.js

@@ -5,15 +5,13 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _jsx = require('@babel/runtime/helpers/jsx');
 var React = require('react');
 var styled = require('styled-components');
-require('../../../exported-related/FilterPopover.js');
-var EditableCell = require('../../../exported-related/EditableCell.js');
 require('@elliemae/ds-button');
-require('@elliemae/ds-icons/MoreOptionsVert');
+require('@elliemae/ds-popperjs');
+require('../../../redux/reducers/index.js');
 require('../../../configs/constants.js');
 require('react-virtual');
 require('../../../configs/useRowFlattenization.js');
 require('@babel/runtime/helpers/defineProperty');
-require('@elliemae/ds-icons/ArrowShortReturn');
 require('@elliemae/ds-icons');
 require('../../../styled.js');
 require('react/jsx-runtime');
@@ -29,6 +27,8 @@ require('../../../parts/Row.js');
 require('../../../parts/Footer.js');
 require('@elliemae/ds-icons/GripperVertical');
 require('../../../parts/HoC/SortableItemContext.js');
+var EditableCell = require('../../../exported-related/EditableCell.js');
+require('@elliemae/ds-icons/MoreOptionsVert');
 require('uid');
 require('../../../exported-related/Filters/applyOutOfTheBoxFilters.js');
 require('moment');
@@ -38,7 +38,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 
-const StyledInput = /*#__PURE__*/styled__default['default'].input.withConfig({
+const StyledInput = /*#__PURE__*/styled__default["default"].input.withConfig({
   componentId: "sc-15pvvoa-0"
 })(["outline:none;:focus{border:2px solid ", ";}max-width:100%;"], props => props.theme.colors.brand[700]);
 const TextEditableCell = props => {
@@ -51,7 +51,7 @@ const TextEditableCell = props => {
     tableProps: {
       onCellValueChange
     }
-  } = React.useContext(DataTableContext['default']);
+  } = React.useContext(DataTableContext["default"]);
   const [value, setValue] = React.useState(cell.value);
   const handleOnChange = React.useCallback(e => {
     const {
@@ -70,9 +70,9 @@ const TextEditableCell = props => {
       rowIndex
     });
   }, [value, onCellValueChange, cell.column.id, cell.row.index]);
-  return /*#__PURE__*/_jsx__default['default'](EditableCell.EditableCell, {
+  return /*#__PURE__*/_jsx__default["default"](EditableCell.EditableCell, {
     StandardRender: DefaultCellRender,
-    EditableRenderer: /*#__PURE__*/_jsx__default['default'](StyledInput, {
+    EditableRenderer: /*#__PURE__*/_jsx__default["default"](StyledInput, {
       value: value,
       onChange: handleOnChange,
       onBlur: handleOnBlur,

package/cjs/addons/Filters/Components/DateRangeFilter/index.js

@@ -18,7 +18,6 @@ var constants = require('../../../../configs/constants.js');
 require('react-virtual');
 require('../../../../configs/useRowFlattenization.js');
 require('@babel/runtime/helpers/defineProperty');
-require('@elliemae/ds-icons/ArrowShortReturn');
 require('@elliemae/ds-icons');
 require('@elliemae/ds-form/Checkbox');
 require('@elliemae/ds-form/Radio');
@@ -66,7 +65,7 @@ const DateRangeFilter = props => {
     setEndDate(dateRange.endDate || '');
   }, [dateRange]);
   React.useEffect(() => {
-    if (!startDate.includes('_') && !endDate.includes('_')) {
+    if (startDate && endDate && !startDate.includes('_') && !endDate.includes('_')) {
       onValueChange(FilterTypes.FILTER_TYPES.DATE_RANGE, {
         startDate,
         endDate
@@ -75,31 +74,32 @@ const DateRangeFilter = props => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
 
   }, [startDate, endDate]);
-  return /*#__PURE__*/_jsx__default['default'](FilterPopover.FilterPopover, {
+  return /*#__PURE__*/_jsx__default["default"](FilterPopover.FilterPopover, {
     reduxHeader: reduxHeader,
     column: column,
     columnId: id,
-    menuContent: /*#__PURE__*/_jsx__default['default'](Grid__default['default'], {
+    menuContent: /*#__PURE__*/_jsx__default["default"](Grid__default["default"], {
       width: "260px",
       "data-testid": constants.DATA_TESTID.DATA_TABLE_DATE_RANGE_CONTROLLER
-    }, void 0, /*#__PURE__*/_jsx__default['default'](Grid__default['default'], {
+    }, void 0, /*#__PURE__*/_jsx__default["default"](Grid__default["default"], {
       p: "xxs"
-    }, void 0, /*#__PURE__*/_jsx__default['default'](dsControlledForm.DSControlledDateRangePicker, {
+    }, void 0, /*#__PURE__*/_jsx__default["default"](dsControlledForm.DSControlledDateRangePicker, {
       fromDate: startDate,
       onFromDateChange: setStartDate,
       toDate: endDate,
       onToDateChange: setEndDate,
-      type: "date-range-inputs"
-    })), /*#__PURE__*/_jsx__default['default'](Grid__default['default'], {
+      type: "date-range-inputs",
+      autoFocus: true
+    })), /*#__PURE__*/_jsx__default["default"](Grid__default["default"], {
       onKeyDown: e => e.code === 'Enter' && setTimeout(() => patchHeaderFilterButtonAndMenu(id, !!(dateRange.startDate || dateRange.endDate)), 0)
-    }, void 0, /*#__PURE__*/_jsx__default['default'](dsControlledForm.DSControlledDateRangePicker, {
+    }, void 0, /*#__PURE__*/_jsx__default["default"](dsControlledForm.DSControlledDateRangePicker, {
       fromDate: startDate,
       onFromDateChange: setStartDate,
       toDate: endDate,
       onToDateChange: setEndDate,
       type: "date-range-picker-controller-only"
     }))),
-    triggerIcon: _DatePickerIcon || (_DatePickerIcon = /*#__PURE__*/_jsx__default['default'](DatePickerIcon__default['default'], {})),
+    triggerIcon: _DatePickerIcon || (_DatePickerIcon = /*#__PURE__*/_jsx__default["default"](DatePickerIcon__default["default"], {})),
     innerRef: innerRef,
     ariaLabel: "Open Date Range Filter"
   });

package/cjs/addons/Filters/Components/NumberRangeFilter/index.js

@@ -18,7 +18,6 @@ require('@elliemae/ds-icons/MoreOptionsVert');
 var constants = require('../../../../configs/constants.js');
 require('react-virtual');
 require('../../../../configs/useRowFlattenization.js');
-require('@elliemae/ds-icons/ArrowShortReturn');
 require('@elliemae/ds-icons');
 require('@elliemae/ds-form/Checkbox');
 require('@elliemae/ds-form/Radio');
@@ -47,7 +46,7 @@ var _Grid, _SearchIcon;
 
 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 NumberRangeFilter = props => {
   const {
     column,
@@ -84,28 +83,28 @@ const NumberRangeFilter = props => {
     onValueChange(FilterTypes.FILTER_TYPES.NUMBER_RANGE, nextValue);
   };
 
-  return /*#__PURE__*/_jsx__default['default'](FilterPopover.FilterPopover, {
+  return /*#__PURE__*/_jsx__default["default"](FilterPopover.FilterPopover, {
     reduxHeader: reduxHeader,
     column: column,
     columnId: column.id,
-    menuContent: /*#__PURE__*/_jsx__default['default'](Grid__default['default'], {
+    menuContent: /*#__PURE__*/_jsx__default["default"](Grid__default["default"], {
       "data-testid": constants.DATA_TESTID.DATA_TABLE_NUMBER_RANGE_CONTROLLER,
       gutter: "xxs",
       padding: "xs",
       cols: ['50px', 'auto', '50px']
-    }, void 0, /*#__PURE__*/_jsx__default['default'](DSTextBox__default['default'], {
+    }, void 0, /*#__PURE__*/_jsx__default["default"](DSTextBox__default["default"], {
       value: `${(filterValue === null || filterValue === void 0 ? void 0 : filterValue.from) ?? ''}`,
       onChange: handleFromChange,
       type: "number"
-    }), _Grid || (_Grid = /*#__PURE__*/_jsx__default['default'](Grid__default['default'], {
+    }), _Grid || (_Grid = /*#__PURE__*/_jsx__default["default"](Grid__default["default"], {
       justifyItems: "center",
       alignItems: "center"
-    }, void 0, "\u2014")), /*#__PURE__*/_jsx__default['default'](DSTextBox__default['default'], {
+    }, void 0, "\u2014")), /*#__PURE__*/_jsx__default["default"](DSTextBox__default["default"], {
       value: `${(filterValue === null || filterValue === void 0 ? void 0 : filterValue.to) ?? ''}`,
       onChange: handleToChange,
       type: "number"
     })),
-    triggerIcon: _SearchIcon || (_SearchIcon = /*#__PURE__*/_jsx__default['default'](SearchIcon__default['default'], {})),
+    triggerIcon: _SearchIcon || (_SearchIcon = /*#__PURE__*/_jsx__default["default"](SearchIcon__default["default"], {})),
     innerRef: innerRef,
     ariaLabel: "Open Number Range Filter"
   });

package/cjs/addons/Filters/Components/SelectFilter/BaseSelectFilter.js

@@ -35,7 +35,6 @@ require('@elliemae/ds-icons/MoreOptionsVert');
 var constants = require('../../../../configs/constants.js');
 require('../../../../configs/useRowFlattenization.js');
 require('@babel/runtime/helpers/defineProperty');
-require('@elliemae/ds-icons/ArrowShortReturn');
 require('@elliemae/ds-icons');
 require('@elliemae/ds-form/Radio');
 require('../../../../parts/TableContent.js');
@@ -79,7 +78,7 @@ const BaseSelectFilter = props => {
     reduxHeader,
     innerRef
   } = props,
-        rest = _objectWithoutProperties__default['default'](props, _excluded);
+        rest = _objectWithoutProperties__default["default"](props, _excluded);
 
   const filterOptions = React.useMemo(() => {
     // If the user didn't provide options, use the available ones
@@ -113,9 +112,9 @@ const BaseSelectFilter = props => {
     onMenuItemKeyDown
   } = useSelectFilterHandlers.useSelectFilterHandlers(props);
 
-  const Select = /*#__PURE__*/_jsx__default['default'](components.Wrapper, {
+  const Select = /*#__PURE__*/_jsx__default["default"](components.Wrapper, {
     "data-testid": rest['data-testid']
-  }, void 0, /*#__PURE__*/_jsx__default['default'](components.InputWrapper, {}, void 0, /*#__PURE__*/jsxRuntime.jsx(components.Input, {
+  }, void 0, /*#__PURE__*/_jsx__default["default"](components.InputWrapper, {}, void 0, /*#__PURE__*/jsxRuntime.jsx(components.Input, {
     value: inputValue,
     onChange: handleInputChange,
     autoFocus: true,
@@ -123,7 +122,7 @@ const BaseSelectFilter = props => {
     ref: inputRef
   })), /*#__PURE__*/jsxRuntime.jsx(components.VirtualListWrapper, {
     ref: virtualListRef,
-    children: /*#__PURE__*/_jsx__default['default'](components.MenuList, {
+    children: /*#__PURE__*/_jsx__default["default"](components.MenuList, {
       style: {
         height: `${totalSize}px`
       }
@@ -144,7 +143,7 @@ const BaseSelectFilter = props => {
         tabIndex: -1,
         "data-testid": constants.DATA_TESTID.DATA_TABLE_SELECT_MENU_ITEM,
         onKeyDown: onMenuItemKeyDown(option, index, virtualIndex, inputRef, innerRef),
-        children: [isMulti && /*#__PURE__*/_jsx__default['default'](DSCheckbox__default['default'], {
+        children: [isMulti && /*#__PURE__*/_jsx__default["default"](DSCheckbox__default["default"], {
           style: {
             marginRight: '10px'
           },
@@ -155,12 +154,12 @@ const BaseSelectFilter = props => {
     }))
   }));
 
-  return /*#__PURE__*/_jsx__default['default'](FilterPopover.FilterPopover, {
+  return /*#__PURE__*/_jsx__default["default"](FilterPopover.FilterPopover, {
     reduxHeader: reduxHeader,
     column: column,
     columnId: column.id,
     menuContent: Select,
-    triggerIcon: _SearchIcon || (_SearchIcon = /*#__PURE__*/_jsx__default['default'](SearchIcon__default['default'], {})),
+    triggerIcon: _SearchIcon || (_SearchIcon = /*#__PURE__*/_jsx__default["default"](SearchIcon__default["default"], {})),
     innerRef: innerRef,
     ariaLabel: "Open Selection Filter"
   });