@tenphi/tasty 0.0.0-snapshot.5b49e75 → 0.0.0-snapshot.5e08c99

package/README.md

@@ -79,7 +79,7 @@ For the fuller docs map beyond the quick routes above, start here:
 - **[Comparison](docs/comparison.md)** — read this first if you are evaluating whether Tasty fits your team's styling model
 - **[Adoption Guide](docs/adoption.md)** — understand who Tasty is for, where it fits, and how to introduce it incrementally
 - **[Getting Started](docs/getting-started.md)** — the canonical onboarding path: install, first component, optional shared `configure()`, ESLint, editor tooling, and rendering mode selection
-- **[Style rendering pipeline](docs/PIPELINE.md)** — see the selector model behind deterministic style resolution
+- **[Style rendering pipeline](docs/pipeline.md)** — see the selector model behind deterministic style resolution
 - **[Docs Hub](docs/README.md)** — choose docs by role and task: runtime, zero-runtime, runtime SSR integration, design-system authoring, internals, and debugging
 - **[Methodology](docs/methodology.md)** — the recommended component model and public API conventions for design-system code
 
@@ -206,7 +206,7 @@ All `tasty()` components are hook-free and work as React Server Components. In s
 
 This is the core idea that makes everything else possible.
 
-For the end-to-end architecture — parsing state keys, building exclusive conditions, merging by output, and materializing selectors and at-rules — see **[Style rendering pipeline](docs/PIPELINE.md)**.
+For the end-to-end architecture — parsing state keys, building exclusive conditions, merging by output, and materializing selectors and at-rules — see **[Style rendering pipeline](docs/pipeline.md)**.
 
 ### The structural problem with normal CSS
 
@@ -622,7 +622,7 @@ Start from the docs hub if you want the shortest path to the right guide for you
 
 ### Internals
 
-- **[Style rendering pipeline](docs/PIPELINE.md)** — How `Styles` become mutually exclusive CSS rules: parse → exclusives → combinations → handlers → merge → materialize (`src/pipeline/`)
+- **[Style rendering pipeline](docs/pipeline.md)** — How `Styles` become mutually exclusive CSS rules: parse → exclusives → combinations → handlers → merge → materialize (`src/pipeline/`)
 - **[Style Injector](docs/injector.md)** — Internal CSS injection engine: `inject()`, `injectGlobal()`, `injectRawCSS()`, `keyframes()`, deduplication, reference counting, cleanup, SSR support, and Shadow DOM
 - **[Debug Utilities](docs/debug.md)** — Runtime CSS inspection via `tastyDebug`: CSS extraction, element inspection, cache metrics, chunk breakdown, and performance monitoring
 

package/dist/compute-styles.js

@@ -1,8 +1,7 @@
 import { extractLocalProperties, hasLocalProperties } from "./properties/index.js";
 import { extractLocalFontFace, fontFaceContentHash, formatFontFaceRule, hasLocalFontFace } from "./font-face/index.js";
 import { extractLocalCounterStyle, formatCounterStyleRule, hasLocalCounterStyle } from "./counter-style/index.js";
-import { renderStyles } from "./pipeline/index.js";
-import { getConfig, getEffectiveProperties, getGlobalConfigTokens, getGlobalCounterStyle, getGlobalFontFace, getGlobalKeyframes, hasGlobalKeyframes } from "./config.js";
+import { getConfig, getGlobalKeyframes, hasGlobalKeyframes } from "./config.js";
 import { categorizeStyleKeys } from "./chunks/definitions.js";
 import { generateChunkCacheKey } from "./chunks/cacheKey.js";
 import { renderStylesForChunk } from "./chunks/renderChunk.js";
@@ -12,7 +11,6 @@ import { getRegisteredSSRCollector } from "./ssr/ssr-collector-ref.js";
 import { flushPendingCSS, getRSCCache, rscAllocateClassName } from "./rsc-cache.js";
 import { formatPropertyCSS } from "./ssr/format-property.js";
 import { collectAutoInferredProperties } from "./ssr/collect-auto-properties.js";
-import { formatGlobalRules } from "./ssr/format-global-rules.js";
 import { formatKeyframesCSS } from "./ssr/format-keyframes.js";
 import { formatRules } from "./ssr/format-rules.js";
 import { hasKeys } from "./utils/has-keys.js";
@@ -32,33 +30,22 @@ import { resolveRecipes } from "./utils/resolve-recipes.js";
 */
 const EMPTY_RESULT = { className: "" };
 /**
-* Collect internals CSS for RSC — mirrors ServerStyleCollector.collectInternals().
-* Emitted once per request (tracked via rscCache.internalsEmitted).
+* Mark internals as emitted for this RSC request.
+*
+* Internals (tokens, @property, @font-face, @counter-style) are emitted
+* exclusively by the SSR collector via ServerStyleCollector.collectInternals().
+* The SSR path is reliable because TastyRegistry is always present as a
+* client component in the root layout, guaranteeing SSR runs for every page.
+*
+* Previously this function also emitted internals and coordinated with SSR
+* via a globalThis flag, but that flag leaked across requests in the same
+* Node.js process, causing pages without RSC-rendered tasty components
+* (e.g. the playground route) to lose all token CSS.
 */
 function collectInternalsRSC(rscCache) {
 	if (rscCache.internalsEmitted) return "";
 	rscCache.internalsEmitted = true;
-	const parts = [];
-	for (const [token, definition] of Object.entries(getEffectiveProperties())) {
-		const css = formatPropertyCSS(token, definition);
-		if (css) parts.push(css);
-	}
-	const tokenStyles = getGlobalConfigTokens();
-	if (tokenStyles && Object.keys(tokenStyles).length > 0) {
-		const tokenRules = renderStyles(tokenStyles, ":root");
-		if (tokenRules.length > 0) {
-			const css = formatGlobalRules(tokenRules);
-			if (css) parts.push(css);
-		}
-	}
-	const globalFF = getGlobalFontFace();
-	if (globalFF) for (const [family, input] of Object.entries(globalFF)) {
-		const descriptors = Array.isArray(input) ? input : [input];
-		for (const desc of descriptors) parts.push(formatFontFaceRule(family, desc));
-	}
-	const globalCS = getGlobalCounterStyle();
-	if (globalCS) for (const [name, descriptors] of Object.entries(globalCS)) parts.push(formatCounterStyleRule(name, descriptors));
-	return parts.join("\n");
+	return "";
 }
 /**
 * Collect per-component ancillary CSS (keyframes, @property, font-face,

package/dist/compute-styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"compute-styles.js","names":[],"sources":["../src/compute-styles.ts"],"sourcesContent":["/**\n * Hook-free, synchronous style computation.\n *\n * Extracts the core logic from useStyles() into a plain function that can\n * be called during React render without any hooks. Three code paths:\n *\n * 1. SSR collector — styles collected via ServerStyleCollector\n * 2. Client inject — styles injected synchronously into the DOM\n * 3. RSC inline — styles returned as CSS strings for inline <style> emission\n *\n * This enables tasty() components to work as React Server Components.\n */\n\nimport {\n  categorizeStyleKeys,\n  generateChunkCacheKey,\n  renderStylesForChunk,\n} from './chunks';\nimport {\n  getConfig,\n  getGlobalConfigTokens,\n  getGlobalCounterStyle,\n  getEffectiveProperties,\n  getGlobalFontFace,\n  getGlobalKeyframes,\n  hasGlobalKeyframes,\n} from './config';\nimport {\n  counterStyle,\n  fontFace,\n  inject,\n  keyframes,\n  property,\n  touch,\n} from './injector';\nimport type { FontFaceDescriptors, KeyframesSteps } from './injector/types';\nimport {\n  extractLocalCounterStyle,\n  formatCounterStyleRule,\n  hasLocalCounterStyle,\n} from './counter-style';\nimport {\n  extractLocalFontFace,\n  fontFaceContentHash,\n  formatFontFaceRule,\n  hasLocalFontFace,\n} from './font-face';\nimport {\n  extractAnimationNamesFromStyles,\n  extractLocalKeyframes,\n  filterUsedKeyframes,\n  hasLocalKeyframes,\n  mergeKeyframes,\n  replaceAnimationNames,\n} from './keyframes';\nimport type { RenderResult, StyleResult } from './pipeline';\nimport { renderStyles } from './pipeline';\nimport {\n  flushPendingCSS,\n  getRSCCache,\n  rscAllocateClassName,\n} from './rsc-cache';\nimport type { RSCStyleCache } from './rsc-cache';\nimport { extractLocalProperties, hasLocalProperties } from './properties';\nimport { collectAutoInferredProperties } from './ssr/collect-auto-properties';\nimport type { ServerStyleCollector } from './ssr/collector';\nimport { formatGlobalRules } from './ssr/format-global-rules';\nimport { formatKeyframesCSS } from './ssr/format-keyframes';\nimport { formatPropertyCSS } from './ssr/format-property';\nimport { formatRules } from './ssr/format-rules';\nimport { getRegisteredSSRCollector } from './ssr/ssr-collector-ref';\nimport type { Styles } from './styles/types';\nimport { hasKeys } from './utils/has-keys';\nimport { resolveRecipes } from './utils/resolve-recipes';\n\nexport interface ComputeStylesResult {\n  className: string;\n  /** CSS text to emit as an inline <style> tag (RSC mode only). */\n  css?: string;\n}\n\nexport interface ComputeStylesOptions {\n  ssrCollector?: ServerStyleCollector | null;\n}\n\ninterface ProcessedChunk {\n  name: string;\n  styleKeys: string[];\n  cacheKey: string;\n  renderResult: RenderResult;\n  className: string;\n}\n\nconst EMPTY_RESULT: ComputeStylesResult = { className: '' };\n\n// ---------------------------------------------------------------------------\n// RSC (React Server Components) inline style support\n// ---------------------------------------------------------------------------\n\n/**\n * Collect internals CSS for RSC — mirrors ServerStyleCollector.collectInternals().\n * Emitted once per request (tracked via rscCache.internalsEmitted).\n */\nfunction collectInternalsRSC(rscCache: RSCStyleCache): string {\n  if (rscCache.internalsEmitted) return '';\n  rscCache.internalsEmitted = true;\n\n  const parts: string[] = [];\n\n  for (const [token, definition] of Object.entries(getEffectiveProperties())) {\n    const css = formatPropertyCSS(token, definition);\n    if (css) parts.push(css);\n  }\n\n  const tokenStyles = getGlobalConfigTokens();\n  if (tokenStyles && Object.keys(tokenStyles).length > 0) {\n    const tokenRules = renderStyles(tokenStyles, ':root') as StyleResult[];\n    if (tokenRules.length > 0) {\n      const css = formatGlobalRules(tokenRules);\n      if (css) parts.push(css);\n    }\n  }\n\n  const globalFF = getGlobalFontFace();\n  if (globalFF) {\n    for (const [family, input] of Object.entries(globalFF)) {\n      const descriptors: FontFaceDescriptors[] = Array.isArray(input)\n        ? input\n        : [input];\n      for (const desc of descriptors) {\n        parts.push(formatFontFaceRule(family, desc));\n      }\n    }\n  }\n\n  const globalCS = getGlobalCounterStyle();\n  if (globalCS) {\n    for (const [name, descriptors] of Object.entries(globalCS)) {\n      parts.push(formatCounterStyleRule(name, descriptors));\n    }\n  }\n\n  return parts.join('\\n');\n}\n\n/**\n * Collect per-component ancillary CSS (keyframes, @property, font-face,\n * counter-style) for RSC mode.\n */\nfunction collectAncillaryRSC(rscCache: RSCStyleCache, styles: Styles): string {\n  const parts: string[] = [];\n\n  const usedKf = getUsedKeyframes(styles);\n  if (usedKf) {\n    for (const [name, steps] of Object.entries(usedKf)) {\n      const key = `__kf:${name}:${JSON.stringify(steps)}`;\n      if (!rscCache.emittedKeys.has(key)) {\n        rscCache.emittedKeys.add(key);\n        parts.push(formatKeyframesCSS(name, steps));\n      }\n    }\n  }\n\n  if (hasLocalProperties(styles)) {\n    const localProperties = extractLocalProperties(styles);\n    if (localProperties) {\n      for (const [token, definition] of Object.entries(localProperties)) {\n        const key = `__prop:${token}`;\n        if (!rscCache.emittedKeys.has(key)) {\n          rscCache.emittedKeys.add(key);\n          const css = formatPropertyCSS(token, definition);\n          if (css) parts.push(css);\n        }\n      }\n    }\n  }\n\n  if (hasLocalFontFace(styles)) {\n    const localFontFace = extractLocalFontFace(styles);\n    if (localFontFace) {\n      for (const [family, input] of Object.entries(localFontFace)) {\n        const descriptors: FontFaceDescriptors[] = Array.isArray(input)\n          ? input\n          : [input];\n        for (const desc of descriptors) {\n          const hash = fontFaceContentHash(family, desc);\n          const key = `__ff:${hash}`;\n          if (!rscCache.emittedKeys.has(key)) {\n            rscCache.emittedKeys.add(key);\n            parts.push(formatFontFaceRule(family, desc));\n          }\n        }\n      }\n    }\n  }\n\n  if (hasLocalCounterStyle(styles)) {\n    const localCounterStyle = extractLocalCounterStyle(styles);\n    if (localCounterStyle) {\n      for (const [name, descriptors] of Object.entries(localCounterStyle)) {\n        const key = `__cs:${name}:${JSON.stringify(descriptors)}`;\n        if (!rscCache.emittedKeys.has(key)) {\n          rscCache.emittedKeys.add(key);\n          parts.push(formatCounterStyleRule(name, descriptors));\n        }\n      }\n    }\n  }\n\n  return parts.join('\\n');\n}\n\n/**\n * Process all chunks in RSC mode: render CSS to strings, allocate classNames,\n * and return combined { className, css }.\n */\nfunction computeStylesRSC(\n  styles: Styles,\n  chunkMap: Map<string, string[]>,\n): ComputeStylesResult {\n  const rscCache = getRSCCache();\n  const cssParts: string[] = [];\n  const classNames: string[] = [];\n\n  // Flush CSS accumulated by standalone style functions\n  const pendingCSS = flushPendingCSS(rscCache);\n  if (pendingCSS) cssParts.push(pendingCSS);\n\n  const internalsCSS = collectInternalsRSC(rscCache);\n  if (internalsCSS) cssParts.push(internalsCSS);\n\n  for (const [chunkName, chunkStyleKeys] of chunkMap) {\n    if (chunkStyleKeys.length === 0) continue;\n\n    const cacheKey = generateChunkCacheKey(styles, chunkName, chunkStyleKeys);\n    const { className, isNew } = rscAllocateClassName(rscCache, cacheKey);\n    classNames.push(className);\n\n    if (isNew) {\n      const renderResult = renderStylesForChunk(\n        styles,\n        chunkName,\n        chunkStyleKeys,\n      );\n      if (renderResult.rules.length > 0) {\n        const css = formatRules(renderResult.rules, className);\n        if (css) cssParts.push(css);\n      }\n    }\n  }\n\n  const ancillaryCSS = collectAncillaryRSC(rscCache, styles);\n  if (ancillaryCSS) cssParts.push(ancillaryCSS);\n\n  if (classNames.length === 0) return EMPTY_RESULT;\n\n  const css = cssParts.join('\\n');\n\n  return {\n    className: classNames.join(' '),\n    css: css || undefined,\n  };\n}\n\n/**\n * Get keyframes that are actually used in styles.\n * Returns null if no keyframes are used (fast path for zero overhead).\n */\nfunction getUsedKeyframes(\n  styles: Styles,\n): Record<string, KeyframesSteps> | null {\n  const hasLocal = hasLocalKeyframes(styles);\n  const hasGlobal = hasGlobalKeyframes();\n  if (!hasLocal && !hasGlobal) return null;\n\n  const usedNames = extractAnimationNamesFromStyles(styles);\n  if (usedNames.size === 0) return null;\n\n  const local = hasLocal ? extractLocalKeyframes(styles) : null;\n  const global = hasGlobal ? getGlobalKeyframes() : null;\n  const allKeyframes = mergeKeyframes(local, global);\n\n  return filterUsedKeyframes(allKeyframes, usedNames);\n}\n\n/**\n * Process a chunk on the SSR path: allocate via collector, render, collect CSS.\n */\nfunction processChunkSSR(\n  collector: ServerStyleCollector,\n  styles: Styles,\n  chunkName: string,\n  styleKeys: string[],\n): ProcessedChunk | null {\n  if (styleKeys.length === 0) return null;\n\n  const cacheKey = generateChunkCacheKey(styles, chunkName, styleKeys);\n  const { className, isNewAllocation } = collector.allocateClassName(cacheKey);\n\n  if (isNewAllocation) {\n    const renderResult = renderStylesForChunk(styles, chunkName, styleKeys);\n    if (renderResult.rules.length > 0) {\n      collector.collectChunk(cacheKey, className, renderResult.rules);\n      return { name: chunkName, styleKeys, cacheKey, renderResult, className };\n    }\n    return null;\n  }\n\n  return {\n    name: chunkName,\n    styleKeys,\n    cacheKey,\n    renderResult: { rules: [] },\n    className,\n  };\n}\n\n/**\n * Process a chunk on the client: render, allocate className, and inject\n * CSS synchronously. The injector's cache makes this idempotent.\n */\nfunction processChunkSync(\n  styles: Styles,\n  chunkName: string,\n  styleKeys: string[],\n): ProcessedChunk | null {\n  if (styleKeys.length === 0) return null;\n\n  const cacheKey = generateChunkCacheKey(styles, chunkName, styleKeys);\n  const renderResult = renderStylesForChunk(\n    styles,\n    chunkName,\n    styleKeys,\n    cacheKey,\n  );\n  if (renderResult.rules.length === 0) return null;\n\n  const { className } = inject(renderResult.rules, { cacheKey });\n\n  return { name: chunkName, styleKeys, cacheKey, renderResult, className };\n}\n\n/**\n * Inject keyframes synchronously and return a name replacement map.\n * On the client, keyframes are injected into the DOM.\n */\nfunction injectKeyframesSync(\n  usedKeyframes: Record<string, KeyframesSteps>,\n): Map<string, string> | null {\n  let nameMap: Map<string, string> | null = null;\n\n  for (const [name, steps] of Object.entries(usedKeyframes)) {\n    const result = keyframes(steps, { name });\n    const injectedName = result.toString();\n    if (injectedName !== name) {\n      if (!nameMap) nameMap = new Map();\n      nameMap.set(name, injectedName);\n    }\n  }\n\n  return nameMap;\n}\n\n/**\n * Inject chunk rules synchronously, replacing animation names if needed.\n */\nfunction injectChunkRulesSync(\n  chunks: ProcessedChunk[],\n  nameMap: Map<string, string> | null,\n): void {\n  for (const chunk of chunks) {\n    if (chunk.renderResult.rules.length > 0) {\n      const rulesToInject: StyleResult[] = nameMap\n        ? chunk.renderResult.rules.map((rule) => ({\n            ...rule,\n            declarations: replaceAnimationNames(rule.declarations, nameMap!),\n          }))\n        : chunk.renderResult.rules;\n\n      inject(rulesToInject, { cacheKey: chunk.cacheKey });\n    }\n  }\n}\n\n/**\n * Inject all ancillary rules (properties, font-faces, counter-styles) synchronously.\n */\nfunction injectAncillarySync(styles: Styles): void {\n  if (hasLocalProperties(styles)) {\n    const localProperties = extractLocalProperties(styles);\n    if (localProperties) {\n      for (const [token, definition] of Object.entries(localProperties)) {\n        property(token, definition);\n      }\n    }\n  }\n\n  if (hasLocalFontFace(styles)) {\n    const localFontFace = extractLocalFontFace(styles);\n    if (localFontFace) {\n      for (const [family, input] of Object.entries(localFontFace)) {\n        const descriptors: FontFaceDescriptors[] = Array.isArray(input)\n          ? input\n          : [input];\n        for (const desc of descriptors) {\n          fontFace(family, desc);\n        }\n      }\n    }\n  }\n\n  if (hasLocalCounterStyle(styles)) {\n    const localCounterStyle = extractLocalCounterStyle(styles);\n    if (localCounterStyle) {\n      for (const [name, descriptors] of Object.entries(localCounterStyle)) {\n        counterStyle(name, descriptors);\n      }\n    }\n  }\n}\n\n/**\n * Collect all ancillary rules into the SSR collector.\n */\nfunction collectAncillarySSR(\n  collector: ServerStyleCollector,\n  styles: Styles,\n  chunks: ProcessedChunk[],\n): void {\n  const usedKf = getUsedKeyframes(styles);\n  if (usedKf) {\n    for (const [name, steps] of Object.entries(usedKf)) {\n      const css = formatKeyframesCSS(name, steps);\n      collector.collectKeyframes(name, css);\n    }\n  }\n\n  if (hasLocalProperties(styles)) {\n    const localProperties = extractLocalProperties(styles);\n    if (localProperties) {\n      for (const [token, definition] of Object.entries(localProperties)) {\n        const css = formatPropertyCSS(token, definition);\n        if (css) {\n          collector.collectProperty(token, css);\n        }\n      }\n    }\n  }\n\n  if (hasLocalFontFace(styles)) {\n    const localFontFace = extractLocalFontFace(styles);\n    if (localFontFace) {\n      for (const [family, input] of Object.entries(localFontFace)) {\n        const descriptors: FontFaceDescriptors[] = Array.isArray(input)\n          ? input\n          : [input];\n        for (const desc of descriptors) {\n          const hash = fontFaceContentHash(family, desc);\n          const css = formatFontFaceRule(family, desc);\n          collector.collectFontFace(hash, css);\n        }\n      }\n    }\n  }\n\n  if (hasLocalCounterStyle(styles)) {\n    const localCounterStyle = extractLocalCounterStyle(styles);\n    if (localCounterStyle) {\n      for (const [name, descriptors] of Object.entries(localCounterStyle)) {\n        const css = formatCounterStyleRule(name, descriptors);\n        collector.collectCounterStyle(name, css);\n      }\n    }\n  }\n\n  if (getConfig().autoPropertyTypes !== false) {\n    const allRules = chunks.flatMap((c) => c.renderResult.rules);\n    if (allRules.length > 0) {\n      collectAutoInferredProperties(allRules, collector, styles);\n    }\n  }\n}\n\n/**\n * Synchronous, hook-free style computation.\n *\n * Resolves recipes, categorizes style keys into chunks, renders CSS rules,\n * allocates class names, and injects / collects / returns the CSS.\n *\n * Three code paths:\n * 1. SSR collector — discovered via ALS or passed explicitly; CSS collected\n * 2. RSC inline — no collector and no `document`; CSS returned as `result.css`\n *    for the caller to emit as an inline `<style>` tag\n * 3. Client inject — CSS injected synchronously into the DOM (idempotent)\n *\n * @param styles - Tasty styles object (or undefined for no styles)\n * @param options - Optional SSR collector override\n */\nexport function computeStyles(\n  styles: Styles | undefined,\n  options?: ComputeStylesOptions,\n): ComputeStylesResult {\n  if (!styles || !hasKeys(styles as Record<string, unknown>)) {\n    return EMPTY_RESULT;\n  }\n\n  const resolved = resolveRecipes(styles);\n  const chunkMap = categorizeStyleKeys(resolved as Record<string, unknown>);\n\n  const collector =\n    options?.ssrCollector !== undefined\n      ? options.ssrCollector\n      : getRegisteredSSRCollector();\n\n  const chunks: ProcessedChunk[] = [];\n\n  if (collector) {\n    collector.collectInternals();\n\n    for (const [chunkName, chunkStyleKeys] of chunkMap) {\n      const chunk = processChunkSSR(\n        collector,\n        resolved,\n        chunkName,\n        chunkStyleKeys,\n      );\n      if (chunk) chunks.push(chunk);\n    }\n\n    collectAncillarySSR(collector, resolved, chunks);\n  } else if (typeof document === 'undefined') {\n    // RSC path: render CSS to strings for inline <style> emission\n    return computeStylesRSC(resolved, chunkMap);\n  } else {\n    injectAncillarySync(resolved);\n\n    const usedKf = getUsedKeyframes(resolved);\n    const nameMap = usedKf ? injectKeyframesSync(usedKf) : null;\n\n    for (const [chunkName, chunkStyleKeys] of chunkMap) {\n      const chunk = processChunkSync(resolved, chunkName, chunkStyleKeys);\n      if (chunk) chunks.push(chunk);\n    }\n\n    if (nameMap) {\n      injectChunkRulesSync(chunks, nameMap);\n    }\n\n    for (const chunk of chunks) {\n      touch(chunk.className);\n    }\n  }\n\n  if (chunks.length === 0) return EMPTY_RESULT;\n  if (chunks.length === 1) return { className: chunks[0].className };\n\n  return { className: chunks.map((c) => c.className).join(' ') };\n}\n"],"mappings":"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"}
+{"version":3,"file":"compute-styles.js","names":[],"sources":["../src/compute-styles.ts"],"sourcesContent":["/**\n * Hook-free, synchronous style computation.\n *\n * Extracts the core logic from useStyles() into a plain function that can\n * be called during React render without any hooks. Three code paths:\n *\n * 1. SSR collector — styles collected via ServerStyleCollector\n * 2. Client inject — styles injected synchronously into the DOM\n * 3. RSC inline — styles returned as CSS strings for inline <style> emission\n *\n * This enables tasty() components to work as React Server Components.\n */\n\nimport {\n  categorizeStyleKeys,\n  generateChunkCacheKey,\n  renderStylesForChunk,\n} from './chunks';\nimport { getConfig, getGlobalKeyframes, hasGlobalKeyframes } from './config';\nimport {\n  counterStyle,\n  fontFace,\n  inject,\n  keyframes,\n  property,\n  touch,\n} from './injector';\nimport type { FontFaceDescriptors, KeyframesSteps } from './injector/types';\nimport {\n  extractLocalCounterStyle,\n  formatCounterStyleRule,\n  hasLocalCounterStyle,\n} from './counter-style';\nimport {\n  extractLocalFontFace,\n  fontFaceContentHash,\n  formatFontFaceRule,\n  hasLocalFontFace,\n} from './font-face';\nimport {\n  extractAnimationNamesFromStyles,\n  extractLocalKeyframes,\n  filterUsedKeyframes,\n  hasLocalKeyframes,\n  mergeKeyframes,\n  replaceAnimationNames,\n} from './keyframes';\nimport type { RenderResult, StyleResult } from './pipeline';\nimport {\n  flushPendingCSS,\n  getRSCCache,\n  rscAllocateClassName,\n} from './rsc-cache';\nimport type { RSCStyleCache } from './rsc-cache';\nimport { extractLocalProperties, hasLocalProperties } from './properties';\nimport { collectAutoInferredProperties } from './ssr/collect-auto-properties';\nimport type { ServerStyleCollector } from './ssr/collector';\nimport { formatKeyframesCSS } from './ssr/format-keyframes';\nimport { formatPropertyCSS } from './ssr/format-property';\nimport { formatRules } from './ssr/format-rules';\nimport { getRegisteredSSRCollector } from './ssr/ssr-collector-ref';\nimport type { Styles } from './styles/types';\nimport { hasKeys } from './utils/has-keys';\nimport { resolveRecipes } from './utils/resolve-recipes';\n\nexport interface ComputeStylesResult {\n  className: string;\n  /** CSS text to emit as an inline <style> tag (RSC mode only). */\n  css?: string;\n}\n\nexport interface ComputeStylesOptions {\n  ssrCollector?: ServerStyleCollector | null;\n}\n\ninterface ProcessedChunk {\n  name: string;\n  styleKeys: string[];\n  cacheKey: string;\n  renderResult: RenderResult;\n  className: string;\n}\n\nconst EMPTY_RESULT: ComputeStylesResult = { className: '' };\n\n// ---------------------------------------------------------------------------\n// RSC (React Server Components) inline style support\n// ---------------------------------------------------------------------------\n\n/**\n * Mark internals as emitted for this RSC request.\n *\n * Internals (tokens, @property, @font-face, @counter-style) are emitted\n * exclusively by the SSR collector via ServerStyleCollector.collectInternals().\n * The SSR path is reliable because TastyRegistry is always present as a\n * client component in the root layout, guaranteeing SSR runs for every page.\n *\n * Previously this function also emitted internals and coordinated with SSR\n * via a globalThis flag, but that flag leaked across requests in the same\n * Node.js process, causing pages without RSC-rendered tasty components\n * (e.g. the playground route) to lose all token CSS.\n */\nfunction collectInternalsRSC(rscCache: RSCStyleCache): string {\n  if (rscCache.internalsEmitted) return '';\n  rscCache.internalsEmitted = true;\n\n  return '';\n}\n\n/**\n * Collect per-component ancillary CSS (keyframes, @property, font-face,\n * counter-style) for RSC mode.\n */\nfunction collectAncillaryRSC(rscCache: RSCStyleCache, styles: Styles): string {\n  const parts: string[] = [];\n\n  const usedKf = getUsedKeyframes(styles);\n  if (usedKf) {\n    for (const [name, steps] of Object.entries(usedKf)) {\n      const key = `__kf:${name}:${JSON.stringify(steps)}`;\n      if (!rscCache.emittedKeys.has(key)) {\n        rscCache.emittedKeys.add(key);\n        parts.push(formatKeyframesCSS(name, steps));\n      }\n    }\n  }\n\n  if (hasLocalProperties(styles)) {\n    const localProperties = extractLocalProperties(styles);\n    if (localProperties) {\n      for (const [token, definition] of Object.entries(localProperties)) {\n        const key = `__prop:${token}`;\n        if (!rscCache.emittedKeys.has(key)) {\n          rscCache.emittedKeys.add(key);\n          const css = formatPropertyCSS(token, definition);\n          if (css) parts.push(css);\n        }\n      }\n    }\n  }\n\n  if (hasLocalFontFace(styles)) {\n    const localFontFace = extractLocalFontFace(styles);\n    if (localFontFace) {\n      for (const [family, input] of Object.entries(localFontFace)) {\n        const descriptors: FontFaceDescriptors[] = Array.isArray(input)\n          ? input\n          : [input];\n        for (const desc of descriptors) {\n          const hash = fontFaceContentHash(family, desc);\n          const key = `__ff:${hash}`;\n          if (!rscCache.emittedKeys.has(key)) {\n            rscCache.emittedKeys.add(key);\n            parts.push(formatFontFaceRule(family, desc));\n          }\n        }\n      }\n    }\n  }\n\n  if (hasLocalCounterStyle(styles)) {\n    const localCounterStyle = extractLocalCounterStyle(styles);\n    if (localCounterStyle) {\n      for (const [name, descriptors] of Object.entries(localCounterStyle)) {\n        const key = `__cs:${name}:${JSON.stringify(descriptors)}`;\n        if (!rscCache.emittedKeys.has(key)) {\n          rscCache.emittedKeys.add(key);\n          parts.push(formatCounterStyleRule(name, descriptors));\n        }\n      }\n    }\n  }\n\n  return parts.join('\\n');\n}\n\n/**\n * Process all chunks in RSC mode: render CSS to strings, allocate classNames,\n * and return combined { className, css }.\n */\nfunction computeStylesRSC(\n  styles: Styles,\n  chunkMap: Map<string, string[]>,\n): ComputeStylesResult {\n  const rscCache = getRSCCache();\n  const cssParts: string[] = [];\n  const classNames: string[] = [];\n\n  // Flush CSS accumulated by standalone style functions\n  const pendingCSS = flushPendingCSS(rscCache);\n  if (pendingCSS) cssParts.push(pendingCSS);\n\n  const internalsCSS = collectInternalsRSC(rscCache);\n  if (internalsCSS) cssParts.push(internalsCSS);\n\n  for (const [chunkName, chunkStyleKeys] of chunkMap) {\n    if (chunkStyleKeys.length === 0) continue;\n\n    const cacheKey = generateChunkCacheKey(styles, chunkName, chunkStyleKeys);\n    const { className, isNew } = rscAllocateClassName(rscCache, cacheKey);\n    classNames.push(className);\n\n    if (isNew) {\n      const renderResult = renderStylesForChunk(\n        styles,\n        chunkName,\n        chunkStyleKeys,\n      );\n      if (renderResult.rules.length > 0) {\n        const css = formatRules(renderResult.rules, className);\n        if (css) cssParts.push(css);\n      }\n    }\n  }\n\n  const ancillaryCSS = collectAncillaryRSC(rscCache, styles);\n  if (ancillaryCSS) cssParts.push(ancillaryCSS);\n\n  if (classNames.length === 0) return EMPTY_RESULT;\n\n  const css = cssParts.join('\\n');\n\n  return {\n    className: classNames.join(' '),\n    css: css || undefined,\n  };\n}\n\n/**\n * Get keyframes that are actually used in styles.\n * Returns null if no keyframes are used (fast path for zero overhead).\n */\nfunction getUsedKeyframes(\n  styles: Styles,\n): Record<string, KeyframesSteps> | null {\n  const hasLocal = hasLocalKeyframes(styles);\n  const hasGlobal = hasGlobalKeyframes();\n  if (!hasLocal && !hasGlobal) return null;\n\n  const usedNames = extractAnimationNamesFromStyles(styles);\n  if (usedNames.size === 0) return null;\n\n  const local = hasLocal ? extractLocalKeyframes(styles) : null;\n  const global = hasGlobal ? getGlobalKeyframes() : null;\n  const allKeyframes = mergeKeyframes(local, global);\n\n  return filterUsedKeyframes(allKeyframes, usedNames);\n}\n\n/**\n * Process a chunk on the SSR path: allocate via collector, render, collect CSS.\n */\nfunction processChunkSSR(\n  collector: ServerStyleCollector,\n  styles: Styles,\n  chunkName: string,\n  styleKeys: string[],\n): ProcessedChunk | null {\n  if (styleKeys.length === 0) return null;\n\n  const cacheKey = generateChunkCacheKey(styles, chunkName, styleKeys);\n  const { className, isNewAllocation } = collector.allocateClassName(cacheKey);\n\n  if (isNewAllocation) {\n    const renderResult = renderStylesForChunk(styles, chunkName, styleKeys);\n    if (renderResult.rules.length > 0) {\n      collector.collectChunk(cacheKey, className, renderResult.rules);\n      return { name: chunkName, styleKeys, cacheKey, renderResult, className };\n    }\n    return null;\n  }\n\n  return {\n    name: chunkName,\n    styleKeys,\n    cacheKey,\n    renderResult: { rules: [] },\n    className,\n  };\n}\n\n/**\n * Process a chunk on the client: render, allocate className, and inject\n * CSS synchronously. The injector's cache makes this idempotent.\n */\nfunction processChunkSync(\n  styles: Styles,\n  chunkName: string,\n  styleKeys: string[],\n): ProcessedChunk | null {\n  if (styleKeys.length === 0) return null;\n\n  const cacheKey = generateChunkCacheKey(styles, chunkName, styleKeys);\n  const renderResult = renderStylesForChunk(\n    styles,\n    chunkName,\n    styleKeys,\n    cacheKey,\n  );\n  if (renderResult.rules.length === 0) return null;\n\n  const { className } = inject(renderResult.rules, { cacheKey });\n\n  return { name: chunkName, styleKeys, cacheKey, renderResult, className };\n}\n\n/**\n * Inject keyframes synchronously and return a name replacement map.\n * On the client, keyframes are injected into the DOM.\n */\nfunction injectKeyframesSync(\n  usedKeyframes: Record<string, KeyframesSteps>,\n): Map<string, string> | null {\n  let nameMap: Map<string, string> | null = null;\n\n  for (const [name, steps] of Object.entries(usedKeyframes)) {\n    const result = keyframes(steps, { name });\n    const injectedName = result.toString();\n    if (injectedName !== name) {\n      if (!nameMap) nameMap = new Map();\n      nameMap.set(name, injectedName);\n    }\n  }\n\n  return nameMap;\n}\n\n/**\n * Inject chunk rules synchronously, replacing animation names if needed.\n */\nfunction injectChunkRulesSync(\n  chunks: ProcessedChunk[],\n  nameMap: Map<string, string> | null,\n): void {\n  for (const chunk of chunks) {\n    if (chunk.renderResult.rules.length > 0) {\n      const rulesToInject: StyleResult[] = nameMap\n        ? chunk.renderResult.rules.map((rule) => ({\n            ...rule,\n            declarations: replaceAnimationNames(rule.declarations, nameMap!),\n          }))\n        : chunk.renderResult.rules;\n\n      inject(rulesToInject, { cacheKey: chunk.cacheKey });\n    }\n  }\n}\n\n/**\n * Inject all ancillary rules (properties, font-faces, counter-styles) synchronously.\n */\nfunction injectAncillarySync(styles: Styles): void {\n  if (hasLocalProperties(styles)) {\n    const localProperties = extractLocalProperties(styles);\n    if (localProperties) {\n      for (const [token, definition] of Object.entries(localProperties)) {\n        property(token, definition);\n      }\n    }\n  }\n\n  if (hasLocalFontFace(styles)) {\n    const localFontFace = extractLocalFontFace(styles);\n    if (localFontFace) {\n      for (const [family, input] of Object.entries(localFontFace)) {\n        const descriptors: FontFaceDescriptors[] = Array.isArray(input)\n          ? input\n          : [input];\n        for (const desc of descriptors) {\n          fontFace(family, desc);\n        }\n      }\n    }\n  }\n\n  if (hasLocalCounterStyle(styles)) {\n    const localCounterStyle = extractLocalCounterStyle(styles);\n    if (localCounterStyle) {\n      for (const [name, descriptors] of Object.entries(localCounterStyle)) {\n        counterStyle(name, descriptors);\n      }\n    }\n  }\n}\n\n/**\n * Collect all ancillary rules into the SSR collector.\n */\nfunction collectAncillarySSR(\n  collector: ServerStyleCollector,\n  styles: Styles,\n  chunks: ProcessedChunk[],\n): void {\n  const usedKf = getUsedKeyframes(styles);\n  if (usedKf) {\n    for (const [name, steps] of Object.entries(usedKf)) {\n      const css = formatKeyframesCSS(name, steps);\n      collector.collectKeyframes(name, css);\n    }\n  }\n\n  if (hasLocalProperties(styles)) {\n    const localProperties = extractLocalProperties(styles);\n    if (localProperties) {\n      for (const [token, definition] of Object.entries(localProperties)) {\n        const css = formatPropertyCSS(token, definition);\n        if (css) {\n          collector.collectProperty(token, css);\n        }\n      }\n    }\n  }\n\n  if (hasLocalFontFace(styles)) {\n    const localFontFace = extractLocalFontFace(styles);\n    if (localFontFace) {\n      for (const [family, input] of Object.entries(localFontFace)) {\n        const descriptors: FontFaceDescriptors[] = Array.isArray(input)\n          ? input\n          : [input];\n        for (const desc of descriptors) {\n          const hash = fontFaceContentHash(family, desc);\n          const css = formatFontFaceRule(family, desc);\n          collector.collectFontFace(hash, css);\n        }\n      }\n    }\n  }\n\n  if (hasLocalCounterStyle(styles)) {\n    const localCounterStyle = extractLocalCounterStyle(styles);\n    if (localCounterStyle) {\n      for (const [name, descriptors] of Object.entries(localCounterStyle)) {\n        const css = formatCounterStyleRule(name, descriptors);\n        collector.collectCounterStyle(name, css);\n      }\n    }\n  }\n\n  if (getConfig().autoPropertyTypes !== false) {\n    const allRules = chunks.flatMap((c) => c.renderResult.rules);\n    if (allRules.length > 0) {\n      collectAutoInferredProperties(allRules, collector, styles);\n    }\n  }\n}\n\n/**\n * Synchronous, hook-free style computation.\n *\n * Resolves recipes, categorizes style keys into chunks, renders CSS rules,\n * allocates class names, and injects / collects / returns the CSS.\n *\n * Three code paths:\n * 1. SSR collector — discovered via ALS or passed explicitly; CSS collected\n * 2. RSC inline — no collector and no `document`; CSS returned as `result.css`\n *    for the caller to emit as an inline `<style>` tag\n * 3. Client inject — CSS injected synchronously into the DOM (idempotent)\n *\n * @param styles - Tasty styles object (or undefined for no styles)\n * @param options - Optional SSR collector override\n */\nexport function computeStyles(\n  styles: Styles | undefined,\n  options?: ComputeStylesOptions,\n): ComputeStylesResult {\n  if (!styles || !hasKeys(styles as Record<string, unknown>)) {\n    return EMPTY_RESULT;\n  }\n\n  const resolved = resolveRecipes(styles);\n  const chunkMap = categorizeStyleKeys(resolved as Record<string, unknown>);\n\n  const collector =\n    options?.ssrCollector !== undefined\n      ? options.ssrCollector\n      : getRegisteredSSRCollector();\n\n  const chunks: ProcessedChunk[] = [];\n\n  if (collector) {\n    collector.collectInternals();\n\n    for (const [chunkName, chunkStyleKeys] of chunkMap) {\n      const chunk = processChunkSSR(\n        collector,\n        resolved,\n        chunkName,\n        chunkStyleKeys,\n      );\n      if (chunk) chunks.push(chunk);\n    }\n\n    collectAncillarySSR(collector, resolved, chunks);\n  } else if (typeof document === 'undefined') {\n    // RSC path: render CSS to strings for inline <style> emission\n    return computeStylesRSC(resolved, chunkMap);\n  } else {\n    injectAncillarySync(resolved);\n\n    const usedKf = getUsedKeyframes(resolved);\n    const nameMap = usedKf ? injectKeyframesSync(usedKf) : null;\n\n    for (const [chunkName, chunkStyleKeys] of chunkMap) {\n      const chunk = processChunkSync(resolved, chunkName, chunkStyleKeys);\n      if (chunk) chunks.push(chunk);\n    }\n\n    if (nameMap) {\n      injectChunkRulesSync(chunks, nameMap);\n    }\n\n    for (const chunk of chunks) {\n      touch(chunk.className);\n    }\n  }\n\n  if (chunks.length === 0) return EMPTY_RESULT;\n  if (chunks.length === 1) return { className: chunks[0].className };\n\n  return { className: chunks.map((c) => c.className).join(' ') };\n}\n"],"mappings":"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"}

package/dist/config.d.ts

@@ -302,25 +302,22 @@ interface TastyConfig {
    */
   presets?: Record<string, TypographyPreset>;
   /**
-   * Tasty styles applied to the `body` tag.
-   * Supports the full Tasty style syntax including style properties,
-   * tokens, state maps, and selector-based sub-styling
-   * (e.g. `$: '> .app'` for elements outside React scope).
+   * Global Tasty styles keyed by CSS selector.
+   * Each entry applies the full Tasty style syntax (style properties,
+   * tokens, state maps, selector-based sub-styling) to the given selector.
    * Injected alongside `:root` tokens when the first style is rendered.
    *
    * @example
    * ```ts
    * configure({
-   *   bodyStyles: {
-   *     fill: '#surface',
-   *     color: '#text',
-   *     preset: 't2',
-   *     margin: 0,
+   *   globalStyles: {
+   *     body: { fill: '#surface', color: '#text', preset: 't2', margin: 0 },
+   *     html: { overflow: 'hidden' },
    *   },
    * });
    * ```
    */
-  bodyStyles?: Styles;
+  globalStyles?: Record<string, Styles>;
 }
 declare const GLOBAL_INJECTOR_KEY = "__TASTY_GLOBAL_INJECTOR__";
 declare global {

package/dist/config.js

@@ -38,12 +38,12 @@ let globalCounterStyle = null;
 let globalProperties = null;
 let globalRecipes = null;
 let globalConfigTokens = null;
-let globalBodyStyles = null;
+let globalStyles = 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__";
+const GTKEY_GLOBAL_STYLES = "__tasty_cfg_global_styles__";
 function setOnGlobalThis(key, value) {
 	globalThis[key] = value;
 }
@@ -56,7 +56,7 @@ function clearGlobalThisConfig() {
 	delete g[GTKEY_FONT_FACE];
 	delete g[GTKEY_COUNTER_STYLE];
 	delete g[GTKEY_PROPERTIES];
-	delete g[GTKEY_BODY_STYLES];
+	delete g[GTKEY_GLOBAL_STYLES];
 }
 /**
 * Default properties shipped with tasty.
@@ -171,6 +171,10 @@ function createDefaultConfig(isTest) {
 function markStylesGenerated() {
 	if (stylesGenerated) return;
 	stylesGenerated = true;
+	if (typeof document !== "undefined" && document.querySelector("style[data-tasty-ssr]")) {
+		warnOnce("ssr-globals-skip", "[Tasty] SSR styles detected — skipping client-side global CSS injection to avoid duplicates.");
+		return;
+	}
 	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)) {
@@ -182,9 +186,11 @@ function markStylesGenerated() {
 		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);
+	if (globalStyles) {
+		for (const [selector, styles] of Object.entries(globalStyles)) if (Object.keys(styles).length > 0) {
+			const rules = renderStyles(styles, selector);
+			if (rules.length > 0) injector.injectGlobal(rules);
+		}
 	}
 }
 /**
@@ -341,27 +347,28 @@ function setGlobalConfigTokens(styles) {
 	setOnGlobalThis(GTKEY_TOKENS, globalConfigTokens);
 }
 /**
-* Get global body styles for injection.
-* Returns null if no body styles configured.
+* Get configured global styles for injection.
+* Returns null if no global styles configured.
 * Reads from globalThis first for cross-module SSR support.
 */
-function getGlobalBodyStyles() {
-	return globalBodyStyles ?? getFromGlobalThis(GTKEY_BODY_STYLES) ?? null;
+function getGlobalStyles() {
+	return globalStyles ?? getFromGlobalThis(GTKEY_GLOBAL_STYLES) ?? null;
 }
 /**
-* Set global body styles (called from configure).
+* Set configured global styles (called from configure).
 * Internal use only.
 */
-function setGlobalBodyStyles(styles) {
+function setGlobalStyles(styles) {
 	if (stylesGenerated) {
-		warnOnce("bodyStyles-after-styles", "[Tasty] Cannot update bodyStyles after styles have been generated.\nThe new body styles will be ignored.");
+		warnOnce("globalStyles-after-styles", "[Tasty] Cannot update globalStyles after styles have been generated.\nThe new global styles will be ignored.");
 		return;
 	}
-	globalBodyStyles = globalBodyStyles ? {
-		...globalBodyStyles,
-		...styles
-	} : styles;
-	setOnGlobalThis(GTKEY_BODY_STYLES, globalBodyStyles);
+	if (globalStyles) for (const [selector, selectorStyles] of Object.entries(styles)) globalStyles[selector] = globalStyles[selector] ? {
+		...globalStyles[selector],
+		...selectorStyles
+	} : selectorStyles;
+	else globalStyles = { ...styles };
+	setOnGlobalThis(GTKEY_GLOBAL_STYLES, globalStyles);
 }
 /**
 * Check if configuration is locked (styles have been generated)
@@ -403,7 +410,7 @@ function configure(config = {}) {
 	let mergedConfigTokens = {};
 	let mergedRecipes = {};
 	let mergedPresets = {};
-	let mergedBodyStyles;
+	const mergedGlobalStyles = {};
 	if (config.plugins) for (const plugin of config.plugins) {
 		if (plugin.states) mergedStates = {
 			...mergedStates,
@@ -437,10 +444,10 @@ function configure(config = {}) {
 			...mergedPresets,
 			...plugin.presets
 		};
-		if (plugin.bodyStyles) mergedBodyStyles = mergedBodyStyles ? {
-			...mergedBodyStyles,
-			...plugin.bodyStyles
-		} : plugin.bodyStyles;
+		if (plugin.globalStyles) for (const [sel, styles] of Object.entries(plugin.globalStyles)) mergedGlobalStyles[sel] = mergedGlobalStyles[sel] ? {
+			...mergedGlobalStyles[sel],
+			...styles
+		} : styles;
 	}
 	if (config.states) mergedStates = {
 		...mergedStates,
@@ -478,10 +485,10 @@ function configure(config = {}) {
 		...mergedRecipes,
 		...config.recipes
 	};
-	if (config.bodyStyles) mergedBodyStyles = mergedBodyStyles ? {
-		...mergedBodyStyles,
-		...config.bodyStyles
-	} : config.bodyStyles;
+	if (config.globalStyles) for (const [sel, styles] of Object.entries(config.globalStyles)) mergedGlobalStyles[sel] = mergedGlobalStyles[sel] ? {
+		...mergedGlobalStyles[sel],
+		...styles
+	} : styles;
 	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.`);
@@ -526,8 +533,8 @@ function configure(config = {}) {
 	}
 	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;
+	if (Object.keys(mergedGlobalStyles).length > 0) setGlobalStyles(mergedGlobalStyles);
+	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, globalStyles: _globalStyles, ...injectorConfig } = config;
 	const fullConfig = {
 		...createDefaultConfig(),
 		...currentConfig,
@@ -568,7 +575,7 @@ function resetConfig() {
 	globalCounterStyle = null;
 	globalRecipes = null;
 	globalConfigTokens = null;
-	globalBodyStyles = null;
+	globalStyles = null;
 	clearGlobalThisConfig();
 	resetGlobalPredefinedTokens();
 	resetHandlers();
@@ -579,6 +586,6 @@ function resetConfig() {
 	delete storage[GLOBAL_INJECTOR_KEY];
 }
 //#endregion
-export { configure, getConfig, getEffectiveProperties, getGlobalBodyStyles, getGlobalConfigTokens, getGlobalCounterStyle, getGlobalFontFace, getGlobalInjector, getGlobalKeyframes, getGlobalRecipes, hasGlobalKeyframes, hasGlobalRecipes, hasStylesGenerated, isConfigLocked, isTestEnvironment, markStylesGenerated, resetConfig };
+export { configure, getConfig, getEffectiveProperties, getGlobalConfigTokens, getGlobalCounterStyle, getGlobalFontFace, getGlobalInjector, getGlobalKeyframes, getGlobalRecipes, getGlobalStyles, hasGlobalKeyframes, hasGlobalRecipes, hasStylesGenerated, isConfigLocked, isTestEnvironment, markStylesGenerated, resetConfig };
 
 //# sourceMappingURL=config.js.map