willba-component-library 0.1.25 → 0.1.27
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 +8 -4
- package/lib/index.esm.js.map +1 -1
- package/lib/index.js +8 -4
- package/lib/index.js.map +1 -1
- package/lib/index.umd.js +8 -4
- 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 +1 -0
- package/src/components/FilterBar/components/guests/Guests.css +0 -2
- package/src/components/FilterBar/hooks/useFilterBar.tsx +5 -3
package/lib/index.umd.js
CHANGED
|
@@ -7966,7 +7966,7 @@
|
|
|
7966
7966
|
React__default.createElement("button", { className: "will-guests-filter-counter-button", onClick: handleIncrement }, "+"))));
|
|
7967
7967
|
}
|
|
7968
7968
|
|
|
7969
|
-
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
|
|
7969
|
+
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}";
|
|
7970
7970
|
styleInject(css_248z$5);
|
|
7971
7971
|
|
|
7972
7972
|
function Guests(_a) {
|
|
@@ -8050,7 +8050,6 @@
|
|
|
8050
8050
|
var _e = React__default.useState(0), categories = _e[0], setCategories = _e[1];
|
|
8051
8051
|
var _f = React__default.useState({}), ageCategoryCounts = _f[0], setAgeCategoryCounts = _f[1];
|
|
8052
8052
|
var updateGuestsCount = function (id, newCount) {
|
|
8053
|
-
console.log(ageCategoryCounts);
|
|
8054
8053
|
setAgeCategoryCounts(function (prevCounts) {
|
|
8055
8054
|
var _a;
|
|
8056
8055
|
return (__assign(__assign({}, prevCounts), (_a = {}, _a[id] = newCount, _a)));
|
|
@@ -8094,7 +8093,10 @@
|
|
|
8094
8093
|
handleSelectedFilter(false);
|
|
8095
8094
|
};
|
|
8096
8095
|
React__default.useEffect(function () {
|
|
8097
|
-
|
|
8096
|
+
if (typeof window === 'undefined')
|
|
8097
|
+
return;
|
|
8098
|
+
document.body.style.overflow =
|
|
8099
|
+
selectedFilter && window.innerWidth < 960 ? 'hidden' : 'visible';
|
|
8098
8100
|
return function () {
|
|
8099
8101
|
document.body.style.overflow = 'visible';
|
|
8100
8102
|
};
|
|
@@ -8133,7 +8135,7 @@
|
|
|
8133
8135
|
};
|
|
8134
8136
|
}
|
|
8135
8137
|
|
|
8136
|
-
var css_248z$3 = ".will-root {\n z-index: 99999;\n width: 100%;\n max-height: 100vh;\n position: relative;\n
|
|
8138
|
+
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";
|
|
8137
8139
|
styleInject(css_248z$3);
|
|
8138
8140
|
|
|
8139
8141
|
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}";
|
|
@@ -10526,6 +10528,8 @@
|
|
|
10526
10528
|
// Scroll in to view
|
|
10527
10529
|
var targetFilterBarRef = React__default.useRef(null);
|
|
10528
10530
|
React__default.useEffect(function () {
|
|
10531
|
+
if (window !== undefined && window.innerWidth > 960)
|
|
10532
|
+
return;
|
|
10529
10533
|
if (targetFilterBarRef.current && selectedFilter) {
|
|
10530
10534
|
window.scrollTo({
|
|
10531
10535
|
behavior: 'smooth',
|