@tenphi/tasty 2.11.1 → 3.0.0

package/dist/index.js

@@ -1,9 +1,9 @@
-import { $ as parseColor, A as StyleInjector, B as styleHandlers, C as parseStateKey, Dt as hslToRgbValues, Et as hexToRgb, F as fontFaceContentHash, G as CUSTOM_UNITS, H as warn, I as formatFontFaceRule, J as filterMods, K as DIRECTIONS, M as formatCounterStyleRule, O as getGlobalPredefinedStates, Ot as strToRgb, Q as normalizeColorTokenValue, R as SheetManager, S as renderStyles, T as createStateParserContext, Tt as getRgbValuesFromRgbaString, V as deprecationWarning, X as getGlobalParser, Y as getGlobalFuncs, Z as getGlobalPredefinedTokens, a as getGlobalCounterStyle, at as okhstPlugin, c as getGlobalKeyframes, ct as StyleParser, d as getNamePrefix, dt as DEFAULT_ZERO_NAME_PREFIX, et as parseStyle, f as hasGlobalKeyframes, g as isTestEnvironment, h as isConfigLocked, it as okhstFunc, k as setGlobalPredefinedStates, l as getGlobalRecipes, lt as Bucket, m as hasStylesGenerated, mt as makeKeyframeName, n as getConfig, nt as setGlobalPredefinedTokens, o as getGlobalFontFace, ot as okhslFunc, p as hasGlobalRecipes, pt as makeCounterStyleName, q as customFunc, rt as stringifyStyles, s as getGlobalInjector, st as okhslPlugin, t as configure, tt as resetGlobalPredefinedTokens, ut as DEFAULT_NAME_PREFIX, v as resetConfig, vt as hashString, wt as getNamedColorHex, x as isSelector, y as generateTypographyTokens } from "./config-YDAcLaVf.js";
-import { _ as categorizeStyleKeys, d as DIMENSION_CHUNK_STYLES, f as DISPLAY_CHUNK_STYLES, g as STYLE_TO_CHUNK, h as POSITION_CHUNK_STYLES, l as APPEARANCE_CHUNK_STYLES, m as LAYOUT_CHUNK_STYLES, p as FONT_CHUNK_STYLES, u as CHUNK_NAMES } from "./keyframes-CtcSlw4k.js";
-import { A as property, B as DIMENSION_STYLES, C as getRawCSSText, D as injector, E as injectRawCSS, F as BLOCK_INNER_STYLES, G as TEXT_STYLES, H as INNER_STYLES, I as BLOCK_OUTER_STYLES, L as BLOCK_STYLES, M as ChunkSheetRegistry, N as chunkSheetRegistry, O as isPropertyDefined, P as BASE_STYLES, R as COLOR_STYLES, S as getIsTestEnvironment, T as injectGlobal, U as OUTER_STYLES, V as FLOW_STYLES, W as POSITION_STYLES, _ as destroy, a as color, b as getCssText, c as hasKeys, d as collectAutoInferredPropertiesRSC, f as getStyleTarget, g as createInjector, h as counterStyle, i as _modAttrs, j as touch, k as keyframes, l as formatKeyframesCSS, m as cleanup, n as processTokens, o as filterBaseProps, p as pushRSCCSS, r as dotize, s as computeStyles, t as tastyDebug, u as collectAutoInferredProperties, v as fontFace, w as inject, x as getCssTextForNode, y as gc, z as CONTAINER_STYLES } from "./core-CS4bzqGu.js";
-import { n as formatPropertyCSS } from "./format-rules-CYriCDwq.js";
-import { t as mergeStyles } from "./merge-styles-D4ITH4bc.js";
-import { t as resolveRecipes } from "./resolve-recipes-llr0COs8.js";
+import { $ as SheetManager, $t as getNamedColorHex, A as FLOW_STYLES, At as registerFunctionPolyfill, B as createStateParserContext, Bt as stringifyStyles, C as BASE_STYLES, Ct as LAYOUT_CHUNK_STYLES, D as COLOR_STYLES, Dt as formatFunctionRule, E as BLOCK_STYLES, Ft as getGlobalParser, G as StyleInjector, Gt as createColorFunc, Ht as okhstPlugin, I as isSelector, It as getGlobalPredefinedTokens, L as renderStyles, Lt as normalizeColorTokenValue, M as OUTER_STYLES, Mt as CUSTOM_UNITS, N as POSITION_STYLES, Nt as DIRECTIONS, O as CONTAINER_STYLES, P as TEXT_STYLES, Pt as filterMods, R as parseStateKey, Rt as parseColor, S as baseStylePropsRegistry, St as FONT_CHUNK_STYLES, T as BLOCK_OUTER_STYLES, Tt as STYLE_TO_CHUNK, U as getGlobalPredefinedStates, Ut as okhslFunction, Vt as okhstFunction, W as setGlobalPredefinedStates, Wt as okhslPlugin, X as fontFaceContentHash, Z as formatFontFaceRule, _ as isFunctionsPolyfillEnabled, _t as propHandlerRegistry, a as getGlobalCounterStyles, at as DEFAULT_NAME_PREFIX, b as resetConfig, bt as DIMENSION_CHUNK_STYLES, c as getGlobalInjector, ct as makeCounterStyleName, en as getRgbValuesFromRgbaString, f as getNamePrefix, ft as hashString, g as isConfigLocked, h as hasStylesGenerated, in as resolveFunctionColor, j as INNER_STYLES, k as DIMENSION_STYLES, kt as parseFunctionName, l as getGlobalKeyframes, lt as makeKeyframeName, m as hasGlobalRecipes, n as getConfig, nn as hslToRgbValues, nt as styleHandlers, o as getGlobalFontFaces, ot as DEFAULT_ZERO_NAME_PREFIX, p as hasGlobalKeyframes, q as formatCounterStyleRule, qt as StyleParser, rn as strToRgb, s as getGlobalFunctions, t as configure, tn as hexToRgb, tt as defineHandler, u as getGlobalRecipes, v as isTestEnvironment, vt as APPEARANCE_CHUNK_STYLES, w as BLOCK_INNER_STYLES, wt as POSITION_CHUNK_STYLES, x as generateTypographyTokens, xt as DISPLAY_CHUNK_STYLES, yt as CHUNK_NAMES, zt as parseStyle } from "./config-CCcE_tqx.js";
+import { l as categorizeStyleKeys } from "./keyframes-B8M1FmtE.js";
+import { A as property, C as getRawCSSText, D as injector, E as injectRawCSS, M as ChunkSheetRegistry, N as chunkSheetRegistry, O as isPropertyDefined, S as getCSSTextForNode, T as injectGlobal, _ as destroy, a as color, b as gc, c as hasKeys, d as collectAutoInferredPropertiesRSC, f as getStyleTarget, g as createInjector, h as counterStyle, i as _modAttrs, j as touch, k as keyframes, l as formatKeyframesCSS, m as cleanup, n as processTokens, o as filterBaseProps, p as pushRSCCSS, r as dotize, s as computeStyles, t as tastyDebug, u as collectAutoInferredProperties, v as fontFace, w as inject, x as getCSSText, y as func } from "./core-B5d0IPi2.js";
+import { n as formatPropertyCSS } from "./format-rules-BbKDjsfO.js";
+import { t as mergeStyles } from "./merge-styles--1zOSFlS.js";
+import { t as resolveRecipes } from "./resolve-recipes-Caix5NnH.js";
 import { t as getTastySSRContext } from "./context-CA8YKeMn.js";
 import { t as formatGlobalRules } from "./format-global-rules-DklyaXv-.js";
 import { Fragment, createElement, forwardRef, useContext } from "react";
@@ -106,7 +106,7 @@ function tasty(Component, options) {
 	return tastyElement(Component);
 }
 function tastyWrap(Component, options) {
-	const { as: extendTag, element: extendElement, ...defaultProps } = options ?? {};
+	const { as: extendTag, element: extendElement, styleProps: _styleProps, modProps: _modProps, tokenProps: _tokenProps, variants: _variants, elements: _elements, ...defaultProps } = options ?? {};
 	const propsWithStyles = ["styles"].concat(Object.keys(defaultProps).filter((prop) => prop.endsWith("Styles")));
 	const _WrappedComponent = forwardRef((props, ref) => {
 		const { as, element, ...restProps } = props;
@@ -154,14 +154,22 @@ function tastyElement(tastyOptions) {
 		if (!variantStylesMap["default"]) variantStylesMap["default"] = defaultStyles;
 	}
 	const { qa: defaultQa, qaVal: defaultQaVal, ...otherDefaultProps } = defaultProps ?? {};
-	const propsToCheck = styleProps ? styleProps.concat(BASE_STYLES) : BASE_STYLES;
+	const ownPropsToCheck = styleProps ? styleProps.concat(BASE_STYLES) : BASE_STYLES;
+	let propsToCheck = ownPropsToCheck;
+	let propsToCheckVersion = -1;
 	const modPropsKeys = modPropsDef ? Array.isArray(modPropsDef) ? modPropsDef : Object.keys(modPropsDef) : void 0;
 	const tokenPropsMapping = tokenPropsDef ? buildTokenPropsMapping(tokenPropsDef) : void 0;
 	const classNameCache = /* @__PURE__ */ new Map();
-	const _TastyComponent = forwardRef((allProps, ref) => {
-		const { as, styles: rawStyles, variant, mods, element, qa, qaVal, className: userClassName, tokens, style, ...otherProps } = allProps;
+	const _TastyComponent = forwardRef((incomingProps, ref) => {
+		const applyPropHandlers = propHandlerRegistry.apply;
+		const { as, styles: rawStyles, variant, mods, element, qa, qaVal, className: userClassName, tokens, style, theme, ...otherProps } = applyPropHandlers ? applyPropHandlers(incomingProps) : incomingProps;
 		let styles = rawStyles;
 		let propStyles = null;
+		if (propsToCheckVersion !== baseStylePropsRegistry.version) {
+			const promoted = baseStylePropsRegistry.list;
+			propsToCheck = promoted.length === 0 ? ownPropsToCheck : ownPropsToCheck.concat(promoted);
+			propsToCheckVersion = baseStylePropsRegistry.version;
+		}
 		for (const prop of propsToCheck) {
 			const key = prop;
 			if (key in otherProps) {
@@ -228,6 +236,7 @@ function tastyElement(tastyOptions) {
 			"data-element": element || defaultElement,
 			"data-qa": qa || defaultQa,
 			"data-qaval": qaVal || defaultQaVal,
+			"data-theme": theme,
 			...otherDefaultProps,
 			...modDataAttrs || {},
 			...otherProps,
@@ -236,6 +245,7 @@ function tastyElement(tastyOptions) {
 			ref
 		};
 		handleIsProperties(elementProps);
+		if (elementProps["data-theme"] === void 0) delete elementProps["data-theme"];
 		const el = createElement(as ?? originalAs, elementProps);
 		if (stylesResult.css) {
 			const nonce = getConfig().nonce;
@@ -287,8 +297,41 @@ function useStyles(styles, options) {
 	});
 }
 //#endregion
+//#region src/utils/client-state.ts
+/**
+* Build a per-(injector, root) client state cache for the standalone style
+* functions (`useGlobalStyles`, `useRawCSS`, `useKeyframes`, `useCounterStyle`).
+*
+* Two levels, both weak:
+*
+* - **injector** — `configure()` replaces the global injector, and every dispose
+*   handle and generated name we cache belongs to the one that produced it.
+*   Keying by injector makes stale state fall away with it, instead of letting
+*   change-detection keys suppress re-injection into the new sheets.
+* - **root** — the same selector or slot name can be used in several shadow
+*   roots, and each holds its own injection.
+*/
+function createClientState(create) {
+	const byInjector = /* @__PURE__ */ new WeakMap();
+	return (root) => {
+		const injector = getGlobalInjector();
+		let byRoot = byInjector.get(injector);
+		if (!byRoot) {
+			byRoot = /* @__PURE__ */ new WeakMap();
+			byInjector.set(injector, byRoot);
+		}
+		let state = byRoot.get(root);
+		if (!state) {
+			state = create();
+			byRoot.set(root, state);
+		}
+		return state;
+	};
+}
+//#endregion
 //#region src/hooks/useGlobalStyles.ts
-const clientGlobalEntries = /* @__PURE__ */ new Map();
+const getClientGlobalSlots = createClientState(() => /* @__PURE__ */ new Map());
+const noop = () => {};
 /**
 * Inject global styles for a given selector.
 * Useful for styling elements by selector without generating classNames.
@@ -302,6 +345,10 @@ const clientGlobalEntries = /* @__PURE__ */ new Map();
 * Use the `id` option for update tracking when styles change over the
 * component lifecycle.
 *
+* Update tracking is per-slot and per-root: a slot (`id`, or the selector when
+* no `id` is given) holds exactly one injection per `root`. Changing the styles
+* replaces it; rendering styles that produce no CSS clears it.
+*
 * @param selector - CSS selector to apply styles to (e.g., '.my-class', ':root', 'body')
 * @param styles - Tasty styles object
 * @param options - Optional settings including `id` for update tracking
@@ -326,21 +373,29 @@ function useGlobalStyles(selector, styles, options) {
 		return;
 	}
 	const target = getStyleTarget();
-	if (target.mode === "client") {
-		const slotKey = options?.id ?? selector;
-		const stylesKey = JSON.stringify(styles);
-		const existing = clientGlobalEntries.get(slotKey);
-		if (existing && existing.stylesKey === stylesKey) return;
-	}
+	const slots = target.mode === "client" ? getClientGlobalSlots(options?.root ?? document) : null;
+	const slotKey = options?.id ?? selector;
+	const stylesKey = slots ? JSON.stringify(styles) : "";
+	const existing = slots?.get(slotKey);
+	if (existing && existing.stylesKey === stylesKey) return;
 	const resolvedStyles = resolveRecipes(styles);
 	const styleResults = renderStyles(resolvedStyles, selector);
-	if (styleResults.length === 0) return;
+	if (styleResults.length === 0) {
+		if (slots) {
+			existing?.dispose();
+			slots.set(slotKey, {
+				stylesKey,
+				dispose: noop
+			});
+		}
+		return;
+	}
 	if (target.mode === "ssr") {
 		target.collector.collectInternals();
 		const css = formatGlobalRules(styleResults);
 		if (css) {
 			const key = options?.id ? `global:${options.id}` : `global:${selector}:${hashString(css)}`;
-			target.collector.collectGlobalStyles(key, css);
+			target.collector.collectGlobalStyles(key, css, options?.id != null);
 		}
 		if (getConfig().autoPropertyTypes !== false) collectAutoInferredProperties(styleResults, target.collector, resolvedStyles);
 		return;
@@ -349,19 +404,19 @@ function useGlobalStyles(selector, styles, options) {
 		const css = formatGlobalRules(styleResults);
 		if (css) {
 			const key = options?.id ? `__global:${options.id}` : `__global:${selector}:${hashString(css)}`;
-			pushRSCCSS(target.cache, key, css);
+			pushRSCCSS(target.cache, key, css, options?.id != null);
 		}
 		if (getConfig().autoPropertyTypes !== false) collectAutoInferredPropertiesRSC(styleResults, target.cache, resolvedStyles);
 		return;
 	}
-	const slotKey = options?.id ?? selector;
-	const existing = clientGlobalEntries.get(slotKey);
-	if (existing) existing.dispose();
-	const { dispose } = injectGlobal(styleResults, { root: options?.root });
-	clientGlobalEntries.set(slotKey, {
-		stylesKey: JSON.stringify(styles),
-		dispose
-	});
+	if (slots) {
+		existing?.dispose();
+		const { dispose } = injectGlobal(styleResults, { root: options?.root });
+		slots.set(slotKey, {
+			stylesKey,
+			dispose
+		});
+	}
 }
 //#endregion
 //#region src/utils/deps-equal.ts
@@ -377,9 +432,11 @@ function depsEqual(a, b) {
 }
 //#endregion
 //#region src/hooks/useRawCSS.ts
-const clientEntries = /* @__PURE__ */ new Map();
-const clientContentDedup = /* @__PURE__ */ new Set();
-const factoryDepsCache$1 = /* @__PURE__ */ new Map();
+const getClientState$1 = createClientState(() => ({
+	entries: /* @__PURE__ */ new Map(),
+	contentDedup: /* @__PURE__ */ new Set(),
+	factoryDeps: /* @__PURE__ */ new Map()
+}));
 /**
 * Inject raw CSS text directly without parsing.
 * This is a low-overhead alternative for injecting global CSS that doesn't need tasty processing.
@@ -435,53 +492,59 @@ function useRawCSS(cssOrFactory, depsOrOptions, options) {
 	const deps = isFactory && Array.isArray(depsOrOptions) ? depsOrOptions : void 0;
 	const opts = isFactory ? options : depsOrOptions;
 	const target = getStyleTarget();
-	if (isFactory && deps && opts?.id && target.mode === "client") {
-		const cachedDeps = factoryDepsCache$1.get(opts.id);
+	const state = target.mode === "client" ? getClientState$1(opts?.root ?? document) : null;
+	if (isFactory && deps && opts?.id && state) {
+		const cachedDeps = state.factoryDeps.get(opts.id);
 		if (cachedDeps && depsEqual(cachedDeps, deps)) return;
 	}
 	const css = isFactory ? cssOrFactory() : cssOrFactory;
 	if (!css.trim()) return;
 	if (target.mode === "ssr") {
 		const key = opts?.id ? `raw:${opts.id}` : `raw:${hashString(css)}`;
-		target.collector.collectRawCSS(key, css);
+		target.collector.collectRawCSS(key, css, opts?.id != null);
 		return;
 	}
 	if (target.mode === "rsc") {
 		const key = opts?.id ? `__raw:${opts.id}` : `__raw:${hashString(css)}`;
-		pushRSCCSS(target.cache, key, css);
+		pushRSCCSS(target.cache, key, css, opts?.id != null);
 		return;
 	}
+	if (!state) return;
 	const id = opts?.id;
 	if (id) {
-		const existing = clientEntries.get(id);
+		const existing = state.entries.get(id);
 		if (existing) {
 			if (existing.contentKey === css) return;
 			existing.dispose();
 		}
 		const { dispose } = injectRawCSS(css, opts);
-		clientEntries.set(id, {
+		state.entries.set(id, {
 			contentKey: css,
 			dispose
 		});
-		if (deps) factoryDepsCache$1.set(id, deps);
+		if (deps) state.factoryDeps.set(id, deps);
 	} else {
 		const contentKey = hashString(css);
-		if (clientContentDedup.has(contentKey)) return;
-		clientContentDedup.add(contentKey);
+		if (state.contentDedup.has(contentKey)) return;
+		state.contentDedup.add(contentKey);
 		injectRawCSS(css, opts);
 	}
 }
 //#endregion
 //#region src/hooks/useKeyframes.ts
-const clientContentToName$1 = /* @__PURE__ */ new Map();
-const factoryDepsCache = /* @__PURE__ */ new Map();
+const getClientState = createClientState(() => ({
+	contentToName: /* @__PURE__ */ new Map(),
+	namedSlots: /* @__PURE__ */ new Map(),
+	factoryDeps: /* @__PURE__ */ new Map()
+}));
 function useKeyframes(stepsOrFactory, depsOrOptions, options) {
 	const isFactory = typeof stepsOrFactory === "function";
 	const deps = isFactory && Array.isArray(depsOrOptions) ? depsOrOptions : void 0;
 	const opts = isFactory ? options : depsOrOptions;
 	const target = getStyleTarget();
-	if (isFactory && deps && opts?.name && target.mode === "client") {
-		const cached = factoryDepsCache.get(opts.name);
+	const clientState = target.mode === "client" ? getClientState(opts?.root ?? document) : null;
+	if (isFactory && deps && opts?.name && clientState) {
+		const cached = clientState.factoryDeps.get(opts.name);
 		if (cached && depsEqual(cached.deps, deps)) return cached.name;
 	}
 	const steps = isFactory ? stepsOrFactory() : stepsOrFactory;
@@ -503,19 +566,36 @@ function useKeyframes(stepsOrFactory, depsOrOptions, options) {
 		target.cache.generatedNames.set(key, actualName);
 		return actualName;
 	}
+	const state = clientState ?? getClientState(opts?.root ?? document);
 	const serializedContent = JSON.stringify(steps);
 	const cacheKey = `${opts?.name ?? ""}:${serializedContent}`;
-	const cachedName = clientContentToName$1.get(cacheKey);
+	const cachedName = state.contentToName.get(cacheKey);
 	if (cachedName) return cachedName;
-	const name = keyframes(steps, {
-		name: opts?.name,
+	const providedName = opts?.name;
+	if (providedName) {
+		const slot = state.namedSlots.get(providedName);
+		if (slot && slot.cacheKey !== cacheKey) {
+			slot.dispose();
+			state.contentToName.delete(slot.cacheKey);
+			state.namedSlots.delete(providedName);
+		}
+	}
+	const result = keyframes(steps, {
+		name: providedName,
 		root: opts?.root
-	}).toString();
-	clientContentToName$1.set(cacheKey, name);
-	if (deps && opts?.name) factoryDepsCache.set(opts.name, {
-		deps,
-		name
 	});
+	const name = result.toString();
+	state.contentToName.set(cacheKey, name);
+	if (providedName) {
+		state.namedSlots.set(providedName, {
+			cacheKey,
+			dispose: result.dispose
+		});
+		if (deps) state.factoryDeps.set(providedName, {
+			deps,
+			name
+		});
+	}
 	return name;
 }
 //#endregion
@@ -671,7 +751,7 @@ function useFontFace(family, input, options) {
 //#endregion
 //#region src/hooks/useCounterStyle.ts
 let clientCounterStyleCounter = 0;
-const clientContentToName = /* @__PURE__ */ new Map();
+const getClientContentToName = createClientState(() => /* @__PURE__ */ new Map());
 /**
 * Inject a CSS @counter-style rule and return the generated name.
 * Permanent — no cleanup on unmount. Deduplicates by name.
@@ -717,16 +797,71 @@ function useCounterStyle(descriptors, options) {
 		target.cache.generatedNames.set(key, actualName);
 		return actualName;
 	}
+	const contentToName = getClientContentToName(options?.root ?? document);
 	const serializedContent = JSON.stringify(descriptors);
 	const cacheKey = `${options?.name ?? ""}:${serializedContent}`;
-	const existingName = clientContentToName.get(cacheKey);
+	const existingName = contentToName.get(cacheKey);
 	if (existingName) return existingName;
 	const name = options?.name ?? makeCounterStyleName(getNamePrefix(), String(clientCounterStyleCounter++));
-	clientContentToName.set(cacheKey, name);
+	contentToName.set(cacheKey, name);
 	getGlobalInjector().counterStyle(name, descriptors, { root: options?.root });
 	return name;
 }
 //#endregion
-export { APPEARANCE_CHUNK_STYLES, BASE_STYLES, BLOCK_INNER_STYLES, BLOCK_OUTER_STYLES, BLOCK_STYLES, Bucket, CHUNK_NAMES, COLOR_STYLES, CONTAINER_STYLES, CUSTOM_UNITS, ChunkSheetRegistry, DEFAULT_NAME_PREFIX, DEFAULT_ZERO_NAME_PREFIX, DIMENSION_CHUNK_STYLES, DIMENSION_STYLES, DIRECTIONS, DISPLAY_CHUNK_STYLES, Element, FLOW_STYLES, FONT_CHUNK_STYLES, INNER_STYLES, LAYOUT_CHUNK_STYLES, OUTER_STYLES, POSITION_CHUNK_STYLES, POSITION_STYLES, STYLE_TO_CHUNK, SheetManager, StyleInjector, StyleParser, TEXT_STYLES, categorizeStyleKeys, chunkSheetRegistry, cleanup, color, computeStyles, configure, counterStyle, createInjector, createStateParserContext, customFunc, deprecationWarning, destroy, dotize, filterBaseProps, filterMods, fontFace, gc, generateTypographyTokens, getConfig, getCssText, getCssTextForNode, getDisplayName, getGlobalCounterStyle, getGlobalFontFace, getGlobalFuncs, getGlobalKeyframes, getGlobalParser, getGlobalPredefinedStates, getGlobalPredefinedTokens, getGlobalRecipes, getIsTestEnvironment, getNamePrefix, getNamedColorHex, getRawCSSText, getRgbValuesFromRgbaString, hasGlobalKeyframes, hasGlobalRecipes, hasStylesGenerated, hexToRgb, hslToRgbValues, inject, injectGlobal, injectRawCSS, injector, isConfigLocked, isPropertyDefined, isSelector, isTestEnvironment, keyframes, mergeStyles, _modAttrs as modAttrs, normalizeColorTokenValue, okhslFunc, okhslPlugin, okhstFunc, okhstPlugin, parseColor, parseStateKey, parseStyle, processTokens, property, renderStyles, resetConfig, resetGlobalPredefinedTokens, resolveRecipes, setGlobalPredefinedStates, setGlobalPredefinedTokens, strToRgb, stringifyStyles, styleHandlers, tasty, tastyDebug, touch, useCounterStyle, useFontFace, useGlobalStyles, useKeyframes, useProperty, useRawCSS, useStyles, warn };
+//#region src/hooks/useFunction.ts
+/**
+* Register a CSS @function (custom function).
+*
+* @function rules are global and persistent once defined. The hook ensures the
+* function is only registered once per root (deduplicated by function name).
+*
+* Accepts tasty token syntax for the function name:
+* - `$$name` → defines `--name` (matches the call site `$$name(...)`)
+* - `$name` / `--name` → also accepted
+*
+* Works in all environments: client, SSR with collector, and React Server Components.
+*
+* @param name - The function name token (`$$name`, `$name`, or `--name`)
+* @param definition - Function definition (args, returns, result, local vars)
+*
+* Call the function through the Tasty DSL, not a raw `style` prop: an inline
+* `style` value reaches the browser unparsed, so the `$$name(...)` sugar is never
+* expanded and `polyfills.functions` cannot rewrite it either.
+*
+* @example
+* ```tsx
+* const Box = tasty({ styles: { marginTop: '$$negative(10px)' } });
+*
+* function Layout() {
+*   useFunction('$$negative', { args: ['$value'], result: '(-1 * $value)' });
+*   return <Box />;
+* }
+* ```
+*/
+function useFunction(name, definition, options) {
+	if (!name) {
+		console.warn(`[Tasty] useFunction: function name is required`);
+		return;
+	}
+	if (isFunctionsPolyfillEnabled()) {
+		registerFunctionPolyfill(name, definition);
+		return;
+	}
+	const target = getStyleTarget();
+	if (target.mode === "ssr") {
+		target.collector.collectInternals();
+		const css = formatFunctionRule(name, definition);
+		if (css) target.collector.collectFunction(parseFunctionName(name), css);
+		return;
+	}
+	if (target.mode === "rsc") {
+		const css = formatFunctionRule(name, definition);
+		if (css) pushRSCCSS(target.cache, `__func:${parseFunctionName(name)}`, css);
+		return;
+	}
+	getGlobalInjector().func(name, definition, { root: options?.root });
+}
+//#endregion
+export { APPEARANCE_CHUNK_STYLES, BASE_STYLES, BLOCK_INNER_STYLES, BLOCK_OUTER_STYLES, BLOCK_STYLES, CHUNK_NAMES, COLOR_STYLES, CONTAINER_STYLES, CUSTOM_UNITS, ChunkSheetRegistry, DEFAULT_NAME_PREFIX, DEFAULT_ZERO_NAME_PREFIX, DIMENSION_CHUNK_STYLES, DIMENSION_STYLES, DIRECTIONS, DISPLAY_CHUNK_STYLES, Element, FLOW_STYLES, FONT_CHUNK_STYLES, INNER_STYLES, LAYOUT_CHUNK_STYLES, OUTER_STYLES, POSITION_CHUNK_STYLES, POSITION_STYLES, STYLE_TO_CHUNK, SheetManager, StyleInjector, StyleParser, TEXT_STYLES, categorizeStyleKeys, chunkSheetRegistry, cleanup, color, computeStyles, configure, counterStyle, createColorFunc, createInjector, createStateParserContext, defineHandler, destroy, dotize, filterBaseProps, filterMods, fontFace, func, gc, generateTypographyTokens, getCSSText, getCSSTextForNode, getConfig, getDisplayName, getGlobalCounterStyles, getGlobalFontFaces, getGlobalFunctions, getGlobalKeyframes, getGlobalParser, getGlobalPredefinedStates, getGlobalPredefinedTokens, getGlobalRecipes, getNamePrefix, getNamedColorHex, getRawCSSText, getRgbValuesFromRgbaString, hasGlobalKeyframes, hasGlobalRecipes, hasStylesGenerated, hexToRgb, hslToRgbValues, inject, injectGlobal, injectRawCSS, injector, isConfigLocked, isPropertyDefined, isSelector, isTestEnvironment, keyframes, mergeStyles, _modAttrs as modAttrs, normalizeColorTokenValue, okhslFunction, okhslPlugin, okhstFunction, okhstPlugin, parseColor, parseStateKey, parseStyle, processTokens, property, renderStyles, resetConfig, resolveFunctionColor, resolveRecipes, setGlobalPredefinedStates, strToRgb, stringifyStyles, styleHandlers, tasty, tastyDebug, touch, useCounterStyle, useFontFace, useFunction, useGlobalStyles, useKeyframes, useProperty, useRawCSS, useStyles };
 
 //# sourceMappingURL=index.js.map