@nex-ui/react/dist/cjs/components/provider/Provider.cjs

🎉 A beautiful, modern, and reliable React component library.

"use client";
'use strict';

var jsxRuntime = require('react/jsx-runtime');
var system = require('@nex-ui/system');
var react = require('react');
var utils = require('@nex-ui/utils');
var Context = require('./Context.cjs');
var preset = require('../../theme/preset.cjs');

function InnerProvider({ components, prefix, children, primaryThemeColor = 'blue' }) {
    const { css, layers } = system.useSystem();
    const contextValue = react.useMemo(()=>({
            components,
            prefix,
            css,
            layers,
            primaryThemeColor
        }), [
        components,
        css,
        layers,
        prefix,
        primaryThemeColor
    ]);
    return /*#__PURE__*/ jsxRuntime.jsx(Context.NexContextProvider, {
        value: contextValue,
        children: children
    });
}
InnerProvider.displayName = 'InnerProvider';
function TopLevelProvider(props) {
    const { theme, children, colorScheme, cssCascadeLayersDisabled, prefix = 'nui' } = props;
    const systemProviderProps = react.useMemo(()=>{
        return {
            cssCascadeLayersDisabled,
            prefix,
            scales: {
                ...theme?.scales,
                ...preset.defaultConfig.scales
            },
            selectors: {
                ...preset.defaultConfig.selectors,
                ...theme?.selectors
            },
            aliases: {
                ...theme?.aliases,
                ...preset.defaultConfig.aliases
            },
            breakpoints: {
                ...preset.defaultConfig.breakpoints,
                ...theme?.breakpoints
            },
            tokens: utils.merge({}, preset.defaultConfig.tokens, theme?.tokens),
            semanticTokens: utils.merge({}, preset.defaultConfig.semanticTokens, theme?.semanticTokens),
            colorSchemeNode: colorScheme?.colorSchemeNode,
            modeStorageKey: colorScheme?.modeStorageKey ?? `${prefix}-color-scheme`,
            colorSchemeSelector: colorScheme?.colorSchemeSelector ?? `data-${prefix}-color-scheme`,
            forcedMode: colorScheme?.forcedMode,
            defaultMode: colorScheme?.defaultMode ?? 'system'
        };
    }, [
        cssCascadeLayersDisabled,
        prefix,
        theme?.scales,
        theme?.selectors,
        theme?.aliases,
        theme?.breakpoints,
        theme?.tokens,
        theme?.semanticTokens,
        colorScheme?.colorSchemeNode,
        colorScheme?.modeStorageKey,
        colorScheme?.colorSchemeSelector,
        colorScheme?.forcedMode,
        colorScheme?.defaultMode
    ]);
    return /*#__PURE__*/ jsxRuntime.jsx(system.SystemProvider, {
        ...systemProviderProps,
        children: /*#__PURE__*/ jsxRuntime.jsx(InnerProvider, {
            components: theme?.components,
            primaryThemeColor: theme?.primaryThemeColor,
            prefix: prefix,
            children: children
        })
    });
}
TopLevelProvider.displayName = 'TopLevelProvider';
function NestedProvider(props) {
    const { theme, children } = props;
    const ctx = Context.useNexUI();
    const mergedComponents = react.useMemo(()=>{
        return utils.mergeWith({}, ctx.components, theme?.components, (target, source, key)=>{
            if (key === 'styleOverrides') {
                return system.mergeRecipeConfigs(target, source);
            }
            if (key === 'defaultProps') {
                return utils.mergeProps(target, source);
            }
        });
    }, [
        theme?.components,
        ctx.components
    ]);
    return /*#__PURE__*/ jsxRuntime.jsx(InnerProvider, {
        prefix: ctx.prefix,
        components: mergedComponents,
        primaryThemeColor: theme?.primaryThemeColor ?? ctx.primaryThemeColor,
        children: children
    });
}
NestedProvider.displayName = 'NestedProvider';
function NexUIProvider(props) {
    const outer = Context.useNexUI();
    const isTopLevel = outer === Context.DEFAULT_CONTEXT_VALUE;
    return isTopLevel ? /*#__PURE__*/ jsxRuntime.jsx(TopLevelProvider, {
        ...props
    }) : /*#__PURE__*/ jsxRuntime.jsx(NestedProvider, {
        ...props
    });
}
NexUIProvider.displayName = 'NexUIProvider';

exports.NexUIProvider = NexUIProvider;