willba-component-library 0.1.52 → 0.1.53
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/index.esm.js +7 -7
- package/lib/index.esm.js.map +1 -1
- package/lib/index.js +7 -7
- package/lib/index.js.map +1 -1
- package/lib/index.umd.js +7 -7
- package/lib/index.umd.js.map +1 -1
- package/package.json +1 -1
- package/src/components/FilterBar/FilterBar.css +5 -2
- package/src/components/FilterBar/FilterBar.stories.tsx +1 -4
- package/src/components/FilterBar/components/buttons/select-button/SelectButton.css +2 -2
- package/src/components/FilterBar/components/buttons/select-button/SelectButton.tsx +4 -3
- package/src/components/FilterBar/components/buttons/tab-button/TabButton.css +1 -10
- package/src/components/FilterBar/hooks/useFilterBar.tsx +2 -3
- package/src/components/FilterBar/utils/parseGuests.tsx +3 -1
package/lib/index.umd.js
CHANGED
|
@@ -3916,7 +3916,7 @@
|
|
|
3916
3916
|
var _b = __read(_a, 2), key = _b[0], value = _b[1];
|
|
3917
3917
|
var ageCategory = ageCategories.find(function (c) { return c.id === key[key.length - 1]; });
|
|
3918
3918
|
if (ageCategory && value) {
|
|
3919
|
-
acc += "".concat(acc ? ' -' : '', " ").concat(ageCategory.name, ": ").concat(value);
|
|
3919
|
+
acc += "".concat(acc ? ' -' : '', " ").concat(ageCategory.name, ": <span style=\"display: inline-block; width: 21px\">").concat(value, "</span>");
|
|
3920
3920
|
}
|
|
3921
3921
|
return acc;
|
|
3922
3922
|
}, '');
|
|
@@ -4035,7 +4035,7 @@
|
|
|
4035
4035
|
var baseUrl = window.location.origin + window.location.pathname;
|
|
4036
4036
|
var updatedUrl = "".concat(baseUrl, "?").concat(updatedParams.toString());
|
|
4037
4037
|
handleSelectedFilter(false);
|
|
4038
|
-
if (onSubmit) {
|
|
4038
|
+
if (onSubmit && selectedPath === '/rooms') {
|
|
4039
4039
|
var updatedParamsObject_1 = {};
|
|
4040
4040
|
updatedParams.forEach(function (value, key) {
|
|
4041
4041
|
if (value)
|
|
@@ -4063,7 +4063,7 @@
|
|
|
4063
4063
|
finally { if (e_3) throw e_3.error; }
|
|
4064
4064
|
}
|
|
4065
4065
|
handleSelectedFilter(false);
|
|
4066
|
-
return onSubmit
|
|
4066
|
+
return onSubmit && selectedPath === '/rooms'
|
|
4067
4067
|
? onSubmit(newParams)
|
|
4068
4068
|
: (window.location.href = "".concat(redirectUrl, "/").concat(selectedPath).concat(querySearchParams ? "?".concat(querySearchParams.toString()) : ''));
|
|
4069
4069
|
}
|
|
@@ -6598,7 +6598,7 @@
|
|
|
6598
6598
|
React__default.createElement(IoIosCloseCircleOutline, null)));
|
|
6599
6599
|
};
|
|
6600
6600
|
|
|
6601
|
-
var css_248z$9 = ".will-filter-bar-select-button {\n width: 100%;\n height: auto;\n background-color: transparent;\n border: none;\n padding: 0 20px;\n border-radius: 20px;\n cursor: pointer;\n font-size: 14px;\n text-align: initial;\n}\n\n.will-filter-bar-select-button .select-button-wrapper {\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: 10px;\n \n}\n\n.will-filter-bar-select-button .select-button-wrapper > div {\n display: grid\n}\n\n.will-filter-bar-select-button .select-button-label {\n font-weight: 500;\n}\n\n.will-filter-bar-select-button .select-button-description {\n font-weight: 400;\n opacity: 0.8;\n \n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis
|
|
6601
|
+
var css_248z$9 = ".will-filter-bar-select-button {\n width: 100%;\n height: auto;\n background-color: transparent;\n border: none;\n padding: 0 20px;\n border-radius: 20px;\n cursor: pointer;\n font-size: 14px;\n text-align: initial;\n}\n\n.will-filter-bar-select-button .select-button-wrapper {\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: 10px;\n \n}\n\n.will-filter-bar-select-button .select-button-wrapper > div {\n display: grid\n}\n\n.will-filter-bar-select-button .select-button-label {\n font-weight: 500;\n}\n\n.will-filter-bar-select-button .select-button-description {\n font-weight: 400;\n opacity: 0.8;\n \n white-space: nowrap;\n /* overflow: hidden;\n text-overflow: ellipsis; */\n }\n\n .will-filter-bar-select-button .select-button-label.active,\n .will-filter-bar-select-button .select-button-description.active {\n font-weight: 600;\n }\n\n@media (max-width: 960px) {\n .will-filter-bar-select-button {\n padding: 15px 0;\n }\n\n .will-filter-bar-select-button:first-child {\n padding: 0 0 15px 0;\n }\n\n .will-filter-bar-select-button .select-button-wrapper {\n justify-content: center;\n text-align: center;\n }\n\n .will-filter-bar-select-button .select-button-description {\n white-space: wrap;\n }\n\n .will-filter-bar-select-button .select-button-divider {\n display: none\n }\n}\n\n\n";
|
|
6602
6602
|
styleInject(css_248z$9);
|
|
6603
6603
|
|
|
6604
6604
|
var SelectButton = function (_a) {
|
|
@@ -6607,7 +6607,7 @@
|
|
|
6607
6607
|
React__default.createElement("span", { className: "select-button-wrapper" },
|
|
6608
6608
|
React__default.createElement("div", null,
|
|
6609
6609
|
React__default.createElement("p", { className: "select-button-label ".concat(active ? 'active' : '') }, label),
|
|
6610
|
-
React__default.createElement("p", { className: "select-button-description ".concat(active ? 'active' : '') }
|
|
6610
|
+
React__default.createElement("p", { className: "select-button-description ".concat(active ? 'active' : ''), dangerouslySetInnerHTML: { __html: description } })))));
|
|
6611
6611
|
};
|
|
6612
6612
|
|
|
6613
6613
|
// THIS FILE IS AUTO GENERATED
|
|
@@ -6627,7 +6627,7 @@
|
|
|
6627
6627
|
t('submit.label')));
|
|
6628
6628
|
};
|
|
6629
6629
|
|
|
6630
|
-
var css_248z$7 = ".will-filter-bar-tab-button {\n width: auto;\n height: auto;\n padding: 10px 20px;\n cursor: pointer;\n border: none;\n white-space: nowrap;\n font-size: 16px;\n display: flex;\n align-items: center;\n background-color: transparent;\n user-select: none;\n font-weight: 600;\n border-radius: 50px;\n color: var(--will-white)\n }\n\n \n .will-filter-bar-tab-button:hover {\n background-color: var(--will-transparent-white);\n }\n\n .will-filter-bar-tab-button.active {\n background-color: var(--will-transparent-white);\n \n }
|
|
6630
|
+
var css_248z$7 = ".will-filter-bar-tab-button {\n width: auto;\n height: auto;\n padding: 10px 20px;\n cursor: pointer;\n border: none;\n white-space: nowrap;\n font-size: 16px;\n display: flex;\n align-items: center;\n background-color: transparent;\n user-select: none;\n font-weight: 600;\n border-radius: 50px;\n color: var(--will-white)\n }\n\n \n .will-filter-bar-tab-button:hover {\n background-color: var(--will-transparent-white);\n }\n\n .will-filter-bar-tab-button.active {\n background-color: var(--will-transparent-white);\n \n }";
|
|
6631
6631
|
styleInject(css_248z$7);
|
|
6632
6632
|
|
|
6633
6633
|
var TabButton = function (_a) {
|
|
@@ -10705,7 +10705,7 @@
|
|
|
10705
10705
|
React__default.createElement("span", null, itm))); }))));
|
|
10706
10706
|
};
|
|
10707
10707
|
|
|
10708
|
-
var css_248z = ".will-root {\n z-index: 999;\n width:
|
|
10708
|
+
var css_248z = ".will-root {\n z-index: 999;\n width: fit-content;\n min-width: 796px;\n max-height: 100vh;\n position: relative;\n}\n\n.will-filter-bar {\n box-sizing: border-box;\n position: relative;\n}\n\n/* Tabs */\n\n.will-filter-bar-tabs {\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n z-index: 222;\n background: transparent;\n padding: 10px;\n gap: 10px\n}\n\n/* Header */\n.will-filter-bar-header {\n display: flex;\n justify-content: space-between;\n padding: 10px;\n position: relative;\n z-index: 222;\n border-radius: 40px;\n background-color: var(--will-white);\n box-shadow: 0px 3px 10px 0px lightgrey; \n}\n\n@media (max-width: 960px) {\n .will-filter-bar-header {\n flex-direction: column;\n padding: 20px;\n border-radius: 25px;\n }\n}\n\n/* Container */\n\n.will-filter-bar-container {\n background-color: var(--will-white);\n min-height: 100px;\n padding: 40px 20px ;\n position: absolute;\n top: 125px;\n z-index: 111;\n border-radius: 25px;\n box-shadow: var(--will-box-shadow);\n}\n\n@media (max-width: 960px) {\n .will-root { \n width: 100%;\n max-height: 100vh; \n z-index: 3;\n }\n\n .will-filter-bar-container {\n margin-top: 10px;\n top:0;\n padding: 30px 20px;\n position: relative;\n }\n}\n\n";
|
|
10709
10709
|
styleInject(css_248z);
|
|
10710
10710
|
|
|
10711
10711
|
function FilterBar(_a) {
|