@elliemae/ds-data-table 2.3.0-alpha.8 → 2.3.0-next.2

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

@@ -0,0 +1,166 @@
+'use strict';
+
+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');
+require('core-js/modules/web.dom-collections.iterator.js');
+require('core-js/modules/esnext.set.add-all.js');
+require('core-js/modules/esnext.set.delete-all.js');
+require('core-js/modules/esnext.set.difference.js');
+require('core-js/modules/esnext.set.every.js');
+require('core-js/modules/esnext.set.filter.js');
+require('core-js/modules/esnext.set.find.js');
+require('core-js/modules/esnext.set.intersection.js');
+require('core-js/modules/esnext.set.is-disjoint-from.js');
+require('core-js/modules/esnext.set.is-subset-of.js');
+require('core-js/modules/esnext.set.is-superset-of.js');
+require('core-js/modules/esnext.set.join.js');
+require('core-js/modules/esnext.set.map.js');
+require('core-js/modules/esnext.set.reduce.js');
+require('core-js/modules/esnext.set.some.js');
+require('core-js/modules/esnext.set.symmetric-difference.js');
+require('core-js/modules/esnext.set.union.js');
+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');
+var React = require('react');
+var Grid = require('@elliemae/ds-grid');
+var dsControlledForm = require('@elliemae/ds-controlled-form');
+var dsIcons = require('@elliemae/ds-icons');
+var FilterPopover = require('../../../../exported-related/FilterPopover.js');
+require('../../../../styled.js');
+require('../../../../DataTableContext.js');
+require('react/jsx-runtime');
+require('styled-components');
+require('@elliemae/ds-button');
+require('@elliemae/ds-utilities');
+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');
+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-form');
+require('../../../../parts/TableContent.js');
+require('@elliemae/ds-circular-progress-indicator');
+require('@elliemae/ds-system');
+require('../../../../parts/Row.js');
+require('../../../../parts/Footer.js');
+require('../../../../parts/HoC/SortableItemContext.js');
+require('uid');
+require('../../../../exported-related/Filters/applyOutOfTheBoxFilters.js');
+require('moment');
+require('core-js/modules/esnext.async-iterator.some.js');
+require('core-js/modules/esnext.iterator.some.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
+
+var _SearchXsmall;
+const BaseSelectFilter = props => {
+  var _column$ref$current$o, _column$ref, _column$ref$current;
+
+  const {
+    isMulti = false,
+    selectedItems,
+    column,
+    type,
+    column: {
+      id,
+      filterOptions: userFilterOptions
+    },
+    ctx: {
+      tableProps: {
+        data
+      }
+    },
+    reduxHeader,
+    innerRef,
+    onValueChange
+  } = props;
+  const filterOptions = React.useMemo(() => {
+    // If the user didn't provide options, use the available ones
+    if (!userFilterOptions) {
+      const automaticFilters = [...new Set(data.map(datum => datum[id].toString()))].map(item => ({
+        type: 'option',
+        dsId: item,
+        value: item,
+        label: item
+      }));
+      return automaticFilters;
+    } // If user provided the array itself, use it
+
+
+    if (Array.isArray(userFilterOptions)) return userFilterOptions; // Otherwise, it is a function
+
+    return userFilterOptions();
+  }, [data, id, userFilterOptions]);
+
+  const handleOnChange = value => {
+    if (isMulti) {
+      const multiSelectedItem = selectedItems;
+      const isFound = multiSelectedItem.find(item => item.dsId === value.dsId);
+
+      if (isFound) {
+        onValueChange(type, multiSelectedItem.filter(item => item.dsId !== value.dsId));
+      } else {
+        onValueChange(type, [...multiSelectedItem, value]);
+      }
+    } else {
+      const singleSelectedItem = selectedItems;
+      onValueChange(type, (singleSelectedItem === null || singleSelectedItem === void 0 ? void 0 : singleSelectedItem.dsId) !== value.dsId ? value : null);
+    }
+  };
+
+  const [filters, setFilteredOptions] = React.useState(filterOptions);
+  React.useEffect(() => {
+    setFilteredOptions(filterOptions);
+  }, [filterOptions]);
+  const filteredOptions = React.useCallback(filter => filterOptions.filter(option => option.type === 'separator' || option.label.toLowerCase().includes(filter.toLowerCase())), [filterOptions]);
+  const handleOnFilter = React.useCallback(newFilter => {
+    setFilteredOptions(filteredOptions(newFilter));
+  }, [filteredOptions]);
+
+  const Select = /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
+    "data-testid": isMulti ? constants.DATA_TESTID.DATA_TABLE_MULTISELECT_CONTROLLER : constants.DATA_TESTID.DATA_TABLE_SINGLESELECT_CONTROLLER,
+    style: {
+      background: '#fff',
+      position: 'relative'
+    }
+  }, void 0, /*#__PURE__*/_jsx__default["default"](dsControlledForm.DSComboBox, {
+    inline: true,
+    autoFocus: true,
+    options: filters,
+    onChange: handleOnChange,
+    selectedValues: selectedItems,
+    onFilter: handleOnFilter,
+    menuMaxHeight: 300
+  }));
+
+  const handleOnClickOutside = () => {
+    setFilteredOptions(filteredOptions(''));
+  };
+
+  return /*#__PURE__*/_jsx__default["default"](FilterPopover.FilterPopover, {
+    reduxHeader: reduxHeader,
+    column: column,
+    columnId: column.id,
+    menuContent: Select,
+    triggerIcon: _SearchXsmall || (_SearchXsmall = /*#__PURE__*/_jsx__default["default"](dsIcons.SearchXsmall, {})),
+    innerRef: innerRef,
+    ariaLabel: "Open Selection Filter",
+    onClickOutsideMenu: handleOnClickOutside,
+    customStyles: {
+      width: (_column$ref$current$o = (_column$ref = column.ref) === null || _column$ref === void 0 ? void 0 : (_column$ref$current = _column$ref.current) === null || _column$ref$current === void 0 ? void 0 : _column$ref$current.offsetWidth) !== null && _column$ref$current$o !== void 0 ? _column$ref$current$o : '0px'
+    }
+  });
+};
+
+exports.BaseSelectFilter = BaseSelectFilter;

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

@@ -0,0 +1,76 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _jsx = require('@babel/runtime/helpers/jsx');
+require('react');
+var BaseSelectFilter = require('./BaseSelectFilter.js');
+require('@babel/runtime/helpers/defineProperty');
+require('core-js/modules/web.dom-collections.iterator.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');
+require('@elliemae/ds-button');
+require('@elliemae/ds-popperjs');
+require('styled-components');
+require('../../../../redux/reducers/index.js');
+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');
+require('../../../../configs/useRowFlattenization.js');
+require('core-js/modules/esnext.async-iterator.map.js');
+require('core-js/modules/esnext.iterator.map.js');
+require('@elliemae/ds-icons');
+require('../../../../styled.js');
+require('react/jsx-runtime');
+require('@elliemae/ds-form');
+require('../../../../parts/TableContent.js');
+require('@elliemae/ds-grid');
+require('@elliemae/ds-circular-progress-indicator');
+require('@elliemae/ds-system');
+require('../../../../DataTableContext.js');
+require('../../../../parts/Row.js');
+require('../../../../parts/Footer.js');
+require('../../../../parts/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('core-js/modules/esnext.async-iterator.some.js');
+require('core-js/modules/esnext.iterator.some.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
+
+const MultiSelectFilter = _ref => {
+  let {
+    column,
+    ctx,
+    onValueChange,
+    patchHeaderFilterButtonAndMenu,
+    patchHeader,
+    reduxHeader,
+    filterValue,
+    innerRef
+  } = _ref;
+  return /*#__PURE__*/_jsx__default["default"](BaseSelectFilter.BaseSelectFilter, {
+    reduxHeader: reduxHeader,
+    "data-testid": constants.DATA_TESTID.DATA_TABLE_MULTISELECT_CONTROLLER,
+    isMulti: true,
+    column: column,
+    ctx: ctx,
+    selectedItems: filterValue !== null && filterValue !== void 0 ? filterValue : [],
+    type: FilterTypes.FILTER_TYPES.MULTI_SELECT,
+    onValueChange: onValueChange,
+    patchHeaderFilterButtonAndMenu: patchHeaderFilterButtonAndMenu,
+    patchHeader: patchHeader,
+    innerRef: innerRef
+  });
+};
+
+exports.MultiSelectFilter = MultiSelectFilter;

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

@@ -0,0 +1,76 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _jsx = require('@babel/runtime/helpers/jsx');
+require('react');
+var BaseSelectFilter = require('./BaseSelectFilter.js');
+require('@babel/runtime/helpers/defineProperty');
+require('core-js/modules/web.dom-collections.iterator.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');
+require('@elliemae/ds-button');
+require('@elliemae/ds-popperjs');
+require('styled-components');
+require('../../../../redux/reducers/index.js');
+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');
+require('../../../../configs/useRowFlattenization.js');
+require('core-js/modules/esnext.async-iterator.map.js');
+require('core-js/modules/esnext.iterator.map.js');
+require('@elliemae/ds-icons');
+require('../../../../styled.js');
+require('react/jsx-runtime');
+require('@elliemae/ds-form');
+require('../../../../parts/TableContent.js');
+require('@elliemae/ds-grid');
+require('@elliemae/ds-circular-progress-indicator');
+require('@elliemae/ds-system');
+require('../../../../DataTableContext.js');
+require('../../../../parts/Row.js');
+require('../../../../parts/Footer.js');
+require('../../../../parts/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('core-js/modules/esnext.async-iterator.some.js');
+require('core-js/modules/esnext.iterator.some.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
+
+const SingleSelectFilter = _ref => {
+  let {
+    column,
+    ctx,
+    patchHeaderFilterButtonAndMenu,
+    patchHeader,
+    onValueChange,
+    filterValue,
+    reduxHeader,
+    innerRef
+  } = _ref;
+  return /*#__PURE__*/_jsx__default["default"](BaseSelectFilter.BaseSelectFilter, {
+    reduxHeader: reduxHeader,
+    "data-testid": constants.DATA_TESTID.DATA_TABLE_SINGLESELECT_CONTROLLER,
+    isSingle: true,
+    column: column,
+    ctx: ctx,
+    selectedItems: filterValue,
+    type: FilterTypes.FILTER_TYPES.SELECT,
+    onValueChange: onValueChange,
+    patchHeaderFilterButtonAndMenu: patchHeaderFilterButtonAndMenu,
+    patchHeader: patchHeader,
+    innerRef: innerRef
+  });
+};
+
+exports.SingleSelectFilter = SingleSelectFilter;

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

@@ -0,0 +1,36 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var styled = require('styled-components');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
+
+const Wrapper = /*#__PURE__*/styled__default["default"].div.withConfig({
+  componentId: "sc-px47an-0"
+})(["display:flex;flex-direction:column;align-items:center;"]);
+const InputWrapper = /*#__PURE__*/styled__default["default"].div.withConfig({
+  componentId: "sc-px47an-1"
+})(["width:100%;padding:10px;"]); // TODO: use dimsum text input
+
+const Input = /*#__PURE__*/styled__default["default"].input.withConfig({
+  componentId: "sc-px47an-2"
+})(["width:100%;border:1px solid #eee;height:25px;&:focus{outline:none;border:1px solid ", ";}"], props => props.theme.colors.brand[600]);
+const MenuList = /*#__PURE__*/styled__default["default"].div.withConfig({
+  componentId: "sc-px47an-3"
+})(["position:relative;width:100%;"]);
+const MenuItem = /*#__PURE__*/styled__default["default"].div.withConfig({
+  componentId: "sc-px47an-4"
+})(["display:flex;box-sizing:border-box;align-items:center;white-space:wrap;position:absolute;top:0;left:0;width:100%;padding:10px;border:1px solid transparent;cursor:pointer;&:hover{border:1px solid ", ";}&:focus{border:1px solid ", ";}"], props => props.theme.colors.brand[600], props => props.theme.colors.brand[600]);
+const VirtualListWrapper = /*#__PURE__*/styled__default["default"].div.withConfig({
+  componentId: "sc-px47an-5"
+})(["width:100%;overflow:auto;max-height:300px;"]);
+
+exports.Input = Input;
+exports.InputWrapper = InputWrapper;
+exports.MenuItem = MenuItem;
+exports.MenuList = MenuList;
+exports.VirtualListWrapper = VirtualListWrapper;
+exports.Wrapper = Wrapper;

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

@@ -0,0 +1,82 @@
+'use strict';
+
+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/web.dom-collections.iterator.js');
+var React = require('react');
+var utils = require('./utils.js');
+
+const useSelectFilterHandlers = _ref => {
+  let {
+    column: {
+      id
+    },
+    type,
+    isSingle,
+    isMulti,
+    selectedItems,
+    onValueChange,
+    patchHeaderFilterButtonAndMenu,
+    patchHeader
+  } = _ref;
+  const handleSelectItem = React.useCallback(option => {
+    if (isSingle) {
+      onValueChange(type, option);
+    } else if (isMulti) {
+      let nextSelectedItems = [];
+
+      if (selectedItems.includes(option)) {
+        nextSelectedItems = selectedItems.filter(opt => opt !== option);
+      } else {
+        nextSelectedItems = [...selectedItems, option];
+      }
+
+      onValueChange(type, nextSelectedItems);
+    }
+  }, [isSingle, isMulti, onValueChange, type, selectedItems]);
+  const onInputWrapperKeyDown = React.useCallback(e => {
+    if (e.code === 'ArrowDown') utils.focusNextMenuItem(e, -1);
+  }, []);
+  const onMenuItemClick = React.useCallback(option => () => {
+    handleSelectItem(option);
+    if (isSingle) patchHeaderFilterButtonAndMenu(id, true);
+  }, [handleSelectItem, id, isSingle, patchHeaderFilterButtonAndMenu]);
+  const onMenuItemKeyDown = React.useCallback((option, index, virtualIndex, inputRef, innerRef) => e => {
+    if (e.code === 'ArrowUp') {
+      if (index === 0) inputRef.current.focus();else utils.focusPrevMenuItem(e, virtualIndex);
+    }
+
+    if (e.code === 'ArrowDown') utils.focusNextMenuItem(e, virtualIndex);
+
+    if (e.code === 'Space') {
+      e.preventDefault();
+      handleSelectItem(option);
+
+      if (isSingle) {
+        patchHeader(id, {
+          hideFilterMenu: true,
+          hideFilterButton: false
+        });
+        setTimeout(() => innerRef.current.focus());
+      }
+    }
+
+    if (e.code === 'Enter') {
+      patchHeader(id, {
+        hideFilterMenu: true,
+        hideFilterButton: false
+      });
+      setTimeout(() => innerRef.current.focus());
+    }
+  }, [handleSelectItem, id, isSingle, patchHeader]);
+  return {
+    onInputWrapperKeyDown,
+    onMenuItemClick,
+    onMenuItemKeyDown
+  };
+};
+
+exports.useSelectFilterHandlers = useSelectFilterHandlers;

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

@@ -0,0 +1,52 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+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');
+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('@babel/runtime/helpers/jsx');
+require('@elliemae/ds-icons');
+require('styled-components');
+require('../../../../styled.js');
+require('react/jsx-runtime');
+require('@elliemae/ds-form');
+require('../../../../parts/TableContent.js');
+require('@elliemae/ds-grid');
+require('@elliemae/ds-circular-progress-indicator');
+require('@elliemae/ds-system');
+require('@elliemae/ds-button');
+require('../../../../DataTableContext.js');
+require('../../../../parts/Row.js');
+require('../../../../parts/Footer.js');
+require('../../../../parts/HoC/SortableItemContext.js');
+
+const focusNextMenuItem = (e, index) => {
+  var _menuItems$item;
+
+  e.preventDefault();
+  const menuItems = document.querySelectorAll("[data-testid=\"".concat(constants.DATA_TESTID.DATA_TABLE_SELECT_MENU_ITEM, "\"]"));
+  (_menuItems$item = menuItems.item(index + 1)) === null || _menuItems$item === void 0 ? void 0 : _menuItems$item.focus();
+};
+const focusPrevMenuItem = (e, index) => {
+  var _menuItems$item2;
+
+  e.preventDefault();
+  const menuItems = document.querySelectorAll("[data-testid=\"".concat(constants.DATA_TESTID.DATA_TABLE_SELECT_MENU_ITEM, "\"]"));
+  (_menuItems$item2 = menuItems.item(index - 1)) === null || _menuItems$item2 === void 0 ? void 0 : _menuItems$item2.focus();
+};
+
+exports.focusNextMenuItem = focusNextMenuItem;
+exports.focusPrevMenuItem = focusPrevMenuItem;

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

@@ -0,0 +1,105 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _jsx = require('@babel/runtime/helpers/jsx');
+require('core-js/modules/web.dom-collections.iterator.js');
+var React = require('react');
+var dsIcons = require('@elliemae/ds-icons');
+var Grid = require('@elliemae/ds-grid');
+var dsControlledForm = require('@elliemae/ds-controlled-form');
+var FilterPopover = require('../../../../exported-related/FilterPopover.js');
+require('../../../../styled.js');
+require('../../../../DataTableContext.js');
+require('react/jsx-runtime');
+require('styled-components');
+require('@elliemae/ds-button');
+require('@elliemae/ds-utilities');
+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/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-form');
+require('../../../../parts/TableContent.js');
+require('@elliemae/ds-circular-progress-indicator');
+require('@elliemae/ds-system');
+require('../../../../parts/Row.js');
+require('../../../../parts/Footer.js');
+require('../../../../parts/HoC/SortableItemContext.js');
+require('uid');
+var FilterTypes = require('../../../../exported-related/FilterTypes.js');
+require('../../../../exported-related/Filters/applyOutOfTheBoxFilters.js');
+require('moment');
+require('core-js/modules/esnext.async-iterator.some.js');
+require('core-js/modules/esnext.iterator.some.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
+var Grid__default = /*#__PURE__*/_interopDefaultLegacy(Grid);
+
+var _DatePicker;
+const SingleDateFilter = props => {
+  const {
+    column,
+    column: {
+      id
+    },
+    filterValue,
+    reduxHeader,
+    onValueChange,
+    patchHeaderFilterButtonAndMenu,
+    innerRef
+  } = props;
+  const [date, setDate] = React.useState(filterValue || '');
+  React.useEffect(() => {
+    setDate(filterValue || '');
+  }, [filterValue]);
+  React.useEffect(() => {
+    if (!date.includes('_')) onValueChange(FilterTypes.FILTER_TYPES.SINGLE_DATE, date || undefined); // We are missing onValueChange on purpose, this is an internal function and won't cause any problems
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [date]);
+  const commitDateChange = React.useCallback(() => {
+    patchHeaderFilterButtonAndMenu(id, true);
+  }, [id, patchHeaderFilterButtonAndMenu]);
+  return /*#__PURE__*/_jsx__default["default"](FilterPopover.FilterPopover, {
+    reduxHeader: reduxHeader,
+    column: column,
+    columnId: column.id,
+    menuContent: /*#__PURE__*/_jsx__default["default"](Grid__default["default"], {
+      "data-testid": constants.DATA_TESTID.DATA_TABLE_SINGLE_DATE_CONTROLLER,
+      width: "260px"
+    }, void 0, /*#__PURE__*/_jsx__default["default"](Grid__default["default"], {
+      p: "xxs",
+      style: {
+        background: 'white'
+      }
+    }, void 0, /*#__PURE__*/_jsx__default["default"](dsControlledForm.DSControlledDateTimePicker, {
+      date: date,
+      onDateChange: setDate,
+      type: "date-inputs",
+      isClearable: true,
+      autoFocus: true
+    })), /*#__PURE__*/_jsx__default["default"](Grid__default["default"], {
+      onKeyDown: e => e.code === 'Enter' && setTimeout(commitDateChange, 0)
+    }, void 0, /*#__PURE__*/_jsx__default["default"](dsControlledForm.DSControlledDateTimePicker, {
+      date: date,
+      onDateChange: setDate,
+      type: "date-picker-controller-only"
+    }))),
+    triggerIcon: _DatePicker || (_DatePicker = /*#__PURE__*/_jsx__default["default"](dsIcons.DatePicker2, {})),
+    innerRef: innerRef,
+    ariaLabel: "Open Single Date Filter"
+  });
+};
+
+exports.SingleDateFilter = SingleDateFilter;

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

@@ -0,0 +1,21 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var index = require('./DateRangeFilter/index.js');
+var index$1 = require('./DateSwitcherFilter/index.js');
+var index$2 = require('./NumberRangeFilter/index.js');
+var index$3 = require('./CurrencyRangeFilter/index.js');
+var SingleSelectFilter = require('./SelectFilter/SingleSelectFilter.js');
+var MultiSelectFilter = require('./SelectFilter/MultiSelectFilter.js');
+var index$4 = require('./SingleDateFilter/index.js');
+
+
+
+exports.DateRangeFilter = index.DateRangeFilter;
+exports.DateSwitcherFilter = index$1.DateSwitcherFilter;
+exports.NumberRangeFilter = index$2.NumberRangeFilter;
+exports.CurrencyRangeFilter = index$3.CurrencyRangeFilter;
+exports.SingleSelectFilter = SingleSelectFilter.SingleSelectFilter;
+exports.MultiSelectFilter = MultiSelectFilter.MultiSelectFilter;
+exports.SingleDateFilter = index$4.SingleDateFilter;

package/cjs/addons/Filters/index.js

@@ -0,0 +1,21 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var index = require('./Components/DateRangeFilter/index.js');
+var index$1 = require('./Components/DateSwitcherFilter/index.js');
+var index$2 = require('./Components/NumberRangeFilter/index.js');
+var index$3 = require('./Components/CurrencyRangeFilter/index.js');
+var SingleSelectFilter = require('./Components/SelectFilter/SingleSelectFilter.js');
+var MultiSelectFilter = require('./Components/SelectFilter/MultiSelectFilter.js');
+var index$4 = require('./Components/SingleDateFilter/index.js');
+
+
+
+exports.DateRangeFilter = index.DateRangeFilter;
+exports.DateSwitcherFilter = index$1.DateSwitcherFilter;
+exports.NumberRangeFilter = index$2.NumberRangeFilter;
+exports.CurrencyRangeFilter = index$3.CurrencyRangeFilter;
+exports.SingleSelectFilter = SingleSelectFilter.SingleSelectFilter;
+exports.MultiSelectFilter = MultiSelectFilter.MultiSelectFilter;
+exports.SingleDateFilter = index$4.SingleDateFilter;