willba-component-library 0.0.45 → 0.0.47
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 +28 -40
- package/lib/index.esm.js.map +1 -1
- package/lib/index.js +28 -40
- package/lib/index.js.map +1 -1
- package/lib/index.umd.js +28 -40
- package/lib/index.umd.js.map +1 -1
- package/lib/themes/useTheme.d.ts +1 -1
- package/package.json +1 -1
- package/src/components/FilterBar/FilterBar.tsx +53 -49
- package/src/components/FilterBar/components/guests/Guests.tsx +1 -1
- package/src/themes/Default.css +11 -1
- package/src/themes/useTheme.tsx +8 -27
- package/src/themes/Kisakallio.css +0 -3
- package/src/themes/Pajulahti.css +0 -3
package/lib/index.esm.js
CHANGED
|
@@ -5977,7 +5977,7 @@ function Guests(_a) {
|
|
|
5977
5977
|
React__default__default.createElement("div", { className: "guests-filter-inner" },
|
|
5978
5978
|
React__default__default.createElement("span", null, t('guests.adultsLabel')),
|
|
5979
5979
|
React__default__default.createElement("div", null,
|
|
5980
|
-
React__default__default.createElement("button", { onClick: decrementAdults, disabled: guestsAdults <
|
|
5980
|
+
React__default__default.createElement("button", { onClick: decrementAdults, disabled: guestsAdults < 2 }, "-"),
|
|
5981
5981
|
React__default__default.createElement("span", null, guestsAdults),
|
|
5982
5982
|
React__default__default.createElement("button", { onClick: incrementAdults }, "+"))),
|
|
5983
5983
|
React__default__default.createElement("div", { className: "guests-filter-inner" },
|
|
@@ -6012,6 +6012,16 @@ function Categories(_a) {
|
|
|
6012
6012
|
React__default__default.createElement("span", null, itm))); }))));
|
|
6013
6013
|
}
|
|
6014
6014
|
|
|
6015
|
+
function useTheme(_a) {
|
|
6016
|
+
var vendor = _a.vendor;
|
|
6017
|
+
var themeClass = vendor === 'Kisakallio'
|
|
6018
|
+
? 'will-root-kis'
|
|
6019
|
+
: vendor === 'Pajulahti'
|
|
6020
|
+
? 'will-root-paj'
|
|
6021
|
+
: '';
|
|
6022
|
+
return themeClass;
|
|
6023
|
+
}
|
|
6024
|
+
|
|
6015
6025
|
function useFilterBar() {
|
|
6016
6026
|
var _a = useState(false), selectedFilter = _a[0], setSelectedFilter = _a[1];
|
|
6017
6027
|
var _b = useState(), calendarRange = _b[0], setCalendarRange = _b[1];
|
|
@@ -6058,33 +6068,10 @@ function useFilterBar() {
|
|
|
6058
6068
|
};
|
|
6059
6069
|
}
|
|
6060
6070
|
|
|
6061
|
-
function useTheme(_a) {
|
|
6062
|
-
var vendor = _a.vendor;
|
|
6063
|
-
useEffect(function () {
|
|
6064
|
-
if (vendor === 'Kisakallio') {
|
|
6065
|
-
addCSSFile('https://cdn.jsdelivr.net/npm/willba-component-library@0.0.43/lib/themes/Kisakallio.css');
|
|
6066
|
-
}
|
|
6067
|
-
else if (vendor === 'Pajulahti') {
|
|
6068
|
-
addCSSFile('https://cdn.jsdelivr.net/npm/willba-component-library@0.0.43/lib/themes/Pajulahti.css');
|
|
6069
|
-
}
|
|
6070
|
-
else {
|
|
6071
|
-
addCSSFile('https://cdn.jsdelivr.net/npm/willba-component-library@0.0.43/lib/themes/Default.css');
|
|
6072
|
-
}
|
|
6073
|
-
}, [vendor]);
|
|
6074
|
-
return;
|
|
6075
|
-
}
|
|
6076
|
-
var addCSSFile = function (href) {
|
|
6077
|
-
var link = document.createElement('link');
|
|
6078
|
-
link.rel = 'stylesheet';
|
|
6079
|
-
link.type = 'text/css';
|
|
6080
|
-
link.href = href;
|
|
6081
|
-
document.head.appendChild(link);
|
|
6082
|
-
};
|
|
6083
|
-
|
|
6084
6071
|
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}";
|
|
6085
6072
|
styleInject(css_248z$1);
|
|
6086
6073
|
|
|
6087
|
-
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\
|
|
6074
|
+
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\n\n\n.will-root {\n background-color: aqua;\n}\n\n.will-root-kis {\n background-color: red;\n}\n\n.will-root-paj {\n background-color: blue;\n}";
|
|
6088
6075
|
styleInject(css_248z);
|
|
6089
6076
|
|
|
6090
6077
|
const consoleLogger = {
|
|
@@ -8415,7 +8402,7 @@ instance.use(initReactI18next).init({
|
|
|
8415
8402
|
|
|
8416
8403
|
function FilterBar(_a) {
|
|
8417
8404
|
var vendor = _a.vendor, language = _a.language;
|
|
8418
|
-
useTheme({ vendor: vendor });
|
|
8405
|
+
var themeClass = useTheme({ vendor: vendor });
|
|
8419
8406
|
var _b = useState(0); _b[0]; var setRerenderKey = _b[1];
|
|
8420
8407
|
useEffect(function () {
|
|
8421
8408
|
instance.changeLanguage(language);
|
|
@@ -8424,20 +8411,21 @@ function FilterBar(_a) {
|
|
|
8424
8411
|
}, [language]);
|
|
8425
8412
|
var t = useTranslation('filterBar').t;
|
|
8426
8413
|
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;
|
|
8427
|
-
return (React__default__default.createElement("div", { className: "
|
|
8428
|
-
React__default__default.createElement("div", { className: "filter-bar
|
|
8429
|
-
React__default__default.createElement(
|
|
8430
|
-
|
|
8431
|
-
|
|
8432
|
-
|
|
8433
|
-
|
|
8434
|
-
|
|
8435
|
-
|
|
8436
|
-
|
|
8437
|
-
|
|
8438
|
-
|
|
8439
|
-
|
|
8440
|
-
|
|
8414
|
+
return (React__default__default.createElement("div", { className: "will-root ".concat(themeClass) },
|
|
8415
|
+
React__default__default.createElement("div", { className: "filter-bar" },
|
|
8416
|
+
React__default__default.createElement("div", { className: "filter-bar-header" },
|
|
8417
|
+
React__default__default.createElement(SelectButton, { label: t('calendar.startDate'), onClick: function () { return handleSelectedFilter(1); } }),
|
|
8418
|
+
React__default__default.createElement(Divider, null),
|
|
8419
|
+
React__default__default.createElement(SelectButton, { label: t('calendar.endDate'), onClick: function () { return handleSelectedFilter(2); } }),
|
|
8420
|
+
React__default__default.createElement(Divider, null),
|
|
8421
|
+
React__default__default.createElement(SelectButton, { label: t('guests.label'), onClick: function () { return handleSelectedFilter(3); } }),
|
|
8422
|
+
React__default__default.createElement(Divider, null),
|
|
8423
|
+
React__default__default.createElement(SelectButton, { label: t('categories.label'), onClick: function () { return handleSelectedFilter(4); } }),
|
|
8424
|
+
React__default__default.createElement(SubmitButton, { onClick: handleSubmit })),
|
|
8425
|
+
selectedFilter && (React__default__default.createElement("div", { className: "filter-bar-container" },
|
|
8426
|
+
(selectedFilter === 1 || selectedFilter === 2) && (React__default__default.createElement(Calendar, { calendarRange: calendarRange, setCalendarRange: setCalendarRange })),
|
|
8427
|
+
selectedFilter === 3 && (React__default__default.createElement(Guests, { guestsAdults: guestsAdults, guestsKids: guestsKids, decrementAdults: function () { return setGuestsAdults(guestsAdults - 1); }, incrementAdults: function () { return setGuestsAdults(guestsAdults + 1); }, decrementKids: function () { return setGuestsKids(guestsKids - 1); }, incrementKids: function () { return setGuestsKids(guestsKids + 1); } })),
|
|
8428
|
+
selectedFilter === 4 && (React__default__default.createElement(Categories, { categories: categories, setCategories: setCategories })))))));
|
|
8441
8429
|
}
|
|
8442
8430
|
|
|
8443
8431
|
export { Button$1 as Button, FilterBar };
|