@vectara/vectara-ui/lib/components/context/Context.js

Vectara's design system, codified as a React and Sass component library

var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
import { jsx as _jsx } from "react/jsx-runtime";
import { createContext, useContext, useMemo, useEffect } from "react";
import { LIGHT_THEME, DARK_THEME, toStyle } from "./Theme";
const VuiContext = createContext(undefined);
export const VuiContextProvider = ({ children, linkProvider, pathProvider, drawerTitle = "h2", theme = LIGHT_THEME, portalContainer = document.body, isThemeIsolated }) => {
    const createLink = (linkConfig) => {
        if (!linkProvider || linkConfig.download) {
            const { className, href, onClick, children, ref } = linkConfig, rest = __rest(linkConfig, ["className", "href", "onClick", "children", "ref"]);
            // To support downloads, we must use anchor tags, not a react-router Link.
            return (_jsx("a", Object.assign({ className: className, href: href, onClick: onClick }, rest, { children: children })));
        }
        return linkProvider(linkConfig);
    };
    const getPath = () => {
        return pathProvider ? pathProvider() : window.location.pathname;
    };
    const DrawerTitle = drawerTitle;
    const cssVariables = useMemo(() => {
        // Map the JS properties (camelCase) to CSS variables (kebab-case)
        return toStyle(theme);
    }, [theme]);
    useEffect(() => {
        if (isThemeIsolated)
            return;
        // Apply the CSS variables to the document root
        const root = document.documentElement;
        Object.entries(cssVariables).forEach(([key, value]) => {
            root.style.setProperty(key, value);
        });
    }, [isThemeIsolated, cssVariables]);
    const getThemeStyle = (theme) => {
        if (theme === "dark") {
            return toStyle(DARK_THEME);
        }
        return toStyle(LIGHT_THEME);
    };
    const themedChildren = isThemeIsolated ? _jsx("div", Object.assign({ style: cssVariables }, { children: children })) : children;
    return (_jsx(VuiContext.Provider, Object.assign({ value: { createLink, getPath, DrawerTitle, getThemeStyle, portalContainer } }, { children: themedChildren })));
};
export const useVuiContext = () => {
    const context = useContext(VuiContext);
    if (context === undefined) {
        throw new Error("useVuiContext must be used within a VuiContextProvider");
    }
    return context;
};