@elliemae/ds-data-table 2.2.0-alpha.2 → 2.2.0-next.1

package/cjs/parts/DropIndicator.js

@@ -1,90 +1,81 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+'use strict';
+
+var _jsx = require('@babel/runtime/helpers/jsx');
+require('react');
+var styled = require('styled-components');
+var zIndexInternalConfig = require('../configs/zIndexInternalConfig.js');
+var SortableItemContext = require('./HoC/SortableItemContext.js');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
+var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
+
+var _circle;
+
+const getPositionStyles = _ref => {
+  let {
+    dropIndicatorPosition,
+    vertical
+  } = _ref;
+
+  if (vertical) {
+    return "\n      left: ".concat(dropIndicatorPosition === SortableItemContext.DropIndicatorPosition.Before ? '0' : 'unset', ";\n      right: ").concat(dropIndicatorPosition === SortableItemContext.DropIndicatorPosition.After ? '0' : 'unset', ";\n    ");
   }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+
+  return "\n      top: ".concat(dropIndicatorPosition === SortableItemContext.DropIndicatorPosition.Before ? '0' : 'unset', ";\n      bottom: ").concat(dropIndicatorPosition === SortableItemContext.DropIndicatorPosition.After ? '0' : 'unset', ";\n    ");
 };
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+
+const getCircleStyles = _ref2 => {
+  let {
+    dropIndicatorPosition,
+    vertical
+  } = _ref2;
+  return {
+    position: 'absolute',
+    zIndex: zIndexInternalConfig.ZIndexDataTable.DROP_INDICATOR,
+    top: vertical || dropIndicatorPosition === SortableItemContext.DropIndicatorPosition.After ? 'unset' : '-2px',
+    bottom: vertical || dropIndicatorPosition === SortableItemContext.DropIndicatorPosition.Before ? 'unset' : '-2px',
+    left: !vertical || dropIndicatorPosition === SortableItemContext.DropIndicatorPosition.After ? 'unset' : '-2px',
+    right: !vertical || dropIndicatorPosition === SortableItemContext.DropIndicatorPosition.Before ? 'unset' : '-2px',
+    opacity: 1
   };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
-var DropIndicator_exports = {};
-__export(DropIndicator_exports, {
-  DropIndicator: () => DropIndicator,
-  default: () => DropIndicator_default
-});
-var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
-var import_styled_components = __toESM(require("styled-components"));
-var import_zIndexInternalConfig = __toESM(require("../configs/zIndexInternalConfig"));
-var import_SortableItemContext = __toESM(require("./HoC/SortableItemContext"));
-const getPositionStyles = ({ dropIndicatorPosition, vertical }) => {
-  if (vertical) {
-    return `
-      left: ${dropIndicatorPosition === import_SortableItemContext.DropIndicatorPosition.Before ? "0" : "unset"};
-      right: ${dropIndicatorPosition === import_SortableItemContext.DropIndicatorPosition.After ? "0" : "unset"};
-    `;
-  }
-  return `
-      top: ${dropIndicatorPosition === import_SortableItemContext.DropIndicatorPosition.Before ? "0" : "unset"};
-      bottom: ${dropIndicatorPosition === import_SortableItemContext.DropIndicatorPosition.After ? "0" : "unset"};
-    `;
 };
-const getCircleStyles = ({ dropIndicatorPosition, vertical }) => ({
-  position: "absolute",
-  zIndex: import_zIndexInternalConfig.ZIndexDataTable.DROP_INDICATOR,
-  top: vertical || dropIndicatorPosition === import_SortableItemContext.DropIndicatorPosition.After ? "unset" : "-2px",
-  bottom: vertical || dropIndicatorPosition === import_SortableItemContext.DropIndicatorPosition.Before ? "unset" : "-2px",
-  left: !vertical || dropIndicatorPosition === import_SortableItemContext.DropIndicatorPosition.After ? "unset" : "-2px",
-  right: !vertical || dropIndicatorPosition === import_SortableItemContext.DropIndicatorPosition.Before ? "unset" : "-2px",
-  opacity: 1
-});
-const StyledIndicator = import_styled_components.default.div`
-  position: absolute;
-  ${getPositionStyles}
-  box-sizing: border-box;
-  width: ${(props) => props.vertical ? "2px" : "100%"};
-  height: ${(props) => props.vertical ? "100%" : "2px"};
-  background-color: ${(props) => props.theme.colors.brand[600]};
-  z-index: ${import_zIndexInternalConfig.ZIndexDataTable.DROP_INDICATOR};
-`;
-const CircleIndicator = (style) => /* @__PURE__ */ import_react.default.createElement("svg", {
+
+const StyledIndicator = /*#__PURE__*/styled__default["default"].div.withConfig({
+  componentId: "sc-1aa87sx-0"
+})(["position:absolute;", " box-sizing:border-box;width:", ";height:", ";background-color:", ";z-index:", ";"], getPositionStyles, props => props.vertical ? '2px' : '100%', props => props.vertical ? '100%' : '2px', props => props.theme.colors.brand[600], zIndexInternalConfig.ZIndexDataTable.DROP_INDICATOR);
+
+const CircleIndicator = style => /*#__PURE__*/_jsx__default["default"]("svg", {
   height: "6",
   width: "6",
-  style
-}, /* @__PURE__ */ import_react.default.createElement("circle", {
+  style: style
+}, void 0, _circle || (_circle = /*#__PURE__*/_jsx__default["default"]("circle", {
   cx: "3",
   cy: "3",
   r: "3",
   strokeWidth: "0",
   fill: "#1E79C2"
-}));
-const DropIndicator = ({ vertical, dropIndicatorPosition, isLast }) => {
-  if (![import_SortableItemContext.DropIndicatorPosition.After, import_SortableItemContext.DropIndicatorPosition.Before].includes(dropIndicatorPosition))
-    return null;
-  const safeDropIndicatorPosition = isLast ? import_SortableItemContext.DropIndicatorPosition.Before : dropIndicatorPosition;
-  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, CircleIndicator(getCircleStyles({ vertical, dropIndicatorPosition: safeDropIndicatorPosition })), /* @__PURE__ */ import_react.default.createElement(StyledIndicator, {
+})));
+
+const DropIndicator = _ref3 => {
+  let {
     vertical,
-    dropIndicatorPosition: safeDropIndicatorPosition
-  }));
+    dropIndicatorPosition,
+    isLast
+  } = _ref3;
+  if (![SortableItemContext.DropIndicatorPosition.After, SortableItemContext.DropIndicatorPosition.Before].includes(dropIndicatorPosition)) return null;
+  const safeDropIndicatorPosition = isLast ? SortableItemContext.DropIndicatorPosition.Before : dropIndicatorPosition;
+  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [CircleIndicator(getCircleStyles({
+      vertical,
+      dropIndicatorPosition: safeDropIndicatorPosition
+    })), /*#__PURE__*/_jsx__default["default"](StyledIndicator, {
+      vertical: vertical,
+      dropIndicatorPosition: safeDropIndicatorPosition
+    })]
+  });
 };
-var DropIndicator_default = DropIndicator;
-module.exports = __toCommonJS(DropIndicator_exports);
-//# sourceMappingURL=DropIndicator.js.map
+
+module.exports = DropIndicator;

package/cjs/parts/EmptyContent.js

@@ -1,81 +1,51 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
-var EmptyContent_exports = {};
-__export(EmptyContent_exports, {
-  EmptyContent: () => EmptyContent,
-  default: () => EmptyContent_default
+'use strict';
+
+var _jsx = require('@babel/runtime/helpers/jsx');
+var React = require('react');
+var Grid = require('@elliemae/ds-grid');
+var dsIcons = require('@elliemae/ds-icons');
+var dsSystem = require('@elliemae/ds-system');
+var DSButton = require('@elliemae/ds-button');
+var styled = require('styled-components');
+var DataTableContext = require('../DataTableContext.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var Grid__default = /*#__PURE__*/_interopDefaultLegacy(Grid);
+var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
+var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
+
+var _Icon;
+const EmptyStateWrapper = /*#__PURE__*/styled__default["default"](Grid__default["default"]).withConfig({
+  componentId: "sc-t6wd9y-0"
+})(["position:sticky;height:fit-content;top:0;left:0;"]);
+const Icon = /*#__PURE__*/styled__default["default"](dsIcons.WarningTriangle).withConfig({
+  componentId: "sc-t6wd9y-1"
+})(["fill:", ";color:", ";justify-self:center;"], props => props.theme.colors.neutral[300], props => props.theme.colors.neutral[300]);
+const PrimaryMessage = /*#__PURE__*/styled__default["default"].p.withConfig({
+  componentId: "sc-t6wd9y-2"
+})(["text-align:center;font-weight:bold;font-size:", ";color:", ";margin-top:", ";margin-bottom:", ";"], props => dsSystem.toMobile(props.theme.fontSizes.value[400]), props => props.theme.colors.neutral[600], props => dsSystem.__UNSAFE_SPACE_TO_DIMSUM(props.theme.space.s), props => dsSystem.__UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs));
+const SecondaryMessage = /*#__PURE__*/styled__default["default"].p.withConfig({
+  componentId: "sc-t6wd9y-3"
+})(["text-align:center;font-size:", ";color:", ";margin:0;"], props => dsSystem.toMobile(props.theme.fontSizes.value[400]), props => props.theme.colors.neutral[500]);
+const Button = /*#__PURE__*/styled__default["default"](DSButton__default["default"]).withConfig({
+  componentId: "sc-t6wd9y-4"
+})(["margin-top:", ";justify-self:center;width:fit-content;"], props => dsSystem.__UNSAFE_SPACE_TO_DIMSUM(props.theme.space.m));
+const CenterContentFlexWrapper = /*#__PURE__*/styled__default["default"].div.withConfig({
+  componentId: "sc-t6wd9y-5"
+})(["width:", "px;height:calc(100% - 48px);display:flex;align-items:center;"], _ref => {
+  let {
+    width
+  } = _ref;
+  return width;
 });
-var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
-var import_ds_grid = __toESM(require("@elliemae/ds-grid"));
-var import_ds_icons = __toESM(require("@elliemae/ds-icons"));
-var import_ds_system = __toESM(require("@elliemae/ds-system"));
-var import_ds_button = __toESM(require("@elliemae/ds-button"));
-var import_styled_components = __toESM(require("styled-components"));
-var import_prop_types = __toESM(require("prop-types"));
-var import_DataTableContext = __toESM(require("../DataTableContext"));
-const EmptyStateWrapper = (0, import_styled_components.default)(import_ds_grid.Grid)`
-  position: sticky;
-  height: fit-content;
-  top: 0;
-  left: 0;
-`;
-const Icon = (0, import_styled_components.default)(import_ds_icons.WarningTriangle)`
-  fill: ${(props) => props.theme.colors.neutral[300]};
-  color: ${(props) => props.theme.colors.neutral[300]};
-  justify-self: center;
-`;
-const PrimaryMessage = import_styled_components.default.p`
-  text-align: center;
-  font-weight: bold;
-  font-size: ${(props) => (0, import_ds_system.toMobile)(props.theme.fontSizes.value[400])};
-  color: ${(props) => props.theme.colors.neutral[600]};
-  margin-top: ${(props) => (0, import_ds_system.__UNSAFE_SPACE_TO_DIMSUM)(props.theme.space.s)};
-  margin-bottom: ${(props) => (0, import_ds_system.__UNSAFE_SPACE_TO_DIMSUM)(props.theme.space.xs)};
-`;
-const SecondaryMessage = import_styled_components.default.p`
-  text-align: center;
-  font-size: ${(props) => (0, import_ds_system.toMobile)(props.theme.fontSizes.value[400])}; /* 13px */
-  color: ${(props) => props.theme.colors.neutral[500]};
-  margin: 0;
-`;
-const Button = (0, import_styled_components.default)(import_ds_button.DSButton)`
-  margin-top: ${(props) => (0, import_ds_system.__UNSAFE_SPACE_TO_DIMSUM)(props.theme.space.m)};
-  justify-self: center;
-  width: fit-content;
-`;
-const CenterContentFlexWrapper = import_styled_components.default.div`
-  width: ${({ width }) => width}px;
-  height: calc(100% - 48px);
-  display: flex;
-  align-items: center;
-`;
-const EmptyContent = ({ width }) => {
+
+const EmptyContent = _ref2 => {
+  let {
+    width
+  } = _ref2;
   const {
     tableProps: {
       noResultsPlaceholder,
@@ -85,29 +55,24 @@ const EmptyContent = ({ width }) => {
       onNoResultsButtonClick,
       width: tableWidth
     }
-  } = (0, import_react.useContext)(import_DataTableContext.DataTableContext);
-  if (import_react.default.isValidElement(noResultsPlaceholder))
-    return /* @__PURE__ */ import_react.default.createElement(CenterContentFlexWrapper, {
-      width
-    }, noResultsPlaceholder);
-  return /* @__PURE__ */ import_react.default.createElement(CenterContentFlexWrapper, {
-    width,
+  } = React.useContext(DataTableContext["default"]);
+  if ( /*#__PURE__*/React__default["default"].isValidElement(noResultsPlaceholder)) return /*#__PURE__*/_jsx__default["default"](CenterContentFlexWrapper, {
+    width: width
+  }, void 0, noResultsPlaceholder);
+  return /*#__PURE__*/_jsx__default["default"](CenterContentFlexWrapper, {
+    width: width,
     "aria-live": "assertive",
     role: "status"
-  }, /* @__PURE__ */ import_react.default.createElement(EmptyStateWrapper, {
+  }, void 0, /*#__PURE__*/_jsx__default["default"](EmptyStateWrapper, {
     width: tableWidth,
     justifyContent: "center"
-  }, /* @__PURE__ */ import_react.default.createElement(Icon, {
+  }, void 0, _Icon || (_Icon = /*#__PURE__*/_jsx__default["default"](Icon, {
     size: "xxl"
-  }), /* @__PURE__ */ import_react.default.createElement(PrimaryMessage, null, noResultsMessage), noResultsSecondaryMessage ? /* @__PURE__ */ import_react.default.createElement(SecondaryMessage, null, noResultsSecondaryMessage) : null, noResultsButtonLabel && onNoResultsButtonClick ? /* @__PURE__ */ import_react.default.createElement(Button, {
+  })), /*#__PURE__*/_jsx__default["default"](PrimaryMessage, {}, void 0, noResultsMessage), noResultsSecondaryMessage ? /*#__PURE__*/_jsx__default["default"](SecondaryMessage, {}, void 0, noResultsSecondaryMessage) : null, noResultsButtonLabel && onNoResultsButtonClick ? /*#__PURE__*/_jsx__default["default"](Button, {
     buttonType: "secondary",
     labelText: noResultsButtonLabel,
     onClick: onNoResultsButtonClick
   }) : null));
 };
-EmptyContent.propTypes = {
-  width: import_prop_types.default.number
-};
-var EmptyContent_default = EmptyContent;
-module.exports = __toCommonJS(EmptyContent_exports);
-//# sourceMappingURL=EmptyContent.js.map
+
+module.exports = EmptyContent;

package/cjs/parts/FilterBar/FiltersBar.js

@@ -1,111 +1,144 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
-var FiltersBar_exports = {};
-__export(FiltersBar_exports, {
-  FiltersBar: () => FiltersBar
-});
-var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
-var import_ds_button = __toESM(require("@elliemae/ds-button"));
-var import_ds_icons = __toESM(require("@elliemae/ds-icons"));
-var import_exported_related = __toESM(require("../../exported-related"));
-var import_components = __toESM(require("./components"));
-var import_DataTableContext = __toESM(require("../../DataTableContext"));
-var import_styled = __toESM(require("./styled"));
-var import_constants = __toESM(require("../../configs/constants"));
+'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/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/web.dom-collections.iterator.js');
+var React = require('react');
+var DSButton = require('@elliemae/ds-button');
+var dsIcons = require('@elliemae/ds-icons');
+require('@babel/runtime/helpers/defineProperty');
+require('core-js/modules/esnext.async-iterator.filter.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-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('../../styled.js');
+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');
+var DataTableContext = require('../../DataTableContext.js');
+require('../Row.js');
+require('../Footer.js');
+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('core-js/modules/esnext.async-iterator.some.js');
+require('core-js/modules/esnext.iterator.some.js');
+var DateRangePill = require('./components/DateRangePill.js');
+var DateSwitcherPill = require('./components/DateSwitcherPill.js');
+var MultiSelectPill = require('./components/MultiSelectPill.js');
+var NumberRangePill = require('./components/NumberRangePill.js');
+var SelectPill = require('./components/SelectPill.js');
+var SingleDatePill = require('./components/SingleDatePill.js');
+var styled = require('./styled.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
+
+var _MoreOptionsVert;
 const pillRenderMapper = {
-  [import_exported_related.FILTER_TYPES.SELECT]: import_components.SelectPill,
-  [import_exported_related.FILTER_TYPES.MULTI_SELECT]: import_components.MultiSelectPill,
-  [import_exported_related.FILTER_TYPES.SINGLE_DATE]: import_components.SingleDatePill,
-  [import_exported_related.FILTER_TYPES.DATE_RANGE]: import_components.DateRangePill,
-  [import_exported_related.FILTER_TYPES.DATE_SWITCHER]: import_components.DateSwitcherPill,
-  [import_exported_related.FILTER_TYPES.NUMBER_RANGE]: import_components.NumberRangePill,
-  [import_exported_related.FILTER_TYPES.CURRENCY_RANGE]: import_components.NumberRangePill
+  [FilterTypes.FILTER_TYPES.SELECT]: SelectPill.SelectPill,
+  [FilterTypes.FILTER_TYPES.MULTI_SELECT]: MultiSelectPill.MultiSelectPill,
+  [FilterTypes.FILTER_TYPES.SINGLE_DATE]: SingleDatePill.SingleDatePill,
+  [FilterTypes.FILTER_TYPES.DATE_RANGE]: DateRangePill.DateRangePill,
+  [FilterTypes.FILTER_TYPES.DATE_SWITCHER]: DateSwitcherPill.DateSwitcherPill,
+  [FilterTypes.FILTER_TYPES.NUMBER_RANGE]: NumberRangePill.NumberRangePill,
+  [FilterTypes.FILTER_TYPES.CURRENCY_RANGE]: NumberRangePill.NumberRangePill
 };
 const FiltersBar = () => {
   const {
-    tableProps: { width, filterBarProps, onFiltersChange, filters },
+    tableProps: {
+      width,
+      filterBarProps,
+      onFiltersChange,
+      filters
+    },
     visibleColumns
-  } = (0, import_react.useContext)(import_DataTableContext.DataTableContext);
-  const pillGroupRefs = (0, import_react.useMemo)(() => {
+  } = React.useContext(DataTableContext["default"]);
+  const pillGroupRefs = React.useMemo(() => {
     const refs = [];
-    for (let i = 0; i < filters.length; i += 1)
-      refs.push(import_react.default.createRef());
+
+    for (let i = 0; i < filters.length; i += 1) refs.push( /*#__PURE__*/React__default["default"].createRef());
+
     return refs;
   }, [filters.length]);
-  const dropdownMenuRef = (0, import_react.useRef)(null);
-  const removeAllFilters = (0, import_react.useCallback)(() => {
+  const dropdownMenuRef = React.useRef(null);
+  const removeAllFilters = React.useCallback(() => {
     onFiltersChange([]);
   }, [onFiltersChange]);
-  return /* @__PURE__ */ import_react.default.createElement(import_styled.StyledWrapper, {
-    width,
+  return /*#__PURE__*/_jsx__default["default"](styled.StyledWrapper, {
+    width: width,
     "aria-live": "polite",
     "aria-relevant": "additions removals",
     gutter: "xs"
-  }, filters.map(({ id: column, type, value }, index) => {
-    const columnHeader = visibleColumns.find((col) => col.accessor === column)?.Header;
+  }, void 0, filters.map((_ref, index) => {
+    var _visibleColumns$find, _pillGroupRefs;
+
+    let {
+      id: column,
+      type,
+      value
+    } = _ref;
+    const columnHeader = (_visibleColumns$find = visibleColumns.find(col => col.accessor === column)) === null || _visibleColumns$find === void 0 ? void 0 : _visibleColumns$find.Header;
+
     let Component = () => null;
+
     const filterType = type;
+
     if (filterType in pillRenderMapper) {
       Component = pillRenderMapper[filterType];
-    } else if (filterBarProps?.customPillRenderer) {
+    } else if (filterBarProps !== null && filterBarProps !== void 0 && filterBarProps.customPillRenderer) {
       Component = filterBarProps.customPillRenderer;
     }
-    return /* @__PURE__ */ import_react.default.createElement(Component, {
-      key: column,
-      columnHeader: typeof columnHeader === "string" ? columnHeader : column,
-      column,
-      value,
-      filters,
-      onFiltersChange,
+
+    return /*#__PURE__*/_jsx__default["default"](Component, {
+      columnHeader: typeof columnHeader === 'string' ? columnHeader : column,
+      column: column,
+      value: value,
+      filters: filters,
+      onFiltersChange: onFiltersChange,
       prevRef: pillGroupRefs[index - 1],
       innerRef: pillGroupRefs[index],
-      nextRef: pillGroupRefs[index + 1] ?? dropdownMenuRef
-    });
-  }), /* @__PURE__ */ import_react.default.createElement(import_styled.StyledDropdownMenu, {
+      nextRef: (_pillGroupRefs = pillGroupRefs[index + 1]) !== null && _pillGroupRefs !== void 0 ? _pillGroupRefs : dropdownMenuRef
+    }, column);
+  }), /*#__PURE__*/_jsx__default["default"](styled.StyledDropdownMenu, {
     preventOverflow: "scrollParent",
-    options: [
-      {
-        id: "__internal__option__clear__filters",
-        label: "Clear Filters",
-        onClick: removeAllFilters
-      },
-      ...filterBarProps?.extraOptions || []
-    ],
-    triggerComponent: /* @__PURE__ */ import_react.default.createElement(import_ds_button.DSButton, {
+    options: [{
+      id: '__internal__option__clear__filters',
+      label: 'Clear Filters',
+      onClick: removeAllFilters
+    }, ...((filterBarProps === null || filterBarProps === void 0 ? void 0 : filterBarProps.extraOptions) || [])],
+    triggerComponent: /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
       containerProps: {
-        "data-testid": import_constants.DATA_TESTID.DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON
+        'data-testid': constants.DATA_TESTID.DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON
       },
       buttonType: "text",
       innerRef: dropdownMenuRef,
-      icon: /* @__PURE__ */ import_react.default.createElement(import_ds_icons.MoreOptionsVert, null)
+      icon: _MoreOptionsVert || (_MoreOptionsVert = /*#__PURE__*/_jsx__default["default"](dsIcons.MoreOptionsVert, {}))
     })
   }));
 };
-module.exports = __toCommonJS(FiltersBar_exports);
-//# sourceMappingURL=FiltersBar.js.map
+
+exports.FiltersBar = FiltersBar;