"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.MergeStylesRootProvider = exports.MergeStylesRootContext = void 0;
var tslib_1 = require("tslib");
var React = require("react");
var merge_styles_1 = require("@fluentui/merge-styles");
var dom_1 = require("../../dom");
var MergeStylesDefaultContext_1 = require("./MergeStylesDefaultContext");
var useAdoptedStylesheet_1 = require("../hooks/useAdoptedStylesheet");
var useShadowConfig_1 = require("../hooks/useShadowConfig");
var useMergeStylesShadowRoot_1 = require("../hooks/useMergeStylesShadowRoot");
var useMergeStylesRootStylesheets_1 = require("../hooks/useMergeStylesRootStylesheets");
var useStyled_1 = require("../hooks/useStyled");
var react_window_provider_1 = require("@fluentui/react-window-provider");
exports.MergeStylesRootContext = React.createContext((0, MergeStylesDefaultContext_1.getNewContext)());
/**
 * Root context provider for mergeStyles shadow DOM.
 * Typically this is placed at the render root of your React application.
 */
var MergeStylesRootProvider = function (_a) {
    var userSheets = _a.stylesheets, userWindow = _a.window, useAdoptedStylesheet = _a.useAdoptedStylesheet, useAdoptedStylesheetEx = _a.useAdoptedStylesheetEx, useShadowConfig = _a.useShadowConfig, useMergeStylesShadowRootContext = _a.useMergeStylesShadowRootContext, useHasMergeStylesShadowRootContext = _a.useHasMergeStylesShadowRootContext, useMergeStylesRootStylesheets = _a.useMergeStylesRootStylesheets, useWindow = _a.useWindow, useStyled = _a.useStyled, props = tslib_1.__rest(_a, ["stylesheets", "window", "useAdoptedStylesheet", "useAdoptedStylesheetEx", "useShadowConfig", "useMergeStylesShadowRootContext", "useHasMergeStylesShadowRootContext", "useMergeStylesRootStylesheets", "useWindow", "useStyled"]);
    var win = userWindow !== null && userWindow !== void 0 ? userWindow : (0, dom_1.getWindow)();
    var _b = React.useState(function () { return userSheets || new Map(); }), stylesheets = _b[0], setStylesheets = _b[1];
    var sheetHandler = React.useCallback(function (_a) {
        var key = _a.key, sheet = _a.sheet;
        setStylesheets(function (prev) {
            var next = new Map(prev);
            next.set(key, sheet);
            return next;
        });
    }, []);
    // Update stylesheets based on user style sheet changes
    React.useEffect(function () {
        setStylesheets(userSheets || new Map());
    }, [userSheets]);
    // Wire up listener for adopted stylesheets
    React.useEffect(function () {
        if (!win) {
            return;
        }
        var sheet = merge_styles_1.ShadowDomStylesheet.getInstance((0, merge_styles_1.makeShadowConfig)(merge_styles_1.GLOBAL_STYLESHEET_KEY, false, win));
        var off = sheet.onAddSheet(sheetHandler);
        return function () {
            off();
        };
    }, [win, sheetHandler]);
    // Read stylesheets from window on mount
    React.useEffect(function () {
        if (!win) {
            return;
        }
        var changed = false;
        var next = new Map(stylesheets);
        var sheet = merge_styles_1.ShadowDomStylesheet.getInstance((0, merge_styles_1.makeShadowConfig)(merge_styles_1.GLOBAL_STYLESHEET_KEY, false, win));
        var adoptedSheets = sheet.getAdoptedSheets();
        adoptedSheets.forEach(function (adoptedSheet, key) {
            next.set(key, adoptedSheet);
            changed = true;
        });
        if (changed) {
            setStylesheets(next);
        }
        // eslint-disable-next-line react-hooks/exhaustive-deps
    }, []);
    var defaultValues = React.useMemo(function () {
        return {
            stylesheets: stylesheets,
            useAdoptedStylesheet: useAdoptedStylesheet || useAdoptedStylesheet_1.useAdoptedStylesheet,
            useAdoptedStylesheetEx: useAdoptedStylesheetEx || useAdoptedStylesheet_1.useAdoptedStylesheetEx,
            useShadowConfig: useShadowConfig || useShadowConfig_1.useShadowConfig,
            useMergeStylesShadowRootContext: useMergeStylesShadowRootContext || useMergeStylesShadowRoot_1.useMergeStylesShadowRootContext,
            useHasMergeStylesShadowRootContext: useHasMergeStylesShadowRootContext || useMergeStylesShadowRoot_1.useHasMergeStylesShadowRootContext,
            useMergeStylesRootStylesheets: useMergeStylesRootStylesheets || useMergeStylesRootStylesheets_1.useMergeStylesRootStylesheets,
            useWindow: useWindow || react_window_provider_1.useWindow,
            useStyled: useStyled || useStyled_1.useStyled,
        };
    }, [
        stylesheets,
        useAdoptedStylesheet,
        useAdoptedStylesheetEx,
        useShadowConfig,
        useMergeStylesShadowRootContext,
        useHasMergeStylesShadowRootContext,
        useMergeStylesRootStylesheets,
        useWindow,
        useStyled,
    ]);
    return (React.createElement(MergeStylesDefaultContext_1.MergeStylesDefaultContext.Provider, { value: defaultValues },
        React.createElement(exports.MergeStylesRootContext.Provider, tslib_1.__assign({ value: defaultValues }, props))));
};
exports.MergeStylesRootProvider = MergeStylesRootProvider;
//# sourceMappingURL=MergeStylesRootContext.js.map