@dashadmin/dash-boilerplate 1.3.49 → 1.3.51

package/dist/index.cjs

@@ -602,23 +602,14 @@ var createMinimalTheme = (mode, extendedOptions) => {
   const colors = getThemeColors(mode);
   const fontSizeBase = getCssVariableNumber("--font-size-base", 14);
   const borderRadiusBase = getCssVariableNumber("--border-radius-base", 6);
-  const _a = extendedOptions || {}, { palette: _p, colorSchemes: _cs, defaultColorScheme: _dcs } = _a, safeExtendedOptions = __objRest(_a, ["palette", "colorSchemes", "defaultColorScheme"]);
-  return (0, import_material.createTheme)(__spreadValues({
-    breakpoints: {
-      keys: ["xs", "sm", "md", "lg", "xl"],
-      values: { xs: 0, sm: 600, md: 900, lg: 1200, xl: 1536 }
-    },
+  const primaryMain = colors.btnBg || colors.primaryColor;
+  const primaryContrastText = colors.btnColor || colors.primaryContrast;
+  const custom = {
     palette: {
       mode,
       primary: {
-        main: colors.primaryColor
-        // No explicit contrastText: MUI's palette augmentation derives it via
-        // getContrastText(main) (picks black/white text by contrast ratio) when
-        // omitted. Trusting --primary-contrast here caused illegible button text
-        // whenever an app picked a --primary-contrast too close in tone to
-        // --primary-color (e.g. vanexa-system's near-identical blues, 2026-08-03) —
-        // --primary-contrast is also used standalone as a gradient stop elsewhere,
-        // so it was never guaranteed to double as a legible foreground color.
+        main: primaryMain,
+        contrastText: primaryContrastText
       },
       secondary: {
         main: colors.secondaryColor
@@ -640,7 +631,7 @@ var createMinimalTheme = (mode, extendedOptions) => {
     shape: {
       borderRadius: borderRadiusBase
     },
-    components: {
+    components: __spreadValues({
       MuiButton: {
         styleOverrides: {
           root: {
@@ -660,12 +651,59 @@ var createMinimalTheme = (mode, extendedOptions) => {
       MuiPaper: {
         styleOverrides: {
           root: {
-            backgroundImage: "none"
+            color: "var(--text-color)",
+            backgroundColor: "var(--component-bg)",
+            "&.Mui-focused": {
+              color: "var(--primary-color)",
+              backgroundColor: "var(--component-bg)"
+            }
+          }
+        }
+      },
+      MuiOutlinedInput: {
+        styleOverrides: {
+          root: {
+            color: "var(--text-color)",
+            "& .MuiOutlinedInput-notchedOutline": {
+              borderColor: "var(--border-color)"
+            },
+            "&:hover .MuiOutlinedInput-notchedOutline": {
+              borderColor: "var(--primary-color)"
+            },
+            "&.Mui-focused .MuiOutlinedInput-notchedOutline": {
+              borderColor: "var(--primary-color)"
+            }
+          }
+        }
+      },
+      MuiInputLabel: {
+        styleOverrides: {
+          root: {
+            color: "var(--text-color)",
+            "&.Mui-focused": {
+              color: "var(--primary-color)"
+            }
+          }
+        }
+      },
+      MuiSelect: {
+        styleOverrides: {
+          select: {
+            color: "var(--text-color)"
+          },
+          icon: {
+            color: "var(--text-color)"
           }
         }
       }
-    }
-  }, safeExtendedOptions));
+    }, (extendedOptions == null ? void 0 : extendedOptions.components) || {})
+  };
+  console.log("custom theme options:", custom);
+  const createdTheme = (0, import_material.createTheme)(__spreadValues(__spreadValues({}, custom), extendedOptions ? ((_a) => {
+    var _b = _a, { components } = _b, rest = __objRest(_b, ["components"]);
+    return rest;
+  })(extendedOptions) : {}));
+  return createdTheme;
 };
 var DashThemeContext = (0, import_react4.createContext)(null);
 var useDashThemeContextLight = () => {
@@ -736,50 +774,6 @@ 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;
-          if (node.id === "dash-theme-variables") continue;
-          if (node.tagName === "STYLE") {
-            rerun();
-          } else if (node.tagName === "LINK" && node.rel === "stylesheet") {
-            const link = node;
-            if (link.sheet) {
-              rerun();
-            } else {
-              link.addEventListener("load", rerun, { once: true });
-            }
-          }
-        }
-      }
-    });
-    observer.observe(document.head, { childList: true });
-    const onWindowLoad = () => rerun();
-    if (document.readyState === "complete") {
-      rerun();
-    } else {
-      window.addEventListener("load", onWindowLoad, { once: true });
-    }
-    return () => {
-      observer.disconnect();
-      window.removeEventListener("load", onWindowLoad);
-    };
-  }, []);
   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, useRef } from "react";
+import { createContext as createContext2, useContext as useContext2, useState as useState3, useEffect as useEffect2, useMemo as useMemo2 } from "react";
 import CssBaseline from "@mui/material/CssBaseline";
 import { createTheme, ThemeProvider } from "@mui/material";
 import { updateDomCssVariables } from "dash-utils";
@@ -531,23 +531,14 @@ var createMinimalTheme = (mode, extendedOptions) => {
   const colors = getThemeColors(mode);
   const fontSizeBase = getCssVariableNumber("--font-size-base", 14);
   const borderRadiusBase = getCssVariableNumber("--border-radius-base", 6);
-  const _a = extendedOptions || {}, { palette: _p, colorSchemes: _cs, defaultColorScheme: _dcs } = _a, safeExtendedOptions = __objRest(_a, ["palette", "colorSchemes", "defaultColorScheme"]);
-  return createTheme(__spreadValues({
-    breakpoints: {
-      keys: ["xs", "sm", "md", "lg", "xl"],
-      values: { xs: 0, sm: 600, md: 900, lg: 1200, xl: 1536 }
-    },
+  const primaryMain = colors.btnBg || colors.primaryColor;
+  const primaryContrastText = colors.btnColor || colors.primaryContrast;
+  const custom = {
     palette: {
       mode,
       primary: {
-        main: colors.primaryColor
-        // No explicit contrastText: MUI's palette augmentation derives it via
-        // getContrastText(main) (picks black/white text by contrast ratio) when
-        // omitted. Trusting --primary-contrast here caused illegible button text
-        // whenever an app picked a --primary-contrast too close in tone to
-        // --primary-color (e.g. vanexa-system's near-identical blues, 2026-08-03) —
-        // --primary-contrast is also used standalone as a gradient stop elsewhere,
-        // so it was never guaranteed to double as a legible foreground color.
+        main: primaryMain,
+        contrastText: primaryContrastText
       },
       secondary: {
         main: colors.secondaryColor
@@ -569,7 +560,7 @@ var createMinimalTheme = (mode, extendedOptions) => {
     shape: {
       borderRadius: borderRadiusBase
     },
-    components: {
+    components: __spreadValues({
       MuiButton: {
         styleOverrides: {
           root: {
@@ -589,12 +580,59 @@ var createMinimalTheme = (mode, extendedOptions) => {
       MuiPaper: {
         styleOverrides: {
           root: {
-            backgroundImage: "none"
+            color: "var(--text-color)",
+            backgroundColor: "var(--component-bg)",
+            "&.Mui-focused": {
+              color: "var(--primary-color)",
+              backgroundColor: "var(--component-bg)"
+            }
+          }
+        }
+      },
+      MuiOutlinedInput: {
+        styleOverrides: {
+          root: {
+            color: "var(--text-color)",
+            "& .MuiOutlinedInput-notchedOutline": {
+              borderColor: "var(--border-color)"
+            },
+            "&:hover .MuiOutlinedInput-notchedOutline": {
+              borderColor: "var(--primary-color)"
+            },
+            "&.Mui-focused .MuiOutlinedInput-notchedOutline": {
+              borderColor: "var(--primary-color)"
+            }
+          }
+        }
+      },
+      MuiInputLabel: {
+        styleOverrides: {
+          root: {
+            color: "var(--text-color)",
+            "&.Mui-focused": {
+              color: "var(--primary-color)"
+            }
+          }
+        }
+      },
+      MuiSelect: {
+        styleOverrides: {
+          select: {
+            color: "var(--text-color)"
+          },
+          icon: {
+            color: "var(--text-color)"
           }
         }
       }
-    }
-  }, safeExtendedOptions));
+    }, (extendedOptions == null ? void 0 : extendedOptions.components) || {})
+  };
+  console.log("custom theme options:", custom);
+  const createdTheme = createTheme(__spreadValues(__spreadValues({}, custom), extendedOptions ? ((_a) => {
+    var _b = _a, { components } = _b, rest = __objRest(_b, ["components"]);
+    return rest;
+  })(extendedOptions) : {}));
+  return createdTheme;
 };
 var DashThemeContext = createContext2(null);
 var useDashThemeContextLight = () => {
@@ -665,50 +703,6 @@ 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;
-          if (node.id === "dash-theme-variables") continue;
-          if (node.tagName === "STYLE") {
-            rerun();
-          } else if (node.tagName === "LINK" && node.rel === "stylesheet") {
-            const link = node;
-            if (link.sheet) {
-              rerun();
-            } else {
-              link.addEventListener("load", rerun, { once: true });
-            }
-          }
-        }
-      }
-    });
-    observer.observe(document.head, { childList: true });
-    const onWindowLoad = () => rerun();
-    if (document.readyState === "complete") {
-      rerun();
-    } else {
-      window.addEventListener("load", onWindowLoad, { once: true });
-    }
-    return () => {
-      observer.disconnect();
-      window.removeEventListener("load", onWindowLoad);
-    };
-  }, []);
   const contextValue = useMemo2(
     () => ({
       theme,

package/package.json

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