@bigbinary/neeto-filters-frontend 3.0.10 → 3.0.12

package/dist/index.cjs.js

@@ -282,6 +282,12 @@ var DEFAULT_BOOLEAN_OPTIONS = [{
   label: i18next.t("neetoFilters.common.no"),
   value: "false"
 }];
+var DEFAULT_HELP_ICON_PROPS = {
+  icon: neetoIcons.Help,
+  tooltipProps: {
+    position: "right"
+  }
+};
 
 function _arrayWithHoles(arr) {
   if (Array.isArray(arr)) return arr;
@@ -2597,12 +2603,11 @@ var findDateOption = function findDateOption(filter, options) {
   var currentMoment = dayjs();
   var diffWithStart = Math.abs(currentMoment.diff(dayjs(value[0]), "year"));
   var diffWithEnd = Math.abs(currentMoment.diff(dayjs(value[1]), "year"));
-  var returnOption = diffWithStart < diffWithEnd ? neetoCist.findBy({
+  return diffWithStart < diffWithEnd ? neetoCist.findBy({
     value: "after"
   }, options) : neetoCist.findBy({
     value: "before"
   }, options);
-  return returnOption;
 };
 var buildDateValues = function buildDateValues(dates, selectedRule) {
   if (selectedRule.value === "after") {
@@ -2612,6 +2617,9 @@ var buildDateValues = function buildDateValues(dates, selectedRule) {
   }
   return dates;
 };
+var buildHelpIconProps = function buildHelpIconProps(helpIconProps) {
+  return ramda.mergeDeepRight(DEFAULT_HELP_ICON_PROPS, helpIconProps);
+};
 
 var Boolean = function Boolean(_ref) {
   var column = _ref.column,
@@ -2622,7 +2630,9 @@ var Boolean = function Boolean(_ref) {
     _column$defaultType = column.defaultType,
     defaultType = _column$defaultType === void 0 ? column.type : _column$defaultType,
     label = column.label,
-    values = column.values;
+    values = column.values,
+    _column$helpIconProps = column.helpIconProps,
+    helpIconProps = _column$helpIconProps === void 0 ? {} : _column$helpIconProps;
   var options = ramda.isNil(values) || ramda.isEmpty(values) ? DEFAULT_BOOLEAN_OPTIONS : values;
   var otherProps = getOtherProps(column);
   var value = buildDropdownValue({
@@ -2651,7 +2661,12 @@ var Boolean = function Boolean(_ref) {
     label: label,
     options: options,
     value: value,
-    isClearable: true,
+    isClearable: true
+  }, neetoCist.isNotEmpty(helpIconProps) && {
+    labelProps: {
+      helpIconProps: buildHelpIconProps(helpIconProps)
+    }
+  }, {
     "data-cy": "neeto-filters-".concat(neetoCist.hyphenate(key), "-filter"),
     strategy: "fixed",
     placeholder: t("neetoFilters.messages.selectOption", {
@@ -2676,7 +2691,9 @@ var Datetime = function Datetime(_ref) {
   var key = column.key,
     _column$defaultType = column.defaultType,
     defaultType = _column$defaultType === void 0 ? column.type : _column$defaultType,
-    label = column.label;
+    label = column.label,
+    _column$helpIconProps = column.helpIconProps,
+    helpIconProps = _column$helpIconProps === void 0 ? {} : _column$helpIconProps;
   var isDatePickerShown = filter && isCustomDateRange(filter.value);
   var otherProps = getOtherProps(column);
   var handleChange = function handleChange(option) {
@@ -2719,7 +2736,7 @@ var Datetime = function Datetime(_ref) {
   }, [filter]);
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "neeto-filters-pane-filter__item-wrapper"
-  }, /*#__PURE__*/React__default["default"].createElement(neetoui.Select, {
+  }, /*#__PURE__*/React__default["default"].createElement(neetoui.Select, _extends({
     autoFocus: autoFocus,
     label: label,
     isClearable: true,
@@ -2729,9 +2746,14 @@ var Datetime = function Datetime(_ref) {
     value: selectedRule,
     placeholder: t("neetoFilters.messages.selectResource", {
       resource: label
-    }),
+    })
+  }, neetoCist.isNotEmpty(helpIconProps) && {
+    labelProps: {
+      helpIconProps: buildHelpIconProps(helpIconProps)
+    }
+  }, {
     onChange: handleChange
-  }), isDatePickerShown && /*#__PURE__*/React__default["default"].createElement(neetoui.DatePicker, _extends({
+  })), isDatePickerShown && /*#__PURE__*/React__default["default"].createElement(neetoui.DatePicker, _extends({
     "data-cy": "neeto-filters-".concat(neetoCist.hyphenate(key), "-date-range"),
     getPopupContainer: ramda.prop("parentNode"),
     type: (selectedRule === null || selectedRule === void 0 ? void 0 : selectedRule.value) === "custom-date-range" ? "range" : "date",
@@ -2753,7 +2775,9 @@ var Dropdown = function Dropdown(_ref) {
     _column$defaultType = column.defaultType,
     defaultType = _column$defaultType === void 0 ? column.type : _column$defaultType,
     _column$isClearable = column.isClearable,
-    isClearable = _column$isClearable === void 0 ? true : _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,
@@ -2792,7 +2816,12 @@ var Dropdown = function Dropdown(_ref) {
     strategy: "fixed",
     placeholder: t("neetoFilters.messages.selectResource", {
       resource: label
-    }),
+    })
+  }, neetoCist.isNotEmpty(helpIconProps) && {
+    labelProps: {
+      helpIconProps: buildHelpIconProps(helpIconProps)
+    }
+  }, {
     onChange: handleChange
   }, otherProps));
 };
@@ -2815,7 +2844,9 @@ var SingleDatetime = function SingleDatetime(_ref) {
   var key = column.key,
     _column$defaultType = column.defaultType,
     defaultType = _column$defaultType === void 0 ? column.type : _column$defaultType,
-    label = column.label;
+    label = column.label,
+    _column$helpIconProps = column.helpIconProps,
+    helpIconProps = _column$helpIconProps === void 0 ? {} : _column$helpIconProps;
   var otherProps = getOtherProps(column);
   var datePickerType = selectedRule.value === "between" ? "range" : "date";
   var value = filter === null || filter === void 0 ? void 0 : filter.value;
@@ -2863,15 +2894,20 @@ var SingleDatetime = function SingleDatetime(_ref) {
   };
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "neeto-filters-pane-filter__item-wrapper"
-  }, /*#__PURE__*/React__default["default"].createElement(neetoui.Select, {
+  }, /*#__PURE__*/React__default["default"].createElement(neetoui.Select, _extends({
     label: label,
     "data-cy": "neeto-filters-".concat(neetoCist.hyphenate(key), "-filter-rule"),
     defaultValue: SINGLE_DATE_OPTIONS[0],
     options: SINGLE_DATE_OPTIONS,
     strategy: "fixed",
-    value: selectedRule,
+    value: selectedRule
+  }, neetoCist.isNotEmpty(helpIconProps) && {
+    labelProps: {
+      helpIconProps: buildHelpIconProps(helpIconProps)
+    }
+  }, {
     onChange: handleRuleChange
-  }), /*#__PURE__*/React__default["default"].createElement(neetoui.DatePicker, _extends({
+  })), /*#__PURE__*/React__default["default"].createElement(neetoui.DatePicker, _extends({
     autoFocus: autoFocus,
     value: value,
     "data-cy": "neeto-filters-".concat(neetoCist.hyphenate(key), "-filter"),
@@ -2898,7 +2934,9 @@ var SingleTime = function SingleTime(_ref) {
   var key = column.key,
     _column$defaultType = column.defaultType,
     defaultType = _column$defaultType === void 0 ? column.type : _column$defaultType,
-    label = column.label;
+    label = column.label,
+    _column$helpIconProps = column.helpIconProps,
+    helpIconProps = _column$helpIconProps === void 0 ? {} : _column$helpIconProps;
   var otherProps = getOtherProps(column);
   var timePickerType = selectedRule.value === "between" ? "range" : "time";
   var value = filter === null || filter === void 0 ? void 0 : filter.value;
@@ -2938,14 +2976,19 @@ var SingleTime = function SingleTime(_ref) {
   };
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "neeto-filters-pane-filter__item-wrapper"
-  }, /*#__PURE__*/React__default["default"].createElement(neetoui.Select, {
+  }, /*#__PURE__*/React__default["default"].createElement(neetoui.Select, _extends({
     label: label,
     defaultValue: SINGLE_TIME_OPTIONS[0],
     options: SINGLE_TIME_OPTIONS,
     strategy: "fixed",
-    value: selectedRule,
+    value: selectedRule
+  }, neetoCist.isNotEmpty(helpIconProps) && {
+    labelProps: {
+      helpIconProps: buildHelpIconProps(helpIconProps)
+    }
+  }, {
     onChange: handleRuleChange
-  }), /*#__PURE__*/React__default["default"].createElement(neetoui.TimePicker, _extends({
+  })), /*#__PURE__*/React__default["default"].createElement(neetoui.TimePicker, _extends({
     autoFocus: autoFocus,
     value: value,
     use12Hours: true,
@@ -2970,7 +3013,9 @@ var Text = function Text(_ref) {
     defaultType = _column$defaultType === void 0 ? column.type : _column$defaultType,
     label = column.label,
     _column$showRuleSelec = column.showRuleSelector,
-    showRuleSelector = _column$showRuleSelec === void 0 ? false : _column$showRuleSelec;
+    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 = buildRuleOptions({
     defaultType: defaultType
@@ -3043,7 +3088,12 @@ var Text = function Text(_ref) {
     "data-cy": "neeto-filters-".concat(neetoCist.hyphenate(key), "-filter"),
     label: !showRuleSelector && label,
     type: inputType,
-    value: inputValue,
+    value: inputValue
+  }, neetoCist.isNotEmpty(helpIconProps) && {
+    labelProps: {
+      helpIconProps: buildHelpIconProps(helpIconProps)
+    }
+  }, {
     placeholder: t("neetoFilters.messages.enterResource", {
       resource: label
     }),
@@ -3062,7 +3112,9 @@ var Time = function Time(_ref) {
   var key = column.key,
     _column$defaultType = column.defaultType,
     defaultType = _column$defaultType === void 0 ? column.type : _column$defaultType,
-    label = column.label;
+    label = column.label,
+    _column$helpIconProps = column.helpIconProps,
+    helpIconProps = _column$helpIconProps === void 0 ? {} : _column$helpIconProps;
   var otherProps = getOtherProps(column);
   var value = buildSingleTimeValue(filter);
   var isCustomTimeRangeShown = filter && isCustomTimeRange(filter.value);
@@ -3096,7 +3148,7 @@ var Time = function Time(_ref) {
   };
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "neeto-filters-pane-filter__item-wrapper"
-  }, /*#__PURE__*/React__default["default"].createElement(neetoui.Select, {
+  }, /*#__PURE__*/React__default["default"].createElement(neetoui.Select, _extends({
     autoFocus: autoFocus,
     label: label,
     value: value,
@@ -3106,9 +3158,14 @@ var Time = function Time(_ref) {
     strategy: "fixed",
     placeholder: t("neetoFilters.messages.selectResource", {
       resource: label
-    }),
+    })
+  }, neetoCist.isNotEmpty(helpIconProps) && {
+    labelProps: {
+      helpIconProps: buildHelpIconProps(helpIconProps)
+    }
+  }, {
     onChange: handleChange
-  }), isCustomTimeRangeShown && /*#__PURE__*/React__default["default"].createElement(neetoui.TimePicker, _extends({
+  })), isCustomTimeRangeShown && /*#__PURE__*/React__default["default"].createElement(neetoui.TimePicker, _extends({
     use12Hours: true,
     "data-cy": "neeto-filters-".concat(neetoCist.hyphenate(key), "-date-range"),
     format: "h:mm A",
@@ -3271,6 +3328,10 @@ var Pane = function Pane(_ref) {
     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;
@@ -3279,7 +3340,7 @@ var Pane = function Pane(_ref) {
       }, filters);
       if ((filter === null || filter === void 0 ? void 0 : filter.value) === "") delete searchParams[key];
     });
-    onClose();
+    handleClearTermAndClose();
   };
   var isClearFiltersDisabled = !filters.some(function (_ref3) {
     var value = _ref3.value,
@@ -3314,10 +3375,10 @@ var Pane = function Pane(_ref) {
     return /*#__PURE__*/React__default["default"].createElement(Item, {
       column: column,
       filters: filters,
-      onClose: onClose,
       autoFocus: column.key === isOpen,
       key: column.key,
-      onChange: handleChange
+      onChange: handleChange,
+      onClose: handleClearTermAndClose
     });
   }), neetoCist.isPresent(groupedColumns) && /*#__PURE__*/React__default["default"].createElement(neetoui.Accordion, {
     defaultActiveKey: groupedColumns.findIndex(function (_ref4) {
@@ -3337,10 +3398,10 @@ var Pane = function Pane(_ref) {
       return /*#__PURE__*/React__default["default"].createElement(Item, {
         column: column,
         filters: filters,
-        onClose: onClose,
         autoFocus: column.key === isOpen,
         key: column.key,
-        onChange: handleChange
+        onChange: handleChange,
+        onClose: handleClearTermAndClose
       });
     }));
   })), ramda.isEmpty(ungroupedColumns) && ramda.isEmpty(groupedColumns) && /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
@@ -3352,7 +3413,7 @@ var Pane = function Pane(_ref) {
   }, /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(neetoui.Button, {
     "data-cy": "neeto-filters-done-btn",
     label: t("neetoFilters.common.done"),
-    onClick: onClose
+    onClick: handleClearTermAndClose
   }), /*#__PURE__*/React__default["default"].createElement(neetoui.Button, {
     "data-cy": "neeto-filters-clear-btn",
     disabled: isClearFiltersDisabled,