willba-component-library 0.1.24 → 0.1.26
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 +11 -6
- package/lib/index.esm.js.map +1 -1
- package/lib/index.js +11 -6
- package/lib/index.js.map +1 -1
- package/lib/index.umd.js +11 -6
- package/lib/index.umd.js.map +1 -1
- package/package.json +1 -1
- package/src/components/FilterBar/FilterBar.css +0 -3
- package/src/components/FilterBar/FilterBar.tsx +13 -7
- package/src/components/FilterBar/components/guests/Guests.css +0 -2
- package/src/components/FilterBar/hooks/useFilterBar.tsx +5 -3
package/lib/index.esm.js
CHANGED
|
@@ -7944,7 +7944,7 @@ function GuestCount(_a) {
|
|
|
7944
7944
|
React__default__default.createElement("button", { className: "will-guests-filter-counter-button", onClick: handleIncrement }, "+"))));
|
|
7945
7945
|
}
|
|
7946
7946
|
|
|
7947
|
-
var css_248z$5 = ".will-filter-bar-guests {\n text-align: initial;\n}\n\n.will-guests-filter-title {\n font-size: 22px;\n margin: 10px 0;\n}\n\n.will-guests-filter-subtitle {\n font-size: 15px;\n font-weight: 500;\n color:var(--will-text)\n}\n\n\n.will-guests-filter-container {\n display: flex;\n flex-direction: column;\n
|
|
7947
|
+
var css_248z$5 = ".will-filter-bar-guests {\n text-align: initial;\n}\n\n.will-guests-filter-title {\n font-size: 22px;\n margin: 10px 0;\n}\n\n.will-guests-filter-subtitle {\n font-size: 15px;\n font-weight: 500;\n color:var(--will-text)\n}\n\n\n.will-guests-filter-container {\n display: flex;\n flex-direction: column;\n}\n\n\n@media (max-width: 960px) {\n .will-guests-filter-title {\n font-size: 18px;\n }\n\n .will-guests-filter-container {\n margin-top: 15px;\n }\n}";
|
|
7948
7948
|
styleInject(css_248z$5);
|
|
7949
7949
|
|
|
7950
7950
|
function Guests(_a) {
|
|
@@ -8028,7 +8028,6 @@ function useFilterBar(_a) {
|
|
|
8028
8028
|
var _e = useState(0), categories = _e[0], setCategories = _e[1];
|
|
8029
8029
|
var _f = useState({}), ageCategoryCounts = _f[0], setAgeCategoryCounts = _f[1];
|
|
8030
8030
|
var updateGuestsCount = function (id, newCount) {
|
|
8031
|
-
console.log(ageCategoryCounts);
|
|
8032
8031
|
setAgeCategoryCounts(function (prevCounts) {
|
|
8033
8032
|
var _a;
|
|
8034
8033
|
return (__assign(__assign({}, prevCounts), (_a = {}, _a[id] = newCount, _a)));
|
|
@@ -8072,7 +8071,10 @@ function useFilterBar(_a) {
|
|
|
8072
8071
|
handleSelectedFilter(false);
|
|
8073
8072
|
};
|
|
8074
8073
|
useEffect(function () {
|
|
8075
|
-
|
|
8074
|
+
if (typeof window === 'undefined')
|
|
8075
|
+
return;
|
|
8076
|
+
document.body.style.overflow =
|
|
8077
|
+
selectedFilter && window.innerWidth < 960 ? 'hidden' : 'visible';
|
|
8076
8078
|
return function () {
|
|
8077
8079
|
document.body.style.overflow = 'visible';
|
|
8078
8080
|
};
|
|
@@ -8111,7 +8113,7 @@ function useFilterBar(_a) {
|
|
|
8111
8113
|
};
|
|
8112
8114
|
}
|
|
8113
8115
|
|
|
8114
|
-
var css_248z$3 = ".will-root {\n z-index: 99999;\n width: 100%;\n max-height: 100vh;\n position: relative;\n
|
|
8116
|
+
var css_248z$3 = ".will-root {\n z-index: 99999;\n width: 100%;\n max-height: 100vh;\n position: relative;\n}\n\n.will-filter-bar {\n box-sizing: border-box;\n position: relative;\n}\n\n.will-filter-bar-underlay {\n background-color: transparent;\n position: absolute;\n left: 0;\n width: 100%;\n height: 100%;\n cursor: pointer;\n min-height: 500vh;\n z-index: 88888;\n transform: translateY(-50%);\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}\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 overflow-y: auto;\n padding: 40px 10px;\n top: 15px;\n z-index: 0;\n }\n\n .will-filter-bar-container {\n margin-top: 10px;\n top:0;\n padding: 30px 20px;\n position: relative;\n }\n\n .will-root.isMobileAbsolute {\n position: relative;\n z-index: 99999;\n }\n}\n\n";
|
|
8115
8117
|
styleInject(css_248z$3);
|
|
8116
8118
|
|
|
8117
8119
|
var css_248z$2 = "@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&display=swap');\n\n.will-root * {\n font-family: 'Montserrat', sans-serif;\n}\n\n.will-root {\n \n box-sizing: border-box;\n font-size: 14px;\n \n color: #1E1E1E;\n\n /* Palette */\n --will-primary: #374269;\n --will-secondary: #374269;\n --will-grey: #ABA7AF;\n --will-white: #fff;\n --will-black: #000;\n --will-onahau: #CDEEFF;\n --will-text: #5A5959;\n --will-transparent-white: rgba(255, 255, 255, 0.30);\n\n /* Confines */\n --will-box-shadow: 0px 6px 11px 0px #a7a4a480;\n\n /* Breakpoints */\n\n --will-lg: 1140px;\n --will-md: 960px;\n --will-sm: 600px;\n --will-xl: 1280px;\n --will-xs: 0px;\n}\n\n/* Typography */\n\n.will-root h1, h2, h3, h4, h5, h6 {\n font-weight: 700;\n} \n\n.will-root p, h1, h2, h3, h4, h5, h6, span {\n margin: 0;\n padding: 0;\n}";
|
|
@@ -10504,6 +10506,8 @@ function FilterBar(_a) {
|
|
|
10504
10506
|
// Scroll in to view
|
|
10505
10507
|
var targetFilterBarRef = useRef(null);
|
|
10506
10508
|
useEffect(function () {
|
|
10509
|
+
if (window !== undefined && window.innerWidth < 960)
|
|
10510
|
+
return;
|
|
10507
10511
|
if (targetFilterBarRef.current && selectedFilter) {
|
|
10508
10512
|
window.scrollTo({
|
|
10509
10513
|
behavior: 'smooth',
|
|
@@ -10523,8 +10527,9 @@ function FilterBar(_a) {
|
|
|
10523
10527
|
React__default__default.createElement(SubmitButton, { label: t('tabs.rooms'), onClick: function () { return setSelectedPath('/rooms'); }, active: selectedPath === '/rooms' })),
|
|
10524
10528
|
React__default__default.createElement("div", { className: "will-filter-bar-header" },
|
|
10525
10529
|
React__default__default.createElement(SelectButton, { label: 'When', description: 'Add Check-in and -out', onClick: function () { return handleSelectedFilter(1); }, style: fontWeightBold(selectedFilter === 1) }),
|
|
10526
|
-
React__default__default.createElement(
|
|
10527
|
-
|
|
10530
|
+
selectedPath === '/rooms' && (React__default__default.createElement(React__default__default.Fragment, null,
|
|
10531
|
+
React__default__default.createElement(Divider, null),
|
|
10532
|
+
React__default__default.createElement(SelectButton, { label: 'Who', description: 'Add Guests', onClick: function () { return handleSelectedFilter(2); }, style: fontWeightBold(selectedFilter === 2) }))),
|
|
10528
10533
|
React__default__default.createElement(SubmitButton$1, { onClick: handleSubmit })),
|
|
10529
10534
|
selectedFilter && (React__default__default.createElement("div", { className: "will-filter-bar-container" },
|
|
10530
10535
|
React__default__default.createElement(CloseButton, { handleClose: function () { return handleSelectedFilter(false); } }),
|