willba-component-library 0.0.40 → 0.0.42

package/lib/index.umd.js

@@ -6080,6 +6080,54 @@
 	    };
 	}
 
+	// 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;
+	    React__default.useEffect(function () {
+	        if (vendor === 'Kisakallio') {
+	            addCSSFile('./Kisakallio.css');
+	        }
+	        else {
+	            addCSSFile('./Default.css');
+	        }
+	    }, [vendor]);
+	    // Rest of your component code
+	    return React__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);
 
@@ -8413,8 +8461,8 @@
 	});
 
 	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 = React__default.useState(0); _b[0]; var setRerenderKey = _b[1];
 	    React__default.useEffect(function () {
 	        instance.changeLanguage(language);
@@ -8422,9 +8470,8 @@
 	        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.createElement("div", { className: "filter-bar" },
+	    return (React__default.createElement("div", { className: "filter-bar ".concat(cssLoaded ? 'dynamic-theme-class' : '') },
 	        React__default.createElement("div", { className: "filter-bar-header" },
 	            React__default.createElement(SelectButton, { label: t('calendar.startDate'), onClick: function () { return handleSelectedFilter(1); } }),
 	            React__default.createElement(Divider, null),