"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.BrandedThemeProvider = BrandedThemeProvider;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const streamplace_store_1 = require("../../streamplace-store");
const theme_1 = require("./theme");
/**
 * ThemeProvider wrapper that automatically applies branding colors from the
 * broadcaster's branding configuration.
 */
function BrandedThemeProvider({ children, defaultTheme, forcedTheme, }) {
    const primaryColor = (0, streamplace_store_1.usePrimaryColor)();
    const accentColor = (0, streamplace_store_1.useAccentColor)();
    const brandingLoading = (0, streamplace_store_1.useStreamplaceStore)((state) => state.brandingLoading);
    // Build color theme overrides from branding
    const colorTheme = (0, react_1.useMemo)(() => {
        // don't override until branding is loaded
        if (brandingLoading) {
            return {};
        }
        const overrides = {};
        if (primaryColor) {
            overrides.primary = primaryColor;
            overrides.ring = primaryColor;
        }
        if (accentColor) {
            overrides.accent = accentColor;
        }
        return overrides;
    }, [primaryColor, accentColor, brandingLoading]);
    return ((0, jsx_runtime_1.jsx)(theme_1.ThemeProvider, { defaultTheme: defaultTheme, forcedTheme: forcedTheme, colorTheme: colorTheme, children: children }));
}
//# sourceMappingURL=branded-theme-provider.js.map