@commercetools-uikit/filters 19.24.0 → 19.25.0

package/dist/commercetools-uikit-filters.cjs.prod.js

@@ -11,6 +11,8 @@ var _findInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/insta
 var _filterInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/filter');
 var _sortInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/sort');
 var _includesInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/includes');
+var _Set = require('@babel/runtime-corejs3/core-js-stable/set');
+var _Array$from = require('@babel/runtime-corejs3/core-js-stable/array/from');
 var _concatInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/concat');
 var react$1 = require('react');
 var Popover = require('@radix-ui/react-popover');
@@ -25,7 +27,6 @@ var jsxRuntime = require('@emotion/react/jsx-runtime');
 var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
 var _objectWithoutProperties = require('@babel/runtime-corejs3/helpers/objectWithoutProperties');
 var _forEachInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/for-each');
-var _Array$from = require('@babel/runtime-corejs3/core-js-stable/array/from');
 var _Object$keys = require('@babel/runtime-corejs3/core-js-stable/object/keys');
 var _Object$getOwnPropertySymbols = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols');
 var _Object$getOwnPropertyDescriptor = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor');
@@ -61,6 +62,8 @@ var _findInstanceProperty__default = /*#__PURE__*/_interopDefault(_findInstanceP
 var _filterInstanceProperty__default = /*#__PURE__*/_interopDefault(_filterInstanceProperty);
 var _sortInstanceProperty__default = /*#__PURE__*/_interopDefault(_sortInstanceProperty);
 var _includesInstanceProperty__default = /*#__PURE__*/_interopDefault(_includesInstanceProperty);
+var _Set__default = /*#__PURE__*/_interopDefault(_Set);
+var _Array$from__default = /*#__PURE__*/_interopDefault(_Array$from);
 var _concatInstanceProperty__default = /*#__PURE__*/_interopDefault(_concatInstanceProperty);
 var Popover__namespace = /*#__PURE__*/_interopNamespace(Popover);
 var CollapsibleMotion__default = /*#__PURE__*/_interopDefault(CollapsibleMotion);
@@ -68,7 +71,6 @@ var FlatButton__default = /*#__PURE__*/_interopDefault(FlatButton);
 var SelectInput__default = /*#__PURE__*/_interopDefault(SelectInput);
 var Spacings__default = /*#__PURE__*/_interopDefault(Spacings);
 var _forEachInstanceProperty__default = /*#__PURE__*/_interopDefault(_forEachInstanceProperty);
-var _Array$from__default = /*#__PURE__*/_interopDefault(_Array$from);
 var _Object$keys__default = /*#__PURE__*/_interopDefault(_Object$keys);
 var _Object$getOwnPropertySymbols__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertySymbols);
 var _Object$getOwnPropertyDescriptor__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertyDescriptor);
@@ -460,8 +462,7 @@ function Filters(_ref) {
   const visibleFiltersFromProps = _sortInstanceProperty__default["default"](_context2 = _filterInstanceProperty__default["default"](filters).call(filters, _ref4 => {
     let key = _ref4.key,
       isPersistent = _ref4.isPersistent;
-    const isVisible = Boolean(isPersistent) || _includesInstanceProperty__default["default"](appliedFilterKeys).call(appliedFilterKeys, key);
-    return isVisible;
+    return Boolean(isPersistent) || _includesInstanceProperty__default["default"](appliedFilterKeys).call(appliedFilterKeys, key);
   })
   // persistent filters should be first in filter list
   ).call(_context2, _ref5 => {
@@ -478,6 +479,28 @@ function Filters(_ref) {
     localVisibleFilters = _useState4[0],
     setLocalVisibleFilters = _useState4[1];
 
+  // Update localVisibleFilters if appliedFilters or filters prop changes
+  react$1.useEffect(() => {
+    var _context3;
+    const allFilterKeys = _mapInstanceProperty__default["default"](filters).call(filters, f => f.key);
+    const persistedFilterKeys = _mapInstanceProperty__default["default"](_context3 = _filterInstanceProperty__default["default"](filters).call(filters, filter => filter.isPersistent)).call(_context3, filter => filter.key);
+    const appliedFilterKeysWithValues = _mapInstanceProperty__default["default"](appliedFilters).call(appliedFilters, af => af.filterKey);
+
+    // Calculate keys that *must* be visible based on props
+    const requiredVisibleKeys = new _Set__default["default"]([...persistedFilterKeys, ...appliedFilterKeysWithValues]);
+
+    // Update state: keep existing keys, add required keys, remove keys no longer in props.filters
+    setLocalVisibleFilters(currentVisibleFilters => {
+      var _context4;
+      const combinedKeys = new _Set__default["default"]([...currentVisibleFilters, ...requiredVisibleKeys]);
+      // Ensure all keys in the final state actually exist in the filters prop
+      return _filterInstanceProperty__default["default"](_context4 = _Array$from__default["default"](combinedKeys)).call(_context4, key => _includesInstanceProperty__default["default"](allFilterKeys).call(allFilterKeys, key));
+    });
+
+    // Update the ref for persisted keys (used elsewhere)
+    persistedFiltersRef.current = persistedFilterKeys;
+  }, [appliedFilters, filters]); // Keep dependencies correct
+
   //update localVisibleFilters if persisted filter count changes
   if (persistedFiltersRef.current.length !== persistedFilterKeys.length) {
     setLocalVisibleFilters(_mapInstanceProperty__default["default"](visibleFiltersFromProps).call(visibleFiltersFromProps, _ref7 => {
@@ -503,7 +526,7 @@ function Filters(_ref) {
           label: intl.formatMessage(messages.filtersButtonLabel),
           icon: jsxRuntime.jsx(icons.FilterIcon, {}),
           onClick: handleFiltersClick
-        }), appliedFilters.length > 1 && !showFilterControls && jsxRuntime.jsx(Badge, {
+        }), appliedFilters.length > 0 && !showFilterControls && jsxRuntime.jsx(Badge, {
           id: 'uikit-filters-selected-filter-count',
           label: `${appliedFilters.length}`
         })]
@@ -570,8 +593,8 @@ function Filters(_ref) {
                     appearance: "filter",
                     options: getFilterOptions(filters, filterGroups),
                     onChange: e => {
-                      var _context3;
-                      setLocalVisibleFilters(_concatInstanceProperty__default["default"](_context3 = Array.prototype).call(_context3, e.target.value ? e.target.value : []));
+                      var _context5;
+                      setLocalVisibleFilters(_concatInstanceProperty__default["default"](_context5 = Array.prototype).call(_context5, e.target.value ? e.target.value : []));
                     },
                     value: localVisibleFilters,
                     isMulti: true
@@ -604,7 +627,7 @@ Filters.propTypes = {};
 Filters.displayName = 'Filters';
 
 // NOTE: This string will be replaced on build time with the package version.
-var version = "19.24.0";
+var version = "19.25.0";
 
 exports["default"] = Filters;
 exports.version = version;