@undp/design-system-react/dist/ConfigProvider.js

React based design system for UNDP

import { useEffect as e } from "react";
import { jsx as t } from "react/jsx-runtime";
//#region src/ConfigProvider.tsx
var n = (e, t, n) => {
	n !== void 0 && e.style.setProperty(t, n);
}, r = (e, t, r) => {
	r && (n(e, `--${t}`, r.base), n(e, `--${t}-hover`, r.hover), n(e, `--${t}-light`, r.light));
}, i = (e, t, r) => {
	r && (n(e, `--${t}-200`, r[200]), n(e, `--${t}-400`, r[400]), n(e, `--${t}-600`, r[600]));
}, a = ({ children: a, config: o, rtl: s }) => (e(() => {
	if (o) {
		let e = document.documentElement;
		n(e, "--blue-100", o.blue?.["100"]), n(e, "--blue-200", o.blue?.["200"]), n(e, "--blue-300", o.blue?.["300"]), n(e, "--blue-400", o.blue?.["400"]), n(e, "--blue-500", o.blue?.["500"]), n(e, "--blue-600", o.blue?.["600"]), n(e, "--blue-700", o.blue?.["700"]), n(e, "--gray-100", o.gray?.["100"]), n(e, "--gray-200", o.gray?.["200"]), n(e, "--gray-300", o.gray?.["300"]), n(e, "--gray-400", o.gray?.["400"]), n(e, "--gray-500", o.gray?.["500"]), n(e, "--gray-530", o.gray?.["530"]), n(e, "--gray-560", o.gray?.["560"]), n(e, "--gray-600", o.gray?.["600"]), n(e, "--gray-700", o.gray?.["700"]), i(e, "blue", o.blue), i(e, "gray", o.gray), i(e, "yellow", o.yellow), i(e, "red", o.red), i(e, "green", o.green), i(e, "azure", o.azure), r(e, "error", o.error), r(e, "warning", o.warning), r(e, "success", o.success), r(e, "info", o.info), r(e, "primary", o.primary), r(e, "secondary", o.secondary), r(e, "tertiary", o.tertiary), r(e, "quaternary", o.quaternary), n(e, "--content-primary", o.content?.primary), n(e, "--content-secondary", o.content?.secondary), n(e, "--content-tertiary", o.content?.tertiary), n(e, "--content-quaternary", o.content?.quaternary), n(e, "--content-placeholder", o.content?.placeholder), n(e, "--content-disabled", o.content?.disabled), n(e, "--content-reverse", o.content?.reverse), n(e, "--surface", o.surface?.base), n(e, "--surface-hover", o.surface?.hover), n(e, "--surface-hard", o.surface?.hard), n(e, "--surface-hard-hover", o.surface?.hardHover), n(e, "--surface-2xs", o.surface?.["2xs"]), n(e, "--surface-xs", o.surface?.xs), n(e, "--surface-sm", o.surface?.sm), n(e, "--surface-md", o.surface?.md), n(e, "--surface-lg", o.surface?.lg), n(e, "--surface-xl", o.surface?.xl), n(e, "--surface-2xl", o.surface?.["2xl"]), n(e, "--surface-3xl", o.surface?.["3xl"]), n(e, "--surface-4xl", o.surface?.["4xl"]), n(e, "--stroke", o.stroke?.base), n(e, "--stroke-hover", o.stroke?.hover), n(e, "--stroke-2xs", o.stroke?.["2xs"]), n(e, "--stroke-xs", o.stroke?.xs), n(e, "--stroke-sm", o.stroke?.sm), n(e, "--stroke-md", o.stroke?.md), n(e, "--stroke-lg", o.stroke?.lg), n(e, "--stroke-xl", o.stroke?.xl), n(e, "--stroke-2xl", o.stroke?.["2xl"]), n(e, "--stroke-3xl", o.stroke?.["3xl"]), n(e, "--stroke-4xl", o.stroke?.["4xl"]), n(e, "--font-body", o.fonts?.body), n(e, "--font-sans", o.fonts?.sans), n(e, "--font-heading", o.fonts?.heading), n(e, "--font-mono", o.fonts?.mono), n(e, "--font-serif", o.fonts?.serif), n(e, "--foreground", o.foreground), n(e, "--foreground-soft", o.foregroundSoft), n(e, "--background", o.background), n(e, "--background-soft", o.backgroundSoft), n(e, "--ring", o.ring), n(e, "--card-hover-color", o.cardHoverColor), n(e, "--footer-background", o.footerBackground), n(e, "--opacity-disabled", o.opacityDisabled), [
			"h1",
			"h2",
			"h3",
			"h4",
			"h5",
			"h6",
			"p"
		].forEach((t) => {
			let r = o.typography?.[t];
			n(e, `--text-${t}`, r?.base), n(e, `--text-${t}-sm`, r?.sm), n(e, `--text-${t}-xs`, r?.xs);
		}), n(e, "--text-2xl", o.typography?.["2xl"]), n(e, "--text-xl", o.typography?.xl), n(e, "--text-lg", o.typography?.lg), n(e, "--text-base", o.typography?.base), n(e, "--text-sm", o.typography?.sm), n(e, "--text-xs", o.typography?.xs), n(e, "--text-2xs", o.typography?.["2xs"]), n(e, "--leading-h1", o.leading?.h1), n(e, "--leading-h2", o.leading?.h2), n(e, "--leading-h3", o.leading?.h3), n(e, "--leading-h4", o.leading?.h4), n(e, "--leading-h5", o.leading?.h5), n(e, "--leading-h6", o.leading?.h6), n(e, "--leading-p", o.leading?.p), n(e, "--leading-2xl", o.leading?.["2xl"]), n(e, "--leading-xl", o.leading?.xl), n(e, "--leading-lg", o.leading?.lg), n(e, "--leading-base", o.leading?.base), n(e, "--leading-sm", o.leading?.sm), n(e, "--leading-xs", o.leading?.xs), n(e, "--rounded-base", o.rounded?.base), n(e, "--rounded-sm", o.rounded?.sm), n(e, "--rounded-md", o.rounded?.md), n(e, "--rounded-lg", o.rounded?.lg), n(e, "--rounded-xl", o.rounded?.xl), n(e, "--rounded-2xl", o.rounded?.["2xl"]), n(e, "--blur-frosted", o.blurFrosted);
	}
}, [o]), /* @__PURE__ */ t("div", {
	dir: s ? "rtl" : void 0,
	children: a
}));
//#endregion
export { a as ConfigProvider };

//# sourceMappingURL=ConfigProvider.js.map