@gooddata/sdk-ui-theme-provider 11.58.0-alpha.5 → 11.58.0

package/esm/ThemeProvider/ThemeProvider.d.ts

@@ -49,6 +49,12 @@ export interface IThemeProviderProps {
     /**
      * Should ThemeProvider remove global styles during the unmount phase?
      *
+     * @remarks
+     * Only applies when no other global ThemeProvider with a loaded theme remains mounted; otherwise
+     * the theme of the last registered one with a loaded theme is shown again. When a provider with
+     * this set unmounts while descendant ThemeProviders stay mounted, the global styles are removed
+     * once the last of them unmounts, whatever their own setting.
+     *
      * Default: true
      */
     removeGlobalStylesOnUnmout?: boolean;

package/esm/ThemeProvider/ThemeProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../src/ThemeProvider/ThemeProvider.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,SAAS,EAAuB,MAAM,OAAO,CAAC;AAE5D,OAAO,EAAE,KAAK,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;AACpE,OAAO,EAAE,KAAK,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAWlD;;GAEG;AACH,MAAM,MAAM,aAAa,GAAG,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;AAEtD;;GAEG;AACH,MAAM,WAAW,mBAAmB;IAChC;;;;;;;OAOG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,kBAAkB,CAAC;IAE7B;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,QAAQ,CAAC,EAAE,aAAa,CAAC;IAEzB;;;;;;OAMG;IACH,0BAA0B,CAAC,EAAE,OAAO,CAAC;IAErC;;;;OAIG;IACH,0BAA0B,CAAC,EAAE,OAAO,CAAC;IAErC;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACxB;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,aAAa,CAAC,EAC1B,QAAQ,EACR,KAAK,EAAE,UAAU,EACjB,OAAO,EAAE,YAAY,EACrB,SAAS,EAAE,cAAc,EACzB,QAAmB,EACnB,0BAAiC,EACjC,0BAAiC,GACpC,EAAE,mBAAmB,2CAwGrB"}
+{"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../src/ThemeProvider/ThemeProvider.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,SAAS,EAAkD,MAAM,OAAO,CAAC;AAEvF,OAAO,EAAE,KAAK,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;AACpE,OAAO,EAAE,KAAK,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAmBlD;;GAEG;AACH,MAAM,MAAM,aAAa,GAAG,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;AAEtD;;GAEG;AACH,MAAM,WAAW,mBAAmB;IAChC;;;;;;;OAOG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,kBAAkB,CAAC;IAE7B;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,QAAQ,CAAC,EAAE,aAAa,CAAC;IAEzB;;;;;;OAMG;IACH,0BAA0B,CAAC,EAAE,OAAO,CAAC;IAErC;;;;;;;;;;OAUG;IACH,0BAA0B,CAAC,EAAE,OAAO,CAAC;IAErC;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACxB;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,aAAa,CAAC,EAC1B,QAAQ,EACR,KAAK,EAAE,UAAU,EACjB,OAAO,EAAE,YAAY,EACrB,SAAS,EAAE,cAAc,EACzB,QAAmB,EACnB,0BAAiC,EACjC,0BAAiC,GACpC,EAAE,mBAAmB,2CA6GrB"}

package/esm/ThemeProvider/ThemeProvider.js

@@ -1,12 +1,12 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 // (C) 2020-2026 GoodData Corporation
-import { useEffect, useState } from "react";
+import { createContext, useContext, useEffect, useState } from "react";
 import { useBackend, useWorkspace } from "@gooddata/sdk-ui";
-import { clearCssProperties, setCssProperties } from "../cssProperties.js";
+import { createGlobalThemeOwner, registerGlobalThemeOwner, setGlobalThemeOwnerRemovesStylesWhenLast, setGlobalThemeOwnerState, unregisterGlobalThemeOwner, } from "../globalThemeOwners.js";
 import { ThemeContextProvider } from "./Context.js";
-import { isDarkTheme } from "./isDarkTheme.js";
 import { prepareTheme } from "./prepareTheme.js";
 const identity = (v) => v;
+const ParentGlobalThemeOwnerContext = createContext(null);
 /**
  * Fetches the theme object from the backend upon mounting and passes both theme object and isThemeLoading flag
  * to the context via ThemeContextProvider.
@@ -25,10 +25,20 @@ export function ThemeProvider({ children, theme: themeParam, backend: backendPar
     const [referenceTheme, setReferenceTheme] = useState(themeParam ?? {});
     const [isLoading, setIsLoading] = useState(false);
     const [status, setStatus] = useState("pending");
+    const parentOwner = useContext(ParentGlobalThemeOwnerContext);
+    const [owner] = useState(() => createGlobalThemeOwner(removeGlobalStylesOnUnmout, parentOwner));
+    // Declared first: writes to an owner that is not registered are ignored.
     useEffect(() => {
-        // Marks the in-flight getTheme() as stale once this effect is torn down - either because the
-        // workspace/backend changed or because the component unmounted. Without it a late resolution
-        // would re-inject the global styles that the unmount cleanup below has just removed.
+        registerGlobalThemeOwner(owner);
+        return () => {
+            unregisterGlobalThemeOwner(owner);
+        };
+    }, [owner]);
+    useEffect(() => {
+        setGlobalThemeOwnerRemovesStylesWhenLast(owner, removeGlobalStylesOnUnmout);
+    }, [owner, removeGlobalStylesOnUnmout]);
+    useEffect(() => {
+        // Keeps a slow getTheme() for a previous workspace/backend from overwriting the newer theme.
         let cancelled = false;
         // A malformed theme (e.g. an unparseable color) must never block rendering. Preparing and
         // applying the theme is wrapped so any failure falls back to the default theme and always
@@ -43,8 +53,7 @@ export function ThemeProvider({ children, theme: themeParam, backend: backendPar
                     : prepareTheme(themeToApply, true);
                 setTheme(preparedTheme);
                 setReferenceTheme(preparedReferenceTheme);
-                clearCssProperties();
-                setCssProperties(preparedTheme, isDarkTheme(preparedTheme));
+                setGlobalThemeOwnerState(owner, { theme: preparedTheme });
             }
             catch (error) {
                 console.error("Failed to apply the theme, falling back to the default theme.", error);
@@ -52,7 +61,7 @@ export function ThemeProvider({ children, theme: themeParam, backend: backendPar
                 // context consumers stay consistent with the cleared CSS variables
                 setTheme({});
                 setReferenceTheme({});
-                clearCssProperties();
+                setGlobalThemeOwnerState(owner, "cleared");
             }
             finally {
                 setIsLoading(false);
@@ -66,7 +75,7 @@ export function ThemeProvider({ children, theme: themeParam, backend: backendPar
         }
         const fetchData = async () => {
             if (!backend || !workspace) {
-                clearCssProperties();
+                setGlobalThemeOwnerState(owner, "cleared");
                 return;
             }
             setIsLoading(true);
@@ -85,7 +94,7 @@ export function ThemeProvider({ children, theme: themeParam, backend: backendPar
                     // context consumers stay consistent with the cleared CSS variables
                     setTheme({});
                     setReferenceTheme({});
-                    clearCssProperties();
+                    setGlobalThemeOwnerState(owner, "cleared");
                     setIsLoading(false);
                     setStatus("success");
                 }
@@ -95,13 +104,6 @@ export function ThemeProvider({ children, theme: themeParam, backend: backendPar
         return () => {
             cancelled = true;
         };
-    }, [themeParam, workspace, backend, modifier, enableComplementaryPalette]);
-    useEffect(() => {
-        return () => {
-            if (removeGlobalStylesOnUnmout) {
-                clearCssProperties();
-            }
-        };
-    }, [removeGlobalStylesOnUnmout]);
-    return (_jsx(ThemeContextProvider, { theme: theme, referenceTheme: referenceTheme, themeIsLoading: isLoading, themeStatus: status, children: children }));
+    }, [owner, themeParam, workspace, backend, modifier, enableComplementaryPalette]);
+    return (_jsx(ThemeContextProvider, { theme: theme, referenceTheme: referenceTheme, themeIsLoading: isLoading, themeStatus: status, children: _jsx(ParentGlobalThemeOwnerContext.Provider, { value: owner, children: children }) }));
 }

package/esm/globalThemeOwners.d.ts

@@ -0,0 +1,17 @@
+import { type ITheme } from "@gooddata/sdk-model";
+type ResolvedGlobalThemeState = "cleared" | {
+    theme: ITheme;
+};
+export interface IGlobalThemeOwner {
+    state: "pending" | ResolvedGlobalThemeState;
+    removeGlobalStylesWhenLast: boolean;
+    inheritsRemoveGlobalStylesWhenLast: boolean;
+    parent: IGlobalThemeOwner | null;
+}
+export declare function createGlobalThemeOwner(removeGlobalStylesWhenLast: boolean, parent: IGlobalThemeOwner | null): IGlobalThemeOwner;
+export declare function registerGlobalThemeOwner(owner: IGlobalThemeOwner): void;
+export declare function setGlobalThemeOwnerRemovesStylesWhenLast(owner: IGlobalThemeOwner, value: boolean): void;
+export declare function setGlobalThemeOwnerState(owner: IGlobalThemeOwner, state: ResolvedGlobalThemeState): void;
+export declare function unregisterGlobalThemeOwner(owner: IGlobalThemeOwner): void;
+export {};
+//# sourceMappingURL=globalThemeOwners.d.ts.map

package/esm/globalThemeOwners.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"globalThemeOwners.d.ts","sourceRoot":"","sources":["../src/globalThemeOwners.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAKlD,KAAK,wBAAwB,GAAG,SAAS,GAAG;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC;AAE9D,MAAM,WAAW,iBAAiB;IAC9B,KAAK,EAAE,SAAS,GAAG,wBAAwB,CAAC;IAC5C,0BAA0B,EAAE,OAAO,CAAC;IACpC,kCAAkC,EAAE,OAAO,CAAC;IAC5C,MAAM,EAAE,iBAAiB,GAAG,IAAI,CAAC;CACpC;AA6BD,wBAAgB,sBAAsB,CAClC,0BAA0B,EAAE,OAAO,EACnC,MAAM,EAAE,iBAAiB,GAAG,IAAI,GACjC,iBAAiB,CAOnB;AAED,wBAAgB,wBAAwB,CAAC,KAAK,EAAE,iBAAiB,GAAG,IAAI,CAGvE;AAED,wBAAgB,wCAAwC,CAAC,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,OAAO,GAAG,IAAI,CAEvG;AAGD,wBAAgB,wBAAwB,CAAC,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,wBAAwB,GAAG,IAAI,CAQxG;AAED,wBAAgB,0BAA0B,CAAC,KAAK,EAAE,iBAAiB,GAAG,IAAI,CAoCzE"}

package/esm/globalThemeOwners.js

@@ -0,0 +1,85 @@
+// (C) 2026 GoodData Corporation
+import { clearCssProperties, setCssProperties } from "./cssProperties.js";
+import { isDarkTheme } from "./ThemeProvider/isDarkTheme.js";
+// Registered global ThemeProviders in effect order. Effects run child-first, so a nested provider
+// only outranks its parent when it mounts in a later commit (e.g. an embedded app).
+const owners = [];
+function isResolved(owner) {
+    return owner.state !== "pending";
+}
+function getEffectiveOwner() {
+    for (let index = owners.length - 1; index >= 0; index--) {
+        const owner = owners[index];
+        if (isResolved(owner)) {
+            return owner;
+        }
+    }
+    return undefined;
+}
+function paint(state) {
+    clearCssProperties();
+    if (state !== "cleared") {
+        setCssProperties(state.theme, isDarkTheme(state.theme));
+    }
+}
+export function createGlobalThemeOwner(removeGlobalStylesWhenLast, parent) {
+    return {
+        state: "pending",
+        removeGlobalStylesWhenLast,
+        inheritsRemoveGlobalStylesWhenLast: false,
+        parent,
+    };
+}
+export function registerGlobalThemeOwner(owner) {
+    owner.state = "pending";
+    owners.push(owner);
+}
+export function setGlobalThemeOwnerRemovesStylesWhenLast(owner, value) {
+    owner.removeGlobalStylesWhenLast = value;
+}
+// Throws when the owner is the one shown and its theme cannot be converted to CSS properties.
+export function setGlobalThemeOwnerState(owner, state) {
+    if (!owners.includes(owner)) {
+        return;
+    }
+    owner.state = state;
+    if (getEffectiveOwner() === owner) {
+        paint(state);
+    }
+}
+export function unregisterGlobalThemeOwner(owner) {
+    const index = owners.indexOf(owner);
+    if (index === -1) {
+        return;
+    }
+    const wasEffective = getEffectiveOwner() === owner;
+    const removesGlobalStylesWhenLast = owner.removeGlobalStylesWhenLast || owner.inheritsRemoveGlobalStylesWhenLast;
+    owners.splice(index, 1);
+    // Parents unmount before their descendants, so a parent's duty to remove the styles passes to its
+    // descendant providers that are still mounted.
+    if (removesGlobalStylesWhenLast) {
+        owners
+            .filter((childOwner) => childOwner.parent === owner)
+            .forEach((childOwner) => {
+            childOwner.inheritsRemoveGlobalStylesWhenLast = true;
+        });
+    }
+    const nextOwner = getEffectiveOwner();
+    if (!nextOwner) {
+        if (removesGlobalStylesWhenLast) {
+            clearCssProperties();
+        }
+        return;
+    }
+    if (!wasEffective) {
+        return;
+    }
+    try {
+        paint(nextOwner.state);
+    }
+    catch (error) {
+        console.error("Failed to apply the theme, falling back to the default theme.", error);
+        nextOwner.state = "cleared";
+        clearCssProperties();
+    }
+}

package/esm/sdk-ui-theme-provider.d.ts

@@ -233,6 +233,12 @@ export declare interface IThemeProviderProps {
     /**
      * Should ThemeProvider remove global styles during the unmount phase?
      *
+     * @remarks
+     * Only applies when no other global ThemeProvider with a loaded theme remains mounted; otherwise
+     * the theme of the last registered one with a loaded theme is shown again. When a provider with
+     * this set unmounts while descendant ThemeProviders stay mounted, the global styles are removed
+     * once the last of them unmounts, whatever their own setting.
+     *
      * Default: true
      */
     removeGlobalStylesOnUnmout?: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gooddata/sdk-ui-theme-provider",
-  "version": "11.58.0-alpha.5",
+  "version": "11.58.0",
   "description": "GoodData SDK - Theme provider",
   "license": "MIT",
   "author": "GoodData Corporation",
@@ -32,10 +32,10 @@
     "postcss-value-parser": "4.2.0",
     "ts-invariant": "0.10.3",
     "tslib": "2.8.1",
-    "@gooddata/sdk-backend-spi": "11.58.0-alpha.5",
-    "@gooddata/sdk-model": "11.58.0-alpha.5",
-    "@gooddata/sdk-ui": "11.58.0-alpha.5",
-    "@gooddata/util": "11.58.0-alpha.5"
+    "@gooddata/sdk-backend-spi": "11.58.0",
+    "@gooddata/sdk-model": "11.58.0",
+    "@gooddata/util": "11.58.0",
+    "@gooddata/sdk-ui": "11.58.0"
   },
   "devDependencies": {
     "@microsoft/api-documenter": "7.30.10",
@@ -69,10 +69,10 @@
     "react-dom": "19.1.1",
     "typescript": "7.0.2",
     "vitest": "4.1.11",
-    "@gooddata/eslint-config": "11.58.0-alpha.5",
-    "@gooddata/oxlint-config": "11.58.0-alpha.5",
-    "@gooddata/reference-workspace": "11.58.0-alpha.5",
-    "@gooddata/sdk-backend-mockingbird": "11.58.0-alpha.5"
+    "@gooddata/eslint-config": "11.58.0",
+    "@gooddata/oxlint-config": "11.58.0",
+    "@gooddata/reference-workspace": "11.58.0",
+    "@gooddata/sdk-backend-mockingbird": "11.58.0"
   },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0",