willba-component-library 0.0.80 → 0.0.81

package/lib/components/FilterBar/FilterBarTypes.d.ts

@@ -1,15 +1,22 @@
+export interface AgeCategoryCount {
+    [categoryId: string]: number;
+}
 export interface AgeCategoryType {
     id: string;
     name: string;
     minAge: number | null;
     maxAge: number | null;
-    maxVal: number;
+    minVal: number;
 }
 export interface GuestsPropsType {
     ageCategories: AgeCategoryType[];
-    updateGuestsCount: (arg1: string, arg2: number) => void;
+    updateGuestsCount: (arg1: number, arg2: number) => void;
+    ageCategoryCounts: AgeCategoryCount | {};
 }
 export interface GuestsCountPropsType {
     label: string;
-    updateGuestsCount: (arg1: string, arg2: number) => void;
+    id: number;
+    updateGuestsCount: (arg1: number, arg2: number) => void;
+    count: number;
+    minVal: number;
 }

package/lib/components/FilterBar/components/guests/GuestCount/GuestCount.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { GuestsCountPropsType } from '../../../FilterBarTypes';
 import './GuestCount.css';
-export default function GuestCount({ label, updateGuestsCount, }: GuestsCountPropsType): React.JSX.Element;
+export default function GuestCount({ label, id, updateGuestsCount, count, minVal, }: GuestsCountPropsType): React.JSX.Element;

package/lib/components/FilterBar/components/guests/Guests.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { GuestsPropsType } from '../../FilterBarTypes';
 import './Guests.css';
-export default function Guests({ ageCategories, updateGuestsCount, }: GuestsPropsType): React.JSX.Element;
+export default function Guests({ ageCategories, updateGuestsCount, ageCategoryCounts, }: GuestsPropsType): React.JSX.Element;

package/lib/components/FilterBar/hooks/useFilterBar.d.ts

@@ -1,15 +1,16 @@
 /// <reference types="react" />
 import { DateRange } from 'react-day-picker';
+import { AgeCategoryCount } from '../FilterBarTypes';
 export default function useFilterBar(ageCategories: any): {
     selectedFilter: number | boolean;
-    ageCategoryCounts: {};
+    ageCategoryCounts: AgeCategoryCount;
     categories: number;
     calendarRange: DateRange | undefined;
     setCalendarRange: import("react").Dispatch<import("react").SetStateAction<DateRange | undefined>>;
     setSelectedFilter: import("react").Dispatch<import("react").SetStateAction<number | boolean>>;
-    setAgeCategoryCounts: import("react").Dispatch<import("react").SetStateAction<{}>>;
+    setAgeCategoryCounts: import("react").Dispatch<import("react").SetStateAction<AgeCategoryCount>>;
     setCategories: import("react").Dispatch<import("react").SetStateAction<number>>;
     handleSelectedFilter: (id: number | boolean) => void;
     handleSubmit: () => void;
-    updateGuestsCount: (label: string, newCount: number) => void;
+    updateGuestsCount: (id: number, newCount: number) => void;
 };

package/lib/index.d.ts

@@ -32,7 +32,7 @@ interface AgeCategoryType {
     name: string;
     minAge: number | null;
     maxAge: number | null;
-    maxVal: number;
+    minVal: number;
 }
 
 interface FilterBarProps {

package/lib/index.esm.js

@@ -7882,18 +7882,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 = 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__default.createElement("div", { className: "will-guests-filter-inner" },
         React__default__default.createElement("span", { className: "will-guests-filter-label" }, label),
@@ -7910,12 +7906,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__default.createElement("div", { className: "will-filter-bar-guests" },
         React__default__default.createElement("h3", { className: "will-guests-filter-title" }, t('guests.title')),
         React__default__default.createElement("p", { className: "will-guests-filter-subtitle" }, t('guests.subtitle')),
-        React__default__default.createElement("div", { className: "will-guests-filter-container" }, ageCategories === null || ageCategories === void 0 ? void 0 : ageCategories.map(function (category) { return (React__default__default.createElement(GuestCount, { key: category.id, label: category.name, updateGuestsCount: updateGuestsCount })); }))));
+        React__default__default.createElement("div", { className: "will-guests-filter-container" }, ageCategories === null || ageCategories === void 0 ? void 0 : ageCategories.map(function (category) { return (React__default__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";
@@ -7991,10 +7988,10 @@ function useFilterBar(ageCategories) {
     var _c = useState(0), categories = _c[0], setCategories = _c[1];
     //
     var _d = 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)));
         });
     };
     //
@@ -8002,8 +7999,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({
@@ -8011,8 +8007,7 @@ function useFilterBar(ageCategories) {
                 to: new Date(endDateParam),
             });
         }
-        // setGuestsAdults(parsedGuestsAdults)
-        // setGuestsKids(parsedGuestsKids)
+        setAgeCategoryCounts(ageCategoryCountsParam);
         setCategories(parsedCategories);
     }, []);
     var handleSelectedFilter = function (id) {
@@ -10413,7 +10408,7 @@ function FilterBar(_a) {
         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 _c = useFilterBar(), selectedFilter = _c.selectedFilter, ageCategoryCounts = _c.ageCategoryCounts, categories = _c.categories, calendarRange = _c.calendarRange, setCalendarRange = _c.setCalendarRange, setCategories = _c.setCategories, handleSelectedFilter = _c.handleSelectedFilter, handleSubmit = _c.handleSubmit, updateGuestsCount = _c.updateGuestsCount;
     return (React__default__default.createElement(React__default__default.Fragment, null,
         selectedFilter && (React__default__default.createElement("div", { className: "will-filter-bar will-filter-bar-underlay", onClick: function () {
                 handleSelectedFilter(false);
@@ -10428,7 +10423,7 @@ function FilterBar(_a) {
                 React__default__default.createElement(SubmitButton, { onClick: handleSubmit })),
             selectedFilter && (React__default__default.createElement("div", { className: "will-filter-bar-container" },
                 (selectedFilter === 1 || selectedFilter === 2) && (React__default__default.createElement(Calendar, { calendarRange: calendarRange, setCalendarRange: setCalendarRange })),
-                selectedFilter === 3 && (React__default__default.createElement(Guests, { updateGuestsCount: updateGuestsCount, ageCategories: ageCategories })),
+                selectedFilter === 3 && (React__default__default.createElement(Guests, { updateGuestsCount: updateGuestsCount, ageCategories: ageCategories, ageCategoryCounts: ageCategoryCounts })),
                 selectedFilter === 4 && (React__default__default.createElement(Categories, { categories: categories, setCategories: setCategories })))))));
 }
 var fontWigthBold = function (input) {