@bigbinary/neeto-filters-frontend 4.3.32 → 4.3.33

package/dist/cjs/v2/Filters.js

@@ -0,0 +1,1282 @@
+'use strict';
+
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var neetoAtoms = require('@bigbinary/neeto-atoms');
+var classnames = require('classnames');
+var neetoCist = require('@bigbinary/neeto-cist');
+var reactUtils = require('@bigbinary/neeto-commons-frontend/react-utils');
+var ramda = require('ramda');
+require('../../index-DX0qF4mf.js');
+var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
+var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
+var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+var react = require('react');
+var utils = require('@bigbinary/neeto-commons-frontend/utils');
+var Search = require('@bigbinary/neeto-molecules/Search');
+var reactI18next = require('react-i18next');
+var reactRouterDom = require('react-router-dom');
+var constants = require('../../constants-DoHD7obf.js');
+var v2_utils = require('../../utils-ClTYBS1C.js');
+var utils$1 = require('../../utils-CzRCzZ3I.js');
+require('../../dayjs-9rsrbiYS.js');
+var jsxRuntime = require('react/jsx-runtime');
+require('i18next');
+require('lucide-react');
+require('@bigbinary/neeto-icons/Help');
+
+var useFilters = function useFilters(_ref) {
+  var onFiltersChange = _ref.onFiltersChange,
+    columns = _ref.columns,
+    keywordFilter = _ref.keywordFilter,
+    onSelectorsChange = _ref.onSelectorsChange;
+  var _useTransition = react.useTransition(),
+    _useTransition2 = _slicedToArray(_useTransition, 2);
+    _useTransition2[0];
+    var startTransition = _useTransition2[1];
+  var initialRender = react.useRef(true);
+  var prevFilters = react.useRef([]);
+  var location = reactRouterDom.useLocation();
+  var filters = v2_utils.buildFiltersFromSearchParams(columns, false);
+  var history = reactRouterDom.useHistory();
+  var defaultValuesOfColumns = JSON.stringify(ramda.pluck("defaultValue", columns));
+  var handlePrecenseOfDefaultFilters = function handlePrecenseOfDefaultFilters(defaultFilters) {
+    var params = v2_utils.buildUrlFromFilters({
+      columns: columns,
+      filters: v2_utils.isKeywordFilterPresent(keywordFilter) && neetoCist.isNotEmpty(v2_utils.getSearchTermFromUrl()) ? [].concat(_toConsumableArray(defaultFilters), [keywordFilter]) : defaultFilters
+    });
+    history.replace({
+      search: params
+    });
+  };
+  var handleFiltersChange = function handleFiltersChange(filtersPayload) {
+    startTransition(function () {
+      onFiltersChange(v2_utils.buildFiltersPayload(filtersPayload.filter(function (filter) {
+        return !ramda.isNil(filter.node);
+      })));
+    });
+  };
+
+  //This function sends the updated filters to host via callbacks.
+  var sendUpdatedFilters = function sendUpdatedFilters() {
+    if (v2_utils.compareFilters(ramda.append(keywordFilter, filters), prevFilters.current)) {
+      return;
+    }
+    var newFilters = v2_utils.buildFiltersFromSearchParams(columns);
+    var filtersPayload = v2_utils.isKeywordFilterPresent(keywordFilter) && neetoCist.isNotEmpty(v2_utils.getSearchTermFromUrl()) ? ramda.append(keywordFilter, newFilters) : newFilters;
+    handleFiltersChange(filtersPayload);
+    onSelectorsChange(v2_utils.buildSelectorsFromURL(columns));
+  };
+  var handleChangesInURL = function handleChangesInURL() {
+    var defaultFilters = v2_utils.buildDefaultFilters(columns, filters);
+    var searchParams = v2_utils.getSnakeCasedQueryParams();
+    var keys = ramda.pluck("key", ramda.append(keywordFilter, columns));
+    if (keys.every(function (key) {
+      return ramda.isNil(searchParams[key]);
+    }) && !ramda.isEmpty(defaultFilters)) {
+      history.replace({
+        search: v2_utils.buildUrlFromFilters({
+          columns: columns,
+          filters: ramda.concat(defaultFilters, filters)
+        })
+      });
+      filters = v2_utils.buildFiltersFromSearchParams(columns, false);
+    }
+  };
+  react.useEffect(function () {
+    if (initialRender.current) {
+      initialRender.current = false;
+      var keywordValue = v2_utils.getSearchTermFromUrl();
+      var defaultFilters = v2_utils.buildDefaultFilters(columns, filters);
+      neetoCist.isNotEmpty(defaultFilters) && handlePrecenseOfDefaultFilters(defaultFilters);
+      prevFilters.current = ramda.append(ramda.mergeRight(keywordFilter, {
+        value: keywordValue
+      }), filters);
+    } else {
+      handleChangesInURL();
+      sendUpdatedFilters();
+      prevFilters.current = ramda.append(keywordFilter, filters);
+    }
+  }, [location.search, defaultValuesOfColumns]);
+  return filters;
+};
+
+var getOtherProps = function getOtherProps(props) {
+  return ramda.omit(["key", "node", "label", "type", "values", "model", "showRuleSelector"], props);
+};
+var buildDropdownOptions = function buildDropdownOptions(_ref3) {
+  var defaultType = _ref3.defaultType,
+    filter = _ref3.filter,
+    _ref3$options = _ref3.options,
+    options = _ref3$options === void 0 ? [] : _ref3$options;
+  if (ramda.isEmpty(options)) {
+    if (v2_utils.isDateRange(defaultType)) {
+      options = constants.DATE_RANGE_OPTIONS;
+    } else if (v2_utils.isTimeRange(defaultType)) {
+      options = constants.TIME_RANGE_OPTIONS;
+    }
+  }
+  options = options.map(ramda.modify("value", function (value) {
+    return value === null || value === void 0 ? void 0 : value.toString();
+  }));
+  if (!filter) return options;
+  if (v2_utils.isMulti(defaultType)) {
+    var selectedOptions = filter.value.map(function (value) {
+      return neetoCist.findBy({
+        value: value
+      }, options) || neetoCist.toLabelAndValue(value);
+    });
+    var nonSelectedOptions = options.filter(function (option) {
+      return !filter.value.includes(option.value);
+    });
+    return ramda.concat(selectedOptions, nonSelectedOptions);
+  }
+  if (!neetoCist.findBy({
+    value: filter.value
+  }, options)) {
+    return ramda.append(neetoCist.toLabelAndValue(filter.value), options);
+  }
+  return options;
+};
+var initializeDateRule = function initializeDateRule(filter) {
+  return filter ? neetoCist.findBy({
+    value: filter === null || filter === void 0 ? void 0 : filter.value
+  }, constants.DATE_OPTIONS) || findDateOption(filter, constants.DATE_OPTIONS) : {};
+};
+var getDateValue = function getDateValue(value, rule) {
+  if (ramda.isEmpty(value) || ramda.isNil(value)) {
+    return null;
+  }
+  if (rule.value === "custom-date-range") {
+    return value;
+  }
+  return rule.value === "before" ? utils.dayjs(value[1]).add(1, "day") : utils.dayjs(value[0]).subtract(1, "day");
+};
+var findDateOption = function findDateOption(filter, options) {
+  var value = filter.value;
+  var isBeforeOrAfter = utils.dayjs(value[1]).diff(utils.dayjs(value[0]), "year") >= 90;
+  if (ramda.not(isBeforeOrAfter)) {
+    return ramda.last(options);
+  }
+  var currentMoment = utils.dayjs();
+  var diffWithStart = Math.abs(currentMoment.diff(utils.dayjs(value[0]), "year"));
+  var diffWithEnd = Math.abs(currentMoment.diff(utils.dayjs(value[1]), "year"));
+  return diffWithStart < diffWithEnd ? neetoCist.findBy({
+    value: "after"
+  }, options) : neetoCist.findBy({
+    value: "before"
+  }, options);
+};
+var buildDateValues = function buildDateValues(dates, selectedRule) {
+  if (selectedRule.value === "after") {
+    return [dates.add(1, "day"), dates.add(100, "year")];
+  } else if (selectedRule.value === "before") {
+    return [dates.subtract(100, "year"), dates.subtract(1, "day")];
+  }
+  return dates;
+};
+var buildHelpIconProps = function buildHelpIconProps(helpIconProps) {
+  return ramda.mergeDeepRight(v2_utils.DEFAULT_HELP_ICON_PROPS, helpIconProps);
+};
+var hasInvalidTimes = function hasInvalidTimes(times) {
+  if (neetoCist.isNotPresent(times)) return false;
+  if (Array.isArray(times)) {
+    return times.some(function (time) {
+      return time.isValid();
+    }) === false;
+  }
+  return !times.isValid();
+};
+var areCustomTimeRangeValuesNotValid = function areCustomTimeRangeValuesNotValid(times) {
+  return !times.every(function (time) {
+    return time.isValid();
+  });
+};
+var isRuleEmpty = function isRuleEmpty(rule) {
+  return ramda.equals(rule, "is_unknown");
+};
+
+function ownKeys$9(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$9(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$9(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$9(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var Boolean = function Boolean(_ref) {
+  var _filter$value;
+  var column = _ref.column,
+    filter = _ref.filter,
+    handleApplyFilter = _ref.handleApplyFilter,
+    autoFocus = _ref.autoFocus;
+  var key = column.key,
+    _column$defaultType = column.defaultType,
+    defaultType = _column$defaultType === void 0 ? column.type : _column$defaultType,
+    label = column.label,
+    values = column.values,
+    _column$helpIconProps = column.helpIconProps,
+    helpIconProps = _column$helpIconProps === void 0 ? {} : _column$helpIconProps;
+  var options = neetoCist.isNotPresent(values) ? utils$1.isCheckbox(defaultType) ? v2_utils.CHECKBOX_OPTIONS : v2_utils.DEFAULT_BOOLEAN_OPTIONS : values;
+  var otherProps = getOtherProps(column);
+  var value = (_filter$value = filter === null || filter === void 0 ? void 0 : filter.value) !== null && _filter$value !== void 0 ? _filter$value : null;
+  var _useTranslation = reactI18next.useTranslation(),
+    t = _useTranslation.t;
+  var handleChange = function handleChange(selectedValue) {
+    if (ramda.isEmpty(selectedValue) || ramda.isNil(selectedValue)) {
+      handleApplyFilter({
+        _delete: true
+      });
+      return;
+    }
+    var option = neetoCist.findBy({
+      value: selectedValue
+    }, options);
+    var updatedFilter = utils$1.buildUpdatedFilter({
+      column: column,
+      defaultType: defaultType,
+      option: option
+    });
+    handleApplyFilter(updatedFilter);
+  };
+  return /*#__PURE__*/jsxRuntime.jsx("div", {
+    className: "neeto-filters-pane-filter__item-wrapper",
+    children: /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Select, _objectSpread$9(_objectSpread$9({
+      autoFocus: autoFocus,
+      label: label,
+      options: options,
+      value: value,
+      isClearable: true
+    }, neetoCist.isNotEmpty(helpIconProps) && {
+      labelProps: {
+        helpIconProps: buildHelpIconProps(helpIconProps)
+      }
+    }), {}, {
+      "data-testid": "neeto-filters-".concat(neetoCist.hyphenate(key), "-filter"),
+      strategy: "fixed",
+      placeholder: t("neetoFilters.messages.selectOption", {
+        resource: label
+      }),
+      onChange: handleChange
+    }, otherProps))
+  });
+};
+var Boolean$1 = /*#__PURE__*/react.memo(Boolean);
+
+function ownKeys$8(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$8(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$8(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$8(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var Datetime = function Datetime(_ref) {
+  var column = _ref.column,
+    filter = _ref.filter,
+    handleApplyFilter = _ref.handleApplyFilter,
+    autoFocus = _ref.autoFocus;
+  var _useState = react.useState(function () {
+      var _initializeDateRule$v, _initializeDateRule;
+      return (_initializeDateRule$v = (_initializeDateRule = initializeDateRule(filter)) === null || _initializeDateRule === void 0 ? void 0 : _initializeDateRule.value) !== null && _initializeDateRule$v !== void 0 ? _initializeDateRule$v : null;
+    }),
+    _useState2 = _slicedToArray(_useState, 2),
+    selectedRule = _useState2[0],
+    setSelectedRule = _useState2[1];
+  var _useTranslation = reactI18next.useTranslation(),
+    t = _useTranslation.t;
+  var key = column.key,
+    _column$defaultType = column.defaultType,
+    defaultType = _column$defaultType === void 0 ? column.type : _column$defaultType,
+    label = column.label,
+    _column$helpIconProps = column.helpIconProps,
+    helpIconProps = _column$helpIconProps === void 0 ? {} : _column$helpIconProps;
+  var isDatePickerShown = filter && utils$1.isCustomDateRange(filter.value);
+  var otherProps = getOtherProps(column);
+  var handleChange = function handleChange(selectedValue) {
+    if (ramda.isEmpty(selectedValue) || ramda.isNil(selectedValue)) {
+      handleApplyFilter({
+        _delete: true
+      });
+      setSelectedRule(null);
+      return;
+    }
+    setSelectedRule(selectedValue);
+    var option = neetoCist.findBy({
+      value: selectedValue
+    }, constants.DATE_OPTIONS);
+    var updatedFilter = utils$1.buildUpdatedFilter({
+      column: column,
+      defaultType: defaultType,
+      option: option
+    });
+    handleApplyFilter(updatedFilter);
+  };
+  var handleDateRangeChange = function handleDateRangeChange(dates) {
+    if (ramda.isEmpty(dates) || ramda.isNil(dates)) {
+      handleApplyFilter({
+        _delete: true
+      });
+      setSelectedRule(null);
+      return;
+    }
+    var updatedFilter = utils$1.buildUpdatedFilter({
+      column: column,
+      defaultType: defaultType,
+      option: {
+        value: buildDateValues(dates, {
+          value: selectedRule
+        }).map(function (date) {
+          return date.toISOString();
+        })
+      }
+    });
+    handleApplyFilter(updatedFilter);
+  };
+  react.useEffect(function () {
+    ramda.isNil(filter) && setSelectedRule(null);
+  }, [filter]);
+  return /*#__PURE__*/jsxRuntime.jsxs("div", {
+    className: "neeto-filters-pane-filter__item-wrapper",
+    children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Select, _objectSpread$8(_objectSpread$8({
+      autoFocus: autoFocus,
+      label: label,
+      isClearable: true,
+      "data-testid": "neeto-filters-".concat(neetoCist.hyphenate(key), "-filter"),
+      options: constants.DATE_OPTIONS,
+      strategy: "fixed",
+      value: selectedRule,
+      placeholder: t("neetoFilters.messages.selectResource", {
+        resource: label
+      })
+    }, neetoCist.isNotEmpty(helpIconProps) && {
+      labelProps: {
+        helpIconProps: buildHelpIconProps(helpIconProps)
+      }
+    }), {}, {
+      onChange: handleChange
+    })), isDatePickerShown && /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.DatePicker, _objectSpread$8({
+      "data-testid": "neeto-filters-".concat(neetoCist.hyphenate(key), "-date-range"),
+      getPopupContainer: ramda.prop("parentNode"),
+      type: selectedRule === "custom-date-range" ? "range" : "date",
+      value: getDateValue(filter === null || filter === void 0 ? void 0 : filter.value, {
+        value: selectedRule
+      }),
+      onChange: handleDateRangeChange
+    }, otherProps))]
+  });
+};
+var Datetime$1 = /*#__PURE__*/react.memo(Datetime);
+
+function ownKeys$7(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$7(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$7(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$7(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var Dropdown = function Dropdown(_ref) {
+  var _filter$value, _filter$value2;
+  var column = _ref.column,
+    filter = _ref.filter,
+    handleApplyFilter = _ref.handleApplyFilter,
+    autoFocus = _ref.autoFocus,
+    filters = _ref.filters;
+  var key = column.key,
+    label = column.label,
+    values = column.values,
+    defaultValue = column.defaultValue,
+    _column$defaultType = column.defaultType,
+    defaultType = _column$defaultType === void 0 ? column.type : _column$defaultType,
+    _column$showRuleSelec = column.showRuleSelector,
+    showRuleSelector = _column$showRuleSelec === void 0 ? false : _column$showRuleSelec,
+    _column$isClearable = column.isClearable,
+    isClearable = _column$isClearable === void 0 ? true : _column$isClearable,
+    _column$helpIconProps = column.helpIconProps,
+    helpIconProps = _column$helpIconProps === void 0 ? {} : _column$helpIconProps;
+  var otherProps = getOtherProps(column);
+  var options = buildDropdownOptions({
+    defaultType: defaultType,
+    filter: filter,
+    options: values
+  });
+  var dropdownRules = v2_utils.isMulti(defaultType) ? v2_utils.MULTI_DROPDOWN_RULES : v2_utils.SINGLE_DROPDOWN_RULES;
+  var value = v2_utils.isMulti(defaultType) ? (_filter$value = filter === null || filter === void 0 ? void 0 : filter.value) !== null && _filter$value !== void 0 ? _filter$value : [] : (_filter$value2 = filter === null || filter === void 0 ? void 0 : filter.value) !== null && _filter$value2 !== void 0 ? _filter$value2 : null;
+  var _useState = react.useState(function () {
+      return (neetoCist.findBy({
+        value: filter === null || filter === void 0 ? void 0 : filter.rule
+      }, dropdownRules) || dropdownRules[0]).value;
+    }),
+    _useState2 = _slicedToArray(_useState, 2),
+    selectedRule = _useState2[0],
+    setSelectedRule = _useState2[1];
+  var _useTranslation = reactI18next.useTranslation(),
+    t = _useTranslation.t;
+  var getOption = function getOption(isSelectedRuleEmpty, options, value) {
+    if (isSelectedRuleEmpty) {
+      return v2_utils.isMulti(defaultType) ? [options[0]] : options[0];
+    }
+    if (v2_utils.isMulti(defaultType)) {
+      return options.filter(function (o) {
+        return value === null || value === void 0 ? void 0 : value.includes(o.value);
+      });
+    }
+    return neetoCist.findBy({
+      value: value
+    }, options);
+  };
+  var handleRuleChange = function handleRuleChange(ruleValue) {
+    var isPreviousRuleEmpty = isRuleEmpty(selectedRule);
+    var isNewRuleEmpty = isRuleEmpty(ruleValue);
+    setSelectedRule(ruleValue);
+    if (isPreviousRuleEmpty || !isNewRuleEmpty && neetoCist.isNotPresent(filter === null || filter === void 0 ? void 0 : filter.value)) {
+      handleApplyFilter({
+        _delete: true
+      });
+      return;
+    }
+    var updatedFilter = v2_utils.buildUpdatedFilter({
+      column: column,
+      defaultType: defaultType,
+      rule: ruleValue,
+      option: getOption(isNewRuleEmpty, options, value)
+    });
+    handleApplyFilter(updatedFilter);
+  };
+  var handleChange = function handleChange(selectedValue) {
+    if (ramda.isEmpty(selectedValue) || ramda.isNil(selectedValue)) {
+      handleApplyFilter({
+        _delete: true
+      });
+      return;
+    }
+    var option = v2_utils.isMulti(defaultType) ? options.filter(function (o) {
+      return selectedValue.includes(o.value);
+    }) : neetoCist.findBy({
+      value: selectedValue
+    }, options);
+    var updatedFilter = v2_utils.buildUpdatedFilter({
+      column: column,
+      defaultType: defaultType,
+      option: option,
+      rule: selectedRule
+    });
+    handleApplyFilter(updatedFilter);
+  };
+  react.useEffect(function () {
+    if (!ramda.isEmpty(filters)) return;
+    isRuleEmpty(selectedRule) && setSelectedRule(dropdownRules[0].value);
+  }, [filters]);
+  return /*#__PURE__*/jsxRuntime.jsxs("div", {
+    className: "neeto-filters-pane-filter__item-wrapper",
+    children: [showRuleSelector && /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Select, {
+      label: label,
+      defaultValue: dropdownRules[0].value,
+      options: dropdownRules,
+      value: selectedRule,
+      onChange: handleRuleChange
+    }), !isRuleEmpty(selectedRule) && /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Select, _objectSpread$7(_objectSpread$7({
+      autoFocus: autoFocus,
+      options: options,
+      value: value,
+      "data-testid": "neeto-filters-".concat(neetoCist.hyphenate(key), "-filter"),
+      isClearable: !defaultValue && isClearable,
+      isMulti: v2_utils.isMulti(defaultType),
+      label: !showRuleSelector && label,
+      strategy: "fixed",
+      placeholder: t("neetoFilters.messages.selectResource", {
+        resource: label
+      })
+    }, neetoCist.isNotEmpty(helpIconProps) && {
+      labelProps: {
+        helpIconProps: buildHelpIconProps(helpIconProps)
+      }
+    }), {}, {
+      onChange: handleChange
+    }, otherProps))]
+  });
+};
+var Dropdown$1 = /*#__PURE__*/react.memo(Dropdown);
+
+function ownKeys$6(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$6(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$6(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$6(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var SingleDatetime = function SingleDatetime(_ref) {
+  var column = _ref.column,
+    filter = _ref.filter,
+    filters = _ref.filters,
+    handleApplyFilter = _ref.handleApplyFilter,
+    autoFocus = _ref.autoFocus;
+  var _useState = react.useState(function () {
+      return (neetoCist.findBy({
+        value: filter === null || filter === void 0 ? void 0 : filter.rule
+      }, constants.SINGLE_DATE_OPTIONS) || constants.SINGLE_DATE_OPTIONS[0]).value;
+    }),
+    _useState2 = _slicedToArray(_useState, 2),
+    selectedRule = _useState2[0],
+    setSelectedRule = _useState2[1];
+  var key = column.key,
+    _column$defaultType = column.defaultType,
+    defaultType = _column$defaultType === void 0 ? column.type : _column$defaultType,
+    label = column.label,
+    _column$helpIconProps = column.helpIconProps,
+    helpIconProps = _column$helpIconProps === void 0 ? {} : _column$helpIconProps;
+  var otherProps = getOtherProps(column);
+  var datePickerType = selectedRule === "between" ? "range" : "date";
+  var value = filter === null || filter === void 0 ? void 0 : filter.value;
+
+  // Reset states when "Clear filters" button is clicked.
+  react.useEffect(function () {
+    if (!ramda.isEmpty(filters)) return;
+    setSelectedRule(constants.SINGLE_DATE_OPTIONS[0].value);
+  }, [filters]);
+  var handleRuleChange = function handleRuleChange(ruleValue) {
+    setSelectedRule(ruleValue);
+
+    // Clear value if switched between incompatible types
+    var updateValue = value;
+    if (datePickerType === "range" && ruleValue !== "between" || datePickerType === "date" && ruleValue === "between") {
+      updateValue = "";
+    }
+    var updatedFilter = utils$1.buildUpdatedFilter({
+      column: column,
+      defaultType: defaultType,
+      option: {},
+      rule: ruleValue,
+      value: updateValue
+    });
+    handleApplyFilter(updatedFilter);
+  };
+  var handleChange = function handleChange(dates) {
+    if (ramda.isEmpty(dates) || ramda.isNil(dates)) {
+      handleApplyFilter({
+        _delete: true
+      });
+      return;
+    }
+    var value = datePickerType === "range" ? dates.map(function (date) {
+      return date.toISOString();
+    }) : dates;
+    var updatedFilter = utils$1.buildUpdatedFilter({
+      column: column,
+      defaultType: defaultType,
+      option: {},
+      rule: selectedRule,
+      value: value
+    });
+    handleApplyFilter(updatedFilter);
+  };
+  return /*#__PURE__*/jsxRuntime.jsxs("div", {
+    className: "neeto-filters-pane-filter__item-wrapper",
+    children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Select, _objectSpread$6(_objectSpread$6({
+      label: label,
+      "data-testid": "neeto-filters-".concat(neetoCist.hyphenate(key), "-filter-rule"),
+      defaultValue: constants.SINGLE_DATE_OPTIONS[0].value,
+      options: constants.SINGLE_DATE_OPTIONS,
+      strategy: "fixed",
+      value: selectedRule
+    }, neetoCist.isNotEmpty(helpIconProps) && {
+      labelProps: {
+        helpIconProps: buildHelpIconProps(helpIconProps)
+      }
+    }), {}, {
+      onChange: handleRuleChange
+    })), /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.DatePicker, _objectSpread$6({
+      autoFocus: autoFocus,
+      value: value,
+      "data-testid": "neeto-filters-".concat(neetoCist.hyphenate(key), "-filter"),
+      getPopupContainer: ramda.prop("parentNode"),
+      type: datePickerType,
+      onChange: handleChange
+    }, otherProps))]
+  });
+};
+
+function ownKeys$5(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$5(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$5(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$5(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var SingleTime = function SingleTime(_ref) {
+  var column = _ref.column,
+    filter = _ref.filter,
+    filters = _ref.filters,
+    handleApplyFilter = _ref.handleApplyFilter,
+    autoFocus = _ref.autoFocus;
+  var _useState = react.useState(function () {
+      return (neetoCist.findBy({
+        value: filter === null || filter === void 0 ? void 0 : filter.rule
+      }, constants.SINGLE_TIME_OPTIONS) || constants.SINGLE_TIME_OPTIONS[0]).value;
+    }),
+    _useState2 = _slicedToArray(_useState, 2),
+    selectedRule = _useState2[0],
+    setSelectedRule = _useState2[1];
+  var key = column.key,
+    _column$defaultType = column.defaultType,
+    defaultType = _column$defaultType === void 0 ? column.type : _column$defaultType,
+    label = column.label,
+    _column$helpIconProps = column.helpIconProps,
+    helpIconProps = _column$helpIconProps === void 0 ? {} : _column$helpIconProps;
+  var otherProps = getOtherProps(column);
+  var timePickerType = selectedRule === "between" ? "range" : "time";
+  var value = filter === null || filter === void 0 ? void 0 : filter.value;
+  react.useEffect(function () {
+    if (!ramda.isEmpty(filters)) return;
+    setSelectedRule(constants.SINGLE_TIME_OPTIONS[0].value);
+  }, [filters]);
+  var handleRuleChange = function handleRuleChange(ruleValue) {
+    setSelectedRule(ruleValue);
+
+    // Clear value if switched between incompatible types
+    var updateValue = value;
+    if (timePickerType === "range" && ruleValue !== "between" || timePickerType === "time" && ruleValue === "between") {
+      updateValue = "";
+    }
+    var updatedFilter = utils$1.buildUpdatedFilter({
+      column: column,
+      defaultType: defaultType,
+      option: {},
+      rule: ruleValue,
+      value: updateValue
+    });
+    handleApplyFilter(updatedFilter);
+  };
+  var handleChange = function handleChange(times) {
+    if (hasInvalidTimes(times)) {
+      handleApplyFilter({
+        _delete: true
+      });
+      return;
+    }
+    if (timePickerType === "range" && areCustomTimeRangeValuesNotValid(times)) {
+      return;
+    }
+    var value = timePickerType === "range" ? times === null || times === void 0 ? void 0 : times.map(function (time) {
+      return time.toISOString();
+    }) : times === null || times === void 0 ? void 0 : times.toISOString();
+    var updatedFilter = utils$1.buildUpdatedFilter({
+      column: column,
+      defaultType: defaultType,
+      option: {},
+      rule: selectedRule,
+      value: value
+    });
+    handleApplyFilter(updatedFilter);
+  };
+  return /*#__PURE__*/jsxRuntime.jsxs("div", {
+    className: "neeto-filters-pane-filter__item-wrapper",
+    children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Select, _objectSpread$5(_objectSpread$5({
+      label: label,
+      defaultValue: constants.SINGLE_TIME_OPTIONS[0].value,
+      options: constants.SINGLE_TIME_OPTIONS,
+      strategy: "fixed",
+      value: selectedRule
+    }, neetoCist.isNotEmpty(helpIconProps) && {
+      labelProps: {
+        helpIconProps: buildHelpIconProps(helpIconProps)
+      }
+    }), {}, {
+      onChange: handleRuleChange
+    })), /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.TimePicker, _objectSpread$5({
+      autoFocus: autoFocus,
+      value: value,
+      className: "w-full",
+      "data-testid": "neeto-filters-".concat(neetoCist.hyphenate(key), "-filter"),
+      format: v2_utils.TIME_FORMAT,
+      type: timePickerType,
+      onChange: handleChange
+    }, otherProps))]
+  });
+};
+
+function ownKeys$4(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$4(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$4(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$4(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var Text = function Text(_ref) {
+  var column = _ref.column,
+    filter = _ref.filter,
+    filters = _ref.filters,
+    handleApplyFilter = _ref.handleApplyFilter,
+    autoFocus = _ref.autoFocus,
+    onClose = _ref.onClose;
+  var key = column.key,
+    _column$defaultType = column.defaultType,
+    defaultType = _column$defaultType === void 0 ? column.type : _column$defaultType,
+    label = column.label,
+    _column$showRuleSelec = column.showRuleSelector,
+    showRuleSelector = _column$showRuleSelec === void 0 ? false : _column$showRuleSelec,
+    _column$helpIconProps = column.helpIconProps,
+    helpIconProps = _column$helpIconProps === void 0 ? {} : _column$helpIconProps;
+  var otherProps = getOtherProps(column);
+  var ruleOptions = utils$1.buildRuleOptions({
+    defaultType: defaultType
+  });
+  var inputType = defaultType === "text" || defaultType === "custom.text" ? "text" : "number";
+  var _useState = react.useState(filter === null || filter === void 0 ? void 0 : filter.value),
+    _useState2 = _slicedToArray(_useState, 2),
+    inputValue = _useState2[0],
+    setInputValue = _useState2[1];
+  var _useState3 = react.useState(function () {
+      return (neetoCist.findBy({
+        value: filter === null || filter === void 0 ? void 0 : filter.rule
+      }, ruleOptions) || ruleOptions[0]).value;
+    }),
+    _useState4 = _slicedToArray(_useState3, 2),
+    selectedRule = _useState4[0],
+    setSelectedRule = _useState4[1];
+  var debouncedInputValue = reactUtils.useDebounce(inputValue);
+  var _useTranslation = reactI18next.useTranslation(),
+    t = _useTranslation.t;
+  var handleUpdateAndApplyFilter = function handleUpdateAndApplyFilter() {
+    var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : debouncedInputValue;
+    var ruleValue = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : selectedRule;
+    if (ramda.equals(filter === null || filter === void 0 ? void 0 : filter.value, value) && ramda.equals(selectedRule, ruleValue)) return;
+    var updatedFilter = utils$1.buildUpdatedFilter({
+      column: column,
+      defaultType: defaultType,
+      option: {},
+      rule: ruleValue,
+      value: value.trim()
+    });
+    handleApplyFilter(updatedFilter);
+  };
+  var handleKeydown = function handleKeydown(e) {
+    if (!(e.key === "Enter")) return;
+    handleUpdateAndApplyFilter(inputValue);
+    onClose();
+  };
+  var handleRuleChange = function handleRuleChange(ruleValue) {
+    setSelectedRule(ruleValue);
+    if (!debouncedInputValue) return;
+    handleUpdateAndApplyFilter(debouncedInputValue, ruleValue);
+  };
+
+  // Reset states when "Clear filters" button is clicked.
+  react.useEffect(function () {
+    (ramda.isEmpty(filters) || ramda.isNil(filter)) && setInputValue("");
+  }, [filter]);
+  react.useEffect(function () {
+    if (!debouncedInputValue) {
+      !utils$1.isUndefinedOrEmpty(filter) && handleApplyFilter({
+        _delete: true
+      });
+      return;
+    }
+    handleUpdateAndApplyFilter();
+  }, [debouncedInputValue]);
+  return /*#__PURE__*/jsxRuntime.jsxs("div", {
+    className: "neeto-filters-pane-filter__item-wrapper",
+    children: [showRuleSelector && /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Select, _objectSpread$4({
+      label: label,
+      "data-testid": "neeto-filters-".concat(neetoCist.hyphenate(key), "-filter-rule"),
+      defaultValue: ruleOptions[0].value,
+      options: ruleOptions,
+      strategy: "fixed",
+      value: selectedRule,
+      onChange: handleRuleChange
+    }, neetoCist.isNotEmpty(helpIconProps) && {
+      labelProps: {
+        helpIconProps: buildHelpIconProps(helpIconProps)
+      }
+    })), /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Input, _objectSpread$4(_objectSpread$4({
+      autoFocus: autoFocus,
+      "data-testid": "neeto-filters-".concat(neetoCist.hyphenate(key), "-filter"),
+      label: !showRuleSelector && label,
+      type: inputType,
+      value: inputValue
+    }, neetoCist.isNotEmpty(helpIconProps) && {
+      labelProps: {
+        helpIconProps: buildHelpIconProps(helpIconProps)
+      }
+    }), {}, {
+      placeholder: t("neetoFilters.messages.enterResource", {
+        resource: label
+      }),
+      onChange: function onChange(event) {
+        return setInputValue(event.target.value);
+      },
+      onKeyDown: handleKeydown
+    }, otherProps))]
+  });
+};
+
+function ownKeys$3(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$3(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$3(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$3(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var Time = function Time(_ref) {
+  var _filter$value;
+  var column = _ref.column,
+    filter = _ref.filter,
+    handleApplyFilter = _ref.handleApplyFilter,
+    autoFocus = _ref.autoFocus;
+  var key = column.key,
+    _column$defaultType = column.defaultType,
+    defaultType = _column$defaultType === void 0 ? column.type : _column$defaultType,
+    label = column.label,
+    _column$helpIconProps = column.helpIconProps,
+    helpIconProps = _column$helpIconProps === void 0 ? {} : _column$helpIconProps;
+  var otherProps = getOtherProps(column);
+  var value = (_filter$value = filter === null || filter === void 0 ? void 0 : filter.value) !== null && _filter$value !== void 0 ? _filter$value : null;
+  var isCustomTimeRangeShown = filter && utils$1.isCustomTimeRange(filter.value);
+  var _useTranslation = reactI18next.useTranslation(),
+    t = _useTranslation.t;
+  var handleChange = function handleChange(selectedValue) {
+    if (ramda.isEmpty(selectedValue) || ramda.isNil(selectedValue)) {
+      handleApplyFilter({
+        _delete: true
+      });
+      return;
+    }
+    var option = neetoCist.findBy({
+      value: selectedValue
+    }, constants.TIME_OPTIONS);
+    var updatedFilter = utils$1.buildUpdatedFilter({
+      column: column,
+      defaultType: defaultType,
+      option: option
+    });
+    handleApplyFilter(updatedFilter);
+  };
+  var handleTimeRangeChange = function handleTimeRangeChange(times) {
+    if (hasInvalidTimes(times)) {
+      handleApplyFilter({
+        _delete: true
+      });
+      return;
+    }
+    if (isCustomTimeRangeShown && areCustomTimeRangeValuesNotValid(times)) {
+      return;
+    }
+    var updatedFilter = utils$1.buildUpdatedFilter({
+      column: column,
+      defaultType: defaultType,
+      option: {
+        value: times.map(function (time) {
+          return time.toISOString();
+        })
+      }
+    });
+    handleApplyFilter(updatedFilter);
+  };
+  return /*#__PURE__*/jsxRuntime.jsxs("div", {
+    className: "neeto-filters-pane-filter__item-wrapper",
+    children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Select, _objectSpread$3(_objectSpread$3({
+      autoFocus: autoFocus,
+      label: label,
+      value: value,
+      isClearable: true,
+      "data-testid": "neeto-filters-".concat(neetoCist.hyphenate(key), "-filter"),
+      options: constants.TIME_OPTIONS,
+      strategy: "fixed",
+      placeholder: t("neetoFilters.messages.selectResource", {
+        resource: label
+      })
+    }, neetoCist.isNotEmpty(helpIconProps) && {
+      labelProps: {
+        helpIconProps: buildHelpIconProps(helpIconProps)
+      }
+    }), {}, {
+      onChange: handleChange
+    })), isCustomTimeRangeShown && /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.TimePicker, _objectSpread$3({
+      className: "w-full",
+      "data-testid": "neeto-filters-".concat(neetoCist.hyphenate(key), "-date-range"),
+      format: v2_utils.TIME_FORMAT,
+      type: "range",
+      value: filter.value,
+      onChange: handleTimeRangeChange
+    }, otherProps))]
+  });
+};
+var Time$1 = /*#__PURE__*/react.memo(Time);
+
+function ownKeys$2(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$2(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$2(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var TreeSelect = function TreeSelect(_ref) {
+  var _findBy, _filter$value;
+  var autoFocus = _ref.autoFocus,
+    column = _ref.column,
+    filter = _ref.filter,
+    handleApplyFilter = _ref.handleApplyFilter;
+  var key = column.key,
+    label = column.label,
+    _column$defaultType = column.defaultType,
+    defaultType = _column$defaultType === void 0 ? column.type : _column$defaultType,
+    defaultValue = column.defaultValue,
+    _column$helpIconProps = column.helpIconProps,
+    helpIconProps = _column$helpIconProps === void 0 ? {} : _column$helpIconProps,
+    _column$isClearable = column.isClearable,
+    isClearable = _column$isClearable === void 0 ? true : _column$isClearable,
+    _column$showRuleSelec = column.showRuleSelector,
+    showRuleSelector = _column$showRuleSelec === void 0 ? false : _column$showRuleSelec,
+    options = column.values;
+  var initialRule = ((_findBy = neetoCist.findBy({
+    value: filter === null || filter === void 0 ? void 0 : filter.rule
+  }, v2_utils.TREE_SELECT_RULES)) !== null && _findBy !== void 0 ? _findBy : v2_utils.TREE_SELECT_RULES[0]).value;
+  var _useState = react.useState(initialRule),
+    _useState2 = _slicedToArray(_useState, 2),
+    selectedRule = _useState2[0],
+    setSelectedRule = _useState2[1];
+  var _useTranslation = reactI18next.useTranslation(),
+    t = _useTranslation.t;
+  var selectedOption = (_filter$value = filter === null || filter === void 0 ? void 0 : filter.value) !== null && _filter$value !== void 0 ? _filter$value : [];
+  var handleChange = function handleChange(option) {
+    if (neetoCist.isNotPresent(option)) return handleApplyFilter({
+      _delete: true
+    });
+    var updatedFilter = utils$1.buildUpdatedFilter({
+      column: column,
+      defaultType: defaultType,
+      option: option,
+      rule: selectedRule
+    });
+    return handleApplyFilter(updatedFilter);
+  };
+  var handleRuleChange = function handleRuleChange(ruleValue) {
+    var isPreviousRuleEmpty = isRuleEmpty(selectedRule);
+    var isNewRuleEmpty = isRuleEmpty(ruleValue);
+    setSelectedRule(ruleValue);
+    if (isPreviousRuleEmpty || !isNewRuleEmpty && neetoCist.isNotPresent(filter === null || filter === void 0 ? void 0 : filter.value)) {
+      return handleApplyFilter({
+        _delete: true
+      });
+    }
+    var updatedFilter = utils$1.buildUpdatedFilter({
+      column: column,
+      defaultType: defaultType,
+      option: isNewRuleEmpty ? [options[0]] : selectedOption,
+      rule: ruleValue
+    });
+    return handleApplyFilter(updatedFilter);
+  };
+  return /*#__PURE__*/jsxRuntime.jsxs("div", {
+    className: "neeto-filters-pane-filter__item-wrapper",
+    children: [showRuleSelector && /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Select, {
+      label: label,
+      defaultValue: v2_utils.TREE_SELECT_RULES[0].value,
+      options: v2_utils.TREE_SELECT_RULES,
+      value: selectedRule,
+      onChange: handleRuleChange
+    }), !isRuleEmpty(selectedRule) &&
+    /*#__PURE__*/
+    // eslint-disable-next-line @bigbinary/neeto/merge-spread-attributes
+    jsxRuntime.jsx(neetoAtoms.TreeSelect, _objectSpread$2(_objectSpread$2({
+      autoFocus: autoFocus,
+      multiple: true,
+      showSearch: true,
+      treeDataSimpleMode: true,
+      allowClear: !defaultValue && isClearable,
+      "data-testid": "neeto-filters-".concat(neetoCist.hyphenate(key), "-filter"),
+      label: !showRuleSelector && label,
+      treeData: options,
+      value: selectedOption,
+      placeholder: t("neetoFilters.messages.selectResource", {
+        resource: label
+      }),
+      onChange: handleChange
+    }, neetoCist.isNotEmpty(helpIconProps) && {
+      labelProps: {
+        helpIconProps: buildHelpIconProps(helpIconProps)
+      }
+    }), getOtherProps(column)))]
+  });
+};
+var TreeSelect$1 = /*#__PURE__*/react.memo(TreeSelect);
+
+var Item = function Item(_ref) {
+  var column = _ref.column,
+    filters = _ref.filters,
+    onChange = _ref.onChange,
+    autoFocus = _ref.autoFocus,
+    _ref$onClose = _ref.onClose,
+    onClose = _ref$onClose === void 0 ? neetoCist.noop : _ref$onClose;
+  var key = column.key,
+    _column$defaultType = column.defaultType,
+    defaultType = _column$defaultType === void 0 ? column.type : _column$defaultType;
+  var filter = react.useMemo(function () {
+    return neetoCist.findBy({
+      key: key
+    }, filters);
+  }, [filters, key]);
+  var handleApplyFilter = function handleApplyFilter(updatedFilter) {
+    if (updatedFilter._delete) onChange(neetoCist.removeBy({
+      key: key
+    }, filters));else if (!filter) onChange(ramda.append(updatedFilter, filters));else onChange(neetoCist.replaceBy({
+      key: key
+    }, updatedFilter, filters));
+  };
+  if (v2_utils.isText(defaultType) || v2_utils.isDigit(defaultType)) {
+    return /*#__PURE__*/jsxRuntime.jsx(Text, {
+      autoFocus: autoFocus,
+      column: column,
+      filter: filter,
+      filters: filters,
+      handleApplyFilter: handleApplyFilter,
+      onClose: onClose
+    });
+  }
+  if (v2_utils.isDate(defaultType)) {
+    return /*#__PURE__*/jsxRuntime.jsx(Datetime$1, {
+      autoFocus: autoFocus,
+      column: column,
+      filter: filter,
+      handleApplyFilter: handleApplyFilter
+    });
+  }
+  if (v2_utils.isTime(defaultType)) {
+    return /*#__PURE__*/jsxRuntime.jsx(Time$1, {
+      autoFocus: autoFocus,
+      column: column,
+      filter: filter,
+      handleApplyFilter: handleApplyFilter
+    });
+  }
+  if (v2_utils.isSingleDate(defaultType)) {
+    return /*#__PURE__*/jsxRuntime.jsx(SingleDatetime, {
+      autoFocus: autoFocus,
+      column: column,
+      filter: filter,
+      filters: filters,
+      handleApplyFilter: handleApplyFilter
+    });
+  }
+  if (v2_utils.isSingleTime(defaultType)) {
+    return /*#__PURE__*/jsxRuntime.jsx(SingleTime, {
+      autoFocus: autoFocus,
+      column: column,
+      filter: filter,
+      filters: filters,
+      handleApplyFilter: handleApplyFilter
+    });
+  }
+  if (v2_utils.isBoolean(defaultType) || v2_utils.isCheckbox(defaultType)) {
+    return /*#__PURE__*/jsxRuntime.jsx(Boolean$1, {
+      autoFocus: autoFocus,
+      column: column,
+      defaultType: defaultType,
+      filter: filter,
+      handleApplyFilter: handleApplyFilter
+    });
+  }
+  if (v2_utils.isTreeSelect(defaultType)) {
+    return /*#__PURE__*/jsxRuntime.jsx(TreeSelect$1, {
+      autoFocus: autoFocus,
+      column: column,
+      filter: filter,
+      handleApplyFilter: handleApplyFilter
+    });
+  }
+  return /*#__PURE__*/jsxRuntime.jsx(Dropdown$1, {
+    autoFocus: autoFocus,
+    column: column,
+    filter: filter,
+    filters: filters,
+    handleApplyFilter: handleApplyFilter
+  });
+};
+
+var _excluded = ["isOpen", "onClose", "columns", "onChange", "isSearchable", "keyword", "onSelectorsChange", "childrenKeys", "children", "className"];
+function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var Pane = function Pane(_ref) {
+  var isOpen = _ref.isOpen,
+    onClose = _ref.onClose,
+    columns = _ref.columns,
+    onChange = _ref.onChange,
+    isSearchable = _ref.isSearchable,
+    keyword = _ref.keyword,
+    onSelectorsChange = _ref.onSelectorsChange,
+    _ref$childrenKeys = _ref.childrenKeys,
+    childrenKeys = _ref$childrenKeys === void 0 ? [] : _ref$childrenKeys,
+    children = _ref.children,
+    className = _ref.className,
+    otherProps = _objectWithoutProperties(_ref, _excluded);
+  var searchParams = reactUtils.useQueryParams({
+    toCamelCase: false
+  });
+  var _useState = react.useState(""),
+    _useState2 = _slicedToArray(_useState, 2),
+    searchTerm = _useState2[0],
+    setSearchTerm = _useState2[1];
+  var history = reactRouterDom.useHistory();
+  var _useTranslation = reactI18next.useTranslation(),
+    t = _useTranslation.t;
+  columns = react.useMemo(function () {
+    return v2_utils.getColumnsWithStandardizedType(columns);
+  }, [columns]);
+  var _buildFilteredColumns = v2_utils.buildFilteredColumns({
+      searchTerm: searchTerm,
+      columns: columns
+    }),
+    _buildFilteredColumns2 = _buildFilteredColumns.groupedColumns,
+    groupedColumns = _buildFilteredColumns2 === void 0 ? [] : _buildFilteredColumns2,
+    _buildFilteredColumns3 = _buildFilteredColumns.ungroupedColumns,
+    ungroupedColumns = _buildFilteredColumns3 === void 0 ? [] : _buildFilteredColumns3;
+  var keywordFilter = _objectSpread$1(_objectSpread$1({
+    type: "text",
+    rule: "contains",
+    label: t("neetoFilters.common.searchTerm")
+  }, keyword), {}, {
+    key: constants.SEARCH_TERM_KEY,
+    value: searchParams[constants.SEARCH_TERM_KEY] || ""
+  });
+  var filters = useFilters({
+    onFiltersChange: onChange,
+    columns: columns,
+    keywordFilter: keywordFilter,
+    onSelectorsChange: onSelectorsChange
+  });
+  var handleChange = function handleChange(newFilters) {
+    var isClearAll = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+    var params = v2_utils.buildUrlFromFilters(_objectSpread$1({
+      columns: columns,
+      filters: v2_utils.isKeywordFilterPresent(keywordFilter) && neetoCist.isNotEmpty(v2_utils.getSearchTermFromUrl()) ? [].concat(_toConsumableArray(newFilters), [keywordFilter]) : newFilters
+    }, isClearAll && {
+      isClearAll: true,
+      childrenKeys: childrenKeys
+    }));
+    history.push({
+      search: params
+    });
+  };
+  var handleClearAll = function handleClearAll() {
+    var params = v2_utils.isKeywordFilterPresent(keywordFilter) ? ramda.omit([constants.SEARCH_TERM_KEY], v2_utils.getSnakeCasedQueryParams()) : v2_utils.getSnakeCasedQueryParams();
+    var pathname = window.location.pathname;
+    history.push(utils.buildUrl(pathname, params));
+    handleChange([], true);
+  };
+  var handleClearTermAndClose = function handleClearTermAndClose() {
+    setSearchTerm("");
+    onClose();
+  };
+  var handleClose = function handleClose() {
+    columns.forEach(function (_ref2) {
+      var key = _ref2.key;
+      var filter = neetoCist.findBy({
+        key: key
+      }, filters);
+      if ((filter === null || filter === void 0 ? void 0 : filter.value) === "") delete searchParams[key];
+    });
+    handleClearTermAndClose();
+  };
+  var isClearFiltersDisabled = !filters.some(function (_ref3) {
+    var value = _ref3.value,
+      defaultValue = _ref3.defaultValue;
+    return neetoCist.isPresent(value) && value !== defaultValue;
+  }) && !childrenKeys.some(function (key) {
+    return searchParams[key];
+  });
+  return /*#__PURE__*/jsxRuntime.jsxs(neetoAtoms.Sheet, _objectSpread$1(_objectSpread$1({
+    isOpen: isOpen,
+    backdropClassName: "neeto-filters-pane-backdrop",
+    className: classnames("neeto-filters-pane-filter", _defineProperty({}, className, className)),
+    onClose: handleClose
+  }, otherProps), {}, {
+    children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet.Header, {
+      "data-testid": "neeto-filters-pane-header",
+      children: /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet.Title, {
+        weight: "semibold",
+        children: t("neetoFilters.common.filters")
+      })
+    }), /*#__PURE__*/jsxRuntime.jsxs(neetoAtoms.Sheet.Body, {
+      className: "neeto-filters-pane-filter__body pb-6",
+      children: [isSearchable && /*#__PURE__*/jsxRuntime.jsx(Search, {
+        "data-testid": "neeto-filters-column-search",
+        placeholder: t("neetoFilters.messages.searchResources", {
+          resources: t("neetoFilters.common.filters")
+        }),
+        onSearch: function onSearch(value) {
+          return setSearchTerm(value);
+        }
+      }), ungroupedColumns.map(function (column) {
+        return /*#__PURE__*/react.createElement(Item, {
+          column: column,
+          filters: filters,
+          autoFocus: column.key === isOpen,
+          key: column.key,
+          onChange: handleChange,
+          onClose: handleClearTermAndClose
+        });
+      }), neetoCist.isPresent(groupedColumns) && /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Accordion, {
+        collapsible: true,
+        type: "single",
+        defaultValue: "item-".concat(groupedColumns.findIndex(function (_ref4) {
+          var columns = _ref4.columns;
+          return neetoCist.existsBy({
+            key: isOpen
+          }, columns);
+        })),
+        children: groupedColumns.map(function (_ref5) {
+          var group = _ref5.group,
+            columns = _ref5.columns;
+          return /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Accordion.Item, {
+            className: "accordion_item",
+            title: group,
+            children: columns.map(function (column) {
+              return /*#__PURE__*/react.createElement(Item, {
+                column: column,
+                filters: filters,
+                autoFocus: column.key === isOpen,
+                key: column.key,
+                onChange: handleChange,
+                onClose: handleClearTermAndClose
+              });
+            })
+          }, group);
+        })
+      }), ramda.isEmpty(ungroupedColumns) && ramda.isEmpty(groupedColumns) && /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Typography, {
+        variant: "body2",
+        children: t("neetoFilters.messages.noResourcesFound", {
+          resources: t("neetoFilters.common.columns")
+        })
+      }), children]
+    }), /*#__PURE__*/jsxRuntime.jsxs(neetoAtoms.Sheet.Footer, {
+      className: "gap-x-2",
+      children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Button, {
+        "data-testid": "neeto-filters-done-btn",
+        label: t("neetoFilters.common.done"),
+        onClick: handleClearTermAndClose
+      }), /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Button, {
+        "data-testid": "neeto-filters-clear-btn",
+        disabled: isClearFiltersDisabled,
+        label: t("neetoFilters.common.clearFilters"),
+        variant: "ghost",
+        onClick: handleClearAll
+      })]
+    })]
+  }));
+};
+
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var Filters = reactUtils.withT(function (_ref) {
+  var t = _ref.t,
+    _ref$isOpen = _ref.isOpen,
+    isOpen = _ref$isOpen === void 0 ? false : _ref$isOpen,
+    _ref$setIsOpen = _ref.setIsOpen,
+    setIsOpen = _ref$setIsOpen === void 0 ? ramda.identity : _ref$setIsOpen,
+    _ref$columns = _ref.columns,
+    columns = _ref$columns === void 0 ? [] : _ref$columns,
+    _ref$onChange = _ref.onChange,
+    onChange = _ref$onChange === void 0 ? ramda.identity : _ref$onChange,
+    _ref$buttonProps = _ref.buttonProps,
+    buttonProps = _ref$buttonProps === void 0 ? {} : _ref$buttonProps,
+    _ref$paneProps = _ref.paneProps,
+    paneProps = _ref$paneProps === void 0 ? {} : _ref$paneProps,
+    _ref$isSearchable = _ref.isSearchable,
+    isSearchable = _ref$isSearchable === void 0 ? false : _ref$isSearchable,
+    className = _ref.className,
+    _ref$onSelectorsChang = _ref.onSelectorsChange,
+    onSelectorsChange = _ref$onSelectorsChang === void 0 ? neetoCist.noop : _ref$onSelectorsChang,
+    _ref$keyword = _ref.keyword,
+    keyword = _ref$keyword === void 0 ? {
+      node: "",
+      value: "",
+      setValue: neetoCist.noop
+    } : _ref$keyword,
+    childrenKeys = _ref.childrenKeys,
+    children = _ref.children;
+  return /*#__PURE__*/jsxRuntime.jsxs("span", {
+    className: classnames(_defineProperty({}, className, className)),
+    children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Button, _objectSpread({
+      "data-testid": "neeto-filters-toggle-btn",
+      label: t("neetoFilters.common.filter"),
+      variant: "secondary",
+      onClick: function onClick() {
+        return setIsOpen(true);
+      }
+    }, buttonProps)), /*#__PURE__*/jsxRuntime.jsx(Pane, _objectSpread(_objectSpread({
+      onClose: function onClose() {
+        return setIsOpen(false);
+      }
+    }, _objectSpread({
+      childrenKeys: childrenKeys,
+      columns: columns,
+      isOpen: isOpen,
+      isSearchable: isSearchable,
+      keyword: keyword,
+      onChange: onChange,
+      onSelectorsChange: onSelectorsChange
+    }, paneProps)), {}, {
+      children: children
+    }))]
+  });
+});
+
+module.exports = Filters;
+//# sourceMappingURL=Filters.js.map