@compositive/foundation/dist/theming/ThemeProvider.js

Compositive framework foundation package.

import { jsx } from 'react/jsx-runtime';
import { SxProcessorProvider } from '@compositive/primitives';
import { useMemo, useEffect } from 'react';
import { createThemeSxProcessor } from '../styling/createThemeSxProcessor.js';
import '../styling/resolveThemedStyleProperties.js';
import '../styling/ThemedStyle.js';
import { ThemeContext } from './ThemeContext.js';

const ThemeProvider = ({ theme, children, ...variants }) => {
    const themeWithVariants = useMemo(() => (Object.keys(variants).length === 0 ? theme : theme.using(variants)), [theme, variants]);
    useEffect(() => {
        themeWithVariants
            .loadAllFonts()
            .catch((error) => console.error("Error while trying to load the theme fonts:", error));
    }, [themeWithVariants]);
    const themeSxProcessor = useMemo(() => createThemeSxProcessor(themeWithVariants), [themeWithVariants]);
    return (jsx(ThemeContext.Provider, { value: themeWithVariants, children: jsx(SxProcessorProvider, { value: themeSxProcessor, children: children }) }));
};

export { ThemeProvider };
//# sourceMappingURL=ThemeProvider.js.map