/*! © 2026 Yahoo, Inc. UDS Tailwind and Purger v0.0.0-development */
import { FONT_FAMILY_PREFIX } from "../../css-tokens/dist/index.js";
import { entries } from "../../utils/entries.js";
import { fromEntries } from "../../utils/fromEntries.js";
import { FONT_DECLARATIONS_MAP } from "../../fonts/dist/index.js";

//#region src/tailwind/utils/getFontStyles.ts
/**
* Tailwind does not automatically escape font names for you.
* If you’re using a font that contains an invalid identifier, wrap it in quotes or escape the invalid characters.
* @link https://tailwindcss.com/docs/font-family#customizing-your-theme:~:text=Tailwind%20does%20not%20automatically
*/
function escapeFontFamilyName(fontFamily) {
	return `"${fontFamily}"`;
}
/**
* Return CSS variables object based on font config.
* i.e. { --font-xyz: '"Font Family 1", "Font Family 2", sans-serif' }
*
* @example
* // 1. Use return value in style prop of an html element to assign font variables at runtime
*
* const fontVars = getFontStyles(fontConfig);
* <body style={fontVars}> {...} </body>
*
* // 2. Generate CSS at build time in tailwind plugin via addBase.
*
* const fontVars = getFontStyles(fontConfig);
* addBase(fontVars);
*
*/
function getFontStyles(fontConfig) {
	return fromEntries(entries(fontConfig).map(([fontAlias, fontID]) => {
		const cssVar = `--${FONT_FAMILY_PREFIX}-${fontAlias}`;
		const font = FONT_DECLARATIONS_MAP[fontID];
		return [cssVar, [font.fontFamily, ...font.fallback].map(escapeFontFamilyName).join(", ")];
	}));
}

//#endregion
export { getFontStyles };
//# sourceMappingURL=getFontStyles.js.map