willba-component-library 0.0.41 → 0.0.42
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 +65 -131
- package/lib/index.esm.js.map +1 -1
- package/lib/index.js +65 -131
- package/lib/index.js.map +1 -1
- package/lib/index.umd.js +65 -131
- package/lib/index.umd.js.map +1 -1
- package/lib/themes/useTheme.d.ts +2 -1
- package/package.json +1 -1
- package/src/components/FilterBar/FilterBar.tsx +2 -2
- package/src/themes/useTheme.tsx +50 -17
- package/src/themes/cssModules.d.ts +0 -5
package/lib/index.esm.js
CHANGED
|
@@ -94,8 +94,8 @@ function styleInject(css, ref) {
|
|
|
94
94
|
}
|
|
95
95
|
}
|
|
96
96
|
|
|
97
|
-
var css_248z$
|
|
98
|
-
styleInject(css_248z$
|
|
97
|
+
var css_248z$9 = ".storybook-button {\r\n font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;\r\n font-weight: 700;\r\n border: 0;\r\n border-radius: 3em;\r\n cursor: pointer;\r\n display: inline-block;\r\n line-height: 1;\r\n}\r\n.storybook-button--primary {\r\n color: white;\r\n background-color: #1ea7fd;\r\n}\r\n.storybook-button--secondary {\r\n color: #333;\r\n background-color: transparent;\r\n box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 0px 1px inset;\r\n}\r\n.storybook-button--small {\r\n font-size: 12px;\r\n padding: 10px 16px;\r\n}\r\n.storybook-button--medium {\r\n font-size: 14px;\r\n padding: 11px 20px;\r\n}\r\n.storybook-button--large {\r\n font-size: 16px;\r\n padding: 12px 24px;\r\n}";
|
|
98
|
+
styleInject(css_248z$9);
|
|
99
99
|
|
|
100
100
|
/**
|
|
101
101
|
* Primary UI component for user interaction
|
|
@@ -365,23 +365,23 @@ function useTranslation(ns) {
|
|
|
365
365
|
});
|
|
366
366
|
}
|
|
367
367
|
|
|
368
|
-
var css_248z$
|
|
369
|
-
styleInject(css_248z$
|
|
368
|
+
var css_248z$8 = ".filter-bar-divider {\n width: 1px;\n margin: 0 10px;\n height: 35px;\n background-color: #384265;\n}";
|
|
369
|
+
styleInject(css_248z$8);
|
|
370
370
|
|
|
371
371
|
function Divider() {
|
|
372
372
|
return React__default__default.createElement("div", { className: "filter-bar-divider" });
|
|
373
373
|
}
|
|
374
374
|
|
|
375
|
-
var css_248z$
|
|
376
|
-
styleInject(css_248z$
|
|
375
|
+
var css_248z$7 = ".filter-bar-select-button {\n width: 100%;\n height: auto;\n background-color: transparent;\n border: none;\n padding: 10px 20px;\n border-radius: 20px;\n cursor: pointer;\n}\n";
|
|
376
|
+
styleInject(css_248z$7);
|
|
377
377
|
|
|
378
378
|
function SelectButton(_a) {
|
|
379
379
|
var label = _a.label, onClick = _a.onClick;
|
|
380
380
|
return (React__default__default.createElement("button", { className: "filter-bar-select-button", onClick: onClick }, label));
|
|
381
381
|
}
|
|
382
382
|
|
|
383
|
-
var css_248z$
|
|
384
|
-
styleInject(css_248z$
|
|
383
|
+
var css_248z$6 = ".filter-bar-submit-button {\n width: auto;\n height: auto;\n background-color: #384265;\n color: #fff;\n padding: 10px 20px;\n border-radius: 20px;\n cursor: pointer;\n border: none;\n white-space: nowrap;\n}";
|
|
384
|
+
styleInject(css_248z$6);
|
|
385
385
|
|
|
386
386
|
function SubmitButton(_a) {
|
|
387
387
|
var onClick = _a.onClick;
|
|
@@ -5943,11 +5943,11 @@ function DayPicker(props) {
|
|
|
5943
5943
|
React__default__default.createElement(Root, { initialProps: props })));
|
|
5944
5944
|
}
|
|
5945
5945
|
|
|
5946
|
-
var css_248z$
|
|
5947
|
-
styleInject(css_248z$
|
|
5946
|
+
var css_248z$5 = ".rdp {\n --rdp-cell-size: 40px;\n --rdp-caption-font-size: 18px;\n --rdp-accent-color: #0000ff;\n --rdp-background-color: #e7edff;\n --rdp-accent-color-dark: #3003e1;\n --rdp-background-color-dark: #180270;\n --rdp-outline: 2px solid var(--rdp-accent-color); /* Outline border for focused elements */\n --rdp-outline-selected: 3px solid var(--rdp-accent-color); /* Outline border for focused _and_ selected elements */\n\n margin: 1em;\n}\n\n/* Hide elements for devices that are not screen readers */\n.rdp-vhidden {\n box-sizing: border-box;\n padding: 0;\n margin: 0;\n background: transparent;\n border: 0;\n -moz-appearance: none;\n -webkit-appearance: none;\n appearance: none;\n position: absolute !important;\n top: 0;\n width: 1px !important;\n height: 1px !important;\n padding: 0 !important;\n overflow: hidden !important;\n clip: rect(1px, 1px, 1px, 1px) !important;\n border: 0 !important;\n}\n\n/* Buttons */\n.rdp-button_reset {\n appearance: none;\n position: relative;\n margin: 0;\n padding: 0;\n cursor: default;\n color: inherit;\n background: none;\n font: inherit;\n\n -moz-appearance: none;\n -webkit-appearance: none;\n}\n\n.rdp-button_reset:focus-visible {\n /* Make sure to reset outline only when :focus-visible is supported */\n outline: none;\n}\n\n.rdp-button {\n border: 2px solid transparent;\n}\n\n.rdp-button[disabled]:not(.rdp-day_selected) {\n opacity: 0.25;\n}\n\n.rdp-button:not([disabled]) {\n cursor: pointer;\n}\n\n.rdp-button:focus-visible:not([disabled]) {\n color: inherit;\n background-color: var(--rdp-background-color);\n border: var(--rdp-outline);\n}\n\n.rdp-button:hover:not([disabled]):not(.rdp-day_selected) {\n background-color: var(--rdp-background-color);\n}\n\n.rdp-months {\n display: flex;\n}\n\n.rdp-month {\n margin: 0 1em;\n}\n\n.rdp-month:first-child {\n margin-left: 0;\n}\n\n.rdp-month:last-child {\n margin-right: 0;\n}\n\n.rdp-table {\n margin: 0;\n max-width: calc(var(--rdp-cell-size) * 7);\n border-collapse: collapse;\n}\n\n.rdp-with_weeknumber .rdp-table {\n max-width: calc(var(--rdp-cell-size) * 8);\n border-collapse: collapse;\n}\n\n.rdp-caption {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0;\n text-align: left;\n}\n\n.rdp-multiple_months .rdp-caption {\n position: relative;\n display: block;\n text-align: center;\n}\n\n.rdp-caption_dropdowns {\n position: relative;\n display: inline-flex;\n}\n\n.rdp-caption_label {\n position: relative;\n z-index: 1;\n display: inline-flex;\n align-items: center;\n margin: 0;\n padding: 0 0.25em;\n white-space: nowrap;\n color: currentColor;\n border: 0;\n border: 2px solid transparent;\n font-family: inherit;\n font-size: var(--rdp-caption-font-size);\n font-weight: bold;\n}\n\n.rdp-nav {\n white-space: nowrap;\n}\n\n.rdp-multiple_months .rdp-caption_start .rdp-nav {\n position: absolute;\n top: 50%;\n left: 0;\n transform: translateY(-50%);\n}\n\n.rdp-multiple_months .rdp-caption_end .rdp-nav {\n position: absolute;\n top: 50%;\n right: 0;\n transform: translateY(-50%);\n}\n\n.rdp-nav_button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: var(--rdp-cell-size);\n height: var(--rdp-cell-size);\n padding: 0.25em;\n border-radius: 100%;\n}\n\n/* ---------- */\n/* Dropdowns */\n/* ---------- */\n\n.rdp-dropdown_year,\n.rdp-dropdown_month {\n position: relative;\n display: inline-flex;\n align-items: center;\n}\n\n.rdp-dropdown {\n appearance: none;\n position: absolute;\n z-index: 2;\n top: 0;\n bottom: 0;\n left: 0;\n width: 100%;\n margin: 0;\n padding: 0;\n cursor: inherit;\n opacity: 0;\n border: none;\n background-color: transparent;\n font-family: inherit;\n font-size: inherit;\n line-height: inherit;\n}\n\n.rdp-dropdown[disabled] {\n opacity: unset;\n color: unset;\n}\n\n.rdp-dropdown:focus-visible:not([disabled]) + .rdp-caption_label {\n background-color: var(--rdp-background-color);\n border: var(--rdp-outline);\n border-radius: 6px;\n}\n\n.rdp-dropdown_icon {\n margin: 0 0 0 5px;\n}\n\n.rdp-head {\n border: 0;\n}\n\n.rdp-head_row,\n.rdp-row {\n height: 100%;\n}\n\n.rdp-head_cell {\n vertical-align: middle;\n font-size: 0.75em;\n font-weight: 700;\n text-align: center;\n height: 100%;\n height: var(--rdp-cell-size);\n padding: 0;\n text-transform: uppercase;\n}\n\n.rdp-tbody {\n border: 0;\n}\n\n.rdp-tfoot {\n margin: 0.5em;\n}\n\n.rdp-cell {\n width: var(--rdp-cell-size);\n height: 100%;\n height: var(--rdp-cell-size);\n padding: 0;\n text-align: center;\n}\n\n.rdp-weeknumber {\n font-size: 0.75em;\n}\n\n.rdp-weeknumber,\n.rdp-day {\n display: flex;\n overflow: hidden;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n width: var(--rdp-cell-size);\n max-width: var(--rdp-cell-size);\n height: var(--rdp-cell-size);\n margin: 0;\n border: 2px solid transparent;\n border-radius: 100%;\n}\n\n.rdp-day_today:not(.rdp-day_outside) {\n font-weight: bold;\n}\n\n.rdp-day_selected,\n.rdp-day_selected:focus-visible,\n.rdp-day_selected:hover {\n color: white;\n opacity: 1;\n background-color: var(--rdp-accent-color);\n}\n\n.rdp-day_outside {\n opacity: 0.5;\n}\n\n.rdp-day_selected:focus-visible {\n /* Since the background is the same use again the outline */\n outline: var(--rdp-outline);\n outline-offset: 2px;\n z-index: 1;\n}\n\n.rdp:not([dir='rtl']) .rdp-day_range_start:not(.rdp-day_range_end) {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n}\n\n.rdp:not([dir='rtl']) .rdp-day_range_end:not(.rdp-day_range_start) {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n}\n\n.rdp[dir='rtl'] .rdp-day_range_start:not(.rdp-day_range_end) {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n}\n\n.rdp[dir='rtl'] .rdp-day_range_end:not(.rdp-day_range_start) {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n}\n\n.rdp-day_range_end.rdp-day_range_start {\n border-radius: 100%;\n}\n\n.rdp-day_range_middle {\n border-radius: 0;\n}";
|
|
5947
|
+
styleInject(css_248z$5);
|
|
5948
5948
|
|
|
5949
|
-
var css_248z$
|
|
5950
|
-
styleInject(css_248z$
|
|
5949
|
+
var css_248z$4 = ".filter-bar-calendar {\n display: flex;\n justify-content: center;\n}";
|
|
5950
|
+
styleInject(css_248z$4);
|
|
5951
5951
|
|
|
5952
5952
|
var currentMonth = new Date();
|
|
5953
5953
|
function Calendar(_a) {
|
|
@@ -5964,8 +5964,8 @@ function Calendar(_a) {
|
|
|
5964
5964
|
React__default__default.createElement(DayPicker, { id: "test", mode: "range", numberOfMonths: 2, defaultMonth: currentMonth, selected: calendarRange, onSelect: setCalendarRange })));
|
|
5965
5965
|
}
|
|
5966
5966
|
|
|
5967
|
-
var css_248z$
|
|
5968
|
-
styleInject(css_248z$
|
|
5967
|
+
var css_248z$3 = ".filter-bar-guests {\n text-align: initial;\n}\n\n.guests-filter-container {\n display: flex;\n margin-top: 30px;\n}\n\n.guests-filter-inner {\n display: flex;\n align-items: center;\n}\n\n.guests-filter-inner:not(:last-child) {\n margin-right: 50px;\n}\n\n.guests-filter-inner > span {\n display: block;\n margin-right: 20px;\n font-weight: bold;\n}\n\n.guests-filter-inner > div {\n display: flex;\n align-items: center;\n}\n\n.guests-filter-inner > div > span {\n margin: 0 10px;\n}\n\n.guests-filter-inner > div button {\n border-radius: 50%;\n border: none;\n background-color: #CDEEFF;\n width: 25px;\n height: 25px;\n display: flex;\n justify-content: center;\n align-items: center;\n font-size: 20px;\n}";
|
|
5968
|
+
styleInject(css_248z$3);
|
|
5969
5969
|
|
|
5970
5970
|
function Guests(_a) {
|
|
5971
5971
|
var guestsAdults = _a.guestsAdults, guestsKids = _a.guestsKids, decrementAdults = _a.decrementAdults, incrementAdults = _a.incrementAdults, decrementKids = _a.decrementKids, incrementKids = _a.incrementKids;
|
|
@@ -5988,8 +5988,8 @@ function Guests(_a) {
|
|
|
5988
5988
|
React__default__default.createElement("button", { onClick: incrementKids }, "+"))))));
|
|
5989
5989
|
}
|
|
5990
5990
|
|
|
5991
|
-
var css_248z$
|
|
5992
|
-
styleInject(css_248z$
|
|
5991
|
+
var css_248z$2 = ".filter-bar-categories {\n text-align: center;\n}\n\n.categories-filter-inner {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 20px;\n}\n\n.categories-filter-inner input {\n cursor: pointer;\n margin-right: 10px;\n}\n";
|
|
5992
|
+
styleInject(css_248z$2);
|
|
5993
5993
|
|
|
5994
5994
|
function Categories(_a) {
|
|
5995
5995
|
_a.categories; var setCategories = _a.setCategories;
|
|
@@ -6058,105 +6058,59 @@ function useFilterBar() {
|
|
|
6058
6058
|
};
|
|
6059
6059
|
}
|
|
6060
6060
|
|
|
6061
|
-
|
|
6062
|
-
|
|
6063
|
-
|
|
6064
|
-
|
|
6065
|
-
|
|
6066
|
-
|
|
6067
|
-
|
|
6068
|
-
|
|
6069
|
-
|
|
6070
|
-
|
|
6071
|
-
|
|
6072
|
-
|
|
6073
|
-
|
|
6074
|
-
|
|
6075
|
-
|
|
6076
|
-
|
|
6077
|
-
|
|
6078
|
-
|
|
6079
|
-
|
|
6080
|
-
|
|
6081
|
-
|
|
6082
|
-
|
|
6083
|
-
|
|
6084
|
-
|
|
6085
|
-
|
|
6086
|
-
|
|
6087
|
-
|
|
6088
|
-
function
|
|
6089
|
-
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
|
|
6090
|
-
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
|
|
6091
|
-
function verb(n) { return function (v) { return step([n, v]); }; }
|
|
6092
|
-
function step(op) {
|
|
6093
|
-
if (f) throw new TypeError("Generator is already executing.");
|
|
6094
|
-
while (g && (g = 0, op[0] && (_ = 0)), _) try {
|
|
6095
|
-
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
|
|
6096
|
-
if (y = 0, t) op = [op[0] & 2, t.value];
|
|
6097
|
-
switch (op[0]) {
|
|
6098
|
-
case 0: case 1: t = op; break;
|
|
6099
|
-
case 4: _.label++; return { value: op[1], done: false };
|
|
6100
|
-
case 5: _.label++; y = op[1]; op = [0]; continue;
|
|
6101
|
-
case 7: op = _.ops.pop(); _.trys.pop(); continue;
|
|
6102
|
-
default:
|
|
6103
|
-
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
|
|
6104
|
-
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
|
|
6105
|
-
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
|
|
6106
|
-
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
|
|
6107
|
-
if (t[2]) _.ops.pop();
|
|
6108
|
-
_.trys.pop(); continue;
|
|
6109
|
-
}
|
|
6110
|
-
op = body.call(thisArg, _);
|
|
6111
|
-
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
|
|
6112
|
-
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
|
6113
|
-
}
|
|
6114
|
-
}
|
|
6115
|
-
|
|
6116
|
-
typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
|
|
6117
|
-
var e = new Error(message);
|
|
6118
|
-
return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
|
|
6119
|
-
};
|
|
6120
|
-
|
|
6121
|
-
function useTheme(_a) {
|
|
6061
|
+
// import React, { useEffect, useState } from 'react'
|
|
6062
|
+
// type ThemeProps = {
|
|
6063
|
+
// vendor?: string
|
|
6064
|
+
// }
|
|
6065
|
+
// export default function useTheme({ vendor }: ThemeProps) {
|
|
6066
|
+
// const [cssLoaded, setCssLoaded] = useState(false)
|
|
6067
|
+
// useEffect(() => {
|
|
6068
|
+
// async function loadThemeCSS() {
|
|
6069
|
+
// try {
|
|
6070
|
+
// let cssUrl = ''
|
|
6071
|
+
// if (vendor === 'Kisakallio') {
|
|
6072
|
+
// cssUrl = './Kisakallio.css'
|
|
6073
|
+
// } else if (vendor === 'Pajulahti') {
|
|
6074
|
+
// cssUrl = './Pajulahti.css'
|
|
6075
|
+
// } else {
|
|
6076
|
+
// cssUrl = './Default.css'
|
|
6077
|
+
// }
|
|
6078
|
+
// await loadCSS(cssUrl)
|
|
6079
|
+
// setCssLoaded(true)
|
|
6080
|
+
// } catch (error) {
|
|
6081
|
+
// console.error('Error loading CSS:', error)
|
|
6082
|
+
// }
|
|
6083
|
+
// }
|
|
6084
|
+
// loadThemeCSS()
|
|
6085
|
+
// }, [vendor])
|
|
6086
|
+
// return cssLoaded
|
|
6087
|
+
// }
|
|
6088
|
+
function MyComponent(_a) {
|
|
6122
6089
|
var vendor = _a.vendor;
|
|
6123
|
-
var _b = useState(null), cssModule = _b[0], setCssModule = _b[1];
|
|
6124
6090
|
useEffect(function () {
|
|
6125
|
-
|
|
6126
|
-
|
|
6127
|
-
|
|
6128
|
-
|
|
6129
|
-
|
|
6130
|
-
case 0:
|
|
6131
|
-
if (!(vendor === 'Kisakallio')) return [3 /*break*/, 2];
|
|
6132
|
-
return [4 /*yield*/, Promise.resolve().then(function () { return Kisakallio; })];
|
|
6133
|
-
case 1:
|
|
6134
|
-
kisakallioCss = _a.sent();
|
|
6135
|
-
setCssModule(kisakallioCss.default);
|
|
6136
|
-
return [3 /*break*/, 5];
|
|
6137
|
-
case 2:
|
|
6138
|
-
if (!(vendor === 'Pajulahti')) return [3 /*break*/, 4];
|
|
6139
|
-
return [4 /*yield*/, Promise.resolve().then(function () { return Pajulahti; })];
|
|
6140
|
-
case 3:
|
|
6141
|
-
pajulahtiCss = _a.sent();
|
|
6142
|
-
setCssModule(pajulahtiCss.default);
|
|
6143
|
-
return [3 /*break*/, 5];
|
|
6144
|
-
case 4: return [2 /*return*/];
|
|
6145
|
-
case 5: return [2 /*return*/];
|
|
6146
|
-
}
|
|
6147
|
-
});
|
|
6148
|
-
});
|
|
6091
|
+
if (vendor === 'Kisakallio') {
|
|
6092
|
+
addCSSFile('./Kisakallio.css');
|
|
6093
|
+
}
|
|
6094
|
+
else {
|
|
6095
|
+
addCSSFile('./Default.css');
|
|
6149
6096
|
}
|
|
6150
|
-
importCss();
|
|
6151
6097
|
}, [vendor]);
|
|
6152
|
-
|
|
6153
|
-
|
|
6098
|
+
// Rest of your component code
|
|
6099
|
+
return React__default__default.createElement("div", null, "My Component");
|
|
6100
|
+
}
|
|
6101
|
+
var addCSSFile = function (href) {
|
|
6102
|
+
var link = document.createElement('link');
|
|
6103
|
+
link.rel = 'stylesheet';
|
|
6104
|
+
link.type = 'text/css';
|
|
6105
|
+
link.href = href;
|
|
6106
|
+
document.head.appendChild(link);
|
|
6107
|
+
};
|
|
6154
6108
|
|
|
6155
|
-
var css_248z$
|
|
6156
|
-
styleInject(css_248z$
|
|
6109
|
+
var css_248z$1 = ".filter-bar {\r\n box-sizing: border-box;\r\n max-width: 1100px;\r\n position: relative;\r\n}\r\n\r\n.filter-bar-header {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n padding: 10px 20px;\r\n position: relative;\r\n z-index: 222;\r\n \r\n border-radius: 40px;\r\n background-color: #fff;\r\n box-shadow: 0px 6px 11px 0px #a7a4a480;\r\n}\r\n\r\n.filter-bar-container {\r\n background-color: #fff;\r\n min-height: 100px;\r\n \r\n padding: 90px 40px 30px 40px;\r\n position: absolute;\r\n top: 0;\r\n z-index: 111;\r\n border-radius: 40px;\r\n width: -webkit-fill-available;\r\n box-shadow: var(--box-shadow);\r\n}";
|
|
6110
|
+
styleInject(css_248z$1);
|
|
6157
6111
|
|
|
6158
|
-
var css_248z
|
|
6159
|
-
styleInject(css_248z
|
|
6112
|
+
var css_248z = ":root {\n --primary-color: #3498db;\n --font-size: 16px;\n --box-shadow: 0px 6px 11px 0px #a7a4a480\n}\n\n* {\n box-sizing: border-box;\n}\n\nhtml {\n background-color: aqua;\n}";
|
|
6113
|
+
styleInject(css_248z);
|
|
6160
6114
|
|
|
6161
6115
|
const consoleLogger = {
|
|
6162
6116
|
type: 'logger',
|
|
@@ -8486,7 +8440,7 @@ instance.use(initReactI18next).init({
|
|
|
8486
8440
|
|
|
8487
8441
|
function FilterBar(_a) {
|
|
8488
8442
|
var vendor = _a.vendor, language = _a.language;
|
|
8489
|
-
|
|
8443
|
+
var cssLoaded = MyComponent({ vendor: vendor });
|
|
8490
8444
|
var _b = useState(0); _b[0]; var setRerenderKey = _b[1];
|
|
8491
8445
|
useEffect(function () {
|
|
8492
8446
|
instance.changeLanguage(language);
|
|
@@ -8495,7 +8449,7 @@ function FilterBar(_a) {
|
|
|
8495
8449
|
}, [language]);
|
|
8496
8450
|
var t = useTranslation('filterBar').t;
|
|
8497
8451
|
var _c = useFilterBar(), selectedFilter = _c.selectedFilter, guestsAdults = _c.guestsAdults, guestsKids = _c.guestsKids, categories = _c.categories, calendarRange = _c.calendarRange, setCalendarRange = _c.setCalendarRange, setGuestsAdults = _c.setGuestsAdults, setGuestsKids = _c.setGuestsKids, setCategories = _c.setCategories, handleSelectedFilter = _c.handleSelectedFilter, handleSubmit = _c.handleSubmit;
|
|
8498
|
-
return (React__default__default.createElement("div", { className: "filter-bar" },
|
|
8452
|
+
return (React__default__default.createElement("div", { className: "filter-bar ".concat(cssLoaded ? 'dynamic-theme-class' : '') },
|
|
8499
8453
|
React__default__default.createElement("div", { className: "filter-bar-header" },
|
|
8500
8454
|
React__default__default.createElement(SelectButton, { label: t('calendar.startDate'), onClick: function () { return handleSelectedFilter(1); } }),
|
|
8501
8455
|
React__default__default.createElement(Divider, null),
|
|
@@ -8511,25 +8465,5 @@ function FilterBar(_a) {
|
|
|
8511
8465
|
selectedFilter === 4 && (React__default__default.createElement(Categories, { categories: categories, setCategories: setCategories }))))));
|
|
8512
8466
|
}
|
|
8513
8467
|
|
|
8514
|
-
var css_248z$1 = "html {\n background-color: blue;\n}";
|
|
8515
|
-
var stylesheet$1="html {\n background-color: blue;\n}";
|
|
8516
|
-
styleInject(css_248z$1);
|
|
8517
|
-
|
|
8518
|
-
var Kisakallio = /*#__PURE__*/Object.freeze({
|
|
8519
|
-
__proto__: null,
|
|
8520
|
-
default: css_248z$1,
|
|
8521
|
-
stylesheet: stylesheet$1
|
|
8522
|
-
});
|
|
8523
|
-
|
|
8524
|
-
var css_248z = "html {\n background-color: red;\n}";
|
|
8525
|
-
var stylesheet="html {\n background-color: red;\n}";
|
|
8526
|
-
styleInject(css_248z);
|
|
8527
|
-
|
|
8528
|
-
var Pajulahti = /*#__PURE__*/Object.freeze({
|
|
8529
|
-
__proto__: null,
|
|
8530
|
-
default: css_248z,
|
|
8531
|
-
stylesheet: stylesheet
|
|
8532
|
-
});
|
|
8533
|
-
|
|
8534
8468
|
export { Button$1 as Button, FilterBar };
|
|
8535
8469
|
//# sourceMappingURL=index.esm.js.map
|