ordering-ui-admin-external 1.20.0 → 1.20.2

package/_modules/components/Orders/PaymethodTypeSelector/index.js

@@ -29,6 +29,10 @@ var PaymethodTypeSelector = function PaymethodTypeSelector(props) {
     _useState2 = _slicedToArray(_useState, 2),
     paymethodsTypes = _useState2[0],
     setPaymethodsTypes = _useState2[1];
+  var _useState3 = (0, _react.useState)(''),
+    _useState4 = _slicedToArray(_useState3, 2),
+    searchValue = _useState4[0],
+    setSearchValue = _useState4[1];
   var placeholder = /*#__PURE__*/_react.default.createElement(_styles.PlaceholderTitle, null, t('SELECT_PAYMETHOD', 'Select paymethod'));
   var paymthodsLoading = [{
     value: 'default',
@@ -60,7 +64,7 @@ var PaymethodTypeSelector = function PaymethodTypeSelector(props) {
       }
     }
     setPaymethodsTypes(_paymthodsOptionList);
-  }, [paymethodsList]);
+  }, [paymethodsList, searchValue]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !paymethodsList.loading ? /*#__PURE__*/_react.default.createElement(_MultiSelect.MultiSelect, {
     defaultValue: filterValues.paymethodIds,
     placeholder: placeholder,
@@ -68,11 +72,25 @@ var PaymethodTypeSelector = function PaymethodTypeSelector(props) {
     optionBottomBorder: true,
     onChange: function onChange(paymethod) {
       return handleChangePaymethodType(paymethod);
+    },
+    isShowSearchBar: true,
+    searchBarIsCustomLayout: true,
+    searchBarIsNotLazyLoad: true,
+    searchValue: searchValue,
+    handleChangeSearch: function handleChangeSearch(val) {
+      return setSearchValue(val);
     }
   }) : /*#__PURE__*/_react.default.createElement(_MultiSelect.MultiSelect, {
     defaultValue: "default",
     options: paymthodsLoading,
-    optionBottomBorder: true
+    optionBottomBorder: true,
+    isShowSearchBar: true,
+    searchBarIsCustomLayout: true,
+    searchBarIsNotLazyLoad: true,
+    searchValue: searchValue,
+    handleChangeSearch: function handleChangeSearch(val) {
+      return setSearchValue(val);
+    }
   }));
 };
 exports.PaymethodTypeSelector = PaymethodTypeSelector;

package/_modules/components/Shared/CitySelector/index.js

@@ -34,19 +34,25 @@ var CitySelectorUI = function CitySelectorUI(props) {
     handleChangeCity = props.handleChangeCity,
     position = props.position,
     optionInnerMaxHeight = props.optionInnerMaxHeight;
+  var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
+    _useLanguage2 = _slicedToArray(_useLanguage, 2),
+    t = _useLanguage2[1];
   var _useState = (0, _react.useState)([]),
     _useState2 = _slicedToArray(_useState, 2),
     cityOptions = _useState2[0],
     setCityOptions = _useState2[1];
-  var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
-    _useLanguage2 = _slicedToArray(_useLanguage, 2),
-    t = _useLanguage2[1];
+  var _useState3 = (0, _react.useState)(''),
+    _useState4 = _slicedToArray(_useState3, 2),
+    searchValue = _useState4[0],
+    setSearchValue = _useState4[1];
   var placeholder = /*#__PURE__*/_react.default.createElement(_styles.PlaceholderTitle, {
     isDefault: isDefault
   }, t('SELECT_CITY', 'Select City'));
   (0, _react.useEffect)(function () {
     if (citiesList !== null && citiesList !== void 0 && citiesList.loading) return;
-    var _cityOptions = citiesList === null || citiesList === void 0 ? void 0 : citiesList.cities.map(function (city) {
+    var _cityOptions = citiesList === null || citiesList === void 0 ? void 0 : citiesList.cities.filter(function (option) {
+      return option === null || option === void 0 ? void 0 : option.name.toLocaleLowerCase().includes(searchValue.toLocaleLowerCase());
+    }).map(function (city) {
       return {
         value: city.id,
         content: /*#__PURE__*/_react.default.createElement(_styles.Option, {
@@ -59,7 +65,7 @@ var CitySelectorUI = function CitySelectorUI(props) {
       };
     });
     setCityOptions(_cityOptions);
-  }, [citiesList, isDefault]);
+  }, [citiesList, isDefault, searchValue]);
   (0, _react.useEffect)(function () {
     if (!isAddMode) return;
     if (cityOptions.length === 1) {
@@ -87,6 +93,13 @@ var CitySelectorUI = function CitySelectorUI(props) {
     options: cityOptions,
     onChange: function onChange(city) {
       return handleChangeCity(city);
+    },
+    isShowSearchBar: true,
+    searchBarIsCustomLayout: true,
+    searchBarIsNotLazyLoad: true,
+    searchValue: searchValue,
+    handleChangeSearch: function handleChangeSearch(val) {
+      return setSearchValue(val);
     }
   })));
 };

package/_modules/components/SidebarMenu/index.js

@@ -34,7 +34,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var SidebarMenuUI = function SidebarMenuUI(props) {
-  var _configs$powered_by_o, _configs$appointments, _sessionState$user, _sessionState$user2, _sessionState$user3, _sessionState$user4, _sessionState$user5, _sessionState$user6, _sessionState$user7, _configs$dashboard_lo, _theme$images, _theme$images$logos, _sessionState$user8, _sessionState$user9, _sessionState$user10, _sessionState$user11, _sessionState$user14, _sessionState$user15, _sessionState$user16, _sessionState$user17, _sessionState$user19, _sessionState$user20, _sessionState$user21, _sessionState$user22, _sessionState$user23, _sessionState$user24, _sessionState$user25, _sessionState$user26, _sessionState$user27, _sessionState$user28, _sessionState$user29, _sessionState$user30, _sessionState$user31, _sessionState$user32, _sessionState$user33, _sessionState$user34, _sessionState$user35, _sessionState$user36, _sessionState$user37, _sessionState$user38;
+  var _configs$powered_by_o, _configs$appointments, _sessionState$user, _sessionState$user2, _sessionState$user3, _sessionState$user4, _sessionState$user5, _sessionState$user6, _sessionState$user7, _configs$dashboard_lo, _theme$images, _theme$images$logos, _sessionState$user8, _sessionState$user9, _sessionState$user10, _sessionState$user11, _sessionState$user14, _sessionState$user15, _sessionState$user16, _sessionState$user17, _sessionState$user19, _sessionState$user20, _sessionState$user21, _sessionState$user22, _sessionState$user23, _sessionState$user24, _sessionState$user25, _sessionState$user26, _sessionState$user27, _sessionState$user28, _sessionState$user29, _sessionState$user30, _sessionState$user31, _sessionState$user32, _sessionState$user33, _sessionState$user34, _sessionState$user35, _sessionState$user36, _sessionState$user37;
   var getBillingToken = props.getBillingToken,
     billingUrl = props.billingUrl;
   var location = (0, _reactRouterDom.useLocation)();
@@ -574,14 +574,6 @@ var SidebarMenuUI = function SidebarMenuUI(props) {
       }
     }, (0, _utils.firstLetterCapital)(item.title));
   }))))), (sessionState === null || sessionState === void 0 ? void 0 : (_sessionState$user32 = sessionState.user) === null || _sessionState$user32 === void 0 ? void 0 : _sessionState$user32.level) === 0 && /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
-    className: "d-flex align-items-center",
-    variant: location.pathname === '/ordering-products' && 'primary',
-    onClick: function onClick() {
-      return handleGoToPage({
-        page: 'ordering_products'
-      });
-    }
-  }, /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.WindowDock, null), /*#__PURE__*/_react.default.createElement("span", null, t('ORDERING_PRODUCTS', 'Ordering products'))), (sessionState === null || sessionState === void 0 ? void 0 : (_sessionState$user33 = sessionState.user) === null || _sessionState$user33 === void 0 ? void 0 : _sessionState$user33.level) === 0 && /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
     className: "d-flex align-items-center",
     variant: location.pathname === '/support' && 'primary',
     onClick: function onClick() {
@@ -589,7 +581,7 @@ var SidebarMenuUI = function SidebarMenuUI(props) {
         page: 'support'
       });
     }
-  }, /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.Headset, null), /*#__PURE__*/_react.default.createElement("span", null, t('SUPPORT', 'Support'))), (sessionState === null || sessionState === void 0 ? void 0 : (_sessionState$user34 = sessionState.user) === null || _sessionState$user34 === void 0 ? void 0 : _sessionState$user34.level) === 0 && /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
+  }, /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.Headset, null), /*#__PURE__*/_react.default.createElement("span", null, t('SUPPORT', 'Support'))), (sessionState === null || sessionState === void 0 ? void 0 : (_sessionState$user33 = sessionState.user) === null || _sessionState$user33 === void 0 ? void 0 : _sessionState$user33.level) === 0 && /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
     className: "d-flex align-items-center",
     variant: false,
     onClick: function onClick() {
@@ -606,12 +598,12 @@ var SidebarMenuUI = function SidebarMenuUI(props) {
         page: 'profile'
       });
     }
-  }, sessionState !== null && sessionState !== void 0 && (_sessionState$user35 = sessionState.user) !== null && _sessionState$user35 !== void 0 && _sessionState$user35.photo ? /*#__PURE__*/_react.default.createElement(_reactBootstrap.Image, {
-    src: sessionState === null || sessionState === void 0 ? void 0 : (_sessionState$user36 = sessionState.user) === null || _sessionState$user36 === void 0 ? void 0 : _sessionState$user36.photo,
+  }, sessionState !== null && sessionState !== void 0 && (_sessionState$user34 = sessionState.user) !== null && _sessionState$user34 !== void 0 && _sessionState$user34.photo ? /*#__PURE__*/_react.default.createElement(_reactBootstrap.Image, {
+    src: sessionState === null || sessionState === void 0 ? void 0 : (_sessionState$user35 = sessionState.user) === null || _sessionState$user35 === void 0 ? void 0 : _sessionState$user35.photo,
     width: "30px",
     height: "30px",
     roundedCircle: true
-  }) : /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.PersonFill, null), /*#__PURE__*/_react.default.createElement("span", null, sessionState === null || sessionState === void 0 ? void 0 : (_sessionState$user37 = sessionState.user) === null || _sessionState$user37 === void 0 ? void 0 : _sessionState$user37.name, " ", sessionState === null || sessionState === void 0 ? void 0 : (_sessionState$user38 = sessionState.user) === null || _sessionState$user38 === void 0 ? void 0 : _sessionState$user38.lastname)), /*#__PURE__*/_react.default.createElement(_LogoutButton.LogoutButton, null))))));
+  }) : /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.PersonFill, null), /*#__PURE__*/_react.default.createElement("span", null, sessionState === null || sessionState === void 0 ? void 0 : (_sessionState$user36 = sessionState.user) === null || _sessionState$user36 === void 0 ? void 0 : _sessionState$user36.name, " ", sessionState === null || sessionState === void 0 ? void 0 : (_sessionState$user37 = sessionState.user) === null || _sessionState$user37 === void 0 ? void 0 : _sessionState$user37.lastname)), /*#__PURE__*/_react.default.createElement(_LogoutButton.LogoutButton, null))))));
 };
 var ContextAwareToggle = function ContextAwareToggle(_ref2) {
   var children = _ref2.children,

package/_modules/components/Stores/BusinessCateringDelivery/index.js

@@ -16,7 +16,7 @@ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructur
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } /* eslint-disable camelcase */
 var BusinessCateringDelivery = function BusinessCateringDelivery(props) {
   var _ref, _cateringValues$find, _cateringValues$find4, _cateringValues$find7, _cateringValues$find10, _cateringValues$find13;
   var business = props.business,

package/_modules/components/Stores/BusinessDetails/index.js

@@ -41,7 +41,7 @@ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructur
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } // import { BusinessPublishing } from '../BusinessPublishing'
 var BusinessDetailsUI = function BusinessDetailsUI(props) {
   var _businessState$busine, _businessState$busine2, _businessState$busine3, _businessState$busine4, _businessState$busine5, _businessState$busine6, _businessState$busine7;
   var open = props.open,

package/_modules/components/Stores/BusinessProductsCategoyInfo/index.js

@@ -27,7 +27,7 @@ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructur
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } // import FiCamera from '@meronex/icons/fi/FiCamera'
 var BusinessProductsCategoyInfo = function BusinessProductsCategoyInfo(props) {
   var _configState$configs, _configState$configs$, _formState$changes6, _formState$changes7, _formState$result3, _formState$changes8, _formState$changes9, _formState$changes10, _formState$result4, _formState$changes11, _formState$changes12, _formState$changes13, _formState$changes14, _formState$changes15, _formState$changes16, _formState$changes16$, _formState$changes17, _formState$changes17$, _formState$changes18, _formState$changes18$, _formState$changes19, _formState$changes19$, _formState$changes22;
   var formState = props.formState,

package/_modules/components/Stores/BusinessSalesFacebook/index.js

@@ -19,7 +19,7 @@ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructur
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } // import { useLanguage } from 'ordering-components-admin-external'
 var BusinessSalesFacebook = function BusinessSalesFacebook(props) {
   var onClose = props.onClose,
     socialItem = props.socialItem,

package/_modules/styles/MultiSelect/index.js

@@ -10,6 +10,7 @@ var _EnChevronDown = _interopRequireDefault(require("@meronex/icons/en/EnChevron
 var _reactBootstrapIcons = require("react-bootstrap-icons");
 var _MdClose = _interopRequireDefault(require("@meronex/icons/md/MdClose"));
 var _Buttons = require("../Buttons");
+var _Shared = require("../../components/Shared");
 var _Selects = require("../Selects");
 var _styles = require("./styles");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -30,7 +31,13 @@ var MultiSelect = function MultiSelect(props) {
     options = props.options,
     onChange = props.onChange,
     defaultValue = props.defaultValue,
-    className = props.className;
+    className = props.className,
+    isShowSearchBar = props.isShowSearchBar,
+    searchBarIsNotLazyLoad = props.searchBarIsNotLazyLoad,
+    searchBarPlaceholder = props.searchBarPlaceholder,
+    searchBarIsCustomLayout = props.searchBarIsCustomLayout,
+    searchValue = props.searchValue,
+    handleChangeSearch = props.handleChangeSearch;
   var _useState = (0, _react.useState)(false),
     _useState2 = _slicedToArray(_useState, 2),
     open = _useState2[0],
@@ -59,14 +66,18 @@ var MultiSelect = function MultiSelect(props) {
     }
   };
   (0, _react.useEffect)(function () {
+    if (isShowSearchBar && searchValue) return;
     var _defaultOption = options === null || options === void 0 ? void 0 : options.filter(function (option) {
       return defaultValue.includes(option.value);
     });
     setSelectedOptions(_defaultOption);
     setValues(defaultValue);
-  }, [defaultValue, options]);
+  }, [defaultValue, options, searchValue]);
   (0, _react.useEffect)(function () {
-    if (!open) return;
+    if (!open) {
+      handleChangeSearch && handleChangeSearch('');
+      return;
+    }
     document.addEventListener('click', closeSelect);
     return function () {
       return document.removeEventListener('click', closeSelect);
@@ -119,7 +130,15 @@ var MultiSelect = function MultiSelect(props) {
     isAbsolute: true,
     position: "right",
     ref: dropdownReference
-  }, /*#__PURE__*/_react.default.createElement(_Selects.OptionsInner, {
+  }, isShowSearchBar && /*#__PURE__*/_react.default.createElement(_Selects.SearchBarWrapper, {
+    className: "search-bar-container"
+  }, /*#__PURE__*/_react.default.createElement(_Shared.SearchBar, {
+    lazyLoad: !searchBarIsNotLazyLoad,
+    isCustomLayout: searchBarIsCustomLayout,
+    search: searchValue,
+    onSearch: handleChangeSearch,
+    placeholder: searchBarPlaceholder || ''
+  })), /*#__PURE__*/_react.default.createElement(_Selects.OptionsInner, {
     optionInnerMargin: props.optionInnerMargin,
     optionInnerMaxHeight: props.optionInnerMaxHeight
   }, options.map(function (option, i) {

package/_modules/themes/origin/src/components/OrderContentHeader/index.js

@@ -23,7 +23,7 @@ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructur
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } // import { DeadlinesTypeSelector } from '../DeadlinesTypeSelector'
 var OrderContentHeader = function OrderContentHeader(props) {
   var activeSwitch = props.activeSwitch,
     handleChangeSearch = props.handleChangeSearch,

package/_modules/themes/origin/src/components/UserPopover/index.js

@@ -28,7 +28,8 @@ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructur
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } // import FaRegAddressCard from '@meronex/icons/fa/FaRegAddressCard'
+// import FaRegListAlt from '@meronex/icons/fa/FaRegListAlt'
 var UserPopover = function UserPopover(props) {
   var _sessionState$user, _sessionState$user2, _sessionState$user3;
   var open = props.open;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ordering-ui-admin-external",
-  "version": "1.20.0",
+  "version": "1.20.2",
   "description": "Ordering UI Admin Components",
   "main": "./_modules/index.js",
   "exports": {
@@ -83,7 +83,7 @@
     "lodash": "^4.17.20",
     "moment": "^2.29.1",
     "moment-range": "^4.0.2",
-    "ordering-components-admin-external": "1.20.1",
+    "ordering-components-admin-external": "1.20.2",
     "polished": "^3.6.7",
     "prop-types": "^15.7.2",
     "react-big-calendar": "^1.4.2",

package/src/components/Orders/BusinessesSelector/index.js

@@ -22,6 +22,7 @@ export const BusinessesSelector = (props) => {
 
   const [, t] = useLanguage()
   const [businessTypes, setBusinessTypes] = useState([])
+  const [searchValue, setSearchValue] = useState('')
 
   const Placeholder = <PlaceholderTitle>{t('SELECT_BUSINESS', 'Select business')}</PlaceholderTitle>
   const businessesLoading = [{ value: 'default', content: <Option>{t('BUSINESSES_LOADING', 'Businesses loading')}...</Option> }]
@@ -29,29 +30,31 @@ export const BusinessesSelector = (props) => {
   useEffect(() => {
     const _businessesOptionList = []
     if (!businessesList.loading) {
-      const _businessesOption = businessesList.businesses.map((business) => {
-        return {
-          value: business.id,
-          content: (
-            <Option>
-              <WrapperBusinessImage>
-                {business.logo && <BusinessImage bgimage={business.logo} />}
-              </WrapperBusinessImage>
-              <OptionContent>
-                <OptionName>
-                  {business.name}
-                </OptionName>
-                <OptionCategory>
-                  {business?.alcohol && t('ALCOHOL', 'Alcohol')}
-                  {business?.food && t('FOOD', 'Food')}
-                  {business?.groceries && t('GROCERIES', 'Groceries')}
-                  {business?.laundry && t('LAUNDRY', 'Laundry')}
-                </OptionCategory>
-              </OptionContent>
-            </Option>
-          )
-        }
-      })
+      const _businessesOption = businessesList.businesses
+        .filter(option => option?.name.toLocaleLowerCase().includes(searchValue.toLocaleLowerCase()))
+        .map((business) => {
+          return {
+            value: business.id,
+            content: (
+              <Option>
+                <WrapperBusinessImage>
+                  {business.logo && <BusinessImage bgimage={business.logo} />}
+                </WrapperBusinessImage>
+                <OptionContent>
+                  <OptionName>
+                    {business.name}
+                  </OptionName>
+                  <OptionCategory>
+                    {business?.alcohol && t('ALCOHOL', 'Alcohol')}
+                    {business?.food && t('FOOD', 'Food')}
+                    {business?.groceries && t('GROCERIES', 'Groceries')}
+                    {business?.laundry && t('LAUNDRY', 'Laundry')}
+                  </OptionCategory>
+                </OptionContent>
+              </Option>
+            )
+          }
+        })
 
       for (const option of _businessesOption) {
         _businessesOptionList.push(option)
@@ -59,7 +62,7 @@ export const BusinessesSelector = (props) => {
     }
 
     setBusinessTypes(_businessesOptionList)
-  }, [businessesList])
+  }, [businessesList, searchValue])
 
   return (
     <>
@@ -72,6 +75,11 @@ export const BusinessesSelector = (props) => {
           optionInnerMaxHeight='150px'
           optionBottomBorder
           onChange={(business) => handleChangeBusinesses(business)}
+          isShowSearchBar
+          searchBarIsCustomLayout
+          searchBarIsNotLazyLoad
+          searchValue={searchValue}
+          handleChangeSearch={(val) => setSearchValue(val)}
         />
       ) : (
         <MultiSelect
@@ -80,6 +88,11 @@ export const BusinessesSelector = (props) => {
           optionInnerMargin='10px'
           optionInnerMaxHeight='150px'
           optionBottomBorder
+          isShowSearchBar
+          searchBarIsCustomLayout
+          searchBarIsNotLazyLoad
+          searchValue={searchValue}
+          handleChangeSearch={(val) => setSearchValue(val)}
         />
       )}
     </>

package/src/components/Orders/CountryFilter/index.js

@@ -13,32 +13,35 @@ const CountryFilterUI = (props) => {
 
   const [, t] = useLanguage()
 
+  const [searchValue, setSearchValue] = useState('')
+  const [countryTypes, setCountryTypes] = useState([])
+
   const placeholder = (
     <PlaceholderTitle>
       {t('SELECT_A_COUNTRY', 'Select a country')}
     </PlaceholderTitle>
   )
 
-  const [countryTypes, setCountryTypes] = useState([])
-
   useEffect(() => {
     const _countryList = []
     if (!countriesState.loading) {
-      const _groupsOption = countriesState.countries.map((country) => {
-        return {
-          value: country.code,
-          content: (
-            <Option>{country.name}</Option>
-          )
-        }
-      })
+      const _groupsOption = countriesState.countries
+        .filter(option => option?.name.toLocaleLowerCase().includes(searchValue.toLocaleLowerCase()))
+        .map((country) => {
+          return {
+            value: country.code,
+            content: (
+              <Option>{country.name}</Option>
+            )
+          }
+        })
 
       for (const option of _groupsOption) {
         _countryList.push(option)
       }
     }
     setCountryTypes(_countryList)
-  }, [countriesState])
+  }, [countriesState, searchValue])
 
   return (
     <>
@@ -49,6 +52,11 @@ const CountryFilterUI = (props) => {
           options={countryTypes}
           onChange={(code) => handleChangeCountryCode(code)}
           optionInnerMaxHeight='200px'
+          isShowSearchBar
+          searchBarIsCustomLayout
+          searchBarIsNotLazyLoad
+          searchValue={searchValue}
+          handleChangeSearch={(val) => setSearchValue(val)}
         />
       ) : (
         <SkeletonWrapper>

package/src/components/Orders/CurrencyFilter/index.js

@@ -11,6 +11,7 @@ export const CurrencyFilter = (props) => {
   } = props
 
   const [, t] = useLanguage()
+  const [searchValue, setSearchValue] = useState('')
 
   const placeholder = (
     <PlaceholderTitle>
@@ -22,20 +23,22 @@ export const CurrencyFilter = (props) => {
 
   useEffect(() => {
     const _countryList = []
-    const _groupsOption = currencyList.map((country) => {
-      return {
-        value: country.value,
-        content: (
-          <Option>{country.text}</Option>
-        )
-      }
-    })
+    const _groupsOption = currencyList
+      .filter(option => option?.text.toLocaleLowerCase().includes(searchValue.toLocaleLowerCase()))
+      .map((country) => {
+        return {
+          value: country.value,
+          content: (
+            <Option>{country.text}</Option>
+          )
+        }
+      })
 
     for (const option of _groupsOption) {
       _countryList.push(option)
     }
     setCountryTypes(_countryList)
-  }, [currencyList])
+  }, [currencyList, searchValue])
 
   return (
     <MultiSelect
@@ -44,6 +47,11 @@ export const CurrencyFilter = (props) => {
       options={countryTypes}
       onChange={(code) => handleChangeCurrency(code)}
       optionInnerMaxHeight='200px'
+      isShowSearchBar
+      searchBarIsCustomLayout
+      searchBarIsNotLazyLoad
+      searchValue={searchValue}
+      handleChangeSearch={(val) => setSearchValue(val)}
     />
   )
 }

package/src/components/Orders/DeliveryTypeSelector/index.js

@@ -1,4 +1,4 @@
-import React from 'react'
+import React, { useEffect, useState } from 'react'
 import { useLanguage } from 'ordering-components-admin-external'
 import { MultiSelect } from '../../../styles/MultiSelect'
 
@@ -15,13 +15,31 @@ export const DeliveryTypeSelector = (props) => {
 
   const [, t] = useLanguage()
 
-  const deliveryTypes = [
-    { value: 1, content: <Option>{t('DELIVERY', 'Delivery')}</Option> },
-    { value: 2, content: <Option>{t('PICKUP', 'Pickup')}</Option> },
-    { value: 3, content: <Option>{t('EAT_IN', 'Eat in')}</Option> },
-    { value: 4, content: <Option>{t('CURBSIDE', 'Curbside')}</Option> },
-    { value: 5, content: <Option>{t('DRIVE_THRU', 'Drive thru')}</Option> }
+  const [searchValue, setSearchValue] = useState('')
+  const [deliveryTypes, setDeliveryTypes] = useState([])
+
+  const deliveryTypeList = [
+    { value: 1, name: t('DELIVERY', 'Delivery') },
+    { value: 2, name: t('PICKUP', 'Pickup') },
+    { value: 3, name: t('EAT_IN', 'Eat in') },
+    { value: 4, name: t('CURBSIDE', 'Curbside') },
+    { value: 5, name: t('DRIVE_THRU', 'Drive thru') }
   ]
+
+  useEffect(() => {
+    const _deliveryTypes = deliveryTypeList
+      .filter(option => option?.name.toLocaleLowerCase().includes(searchValue.toLocaleLowerCase()))
+      .map((type) => {
+        return {
+          value: type.value,
+          content: (
+            <Option>{type.name}</Option>
+          )
+        }
+      })
+    setDeliveryTypes(_deliveryTypes)
+  }, [searchValue])
+
   const placeholder = <PlaceholderTitle>{t('SELECT_DELIVERY_TYPE', 'Select delivery type')}</PlaceholderTitle>
 
   return (
@@ -30,6 +48,11 @@ export const DeliveryTypeSelector = (props) => {
       defaultValue={filterValues.deliveryTypes}
       options={deliveryTypes}
       onChange={(deliveryType) => handleChangeDeliveryType(deliveryType)}
+      isShowSearchBar
+      searchBarIsCustomLayout
+      searchBarIsNotLazyLoad
+      searchValue={searchValue}
+      handleChangeSearch={(val) => setSearchValue(val)}
     />
   )
 }

package/src/components/Orders/DriverSelector/index.js

@@ -159,6 +159,11 @@ const DriverSelectorUI = (props) => {
             optionInnerMargin='10px'
             optionInnerMaxHeight='150px'
             onChange={(driver) => handleChangeDriver(driver)}
+            isShowSearchBar
+            searchBarIsCustomLayout
+            searchBarIsNotLazyLoad
+            searchValue={searchValue}
+            handleChangeSearch={(val) => setSearchValue(val)}
           />
         ) : (
           <MultiSelect
@@ -167,6 +172,11 @@ const DriverSelectorUI = (props) => {
             optionInnerMargin='10px'
             optionInnerMaxHeight='150px'
             className='driver-select'
+            isShowSearchBar
+            searchBarIsCustomLayout
+            searchBarIsNotLazyLoad
+            searchValue={searchValue}
+            handleChangeSearch={(val) => setSearchValue(val)}
           />
         )}
       </>