@tenphi/tasty 0.0.0-snapshot.056b911

package/dist/config.js

@@ -0,0 +1,584 @@
+import { resetColorSpace, setColorSpace } from "./utils/color-space.js";
+import { isDevEnv } from "./utils/is-dev-env.js";
+import { CUSTOM_UNITS, getGlobalFuncs, getGlobalParser, normalizeColorTokenValue, resetGlobalPredefinedTokens, setGlobalPredefinedTokens } from "./utils/styles.js";
+import { normalizeHandlerDefinition, registerHandler, resetHandlers } from "./styles/predefined.js";
+import { StyleInjector } from "./injector/injector.js";
+import { setGlobalPredefinedStates } from "./states/index.js";
+import { clearPipelineCache, isSelector, renderStyles } from "./pipeline/index.js";
+import { generateTypographyTokens } from "./utils/typography.js";
+//#region src/config.ts
+/**
+* Tasty Configuration Module
+*
+* Centralizes all tasty configuration, including:
+* - Style injector settings (nonce, cleanup thresholds, etc.)
+* - Global predefined states for advanced state mapping
+* - stylesGenerated flag that locks configuration after first style generation
+*
+* Configuration must be done BEFORE any styles are generated.
+* After the first `inject()` call, configuration is locked and attempts to
+* reconfigure will emit a warning and be ignored.
+*/
+const emittedWarnings = /* @__PURE__ */ new Set();
+const devMode = isDevEnv();
+/**
+* Emit a warning only once
+*/
+function warnOnce(key, message) {
+	if (devMode && !emittedWarnings.has(key)) {
+		emittedWarnings.add(key);
+		console.warn(message);
+	}
+}
+let stylesGenerated = false;
+let currentConfig = null;
+let globalKeyframes = null;
+let globalFontFace = null;
+let globalCounterStyle = null;
+let globalProperties = null;
+let globalRecipes = null;
+let globalConfigTokens = null;
+let globalBodyStyles = null;
+const GTKEY_TOKENS = "__tasty_cfg_tokens__";
+const GTKEY_FONT_FACE = "__tasty_cfg_font_face__";
+const GTKEY_COUNTER_STYLE = "__tasty_cfg_counter_style__";
+const GTKEY_PROPERTIES = "__tasty_cfg_properties__";
+const GTKEY_BODY_STYLES = "__tasty_cfg_body_styles__";
+function setOnGlobalThis(key, value) {
+	globalThis[key] = value;
+}
+function getFromGlobalThis(key) {
+	return globalThis[key];
+}
+function clearGlobalThisConfig() {
+	const g = globalThis;
+	delete g[GTKEY_TOKENS];
+	delete g[GTKEY_FONT_FACE];
+	delete g[GTKEY_COUNTER_STYLE];
+	delete g[GTKEY_PROPERTIES];
+	delete g[GTKEY_BODY_STYLES];
+}
+/**
+* Default properties shipped with tasty.
+* These are always included unless explicitly overridden via `configure({ properties })`.
+* Keys use tasty token syntax (#name for colors, $name for other properties).
+*
+* For properties with CSS @property-compatible types (length, time, number, color),
+* an `initialValue` is provided so the property works even without a project-level token.
+*/
+const DEFAULT_PROPERTIES = {
+	"#tasty-second-fill": {
+		inherits: false,
+		initialValue: "transparent"
+	},
+	"#current": {
+		inherits: true,
+		initialValue: "transparent"
+	},
+	"#white": {
+		inherits: true,
+		initialValue: "rgb(255 255 255)"
+	},
+	"#black": {
+		inherits: true,
+		initialValue: "rgb(0 0 0)"
+	},
+	"#clear": {
+		inherits: true,
+		initialValue: "transparent"
+	},
+	"#border": {
+		inherits: true,
+		initialValue: "rgb(0 0 0)"
+	},
+	$gap: {
+		syntax: "<length>",
+		inherits: true,
+		initialValue: "4px"
+	},
+	$radius: {
+		syntax: "<length>",
+		inherits: true,
+		initialValue: "6px"
+	},
+	"$border-width": {
+		syntax: "<length>",
+		inherits: true,
+		initialValue: "1px"
+	},
+	"$outline-width": {
+		syntax: "<length>",
+		inherits: true,
+		initialValue: "3px"
+	},
+	$transition: {
+		syntax: "<time>",
+		inherits: true,
+		initialValue: "80ms"
+	},
+	"$sharp-radius": {
+		syntax: "<length>",
+		inherits: true,
+		initialValue: "0px"
+	},
+	"$bold-font-weight": {
+		syntax: "<number>",
+		inherits: true,
+		initialValue: "700"
+	},
+	"$font-sans-fallback": {
+		syntax: "*",
+		inherits: true,
+		initialValue: "system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, \"Apple Color Emoji\", \"Segoe UI Emoji\", sans-serif"
+	},
+	"$font-mono-fallback": {
+		syntax: "*",
+		inherits: true,
+		initialValue: "ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace"
+	}
+};
+const GLOBAL_INJECTOR_KEY = "__TASTY_GLOBAL_INJECTOR__";
+/**
+* Detect if we're running in a test environment
+*/
+function isTestEnvironment() {
+	if (typeof global !== "undefined") {
+		const g = global;
+		if (g.vi || g.jest || g.expect || g.describe || g.it) return true;
+	}
+	if (typeof window !== "undefined" && window.navigator?.userAgent?.includes("jsdom")) return true;
+	if (typeof globalThis !== "undefined") {
+		const gt = globalThis;
+		if (gt.vitest || gt.mocha) return true;
+	}
+	return false;
+}
+/**
+* Create default configuration with optional test environment detection
+*/
+function createDefaultConfig(isTest) {
+	return {
+		maxRulesPerSheet: 8192,
+		forceTextInjection: isTest ?? false,
+		devMode: isDevEnv()
+	};
+}
+/**
+* Mark that styles have been generated (called by injector on first inject)
+* This locks the configuration - no further changes allowed.
+* Also injects internal and global properties.
+*/
+function markStylesGenerated() {
+	if (stylesGenerated) return;
+	stylesGenerated = true;
+	const injector = getGlobalInjector();
+	for (const [token, definition] of Object.entries(getEffectiveProperties())) injector.property(token, definition);
+	if (globalFontFace && Object.keys(globalFontFace).length > 0) for (const [family, input] of Object.entries(globalFontFace)) {
+		const descriptors = Array.isArray(input) ? input : [input];
+		for (const desc of descriptors) injector.fontFace(family, desc);
+	}
+	if (globalCounterStyle && Object.keys(globalCounterStyle).length > 0) for (const [name, descriptors] of Object.entries(globalCounterStyle)) injector.counterStyle(name, descriptors);
+	if (globalConfigTokens && Object.keys(globalConfigTokens).length > 0) {
+		const tokenRules = renderStyles(globalConfigTokens, ":root");
+		if (tokenRules.length > 0) injector.injectGlobal(tokenRules);
+	}
+	if (globalBodyStyles && Object.keys(globalBodyStyles).length > 0) {
+		const bodyRules = renderStyles(globalBodyStyles, "body");
+		if (bodyRules.length > 0) injector.injectGlobal(bodyRules);
+	}
+}
+/**
+* Check if styles have been generated (configuration is locked)
+*/
+function hasStylesGenerated() {
+	return stylesGenerated;
+}
+let _hasGlobalKeyframes = false;
+/**
+* Check if any global keyframes are configured.
+* Uses a pre-computed flag to avoid Object.keys() allocation on every call.
+*/
+function hasGlobalKeyframes() {
+	return _hasGlobalKeyframes;
+}
+/**
+* Get global keyframes configuration.
+* Returns null if no keyframes configured (fast path for zero-overhead).
+*/
+function getGlobalKeyframes() {
+	return globalKeyframes;
+}
+/**
+* Set global keyframes (called from configure).
+* Internal use only.
+*/
+function setGlobalKeyframes(keyframes) {
+	if (stylesGenerated) {
+		warnOnce("keyframes-after-styles", "[Tasty] Cannot update keyframes after styles have been generated.\nThe new keyframes will be ignored.");
+		return;
+	}
+	globalKeyframes = keyframes;
+	_hasGlobalKeyframes = Object.keys(keyframes).length > 0;
+}
+/**
+* Set global properties (called from configure).
+* Internal use only.
+*/
+function setGlobalProperties(properties) {
+	if (stylesGenerated) {
+		warnOnce("properties-after-styles", "[Tasty] Cannot update properties after styles have been generated.\nThe new properties will be ignored.");
+		return;
+	}
+	globalProperties = properties;
+	setOnGlobalThis(GTKEY_PROPERTIES, globalProperties);
+}
+/**
+* Get the effective properties: DEFAULT_PROPERTIES merged with user-configured
+* properties. User properties override defaults with matching keys.
+* Reads from globalThis first for cross-module SSR support.
+*/
+function getEffectiveProperties() {
+	const props = globalProperties ?? getFromGlobalThis(GTKEY_PROPERTIES);
+	if (!props) return DEFAULT_PROPERTIES;
+	return {
+		...DEFAULT_PROPERTIES,
+		...props
+	};
+}
+/**
+* Get global font-face configuration.
+* Returns null if no font faces configured.
+* Reads from globalThis first for cross-module SSR support.
+*/
+function getGlobalFontFace() {
+	return globalFontFace ?? getFromGlobalThis(GTKEY_FONT_FACE) ?? null;
+}
+/**
+* Set global font faces (called from configure).
+* Internal use only.
+*/
+function setGlobalFontFace(fontFace) {
+	if (stylesGenerated) {
+		warnOnce("fontface-after-styles", "[Tasty] Cannot update fontFace after styles have been generated.\nThe new font faces will be ignored.");
+		return;
+	}
+	globalFontFace = fontFace;
+	setOnGlobalThis(GTKEY_FONT_FACE, globalFontFace);
+}
+/**
+* Get global counter-style configuration.
+* Returns null if no counter styles configured.
+* Reads from globalThis first for cross-module SSR support.
+*/
+function getGlobalCounterStyle() {
+	return globalCounterStyle ?? getFromGlobalThis(GTKEY_COUNTER_STYLE) ?? null;
+}
+/**
+* Set global counter styles (called from configure).
+* Internal use only.
+*/
+function setGlobalCounterStyle(counterStyle) {
+	if (stylesGenerated) {
+		warnOnce("counterstyle-after-styles", "[Tasty] Cannot update counterStyle after styles have been generated.\nThe new counter styles will be ignored.");
+		return;
+	}
+	globalCounterStyle = counterStyle;
+	setOnGlobalThis(GTKEY_COUNTER_STYLE, globalCounterStyle);
+}
+/**
+* Check if any global recipes are configured.
+* Fast path: returns false if no recipes were ever set.
+*/
+function hasGlobalRecipes() {
+	return globalRecipes !== null && Object.keys(globalRecipes).length > 0;
+}
+/**
+* Get global recipes configuration.
+* Returns null if no recipes configured (fast path for zero-overhead).
+*/
+function getGlobalRecipes() {
+	return globalRecipes;
+}
+/**
+* Set global recipes (called from configure).
+* Internal use only.
+*/
+function setGlobalRecipes(recipes) {
+	if (stylesGenerated) {
+		warnOnce("recipes-after-styles", "[Tasty] Cannot update recipes after styles have been generated.\nThe new recipes will be ignored.");
+		return;
+	}
+	if (devMode) for (const [name, recipeStyles] of Object.entries(recipes)) {
+		if (name === "none") warnOnce("recipe-reserved-none", "[Tasty] Recipe name \"none\" is reserved. It is used as a keyword meaning \"no base recipes\" (e.g. recipe: 'none / post-recipe'). Choose a different name for your recipe.");
+		for (const key of Object.keys(recipeStyles)) {
+			if (isSelector(key)) warnOnce(`recipe-selector-${name}-${key}`, `[Tasty] Recipe "${name}" contains sub-element key "${key}". Recipes must be flat styles without sub-element keys. Remove the sub-element key from the recipe definition.`);
+			if (key === "recipe") warnOnce(`recipe-recursive-${name}`, `[Tasty] Recipe "${name}" contains a "recipe" key. Recipes cannot reference other recipes. Use space-separated names for composition: recipe: 'base elevated'.`);
+		}
+	}
+	globalRecipes = recipes;
+}
+/**
+* Get global token styles for :root injection.
+* Returns null if no tokens configured.
+* Reads from globalThis first for cross-module SSR support.
+*/
+function getGlobalConfigTokens() {
+	return globalConfigTokens ?? getFromGlobalThis(GTKEY_TOKENS) ?? null;
+}
+/**
+* Set global token styles (called from configure).
+* Internal use only.
+*/
+function setGlobalConfigTokens(styles) {
+	if (stylesGenerated) {
+		warnOnce("tokens-after-styles", "[Tasty] Cannot update tokens after styles have been generated.\nThe new tokens will be ignored.");
+		return;
+	}
+	globalConfigTokens = globalConfigTokens ? {
+		...globalConfigTokens,
+		...styles
+	} : styles;
+	setOnGlobalThis(GTKEY_TOKENS, globalConfigTokens);
+}
+/**
+* Get global body styles for injection.
+* Returns null if no body styles configured.
+* Reads from globalThis first for cross-module SSR support.
+*/
+function getGlobalBodyStyles() {
+	return globalBodyStyles ?? getFromGlobalThis(GTKEY_BODY_STYLES) ?? null;
+}
+/**
+* Set global body styles (called from configure).
+* Internal use only.
+*/
+function setGlobalBodyStyles(styles) {
+	if (stylesGenerated) {
+		warnOnce("bodyStyles-after-styles", "[Tasty] Cannot update bodyStyles after styles have been generated.\nThe new body styles will be ignored.");
+		return;
+	}
+	globalBodyStyles = globalBodyStyles ? {
+		...globalBodyStyles,
+		...styles
+	} : styles;
+	setOnGlobalThis(GTKEY_BODY_STYLES, globalBodyStyles);
+}
+/**
+* Check if configuration is locked (styles have been generated)
+*/
+function isConfigLocked() {
+	return stylesGenerated;
+}
+/**
+* Configure the Tasty style system.
+*
+* Must be called BEFORE any styles are generated (before first render that uses tasty).
+* After styles are generated, configuration is locked and calls to configure() will
+* emit a warning and be ignored.
+*
+* @example
+* ```ts
+* import { configure } from '@tenphi/tasty';
+*
+* // Configure before app renders
+* configure({
+*   nonce: 'abc123',
+*   states: {
+*     '@mobile': '@media(w < 768px)',
+*     '@dark': '@root(theme=dark)',
+*   },
+* });
+* ```
+*/
+function configure(config = {}) {
+	if (stylesGenerated) {
+		warnOnce("configure-after-styles", "[Tasty] Cannot call configure() after styles have been generated.\nConfiguration must be done before the first render. The configuration will be ignored.");
+		return;
+	}
+	let mergedStates = {};
+	let mergedUnits = {};
+	let mergedFuncs = {};
+	let mergedHandlers = {};
+	let mergedReplaceTokens = {};
+	let mergedConfigTokens = {};
+	let mergedRecipes = {};
+	let mergedPresets = {};
+	let mergedBodyStyles;
+	if (config.plugins) for (const plugin of config.plugins) {
+		if (plugin.states) mergedStates = {
+			...mergedStates,
+			...plugin.states
+		};
+		if (plugin.units) mergedUnits = {
+			...mergedUnits,
+			...plugin.units
+		};
+		if (plugin.funcs) mergedFuncs = {
+			...mergedFuncs,
+			...plugin.funcs
+		};
+		if (plugin.handlers) mergedHandlers = {
+			...mergedHandlers,
+			...plugin.handlers
+		};
+		if (plugin.replaceTokens) mergedReplaceTokens = {
+			...mergedReplaceTokens,
+			...plugin.replaceTokens
+		};
+		if (plugin.tokens) mergedConfigTokens = {
+			...mergedConfigTokens,
+			...plugin.tokens
+		};
+		if (plugin.recipes) mergedRecipes = {
+			...mergedRecipes,
+			...plugin.recipes
+		};
+		if (plugin.presets) mergedPresets = {
+			...mergedPresets,
+			...plugin.presets
+		};
+		if (plugin.bodyStyles) mergedBodyStyles = mergedBodyStyles ? {
+			...mergedBodyStyles,
+			...plugin.bodyStyles
+		} : plugin.bodyStyles;
+	}
+	if (config.states) mergedStates = {
+		...mergedStates,
+		...config.states
+	};
+	if (config.units) mergedUnits = {
+		...mergedUnits,
+		...config.units
+	};
+	if (config.funcs) mergedFuncs = {
+		...mergedFuncs,
+		...config.funcs
+	};
+	if (config.handlers) mergedHandlers = {
+		...mergedHandlers,
+		...config.handlers
+	};
+	if (config.replaceTokens) mergedReplaceTokens = {
+		...mergedReplaceTokens,
+		...config.replaceTokens
+	};
+	if (config.presets) mergedPresets = {
+		...mergedPresets,
+		...config.presets
+	};
+	if (Object.keys(mergedPresets).length > 0) mergedConfigTokens = {
+		...generateTypographyTokens(mergedPresets),
+		...mergedConfigTokens
+	};
+	if (config.tokens) mergedConfigTokens = {
+		...mergedConfigTokens,
+		...config.tokens
+	};
+	if (config.recipes) mergedRecipes = {
+		...mergedRecipes,
+		...config.recipes
+	};
+	if (config.bodyStyles) mergedBodyStyles = mergedBodyStyles ? {
+		...mergedBodyStyles,
+		...config.bodyStyles
+	} : config.bodyStyles;
+	if (devMode) {
+		const tokenKeys = new Set(Object.keys(mergedConfigTokens));
+		for (const key of Object.keys(mergedReplaceTokens)) if (tokenKeys.has(key)) warnOnce(`token-conflict-${key}`, `[Tasty] Token "${key}" is defined in both \`tokens\` and \`replaceTokens\`. \`replaceTokens\` performs parse-time substitution, so the \`tokens\` CSS custom property will be injected but never used by Tasty styles. Remove it from one of the two.`);
+	}
+	if (config.colorSpace) {
+		setColorSpace(config.colorSpace);
+		getGlobalParser().clearCache();
+	}
+	if (Object.keys(mergedStates).length > 0) setGlobalPredefinedStates(mergedStates);
+	const parser = getGlobalParser();
+	if (config.parserCacheSize !== void 0) parser.updateOptions({ cacheSize: config.parserCacheSize });
+	if (Object.keys(mergedUnits).length > 0) {
+		const currentUnits = parser.getUnits() ?? CUSTOM_UNITS;
+		parser.setUnits({
+			...currentUnits,
+			...mergedUnits
+		});
+	}
+	if (Object.keys(mergedFuncs).length > 0) {
+		const currentFuncs = getGlobalFuncs();
+		const finalFuncs = {
+			...currentFuncs,
+			...mergedFuncs
+		};
+		parser.setFuncs(finalFuncs);
+		Object.assign(currentFuncs, mergedFuncs);
+	}
+	if (config.keyframes) setGlobalKeyframes(config.keyframes);
+	if (config.properties) setGlobalProperties(config.properties);
+	if (config.fontFace) setGlobalFontFace(config.fontFace);
+	if (config.counterStyle) setGlobalCounterStyle(config.counterStyle);
+	if (Object.keys(mergedHandlers).length > 0) for (const [name, definition] of Object.entries(mergedHandlers)) registerHandler(normalizeHandlerDefinition(name, definition));
+	if (Object.keys(mergedReplaceTokens).length > 0) {
+		const processedTokens = {};
+		for (const [key, value] of Object.entries(mergedReplaceTokens)) if (key.startsWith("#")) {
+			const normalized = normalizeColorTokenValue(value);
+			if (normalized === null) continue;
+			processedTokens[key] = String(normalized);
+		} else if (value === false) continue;
+		else processedTokens[key] = String(value);
+		setGlobalPredefinedTokens(processedTokens);
+	}
+	if (Object.keys(mergedConfigTokens).length > 0) setGlobalConfigTokens(mergedConfigTokens);
+	if (Object.keys(mergedRecipes).length > 0) setGlobalRecipes(mergedRecipes);
+	if (mergedBodyStyles && Object.keys(mergedBodyStyles).length > 0) setGlobalBodyStyles(mergedBodyStyles);
+	const { states: _states, parserCacheSize: _parserCacheSize, units: _units, funcs: _funcs, plugins: _plugins, keyframes: _keyframes, properties: _properties, fontFace: _fontFace, counterStyle: _counterStyle, handlers: _handlers, tokens: _tokens, replaceTokens: _replaceTokens, recipes: _recipes, colorSpace: _colorSpace, presets: _presets, bodyStyles: _bodyStyles, ...injectorConfig } = config;
+	const fullConfig = {
+		...createDefaultConfig(),
+		...currentConfig,
+		...injectorConfig
+	};
+	currentConfig = fullConfig;
+	const storage = typeof window !== "undefined" ? window : globalThis;
+	storage[GLOBAL_INJECTOR_KEY] = new StyleInjector(fullConfig);
+}
+/**
+* Get the current configuration.
+* If not configured, returns default configuration.
+*/
+function getConfig() {
+	if (!currentConfig) currentConfig = createDefaultConfig(isTestEnvironment());
+	return currentConfig;
+}
+/**
+* Get the global injector instance.
+* Auto-configures with defaults if not already configured.
+*/
+function getGlobalInjector() {
+	const storage = typeof window !== "undefined" ? window : globalThis;
+	if (!storage[GLOBAL_INJECTOR_KEY]) configure();
+	return storage[GLOBAL_INJECTOR_KEY];
+}
+/**
+* Reset configuration (for testing only).
+* Clears the global injector and allows reconfiguration.
+*/
+function resetConfig() {
+	stylesGenerated = false;
+	currentConfig = null;
+	globalKeyframes = null;
+	_hasGlobalKeyframes = false;
+	globalProperties = null;
+	globalFontFace = null;
+	globalCounterStyle = null;
+	globalRecipes = null;
+	globalConfigTokens = null;
+	globalBodyStyles = null;
+	clearGlobalThisConfig();
+	resetGlobalPredefinedTokens();
+	resetHandlers();
+	resetColorSpace();
+	clearPipelineCache();
+	emittedWarnings.clear();
+	const storage = typeof window !== "undefined" ? window : globalThis;
+	delete storage[GLOBAL_INJECTOR_KEY];
+}
+//#endregion
+export { configure, getConfig, getEffectiveProperties, getGlobalBodyStyles, getGlobalConfigTokens, getGlobalCounterStyle, getGlobalFontFace, getGlobalInjector, getGlobalKeyframes, getGlobalRecipes, hasGlobalKeyframes, hasGlobalRecipes, hasStylesGenerated, isConfigLocked, isTestEnvironment, markStylesGenerated, resetConfig };
+
+//# sourceMappingURL=config.js.map