willba-component-library 0.0.40 → 0.0.42

package/lib/index.esm.js

@@ -6058,6 +6058,54 @@ function useFilterBar() {
     };
 }
 
+// import React, { useEffect, useState } from 'react'
+// type ThemeProps = {
+//   vendor?: string
+// }
+// export default function useTheme({ vendor }: ThemeProps) {
+//   const [cssLoaded, setCssLoaded] = useState(false)
+//   useEffect(() => {
+//     async function loadThemeCSS() {
+//       try {
+//         let cssUrl = ''
+//         if (vendor === 'Kisakallio') {
+//           cssUrl = './Kisakallio.css'
+//         } else if (vendor === 'Pajulahti') {
+//           cssUrl = './Pajulahti.css'
+//         } else {
+//           cssUrl = './Default.css'
+//         }
+//         await loadCSS(cssUrl)
+//         setCssLoaded(true)
+//       } catch (error) {
+//         console.error('Error loading CSS:', error)
+//       }
+//     }
+//     loadThemeCSS()
+//   }, [vendor])
+//   return cssLoaded
+// }
+function MyComponent(_a) {
+    var vendor = _a.vendor;
+    useEffect(function () {
+        if (vendor === 'Kisakallio') {
+            addCSSFile('./Kisakallio.css');
+        }
+        else {
+            addCSSFile('./Default.css');
+        }
+    }, [vendor]);
+    // Rest of your component code
+    return React__default__default.createElement("div", null, "My Component");
+}
+var addCSSFile = function (href) {
+    var link = document.createElement('link');
+    link.rel = 'stylesheet';
+    link.type = 'text/css';
+    link.href = href;
+    document.head.appendChild(link);
+};
+
 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}";
 styleInject(css_248z$1);
 
@@ -8391,8 +8439,8 @@ instance.use(initReactI18next).init({
 });
 
 function FilterBar(_a) {
-    // useTheme({ vendor })
-    _a.vendor; var language = _a.language;
+    var vendor = _a.vendor, language = _a.language;
+    var cssLoaded = MyComponent({ vendor: vendor });
     var _b = useState(0); _b[0]; var setRerenderKey = _b[1];
     useEffect(function () {
         instance.changeLanguage(language);
@@ -8400,9 +8448,8 @@ function FilterBar(_a) {
         setRerenderKey(function (prevKey) { return prevKey + 1; });
     }, [language]);
     var t = useTranslation('filterBar').t;
-    console.log(language, t('calendar.startDate'));
     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;
-    return (React__default__default.createElement("div", { className: "filter-bar" },
+    return (React__default__default.createElement("div", { className: "filter-bar ".concat(cssLoaded ? 'dynamic-theme-class' : '') },
         React__default__default.createElement("div", { className: "filter-bar-header" },
             React__default__default.createElement(SelectButton, { label: t('calendar.startDate'), onClick: function () { return handleSelectedFilter(1); } }),
             React__default__default.createElement(Divider, null),