@dashadmin/dash-boilerplate 1.3.47 → 1.3.48

package/dist/index.cjs

@@ -736,6 +736,35 @@ var DashThemeProviderLight = ({
     window.addEventListener("DASHTRefreshTheme", handler);
     return () => window.removeEventListener("DASHTRefreshTheme", handler);
   }, []);
+  const currentModeRef = (0, import_react4.useRef)(currentMode);
+  currentModeRef.current = currentMode;
+  (0, import_react4.useEffect)(() => {
+    if (typeof document === "undefined" || typeof MutationObserver === "undefined") return;
+    let pending = false;
+    const rerun = () => {
+      if (pending) return;
+      pending = true;
+      queueMicrotask(() => {
+        pending = false;
+        (0, import_dash_utils.updateDomCssVariables)(currentModeRef.current);
+        refreshTheme();
+      });
+    };
+    const observer = new MutationObserver((mutations) => {
+      for (const mutation of mutations) {
+        for (const node of Array.from(mutation.addedNodes)) {
+          if (!(node instanceof HTMLElement)) continue;
+          const isStylesheet = node.tagName === "STYLE" || node.tagName === "LINK" && node.rel === "stylesheet";
+          if (isStylesheet && node.id !== "dash-theme-variables") {
+            rerun();
+            return;
+          }
+        }
+      }
+    });
+    observer.observe(document.head, { childList: true });
+    return () => observer.disconnect();
+  }, []);
   const contextValue = (0, import_react4.useMemo)(
     () => ({
       theme,

package/dist/index.js

@@ -484,7 +484,7 @@ import { DASH_REDUX_ACTIONS } from "dash-admin-state";
 import { Avatar } from "@mui/material";
 
 // src/theme/DashThemeProviderLight.tsx
-import { createContext as createContext2, useContext as useContext2, useState as useState3, useEffect as useEffect2, useMemo as useMemo2 } from "react";
+import { createContext as createContext2, useContext as useContext2, useState as useState3, useEffect as useEffect2, useMemo as useMemo2, useRef } from "react";
 import CssBaseline from "@mui/material/CssBaseline";
 import { createTheme, ThemeProvider } from "@mui/material";
 import { updateDomCssVariables } from "dash-utils";
@@ -665,6 +665,35 @@ var DashThemeProviderLight = ({
     window.addEventListener("DASHTRefreshTheme", handler);
     return () => window.removeEventListener("DASHTRefreshTheme", handler);
   }, []);
+  const currentModeRef = useRef(currentMode);
+  currentModeRef.current = currentMode;
+  useEffect2(() => {
+    if (typeof document === "undefined" || typeof MutationObserver === "undefined") return;
+    let pending = false;
+    const rerun = () => {
+      if (pending) return;
+      pending = true;
+      queueMicrotask(() => {
+        pending = false;
+        updateDomCssVariables(currentModeRef.current);
+        refreshTheme();
+      });
+    };
+    const observer = new MutationObserver((mutations) => {
+      for (const mutation of mutations) {
+        for (const node of Array.from(mutation.addedNodes)) {
+          if (!(node instanceof HTMLElement)) continue;
+          const isStylesheet = node.tagName === "STYLE" || node.tagName === "LINK" && node.rel === "stylesheet";
+          if (isStylesheet && node.id !== "dash-theme-variables") {
+            rerun();
+            return;
+          }
+        }
+      }
+    });
+    observer.observe(document.head, { childList: true });
+    return () => observer.disconnect();
+  }, []);
   const contextValue = useMemo2(
     () => ({
       theme,

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@dashadmin/dash-boilerplate",
-	"version": "1.3.47",
+	"version": "1.3.48",
 	"main": "dist/index.cjs",
 	"type": "module",
 	"scripts": {