@propknot/shared-ui 1.0.5 → 1.0.7

package/dist/index.js

@@ -1545,21 +1545,39 @@ var CustomThemeProvider = ({ children }) => {
   const [currentTheme, setCurrentTheme] = (0, import_react3.useState)("light");
   const [loading, setLoading] = (0, import_react3.useState)(false);
   const { user, companyBranding } = useAuth();
+  const isEmbedded = new URLSearchParams(window.location.search).get("embedded") === "true";
   const canModifyTheme = Boolean(user && (user.role === "admin" || user.role === "owner" || user.role === "property_manager" || user.role === "maintenance"));
   (0, import_react3.useEffect)(() => {
+    if (!isEmbedded) return;
+    const handleMessage = (event) => {
+      if (!event.origin.startsWith("http://localhost:")) return;
+      const { type, theme } = event.data;
+      if (type === "THEME_CHANGE" && theme && ["light", "dark"].includes(theme)) {
+        console.log("Embedded app received theme change:", theme);
+        setCurrentTheme(theme);
+      }
+    };
+    window.addEventListener("message", handleMessage);
+    if (window.parent !== window) {
+      window.parent.postMessage({ type: "REQUEST_THEME" }, "*");
+    }
+    return () => window.removeEventListener("message", handleMessage);
+  }, [isEmbedded]);
+  (0, import_react3.useEffect)(() => {
+    if (isEmbedded) return;
     if (user && canModifyTheme) {
       const themeToUse = user.themePreference || "light";
       setCurrentTheme(themeToUse);
     } else {
       setCurrentTheme("light");
     }
-  }, [user, canModifyTheme]);
+  }, [user, canModifyTheme, isEmbedded]);
   const toggleTheme = async () => {
     if (!canModifyTheme) return;
     const newTheme = currentTheme === "light" ? "dark" : "light";
     setCurrentTheme(newTheme);
     try {
-      await api_default.put("/auth/theme-preference", { themePreference: newTheme });
+      await api_default.put("/users/me", { themePreference: newTheme });
     } catch (error) {
       console.error("Failed to save theme preference:", error);
       setCurrentTheme(currentTheme);
@@ -1569,7 +1587,7 @@ var CustomThemeProvider = ({ children }) => {
     if (!canModifyTheme || !["light", "dark"].includes(themeKey)) return;
     setCurrentTheme(themeKey);
     try {
-      await api_default.put("/auth/theme-preference", { themePreference: themeKey });
+      await api_default.put("/users/me", { themePreference: themeKey });
     } catch (error) {
       console.error("Failed to save theme preference:", error);
       setCurrentTheme(currentTheme);
@@ -1579,7 +1597,7 @@ var CustomThemeProvider = ({ children }) => {
     if (!canModifyTheme) return;
     setCurrentTheme("light");
     try {
-      await api_default.put("/auth/theme-preference", { themePreference: "light" });
+      await api_default.put("/users/me", { themePreference: "light" });
     } catch (error) {
       console.error("Failed to save theme preference:", error);
       setCurrentTheme(currentTheme);

package/dist/index.mjs

@@ -1481,21 +1481,39 @@ var CustomThemeProvider = ({ children }) => {
   const [currentTheme, setCurrentTheme] = useState3("light");
   const [loading, setLoading] = useState3(false);
   const { user, companyBranding } = useAuth();
+  const isEmbedded = new URLSearchParams(window.location.search).get("embedded") === "true";
   const canModifyTheme = Boolean(user && (user.role === "admin" || user.role === "owner" || user.role === "property_manager" || user.role === "maintenance"));
   useEffect2(() => {
+    if (!isEmbedded) return;
+    const handleMessage = (event) => {
+      if (!event.origin.startsWith("http://localhost:")) return;
+      const { type, theme } = event.data;
+      if (type === "THEME_CHANGE" && theme && ["light", "dark"].includes(theme)) {
+        console.log("Embedded app received theme change:", theme);
+        setCurrentTheme(theme);
+      }
+    };
+    window.addEventListener("message", handleMessage);
+    if (window.parent !== window) {
+      window.parent.postMessage({ type: "REQUEST_THEME" }, "*");
+    }
+    return () => window.removeEventListener("message", handleMessage);
+  }, [isEmbedded]);
+  useEffect2(() => {
+    if (isEmbedded) return;
     if (user && canModifyTheme) {
       const themeToUse = user.themePreference || "light";
       setCurrentTheme(themeToUse);
     } else {
       setCurrentTheme("light");
     }
-  }, [user, canModifyTheme]);
+  }, [user, canModifyTheme, isEmbedded]);
   const toggleTheme = async () => {
     if (!canModifyTheme) return;
     const newTheme = currentTheme === "light" ? "dark" : "light";
     setCurrentTheme(newTheme);
     try {
-      await api_default.put("/auth/theme-preference", { themePreference: newTheme });
+      await api_default.put("/users/me", { themePreference: newTheme });
     } catch (error) {
       console.error("Failed to save theme preference:", error);
       setCurrentTheme(currentTheme);
@@ -1505,7 +1523,7 @@ var CustomThemeProvider = ({ children }) => {
     if (!canModifyTheme || !["light", "dark"].includes(themeKey)) return;
     setCurrentTheme(themeKey);
     try {
-      await api_default.put("/auth/theme-preference", { themePreference: themeKey });
+      await api_default.put("/users/me", { themePreference: themeKey });
     } catch (error) {
       console.error("Failed to save theme preference:", error);
       setCurrentTheme(currentTheme);
@@ -1515,7 +1533,7 @@ var CustomThemeProvider = ({ children }) => {
     if (!canModifyTheme) return;
     setCurrentTheme("light");
     try {
-      await api_default.put("/auth/theme-preference", { themePreference: "light" });
+      await api_default.put("/users/me", { themePreference: "light" });
     } catch (error) {
       console.error("Failed to save theme preference:", error);
       setCurrentTheme(currentTheme);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@propknot/shared-ui",
-  "version": "1.0.5",
+  "version": "1.0.7",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
   "files": [