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.js
CHANGED
|
@@ -7964,7 +7964,7 @@ function GuestCount(_a) {
|
|
|
7964
7964
|
React__default.createElement("button", { className: "will-guests-filter-counter-button", onClick: handleIncrement }, "+"))));
|
|
7965
7965
|
}
|
|
7966
7966
|
|
|
7967
|
-
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
|
|
7967
|
+
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}";
|
|
7968
7968
|
styleInject(css_248z$5);
|
|
7969
7969
|
|
|
7970
7970
|
function Guests(_a) {
|
|
@@ -8048,7 +8048,6 @@ function useFilterBar(_a) {
|
|
|
8048
8048
|
var _e = React__default.useState(0), categories = _e[0], setCategories = _e[1];
|
|
8049
8049
|
var _f = React__default.useState({}), ageCategoryCounts = _f[0], setAgeCategoryCounts = _f[1];
|
|
8050
8050
|
var updateGuestsCount = function (id, newCount) {
|
|
8051
|
-
console.log(ageCategoryCounts);
|
|
8052
8051
|
setAgeCategoryCounts(function (prevCounts) {
|
|
8053
8052
|
var _a;
|
|
8054
8053
|
return (__assign(__assign({}, prevCounts), (_a = {}, _a[id] = newCount, _a)));
|
|
@@ -8092,7 +8091,10 @@ function useFilterBar(_a) {
|
|
|
8092
8091
|
handleSelectedFilter(false);
|
|
8093
8092
|
};
|
|
8094
8093
|
React__default.useEffect(function () {
|
|
8095
|
-
|
|
8094
|
+
if (typeof window === 'undefined')
|
|
8095
|
+
return;
|
|
8096
|
+
document.body.style.overflow =
|
|
8097
|
+
selectedFilter && window.innerWidth < 960 ? 'hidden' : 'visible';
|
|
8096
8098
|
return function () {
|
|
8097
8099
|
document.body.style.overflow = 'visible';
|
|
8098
8100
|
};
|
|
@@ -8131,7 +8133,7 @@ function useFilterBar(_a) {
|
|
|
8131
8133
|
};
|
|
8132
8134
|
}
|
|
8133
8135
|
|
|
8134
|
-
var css_248z$3 = ".will-root {\n z-index: 99999;\n width: 100%;\n max-height: 100vh;\n position: relative;\n
|
|
8136
|
+
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";
|
|
8135
8137
|
styleInject(css_248z$3);
|
|
8136
8138
|
|
|
8137
8139
|
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}";
|
|
@@ -10524,6 +10526,8 @@ function FilterBar(_a) {
|
|
|
10524
10526
|
// Scroll in to view
|
|
10525
10527
|
var targetFilterBarRef = React__default.useRef(null);
|
|
10526
10528
|
React__default.useEffect(function () {
|
|
10529
|
+
if (window !== undefined && window.innerWidth > 960)
|
|
10530
|
+
return;
|
|
10527
10531
|
if (targetFilterBarRef.current && selectedFilter) {
|
|
10528
10532
|
window.scrollTo({
|
|
10529
10533
|
behavior: 'smooth',
|