willba-component-library 0.0.40 → 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 +51 -4
- package/lib/index.esm.js.map +1 -1
- package/lib/index.js +51 -4
- package/lib/index.js.map +1 -1
- package/lib/index.umd.js +51 -4
- package/lib/index.umd.js.map +1 -1
- package/lib/themes/useTheme.d.ts +2 -1
- package/package.json +1 -1
- package/rollup.config.mjs +3 -0
- package/src/components/FilterBar/FilterBar.tsx +2 -4
- package/src/themes/useTheme.tsx +50 -22
- package/src/themes/cssModules.d.ts +0 -5
package/lib/index.js
CHANGED
|
@@ -6078,6 +6078,54 @@ function useFilterBar() {
|
|
|
6078
6078
|
};
|
|
6079
6079
|
}
|
|
6080
6080
|
|
|
6081
|
+
// import React, { useEffect, useState } from 'react'
|
|
6082
|
+
// type ThemeProps = {
|
|
6083
|
+
// vendor?: string
|
|
6084
|
+
// }
|
|
6085
|
+
// export default function useTheme({ vendor }: ThemeProps) {
|
|
6086
|
+
// const [cssLoaded, setCssLoaded] = useState(false)
|
|
6087
|
+
// useEffect(() => {
|
|
6088
|
+
// async function loadThemeCSS() {
|
|
6089
|
+
// try {
|
|
6090
|
+
// let cssUrl = ''
|
|
6091
|
+
// if (vendor === 'Kisakallio') {
|
|
6092
|
+
// cssUrl = './Kisakallio.css'
|
|
6093
|
+
// } else if (vendor === 'Pajulahti') {
|
|
6094
|
+
// cssUrl = './Pajulahti.css'
|
|
6095
|
+
// } else {
|
|
6096
|
+
// cssUrl = './Default.css'
|
|
6097
|
+
// }
|
|
6098
|
+
// await loadCSS(cssUrl)
|
|
6099
|
+
// setCssLoaded(true)
|
|
6100
|
+
// } catch (error) {
|
|
6101
|
+
// console.error('Error loading CSS:', error)
|
|
6102
|
+
// }
|
|
6103
|
+
// }
|
|
6104
|
+
// loadThemeCSS()
|
|
6105
|
+
// }, [vendor])
|
|
6106
|
+
// return cssLoaded
|
|
6107
|
+
// }
|
|
6108
|
+
function MyComponent(_a) {
|
|
6109
|
+
var vendor = _a.vendor;
|
|
6110
|
+
React__default.useEffect(function () {
|
|
6111
|
+
if (vendor === 'Kisakallio') {
|
|
6112
|
+
addCSSFile('./Kisakallio.css');
|
|
6113
|
+
}
|
|
6114
|
+
else {
|
|
6115
|
+
addCSSFile('./Default.css');
|
|
6116
|
+
}
|
|
6117
|
+
}, [vendor]);
|
|
6118
|
+
// Rest of your component code
|
|
6119
|
+
return React__default.createElement("div", null, "My Component");
|
|
6120
|
+
}
|
|
6121
|
+
var addCSSFile = function (href) {
|
|
6122
|
+
var link = document.createElement('link');
|
|
6123
|
+
link.rel = 'stylesheet';
|
|
6124
|
+
link.type = 'text/css';
|
|
6125
|
+
link.href = href;
|
|
6126
|
+
document.head.appendChild(link);
|
|
6127
|
+
};
|
|
6128
|
+
|
|
6081
6129
|
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}";
|
|
6082
6130
|
styleInject(css_248z$1);
|
|
6083
6131
|
|
|
@@ -8411,8 +8459,8 @@ instance.use(initReactI18next).init({
|
|
|
8411
8459
|
});
|
|
8412
8460
|
|
|
8413
8461
|
function FilterBar(_a) {
|
|
8414
|
-
|
|
8415
|
-
|
|
8462
|
+
var vendor = _a.vendor, language = _a.language;
|
|
8463
|
+
var cssLoaded = MyComponent({ vendor: vendor });
|
|
8416
8464
|
var _b = React__default.useState(0); _b[0]; var setRerenderKey = _b[1];
|
|
8417
8465
|
React__default.useEffect(function () {
|
|
8418
8466
|
instance.changeLanguage(language);
|
|
@@ -8420,9 +8468,8 @@ function FilterBar(_a) {
|
|
|
8420
8468
|
setRerenderKey(function (prevKey) { return prevKey + 1; });
|
|
8421
8469
|
}, [language]);
|
|
8422
8470
|
var t = useTranslation('filterBar').t;
|
|
8423
|
-
console.log(language, t('calendar.startDate'));
|
|
8424
8471
|
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;
|
|
8425
|
-
return (React__default.createElement("div", { className: "filter-bar" },
|
|
8472
|
+
return (React__default.createElement("div", { className: "filter-bar ".concat(cssLoaded ? 'dynamic-theme-class' : '') },
|
|
8426
8473
|
React__default.createElement("div", { className: "filter-bar-header" },
|
|
8427
8474
|
React__default.createElement(SelectButton, { label: t('calendar.startDate'), onClick: function () { return handleSelectedFilter(1); } }),
|
|
8428
8475
|
React__default.createElement(Divider, null),
|