@fluentui/react/lib-commonjs/utilities/ThemeProvider/useThemeProviderClasses.js

Reusable React components for building web experiences.

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.useThemeProviderClasses = void 0;
var React = require("react");
var utilities_1 = require("@fluentui/utilities");
var react_window_provider_1 = require("@fluentui/react-window-provider");
var makeStyles_1 = require("./makeStyles");
// eslint-disable-next-line deprecation/deprecation
var useThemeProviderStyles = (0, makeStyles_1.makeStyles)(function (theme) {
    var semanticColors = theme.semanticColors, fonts = theme.fonts;
    return {
        body: [
            {
                color: semanticColors.bodyText,
                background: semanticColors.bodyBackground,
                fontFamily: fonts.medium.fontFamily,
                fontWeight: fonts.medium.fontWeight,
                fontSize: fonts.medium.fontSize,
                MozOsxFontSmoothing: fonts.medium.MozOsxFontSmoothing,
                WebkitFontSmoothing: fonts.medium.WebkitFontSmoothing,
            },
        ],
    };
});
/**
 * Hook to add class to body element.
 */
function useApplyClassToBody(state, classesToApply) {
    var _a;
    var applyTo = state.applyTo;
    var applyToBody = applyTo === 'body';
    var body = (_a = (0, react_window_provider_1.useDocument)()) === null || _a === void 0 ? void 0 : _a.body;
    React.useEffect(function () {
        if (!applyToBody || !body) {
            return;
        }
        for (var _i = 0, classesToApply_1 = classesToApply; _i < classesToApply_1.length; _i++) {
            var classToApply = classesToApply_1[_i];
            if (classToApply) {
                body.classList.add(classToApply);
            }
        }
        return function () {
            if (!applyToBody || !body) {
                return;
            }
            for (var _i = 0, classesToApply_2 = classesToApply; _i < classesToApply_2.length; _i++) {
                var classToApply = classesToApply_2[_i];
                if (classToApply) {
                    body.classList.remove(classToApply);
                }
            }
        };
    }, [applyToBody, body, classesToApply]);
}
function useThemeProviderClasses(state) {
    var classes = useThemeProviderStyles(state);
    var className = state.className, applyTo = state.applyTo;
    useApplyClassToBody(state, [classes.root, classes.body]);
    state.className = (0, utilities_1.css)(className, classes.root, applyTo === 'element' && classes.body);
}
exports.useThemeProviderClasses = useThemeProviderClasses;
//# sourceMappingURL=useThemeProviderClasses.js.map