@tenphi/tasty 2.11.1 → 2.11.2

package/dist/{format-rules-CYriCDwq.js.map → format-rules-Bu_qoamZ.js.map}

@@ -1 +1 @@
-{"version":3,"file":"format-rules-CYriCDwq.js","names":[],"sources":["../src/ssr/ssr-collector-ref.ts","../src/ssr/format-property.ts","../src/ssr/format-rules.ts"],"sourcesContent":["/**\n * Global reference to the SSR collector getter function.\n *\n * This indirection avoids importing 'node:async_hooks' in the browser bundle.\n * The SSR entry point sets this ref when loaded on the server. The useStyles\n * hook calls it if set; on the client it stays null and is never called.\n *\n * Uses a module-level variable as the primary mechanism. In Next.js App\n * Router the RSC and SSR module graphs load separate copies of this module,\n * so the getter registered by TastyRegistry (SSR layer) is invisible to\n * server components (RSC layer) — which correctly fall through to inline\n * RSC styles.\n *\n * A globalThis fallback (`registerSSRCollectorGetterGlobal`) is provided\n * for frameworks like Astro where middleware and page components live in\n * different module graphs and must share the getter across them.\n */\n\nimport type { ServerStyleCollector } from './collector';\n\ntype SSRCollectorGetter = () => ServerStyleCollector | null;\n\nconst GETTER_KEY = '__tasty_ssr_collector_getter__';\n\nlet _getSSRCollector: SSRCollectorGetter | null = null;\n\n/**\n * Register the collector getter in the current module graph only.\n * Used by Next.js TastyRegistry.\n */\nexport function registerSSRCollectorGetter(fn: SSRCollectorGetter): void {\n  _getSSRCollector = fn;\n}\n\n/**\n * Register the collector getter on globalThis so it is visible across\n * separate module graphs (e.g. Astro middleware ↔ page components).\n */\nexport function registerSSRCollectorGetterGlobal(fn: SSRCollectorGetter): void {\n  (globalThis as Record<string, unknown>)[GETTER_KEY] = fn;\n}\n\n/**\n * Retrieve the SSR collector: module-level first, globalThis fallback.\n */\nexport function getRegisteredSSRCollector(): ServerStyleCollector | null {\n  if (_getSSRCollector) return _getSSRCollector();\n  const getter = (globalThis as Record<string, unknown>)[GETTER_KEY] as\n    | SSRCollectorGetter\n    | undefined;\n  return getter ? getter() : null;\n}\n","/**\n * Format @property CSS rules for SSR output.\n *\n * Replicates the CSS construction from StyleInjector.property()\n * but returns a CSS string instead of inserting into the DOM.\n */\n\nimport type { PropertyDefinition } from '../injector/types';\nimport { getEffectiveDefinition } from '../properties';\nimport {\n  colorInitialValueToComponents,\n  getColorSpaceSuffix,\n  getComponentPropertySyntax,\n} from '../utils/color-space';\nimport type { StyleValue } from '../utils/styles';\nimport { parseStyle } from '../utils/styles';\n\n/**\n * Format a single @property rule as a CSS string.\n *\n * Returns the full `@property --name { ... }` text, or empty string\n * if the token is invalid. For color properties, also returns\n * the companion component property.\n */\nexport function formatPropertyCSS(\n  token: string,\n  definition: PropertyDefinition,\n): string {\n  const result = getEffectiveDefinition(token, definition);\n  if (!result.isValid) return '';\n\n  const rules: string[] = [];\n\n  rules.push(buildPropertyRule(result.cssName, result.definition));\n\n  if (result.isColor) {\n    const suffix = getColorSpaceSuffix();\n    const componentCssName = `${result.cssName}-${suffix}`;\n    const componentInitial = colorInitialValueToComponents(\n      result.definition.initialValue,\n    );\n    rules.push(\n      buildPropertyRule(componentCssName, {\n        syntax: getComponentPropertySyntax(),\n        inherits: result.definition.inherits,\n        initialValue: componentInitial,\n      }),\n    );\n  }\n\n  return rules.join('\\n');\n}\n\nfunction buildPropertyRule(\n  cssName: string,\n  definition: PropertyDefinition,\n): string {\n  const parts: string[] = [];\n\n  if (definition.syntax != null) {\n    let syntax = String(definition.syntax).trim();\n    if (!/^['\"]/u.test(syntax)) syntax = `\"${syntax}\"`;\n    parts.push(`syntax: ${syntax};`);\n  }\n\n  const inherits = definition.inherits ?? true;\n  parts.push(`inherits: ${inherits ? 'true' : 'false'};`);\n\n  if (definition.initialValue != null) {\n    let initialValueStr: string;\n    if (typeof definition.initialValue === 'number') {\n      initialValueStr = String(definition.initialValue);\n    } else {\n      initialValueStr = parseStyle(\n        definition.initialValue as StyleValue,\n      ).output;\n    }\n    parts.push(`initial-value: ${initialValueStr};`);\n  }\n\n  const declarations = parts.join(' ').trim();\n  return `@property ${cssName} { ${declarations} }`;\n}\n","/**\n * Shared CSS rule formatting utility.\n *\n * Extracted from SheetManager to allow both the DOM-based injector (client)\n * and the ServerStyleCollector (server) to produce identical CSS text\n * from StyleResult arrays.\n */\n\nimport type { StyleResult } from '../pipeline';\n\n/**\n * Resolve selectors for a rule, applying className-based specificity doubling\n * and rootPrefix handling. Mirrors the logic in StyleInjector.inject().\n */\nfunction resolveSelector(rule: StyleResult, className: string): string {\n  let selector = rule.selector;\n\n  if (rule.needsClassName) {\n    const selectorParts = selector ? selector.split('|||') : [''];\n    const classPrefix = `.${className}.${className}`;\n\n    selector = selectorParts\n      .map((part) => {\n        const classSelector = part ? `${classPrefix}${part}` : classPrefix;\n\n        if (rule.rootPrefix) {\n          return `${rule.rootPrefix} ${classSelector}`;\n        }\n        return classSelector;\n      })\n      .join(', ');\n  }\n\n  return selector;\n}\n\ninterface GroupedRule {\n  selector: string;\n  declarations: string;\n  atRules?: string[];\n  startingStyle?: boolean;\n}\n\n/**\n * Group rules by selector + at-rules + startingStyle and merge their declarations.\n * Mirrors the grouping logic in SheetManager.insertRule().\n */\nfunction groupRules(rules: GroupedRule[]): GroupedRule[] {\n  const groupMap = new Map<string, GroupedRule>();\n  const order: string[] = [];\n\n  const atKey = (at?: string[]) => (at && at.length ? at.join('|') : '');\n\n  for (const r of rules) {\n    const key = `${atKey(r.atRules)}||${r.selector}||${r.startingStyle ? '1' : '0'}`;\n    const existing = groupMap.get(key);\n    if (existing) {\n      existing.declarations = existing.declarations\n        ? `${existing.declarations} ${r.declarations}`\n        : r.declarations;\n    } else {\n      groupMap.set(key, {\n        selector: r.selector,\n        atRules: r.atRules,\n        startingStyle: r.startingStyle,\n        declarations: r.declarations,\n      });\n      order.push(key);\n    }\n  }\n\n  return order.map((key) => groupMap.get(key)!);\n}\n\n/**\n * Format an array of StyleResult rules into a CSS text string.\n *\n * Applies className-based specificity doubling (.cls.cls),\n * groups rules by selector + at-rules, and wraps with at-rule blocks.\n *\n * Produces the same CSS text as SheetManager.insertRule() would insert\n * into the DOM, but as a plain string suitable for SSR output.\n */\nexport function formatRules(rules: StyleResult[], className: string): string {\n  if (rules.length === 0) return '';\n\n  const resolvedRules = rules.map((rule) => ({\n    selector: resolveSelector(rule, className),\n    declarations: rule.declarations,\n    atRules: rule.atRules,\n    startingStyle: rule.startingStyle,\n  }));\n\n  const grouped = groupRules(resolvedRules);\n  const cssRules: string[] = [];\n\n  for (const rule of grouped) {\n    const innerContent = rule.startingStyle\n      ? `@starting-style { ${rule.declarations} }`\n      : rule.declarations;\n    const baseRule = `${rule.selector} { ${innerContent} }`;\n\n    let fullRule = baseRule;\n    if (rule.atRules && rule.atRules.length > 0) {\n      fullRule = rule.atRules.reduce(\n        (css, atRule) => `${atRule} { ${css} }`,\n        baseRule,\n      );\n    }\n\n    cssRules.push(fullRule);\n  }\n\n  return cssRules.join('\\n');\n}\n"],"mappings":"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"}
+{"version":3,"file":"format-rules-Bu_qoamZ.js","names":[],"sources":["../src/ssr/ssr-collector-ref.ts","../src/ssr/format-property.ts","../src/ssr/format-rules.ts"],"sourcesContent":["/**\n * Global reference to the SSR collector getter function.\n *\n * This indirection avoids importing 'node:async_hooks' in the browser bundle.\n * The SSR entry point sets this ref when loaded on the server. The useStyles\n * hook calls it if set; on the client it stays null and is never called.\n *\n * Uses a module-level variable as the primary mechanism. In Next.js App\n * Router the RSC and SSR module graphs load separate copies of this module,\n * so the getter registered by TastyRegistry (SSR layer) is invisible to\n * server components (RSC layer) — which correctly fall through to inline\n * RSC styles.\n *\n * A globalThis fallback (`registerSSRCollectorGetterGlobal`) is provided\n * for frameworks like Astro where middleware and page components live in\n * different module graphs and must share the getter across them.\n */\n\nimport type { ServerStyleCollector } from './collector';\n\ntype SSRCollectorGetter = () => ServerStyleCollector | null;\n\nconst GETTER_KEY = '__tasty_ssr_collector_getter__';\n\nlet _getSSRCollector: SSRCollectorGetter | null = null;\n\n/**\n * Register the collector getter in the current module graph only.\n * Used by Next.js TastyRegistry.\n */\nexport function registerSSRCollectorGetter(fn: SSRCollectorGetter): void {\n  _getSSRCollector = fn;\n}\n\n/**\n * Register the collector getter on globalThis so it is visible across\n * separate module graphs (e.g. Astro middleware ↔ page components).\n */\nexport function registerSSRCollectorGetterGlobal(fn: SSRCollectorGetter): void {\n  (globalThis as Record<string, unknown>)[GETTER_KEY] = fn;\n}\n\n/**\n * Retrieve the SSR collector: module-level first, globalThis fallback.\n */\nexport function getRegisteredSSRCollector(): ServerStyleCollector | null {\n  if (_getSSRCollector) return _getSSRCollector();\n  const getter = (globalThis as Record<string, unknown>)[GETTER_KEY] as\n    | SSRCollectorGetter\n    | undefined;\n  return getter ? getter() : null;\n}\n","/**\n * Format @property CSS rules for SSR output.\n *\n * Replicates the CSS construction from StyleInjector.property()\n * but returns a CSS string instead of inserting into the DOM.\n */\n\nimport type { PropertyDefinition } from '../injector/types';\nimport { getEffectiveDefinition } from '../properties';\nimport {\n  colorInitialValueToComponents,\n  getColorSpaceSuffix,\n  getComponentPropertySyntax,\n} from '../utils/color-space';\nimport type { StyleValue } from '../utils/styles';\nimport { parseStyle } from '../utils/styles';\n\n/**\n * Format a single @property rule as a CSS string.\n *\n * Returns the full `@property --name { ... }` text, or empty string\n * if the token is invalid. For color properties, also returns\n * the companion component property.\n */\nexport function formatPropertyCSS(\n  token: string,\n  definition: PropertyDefinition,\n): string {\n  const result = getEffectiveDefinition(token, definition);\n  if (!result.isValid) return '';\n\n  const rules: string[] = [];\n\n  rules.push(buildPropertyRule(result.cssName, result.definition));\n\n  if (result.isColor) {\n    const suffix = getColorSpaceSuffix();\n    const componentCssName = `${result.cssName}-${suffix}`;\n    const componentInitial = colorInitialValueToComponents(\n      result.definition.initialValue,\n    );\n    rules.push(\n      buildPropertyRule(componentCssName, {\n        syntax: getComponentPropertySyntax(),\n        inherits: result.definition.inherits,\n        initialValue: componentInitial,\n      }),\n    );\n  }\n\n  return rules.join('\\n');\n}\n\nfunction buildPropertyRule(\n  cssName: string,\n  definition: PropertyDefinition,\n): string {\n  const parts: string[] = [];\n\n  if (definition.syntax != null) {\n    let syntax = String(definition.syntax).trim();\n    if (!/^['\"]/u.test(syntax)) syntax = `\"${syntax}\"`;\n    parts.push(`syntax: ${syntax};`);\n  }\n\n  const inherits = definition.inherits ?? true;\n  parts.push(`inherits: ${inherits ? 'true' : 'false'};`);\n\n  if (definition.initialValue != null) {\n    let initialValueStr: string;\n    if (typeof definition.initialValue === 'number') {\n      initialValueStr = String(definition.initialValue);\n    } else {\n      initialValueStr = parseStyle(\n        definition.initialValue as StyleValue,\n      ).output;\n    }\n    parts.push(`initial-value: ${initialValueStr};`);\n  }\n\n  const declarations = parts.join(' ').trim();\n  return `@property ${cssName} { ${declarations} }`;\n}\n","/**\n * Shared CSS rule formatting utility.\n *\n * Extracted from SheetManager to allow both the DOM-based injector (client)\n * and the ServerStyleCollector (server) to produce identical CSS text\n * from StyleResult arrays.\n */\n\nimport type { StyleResult } from '../pipeline';\n\n/**\n * Resolve selectors for a rule, applying className-based specificity doubling\n * and rootPrefix handling. Mirrors the logic in StyleInjector.inject().\n */\nfunction resolveSelector(rule: StyleResult, className: string): string {\n  let selector = rule.selector;\n\n  if (rule.needsClassName) {\n    const selectorParts = selector ? selector.split('|||') : [''];\n    const classPrefix = `.${className}.${className}`;\n\n    selector = selectorParts\n      .map((part) => {\n        const classSelector = part ? `${classPrefix}${part}` : classPrefix;\n\n        if (rule.rootPrefix) {\n          return `${rule.rootPrefix} ${classSelector}`;\n        }\n        return classSelector;\n      })\n      .join(', ');\n  }\n\n  return selector;\n}\n\ninterface GroupedRule {\n  selector: string;\n  declarations: string;\n  atRules?: string[];\n  startingStyle?: boolean;\n}\n\n/**\n * Group rules by selector + at-rules + startingStyle and merge their declarations.\n * Mirrors the grouping logic in SheetManager.insertRule().\n */\nfunction groupRules(rules: GroupedRule[]): GroupedRule[] {\n  const groupMap = new Map<string, GroupedRule>();\n  const order: string[] = [];\n\n  const atKey = (at?: string[]) => (at && at.length ? at.join('|') : '');\n\n  for (const r of rules) {\n    const key = `${atKey(r.atRules)}||${r.selector}||${r.startingStyle ? '1' : '0'}`;\n    const existing = groupMap.get(key);\n    if (existing) {\n      existing.declarations = existing.declarations\n        ? `${existing.declarations} ${r.declarations}`\n        : r.declarations;\n    } else {\n      groupMap.set(key, {\n        selector: r.selector,\n        atRules: r.atRules,\n        startingStyle: r.startingStyle,\n        declarations: r.declarations,\n      });\n      order.push(key);\n    }\n  }\n\n  return order.map((key) => groupMap.get(key)!);\n}\n\n/**\n * Format an array of StyleResult rules into a CSS text string.\n *\n * Applies className-based specificity doubling (.cls.cls),\n * groups rules by selector + at-rules, and wraps with at-rule blocks.\n *\n * Produces the same CSS text as SheetManager.insertRule() would insert\n * into the DOM, but as a plain string suitable for SSR output.\n */\nexport function formatRules(rules: StyleResult[], className: string): string {\n  if (rules.length === 0) return '';\n\n  const resolvedRules = rules.map((rule) => ({\n    selector: resolveSelector(rule, className),\n    declarations: rule.declarations,\n    atRules: rule.atRules,\n    startingStyle: rule.startingStyle,\n  }));\n\n  const grouped = groupRules(resolvedRules);\n  const cssRules: string[] = [];\n\n  for (const rule of grouped) {\n    const innerContent = rule.startingStyle\n      ? `@starting-style { ${rule.declarations} }`\n      : rule.declarations;\n    const baseRule = `${rule.selector} { ${innerContent} }`;\n\n    let fullRule = baseRule;\n    if (rule.atRules && rule.atRules.length > 0) {\n      fullRule = rule.atRules.reduce(\n        (css, atRule) => `${atRule} { ${css} }`,\n        baseRule,\n      );\n    }\n\n    cssRules.push(fullRule);\n  }\n\n  return cssRules.join('\\n');\n}\n"],"mappings":"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"}

package/dist/{hydrate-GVTorHpU.js → hydrate-CKk-rgmY.js}

@@ -1,4 +1,4 @@
-import { s as getGlobalInjector } from "./config-YDAcLaVf.js";
+import { s as getGlobalInjector } from "./config-_cYm9LPl.js";
 //#region src/ssr/hydrate.ts
 /**
 * Client-side cache hydration for SSR/RSC.
@@ -42,4 +42,4 @@ function hydrateTastyCache(state) {
 //#endregion
 export { hydrateTastyClasses as n, hydrateTastyCache as t };
 
-//# sourceMappingURL=hydrate-GVTorHpU.js.map
+//# sourceMappingURL=hydrate-CKk-rgmY.js.map

package/dist/{hydrate-GVTorHpU.js.map → hydrate-CKk-rgmY.js.map}

@@ -1 +1 @@
-{"version":3,"file":"hydrate-GVTorHpU.js","names":[],"sources":["../src/ssr/hydrate.ts"],"sourcesContent":["/**\n * Client-side cache hydration for SSR/RSC.\n *\n * Pre-populates the client injector's rules map with class names\n * rendered on the server. With hash-based naming, the client derives\n * the same class name from the same cache key, so only the class name\n * list needs to cross the wire — no cache keys or counters.\n */\n\nimport { getGlobalInjector } from '../config';\nimport { HYDRATED_RULE_INDEX } from '../injector/types';\n\n/**\n * Pre-populate the client-side style registry from the server's class name list.\n *\n * Call this before ReactDOM.hydrateRoot() or ensure it runs before\n * any tasty() component renders on the client.\n *\n * When called without arguments, reads the class list from `window.__TASTY__`\n * (populated by inline scripts emitted during SSR/RSC streaming).\n */\nexport function hydrateTastyClasses(classes?: string[]): void {\n  if (typeof document === 'undefined') return;\n\n  if (!classes) {\n    classes = typeof window !== 'undefined' ? window.__TASTY__ : undefined;\n  }\n\n  if (!classes?.length) return;\n\n  const injector = getGlobalInjector();\n  const registry = injector._sheetManager.getRegistry(document);\n\n  for (const cls of classes) {\n    if (!registry.rules.has(cls)) {\n      registry.rules.set(cls, {\n        className: cls,\n        ruleIndex: HYDRATED_RULE_INDEX,\n        sheetIndex: HYDRATED_RULE_INDEX,\n      });\n      registry.refCounts.set(cls, 0);\n    }\n  }\n}\n\n/**\n * @deprecated Use `hydrateTastyClasses()` instead. This alias exists\n * for backwards compatibility and will be removed in a future major version.\n */\nexport function hydrateTastyCache(state?: {\n  entries?: Record<string, string>;\n}): void {\n  if (state?.entries) {\n    hydrateTastyClasses(Object.values(state.entries));\n  } else {\n    hydrateTastyClasses();\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAqBA,SAAgB,oBAAoB,SAA0B;CAC5D,IAAI,OAAO,aAAa,aAAa;CAErC,IAAI,CAAC,SACH,UAAU,OAAO,WAAW,cAAc,OAAO,YAAY,KAAA;CAG/D,IAAI,CAAC,SAAS,QAAQ;CAGtB,MAAM,WADW,kBACO,CAAC,CAAC,cAAc,YAAY,QAAQ;CAE5D,KAAK,MAAM,OAAO,SAChB,IAAI,CAAC,SAAS,MAAM,IAAI,GAAG,GAAG;EAC5B,SAAS,MAAM,IAAI,KAAK;GACtB,WAAW;GACX,WAAA;GACA,YAAA;EACF,CAAC;EACD,SAAS,UAAU,IAAI,KAAK,CAAC;CAC/B;AAEJ;;;;;AAMA,SAAgB,kBAAkB,OAEzB;CACP,IAAI,OAAO,SACT,oBAAoB,OAAO,OAAO,MAAM,OAAO,CAAC;MAEhD,oBAAoB;AAExB"}
+{"version":3,"file":"hydrate-CKk-rgmY.js","names":[],"sources":["../src/ssr/hydrate.ts"],"sourcesContent":["/**\n * Client-side cache hydration for SSR/RSC.\n *\n * Pre-populates the client injector's rules map with class names\n * rendered on the server. With hash-based naming, the client derives\n * the same class name from the same cache key, so only the class name\n * list needs to cross the wire — no cache keys or counters.\n */\n\nimport { getGlobalInjector } from '../config';\nimport { HYDRATED_RULE_INDEX } from '../injector/types';\n\n/**\n * Pre-populate the client-side style registry from the server's class name list.\n *\n * Call this before ReactDOM.hydrateRoot() or ensure it runs before\n * any tasty() component renders on the client.\n *\n * When called without arguments, reads the class list from `window.__TASTY__`\n * (populated by inline scripts emitted during SSR/RSC streaming).\n */\nexport function hydrateTastyClasses(classes?: string[]): void {\n  if (typeof document === 'undefined') return;\n\n  if (!classes) {\n    classes = typeof window !== 'undefined' ? window.__TASTY__ : undefined;\n  }\n\n  if (!classes?.length) return;\n\n  const injector = getGlobalInjector();\n  const registry = injector._sheetManager.getRegistry(document);\n\n  for (const cls of classes) {\n    if (!registry.rules.has(cls)) {\n      registry.rules.set(cls, {\n        className: cls,\n        ruleIndex: HYDRATED_RULE_INDEX,\n        sheetIndex: HYDRATED_RULE_INDEX,\n      });\n      registry.refCounts.set(cls, 0);\n    }\n  }\n}\n\n/**\n * @deprecated Use `hydrateTastyClasses()` instead. This alias exists\n * for backwards compatibility and will be removed in a future major version.\n */\nexport function hydrateTastyCache(state?: {\n  entries?: Record<string, string>;\n}): void {\n  if (state?.entries) {\n    hydrateTastyClasses(Object.values(state.entries));\n  } else {\n    hydrateTastyClasses();\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAqBA,SAAgB,oBAAoB,SAA0B;CAC5D,IAAI,OAAO,aAAa,aAAa;CAErC,IAAI,CAAC,SACH,UAAU,OAAO,WAAW,cAAc,OAAO,YAAY,KAAA;CAG/D,IAAI,CAAC,SAAS,QAAQ;CAGtB,MAAM,WADW,kBACO,CAAC,CAAC,cAAc,YAAY,QAAQ;CAE5D,KAAK,MAAM,OAAO,SAChB,IAAI,CAAC,SAAS,MAAM,IAAI,GAAG,GAAG;EAC5B,SAAS,MAAM,IAAI,KAAK;GACtB,WAAW;GACX,WAAA;GACA,YAAA;EACF,CAAC;EACD,SAAS,UAAU,IAAI,KAAK,CAAC;CAC/B;AAEJ;;;;;AAMA,SAAgB,kBAAkB,OAEzB;CACP,IAAI,OAAO,SACT,oBAAoB,OAAO,OAAO,MAAM,OAAO,CAAC;MAEhD,oBAAoB;AAExB"}

package/dist/{index-BYtnj_gA.d.ts → index-BjnGYI5D.d.ts}

@@ -1,6 +1,6 @@
-import { Dt as StyleInjectorConfig, I as StyleValue, L as StyleValueStateMap, b as Styles, bt as KeyframesResult, ct as CacheMetrics, dt as FontFaceDescriptors, ft as FontFaceInput, gt as InjectResult, ht as GlobalInjectResult, it as StyleDetails, lt as CounterStyleDescriptors, mt as GCOptions, n as StyleResult, st as CSSProperties$1, x as StylesInterface, xt as KeyframesSteps } from "./index-B9ih23uv.js";
-import { g as TastyPluginFactory, x as StyleInjector } from "./config-BtK9fUaz.js";
-import { t as ServerStyleCollector } from "./collector-DYA5AOwr.js";
+import { Dt as StyleInjectorConfig, I as StyleValue, L as StyleValueStateMap, b as Styles, bt as KeyframesResult, ct as CacheMetrics, dt as FontFaceDescriptors, ft as FontFaceInput, gt as InjectResult, ht as GlobalInjectResult, it as StyleDetails, lt as CounterStyleDescriptors, mt as GCOptions, n as StyleResult, st as CSSProperties$1, x as StylesInterface, xt as KeyframesSteps } from "./index-tRick_JW.js";
+import { g as TastyPluginFactory, x as StyleInjector } from "./config-V0XC9iz_.js";
+import { t as ServerStyleCollector } from "./collector-yqgjGje7.js";
 import { AllHTMLAttributes, CSSProperties, ComponentType, ElementType, ForwardRefExoticComponent, JSX, PropsWithoutRef, RefAttributes } from "react";
 
 //#region src/utils/name-prefix.d.ts
@@ -434,6 +434,10 @@ interface UseGlobalStylesOptions {
  * 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
@@ -456,9 +460,8 @@ declare function useGlobalStyles(selector: string, styles?: Styles, options?: Us
 //#region src/hooks/useRawCSS.d.ts
 interface UseRawCSSOptions {
   /**
-   * Shadow root or document to inject into.
-   * Note: `root` is not part of the update-tracking comparison — changing
-   * only the root for the same id/content will not re-inject.
+   * Shadow root or document to inject into. Update tracking is per-root: the
+   * same id in two roots holds a separate injection in each.
    */
   root?: Document | ShadowRoot;
   /**
@@ -484,6 +487,11 @@ interface UseKeyframesOptions {
  *
  * Works in all environments: client, SSR with collector, and React Server Components.
  *
+ * Passing `name` claims a slot owned by that one call site (like `useRawCSS`'s
+ * `id`): when its steps change, the previous injection is disposed and the name
+ * is reused, so the rules don't accumulate. Anonymous keyframes are permanent
+ * and shared by content.
+ *
  * @example Basic usage - steps object is the dependency
  * ```tsx
  * function MyComponent() {
@@ -1775,4 +1783,4 @@ declare const tastyDebug: {
 };
 //#endregion
 export { UsePropertyOptions as $, BLOCK_OUTER_STYLES as $t, chunkSheetRegistry as A, BlockInnerStyleProps as At, DISPLAY_CHUNK_STYLES as B, Mods as Bt, injectRawCSS as C, VariantMap as Ct, property$1 as D, BaseProps as Dt, keyframes as E, AllBaseProps as Et, APPEARANCE_CHUNK_STYLES as F, DimensionStyleProps as Ft, categorizeStyleKeys as G, TagName as Gt, LAYOUT_CHUNK_STYLES as H, PositionStyleProps as Ht, CHUNK_NAMES as I, FlowStyleProps as It, okhslFunc as J, TextStyleProps as Jt, okhstFunc as K, TastyExtensionConfig as Kt, ChunkInfo$1 as L, GlobalStyledProps as Lt, ComputeStylesResult as M, BlockStyleProps as Mt, computeStyles as N, ColorStyleProps as Nt, touch as O, BasePropsWithoutChildren as Ot, styleHandlers as P, ContainerStyleProps as Pt, useFontFace as Q, BLOCK_INNER_STYLES as Qt, ChunkName as R, InnerStyleProps as Rt, injectGlobal as S, TokenPropsInput as St, isPropertyDefined as T, tasty as Tt, POSITION_CHUNK_STYLES as U, Props as Ut, FONT_CHUNK_STYLES as V, OuterStyleProps as Vt, STYLE_TO_CHUNK as W, ShortGridStyles as Wt, getDisplayName as X, Tokens as Xt, okhslPlugin as Y, TokenValue as Yt, useCounterStyle as Z, BASE_STYLES as Zt, getCssText as _, SubElementProps as _t, resolveRecipes as a, INNER_STYLES as an, UseStylesResult as at, getRawCSSText as b, TastyPolymorphicComponent as bt, color$1 as c, TEXT_STYLES as cn, Element$1 as ct, cleanup as d, ModPropsInput as dt, BLOCK_STYLES as en, useProperty as et, counterStyle as f, ResolveAsProps as ft, gc as g, SubElementDefinition as gt, fontFace as h, ResolveTokenProps as ht, warn as i, FLOW_STYLES as in, UseStylesOptions as it, ComputeStylesOptions as j, BlockOuterStyleProps as jt, ChunkSheetRegistry as k, BaseStyleProps as kt, filterBaseProps as l, DEFAULT_NAME_PREFIX as ln, ElementsDefinition as lt, destroy as m, ResolveModProps as mt, processTokens as n, CONTAINER_STYLES as nn, useRawCSS as nt, dotize as o, OUTER_STYLES as on, useStyles as ot, createInjector as p, ResolveModPropDef as pt, okhstPlugin as q, TastyThemeNames as qt, deprecationWarning as r, DIMENSION_STYLES as rn, useGlobalStyles as rt, _modAttrs as s, POSITION_STYLES as sn, AllBasePropsWithMods as st, tastyDebug as t, COLOR_STYLES as tn, useKeyframes as tt, PropertyOptions as u, DEFAULT_ZERO_NAME_PREFIX as un, ModPropDef as ut, getCssTextForNode as v, TastyElementOptions as vt, injector as w, WithVariant as wt, inject as x, TastyProps as xt, getIsTestEnvironment as y, TastyElementProps as yt, DIMENSION_CHUNK_STYLES as z, ModValue as zt };
-//# sourceMappingURL=index-BYtnj_gA.d.ts.map
+//# sourceMappingURL=index-BjnGYI5D.d.ts.map

package/dist/{index-B9ih23uv.d.ts → index-tRick_JW.d.ts}

@@ -119,6 +119,17 @@ interface SheetInfo {
   constructableSheet?: CSSStyleSheet;
   ruleCount: number;
   holes: number[];
+  /**
+   * True when this sheet is written through `textContent` instead of CSSOM.
+   * Decided once at sheet creation so a sheet is never half CSSOM / half text.
+   */
+  textMode?: boolean;
+  /**
+   * Inserted rule texts in rule-index order. Maintained only in text mode —
+   * it is what makes deletion possible there, since `textContent` cannot be
+   * edited rule-by-rule and has to be rebuilt.
+   */
+  textRules?: string[];
 }
 interface CleanupStats {
   timestamp: number;
@@ -1292,4 +1303,4 @@ declare function renderStyles(styles?: Styles, classNameOrSelector?: undefined,
 declare function renderStyles(styles: Styles | undefined, classNameOrSelector: string, options?: RenderStylesOptions): StyleResult[];
 //#endregion
 export { strToRgb as $, RawStyleHandler as A, getGlobalFuncs as B, SuffixForSelector as C, RawCSSResult as Ct, CUSTOM_UNITS as D, StyleInjectorConfig as Dt, CSSMap as E, SheetInfo as Et, StylePropValue as F, parseStyle as G, getGlobalPredefinedTokens as H, StyleValue as I, stringifyStyles as J, resetGlobalPredefinedTokens as K, StyleValueStateMap as L, StyleHandlerDefinition as M, StyleHandlerResult as N, DIRECTIONS as O, StyleRule as Ot, StyleMap as P, hslToRgbValues as Q, customFunc as R, StylesWithoutSelectors as S, PropertyDefinition as St, TastyPresetNames as T, RuleInfo as Tt, normalizeColorTokenValue as U, getGlobalParser as V, parseColor as W, getRgbValuesFromRgbaString as X, getNamedColorHex as Y, hexToRgb as Z, NotSelector as _, InjectionMode as _t, ParseStateKeyOptions as a, StyleDetailsPart as at, Styles as b, KeyframesResult as bt, ParsedAdvancedState as c, CacheMetrics as ct, getGlobalPredefinedStates as d, FontFaceDescriptors as dt, StyleParser as et, setGlobalPredefinedStates as f, FontFaceInput as ft, NoType as g, InjectResult as gt, ConfigTokens as h, GlobalInjectResult as ht, renderStyles as i, StyleDetails as it, StyleHandler as j, ParsedColor as k, StyleUsage as kt, StateParserContext as l, CounterStyleDescriptors as lt, ConfigTokenValue as m, GCOptions as mt, StyleResult as n, ParserOptions as nt, parseStateKey as o, UnitHandler as ot, ConditionNode as p, GCConfig as pt, setGlobalPredefinedTokens as q, isSelector as r, ProcessedStyle as rt, AtRuleContext as s, CSSProperties as st, RenderResult as t, Bucket as tt, createStateParserContext as u, DisposeFunction as ut, RecipeStyles as v, KeyframesCacheEntry as vt, TastyNamedColors as w, RootRegistry as wt, StylesInterface as x, KeyframesSteps as xt, Selector as y, KeyframesInfo as yt, filterMods as z };
-//# sourceMappingURL=index-B9ih23uv.d.ts.map
+//# sourceMappingURL=index-tRick_JW.d.ts.map

package/dist/index.d.ts

@@ -1,5 +1,5 @@
-import { $ as strToRgb, A as RawStyleHandler, B as getGlobalFuncs, C as SuffixForSelector, Ct as RawCSSResult, D as CUSTOM_UNITS, Dt as StyleInjectorConfig, E as CSSMap, Et as SheetInfo, F as StylePropValue, G as parseStyle, H as getGlobalPredefinedTokens, I as StyleValue, J as stringifyStyles, K as resetGlobalPredefinedTokens, L as StyleValueStateMap, M as StyleHandlerDefinition, N as StyleHandlerResult, O as DIRECTIONS, Ot as StyleRule, P as StyleMap, Q as hslToRgbValues, R as customFunc, S as StylesWithoutSelectors, St as PropertyDefinition, T as TastyPresetNames, Tt as RuleInfo, U as normalizeColorTokenValue, V as getGlobalParser, W as parseColor, X as getRgbValuesFromRgbaString, Y as getNamedColorHex, Z as hexToRgb, _ as NotSelector, _t as InjectionMode, a as ParseStateKeyOptions, at as StyleDetailsPart, b as Styles, bt as KeyframesResult, c as ParsedAdvancedState, ct as CacheMetrics, d as getGlobalPredefinedStates, dt as FontFaceDescriptors, et as StyleParser, f as setGlobalPredefinedStates, ft as FontFaceInput, g as NoType, gt as InjectResult, h as ConfigTokens, i as renderStyles, it as StyleDetails, j as StyleHandler, k as ParsedColor, kt as StyleUsage, l as StateParserContext, lt as CounterStyleDescriptors, m as ConfigTokenValue, mt as GCOptions, n as StyleResult, nt as ParserOptions, o as parseStateKey, ot as UnitHandler, p as ConditionNode, pt as GCConfig, q as setGlobalPredefinedTokens, r as isSelector, rt as ProcessedStyle, s as AtRuleContext, st as CSSProperties, t as RenderResult, tt as Bucket, u as createStateParserContext, ut as DisposeFunction, v as RecipeStyles, vt as KeyframesCacheEntry, w as TastyNamedColors, wt as RootRegistry, x as StylesInterface, xt as KeyframesSteps, y as Selector, yt as KeyframesInfo, z as filterMods } from "./index-B9ih23uv.js";
-import { S as SheetManager, _ as TypographyPreset, a as getGlobalFontFace, b as ColorSpace, c as getNamePrefix, d as hasStylesGenerated, f as isConfigLocked, g as TastyPluginFactory, h as TastyPlugin, i as getGlobalCounterStyle, l as hasGlobalKeyframes, m as resetConfig, n as configure, o as getGlobalKeyframes, p as isTestEnvironment, r as getConfig, s as getGlobalRecipes, t as TastyConfig, u as hasGlobalRecipes, v as TypographyTokenValue, x as StyleInjector, y as generateTypographyTokens } from "./config-BtK9fUaz.js";
-import { $ as UsePropertyOptions, $t as BLOCK_OUTER_STYLES, A as chunkSheetRegistry, At as BlockInnerStyleProps, B as DISPLAY_CHUNK_STYLES, Bt as Mods, C as injectRawCSS, Ct as VariantMap, D as property, Dt as BaseProps, E as keyframes, Et as AllBaseProps, F as APPEARANCE_CHUNK_STYLES, Ft as DimensionStyleProps, G as categorizeStyleKeys, Gt as TagName, H as LAYOUT_CHUNK_STYLES, Ht as PositionStyleProps, I as CHUNK_NAMES, It as FlowStyleProps, J as okhslFunc, Jt as TextStyleProps, K as okhstFunc, Kt as TastyExtensionConfig, L as ChunkInfo, Lt as GlobalStyledProps, M as ComputeStylesResult, Mt as BlockStyleProps, N as computeStyles, Nt as ColorStyleProps, O as touch, Ot as BasePropsWithoutChildren, P as styleHandlers, Pt as ContainerStyleProps, Q as useFontFace, Qt as BLOCK_INNER_STYLES, R as ChunkName, Rt as InnerStyleProps, S as injectGlobal, St as TokenPropsInput, T as isPropertyDefined, Tt as tasty, U as POSITION_CHUNK_STYLES, Ut as Props, V as FONT_CHUNK_STYLES, Vt as OuterStyleProps, W as STYLE_TO_CHUNK, Wt as ShortGridStyles, X as getDisplayName, Xt as Tokens, Y as okhslPlugin, Yt as TokenValue, Z as useCounterStyle, Zt as BASE_STYLES, _ as getCssText, _t as SubElementProps, a as resolveRecipes, an as INNER_STYLES, at as UseStylesResult, b as getRawCSSText, bt as TastyPolymorphicComponent, c as color, cn as TEXT_STYLES, ct as Element, d as cleanup, dt as ModPropsInput, en as BLOCK_STYLES, et as useProperty, f as counterStyle, ft as ResolveAsProps, g as gc, gt as SubElementDefinition, h as fontFace, ht as ResolveTokenProps, i as warn, in as FLOW_STYLES, it as UseStylesOptions, j as ComputeStylesOptions, jt as BlockOuterStyleProps, k as ChunkSheetRegistry, kt as BaseStyleProps, l as filterBaseProps, ln as DEFAULT_NAME_PREFIX, lt as ElementsDefinition, m as destroy, mt as ResolveModProps, n as processTokens, nn as CONTAINER_STYLES, nt as useRawCSS, o as dotize, on as OUTER_STYLES, ot as useStyles, p as createInjector, pt as ResolveModPropDef, q as okhstPlugin, qt as TastyThemeNames, r as deprecationWarning, rn as DIMENSION_STYLES, rt as useGlobalStyles, s as _modAttrs, sn as POSITION_STYLES, st as AllBasePropsWithMods, t as tastyDebug, tn as COLOR_STYLES, tt as useKeyframes, u as PropertyOptions, un as DEFAULT_ZERO_NAME_PREFIX, ut as ModPropDef, v as getCssTextForNode, vt as TastyElementOptions, w as injector, wt as WithVariant, x as inject, xt as TastyProps, y as getIsTestEnvironment, yt as TastyElementProps, z as DIMENSION_CHUNK_STYLES, zt as ModValue } from "./index-BYtnj_gA.js";
-import { t as mergeStyles } from "./merge-styles-BZV-XAwX.js";
+import { $ as strToRgb, A as RawStyleHandler, B as getGlobalFuncs, C as SuffixForSelector, Ct as RawCSSResult, D as CUSTOM_UNITS, Dt as StyleInjectorConfig, E as CSSMap, Et as SheetInfo, F as StylePropValue, G as parseStyle, H as getGlobalPredefinedTokens, I as StyleValue, J as stringifyStyles, K as resetGlobalPredefinedTokens, L as StyleValueStateMap, M as StyleHandlerDefinition, N as StyleHandlerResult, O as DIRECTIONS, Ot as StyleRule, P as StyleMap, Q as hslToRgbValues, R as customFunc, S as StylesWithoutSelectors, St as PropertyDefinition, T as TastyPresetNames, Tt as RuleInfo, U as normalizeColorTokenValue, V as getGlobalParser, W as parseColor, X as getRgbValuesFromRgbaString, Y as getNamedColorHex, Z as hexToRgb, _ as NotSelector, _t as InjectionMode, a as ParseStateKeyOptions, at as StyleDetailsPart, b as Styles, bt as KeyframesResult, c as ParsedAdvancedState, ct as CacheMetrics, d as getGlobalPredefinedStates, dt as FontFaceDescriptors, et as StyleParser, f as setGlobalPredefinedStates, ft as FontFaceInput, g as NoType, gt as InjectResult, h as ConfigTokens, i as renderStyles, it as StyleDetails, j as StyleHandler, k as ParsedColor, kt as StyleUsage, l as StateParserContext, lt as CounterStyleDescriptors, m as ConfigTokenValue, mt as GCOptions, n as StyleResult, nt as ParserOptions, o as parseStateKey, ot as UnitHandler, p as ConditionNode, pt as GCConfig, q as setGlobalPredefinedTokens, r as isSelector, rt as ProcessedStyle, s as AtRuleContext, st as CSSProperties, t as RenderResult, tt as Bucket, u as createStateParserContext, ut as DisposeFunction, v as RecipeStyles, vt as KeyframesCacheEntry, w as TastyNamedColors, wt as RootRegistry, x as StylesInterface, xt as KeyframesSteps, y as Selector, yt as KeyframesInfo, z as filterMods } from "./index-tRick_JW.js";
+import { S as SheetManager, _ as TypographyPreset, a as getGlobalFontFace, b as ColorSpace, c as getNamePrefix, d as hasStylesGenerated, f as isConfigLocked, g as TastyPluginFactory, h as TastyPlugin, i as getGlobalCounterStyle, l as hasGlobalKeyframes, m as resetConfig, n as configure, o as getGlobalKeyframes, p as isTestEnvironment, r as getConfig, s as getGlobalRecipes, t as TastyConfig, u as hasGlobalRecipes, v as TypographyTokenValue, x as StyleInjector, y as generateTypographyTokens } from "./config-V0XC9iz_.js";
+import { $ as UsePropertyOptions, $t as BLOCK_OUTER_STYLES, A as chunkSheetRegistry, At as BlockInnerStyleProps, B as DISPLAY_CHUNK_STYLES, Bt as Mods, C as injectRawCSS, Ct as VariantMap, D as property, Dt as BaseProps, E as keyframes, Et as AllBaseProps, F as APPEARANCE_CHUNK_STYLES, Ft as DimensionStyleProps, G as categorizeStyleKeys, Gt as TagName, H as LAYOUT_CHUNK_STYLES, Ht as PositionStyleProps, I as CHUNK_NAMES, It as FlowStyleProps, J as okhslFunc, Jt as TextStyleProps, K as okhstFunc, Kt as TastyExtensionConfig, L as ChunkInfo, Lt as GlobalStyledProps, M as ComputeStylesResult, Mt as BlockStyleProps, N as computeStyles, Nt as ColorStyleProps, O as touch, Ot as BasePropsWithoutChildren, P as styleHandlers, Pt as ContainerStyleProps, Q as useFontFace, Qt as BLOCK_INNER_STYLES, R as ChunkName, Rt as InnerStyleProps, S as injectGlobal, St as TokenPropsInput, T as isPropertyDefined, Tt as tasty, U as POSITION_CHUNK_STYLES, Ut as Props, V as FONT_CHUNK_STYLES, Vt as OuterStyleProps, W as STYLE_TO_CHUNK, Wt as ShortGridStyles, X as getDisplayName, Xt as Tokens, Y as okhslPlugin, Yt as TokenValue, Z as useCounterStyle, Zt as BASE_STYLES, _ as getCssText, _t as SubElementProps, a as resolveRecipes, an as INNER_STYLES, at as UseStylesResult, b as getRawCSSText, bt as TastyPolymorphicComponent, c as color, cn as TEXT_STYLES, ct as Element, d as cleanup, dt as ModPropsInput, en as BLOCK_STYLES, et as useProperty, f as counterStyle, ft as ResolveAsProps, g as gc, gt as SubElementDefinition, h as fontFace, ht as ResolveTokenProps, i as warn, in as FLOW_STYLES, it as UseStylesOptions, j as ComputeStylesOptions, jt as BlockOuterStyleProps, k as ChunkSheetRegistry, kt as BaseStyleProps, l as filterBaseProps, ln as DEFAULT_NAME_PREFIX, lt as ElementsDefinition, m as destroy, mt as ResolveModProps, n as processTokens, nn as CONTAINER_STYLES, nt as useRawCSS, o as dotize, on as OUTER_STYLES, ot as useStyles, p as createInjector, pt as ResolveModPropDef, q as okhstPlugin, qt as TastyThemeNames, r as deprecationWarning, rn as DIMENSION_STYLES, rt as useGlobalStyles, s as _modAttrs, sn as POSITION_STYLES, st as AllBasePropsWithMods, t as tastyDebug, tn as COLOR_STYLES, tt as useKeyframes, u as PropertyOptions, un as DEFAULT_ZERO_NAME_PREFIX, ut as ModPropDef, v as getCssTextForNode, vt as TastyElementOptions, w as injector, wt as WithVariant, x as inject, xt as TastyProps, y as getIsTestEnvironment, yt as TastyElementProps, z as DIMENSION_CHUNK_STYLES, zt as ModValue } from "./index-BjnGYI5D.js";
+import { t as mergeStyles } from "./merge-styles-DDss7wRH.js";
 export { APPEARANCE_CHUNK_STYLES, type AllBaseProps, type AllBasePropsWithMods, type AtRuleContext, BASE_STYLES, BLOCK_INNER_STYLES, BLOCK_OUTER_STYLES, BLOCK_STYLES, type BaseProps, type BasePropsWithoutChildren, type BaseStyleProps, type BlockInnerStyleProps, type BlockOuterStyleProps, type BlockStyleProps, Bucket, CHUNK_NAMES, COLOR_STYLES, CONTAINER_STYLES, CSSMap, type CSSProperties, CUSTOM_UNITS, type CacheMetrics, type ChunkInfo, type ChunkName, ChunkSheetRegistry, type ColorSpace, type ColorStyleProps, type ComputeStylesOptions, type ComputeStylesResult, type ConditionNode, type ConfigTokenValue, type ConfigTokens, type ContainerStyleProps, type CounterStyleDescriptors, DEFAULT_NAME_PREFIX, DEFAULT_ZERO_NAME_PREFIX, DIMENSION_CHUNK_STYLES, DIMENSION_STYLES, DIRECTIONS, DISPLAY_CHUNK_STYLES, type DimensionStyleProps, type DisposeFunction, Element, type ElementsDefinition, FLOW_STYLES, FONT_CHUNK_STYLES, type FlowStyleProps, type FontFaceDescriptors, type FontFaceInput, type GCConfig, type GCOptions, type GlobalStyledProps, INNER_STYLES, type InjectResult, type InjectionMode, type InnerStyleProps, type KeyframesCacheEntry, type KeyframesInfo, type KeyframesResult, type KeyframesSteps, LAYOUT_CHUNK_STYLES, type ModPropDef, type ModPropsInput, type ModValue, type Mods, type NoType, type NotSelector, OUTER_STYLES, type OuterStyleProps, POSITION_CHUNK_STYLES, POSITION_STYLES, type ParseStateKeyOptions, type ParsedAdvancedState, ParsedColor, type ParserOptions, type PositionStyleProps, type ProcessedStyle, type PropertyDefinition, PropertyOptions, type Props, type RawCSSResult, RawStyleHandler, type RecipeStyles, type RenderResult, type ResolveAsProps, type ResolveModPropDef, type ResolveModProps, type ResolveTokenProps, type RootRegistry, type RuleInfo, STYLE_TO_CHUNK, type Selector, type SheetInfo, SheetManager, type ShortGridStyles, type StateParserContext, type StyleDetails, type StyleDetailsPart, StyleHandler, StyleHandlerDefinition, StyleHandlerResult, StyleInjector, type StyleInjectorConfig, StyleMap, StyleParser, StylePropValue, type StyleResult, type StyleRule, type StyleUsage, StyleValue, StyleValueStateMap, type Styles, type StylesInterface, type StylesWithoutSelectors, type SubElementDefinition, type SubElementProps, type SuffixForSelector, TEXT_STYLES, type TagName, type TastyConfig, type TastyElementOptions, type TastyElementProps, type TastyExtensionConfig, type TastyNamedColors, type TastyPlugin, type TastyPluginFactory, type TastyPolymorphicComponent, type TastyPresetNames, type TastyProps, type TastyThemeNames, type TextStyleProps, type TokenPropsInput, type TokenValue, type Tokens, TypographyPreset, TypographyTokenValue, type UnitHandler, type UsePropertyOptions, type UseStylesOptions, type UseStylesResult, type VariantMap, type WithVariant, 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 };

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 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-_cYm9LPl.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-5LJYS8_P.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-DdjoZG0r.js";
+import { n as formatPropertyCSS } from "./format-rules-Bu_qoamZ.js";
+import { t as mergeStyles } from "./merge-styles-Blrs8kLM.js";
+import { t as resolveRecipes } from "./resolve-recipes-DR5cSG3X.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";
@@ -287,8 +287,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 +335,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 +363,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 +394,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 +422,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 +482,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 +556,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 +741,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,12 +787,13 @@ 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;
 }