import { __assign, __rest } from "tslib";
import * as React from 'react';
import { GLOBAL_STYLESHEET_KEY, ShadowDomStylesheet, makeShadowConfig } from '@fluentui/merge-styles';
import { getWindow } from '../../dom';
import { MergeStylesDefaultContext, getNewContext } from './MergeStylesDefaultContext';
import { useAdoptedStylesheet as useAdoptedStylesheetDefault, useAdoptedStylesheetEx as useAdoptedStylesheetExDefault, } from '../hooks/useAdoptedStylesheet';
import { useShadowConfig as useShadowConfigDefault } from '../hooks/useShadowConfig';
import { useHasMergeStylesShadowRootContext as useHasMergeStylesShadowRootContextDefault, useMergeStylesShadowRootContext as useMergeStylesShadowRootContextDefault, } from '../hooks/useMergeStylesShadowRoot';
import { useMergeStylesRootStylesheets as useMergeStylesRootStylesheetsDefault } from '../hooks/useMergeStylesRootStylesheets';
import { useStyled as useStyledDefault } from '../hooks/useStyled';
import { useWindow as useWindowDefault } from '@fluentui/react-window-provider';
export var MergeStylesRootContext = React.createContext(getNewContext());
/**
 * Root context provider for mergeStyles shadow DOM.
 * Typically this is placed at the render root of your React application.
 */
export 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 = __rest(_a, ["stylesheets", "window", "useAdoptedStylesheet", "useAdoptedStylesheetEx", "useShadowConfig", "useMergeStylesShadowRootContext", "useHasMergeStylesShadowRootContext", "useMergeStylesRootStylesheets", "useWindow", "useStyled"]);
    var win = userWindow !== null && userWindow !== void 0 ? userWindow : 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 = ShadowDomStylesheet.getInstance(makeShadowConfig(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 = ShadowDomStylesheet.getInstance(makeShadowConfig(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 || useAdoptedStylesheetDefault,
            useAdoptedStylesheetEx: useAdoptedStylesheetEx || useAdoptedStylesheetExDefault,
            useShadowConfig: useShadowConfig || useShadowConfigDefault,
            useMergeStylesShadowRootContext: useMergeStylesShadowRootContext || useMergeStylesShadowRootContextDefault,
            useHasMergeStylesShadowRootContext: useHasMergeStylesShadowRootContext || useHasMergeStylesShadowRootContextDefault,
            useMergeStylesRootStylesheets: useMergeStylesRootStylesheets || useMergeStylesRootStylesheetsDefault,
            useWindow: useWindow || useWindowDefault,
            useStyled: useStyled || useStyledDefault,
        };
    }, [
        stylesheets,
        useAdoptedStylesheet,
        useAdoptedStylesheetEx,
        useShadowConfig,
        useMergeStylesShadowRootContext,
        useHasMergeStylesShadowRootContext,
        useMergeStylesRootStylesheets,
        useWindow,
        useStyled,
    ]);
    return (React.createElement(MergeStylesDefaultContext.Provider, { value: defaultValues },
        React.createElement(MergeStylesRootContext.Provider, __assign({ value: defaultValues }, props))));
};
//# sourceMappingURL=MergeStylesRootContext.js.map