var _a;
import React, { createContext, useContext, useMemo } from 'react';
import { getOwnerGlobalObject, getSafeWindow } from '../globalObject.js';
import { getEmotion } from '../theming/Emotion.js';
var globalObject = getSafeWindow();
export var RenderEnvironmentContext = createContext({
    globalObject: globalObject,
    emotion: getEmotion({ container: (_a = globalObject.document) === null || _a === void 0 ? void 0 : _a.head }),
});
export var RenderEnvironmentProvider = function (_a) {
    var children = _a.children, rootNode = _a.rootNode;
    var value = useMemo(function () {
        var _a;
        var globalObject = getOwnerGlobalObject(rootNode);
        var container = (_a = globalObject.document) === null || _a === void 0 ? void 0 : _a.head;
        var emotion = getEmotion({ container: container });
        return { globalObject: globalObject, emotion: emotion };
    }, [rootNode]);
    return React.createElement(RenderEnvironmentContext.Provider, { value: value }, children);
};
export var useGlobal = function () { return useContext(RenderEnvironmentContext).globalObject; };
export var useEmotion = function () { return useContext(RenderEnvironmentContext).emotion; };
export var useStyles = function (getStyles) {
    var emotion = useEmotion();
    return getStyles(emotion);
};
//# sourceMappingURL=RenderEnvironmentContext.js.map