willba-component-library 0.0.80 → 0.0.82

package/lib/index.js

@@ -7902,18 +7902,14 @@ var css_248z$4 = ".will-guests-filter-label, .will-guests-filter-count {\n  font
 styleInject(css_248z$4);
 
 function GuestCount(_a) {
-    var label = _a.label, updateGuestsCount = _a.updateGuestsCount;
-    useTranslation('filterBar').t;
-    var _b = React__default.useState(0), count = _b[0], setCount = _b[1];
+    var label = _a.label, id = _a.id, updateGuestsCount = _a.updateGuestsCount, count = _a.count, minVal = _a.minVal;
     var handleDecrement = function () {
-        if (count > 0) {
-            setCount(count - 1);
-            updateGuestsCount(label, count - 1);
+        if (count > minVal) {
+            updateGuestsCount(id, count - 1);
         }
     };
     var handleIncrement = function () {
-        setCount(count + 1);
-        updateGuestsCount(label, count + 1);
+        updateGuestsCount(id, count + 1);
     };
     return (React__default.createElement("div", { className: "will-guests-filter-inner" },
         React__default.createElement("span", { className: "will-guests-filter-label" }, label),
@@ -7930,12 +7926,13 @@ var css_248z$3 = ".will-filter-bar-guests {\n  text-align: initial;\n}\n\n.will-
 styleInject(css_248z$3);
 
 function Guests(_a) {
-    var ageCategories = _a.ageCategories, updateGuestsCount = _a.updateGuestsCount;
+    var ageCategories = _a.ageCategories, updateGuestsCount = _a.updateGuestsCount, ageCategoryCounts = _a.ageCategoryCounts;
     var t = useTranslation('filterBar').t;
     return (React__default.createElement("div", { className: "will-filter-bar-guests" },
         React__default.createElement("h3", { className: "will-guests-filter-title" }, t('guests.title')),
         React__default.createElement("p", { className: "will-guests-filter-subtitle" }, t('guests.subtitle')),
-        React__default.createElement("div", { className: "will-guests-filter-container" }, ageCategories === null || ageCategories === void 0 ? void 0 : ageCategories.map(function (category) { return (React__default.createElement(GuestCount, { key: category.id, label: category.name, updateGuestsCount: updateGuestsCount })); }))));
+        React__default.createElement("div", { className: "will-guests-filter-container" }, ageCategories === null || ageCategories === void 0 ? void 0 : ageCategories.map(function (category) { return (React__default.createElement(GuestCount, { key: category.id, id: parseInt(category.id), label: category.name, minVal: category.minVal, updateGuestsCount: updateGuestsCount, count: ageCategoryCounts[category.id] ||
+                category.minVal })); }))));
 }
 
 var css_248z$2 = ".will-filter-bar-categories {\n  text-align: center;\n}\n\n.will-categories-filter-title {\n  font-size: 16px;\n  text-transform: uppercase;\n  margin: 10px 0 30px 0;\n}\n\n.will-categories-filter-inner {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 20px;\n}\n\n.will-categories-filter-inner input {\n  cursor: pointer;\n  margin-right: 10px;\n}\n";
@@ -8011,10 +8008,10 @@ function useFilterBar(ageCategories) {
     var _c = React__default.useState(0), categories = _c[0], setCategories = _c[1];
     //
     var _d = React__default.useState({}), ageCategoryCounts = _d[0], setAgeCategoryCounts = _d[1];
-    var updateGuestsCount = function (label, newCount) {
+    var updateGuestsCount = function (id, newCount) {
         setAgeCategoryCounts(function (prevCounts) {
             var _a;
-            return (__assign(__assign({}, prevCounts), (_a = {}, _a[label] = newCount, _a)));
+            return (__assign(__assign({}, prevCounts), (_a = {}, _a[id] = newCount, _a)));
         });
     };
     //
@@ -8022,8 +8019,7 @@ function useFilterBar(ageCategories) {
         var urlSearchParams = new URLSearchParams(window.location.search);
         var startDateParam = urlSearchParams.get('startDate');
         var endDateParam = urlSearchParams.get('endDate');
-        parseInt(urlSearchParams.get('guestsAdults') || '1', 10);
-        parseInt(urlSearchParams.get('guestsKids') || '0', 10);
+        var ageCategoryCountsParam = JSON.parse(urlSearchParams.get('ageCategoryCounts') || '{}');
         var parsedCategories = parseInt(urlSearchParams.get('categories') || '0', 10);
         if (startDateParam && endDateParam) {
             setCalendarRange({
@@ -8031,8 +8027,7 @@ function useFilterBar(ageCategories) {
                 to: new Date(endDateParam),
             });
         }
-        // setGuestsAdults(parsedGuestsAdults)
-        // setGuestsKids(parsedGuestsKids)
+        setAgeCategoryCounts(ageCategoryCountsParam);
         setCategories(parsedCategories);
     }, []);
     var handleSelectedFilter = function (id) {
@@ -10424,16 +10419,16 @@ instance.use(initReactI18next).init({
 });
 
 function FilterBar(_a) {
-    var vendor = _a.vendor, language = _a.language, ageCategories = _a.ageCategories;
+    var vendor = _a.vendor, language = _a.language, _b = _a.ageCategories, ageCategories = _b === void 0 ? ageCategoriesFallback : _b;
     var themeClass = useTheme({ vendor: vendor });
-    var _b = React__default.useState(0); _b[0]; var setRerenderKey = _b[1];
+    var _c = React__default.useState(0); _c[0]; var setRerenderKey = _c[1];
     React__default.useEffect(function () {
         instance.changeLanguage(language);
         // Trigger a re-render by updating the rerenderKey
         setRerenderKey(function (prevKey) { return prevKey + 1; });
     }, [language]);
     var t = useTranslation('filterBar').t;
-    var _c = useFilterBar(), selectedFilter = _c.selectedFilter, categories = _c.categories, calendarRange = _c.calendarRange, setCalendarRange = _c.setCalendarRange, setCategories = _c.setCategories, handleSelectedFilter = _c.handleSelectedFilter, handleSubmit = _c.handleSubmit, updateGuestsCount = _c.updateGuestsCount;
+    var _d = useFilterBar(), selectedFilter = _d.selectedFilter, ageCategoryCounts = _d.ageCategoryCounts, categories = _d.categories, calendarRange = _d.calendarRange, setCalendarRange = _d.setCalendarRange, setCategories = _d.setCategories, handleSelectedFilter = _d.handleSelectedFilter, handleSubmit = _d.handleSubmit, updateGuestsCount = _d.updateGuestsCount;
     return (React__default.createElement(React__default.Fragment, null,
         selectedFilter && (React__default.createElement("div", { className: "will-filter-bar will-filter-bar-underlay", onClick: function () {
                 handleSelectedFilter(false);
@@ -10448,12 +10443,28 @@ function FilterBar(_a) {
                 React__default.createElement(SubmitButton, { onClick: handleSubmit })),
             selectedFilter && (React__default.createElement("div", { className: "will-filter-bar-container" },
                 (selectedFilter === 1 || selectedFilter === 2) && (React__default.createElement(Calendar, { calendarRange: calendarRange, setCalendarRange: setCalendarRange })),
-                selectedFilter === 3 && (React__default.createElement(Guests, { updateGuestsCount: updateGuestsCount, ageCategories: ageCategories })),
+                selectedFilter === 3 && (React__default.createElement(Guests, { updateGuestsCount: updateGuestsCount, ageCategories: ageCategories, ageCategoryCounts: ageCategoryCounts })),
                 selectedFilter === 4 && (React__default.createElement(Categories, { categories: categories, setCategories: setCategories })))))));
 }
 var fontWigthBold = function (input) {
     return { fontWeight: input ? 'bold' : 'initial' };
 };
+var ageCategoriesFallback = [
+    {
+        id: '1',
+        name: 'Adults',
+        minAge: null,
+        maxAge: 6,
+        minVal: 1,
+    },
+    {
+        id: '2',
+        name: 'Kids',
+        minAge: 6,
+        maxAge: 17,
+        minVal: 0,
+    },
+];
 
 exports.Button = Button$1;
 exports.FilterBar = FilterBar;