@tenphi/tasty 0.9.0 → 0.10.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (78) hide show
  1. package/README.md +47 -1
  2. package/dist/config.js +15 -1
  3. package/dist/config.js.map +1 -1
  4. package/dist/core/index.d.ts +2 -2
  5. package/dist/core/index.js +2 -2
  6. package/dist/hooks/useGlobalStyles.d.ts +3 -0
  7. package/dist/hooks/useGlobalStyles.js +28 -1
  8. package/dist/hooks/useGlobalStyles.js.map +1 -1
  9. package/dist/hooks/useKeyframes.js +18 -3
  10. package/dist/hooks/useKeyframes.js.map +1 -1
  11. package/dist/hooks/useProperty.js +36 -13
  12. package/dist/hooks/useProperty.js.map +1 -1
  13. package/dist/hooks/useRawCSS.js +13 -1
  14. package/dist/hooks/useRawCSS.js.map +1 -1
  15. package/dist/hooks/useStyles.d.ts +5 -0
  16. package/dist/hooks/useStyles.js +82 -3
  17. package/dist/hooks/useStyles.js.map +1 -1
  18. package/dist/index.d.ts +2 -2
  19. package/dist/index.js +2 -2
  20. package/dist/injector/index.d.ts +9 -1
  21. package/dist/injector/index.js +9 -1
  22. package/dist/injector/index.js.map +1 -1
  23. package/dist/injector/injector.d.ts +9 -0
  24. package/dist/injector/injector.js +20 -1
  25. package/dist/injector/injector.js.map +1 -1
  26. package/dist/injector/sheet-manager.d.ts +1 -0
  27. package/dist/injector/sheet-manager.js +1 -0
  28. package/dist/injector/sheet-manager.js.map +1 -1
  29. package/dist/properties/index.js +20 -5
  30. package/dist/properties/index.js.map +1 -1
  31. package/dist/properties/property-type-resolver.js +8 -0
  32. package/dist/properties/property-type-resolver.js.map +1 -1
  33. package/dist/ssr/astro.d.ts +29 -0
  34. package/dist/ssr/astro.js +65 -0
  35. package/dist/ssr/astro.js.map +1 -0
  36. package/dist/ssr/async-storage.d.ts +17 -0
  37. package/dist/ssr/async-storage.js +35 -0
  38. package/dist/ssr/async-storage.js.map +1 -0
  39. package/dist/ssr/collect-auto-properties.js +40 -0
  40. package/dist/ssr/collect-auto-properties.js.map +1 -0
  41. package/dist/ssr/collector.d.ts +85 -0
  42. package/dist/ssr/collector.js +173 -0
  43. package/dist/ssr/collector.js.map +1 -0
  44. package/dist/ssr/context.d.ts +8 -0
  45. package/dist/ssr/context.js +14 -0
  46. package/dist/ssr/context.js.map +1 -0
  47. package/dist/ssr/format-global-rules.js +22 -0
  48. package/dist/ssr/format-global-rules.js.map +1 -0
  49. package/dist/ssr/format-keyframes.js +70 -0
  50. package/dist/ssr/format-keyframes.js.map +1 -0
  51. package/dist/ssr/format-property.js +48 -0
  52. package/dist/ssr/format-property.js.map +1 -0
  53. package/dist/ssr/format-rules.js +70 -0
  54. package/dist/ssr/format-rules.js.map +1 -0
  55. package/dist/ssr/hydrate.d.ts +22 -0
  56. package/dist/ssr/hydrate.js +50 -0
  57. package/dist/ssr/hydrate.js.map +1 -0
  58. package/dist/ssr/index.d.ts +5 -0
  59. package/dist/ssr/index.js +12 -0
  60. package/dist/ssr/index.js.map +1 -0
  61. package/dist/ssr/next.d.ts +45 -0
  62. package/dist/ssr/next.js +71 -0
  63. package/dist/ssr/next.js.map +1 -0
  64. package/dist/ssr/ssr-collector-ref.js +12 -0
  65. package/dist/ssr/ssr-collector-ref.js.map +1 -0
  66. package/dist/styles/preset.js +1 -1
  67. package/dist/styles/preset.js.map +1 -1
  68. package/dist/styles/transition.js +1 -1
  69. package/dist/styles/transition.js.map +1 -1
  70. package/dist/tasty.d.ts +14 -14
  71. package/dist/zero/babel.d.ts +16 -2
  72. package/dist/zero/babel.js +32 -1
  73. package/dist/zero/babel.js.map +1 -1
  74. package/dist/zero/next.d.ts +29 -30
  75. package/dist/zero/next.js +49 -39
  76. package/dist/zero/next.js.map +1 -1
  77. package/docs/ssr.md +372 -0
  78. package/package.json +44 -28
@@ -1,12 +1,24 @@
1
1
  import { injectRawCSS } from "../injector/index.js";
2
- import { useInsertionEffect, useMemo, useRef } from "react";
2
+ import { TastySSRContext } from "../ssr/context.js";
3
+ import { getRegisteredSSRCollector } from "../ssr/ssr-collector-ref.js";
4
+ import { useContext, useInsertionEffect, useMemo, useRef } from "react";
3
5
 
4
6
  //#region src/hooks/useRawCSS.ts
7
+ function resolveSSRCollector(reactContext) {
8
+ if (reactContext) return reactContext;
9
+ return getRegisteredSSRCollector();
10
+ }
5
11
  function useRawCSS(cssOrFactory, depsOrOptions, options) {
12
+ const ssrCollector = resolveSSRCollector(useContext(TastySSRContext));
6
13
  const isFactory = typeof cssOrFactory === "function";
7
14
  const deps = isFactory && Array.isArray(depsOrOptions) ? depsOrOptions : void 0;
8
15
  const opts = isFactory ? options : depsOrOptions;
9
16
  const css = useMemo(() => isFactory ? cssOrFactory() : cssOrFactory, isFactory ? deps ?? [] : [cssOrFactory]);
17
+ useMemo(() => {
18
+ if (!ssrCollector || !css.trim()) return;
19
+ const key = `raw:${css.length}:${css.slice(0, 64)}`;
20
+ ssrCollector.collectRawCSS(key, css);
21
+ }, [ssrCollector, css]);
10
22
  const disposeRef = useRef(null);
11
23
  useInsertionEffect(() => {
12
24
  disposeRef.current?.();
@@ -1 +1 @@
1
- {"version":3,"file":"useRawCSS.js","names":[],"sources":["../../src/hooks/useRawCSS.ts"],"sourcesContent":["import { useInsertionEffect, useMemo, useRef } from 'react';\n\nimport { injectRawCSS } from '../injector';\n\ninterface UseRawCSSOptions {\n root?: Document | ShadowRoot;\n}\n\n/**\n * Hook to inject raw CSS text directly without parsing.\n * This is a low-overhead alternative for injecting global CSS that doesn't need tasty processing.\n *\n * The CSS is inserted into a separate style element (data-tasty-raw) to avoid conflicts\n * with tasty's chunked style sheets.\n *\n * @example Static CSS string\n * ```tsx\n * function GlobalStyles() {\n * useRawCSS(`\n * body {\n * margin: 0;\n * padding: 0;\n * font-family: sans-serif;\n * }\n * `);\n *\n * return null;\n * }\n * ```\n *\n * @example Factory function with dependencies (like useMemo)\n * ```tsx\n * function ThemeStyles({ theme }: { theme: 'light' | 'dark' }) {\n * useRawCSS(() => `\n * :root {\n * --bg-color: ${theme === 'dark' ? '#1a1a1a' : '#ffffff'};\n * --text-color: ${theme === 'dark' ? '#ffffff' : '#1a1a1a'};\n * }\n * `, [theme]);\n *\n * return null;\n * }\n * ```\n *\n * @example With options\n * ```tsx\n * function ShadowStyles({ shadowRoot }) {\n * useRawCSS(() => `.scoped { color: red; }`, [], { root: shadowRoot });\n * return null;\n * }\n * ```\n */\n\n// Overload 1: Static CSS string\nexport function useRawCSS(css: string, options?: UseRawCSSOptions): void;\n\n// Overload 2: Factory function with dependencies\nexport function useRawCSS(\n factory: () => string,\n deps: readonly unknown[],\n options?: UseRawCSSOptions,\n): void;\n\n// Implementation\nexport function useRawCSS(\n cssOrFactory: string | (() => string),\n depsOrOptions?: readonly unknown[] | UseRawCSSOptions,\n options?: UseRawCSSOptions,\n): void {\n // Detect which overload is being used\n const isFactory = typeof cssOrFactory === 'function';\n\n // Parse arguments based on overload\n const deps =\n isFactory && Array.isArray(depsOrOptions) ? depsOrOptions : undefined;\n const opts = isFactory\n ? options\n : (depsOrOptions as UseRawCSSOptions | undefined);\n\n // Memoize CSS - for factory functions, use provided deps; for strings, use the string itself\n const css = useMemo(\n () =>\n isFactory ? (cssOrFactory as () => string)() : (cssOrFactory as string),\n\n isFactory ? (deps ?? []) : [cssOrFactory],\n );\n\n const disposeRef = useRef<(() => void) | null>(null);\n\n useInsertionEffect(() => {\n // Dispose previous injection if any\n disposeRef.current?.();\n\n if (!css.trim()) {\n disposeRef.current = null;\n return;\n }\n\n // Inject new CSS\n const { dispose } = injectRawCSS(css, opts);\n disposeRef.current = dispose;\n\n // Cleanup on unmount or when css changes\n return () => {\n disposeRef.current?.();\n disposeRef.current = null;\n };\n }, [css, opts?.root]);\n}\n"],"mappings":";;;;AAgEA,SAAgB,UACd,cACA,eACA,SACM;CAEN,MAAM,YAAY,OAAO,iBAAiB;CAG1C,MAAM,OACJ,aAAa,MAAM,QAAQ,cAAc,GAAG,gBAAgB;CAC9D,MAAM,OAAO,YACT,UACC;CAGL,MAAM,MAAM,cAER,YAAa,cAA+B,GAAI,cAElD,YAAa,QAAQ,EAAE,GAAI,CAAC,aAAa,CAC1C;CAED,MAAM,aAAa,OAA4B,KAAK;AAEpD,0BAAyB;AAEvB,aAAW,WAAW;AAEtB,MAAI,CAAC,IAAI,MAAM,EAAE;AACf,cAAW,UAAU;AACrB;;EAIF,MAAM,EAAE,YAAY,aAAa,KAAK,KAAK;AAC3C,aAAW,UAAU;AAGrB,eAAa;AACX,cAAW,WAAW;AACtB,cAAW,UAAU;;IAEtB,CAAC,KAAK,MAAM,KAAK,CAAC"}
1
+ {"version":3,"file":"useRawCSS.js","names":[],"sources":["../../src/hooks/useRawCSS.ts"],"sourcesContent":["import { useContext, useInsertionEffect, useMemo, useRef } from 'react';\n\nimport { injectRawCSS } from '../injector';\nimport type { ServerStyleCollector } from '../ssr/collector';\nimport { TastySSRContext } from '../ssr/context';\nimport { getRegisteredSSRCollector } from '../ssr/ssr-collector-ref';\n\ninterface UseRawCSSOptions {\n root?: Document | ShadowRoot;\n}\n\nfunction resolveSSRCollector(\n reactContext: ServerStyleCollector | null,\n): ServerStyleCollector | null {\n if (reactContext) return reactContext;\n return getRegisteredSSRCollector();\n}\n\n/**\n * Hook to inject raw CSS text directly without parsing.\n * This is a low-overhead alternative for injecting global CSS that doesn't need tasty processing.\n *\n * The CSS is inserted into a separate style element (data-tasty-raw) to avoid conflicts\n * with tasty's chunked style sheets.\n *\n * @example Static CSS string\n * ```tsx\n * function GlobalStyles() {\n * useRawCSS(`\n * body {\n * margin: 0;\n * padding: 0;\n * font-family: sans-serif;\n * }\n * `);\n *\n * return null;\n * }\n * ```\n *\n * @example Factory function with dependencies (like useMemo)\n * ```tsx\n * function ThemeStyles({ theme }: { theme: 'light' | 'dark' }) {\n * useRawCSS(() => `\n * :root {\n * --bg-color: ${theme === 'dark' ? '#1a1a1a' : '#ffffff'};\n * --text-color: ${theme === 'dark' ? '#ffffff' : '#1a1a1a'};\n * }\n * `, [theme]);\n *\n * return null;\n * }\n * ```\n *\n * @example With options\n * ```tsx\n * function ShadowStyles({ shadowRoot }) {\n * useRawCSS(() => `.scoped { color: red; }`, [], { root: shadowRoot });\n * return null;\n * }\n * ```\n */\n\n// Overload 1: Static CSS string\nexport function useRawCSS(css: string, options?: UseRawCSSOptions): void;\n\n// Overload 2: Factory function with dependencies\nexport function useRawCSS(\n factory: () => string,\n deps: readonly unknown[],\n options?: UseRawCSSOptions,\n): void;\n\n// Implementation\nexport function useRawCSS(\n cssOrFactory: string | (() => string),\n depsOrOptions?: readonly unknown[] | UseRawCSSOptions,\n options?: UseRawCSSOptions,\n): void {\n const ssrContextValue = useContext(TastySSRContext);\n const ssrCollector = resolveSSRCollector(ssrContextValue);\n\n // Detect which overload is being used\n const isFactory = typeof cssOrFactory === 'function';\n\n // Parse arguments based on overload\n const deps =\n isFactory && Array.isArray(depsOrOptions) ? depsOrOptions : undefined;\n const opts = isFactory\n ? options\n : (depsOrOptions as UseRawCSSOptions | undefined);\n\n // Memoize CSS - for factory functions, use provided deps; for strings, use the string itself\n const css = useMemo(\n () =>\n isFactory ? (cssOrFactory as () => string)() : (cssOrFactory as string),\n\n isFactory ? (deps ?? []) : [cssOrFactory],\n );\n\n // SSR path: collect raw CSS during render\n useMemo(() => {\n if (!ssrCollector || !css.trim()) return;\n\n const key = `raw:${css.length}:${css.slice(0, 64)}`;\n ssrCollector.collectRawCSS(key, css);\n }, [ssrCollector, css]);\n\n const disposeRef = useRef<(() => void) | null>(null);\n\n // Client path: inject via DOM\n useInsertionEffect(() => {\n disposeRef.current?.();\n\n if (!css.trim()) {\n disposeRef.current = null;\n return;\n }\n\n const { dispose } = injectRawCSS(css, opts);\n disposeRef.current = dispose;\n\n return () => {\n disposeRef.current?.();\n disposeRef.current = null;\n };\n }, [css, opts?.root]);\n}\n"],"mappings":";;;;;;AAWA,SAAS,oBACP,cAC6B;AAC7B,KAAI,aAAc,QAAO;AACzB,QAAO,2BAA2B;;AA2DpC,SAAgB,UACd,cACA,eACA,SACM;CAEN,MAAM,eAAe,oBADG,WAAW,gBAAgB,CACM;CAGzD,MAAM,YAAY,OAAO,iBAAiB;CAG1C,MAAM,OACJ,aAAa,MAAM,QAAQ,cAAc,GAAG,gBAAgB;CAC9D,MAAM,OAAO,YACT,UACC;CAGL,MAAM,MAAM,cAER,YAAa,cAA+B,GAAI,cAElD,YAAa,QAAQ,EAAE,GAAI,CAAC,aAAa,CAC1C;AAGD,eAAc;AACZ,MAAI,CAAC,gBAAgB,CAAC,IAAI,MAAM,CAAE;EAElC,MAAM,MAAM,OAAO,IAAI,OAAO,GAAG,IAAI,MAAM,GAAG,GAAG;AACjD,eAAa,cAAc,KAAK,IAAI;IACnC,CAAC,cAAc,IAAI,CAAC;CAEvB,MAAM,aAAa,OAA4B,KAAK;AAGpD,0BAAyB;AACvB,aAAW,WAAW;AAEtB,MAAI,CAAC,IAAI,MAAM,EAAE;AACf,cAAW,UAAU;AACrB;;EAGF,MAAM,EAAE,YAAY,aAAa,KAAK,KAAK;AAC3C,aAAW,UAAU;AAErB,eAAa;AACX,cAAW,WAAW;AACtB,cAAW,UAAU;;IAEtB,CAAC,KAAK,MAAM,KAAK,CAAC"}
@@ -18,6 +18,11 @@ interface UseStylesResult {
18
18
  * Hook to generate CSS classes from Tasty styles.
19
19
  * Handles style rendering, className allocation, and CSS injection.
20
20
  *
21
+ * SSR-aware: when a ServerStyleCollector is available (via React context
22
+ * or AsyncLocalStorage), CSS is collected during the render phase instead
23
+ * of being injected into the DOM. useInsertionEffect does not run on the
24
+ * server, so the collector path is the only active path during SSR.
25
+ *
21
26
  * Uses chunking to split styles into logical groups for better caching
22
27
  * and CSS reuse across components.
23
28
  *
@@ -1,13 +1,18 @@
1
1
  import { extractLocalProperties, hasLocalProperties } from "../properties/index.js";
2
2
  import { stringifyStyles } from "../utils/styles.js";
3
- import { getGlobalKeyframes, hasGlobalKeyframes } from "../config.js";
3
+ import { getConfig, getGlobalKeyframes, hasGlobalKeyframes } from "../config.js";
4
4
  import { CHUNK_NAMES, categorizeStyleKeys } from "../chunks/definitions.js";
5
5
  import { generateChunkCacheKey } from "../chunks/cacheKey.js";
6
6
  import { renderStylesForChunk } from "../chunks/renderChunk.js";
7
7
  import { allocateClassName, inject, keyframes, property } from "../injector/index.js";
8
8
  import { resolveRecipes } from "../utils/resolve-recipes.js";
9
9
  import { extractAnimationNamesFromStyles, extractLocalKeyframes, filterUsedKeyframes, hasLocalKeyframes, mergeKeyframes, replaceAnimationNames } from "../keyframes/index.js";
10
- import { useInsertionEffect, useMemo, useRef } from "react";
10
+ import { formatPropertyCSS } from "../ssr/format-property.js";
11
+ import { collectAutoInferredProperties } from "../ssr/collect-auto-properties.js";
12
+ import { TastySSRContext } from "../ssr/context.js";
13
+ import { formatKeyframesCSS } from "../ssr/format-keyframes.js";
14
+ import { getRegisteredSSRCollector } from "../ssr/ssr-collector-ref.js";
15
+ import { useContext, useInsertionEffect, useMemo, useRef } from "react";
11
16
 
12
17
  //#region src/hooks/useStyles.ts
13
18
  /**
@@ -24,6 +29,12 @@ function containsStartingStyle(styleKey) {
24
29
  /**
25
30
  * Render, cache-key, and allocate a className for a single chunk.
26
31
  * Returns a ProcessedChunk, or null if the chunk produces no CSS rules.
32
+ *
33
+ * Always runs the pipeline and calls allocateClassName. The inject()
34
+ * call in useInsertionEffect handles all edge cases: placeholders from
35
+ * abandoned concurrent renders, hydration hits (ruleIndex -2), and
36
+ * runtime cache hits (already injected). The pipeline's own LRU cache
37
+ * makes repeated calls for identical styles cheap.
27
38
  */
28
39
  function processChunk(styles, chunkName, styleKeys) {
29
40
  if (styleKeys.length === 0) return null;
@@ -77,9 +88,54 @@ function getUsedKeyframes(styles) {
77
88
  return filterUsedKeyframes(mergeKeyframes(hasLocal ? extractLocalKeyframes(styles) : null, hasGlobal ? getGlobalKeyframes() : null), usedNames);
78
89
  }
79
90
  /**
91
+ * Resolve the SSR collector from React context or AsyncLocalStorage.
92
+ * Returns null on the client (no collector available).
93
+ */
94
+ function resolveSSRCollector(reactContext) {
95
+ if (reactContext) return reactContext;
96
+ const alsCollector = getRegisteredSSRCollector();
97
+ if (alsCollector) return alsCollector;
98
+ return null;
99
+ }
100
+ /**
101
+ * Process a chunk on the SSR path: allocate via collector, render, collect CSS.
102
+ * Returns null if the chunk produces no CSS rules.
103
+ */
104
+ function processChunkSSR(collector, styles, chunkName, styleKeys) {
105
+ if (styleKeys.length === 0) return null;
106
+ const cacheKey = generateChunkCacheKey(styles, chunkName, styleKeys);
107
+ const { className, isNewAllocation } = collector.allocateClassName(cacheKey);
108
+ if (isNewAllocation) {
109
+ const renderResult = renderStylesForChunk(styles, chunkName, styleKeys);
110
+ if (renderResult.rules.length > 0) {
111
+ collector.collectChunk(cacheKey, className, renderResult.rules);
112
+ return {
113
+ name: chunkName,
114
+ styleKeys,
115
+ cacheKey,
116
+ renderResult,
117
+ className
118
+ };
119
+ }
120
+ return null;
121
+ }
122
+ return {
123
+ name: chunkName,
124
+ styleKeys,
125
+ cacheKey,
126
+ renderResult: { rules: [] },
127
+ className
128
+ };
129
+ }
130
+ /**
80
131
  * Hook to generate CSS classes from Tasty styles.
81
132
  * Handles style rendering, className allocation, and CSS injection.
82
133
  *
134
+ * SSR-aware: when a ServerStyleCollector is available (via React context
135
+ * or AsyncLocalStorage), CSS is collected during the render phase instead
136
+ * of being injected into the DOM. useInsertionEffect does not run on the
137
+ * server, so the collector path is the only active path during SSR.
138
+ *
83
139
  * Uses chunking to split styles into logical groups for better caching
84
140
  * and CSS reuse across components.
85
141
  *
@@ -97,6 +153,7 @@ function getUsedKeyframes(styles) {
97
153
  * ```
98
154
  */
99
155
  function useStyles(styles) {
156
+ const ssrCollector = resolveSSRCollector(useContext(TastySSRContext));
100
157
  const disposeRef = useRef([]);
101
158
  const stylesRef = useRef({
102
159
  key: "",
@@ -120,7 +177,29 @@ function useStyles(styles) {
120
177
  let chunkMap = categorizeStyleKeys(currentStyles);
121
178
  if (containsStartingStyle(styleKey)) chunkMap = mergeChunksForStartingStyle(chunkMap);
122
179
  const chunks = [];
123
- for (const [chunkName, chunkStyleKeys] of chunkMap) {
180
+ if (ssrCollector) {
181
+ ssrCollector.collectInternals();
182
+ for (const [chunkName, chunkStyleKeys] of chunkMap) {
183
+ const chunk = processChunkSSR(ssrCollector, currentStyles, chunkName, chunkStyleKeys);
184
+ if (chunk) chunks.push(chunk);
185
+ }
186
+ const usedKeyframes = getUsedKeyframes(currentStyles);
187
+ if (usedKeyframes) for (const [name, steps] of Object.entries(usedKeyframes)) {
188
+ const css = formatKeyframesCSS(name, steps);
189
+ ssrCollector.collectKeyframes(name, css);
190
+ }
191
+ if (hasLocalProperties(currentStyles)) {
192
+ const localProperties = extractLocalProperties(currentStyles);
193
+ if (localProperties) for (const [token, definition] of Object.entries(localProperties)) {
194
+ const css = formatPropertyCSS(token, definition);
195
+ if (css) ssrCollector.collectProperty(token, css);
196
+ }
197
+ }
198
+ if (getConfig().autoPropertyTypes !== false) {
199
+ const allRules = chunks.flatMap((c) => c.renderResult.rules);
200
+ if (allRules.length > 0) collectAutoInferredProperties(allRules, ssrCollector, currentStyles);
201
+ }
202
+ } else for (const [chunkName, chunkStyleKeys] of chunkMap) {
124
203
  const chunk = processChunk(currentStyles, chunkName, chunkStyleKeys);
125
204
  if (chunk) chunks.push(chunk);
126
205
  }
@@ -1 +1 @@
1
- {"version":3,"file":"useStyles.js","names":[],"sources":["../../src/hooks/useStyles.ts"],"sourcesContent":["import { useInsertionEffect, useMemo, useRef } from 'react';\n\nimport {\n categorizeStyleKeys,\n CHUNK_NAMES,\n generateChunkCacheKey,\n renderStylesForChunk,\n} from '../chunks';\nimport { getGlobalKeyframes, hasGlobalKeyframes } from '../config';\nimport { allocateClassName, inject, keyframes, property } from '../injector';\nimport type { KeyframesSteps } from '../injector/types';\nimport {\n extractAnimationNamesFromStyles,\n extractLocalKeyframes,\n filterUsedKeyframes,\n hasLocalKeyframes,\n mergeKeyframes,\n replaceAnimationNames,\n} from '../keyframes';\nimport type { RenderResult } from '../pipeline';\nimport { extractLocalProperties, hasLocalProperties } from '../properties';\nimport type { Styles } from '../styles/types';\nimport { resolveRecipes } from '../utils/resolve-recipes';\nimport { stringifyStyles } from '../utils/styles';\n\n/**\n * Check if styles contain @starting-style rules.\n *\n * @starting-style CSS cannot be applied via multiple class names because\n * of cascade - later rules override earlier ones. When @starting is detected,\n * we combine top-level styles into a single chunk but keep sub-element styles\n * in their own chunk for better caching.\n */\nfunction containsStartingStyle(styleKey: string): boolean {\n return styleKey.includes('@starting');\n}\n\n/**\n * Tasty styles object to generate CSS classes for.\n * Can be undefined or empty object for no styles.\n */\nexport type UseStylesOptions = Styles | undefined;\n\nexport interface UseStylesResult {\n /**\n * Generated className(s) to apply to the element.\n * Can be empty string if no styles are provided.\n * With chunking enabled, may contain multiple space-separated class names.\n */\n className: string;\n}\n\n/**\n * Information about a processed chunk\n */\ninterface ProcessedChunk {\n name: string;\n styleKeys: string[];\n cacheKey: string;\n renderResult: RenderResult;\n className: string;\n}\n\n/**\n * Render, cache-key, and allocate a className for a single chunk.\n * Returns a ProcessedChunk, or null if the chunk produces no CSS rules.\n */\nfunction processChunk(\n styles: Styles,\n chunkName: string,\n styleKeys: string[],\n): ProcessedChunk | null {\n if (styleKeys.length === 0) return null;\n\n const renderResult = renderStylesForChunk(styles, chunkName, styleKeys);\n if (renderResult.rules.length === 0) return null;\n\n const cacheKey = generateChunkCacheKey(styles, chunkName, styleKeys);\n const { className } = allocateClassName(cacheKey);\n\n return { name: chunkName, styleKeys, cacheKey, renderResult, className };\n}\n\n/**\n * Merge chunk map entries for @starting-style partial chunking.\n *\n * All non-subcomponent chunks are merged into a single COMBINED entry,\n * while SUBCOMPONENTS stays separate. This preserves CSS cascade for\n * @starting-style while still allowing sub-element styles to cache independently.\n */\nfunction mergeChunksForStartingStyle(\n chunkMap: Map<string, string[]>,\n): Map<string, string[]> {\n const merged = new Map<string, string[]>();\n const combinedKeys: string[] = [];\n\n for (const [chunkName, keys] of chunkMap) {\n if (chunkName === CHUNK_NAMES.SUBCOMPONENTS) {\n merged.set(CHUNK_NAMES.SUBCOMPONENTS, keys);\n } else {\n combinedKeys.push(...keys);\n }\n }\n\n if (combinedKeys.length > 0) {\n // Insert COMBINED first so it appears before SUBCOMPONENTS\n const result = new Map<string, string[]>();\n result.set(CHUNK_NAMES.COMBINED, combinedKeys);\n for (const [k, v] of merged) {\n result.set(k, v);\n }\n return result;\n }\n\n return merged;\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 *\n * Optimization order:\n * 1. Check if any keyframes are defined (local or global) - if not, return null\n * 2. Extract animation names from styles - if none, return null\n * 3. Merge and filter keyframes to only used ones\n */\nfunction getUsedKeyframes(\n styles: Styles,\n): Record<string, KeyframesSteps> | null {\n // Fast path: no keyframes defined anywhere\n const hasLocal = hasLocalKeyframes(styles);\n const hasGlobal = hasGlobalKeyframes();\n if (!hasLocal && !hasGlobal) return null;\n\n // Extract animation names from styles (not from rendered CSS - faster)\n const usedNames = extractAnimationNamesFromStyles(styles);\n if (usedNames.size === 0) return null;\n\n // Merge local and global keyframes\n const local = hasLocal ? extractLocalKeyframes(styles) : null;\n const global = hasGlobal ? getGlobalKeyframes() : null;\n const allKeyframes = mergeKeyframes(local, global);\n\n // Filter to only used keyframes\n return filterUsedKeyframes(allKeyframes, usedNames);\n}\n\n/**\n * Hook to generate CSS classes from Tasty styles.\n * Handles style rendering, className allocation, and CSS injection.\n *\n * Uses chunking to split styles into logical groups for better caching\n * and CSS reuse across components.\n *\n * @example\n * ```tsx\n * function MyComponent() {\n * const { className } = useStyles({\n * padding: '2x',\n * fill: '#purple',\n * radius: '1r',\n * });\n *\n * return <div className={className}>Styled content</div>;\n * }\n * ```\n */\nexport function useStyles(styles: UseStylesOptions): UseStylesResult {\n // Array of dispose functions for each chunk\n const disposeRef = useRef<(() => void)[]>([]);\n\n // Store styles by their stringified key to avoid recomputing when only reference changes\n const stylesRef = useRef<{ key: string; styles: Styles | undefined }>({\n key: '',\n styles: undefined,\n });\n\n // Resolve recipes before any processing (zero overhead if no recipes configured)\n const resolvedStyles = useMemo(() => {\n if (!styles) return styles;\n return resolveRecipes(styles);\n }, [styles]);\n\n // Compute style key - this is a primitive string that captures style content\n const styleKey = useMemo(() => {\n if (!resolvedStyles || Object.keys(resolvedStyles).length === 0) {\n return '';\n }\n return stringifyStyles(resolvedStyles);\n }, [resolvedStyles]);\n\n // Update ref when styleKey changes (content actually changed)\n if (stylesRef.current.key !== styleKey) {\n stylesRef.current = { key: styleKey, styles: resolvedStyles };\n }\n\n // Process chunks: categorize, generate cache keys, render, and allocate classNames\n // Only depends on styleKey (primitive), not styles object reference\n const processedChunks: ProcessedChunk[] = useMemo(() => {\n const currentStyles = stylesRef.current.styles;\n if (!styleKey || !currentStyles) {\n return [];\n }\n\n // Categorize style keys into chunks\n let chunkMap = categorizeStyleKeys(\n currentStyles as Record<string, unknown>,\n );\n\n // Partial chunking for styles containing @starting-style rules.\n // @starting-style CSS cannot work with multiple class names due to cascade,\n // so we merge all top-level chunks into one but keep sub-element styles separate.\n if (containsStartingStyle(styleKey)) {\n chunkMap = mergeChunksForStartingStyle(chunkMap);\n }\n\n // Process each chunk: render → cache key → allocate className\n const chunks: ProcessedChunk[] = [];\n\n for (const [chunkName, chunkStyleKeys] of chunkMap) {\n const chunk = processChunk(currentStyles, chunkName, chunkStyleKeys);\n if (chunk) {\n chunks.push(chunk);\n }\n }\n\n return chunks;\n }, [styleKey]);\n\n // Inject styles in insertion effect (avoids render phase side effects)\n useInsertionEffect(() => {\n // Cleanup all previous disposals\n disposeRef.current.forEach((dispose) => dispose?.());\n disposeRef.current = [];\n\n // Fast path: no chunks to inject\n if (processedChunks.length === 0) {\n return;\n }\n\n const currentStyles = stylesRef.current.styles;\n\n // Register explicit @properties first so they take precedence over auto-inference\n // that happens during keyframe and style chunk injection.\n // Token formats: $name → --name, #name → --name-color (with auto syntax: '<color>')\n // Note: Global properties are injected once when styles are first generated (see markStylesGenerated)\n if (currentStyles && hasLocalProperties(currentStyles)) {\n const localProperties = extractLocalProperties(currentStyles);\n if (localProperties) {\n for (const [token, definition] of Object.entries(localProperties)) {\n property(token, definition);\n }\n }\n }\n\n // Get keyframes that are actually used (returns null if none - zero overhead)\n const usedKeyframes = currentStyles\n ? getUsedKeyframes(currentStyles)\n : null;\n\n // Inject keyframes and build name map (only if we have keyframes)\n let nameMap: Map<string, string> | null = null;\n\n if (usedKeyframes) {\n nameMap = new Map();\n for (const [name, steps] of Object.entries(usedKeyframes)) {\n const result = keyframes(steps, { name });\n const injectedName = result.toString();\n // Only add to map if name differs (optimization for replacement check)\n if (injectedName !== name) {\n nameMap.set(name, injectedName);\n }\n disposeRef.current.push(result.dispose);\n }\n // Clear map if no replacements needed\n if (nameMap.size === 0) {\n nameMap = null;\n }\n }\n\n // Inject each chunk\n for (const chunk of processedChunks) {\n if (chunk.renderResult.rules.length > 0) {\n // Replace animation names only if needed\n const rulesToInject = nameMap\n ? chunk.renderResult.rules.map((rule) => ({\n ...rule,\n declarations: replaceAnimationNames(rule.declarations, nameMap!),\n }))\n : chunk.renderResult.rules;\n\n const { dispose } = inject(rulesToInject, {\n cacheKey: chunk.cacheKey,\n });\n disposeRef.current.push(dispose);\n }\n }\n\n return () => {\n disposeRef.current.forEach((dispose) => dispose?.());\n disposeRef.current = [];\n };\n }, [processedChunks]);\n\n // Combine all chunk classNames\n const className = useMemo(() => {\n return processedChunks.map((chunk) => chunk.className).join(' ');\n }, [processedChunks]);\n\n return {\n className,\n };\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"useStyles.js","names":[],"sources":["../../src/hooks/useStyles.ts"],"sourcesContent":["import { useContext, useInsertionEffect, useMemo, useRef } from 'react';\n\nimport {\n categorizeStyleKeys,\n CHUNK_NAMES,\n generateChunkCacheKey,\n renderStylesForChunk,\n} from '../chunks';\nimport { getConfig, getGlobalKeyframes, hasGlobalKeyframes } from '../config';\nimport { allocateClassName, inject, keyframes, property } from '../injector';\nimport type { KeyframesSteps } from '../injector/types';\nimport {\n extractAnimationNamesFromStyles,\n extractLocalKeyframes,\n filterUsedKeyframes,\n hasLocalKeyframes,\n mergeKeyframes,\n replaceAnimationNames,\n} from '../keyframes';\nimport type { RenderResult } from '../pipeline';\nimport { extractLocalProperties, hasLocalProperties } from '../properties';\nimport { collectAutoInferredProperties } from '../ssr/collect-auto-properties';\nimport type { ServerStyleCollector } from '../ssr/collector';\nimport { TastySSRContext } from '../ssr/context';\nimport { formatKeyframesCSS } from '../ssr/format-keyframes';\nimport { formatPropertyCSS } from '../ssr/format-property';\nimport { getRegisteredSSRCollector } from '../ssr/ssr-collector-ref';\nimport type { Styles } from '../styles/types';\nimport { resolveRecipes } from '../utils/resolve-recipes';\nimport { stringifyStyles } from '../utils/styles';\n\n/**\n * Check if styles contain @starting-style rules.\n *\n * @starting-style CSS cannot be applied via multiple class names because\n * of cascade - later rules override earlier ones. When @starting is detected,\n * we combine top-level styles into a single chunk but keep sub-element styles\n * in their own chunk for better caching.\n */\nfunction containsStartingStyle(styleKey: string): boolean {\n return styleKey.includes('@starting');\n}\n\n/**\n * Tasty styles object to generate CSS classes for.\n * Can be undefined or empty object for no styles.\n */\nexport type UseStylesOptions = Styles | undefined;\n\nexport interface UseStylesResult {\n /**\n * Generated className(s) to apply to the element.\n * Can be empty string if no styles are provided.\n * With chunking enabled, may contain multiple space-separated class names.\n */\n className: string;\n}\n\n/**\n * Information about a processed chunk\n */\ninterface ProcessedChunk {\n name: string;\n styleKeys: string[];\n cacheKey: string;\n renderResult: RenderResult;\n className: string;\n}\n\n/**\n * Render, cache-key, and allocate a className for a single chunk.\n * Returns a ProcessedChunk, or null if the chunk produces no CSS rules.\n *\n * Always runs the pipeline and calls allocateClassName. The inject()\n * call in useInsertionEffect handles all edge cases: placeholders from\n * abandoned concurrent renders, hydration hits (ruleIndex -2), and\n * runtime cache hits (already injected). The pipeline's own LRU cache\n * makes repeated calls for identical styles cheap.\n */\nfunction processChunk(\n styles: Styles,\n chunkName: string,\n styleKeys: string[],\n): ProcessedChunk | null {\n if (styleKeys.length === 0) return null;\n\n const renderResult = renderStylesForChunk(styles, chunkName, styleKeys);\n if (renderResult.rules.length === 0) return null;\n\n const cacheKey = generateChunkCacheKey(styles, chunkName, styleKeys);\n const { className } = allocateClassName(cacheKey);\n\n return { name: chunkName, styleKeys, cacheKey, renderResult, className };\n}\n\n/**\n * Merge chunk map entries for @starting-style partial chunking.\n *\n * All non-subcomponent chunks are merged into a single COMBINED entry,\n * while SUBCOMPONENTS stays separate. This preserves CSS cascade for\n * @starting-style while still allowing sub-element styles to cache independently.\n */\nfunction mergeChunksForStartingStyle(\n chunkMap: Map<string, string[]>,\n): Map<string, string[]> {\n const merged = new Map<string, string[]>();\n const combinedKeys: string[] = [];\n\n for (const [chunkName, keys] of chunkMap) {\n if (chunkName === CHUNK_NAMES.SUBCOMPONENTS) {\n merged.set(CHUNK_NAMES.SUBCOMPONENTS, keys);\n } else {\n combinedKeys.push(...keys);\n }\n }\n\n if (combinedKeys.length > 0) {\n // Insert COMBINED first so it appears before SUBCOMPONENTS\n const result = new Map<string, string[]>();\n result.set(CHUNK_NAMES.COMBINED, combinedKeys);\n for (const [k, v] of merged) {\n result.set(k, v);\n }\n return result;\n }\n\n return merged;\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 *\n * Optimization order:\n * 1. Check if any keyframes are defined (local or global) - if not, return null\n * 2. Extract animation names from styles - if none, return null\n * 3. Merge and filter keyframes to only used ones\n */\nfunction getUsedKeyframes(\n styles: Styles,\n): Record<string, KeyframesSteps> | null {\n // Fast path: no keyframes defined anywhere\n const hasLocal = hasLocalKeyframes(styles);\n const hasGlobal = hasGlobalKeyframes();\n if (!hasLocal && !hasGlobal) return null;\n\n // Extract animation names from styles (not from rendered CSS - faster)\n const usedNames = extractAnimationNamesFromStyles(styles);\n if (usedNames.size === 0) return null;\n\n // Merge local and global keyframes\n const local = hasLocal ? extractLocalKeyframes(styles) : null;\n const global = hasGlobal ? getGlobalKeyframes() : null;\n const allKeyframes = mergeKeyframes(local, global);\n\n // Filter to only used keyframes\n return filterUsedKeyframes(allKeyframes, usedNames);\n}\n\n/**\n * Resolve the SSR collector from React context or AsyncLocalStorage.\n * Returns null on the client (no collector available).\n */\nfunction resolveSSRCollector(\n reactContext: ServerStyleCollector | null,\n): ServerStyleCollector | null {\n if (reactContext) return reactContext;\n\n const alsCollector = getRegisteredSSRCollector();\n if (alsCollector) return alsCollector;\n\n return null;\n}\n\n/**\n * Process a chunk on the SSR path: allocate via collector, render, collect CSS.\n * Returns null if the chunk produces no CSS rules.\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 {\n name: chunkName,\n styleKeys,\n cacheKey,\n renderResult,\n className,\n };\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 * Hook to generate CSS classes from Tasty styles.\n * Handles style rendering, className allocation, and CSS injection.\n *\n * SSR-aware: when a ServerStyleCollector is available (via React context\n * or AsyncLocalStorage), CSS is collected during the render phase instead\n * of being injected into the DOM. useInsertionEffect does not run on the\n * server, so the collector path is the only active path during SSR.\n *\n * Uses chunking to split styles into logical groups for better caching\n * and CSS reuse across components.\n *\n * @example\n * ```tsx\n * function MyComponent() {\n * const { className } = useStyles({\n * padding: '2x',\n * fill: '#purple',\n * radius: '1r',\n * });\n *\n * return <div className={className}>Styled content</div>;\n * }\n * ```\n */\nexport function useStyles(styles: UseStylesOptions): UseStylesResult {\n const ssrContextValue = useContext(TastySSRContext);\n const ssrCollector = resolveSSRCollector(ssrContextValue);\n\n // Array of dispose functions for each chunk\n const disposeRef = useRef<(() => void)[]>([]);\n\n // Store styles by their stringified key to avoid recomputing when only reference changes\n const stylesRef = useRef<{ key: string; styles: Styles | undefined }>({\n key: '',\n styles: undefined,\n });\n\n // Resolve recipes before any processing (zero overhead if no recipes configured)\n const resolvedStyles = useMemo(() => {\n if (!styles) return styles;\n return resolveRecipes(styles);\n }, [styles]);\n\n // Compute style key - this is a primitive string that captures style content\n const styleKey = useMemo(() => {\n if (!resolvedStyles || Object.keys(resolvedStyles).length === 0) {\n return '';\n }\n return stringifyStyles(resolvedStyles);\n }, [resolvedStyles]);\n\n // Update ref when styleKey changes (content actually changed)\n if (stylesRef.current.key !== styleKey) {\n stylesRef.current = { key: styleKey, styles: resolvedStyles };\n }\n\n // Process chunks: categorize, generate cache keys, render, and allocate classNames\n // Only depends on styleKey (primitive), not styles object reference\n const processedChunks: ProcessedChunk[] = useMemo(() => {\n const currentStyles = stylesRef.current.styles;\n if (!styleKey || !currentStyles) {\n return [];\n }\n\n // Categorize style keys into chunks\n let chunkMap = categorizeStyleKeys(\n currentStyles as Record<string, unknown>,\n );\n\n // Partial chunking for styles containing @starting-style rules.\n // @starting-style CSS cannot work with multiple class names due to cascade,\n // so we merge all top-level chunks into one but keep sub-element styles separate.\n if (containsStartingStyle(styleKey)) {\n chunkMap = mergeChunksForStartingStyle(chunkMap);\n }\n\n const chunks: ProcessedChunk[] = [];\n\n if (ssrCollector) {\n // Ensure internal @property and :root token CSS is included\n ssrCollector.collectInternals();\n\n // SERVER PATH: allocate via collector, collect CSS\n for (const [chunkName, chunkStyleKeys] of chunkMap) {\n const chunk = processChunkSSR(\n ssrCollector,\n currentStyles,\n chunkName,\n chunkStyleKeys,\n );\n if (chunk) chunks.push(chunk);\n }\n\n // Collect keyframes on the server\n const usedKeyframes = getUsedKeyframes(currentStyles);\n if (usedKeyframes) {\n for (const [name, steps] of Object.entries(usedKeyframes)) {\n const css = formatKeyframesCSS(name, steps);\n ssrCollector.collectKeyframes(name, css);\n }\n }\n\n // Collect explicit @property rules on the server\n if (hasLocalProperties(currentStyles)) {\n const localProperties = extractLocalProperties(currentStyles);\n if (localProperties) {\n for (const [token, definition] of Object.entries(localProperties)) {\n const css = formatPropertyCSS(token, definition);\n if (css) {\n ssrCollector.collectProperty(token, css);\n }\n }\n }\n }\n\n // Auto-infer @property types from rendered declarations (SSR).\n // On the client this happens inside StyleInjector.inject(), which\n // runs in useInsertionEffect and therefore never executes on the server.\n if (getConfig().autoPropertyTypes !== false) {\n const allRules = chunks.flatMap((c) => c.renderResult.rules);\n if (allRules.length > 0) {\n collectAutoInferredProperties(allRules, ssrCollector, currentStyles);\n }\n }\n } else {\n // CLIENT PATH: unchanged behavior\n for (const [chunkName, chunkStyleKeys] of chunkMap) {\n const chunk = processChunk(currentStyles, chunkName, chunkStyleKeys);\n if (chunk) chunks.push(chunk);\n }\n }\n\n return chunks;\n }, [styleKey]);\n\n // Inject styles in insertion effect (avoids render phase side effects).\n // Does NOT run on the server — the SSR path above handles collection.\n useInsertionEffect(() => {\n // Cleanup all previous disposals\n disposeRef.current.forEach((dispose) => dispose?.());\n disposeRef.current = [];\n\n // Fast path: no chunks to inject\n if (processedChunks.length === 0) {\n return;\n }\n\n const currentStyles = stylesRef.current.styles;\n\n // Register explicit @properties first so they take precedence over auto-inference\n // that happens during keyframe and style chunk injection.\n // Token formats: $name → --name, #name → --name-color (with auto syntax: '<color>')\n // Note: Global properties are injected once when styles are first generated (see markStylesGenerated)\n if (currentStyles && hasLocalProperties(currentStyles)) {\n const localProperties = extractLocalProperties(currentStyles);\n if (localProperties) {\n for (const [token, definition] of Object.entries(localProperties)) {\n property(token, definition);\n }\n }\n }\n\n // Get keyframes that are actually used (returns null if none - zero overhead)\n const usedKeyframes = currentStyles\n ? getUsedKeyframes(currentStyles)\n : null;\n\n // Inject keyframes and build name map (only if we have keyframes)\n let nameMap: Map<string, string> | null = null;\n\n if (usedKeyframes) {\n nameMap = new Map();\n for (const [name, steps] of Object.entries(usedKeyframes)) {\n const result = keyframes(steps, { name });\n const injectedName = result.toString();\n // Only add to map if name differs (optimization for replacement check)\n if (injectedName !== name) {\n nameMap.set(name, injectedName);\n }\n disposeRef.current.push(result.dispose);\n }\n // Clear map if no replacements needed\n if (nameMap.size === 0) {\n nameMap = null;\n }\n }\n\n // Inject each chunk\n for (const chunk of processedChunks) {\n if (chunk.renderResult.rules.length > 0) {\n // Replace animation names only if needed\n const rulesToInject = nameMap\n ? chunk.renderResult.rules.map((rule) => ({\n ...rule,\n declarations: replaceAnimationNames(rule.declarations, nameMap!),\n }))\n : chunk.renderResult.rules;\n\n const { dispose } = inject(rulesToInject, {\n cacheKey: chunk.cacheKey,\n });\n disposeRef.current.push(dispose);\n }\n }\n\n return () => {\n disposeRef.current.forEach((dispose) => dispose?.());\n disposeRef.current = [];\n };\n }, [processedChunks]);\n\n // Combine all chunk classNames\n const className = useMemo(() => {\n return processedChunks.map((chunk) => chunk.className).join(' ');\n }, [processedChunks]);\n\n return {\n className,\n };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAuCA,SAAS,sBAAsB,UAA2B;AACxD,QAAO,SAAS,SAAS,YAAY;;;;;;;;;;;;AAuCvC,SAAS,aACP,QACA,WACA,WACuB;AACvB,KAAI,UAAU,WAAW,EAAG,QAAO;CAEnC,MAAM,eAAe,qBAAqB,QAAQ,WAAW,UAAU;AACvE,KAAI,aAAa,MAAM,WAAW,EAAG,QAAO;CAE5C,MAAM,WAAW,sBAAsB,QAAQ,WAAW,UAAU;CACpE,MAAM,EAAE,cAAc,kBAAkB,SAAS;AAEjD,QAAO;EAAE,MAAM;EAAW;EAAW;EAAU;EAAc;EAAW;;;;;;;;;AAU1E,SAAS,4BACP,UACuB;CACvB,MAAM,yBAAS,IAAI,KAAuB;CAC1C,MAAM,eAAyB,EAAE;AAEjC,MAAK,MAAM,CAAC,WAAW,SAAS,SAC9B,KAAI,cAAc,YAAY,cAC5B,QAAO,IAAI,YAAY,eAAe,KAAK;KAE3C,cAAa,KAAK,GAAG,KAAK;AAI9B,KAAI,aAAa,SAAS,GAAG;EAE3B,MAAM,yBAAS,IAAI,KAAuB;AAC1C,SAAO,IAAI,YAAY,UAAU,aAAa;AAC9C,OAAK,MAAM,CAAC,GAAG,MAAM,OACnB,QAAO,IAAI,GAAG,EAAE;AAElB,SAAO;;AAGT,QAAO;;;;;;;;;;;AAYT,SAAS,iBACP,QACuC;CAEvC,MAAM,WAAW,kBAAkB,OAAO;CAC1C,MAAM,YAAY,oBAAoB;AACtC,KAAI,CAAC,YAAY,CAAC,UAAW,QAAO;CAGpC,MAAM,YAAY,gCAAgC,OAAO;AACzD,KAAI,UAAU,SAAS,EAAG,QAAO;AAQjC,QAAO,oBAHc,eAFP,WAAW,sBAAsB,OAAO,GAAG,MAC1C,YAAY,oBAAoB,GAAG,KACA,EAGT,UAAU;;;;;;AAOrD,SAAS,oBACP,cAC6B;AAC7B,KAAI,aAAc,QAAO;CAEzB,MAAM,eAAe,2BAA2B;AAChD,KAAI,aAAc,QAAO;AAEzB,QAAO;;;;;;AAOT,SAAS,gBACP,WACA,QACA,WACA,WACuB;AACvB,KAAI,UAAU,WAAW,EAAG,QAAO;CAEnC,MAAM,WAAW,sBAAsB,QAAQ,WAAW,UAAU;CACpE,MAAM,EAAE,WAAW,oBAAoB,UAAU,kBAAkB,SAAS;AAE5E,KAAI,iBAAiB;EACnB,MAAM,eAAe,qBAAqB,QAAQ,WAAW,UAAU;AACvE,MAAI,aAAa,MAAM,SAAS,GAAG;AACjC,aAAU,aAAa,UAAU,WAAW,aAAa,MAAM;AAC/D,UAAO;IACL,MAAM;IACN;IACA;IACA;IACA;IACD;;AAEH,SAAO;;AAGT,QAAO;EACL,MAAM;EACN;EACA;EACA,cAAc,EAAE,OAAO,EAAE,EAAE;EAC3B;EACD;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BH,SAAgB,UAAU,QAA2C;CAEnE,MAAM,eAAe,oBADG,WAAW,gBAAgB,CACM;CAGzD,MAAM,aAAa,OAAuB,EAAE,CAAC;CAG7C,MAAM,YAAY,OAAoD;EACpE,KAAK;EACL,QAAQ;EACT,CAAC;CAGF,MAAM,iBAAiB,cAAc;AACnC,MAAI,CAAC,OAAQ,QAAO;AACpB,SAAO,eAAe,OAAO;IAC5B,CAAC,OAAO,CAAC;CAGZ,MAAM,WAAW,cAAc;AAC7B,MAAI,CAAC,kBAAkB,OAAO,KAAK,eAAe,CAAC,WAAW,EAC5D,QAAO;AAET,SAAO,gBAAgB,eAAe;IACrC,CAAC,eAAe,CAAC;AAGpB,KAAI,UAAU,QAAQ,QAAQ,SAC5B,WAAU,UAAU;EAAE,KAAK;EAAU,QAAQ;EAAgB;CAK/D,MAAM,kBAAoC,cAAc;EACtD,MAAM,gBAAgB,UAAU,QAAQ;AACxC,MAAI,CAAC,YAAY,CAAC,cAChB,QAAO,EAAE;EAIX,IAAI,WAAW,oBACb,cACD;AAKD,MAAI,sBAAsB,SAAS,CACjC,YAAW,4BAA4B,SAAS;EAGlD,MAAM,SAA2B,EAAE;AAEnC,MAAI,cAAc;AAEhB,gBAAa,kBAAkB;AAG/B,QAAK,MAAM,CAAC,WAAW,mBAAmB,UAAU;IAClD,MAAM,QAAQ,gBACZ,cACA,eACA,WACA,eACD;AACD,QAAI,MAAO,QAAO,KAAK,MAAM;;GAI/B,MAAM,gBAAgB,iBAAiB,cAAc;AACrD,OAAI,cACF,MAAK,MAAM,CAAC,MAAM,UAAU,OAAO,QAAQ,cAAc,EAAE;IACzD,MAAM,MAAM,mBAAmB,MAAM,MAAM;AAC3C,iBAAa,iBAAiB,MAAM,IAAI;;AAK5C,OAAI,mBAAmB,cAAc,EAAE;IACrC,MAAM,kBAAkB,uBAAuB,cAAc;AAC7D,QAAI,gBACF,MAAK,MAAM,CAAC,OAAO,eAAe,OAAO,QAAQ,gBAAgB,EAAE;KACjE,MAAM,MAAM,kBAAkB,OAAO,WAAW;AAChD,SAAI,IACF,cAAa,gBAAgB,OAAO,IAAI;;;AAShD,OAAI,WAAW,CAAC,sBAAsB,OAAO;IAC3C,MAAM,WAAW,OAAO,SAAS,MAAM,EAAE,aAAa,MAAM;AAC5D,QAAI,SAAS,SAAS,EACpB,+BAA8B,UAAU,cAAc,cAAc;;QAKxE,MAAK,MAAM,CAAC,WAAW,mBAAmB,UAAU;GAClD,MAAM,QAAQ,aAAa,eAAe,WAAW,eAAe;AACpE,OAAI,MAAO,QAAO,KAAK,MAAM;;AAIjC,SAAO;IACN,CAAC,SAAS,CAAC;AAId,0BAAyB;AAEvB,aAAW,QAAQ,SAAS,YAAY,WAAW,CAAC;AACpD,aAAW,UAAU,EAAE;AAGvB,MAAI,gBAAgB,WAAW,EAC7B;EAGF,MAAM,gBAAgB,UAAU,QAAQ;AAMxC,MAAI,iBAAiB,mBAAmB,cAAc,EAAE;GACtD,MAAM,kBAAkB,uBAAuB,cAAc;AAC7D,OAAI,gBACF,MAAK,MAAM,CAAC,OAAO,eAAe,OAAO,QAAQ,gBAAgB,CAC/D,UAAS,OAAO,WAAW;;EAMjC,MAAM,gBAAgB,gBAClB,iBAAiB,cAAc,GAC/B;EAGJ,IAAI,UAAsC;AAE1C,MAAI,eAAe;AACjB,6BAAU,IAAI,KAAK;AACnB,QAAK,MAAM,CAAC,MAAM,UAAU,OAAO,QAAQ,cAAc,EAAE;IACzD,MAAM,SAAS,UAAU,OAAO,EAAE,MAAM,CAAC;IACzC,MAAM,eAAe,OAAO,UAAU;AAEtC,QAAI,iBAAiB,KACnB,SAAQ,IAAI,MAAM,aAAa;AAEjC,eAAW,QAAQ,KAAK,OAAO,QAAQ;;AAGzC,OAAI,QAAQ,SAAS,EACnB,WAAU;;AAKd,OAAK,MAAM,SAAS,gBAClB,KAAI,MAAM,aAAa,MAAM,SAAS,GAAG;GASvC,MAAM,EAAE,YAAY,OAPE,UAClB,MAAM,aAAa,MAAM,KAAK,UAAU;IACtC,GAAG;IACH,cAAc,sBAAsB,KAAK,cAAc,QAAS;IACjE,EAAE,GACH,MAAM,aAAa,OAEmB,EACxC,UAAU,MAAM,UACjB,CAAC;AACF,cAAW,QAAQ,KAAK,QAAQ;;AAIpC,eAAa;AACX,cAAW,QAAQ,SAAS,YAAY,WAAW,CAAC;AACpD,cAAW,UAAU,EAAE;;IAExB,CAAC,gBAAgB,CAAC;AAOrB,QAAO,EACL,WALgB,cAAc;AAC9B,SAAO,gBAAgB,KAAK,UAAU,MAAM,UAAU,CAAC,KAAK,IAAI;IAC/D,CAAC,gBAAgB,CAAC,EAIpB"}
package/dist/index.d.ts CHANGED
@@ -14,7 +14,7 @@ import { TastyPlugin, TastyPluginFactory } from "./plugins/types.js";
14
14
  import { TastyConfig, configure, getConfig, getGlobalKeyframes, getGlobalRecipes, hasGlobalKeyframes, hasGlobalRecipes, hasStylesGenerated, isConfigLocked, isTestEnvironment, resetConfig } from "./config.js";
15
15
  import { okhslFunc, okhslPlugin } from "./plugins/okhsl-plugin.js";
16
16
  import { CHUNK_NAMES, ChunkInfo, ChunkName, STYLE_TO_CHUNK, categorizeStyleKeys } from "./chunks/definitions.js";
17
- import { PropertyOptions, allocateClassName, cleanup, createInjector, destroy, getCssText, getCssTextForNode, getIsTestEnvironment, getRawCSSText, inject, injectGlobal, injectRawCSS, injector, isPropertyDefined, keyframes, property } from "./injector/index.js";
17
+ import { PropertyOptions, allocateClassName, cleanup, createInjector, destroy, getCssText, getCssTextForNode, getIsTestEnvironment, getRawCSSText, inject, injectGlobal, injectRawCSS, injector, isPropertyDefined, keyframes, property, trackRef } from "./injector/index.js";
18
18
  import { BASE_STYLES, BLOCK_INNER_STYLES, BLOCK_OUTER_STYLES, BLOCK_STYLES, COLOR_STYLES, CONTAINER_STYLES, DIMENSION_STYLES, FLOW_STYLES, INNER_STYLES, OUTER_STYLES, POSITION_STYLES, TEXT_STYLES } from "./styles/list.js";
19
19
  import { AllBaseProps, BaseProps, BasePropsWithoutChildren, BaseStyleProps, BlockInnerStyleProps, BlockOuterStyleProps, BlockStyleProps, ColorStyleProps, ContainerStyleProps, DimensionStyleProps, FlowStyleProps, GlobalStyledProps, InnerStyleProps, ModValue, Mods, OuterStyleProps, PositionStyleProps, Props, ShortGridStyles, TagName, TastyExtensionConfig, TastyThemeNames, TextStyleProps, TokenValue, Tokens } from "./types.js";
20
20
  import { AllBasePropsWithMods, Element, ElementsDefinition, SubElementDefinition, SubElementProps, TastyElementOptions, TastyElementProps, TastyProps, VariantMap, WithVariant, tasty } from "./tasty.js";
@@ -44,5 +44,5 @@ declare module './utils/css-types' {
44
44
  interface CSSProperties extends CSSProperties$1 {}
45
45
  }
46
46
  //#endregion
47
- export { type AllBaseProps, type AllBasePropsWithMods, AtRuleContext, BASE_STYLES, BLOCK_INNER_STYLES, BLOCK_OUTER_STYLES, BLOCK_STYLES, type BaseProps, type BasePropsWithoutChildren, BaseStyleProps, BlockInnerStyleProps, BlockOuterStyleProps, BlockStyleProps, Bucket, CHUNK_NAMES, COLOR_STYLES, COMPUTE_FUNC_MAP, CONTAINER_STYLES, CSSMap, CSSProperties, CUSTOM_UNITS, CacheMetrics, ChunkInfo, ChunkName, ColorStyleProps, ComputeModel, ConditionNode, ContainerStyleProps, DIMENSION_STYLES, DIRECTIONS, DimensionStyleProps, DisposeFunction, Element, type ElementsDefinition, FLOW_STYLES, FlowStyleProps, GlobalStyledProps, INNER_STYLES, InjectResult, InnerStyleProps, KeyframesCacheEntry, KeyframesInfo, KeyframesResult, KeyframesSteps, ModValue, Mods, NoType, NotSelector, OUTER_STYLES, OuterStyleProps, POSITION_STYLES, ParseStateKeyOptions, ParsedAdvancedState, ParsedColor, ParserOptions, PositionStyleProps, ProcessedStyle, PropertyDefinition, PropertyOptions, Props, RawCSSResult, RawStyleHandler, RecipeStyles, RenderResult, RootRegistry, RuleInfo, STATE_OPERATORS, STATE_OPERATOR_LIST, STYLE_TO_CHUNK, Selector, SheetInfo, SheetManager, ShortGridStyles, StateParserContext, StyleDetails, StyleDetailsPart, StyleHandler, StyleHandlerDefinition, StyleHandlerResult, StyleInjector, StyleInjectorConfig, StyleMap, StyleParser, StylePropValue, StyleResult, StyleRule, StyleStateData, StyleStateDataList, StyleStateDataListMap, StyleStateMap, StyleValue, StyleValueStateMap, Styles, StylesInterface, StylesWithoutSelectors, type SubElementDefinition, type SubElementProps, SuffixForSelector, TEXT_STYLES, TagName, TastyConfig, type TastyElementOptions, type TastyElementProps, TastyExtensionConfig, TastyNamedColors, TastyPlugin, TastyPluginFactory, TastyPresetNames, type TastyProps, TastyThemeNames, TextStyleProps, TokenValue, Tokens, TypographyPreset, UnitHandler, type UsePropertyOptions, type UseStylesOptions, type UseStylesResult, type VariantMap, type WithVariant, allocateClassName, buildAtRuleContext, categorizeStyleKeys, cleanup, color, computeState, configure, createInjector, createStateParserContext, customFunc, deprecationWarning, destroy, dotize, extendStyles, extractStyles, filterBaseProps, filterMods, generateTypographyTokens, getConfig, getCssText, getCssTextForNode, getDisplayName, getGlobalFuncs, getGlobalKeyframes, getGlobalParser, getGlobalPredefinedStates, getGlobalPredefinedTokens, getGlobalRecipes, getIsTestEnvironment, getRawCSSText, getRgbValuesFromRgbaString, hasGlobalKeyframes, hasGlobalRecipes, hasStylesGenerated, hexToRgb, hslToRgbValues, inject, injectGlobal, injectRawCSS, injector, isAdvancedStateToken, isConfigLocked, isPropertyDefined, isSelector, isTestEnvironment, keyframes, mergeStyles, _modAttrs as modAttrs, normalizeColorTokenValue, okhslFunc, okhslPlugin, parseColor, parseStateKey, parseStateNotation, parseStyle, processTokens, property, renderStyles, resetConfig, resetGlobalPredefinedTokens, resolveRecipes, setGlobalPredefinedStates, setGlobalPredefinedTokens, strToRgb, stringifyStyles, stringifyTokens, styleHandlers, styleStateMapToStyleStateDataList, tasty, tastyDebug, useGlobalStyles, useKeyframes, useProperty, useRawCSS, useStyles, warn };
47
+ export { type AllBaseProps, type AllBasePropsWithMods, AtRuleContext, BASE_STYLES, BLOCK_INNER_STYLES, BLOCK_OUTER_STYLES, BLOCK_STYLES, type BaseProps, type BasePropsWithoutChildren, BaseStyleProps, BlockInnerStyleProps, BlockOuterStyleProps, BlockStyleProps, Bucket, CHUNK_NAMES, COLOR_STYLES, COMPUTE_FUNC_MAP, CONTAINER_STYLES, CSSMap, CSSProperties, CUSTOM_UNITS, CacheMetrics, ChunkInfo, ChunkName, ColorStyleProps, ComputeModel, ConditionNode, ContainerStyleProps, DIMENSION_STYLES, DIRECTIONS, DimensionStyleProps, DisposeFunction, Element, type ElementsDefinition, FLOW_STYLES, FlowStyleProps, GlobalStyledProps, INNER_STYLES, InjectResult, InnerStyleProps, KeyframesCacheEntry, KeyframesInfo, KeyframesResult, KeyframesSteps, ModValue, Mods, NoType, NotSelector, OUTER_STYLES, OuterStyleProps, POSITION_STYLES, ParseStateKeyOptions, ParsedAdvancedState, ParsedColor, ParserOptions, PositionStyleProps, ProcessedStyle, PropertyDefinition, PropertyOptions, Props, RawCSSResult, RawStyleHandler, RecipeStyles, RenderResult, RootRegistry, RuleInfo, STATE_OPERATORS, STATE_OPERATOR_LIST, STYLE_TO_CHUNK, Selector, SheetInfo, SheetManager, ShortGridStyles, StateParserContext, StyleDetails, StyleDetailsPart, StyleHandler, StyleHandlerDefinition, StyleHandlerResult, StyleInjector, StyleInjectorConfig, StyleMap, StyleParser, StylePropValue, StyleResult, StyleRule, StyleStateData, StyleStateDataList, StyleStateDataListMap, StyleStateMap, StyleValue, StyleValueStateMap, Styles, StylesInterface, StylesWithoutSelectors, type SubElementDefinition, type SubElementProps, SuffixForSelector, TEXT_STYLES, TagName, TastyConfig, type TastyElementOptions, type TastyElementProps, TastyExtensionConfig, TastyNamedColors, TastyPlugin, TastyPluginFactory, TastyPresetNames, type TastyProps, TastyThemeNames, TextStyleProps, TokenValue, Tokens, TypographyPreset, UnitHandler, type UsePropertyOptions, type UseStylesOptions, type UseStylesResult, type VariantMap, type WithVariant, allocateClassName, buildAtRuleContext, categorizeStyleKeys, cleanup, color, computeState, configure, createInjector, createStateParserContext, customFunc, deprecationWarning, destroy, dotize, extendStyles, extractStyles, filterBaseProps, filterMods, generateTypographyTokens, getConfig, getCssText, getCssTextForNode, getDisplayName, getGlobalFuncs, getGlobalKeyframes, getGlobalParser, getGlobalPredefinedStates, getGlobalPredefinedTokens, getGlobalRecipes, getIsTestEnvironment, getRawCSSText, getRgbValuesFromRgbaString, hasGlobalKeyframes, hasGlobalRecipes, hasStylesGenerated, hexToRgb, hslToRgbValues, inject, injectGlobal, injectRawCSS, injector, isAdvancedStateToken, isConfigLocked, isPropertyDefined, isSelector, isTestEnvironment, keyframes, mergeStyles, _modAttrs as modAttrs, normalizeColorTokenValue, okhslFunc, okhslPlugin, parseColor, parseStateKey, parseStateNotation, parseStyle, processTokens, property, renderStyles, resetConfig, resetGlobalPredefinedTokens, resolveRecipes, setGlobalPredefinedStates, setGlobalPredefinedTokens, strToRgb, stringifyStyles, stringifyTokens, styleHandlers, styleStateMapToStyleStateDataList, tasty, tastyDebug, trackRef, useGlobalStyles, useKeyframes, useProperty, useRawCSS, useStyles, warn };
48
48
  //# sourceMappingURL=index.d.ts.map
package/dist/index.js CHANGED
@@ -13,7 +13,7 @@ import { isSelector, renderStyles } from "./pipeline/index.js";
13
13
  import { configure, getConfig, getGlobalKeyframes, getGlobalRecipes, hasGlobalKeyframes, hasGlobalRecipes, hasStylesGenerated, isConfigLocked, isTestEnvironment, resetConfig } from "./config.js";
14
14
  import { CHUNK_NAMES, STYLE_TO_CHUNK, categorizeStyleKeys } from "./chunks/definitions.js";
15
15
  import { BASE_STYLES, BLOCK_INNER_STYLES, BLOCK_OUTER_STYLES, BLOCK_STYLES, COLOR_STYLES, CONTAINER_STYLES, DIMENSION_STYLES, FLOW_STYLES, INNER_STYLES, OUTER_STYLES, POSITION_STYLES, TEXT_STYLES } from "./styles/list.js";
16
- import { allocateClassName, cleanup, createInjector, destroy, getCssText, getCssTextForNode, getIsTestEnvironment, getRawCSSText, inject, injectGlobal, injectRawCSS, injector, isPropertyDefined, keyframes, property } from "./injector/index.js";
16
+ import { allocateClassName, cleanup, createInjector, destroy, getCssText, getCssTextForNode, getIsTestEnvironment, getRawCSSText, inject, injectGlobal, injectRawCSS, injector, isPropertyDefined, keyframes, property, trackRef } from "./injector/index.js";
17
17
  import { filterBaseProps } from "./utils/filter-base-props.js";
18
18
  import { color } from "./utils/colors.js";
19
19
  import { _modAttrs } from "./utils/mod-attrs.js";
@@ -30,4 +30,4 @@ import { useRawCSS } from "./hooks/useRawCSS.js";
30
30
  import { useKeyframes } from "./hooks/useKeyframes.js";
31
31
  import { useProperty } from "./hooks/useProperty.js";
32
32
 
33
- export { BASE_STYLES, BLOCK_INNER_STYLES, BLOCK_OUTER_STYLES, BLOCK_STYLES, Bucket, CHUNK_NAMES, COLOR_STYLES, COMPUTE_FUNC_MAP, CONTAINER_STYLES, CUSTOM_UNITS, DIMENSION_STYLES, DIRECTIONS, Element, FLOW_STYLES, INNER_STYLES, OUTER_STYLES, POSITION_STYLES, STATE_OPERATORS, STATE_OPERATOR_LIST, STYLE_TO_CHUNK, SheetManager, StyleInjector, StyleParser, TEXT_STYLES, allocateClassName, buildAtRuleContext, categorizeStyleKeys, cleanup, color, computeState, configure, createInjector, createStateParserContext, customFunc, deprecationWarning, destroy, dotize, extendStyles, extractStyles, filterBaseProps, filterMods, generateTypographyTokens, getConfig, getCssText, getCssTextForNode, getDisplayName, getGlobalFuncs, getGlobalKeyframes, getGlobalParser, getGlobalPredefinedStates, getGlobalPredefinedTokens, getGlobalRecipes, getIsTestEnvironment, getRawCSSText, getRgbValuesFromRgbaString, hasGlobalKeyframes, hasGlobalRecipes, hasStylesGenerated, hexToRgb, hslToRgbValues, inject, injectGlobal, injectRawCSS, injector, isAdvancedStateToken, isConfigLocked, isPropertyDefined, isSelector, isTestEnvironment, keyframes, mergeStyles, _modAttrs as modAttrs, normalizeColorTokenValue, okhslFunc, okhslPlugin, parseColor, parseStateKey, parseStateNotation, parseStyle, processTokens, property, renderStyles, resetConfig, resetGlobalPredefinedTokens, resolveRecipes, setGlobalPredefinedStates, setGlobalPredefinedTokens, strToRgb, stringifyStyles, stringifyTokens, styleHandlers, styleStateMapToStyleStateDataList, tasty, tastyDebug, useGlobalStyles, useKeyframes, useProperty, useRawCSS, useStyles, warn };
33
+ export { BASE_STYLES, BLOCK_INNER_STYLES, BLOCK_OUTER_STYLES, BLOCK_STYLES, Bucket, CHUNK_NAMES, COLOR_STYLES, COMPUTE_FUNC_MAP, CONTAINER_STYLES, CUSTOM_UNITS, DIMENSION_STYLES, DIRECTIONS, Element, FLOW_STYLES, INNER_STYLES, OUTER_STYLES, POSITION_STYLES, STATE_OPERATORS, STATE_OPERATOR_LIST, STYLE_TO_CHUNK, SheetManager, StyleInjector, StyleParser, TEXT_STYLES, allocateClassName, buildAtRuleContext, categorizeStyleKeys, cleanup, color, computeState, configure, createInjector, createStateParserContext, customFunc, deprecationWarning, destroy, dotize, extendStyles, extractStyles, filterBaseProps, filterMods, generateTypographyTokens, getConfig, getCssText, getCssTextForNode, getDisplayName, getGlobalFuncs, getGlobalKeyframes, getGlobalParser, getGlobalPredefinedStates, getGlobalPredefinedTokens, getGlobalRecipes, getIsTestEnvironment, getRawCSSText, getRgbValuesFromRgbaString, hasGlobalKeyframes, hasGlobalRecipes, hasStylesGenerated, hexToRgb, hslToRgbValues, inject, injectGlobal, injectRawCSS, injector, isAdvancedStateToken, isConfigLocked, isPropertyDefined, isSelector, isTestEnvironment, keyframes, mergeStyles, _modAttrs as modAttrs, normalizeColorTokenValue, okhslFunc, okhslPlugin, parseColor, parseStateKey, parseStateNotation, parseStyle, processTokens, property, renderStyles, resetConfig, resetGlobalPredefinedTokens, resolveRecipes, setGlobalPredefinedStates, setGlobalPredefinedTokens, strToRgb, stringifyStyles, stringifyTokens, styleHandlers, styleStateMapToStyleStateDataList, tasty, tastyDebug, trackRef, useGlobalStyles, useKeyframes, useProperty, useRawCSS, useStyles, warn };
@@ -13,6 +13,14 @@ declare function allocateClassName(cacheKey: string, options?: {
13
13
  className: string;
14
14
  isNewAllocation: boolean;
15
15
  };
16
+ /**
17
+ * Track a reference to an already-injected cacheKey (refCount + dispose).
18
+ * Used on cache hits (SSR hydration or runtime reuse) where the pipeline
19
+ * was skipped. Returns null if the cacheKey is not in the cache.
20
+ */
21
+ declare function trackRef(cacheKey: string, options?: {
22
+ root?: Document | ShadowRoot;
23
+ }): InjectResult | null;
16
24
  /**
17
25
  * Inject styles and return className with dispose function
18
26
  */
@@ -153,5 +161,5 @@ declare function destroy(root?: Document | ShadowRoot): void;
153
161
  */
154
162
  declare function createInjector(config?: Partial<StyleInjectorConfig>): StyleInjector;
155
163
  //#endregion
156
- export { PropertyOptions, allocateClassName, cleanup, createInjector, destroy, getCssText, getCssTextForNode, getIsTestEnvironment, getRawCSSText, inject, injectGlobal, injectRawCSS, injector, isPropertyDefined, keyframes, property };
164
+ export { PropertyOptions, allocateClassName, cleanup, createInjector, destroy, getCssText, getCssTextForNode, getIsTestEnvironment, getRawCSSText, inject, injectGlobal, injectRawCSS, injector, isPropertyDefined, keyframes, property, trackRef };
157
165
  //# sourceMappingURL=index.d.ts.map
@@ -10,6 +10,14 @@ function allocateClassName(cacheKey, options) {
10
10
  return getGlobalInjector().allocateClassName(cacheKey, options);
11
11
  }
12
12
  /**
13
+ * Track a reference to an already-injected cacheKey (refCount + dispose).
14
+ * Used on cache hits (SSR hydration or runtime reuse) where the pipeline
15
+ * was skipped. Returns null if the cacheKey is not in the cache.
16
+ */
17
+ function trackRef(cacheKey, options) {
18
+ return getGlobalInjector().trackRef(cacheKey, options);
19
+ }
20
+ /**
13
21
  * Inject styles and return className with dispose function
14
22
  */
15
23
  function inject(rules, options) {
@@ -150,5 +158,5 @@ function createInjector(config = {}) {
150
158
  }
151
159
 
152
160
  //#endregion
153
- export { allocateClassName, cleanup, createInjector, destroy, getCssText, getCssTextForNode, getIsTestEnvironment, getRawCSSText, inject, injectGlobal, injectRawCSS, injector, isPropertyDefined, keyframes, property };
161
+ export { allocateClassName, cleanup, createInjector, destroy, getCssText, getCssTextForNode, getIsTestEnvironment, getRawCSSText, inject, injectGlobal, injectRawCSS, injector, isPropertyDefined, keyframes, property, trackRef };
154
162
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":[],"sources":["../../src/injector/index.ts"],"sourcesContent":["import {\n getConfig,\n getGlobalInjector,\n isTestEnvironment,\n markStylesGenerated,\n} from '../config';\nimport type { StyleResult } from '../pipeline';\n\nimport { StyleInjector } from './injector';\nimport type {\n GlobalInjectResult,\n InjectResult,\n KeyframesResult,\n KeyframesSteps,\n StyleInjectorConfig,\n} from './types';\n\n/**\n * Allocate a className for a cacheKey without injecting styles yet\n */\nexport function allocateClassName(\n cacheKey: string,\n options?: { root?: Document | ShadowRoot },\n): { className: string; isNewAllocation: boolean } {\n return getGlobalInjector().allocateClassName(cacheKey, options);\n}\n\n/**\n * Inject styles and return className with dispose function\n */\nexport function inject(\n rules: StyleResult[],\n options?: { root?: Document | ShadowRoot; cacheKey?: string },\n): InjectResult {\n // Mark that styles have been generated (prevents configuration changes)\n markStylesGenerated();\n\n return getGlobalInjector().inject(rules, options);\n}\n\n/**\n * Inject global rules that should not reserve tasty class names\n */\nexport function injectGlobal(\n rules: StyleResult[],\n options?: { root?: Document | ShadowRoot },\n): GlobalInjectResult {\n return getGlobalInjector().injectGlobal(rules, options);\n}\n\n/**\n * Inject raw CSS text directly without parsing\n * This is a low-overhead method for injecting raw CSS that doesn't need tasty processing.\n * The CSS is inserted into a separate style element to avoid conflicts with tasty's chunking.\n *\n * @example\n * ```tsx\n * // Inject raw CSS\n * const { dispose } = injectRawCSS(`\n * body { margin: 0; padding: 0; }\n * .my-class { color: red; }\n * `);\n *\n * // Later, remove the injected CSS\n * dispose();\n * ```\n */\nexport function injectRawCSS(\n css: string,\n options?: { root?: Document | ShadowRoot },\n): { dispose: () => void } {\n return getGlobalInjector().injectRawCSS(css, options);\n}\n\n/**\n * Get raw CSS text for SSR\n */\nexport function getRawCSSText(options?: {\n root?: Document | ShadowRoot;\n}): string {\n return getGlobalInjector().getRawCSSText(options);\n}\n\n/**\n * Inject keyframes and return object with toString() and dispose()\n */\nexport function keyframes(\n steps: KeyframesSteps,\n nameOrOptions?: string | { root?: Document | ShadowRoot; name?: string },\n): KeyframesResult {\n return getGlobalInjector().keyframes(steps, nameOrOptions);\n}\n\nexport interface PropertyOptions {\n /**\n * CSS syntax string for the property (e.g., '<color>', '<length>', '<angle>')\n * @see https://developer.mozilla.org/en-US/docs/Web/CSS/@property/syntax\n */\n syntax?: string;\n /**\n * Whether the property inherits from parent elements\n * @default true\n */\n inherits?: boolean;\n /**\n * Initial value for the property\n */\n initialValue?: string | number;\n /**\n * Shadow root or document to inject into\n */\n root?: Document | ShadowRoot;\n}\n\n/**\n * Define a CSS @property custom property.\n * This enables advanced features like animating custom properties.\n *\n * Note: @property rules are global and persistent once defined.\n * Re-registering the same property name is a no-op.\n *\n * @param name - The custom property name (must start with --)\n * @param options - Property configuration\n *\n * @example\n * ```ts\n * // Define a color property that can be animated\n * property('--my-color', {\n * syntax: '<color>',\n * initialValue: 'red',\n * });\n *\n * // Define an angle property\n * property('--rotation', {\n * syntax: '<angle>',\n * inherits: false,\n * initialValue: '0deg',\n * });\n * ```\n */\nexport function property(name: string, options?: PropertyOptions): void {\n return getGlobalInjector().property(name, options);\n}\n\n/**\n * Check if a CSS @property has already been defined\n *\n * @param name - The custom property name to check\n * @param options - Options including root\n */\nexport function isPropertyDefined(\n name: string,\n options?: { root?: Document | ShadowRoot },\n): boolean {\n return getGlobalInjector().isPropertyDefined(name, options);\n}\n\n/**\n * Get CSS text from all sheets (for SSR)\n */\nexport function getCssText(options?: { root?: Document | ShadowRoot }): string {\n return getGlobalInjector().getCssText(options);\n}\n\n/**\n * Collect only CSS used by a rendered subtree (like jest-styled-components).\n * Pass the container returned by render(...).\n */\nexport function getCssTextForNode(\n node: ParentNode | Element | DocumentFragment,\n options?: { root?: Document | ShadowRoot },\n): string {\n // Collect tasty-generated class names (t<number>) from the subtree\n const classSet = new Set<string>();\n\n const readClasses = (el: Element) => {\n const cls = el.getAttribute('class');\n if (!cls) return;\n for (const token of cls.split(/\\s+/)) {\n if (/^t\\d+$/.test(token)) classSet.add(token);\n }\n };\n\n // Include node itself if it's an Element\n if ((node as Element).getAttribute) {\n readClasses(node as Element);\n }\n // Walk descendants\n const elements = (node as ParentNode).querySelectorAll\n ? (node as ParentNode).querySelectorAll('[class]')\n : ([] as unknown as NodeListOf<Element>);\n if (elements) elements.forEach(readClasses);\n\n return getGlobalInjector().getCssTextForClasses(classSet, options);\n}\n\n/**\n * Force cleanup of unused rules\n */\nexport function cleanup(root?: Document | ShadowRoot): void {\n return getGlobalInjector().cleanup(root);\n}\n\n/**\n * Check if we're currently running in a test environment\n */\nexport function getIsTestEnvironment(): boolean {\n return isTestEnvironment();\n}\n\n/**\n * Get the global injector instance for debugging\n */\nexport const injector = {\n get instance() {\n return getGlobalInjector();\n },\n};\n\n/**\n * Destroy all resources and clean up\n */\nexport function destroy(root?: Document | ShadowRoot): void {\n return getGlobalInjector().destroy(root);\n}\n\n/**\n * Create a new isolated injector instance\n */\nexport function createInjector(\n config: Partial<StyleInjectorConfig> = {},\n): StyleInjector {\n const defaultConfig = getConfig();\n\n const fullConfig: StyleInjectorConfig = {\n ...defaultConfig,\n // Auto-enable forceTextInjection in test environments\n forceTextInjection: config.forceTextInjection ?? isTestEnvironment(),\n ...config,\n };\n\n return new StyleInjector(fullConfig);\n}\n\n// Re-export types\nexport type {\n StyleInjectorConfig,\n InjectResult,\n DisposeFunction,\n RuleInfo,\n SheetInfo,\n RootRegistry,\n StyleRule,\n KeyframesInfo,\n KeyframesResult,\n KeyframesSteps,\n KeyframesCacheEntry,\n CacheMetrics,\n RawCSSResult,\n PropertyDefinition,\n} from './types';\n\nexport { StyleInjector } from './injector';\nexport { SheetManager } from './sheet-manager';\n"],"mappings":";;;;;;;;AAoBA,SAAgB,kBACd,UACA,SACiD;AACjD,QAAO,mBAAmB,CAAC,kBAAkB,UAAU,QAAQ;;;;;AAMjE,SAAgB,OACd,OACA,SACc;AAEd,sBAAqB;AAErB,QAAO,mBAAmB,CAAC,OAAO,OAAO,QAAQ;;;;;AAMnD,SAAgB,aACd,OACA,SACoB;AACpB,QAAO,mBAAmB,CAAC,aAAa,OAAO,QAAQ;;;;;;;;;;;;;;;;;;;AAoBzD,SAAgB,aACd,KACA,SACyB;AACzB,QAAO,mBAAmB,CAAC,aAAa,KAAK,QAAQ;;;;;AAMvD,SAAgB,cAAc,SAEnB;AACT,QAAO,mBAAmB,CAAC,cAAc,QAAQ;;;;;AAMnD,SAAgB,UACd,OACA,eACiB;AACjB,QAAO,mBAAmB,CAAC,UAAU,OAAO,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkD5D,SAAgB,SAAS,MAAc,SAAiC;AACtE,QAAO,mBAAmB,CAAC,SAAS,MAAM,QAAQ;;;;;;;;AASpD,SAAgB,kBACd,MACA,SACS;AACT,QAAO,mBAAmB,CAAC,kBAAkB,MAAM,QAAQ;;;;;AAM7D,SAAgB,WAAW,SAAoD;AAC7E,QAAO,mBAAmB,CAAC,WAAW,QAAQ;;;;;;AAOhD,SAAgB,kBACd,MACA,SACQ;CAER,MAAM,2BAAW,IAAI,KAAa;CAElC,MAAM,eAAe,OAAgB;EACnC,MAAM,MAAM,GAAG,aAAa,QAAQ;AACpC,MAAI,CAAC,IAAK;AACV,OAAK,MAAM,SAAS,IAAI,MAAM,MAAM,CAClC,KAAI,SAAS,KAAK,MAAM,CAAE,UAAS,IAAI,MAAM;;AAKjD,KAAK,KAAiB,aACpB,aAAY,KAAgB;CAG9B,MAAM,WAAY,KAAoB,mBACjC,KAAoB,iBAAiB,UAAU,GAC/C,EAAE;AACP,KAAI,SAAU,UAAS,QAAQ,YAAY;AAE3C,QAAO,mBAAmB,CAAC,qBAAqB,UAAU,QAAQ;;;;;AAMpE,SAAgB,QAAQ,MAAoC;AAC1D,QAAO,mBAAmB,CAAC,QAAQ,KAAK;;;;;AAM1C,SAAgB,uBAAgC;AAC9C,QAAO,mBAAmB;;;;;AAM5B,MAAa,WAAW,EACtB,IAAI,WAAW;AACb,QAAO,mBAAmB;GAE7B;;;;AAKD,SAAgB,QAAQ,MAAoC;AAC1D,QAAO,mBAAmB,CAAC,QAAQ,KAAK;;;;;AAM1C,SAAgB,eACd,SAAuC,EAAE,EAC1B;AAUf,QAAO,IAAI,cAP6B;EACtC,GAHoB,WAAW;EAK/B,oBAAoB,OAAO,sBAAsB,mBAAmB;EACpE,GAAG;EACJ,CAEmC"}
1
+ {"version":3,"file":"index.js","names":[],"sources":["../../src/injector/index.ts"],"sourcesContent":["import {\n getConfig,\n getGlobalInjector,\n isTestEnvironment,\n markStylesGenerated,\n} from '../config';\nimport type { StyleResult } from '../pipeline';\n\nimport { StyleInjector } from './injector';\nimport type {\n GlobalInjectResult,\n InjectResult,\n KeyframesResult,\n KeyframesSteps,\n StyleInjectorConfig,\n} from './types';\n\n/**\n * Allocate a className for a cacheKey without injecting styles yet\n */\nexport function allocateClassName(\n cacheKey: string,\n options?: { root?: Document | ShadowRoot },\n): { className: string; isNewAllocation: boolean } {\n return getGlobalInjector().allocateClassName(cacheKey, options);\n}\n\n/**\n * Track a reference to an already-injected cacheKey (refCount + dispose).\n * Used on cache hits (SSR hydration or runtime reuse) where the pipeline\n * was skipped. Returns null if the cacheKey is not in the cache.\n */\nexport function trackRef(\n cacheKey: string,\n options?: { root?: Document | ShadowRoot },\n): InjectResult | null {\n return getGlobalInjector().trackRef(cacheKey, options);\n}\n\n/**\n * Inject styles and return className with dispose function\n */\nexport function inject(\n rules: StyleResult[],\n options?: { root?: Document | ShadowRoot; cacheKey?: string },\n): InjectResult {\n // Mark that styles have been generated (prevents configuration changes)\n markStylesGenerated();\n\n return getGlobalInjector().inject(rules, options);\n}\n\n/**\n * Inject global rules that should not reserve tasty class names\n */\nexport function injectGlobal(\n rules: StyleResult[],\n options?: { root?: Document | ShadowRoot },\n): GlobalInjectResult {\n return getGlobalInjector().injectGlobal(rules, options);\n}\n\n/**\n * Inject raw CSS text directly without parsing\n * This is a low-overhead method for injecting raw CSS that doesn't need tasty processing.\n * The CSS is inserted into a separate style element to avoid conflicts with tasty's chunking.\n *\n * @example\n * ```tsx\n * // Inject raw CSS\n * const { dispose } = injectRawCSS(`\n * body { margin: 0; padding: 0; }\n * .my-class { color: red; }\n * `);\n *\n * // Later, remove the injected CSS\n * dispose();\n * ```\n */\nexport function injectRawCSS(\n css: string,\n options?: { root?: Document | ShadowRoot },\n): { dispose: () => void } {\n return getGlobalInjector().injectRawCSS(css, options);\n}\n\n/**\n * Get raw CSS text for SSR\n */\nexport function getRawCSSText(options?: {\n root?: Document | ShadowRoot;\n}): string {\n return getGlobalInjector().getRawCSSText(options);\n}\n\n/**\n * Inject keyframes and return object with toString() and dispose()\n */\nexport function keyframes(\n steps: KeyframesSteps,\n nameOrOptions?: string | { root?: Document | ShadowRoot; name?: string },\n): KeyframesResult {\n return getGlobalInjector().keyframes(steps, nameOrOptions);\n}\n\nexport interface PropertyOptions {\n /**\n * CSS syntax string for the property (e.g., '<color>', '<length>', '<angle>')\n * @see https://developer.mozilla.org/en-US/docs/Web/CSS/@property/syntax\n */\n syntax?: string;\n /**\n * Whether the property inherits from parent elements\n * @default true\n */\n inherits?: boolean;\n /**\n * Initial value for the property\n */\n initialValue?: string | number;\n /**\n * Shadow root or document to inject into\n */\n root?: Document | ShadowRoot;\n}\n\n/**\n * Define a CSS @property custom property.\n * This enables advanced features like animating custom properties.\n *\n * Note: @property rules are global and persistent once defined.\n * Re-registering the same property name is a no-op.\n *\n * @param name - The custom property name (must start with --)\n * @param options - Property configuration\n *\n * @example\n * ```ts\n * // Define a color property that can be animated\n * property('--my-color', {\n * syntax: '<color>',\n * initialValue: 'red',\n * });\n *\n * // Define an angle property\n * property('--rotation', {\n * syntax: '<angle>',\n * inherits: false,\n * initialValue: '0deg',\n * });\n * ```\n */\nexport function property(name: string, options?: PropertyOptions): void {\n return getGlobalInjector().property(name, options);\n}\n\n/**\n * Check if a CSS @property has already been defined\n *\n * @param name - The custom property name to check\n * @param options - Options including root\n */\nexport function isPropertyDefined(\n name: string,\n options?: { root?: Document | ShadowRoot },\n): boolean {\n return getGlobalInjector().isPropertyDefined(name, options);\n}\n\n/**\n * Get CSS text from all sheets (for SSR)\n */\nexport function getCssText(options?: { root?: Document | ShadowRoot }): string {\n return getGlobalInjector().getCssText(options);\n}\n\n/**\n * Collect only CSS used by a rendered subtree (like jest-styled-components).\n * Pass the container returned by render(...).\n */\nexport function getCssTextForNode(\n node: ParentNode | Element | DocumentFragment,\n options?: { root?: Document | ShadowRoot },\n): string {\n // Collect tasty-generated class names (t<number>) from the subtree\n const classSet = new Set<string>();\n\n const readClasses = (el: Element) => {\n const cls = el.getAttribute('class');\n if (!cls) return;\n for (const token of cls.split(/\\s+/)) {\n if (/^t\\d+$/.test(token)) classSet.add(token);\n }\n };\n\n // Include node itself if it's an Element\n if ((node as Element).getAttribute) {\n readClasses(node as Element);\n }\n // Walk descendants\n const elements = (node as ParentNode).querySelectorAll\n ? (node as ParentNode).querySelectorAll('[class]')\n : ([] as unknown as NodeListOf<Element>);\n if (elements) elements.forEach(readClasses);\n\n return getGlobalInjector().getCssTextForClasses(classSet, options);\n}\n\n/**\n * Force cleanup of unused rules\n */\nexport function cleanup(root?: Document | ShadowRoot): void {\n return getGlobalInjector().cleanup(root);\n}\n\n/**\n * Check if we're currently running in a test environment\n */\nexport function getIsTestEnvironment(): boolean {\n return isTestEnvironment();\n}\n\n/**\n * Get the global injector instance for debugging\n */\nexport const injector = {\n get instance() {\n return getGlobalInjector();\n },\n};\n\n/**\n * Destroy all resources and clean up\n */\nexport function destroy(root?: Document | ShadowRoot): void {\n return getGlobalInjector().destroy(root);\n}\n\n/**\n * Create a new isolated injector instance\n */\nexport function createInjector(\n config: Partial<StyleInjectorConfig> = {},\n): StyleInjector {\n const defaultConfig = getConfig();\n\n const fullConfig: StyleInjectorConfig = {\n ...defaultConfig,\n // Auto-enable forceTextInjection in test environments\n forceTextInjection: config.forceTextInjection ?? isTestEnvironment(),\n ...config,\n };\n\n return new StyleInjector(fullConfig);\n}\n\n// Re-export types\nexport type {\n StyleInjectorConfig,\n InjectResult,\n DisposeFunction,\n RuleInfo,\n SheetInfo,\n RootRegistry,\n StyleRule,\n KeyframesInfo,\n KeyframesResult,\n KeyframesSteps,\n KeyframesCacheEntry,\n CacheMetrics,\n RawCSSResult,\n PropertyDefinition,\n} from './types';\n\nexport { StyleInjector } from './injector';\nexport { SheetManager } from './sheet-manager';\n"],"mappings":";;;;;;;;AAoBA,SAAgB,kBACd,UACA,SACiD;AACjD,QAAO,mBAAmB,CAAC,kBAAkB,UAAU,QAAQ;;;;;;;AAQjE,SAAgB,SACd,UACA,SACqB;AACrB,QAAO,mBAAmB,CAAC,SAAS,UAAU,QAAQ;;;;;AAMxD,SAAgB,OACd,OACA,SACc;AAEd,sBAAqB;AAErB,QAAO,mBAAmB,CAAC,OAAO,OAAO,QAAQ;;;;;AAMnD,SAAgB,aACd,OACA,SACoB;AACpB,QAAO,mBAAmB,CAAC,aAAa,OAAO,QAAQ;;;;;;;;;;;;;;;;;;;AAoBzD,SAAgB,aACd,KACA,SACyB;AACzB,QAAO,mBAAmB,CAAC,aAAa,KAAK,QAAQ;;;;;AAMvD,SAAgB,cAAc,SAEnB;AACT,QAAO,mBAAmB,CAAC,cAAc,QAAQ;;;;;AAMnD,SAAgB,UACd,OACA,eACiB;AACjB,QAAO,mBAAmB,CAAC,UAAU,OAAO,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkD5D,SAAgB,SAAS,MAAc,SAAiC;AACtE,QAAO,mBAAmB,CAAC,SAAS,MAAM,QAAQ;;;;;;;;AASpD,SAAgB,kBACd,MACA,SACS;AACT,QAAO,mBAAmB,CAAC,kBAAkB,MAAM,QAAQ;;;;;AAM7D,SAAgB,WAAW,SAAoD;AAC7E,QAAO,mBAAmB,CAAC,WAAW,QAAQ;;;;;;AAOhD,SAAgB,kBACd,MACA,SACQ;CAER,MAAM,2BAAW,IAAI,KAAa;CAElC,MAAM,eAAe,OAAgB;EACnC,MAAM,MAAM,GAAG,aAAa,QAAQ;AACpC,MAAI,CAAC,IAAK;AACV,OAAK,MAAM,SAAS,IAAI,MAAM,MAAM,CAClC,KAAI,SAAS,KAAK,MAAM,CAAE,UAAS,IAAI,MAAM;;AAKjD,KAAK,KAAiB,aACpB,aAAY,KAAgB;CAG9B,MAAM,WAAY,KAAoB,mBACjC,KAAoB,iBAAiB,UAAU,GAC/C,EAAE;AACP,KAAI,SAAU,UAAS,QAAQ,YAAY;AAE3C,QAAO,mBAAmB,CAAC,qBAAqB,UAAU,QAAQ;;;;;AAMpE,SAAgB,QAAQ,MAAoC;AAC1D,QAAO,mBAAmB,CAAC,QAAQ,KAAK;;;;;AAM1C,SAAgB,uBAAgC;AAC9C,QAAO,mBAAmB;;;;;AAM5B,MAAa,WAAW,EACtB,IAAI,WAAW;AACb,QAAO,mBAAmB;GAE7B;;;;AAKD,SAAgB,QAAQ,MAAoC;AAC1D,QAAO,mBAAmB,CAAC,QAAQ,KAAK;;;;;AAM1C,SAAgB,eACd,SAAuC,EAAE,EAC1B;AAUf,QAAO,IAAI,cAP6B;EACtC,GAHoB,WAAW;EAK/B,oBAAoB,OAAO,sBAAsB,mBAAmB;EACpE,GAAG;EACJ,CAEmC"}
@@ -50,6 +50,15 @@ declare class StyleInjector {
50
50
  getRawCSSText(options?: {
51
51
  root?: Document | ShadowRoot;
52
52
  }): string;
53
+ /**
54
+ * Increment refCount for an already-injected cacheKey and return a dispose.
55
+ * Used by useStyles on cache hits (hydration or runtime reuse) where
56
+ * the pipeline was skipped but refCount tracking is still needed.
57
+ * Returns null if the cacheKey is not found.
58
+ */
59
+ trackRef(cacheKey: string, options?: {
60
+ root?: Document | ShadowRoot;
61
+ }): InjectResult | null;
53
62
  /**
54
63
  * Dispose of a className
55
64
  */
@@ -178,6 +178,25 @@ var StyleInjector = class {
178
178
  return this.sheetManager.getRawCSSText(root);
179
179
  }
180
180
  /**
181
+ * Increment refCount for an already-injected cacheKey and return a dispose.
182
+ * Used by useStyles on cache hits (hydration or runtime reuse) where
183
+ * the pipeline was skipped but refCount tracking is still needed.
184
+ * Returns null if the cacheKey is not found.
185
+ */
186
+ trackRef(cacheKey, options) {
187
+ const root = options?.root || document;
188
+ const registry = this.sheetManager.getRegistry(root);
189
+ if (!registry.cacheKeyToClassName.has(cacheKey)) return null;
190
+ const className = registry.cacheKeyToClassName.get(cacheKey);
191
+ const currentRefCount = registry.refCounts.get(className) || 0;
192
+ registry.refCounts.set(className, currentRefCount + 1);
193
+ if (registry.metrics) registry.metrics.hits++;
194
+ return {
195
+ className,
196
+ dispose: () => this.dispose(className, registry)
197
+ };
198
+ }
199
+ /**
181
200
  * Dispose of a className
182
201
  */
183
202
  dispose(className, registry) {
@@ -278,7 +297,7 @@ var StyleInjector = class {
278
297
  const existingDef = registry.injectedProperties.get(cssName);
279
298
  if (existingDef !== void 0) {
280
299
  if (existingDef !== normalizedDef) {
281
- if (isDevEnv()) console.warn(`[Tasty] @property ${cssName} was already defined with a different declaration. The new declaration will be ignored. Original: ${existingDef}, New: ${normalizedDef}`);
300
+ if (isDevEnv()) console.debug(`[Tasty] @property ${cssName} was already defined with a different declaration. The new declaration will be ignored.`);
282
301
  }
283
302
  return;
284
303
  }
@@ -1 +1 @@
1
- {"version":3,"file":"injector.js","names":[],"sources":["../../src/injector/injector.ts"],"sourcesContent":["/**\n * Style injector that works with structured style objects\n * Eliminates CSS string parsing for better performance\n */\n\nimport type { StyleResult } from '../pipeline';\nimport {\n getEffectiveDefinition,\n normalizePropertyDefinition,\n} from '../properties';\nimport { isDevEnv } from '../utils/is-dev-env';\nimport type { StyleValue } from '../utils/styles';\nimport { parseStyle } from '../utils/styles';\n\nimport { SheetManager } from './sheet-manager';\nimport type {\n CacheMetrics,\n GlobalInjectResult,\n InjectResult,\n KeyframesResult,\n KeyframesSteps,\n PropertyDefinition,\n RawCSSResult,\n RootRegistry,\n StyleInjectorConfig,\n StyleRule,\n} from './types';\n\n/**\n * Generate sequential class name with format t{number}\n */\nfunction generateClassName(counter: number): string {\n return `t${counter}`;\n}\n\nexport class StyleInjector {\n private sheetManager: SheetManager;\n private config: StyleInjectorConfig;\n private cleanupScheduled = false;\n private globalRuleCounter = 0;\n\n /** @internal — exposed for debug utilities only */\n get _sheetManager(): SheetManager {\n return this.sheetManager;\n }\n\n constructor(config: StyleInjectorConfig = {}) {\n this.config = config;\n this.sheetManager = new SheetManager(config);\n }\n\n /**\n * Allocate a className for a cacheKey without injecting styles yet.\n * This allows separating className allocation (render phase) from style injection (insertion phase).\n */\n allocateClassName(\n cacheKey: string,\n options?: { root?: Document | ShadowRoot },\n ): { className: string; isNewAllocation: boolean } {\n const root = options?.root || document;\n const registry = this.sheetManager.getRegistry(root);\n\n // Check if we can reuse existing className for this cache key\n if (registry.cacheKeyToClassName.has(cacheKey)) {\n const className = registry.cacheKeyToClassName.get(cacheKey)!;\n return {\n className,\n isNewAllocation: false,\n };\n }\n\n // Generate new className and reserve it\n const className = generateClassName(registry.classCounter++);\n\n // Create placeholder RuleInfo to reserve the className\n const placeholderRuleInfo = {\n className,\n ruleIndex: -1, // Placeholder - will be set during actual injection\n sheetIndex: -1, // Placeholder - will be set during actual injection\n };\n\n // Store RuleInfo only once by className, and map cacheKey separately\n registry.rules.set(className, placeholderRuleInfo);\n registry.cacheKeyToClassName.set(cacheKey, className);\n\n return {\n className,\n isNewAllocation: true,\n };\n }\n\n /**\n * Inject styles from StyleResult objects\n */\n inject(\n rules: StyleResult[],\n options?: { root?: Document | ShadowRoot; cacheKey?: string },\n ): InjectResult {\n const root = options?.root || document;\n const registry = this.sheetManager.getRegistry(root);\n\n if (rules.length === 0) {\n return {\n className: '',\n dispose: () => {\n /* noop */\n },\n };\n }\n\n // Rules are now in StyleRule format directly\n\n // Check if we can reuse based on cache key\n const cacheKey = options?.cacheKey;\n let className: string;\n let isPreAllocated = false;\n\n if (cacheKey && registry.cacheKeyToClassName.has(cacheKey)) {\n // Reuse existing class for this cache key\n className = registry.cacheKeyToClassName.get(cacheKey)!;\n const existingRuleInfo = registry.rules.get(className)!;\n\n // Check if this is a placeholder (pre-allocated but not yet injected)\n isPreAllocated =\n existingRuleInfo.ruleIndex === -1 && existingRuleInfo.sheetIndex === -1;\n\n if (!isPreAllocated) {\n // Already injected - just increment refCount\n const currentRefCount = registry.refCounts.get(className) || 0;\n registry.refCounts.set(className, currentRefCount + 1);\n\n // Update metrics\n if (registry.metrics) {\n registry.metrics.hits++;\n }\n\n return {\n className,\n dispose: () => this.dispose(className, registry),\n };\n }\n } else {\n // Generate new className\n className = generateClassName(registry.classCounter++);\n }\n\n // Process rules: handle needsClassName flag and apply specificity\n const rulesToInsert = rules.map((rule) => {\n let newSelector = rule.selector;\n\n // If rule needs className prepended\n if (rule.needsClassName) {\n // Handle multiple selectors (separated by ||| for OR conditions)\n const selectorParts = newSelector ? newSelector.split('|||') : [''];\n\n const classPrefix = `.${className}.${className}`;\n\n newSelector = selectorParts\n .map((part) => {\n const classSelector = part ? `${classPrefix}${part}` : classPrefix;\n\n // If there's a root prefix, add it before the class selector\n if (rule.rootPrefix) {\n return `${rule.rootPrefix} ${classSelector}`;\n }\n return classSelector;\n })\n .join(', ');\n }\n\n return {\n ...rule,\n selector: newSelector,\n needsClassName: undefined, // Remove the flag after processing\n rootPrefix: undefined, // Remove rootPrefix after processing\n };\n });\n\n // Auto-register @property for custom properties with inferable types.\n // Colors are detected by --*-color name pattern, numeric types by value.\n if (this.config.autoPropertyTypes !== false) {\n const resolver = registry.propertyTypeResolver;\n const defined = registry.injectedProperties;\n for (const rule of rulesToInsert) {\n if (!rule.declarations) continue;\n resolver.scanDeclarations(\n rule.declarations,\n (name) => defined.has(name),\n (name, syntax, initialValue) => {\n this.property(name, {\n syntax,\n inherits: true,\n initialValue,\n root,\n });\n },\n );\n }\n }\n\n // Insert rules using existing sheet manager\n const ruleInfo = this.sheetManager.insertRule(\n registry,\n rulesToInsert,\n className,\n root,\n );\n\n if (!ruleInfo) {\n // Update metrics\n if (registry.metrics) {\n registry.metrics.misses++;\n }\n\n return {\n className,\n dispose: () => {\n /* noop */\n },\n };\n }\n\n // Store in registry\n registry.refCounts.set(className, 1);\n\n if (isPreAllocated) {\n // Update the existing placeholder entry with real rule info\n registry.rules.set(className, ruleInfo);\n // cacheKey mapping already exists from allocation\n } else {\n // Store new entries\n registry.rules.set(className, ruleInfo);\n if (cacheKey) {\n registry.cacheKeyToClassName.set(cacheKey, className);\n }\n }\n\n // Update metrics\n if (registry.metrics) {\n registry.metrics.totalInsertions++;\n registry.metrics.misses++;\n }\n\n return {\n className,\n dispose: () => this.dispose(className, registry),\n };\n }\n\n /**\n * Inject global styles (rules without a generated tasty class selector)\n * This ensures we don't reserve a tasty class name (t{number}) for global rules,\n * which could otherwise collide with element-level styles and break lookups.\n */\n injectGlobal(\n rules: StyleResult[],\n options?: { root?: Document | ShadowRoot },\n ): GlobalInjectResult {\n const root = options?.root || document;\n const registry = this.sheetManager.getRegistry(root);\n\n if (!rules || rules.length === 0) {\n return {\n dispose: () => {\n /* noop */\n },\n };\n }\n\n // Auto-register @property for custom properties in global rules\n if (this.config.autoPropertyTypes !== false) {\n const resolver = registry.propertyTypeResolver;\n const defined = registry.injectedProperties;\n for (const rule of rules) {\n if (!rule.declarations) continue;\n resolver.scanDeclarations(\n rule.declarations,\n (name) => defined.has(name),\n (name, syntax, initialValue) => {\n this.property(name, {\n syntax,\n inherits: true,\n initialValue,\n root,\n });\n },\n );\n }\n }\n\n // Use a non-tasty identifier to avoid any collisions with .t{number} classes\n const key = `global:${this.globalRuleCounter++}`;\n\n const info = this.sheetManager.insertGlobalRule(\n registry,\n rules as unknown as StyleRule[],\n key,\n root,\n );\n\n if (registry.metrics) {\n registry.metrics.totalInsertions++;\n }\n\n return {\n dispose: () => {\n if (info) this.sheetManager.deleteGlobalRule(registry, key);\n },\n };\n }\n\n /**\n * Inject raw CSS text directly without parsing\n * This is a low-overhead alternative to createGlobalStyle for raw CSS\n * The CSS is inserted into a separate style element to avoid conflicts with tasty's chunking\n */\n injectRawCSS(\n css: string,\n options?: { root?: Document | ShadowRoot },\n ): RawCSSResult {\n const root = options?.root || document;\n return this.sheetManager.injectRawCSS(css, root);\n }\n\n /**\n * Get raw CSS text for SSR\n */\n getRawCSSText(options?: { root?: Document | ShadowRoot }): string {\n const root = options?.root || document;\n return this.sheetManager.getRawCSSText(root);\n }\n\n /**\n * Dispose of a className\n */\n private dispose(className: string, registry: RootRegistry): void {\n const currentRefCount = registry.refCounts.get(className);\n // Guard against stale double-dispose or mismatched lifecycle\n if (currentRefCount == null || currentRefCount <= 0) {\n return;\n }\n\n const newRefCount = currentRefCount - 1;\n registry.refCounts.set(className, newRefCount);\n\n if (newRefCount === 0) {\n // Update metrics\n if (registry.metrics) {\n registry.metrics.totalUnused++;\n }\n\n // Check if cleanup should be scheduled\n this.sheetManager.checkCleanupNeeded(registry);\n }\n }\n\n /**\n * Force bulk cleanup of unused styles\n */\n cleanup(root?: Document | ShadowRoot): void {\n const registry = this.sheetManager.getRegistry(root || document);\n // Clean up ALL unused rules regardless of batch ratio\n this.sheetManager.forceCleanup(registry);\n }\n\n /**\n * Get CSS text from all sheets (for SSR)\n */\n getCssText(options?: { root?: Document | ShadowRoot }): string {\n const root = options?.root || document;\n const registry = this.sheetManager.getRegistry(root);\n return this.sheetManager.getCssText(registry);\n }\n\n /**\n * Get CSS only for the provided tasty classNames (e.g., [\"t0\",\"t3\"])\n */\n getCssTextForClasses(\n classNames: Iterable<string>,\n options?: { root?: Document | ShadowRoot },\n ): string {\n const root = options?.root || document;\n const registry = this.sheetManager.getRegistry(root);\n\n const cssChunks: string[] = [];\n for (const cls of classNames) {\n const info = registry.rules.get(cls);\n if (info) {\n // Always prefer reading from the live stylesheet, since indices can change\n const sheet = registry.sheets[info.sheetIndex];\n const styleSheet = sheet?.sheet?.sheet;\n if (styleSheet) {\n const start = Math.max(0, info.ruleIndex);\n const end = Math.min(\n styleSheet.cssRules.length - 1,\n (info.endRuleIndex as number) ?? info.ruleIndex,\n );\n // Additional validation: ensure indices are valid and in correct order\n if (\n start >= 0 &&\n end >= start &&\n start < styleSheet.cssRules.length\n ) {\n for (let i = start; i <= end; i++) {\n const rule = styleSheet.cssRules[i] as CSSRule | undefined;\n if (rule) cssChunks.push(rule.cssText);\n }\n }\n } else if (info.cssText && info.cssText.length) {\n // Fallback in environments without CSSOM access\n cssChunks.push(...info.cssText);\n }\n }\n }\n return cssChunks.join('\\n');\n }\n\n /**\n * Get cache performance metrics\n */\n getMetrics(options?: { root?: Document | ShadowRoot }): CacheMetrics | null {\n const root = options?.root || document;\n const registry = this.sheetManager.getRegistry(root);\n return this.sheetManager.getMetrics(registry);\n }\n\n /**\n * Reset cache performance metrics\n */\n resetMetrics(options?: { root?: Document | ShadowRoot }): void {\n const root = options?.root || document;\n const registry = this.sheetManager.getRegistry(root);\n this.sheetManager.resetMetrics(registry);\n }\n\n /**\n * Define a CSS @property custom property.\n *\n * Accepts tasty token syntax for the property name:\n * - `$name` → defines `--name`\n * - `#name` → defines `--name-color` (auto-sets syntax: '<color>', defaults initialValue: 'transparent')\n * - `--name` → defines `--name` (legacy format)\n *\n * Example:\n * @property --rotation { syntax: \"<angle>\"; inherits: false; initial-value: 45deg; }\n *\n * Note: No caching or dispose — this defines a global property.\n *\n * If the same property is registered with different options, a warning is emitted\n * but the original definition is preserved (CSS @property cannot be redefined).\n */\n property(\n name: string,\n options?: PropertyDefinition & {\n root?: Document | ShadowRoot;\n },\n ): void {\n const root = options?.root || document;\n const registry = this.sheetManager.getRegistry(root);\n\n // Parse the token and get effective definition\n // This handles $name, #name, --name formats and auto-sets syntax for colors\n const userDefinition: PropertyDefinition = {\n syntax: options?.syntax,\n inherits: options?.inherits,\n initialValue: options?.initialValue,\n };\n\n const effectiveResult = getEffectiveDefinition(name, userDefinition);\n\n if (!effectiveResult.isValid) {\n if (isDevEnv()) {\n console.warn(\n `[Tasty] property(): ${effectiveResult.error}. Got: \"${name}\"`,\n );\n }\n return;\n }\n\n const cssName = effectiveResult.cssName;\n const definition = effectiveResult.definition;\n\n // Normalize the definition for comparison\n const normalizedDef = normalizePropertyDefinition(definition);\n\n // Check if already defined\n const existingDef = registry.injectedProperties.get(cssName);\n if (existingDef !== undefined) {\n // Property already exists - check if definitions match\n if (existingDef !== normalizedDef) {\n // Different definition - warn but don't replace (CSS @property can't be redefined)\n if (isDevEnv()) {\n console.warn(\n `[Tasty] @property ${cssName} was already defined with a different declaration. ` +\n `The new declaration will be ignored. ` +\n `Original: ${existingDef}, New: ${normalizedDef}`,\n );\n }\n }\n // Either exact match or warned - skip injection\n return;\n }\n\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 // inherits is required by the CSS @property spec - default to true\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 // Process via tasty parser to resolve custom units/functions\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\n const rule: StyleRule = {\n selector: `@property ${cssName}`,\n declarations,\n } as StyleRule;\n\n // Insert as a global rule; only mark injected when insertion succeeds\n const info = this.sheetManager.insertGlobalRule(\n registry,\n [rule],\n `property:${name}`,\n root,\n );\n\n if (!info) {\n return;\n }\n\n // Track that this property was injected with its normalized definition\n registry.injectedProperties.set(cssName, normalizedDef);\n }\n\n /**\n * Check whether a given @property name was already injected by this injector.\n *\n * Accepts tasty token syntax:\n * - `$name` → checks `--name`\n * - `#name` → checks `--name-color`\n * - `--name` → checks `--name` (legacy format)\n */\n isPropertyDefined(\n name: string,\n options?: { root?: Document | ShadowRoot },\n ): boolean {\n const root = options?.root || document;\n const registry = this.sheetManager.getRegistry(root);\n\n // Parse the token to get the CSS property name\n const effectiveResult = getEffectiveDefinition(name, {});\n if (!effectiveResult.isValid) {\n return false;\n }\n\n return registry.injectedProperties.has(effectiveResult.cssName);\n }\n\n /**\n * Inject keyframes and return object with toString() and dispose()\n *\n * Keyframes are cached by content (steps). If the same content is injected\n * multiple times with different provided names, the first injected name is reused.\n *\n * If the same name is provided with different content (collision), a unique\n * name is generated to avoid overwriting the existing keyframes.\n */\n keyframes(\n steps: KeyframesSteps,\n nameOrOptions?: string | { root?: Document | ShadowRoot; name?: string },\n ): KeyframesResult {\n // Parse parameters\n const isStringName = typeof nameOrOptions === 'string';\n const providedName = isStringName ? nameOrOptions : nameOrOptions?.name;\n const root = isStringName ? document : nameOrOptions?.root || document;\n const registry = this.sheetManager.getRegistry(root);\n\n if (Object.keys(steps).length === 0) {\n return {\n toString: () => '',\n dispose: () => {\n /* noop */\n },\n };\n }\n\n // Generate content-based cache key (independent of provided name)\n const contentHash = JSON.stringify(steps);\n\n // Check if this exact content is already cached\n const existing = registry.keyframesCache.get(contentHash);\n if (existing) {\n existing.refCount++;\n return {\n toString: () => existing.name,\n dispose: () => this.disposeKeyframes(contentHash, registry),\n };\n }\n\n // Determine the actual name to use\n let actualName: string;\n\n if (providedName) {\n // Check if this name is already used with different content\n const existingContentForName =\n registry.keyframesNameToContent.get(providedName);\n\n if (existingContentForName && existingContentForName !== contentHash) {\n // Name collision: same name, different content\n // Generate a unique name to avoid overwriting\n actualName = `${providedName}-k${registry.keyframesCounter++}`;\n } else {\n // Name is available or used with same content\n actualName = providedName;\n // Track this name -> content mapping\n registry.keyframesNameToContent.set(providedName, contentHash);\n }\n } else {\n // No name provided, generate one\n actualName = `k${registry.keyframesCounter++}`;\n }\n\n // Insert keyframes\n const result = this.sheetManager.insertKeyframes(\n registry,\n steps,\n actualName,\n root,\n );\n if (!result) {\n return {\n toString: () => '',\n dispose: () => {\n /* noop */\n },\n };\n }\n\n const { info, declarations } = result;\n\n // Auto-register @property for custom properties found in keyframe declarations\n if (this.config.autoPropertyTypes !== false && declarations) {\n const resolver = registry.propertyTypeResolver;\n resolver.scanDeclarations(\n declarations,\n (name) => registry.injectedProperties.has(name),\n (name, syntax, initialValue) => {\n this.property(name, {\n syntax,\n inherits: true,\n initialValue,\n root,\n });\n },\n );\n }\n\n // Cache the result by content hash\n registry.keyframesCache.set(contentHash, {\n name: actualName,\n refCount: 1,\n info,\n });\n\n // Update metrics\n if (registry.metrics) {\n registry.metrics.totalInsertions++;\n registry.metrics.misses++;\n }\n\n return {\n toString: () => actualName,\n dispose: () => this.disposeKeyframes(contentHash, registry),\n };\n }\n\n /**\n * Dispose keyframes\n */\n private disposeKeyframes(contentHash: string, registry: RootRegistry): void {\n const entry = registry.keyframesCache.get(contentHash);\n if (!entry) return;\n\n entry.refCount--;\n if (entry.refCount <= 0) {\n // Dispose immediately - keyframes are global and safe to clean up right away\n this.sheetManager.deleteKeyframes(registry, entry.info);\n registry.keyframesCache.delete(contentHash);\n\n // Clean up name-to-content mapping if this name was tracked\n // Find and remove the mapping for this content hash\n for (const [name, hash] of registry.keyframesNameToContent.entries()) {\n if (hash === contentHash) {\n registry.keyframesNameToContent.delete(name);\n break;\n }\n }\n\n // Update metrics\n if (registry.metrics) {\n registry.metrics.totalUnused++;\n registry.metrics.stylesCleanedUp++;\n }\n }\n }\n\n /**\n * Destroy all resources for a root\n */\n destroy(root?: Document | ShadowRoot): void {\n const targetRoot = root || document;\n this.sheetManager.cleanup(targetRoot);\n }\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"injector.js","names":[],"sources":["../../src/injector/injector.ts"],"sourcesContent":["/**\n * Style injector that works with structured style objects\n * Eliminates CSS string parsing for better performance\n */\n\nimport type { StyleResult } from '../pipeline';\nimport {\n getEffectiveDefinition,\n normalizePropertyDefinition,\n} from '../properties';\nimport { isDevEnv } from '../utils/is-dev-env';\nimport type { StyleValue } from '../utils/styles';\nimport { parseStyle } from '../utils/styles';\n\nimport { SheetManager } from './sheet-manager';\nimport type {\n CacheMetrics,\n GlobalInjectResult,\n InjectResult,\n KeyframesResult,\n KeyframesSteps,\n PropertyDefinition,\n RawCSSResult,\n RootRegistry,\n StyleInjectorConfig,\n StyleRule,\n} from './types';\n\n/**\n * Generate sequential class name with format t{number}\n */\nfunction generateClassName(counter: number): string {\n return `t${counter}`;\n}\n\nexport class StyleInjector {\n private sheetManager: SheetManager;\n private config: StyleInjectorConfig;\n private cleanupScheduled = false;\n private globalRuleCounter = 0;\n\n /** @internal — exposed for debug utilities only */\n get _sheetManager(): SheetManager {\n return this.sheetManager;\n }\n\n constructor(config: StyleInjectorConfig = {}) {\n this.config = config;\n this.sheetManager = new SheetManager(config);\n }\n\n /**\n * Allocate a className for a cacheKey without injecting styles yet.\n * This allows separating className allocation (render phase) from style injection (insertion phase).\n */\n allocateClassName(\n cacheKey: string,\n options?: { root?: Document | ShadowRoot },\n ): { className: string; isNewAllocation: boolean } {\n const root = options?.root || document;\n const registry = this.sheetManager.getRegistry(root);\n\n // Check if we can reuse existing className for this cache key\n if (registry.cacheKeyToClassName.has(cacheKey)) {\n const className = registry.cacheKeyToClassName.get(cacheKey)!;\n return {\n className,\n isNewAllocation: false,\n };\n }\n\n // Generate new className and reserve it\n const className = generateClassName(registry.classCounter++);\n\n // Create placeholder RuleInfo to reserve the className\n const placeholderRuleInfo = {\n className,\n ruleIndex: -1, // Placeholder - will be set during actual injection\n sheetIndex: -1, // Placeholder - will be set during actual injection\n };\n\n // Store RuleInfo only once by className, and map cacheKey separately\n registry.rules.set(className, placeholderRuleInfo);\n registry.cacheKeyToClassName.set(cacheKey, className);\n\n return {\n className,\n isNewAllocation: true,\n };\n }\n\n /**\n * Inject styles from StyleResult objects\n */\n inject(\n rules: StyleResult[],\n options?: { root?: Document | ShadowRoot; cacheKey?: string },\n ): InjectResult {\n const root = options?.root || document;\n const registry = this.sheetManager.getRegistry(root);\n\n if (rules.length === 0) {\n return {\n className: '',\n dispose: () => {\n /* noop */\n },\n };\n }\n\n // Rules are now in StyleRule format directly\n\n // Check if we can reuse based on cache key\n const cacheKey = options?.cacheKey;\n let className: string;\n let isPreAllocated = false;\n\n if (cacheKey && registry.cacheKeyToClassName.has(cacheKey)) {\n // Reuse existing class for this cache key\n className = registry.cacheKeyToClassName.get(cacheKey)!;\n const existingRuleInfo = registry.rules.get(className)!;\n\n // Check if this is a placeholder (pre-allocated but not yet injected)\n isPreAllocated =\n existingRuleInfo.ruleIndex === -1 && existingRuleInfo.sheetIndex === -1;\n\n if (!isPreAllocated) {\n // Already injected - just increment refCount\n const currentRefCount = registry.refCounts.get(className) || 0;\n registry.refCounts.set(className, currentRefCount + 1);\n\n // Update metrics\n if (registry.metrics) {\n registry.metrics.hits++;\n }\n\n return {\n className,\n dispose: () => this.dispose(className, registry),\n };\n }\n } else {\n // Generate new className\n className = generateClassName(registry.classCounter++);\n }\n\n // Process rules: handle needsClassName flag and apply specificity\n const rulesToInsert = rules.map((rule) => {\n let newSelector = rule.selector;\n\n // If rule needs className prepended\n if (rule.needsClassName) {\n // Handle multiple selectors (separated by ||| for OR conditions)\n const selectorParts = newSelector ? newSelector.split('|||') : [''];\n\n const classPrefix = `.${className}.${className}`;\n\n newSelector = selectorParts\n .map((part) => {\n const classSelector = part ? `${classPrefix}${part}` : classPrefix;\n\n // If there's a root prefix, add it before the class selector\n if (rule.rootPrefix) {\n return `${rule.rootPrefix} ${classSelector}`;\n }\n return classSelector;\n })\n .join(', ');\n }\n\n return {\n ...rule,\n selector: newSelector,\n needsClassName: undefined, // Remove the flag after processing\n rootPrefix: undefined, // Remove rootPrefix after processing\n };\n });\n\n // Auto-register @property for custom properties with inferable types.\n // Colors are detected by --*-color name pattern, numeric types by value.\n if (this.config.autoPropertyTypes !== false) {\n const resolver = registry.propertyTypeResolver;\n const defined = registry.injectedProperties;\n for (const rule of rulesToInsert) {\n if (!rule.declarations) continue;\n resolver.scanDeclarations(\n rule.declarations,\n (name) => defined.has(name),\n (name, syntax, initialValue) => {\n this.property(name, {\n syntax,\n inherits: true,\n initialValue,\n root,\n });\n },\n );\n }\n }\n\n // Insert rules using existing sheet manager\n const ruleInfo = this.sheetManager.insertRule(\n registry,\n rulesToInsert,\n className,\n root,\n );\n\n if (!ruleInfo) {\n // Update metrics\n if (registry.metrics) {\n registry.metrics.misses++;\n }\n\n return {\n className,\n dispose: () => {\n /* noop */\n },\n };\n }\n\n // Store in registry\n registry.refCounts.set(className, 1);\n\n if (isPreAllocated) {\n // Update the existing placeholder entry with real rule info\n registry.rules.set(className, ruleInfo);\n // cacheKey mapping already exists from allocation\n } else {\n // Store new entries\n registry.rules.set(className, ruleInfo);\n if (cacheKey) {\n registry.cacheKeyToClassName.set(cacheKey, className);\n }\n }\n\n // Update metrics\n if (registry.metrics) {\n registry.metrics.totalInsertions++;\n registry.metrics.misses++;\n }\n\n return {\n className,\n dispose: () => this.dispose(className, registry),\n };\n }\n\n /**\n * Inject global styles (rules without a generated tasty class selector)\n * This ensures we don't reserve a tasty class name (t{number}) for global rules,\n * which could otherwise collide with element-level styles and break lookups.\n */\n injectGlobal(\n rules: StyleResult[],\n options?: { root?: Document | ShadowRoot },\n ): GlobalInjectResult {\n const root = options?.root || document;\n const registry = this.sheetManager.getRegistry(root);\n\n if (!rules || rules.length === 0) {\n return {\n dispose: () => {\n /* noop */\n },\n };\n }\n\n // Auto-register @property for custom properties in global rules\n if (this.config.autoPropertyTypes !== false) {\n const resolver = registry.propertyTypeResolver;\n const defined = registry.injectedProperties;\n for (const rule of rules) {\n if (!rule.declarations) continue;\n resolver.scanDeclarations(\n rule.declarations,\n (name) => defined.has(name),\n (name, syntax, initialValue) => {\n this.property(name, {\n syntax,\n inherits: true,\n initialValue,\n root,\n });\n },\n );\n }\n }\n\n // Use a non-tasty identifier to avoid any collisions with .t{number} classes\n const key = `global:${this.globalRuleCounter++}`;\n\n const info = this.sheetManager.insertGlobalRule(\n registry,\n rules as unknown as StyleRule[],\n key,\n root,\n );\n\n if (registry.metrics) {\n registry.metrics.totalInsertions++;\n }\n\n return {\n dispose: () => {\n if (info) this.sheetManager.deleteGlobalRule(registry, key);\n },\n };\n }\n\n /**\n * Inject raw CSS text directly without parsing\n * This is a low-overhead alternative to createGlobalStyle for raw CSS\n * The CSS is inserted into a separate style element to avoid conflicts with tasty's chunking\n */\n injectRawCSS(\n css: string,\n options?: { root?: Document | ShadowRoot },\n ): RawCSSResult {\n const root = options?.root || document;\n return this.sheetManager.injectRawCSS(css, root);\n }\n\n /**\n * Get raw CSS text for SSR\n */\n getRawCSSText(options?: { root?: Document | ShadowRoot }): string {\n const root = options?.root || document;\n return this.sheetManager.getRawCSSText(root);\n }\n\n /**\n * Increment refCount for an already-injected cacheKey and return a dispose.\n * Used by useStyles on cache hits (hydration or runtime reuse) where\n * the pipeline was skipped but refCount tracking is still needed.\n * Returns null if the cacheKey is not found.\n */\n trackRef(\n cacheKey: string,\n options?: { root?: Document | ShadowRoot },\n ): InjectResult | null {\n const root = options?.root || document;\n const registry = this.sheetManager.getRegistry(root);\n\n if (!registry.cacheKeyToClassName.has(cacheKey)) return null;\n\n const className = registry.cacheKeyToClassName.get(cacheKey)!;\n const currentRefCount = registry.refCounts.get(className) || 0;\n registry.refCounts.set(className, currentRefCount + 1);\n\n if (registry.metrics) {\n registry.metrics.hits++;\n }\n\n return {\n className,\n dispose: () => this.dispose(className, registry),\n };\n }\n\n /**\n * Dispose of a className\n */\n private dispose(className: string, registry: RootRegistry): void {\n const currentRefCount = registry.refCounts.get(className);\n // Guard against stale double-dispose or mismatched lifecycle\n if (currentRefCount == null || currentRefCount <= 0) {\n return;\n }\n\n const newRefCount = currentRefCount - 1;\n registry.refCounts.set(className, newRefCount);\n\n if (newRefCount === 0) {\n // Update metrics\n if (registry.metrics) {\n registry.metrics.totalUnused++;\n }\n\n // Check if cleanup should be scheduled\n this.sheetManager.checkCleanupNeeded(registry);\n }\n }\n\n /**\n * Force bulk cleanup of unused styles\n */\n cleanup(root?: Document | ShadowRoot): void {\n const registry = this.sheetManager.getRegistry(root || document);\n // Clean up ALL unused rules regardless of batch ratio\n this.sheetManager.forceCleanup(registry);\n }\n\n /**\n * Get CSS text from all sheets (for SSR)\n */\n getCssText(options?: { root?: Document | ShadowRoot }): string {\n const root = options?.root || document;\n const registry = this.sheetManager.getRegistry(root);\n return this.sheetManager.getCssText(registry);\n }\n\n /**\n * Get CSS only for the provided tasty classNames (e.g., [\"t0\",\"t3\"])\n */\n getCssTextForClasses(\n classNames: Iterable<string>,\n options?: { root?: Document | ShadowRoot },\n ): string {\n const root = options?.root || document;\n const registry = this.sheetManager.getRegistry(root);\n\n const cssChunks: string[] = [];\n for (const cls of classNames) {\n const info = registry.rules.get(cls);\n if (info) {\n // Always prefer reading from the live stylesheet, since indices can change\n const sheet = registry.sheets[info.sheetIndex];\n const styleSheet = sheet?.sheet?.sheet;\n if (styleSheet) {\n const start = Math.max(0, info.ruleIndex);\n const end = Math.min(\n styleSheet.cssRules.length - 1,\n (info.endRuleIndex as number) ?? info.ruleIndex,\n );\n // Additional validation: ensure indices are valid and in correct order\n if (\n start >= 0 &&\n end >= start &&\n start < styleSheet.cssRules.length\n ) {\n for (let i = start; i <= end; i++) {\n const rule = styleSheet.cssRules[i] as CSSRule | undefined;\n if (rule) cssChunks.push(rule.cssText);\n }\n }\n } else if (info.cssText && info.cssText.length) {\n // Fallback in environments without CSSOM access\n cssChunks.push(...info.cssText);\n }\n }\n }\n return cssChunks.join('\\n');\n }\n\n /**\n * Get cache performance metrics\n */\n getMetrics(options?: { root?: Document | ShadowRoot }): CacheMetrics | null {\n const root = options?.root || document;\n const registry = this.sheetManager.getRegistry(root);\n return this.sheetManager.getMetrics(registry);\n }\n\n /**\n * Reset cache performance metrics\n */\n resetMetrics(options?: { root?: Document | ShadowRoot }): void {\n const root = options?.root || document;\n const registry = this.sheetManager.getRegistry(root);\n this.sheetManager.resetMetrics(registry);\n }\n\n /**\n * Define a CSS @property custom property.\n *\n * Accepts tasty token syntax for the property name:\n * - `$name` → defines `--name`\n * - `#name` → defines `--name-color` (auto-sets syntax: '<color>', defaults initialValue: 'transparent')\n * - `--name` → defines `--name` (legacy format)\n *\n * Example:\n * @property --rotation { syntax: \"<angle>\"; inherits: false; initial-value: 45deg; }\n *\n * Note: No caching or dispose — this defines a global property.\n *\n * If the same property is registered with different options, a warning is emitted\n * but the original definition is preserved (CSS @property cannot be redefined).\n */\n property(\n name: string,\n options?: PropertyDefinition & {\n root?: Document | ShadowRoot;\n },\n ): void {\n const root = options?.root || document;\n const registry = this.sheetManager.getRegistry(root);\n\n // Parse the token and get effective definition\n // This handles $name, #name, --name formats and auto-sets syntax for colors\n const userDefinition: PropertyDefinition = {\n syntax: options?.syntax,\n inherits: options?.inherits,\n initialValue: options?.initialValue,\n };\n\n const effectiveResult = getEffectiveDefinition(name, userDefinition);\n\n if (!effectiveResult.isValid) {\n if (isDevEnv()) {\n console.warn(\n `[Tasty] property(): ${effectiveResult.error}. Got: \"${name}\"`,\n );\n }\n return;\n }\n\n const cssName = effectiveResult.cssName;\n const definition = effectiveResult.definition;\n\n // Normalize the definition for comparison\n const normalizedDef = normalizePropertyDefinition(definition);\n\n // Check if already defined\n const existingDef = registry.injectedProperties.get(cssName);\n if (existingDef !== undefined) {\n // Property already exists - check if definitions match\n if (existingDef !== normalizedDef) {\n if (isDevEnv()) {\n console.debug(\n `[Tasty] @property ${cssName} was already defined with a different declaration. ` +\n `The new declaration will be ignored.`,\n );\n }\n }\n // Either exact match or warned - skip injection\n return;\n }\n\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 // inherits is required by the CSS @property spec - default to true\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 // Process via tasty parser to resolve custom units/functions\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\n const rule: StyleRule = {\n selector: `@property ${cssName}`,\n declarations,\n } as StyleRule;\n\n // Insert as a global rule; only mark injected when insertion succeeds\n const info = this.sheetManager.insertGlobalRule(\n registry,\n [rule],\n `property:${name}`,\n root,\n );\n\n if (!info) {\n return;\n }\n\n // Track that this property was injected with its normalized definition\n registry.injectedProperties.set(cssName, normalizedDef);\n }\n\n /**\n * Check whether a given @property name was already injected by this injector.\n *\n * Accepts tasty token syntax:\n * - `$name` → checks `--name`\n * - `#name` → checks `--name-color`\n * - `--name` → checks `--name` (legacy format)\n */\n isPropertyDefined(\n name: string,\n options?: { root?: Document | ShadowRoot },\n ): boolean {\n const root = options?.root || document;\n const registry = this.sheetManager.getRegistry(root);\n\n // Parse the token to get the CSS property name\n const effectiveResult = getEffectiveDefinition(name, {});\n if (!effectiveResult.isValid) {\n return false;\n }\n\n return registry.injectedProperties.has(effectiveResult.cssName);\n }\n\n /**\n * Inject keyframes and return object with toString() and dispose()\n *\n * Keyframes are cached by content (steps). If the same content is injected\n * multiple times with different provided names, the first injected name is reused.\n *\n * If the same name is provided with different content (collision), a unique\n * name is generated to avoid overwriting the existing keyframes.\n */\n keyframes(\n steps: KeyframesSteps,\n nameOrOptions?: string | { root?: Document | ShadowRoot; name?: string },\n ): KeyframesResult {\n // Parse parameters\n const isStringName = typeof nameOrOptions === 'string';\n const providedName = isStringName ? nameOrOptions : nameOrOptions?.name;\n const root = isStringName ? document : nameOrOptions?.root || document;\n const registry = this.sheetManager.getRegistry(root);\n\n if (Object.keys(steps).length === 0) {\n return {\n toString: () => '',\n dispose: () => {\n /* noop */\n },\n };\n }\n\n // Generate content-based cache key (independent of provided name)\n const contentHash = JSON.stringify(steps);\n\n // Check if this exact content is already cached\n const existing = registry.keyframesCache.get(contentHash);\n if (existing) {\n existing.refCount++;\n return {\n toString: () => existing.name,\n dispose: () => this.disposeKeyframes(contentHash, registry),\n };\n }\n\n // Determine the actual name to use\n let actualName: string;\n\n if (providedName) {\n // Check if this name is already used with different content\n const existingContentForName =\n registry.keyframesNameToContent.get(providedName);\n\n if (existingContentForName && existingContentForName !== contentHash) {\n // Name collision: same name, different content\n // Generate a unique name to avoid overwriting\n actualName = `${providedName}-k${registry.keyframesCounter++}`;\n } else {\n // Name is available or used with same content\n actualName = providedName;\n // Track this name -> content mapping\n registry.keyframesNameToContent.set(providedName, contentHash);\n }\n } else {\n // No name provided, generate one\n actualName = `k${registry.keyframesCounter++}`;\n }\n\n // Insert keyframes\n const result = this.sheetManager.insertKeyframes(\n registry,\n steps,\n actualName,\n root,\n );\n if (!result) {\n return {\n toString: () => '',\n dispose: () => {\n /* noop */\n },\n };\n }\n\n const { info, declarations } = result;\n\n // Auto-register @property for custom properties found in keyframe declarations\n if (this.config.autoPropertyTypes !== false && declarations) {\n const resolver = registry.propertyTypeResolver;\n resolver.scanDeclarations(\n declarations,\n (name) => registry.injectedProperties.has(name),\n (name, syntax, initialValue) => {\n this.property(name, {\n syntax,\n inherits: true,\n initialValue,\n root,\n });\n },\n );\n }\n\n // Cache the result by content hash\n registry.keyframesCache.set(contentHash, {\n name: actualName,\n refCount: 1,\n info,\n });\n\n // Update metrics\n if (registry.metrics) {\n registry.metrics.totalInsertions++;\n registry.metrics.misses++;\n }\n\n return {\n toString: () => actualName,\n dispose: () => this.disposeKeyframes(contentHash, registry),\n };\n }\n\n /**\n * Dispose keyframes\n */\n private disposeKeyframes(contentHash: string, registry: RootRegistry): void {\n const entry = registry.keyframesCache.get(contentHash);\n if (!entry) return;\n\n entry.refCount--;\n if (entry.refCount <= 0) {\n // Dispose immediately - keyframes are global and safe to clean up right away\n this.sheetManager.deleteKeyframes(registry, entry.info);\n registry.keyframesCache.delete(contentHash);\n\n // Clean up name-to-content mapping if this name was tracked\n // Find and remove the mapping for this content hash\n for (const [name, hash] of registry.keyframesNameToContent.entries()) {\n if (hash === contentHash) {\n registry.keyframesNameToContent.delete(name);\n break;\n }\n }\n\n // Update metrics\n if (registry.metrics) {\n registry.metrics.totalUnused++;\n registry.metrics.stylesCleanedUp++;\n }\n }\n }\n\n /**\n * Destroy all resources for a root\n */\n destroy(root?: Document | ShadowRoot): void {\n const targetRoot = root || document;\n this.sheetManager.cleanup(targetRoot);\n }\n}\n"],"mappings":"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"}