@orfium/ictinus 4.84.1 → 4.84.2

package/dist/components/Filter/Filter.js

@@ -18,7 +18,6 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "d
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 var Filter = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
-  var _selectedItem$label;
   var items = props.items,
     onSelect = props.onSelect,
     selectedItem = props.selectedItem,
@@ -59,13 +58,15 @@ var Filter = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
   var _React$useState2 = _react["default"].useState(''),
     searchValue = _React$useState2[0],
     setSearchValue = _React$useState2[1];
-  var _React$useState3 = _react["default"].useState((_selectedItem$label = selectedItem == null ? void 0 : selectedItem.label) != null ? _selectedItem$label : defaultValue.label),
+  var _React$useState3 = _react["default"].useState((0, _utils.getInitialFilterLabel)(defaultValue, multi, selectedItem, selectedItems)),
     filterLabel = _React$useState3[0],
     setFilterLabel = _React$useState3[1];
   _react["default"].useEffect(function () {
-    var _selectedItem$label2;
-    setFilterLabel((_selectedItem$label2 = selectedItem == null ? void 0 : selectedItem.label) != null ? _selectedItem$label2 : defaultValue.label);
-  }, [defaultValue.label, selectedItem == null ? void 0 : selectedItem.label]);
+    /** Run this useEffect only for single Filter, multi Filter updates the label on every multi filter chip addition/deletion/clear all */
+    if (!multi) {
+      setFilterLabel((0, _utils.getInitialFilterLabel)(defaultValue, multi, selectedItem, selectedItems));
+    }
+  }, [defaultValue, filterLabel, multi, selectedItem, selectedItems]);
   var hasSelectedValue = Boolean(selectedItem == null ? void 0 : selectedItem.value) && (selectedItem == null ? void 0 : selectedItem.value) !== defaultValue.value;
   var iconName = isOpen ? 'triangleUp' : 'triangleDown';
   var _useMultiFilterUtils = (0, _useMultiFilterUtils2["default"])({

package/dist/components/Filter/utils.d.ts

@@ -1,5 +1,5 @@
 import { PropsValidationError } from '../../utils/errors';
-import { BackgroundColorProps, BaseColorProps, BorderProps, Props } from './types';
+import { BackgroundColorProps, BaseColorProps, BorderProps, FilterOption, Props } from './types';
 export declare const FILTER_OPTIONS_MAX_HEIGHT = 253;
 export declare const HAS_SELECTED_VALUE_COLOR_SHADE = 50;
 export declare const borderStyleParams: string;
@@ -16,3 +16,5 @@ export declare const errors: {
     condition: ({ filterType, styleType }: Props) => boolean;
     error: PropsValidationError;
 }[];
+/** This callback returns the initial label of the Filter for all combinations */
+export declare const getInitialFilterLabel: (defaultItem: FilterOption, multi: boolean, item?: import("../Select/Select").SelectOptionValues | undefined, items?: import("../Select/Select").SelectOptionValues[] | undefined) => string;

package/dist/components/Filter/utils.js

@@ -1,7 +1,7 @@
 "use strict";
 
 exports.__esModule = true;
-exports.transparentFocusBorderWidth = exports.getTextColor = exports.getBorder = exports.getBackgroundColor = exports.focusBorderWidth = exports.errors = exports.borderStyleParams = exports.HAS_SELECTED_VALUE_COLOR_SHADE = exports.FILTER_OPTIONS_MAX_HEIGHT = void 0;
+exports.transparentFocusBorderWidth = exports.getTextColor = exports.getInitialFilterLabel = exports.getBorder = exports.getBackgroundColor = exports.focusBorderWidth = exports.errors = exports.borderStyleParams = exports.HAS_SELECTED_VALUE_COLOR_SHADE = exports.FILTER_OPTIONS_MAX_HEIGHT = void 0;
 var _utils = require("../../theme/utils");
 var _palette = require("../../theme/palette");
 var _errors = require("../../utils/errors");
@@ -82,4 +82,21 @@ var errors = exports.errors = [{
     return Boolean(filterType === 'added' && styleType === 'transparent');
   },
   error: new _errors.PropsValidationError('This filterType and styleType is not supported')
-}];
+}];
+
+/** This callback returns the initial label of the Filter for all combinations */
+var getInitialFilterLabel = exports.getInitialFilterLabel = function getInitialFilterLabel(defaultItem, multi, item, items) {
+  if (multi) {
+    if (items && items.length > 0) {
+      if (items.length === 1) {
+        return items[0].label;
+      } else {
+        return items[0].label + " + " + (items.length - 1) + " more";
+      }
+    }
+  }
+  if (item && !multi) {
+    return item.label;
+  }
+  return defaultItem.label;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@orfium/ictinus",
-  "version": "4.84.1",
+  "version": "4.84.2",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "license": "MIT",