@tenphi/tasty 1.1.0 → 1.3.0
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.
- package/dist/_virtual/_rolldown/runtime.js +1 -2
- package/dist/chunks/cacheKey.d.ts +1 -0
- package/dist/chunks/cacheKey.js +1 -2
- package/dist/chunks/cacheKey.js.map +1 -1
- package/dist/chunks/definitions.js +1 -2
- package/dist/chunks/definitions.js.map +1 -1
- package/dist/chunks/index.d.ts +1 -0
- package/dist/chunks/renderChunk.d.ts +1 -0
- package/dist/chunks/renderChunk.js +1 -2
- package/dist/chunks/renderChunk.js.map +1 -1
- package/dist/compute-styles.d.ts +31 -0
- package/dist/compute-styles.js +356 -0
- package/dist/compute-styles.js.map +1 -0
- package/dist/config.d.ts +7 -1
- package/dist/config.js +25 -22
- package/dist/config.js.map +1 -1
- package/dist/core/index.d.ts +4 -4
- package/dist/core/index.js +6 -6
- package/dist/counter-style/index.js +1 -1
- package/dist/counter-style/index.js.map +1 -1
- package/dist/debug.js +1 -2
- package/dist/debug.js.map +1 -1
- package/dist/font-face/index.js +1 -1
- package/dist/font-face/index.js.map +1 -1
- package/dist/hooks/index.d.ts +7 -0
- package/dist/hooks/resolve-ssr-collector.js +1 -2
- package/dist/hooks/resolve-ssr-collector.js.map +1 -1
- package/dist/hooks/useCounterStyle.js +2 -3
- package/dist/hooks/useCounterStyle.js.map +1 -1
- package/dist/hooks/useFontFace.js +2 -3
- package/dist/hooks/useFontFace.js.map +1 -1
- package/dist/hooks/useGlobalStyles.js +4 -5
- package/dist/hooks/useGlobalStyles.js.map +1 -1
- package/dist/hooks/useKeyframes.js +3 -4
- package/dist/hooks/useKeyframes.js.map +1 -1
- package/dist/hooks/useProperty.js +2 -3
- package/dist/hooks/useProperty.js.map +1 -1
- package/dist/hooks/useRawCSS.js +2 -3
- package/dist/hooks/useRawCSS.js.map +1 -1
- package/dist/hooks/useStyles.d.ts +3 -8
- package/dist/hooks/useStyles.js +7 -214
- package/dist/hooks/useStyles.js.map +1 -1
- package/dist/index.d.ts +5 -5
- package/dist/index.js +7 -7
- package/dist/injector/index.d.ts +1 -18
- package/dist/injector/index.js +5 -19
- package/dist/injector/index.js.map +1 -1
- package/dist/injector/injector.js +1 -2
- package/dist/injector/injector.js.map +1 -1
- package/dist/injector/sheet-manager.js +1 -2
- package/dist/injector/sheet-manager.js.map +1 -1
- package/dist/keyframes/index.js +1 -1
- package/dist/parser/classify.js +1 -2
- package/dist/parser/classify.js.map +1 -1
- package/dist/parser/const.js +14 -3
- package/dist/parser/const.js.map +1 -1
- package/dist/parser/lru.js +1 -1
- package/dist/parser/lru.js.map +1 -1
- package/dist/parser/parser.js +1 -2
- package/dist/parser/parser.js.map +1 -1
- package/dist/parser/tokenizer.js +1 -1
- package/dist/parser/tokenizer.js.map +1 -1
- package/dist/parser/types.js +1 -1
- package/dist/parser/types.js.map +1 -1
- package/dist/pipeline/conditions.js +1 -1
- package/dist/pipeline/conditions.js.map +1 -1
- package/dist/pipeline/exclusive.js +1 -2
- package/dist/pipeline/exclusive.js.map +1 -1
- package/dist/pipeline/index.js +2 -3
- package/dist/pipeline/index.js.map +1 -1
- package/dist/pipeline/materialize.js +1 -2
- package/dist/pipeline/materialize.js.map +1 -1
- package/dist/pipeline/parseStateKey.js +1 -2
- package/dist/pipeline/parseStateKey.js.map +1 -1
- package/dist/pipeline/simplify.js +1 -2
- package/dist/pipeline/simplify.js.map +1 -1
- package/dist/pipeline/warnings.js +1 -1
- package/dist/plugins/index.d.ts +2 -0
- package/dist/plugins/okhsl-plugin.js +1 -2
- package/dist/plugins/okhsl-plugin.js.map +1 -1
- package/dist/properties/index.js +2 -3
- package/dist/properties/index.js.map +1 -1
- package/dist/properties/property-type-resolver.js +1 -2
- package/dist/properties/property-type-resolver.js.map +1 -1
- package/dist/ssr/astro.js +1 -2
- package/dist/ssr/astro.js.map +1 -1
- package/dist/ssr/async-storage.js +1 -2
- package/dist/ssr/async-storage.js.map +1 -1
- package/dist/ssr/collect-auto-properties.js +1 -2
- package/dist/ssr/collect-auto-properties.js.map +1 -1
- package/dist/ssr/collector.js +4 -12
- package/dist/ssr/collector.js.map +1 -1
- package/dist/ssr/context.d.ts +2 -2
- package/dist/ssr/context.js +1 -2
- package/dist/ssr/context.js.map +1 -1
- package/dist/ssr/format-global-rules.js +1 -1
- package/dist/ssr/format-keyframes.js +1 -2
- package/dist/ssr/format-keyframes.js.map +1 -1
- package/dist/ssr/format-property.js +1 -2
- package/dist/ssr/format-property.js.map +1 -1
- package/dist/ssr/format-rules.js +1 -1
- package/dist/ssr/hydrate.js +1 -2
- package/dist/ssr/hydrate.js.map +1 -1
- package/dist/ssr/index.js +1 -2
- package/dist/ssr/index.js.map +1 -1
- package/dist/ssr/next.d.ts +2 -2
- package/dist/ssr/next.js +9 -5
- package/dist/ssr/next.js.map +1 -1
- package/dist/ssr/ssr-collector-ref.js +1 -1
- package/dist/states/index.js +1 -2
- package/dist/states/index.js.map +1 -1
- package/dist/static/index.js +1 -2
- package/dist/static/inject.d.ts +5 -0
- package/dist/static/inject.js +17 -0
- package/dist/static/inject.js.map +1 -0
- package/dist/static/tastyStatic.js +1 -2
- package/dist/static/tastyStatic.js.map +1 -1
- package/dist/static/types.js +1 -1
- package/dist/styles/border.d.ts +1 -1
- package/dist/styles/border.js +28 -22
- package/dist/styles/border.js.map +1 -1
- package/dist/styles/color.d.ts +1 -1
- package/dist/styles/color.js +2 -3
- package/dist/styles/color.js.map +1 -1
- package/dist/styles/const.js +17 -0
- package/dist/styles/const.js.map +1 -0
- package/dist/styles/createStyle.js +4 -5
- package/dist/styles/createStyle.js.map +1 -1
- package/dist/styles/dimension.js +15 -3
- package/dist/styles/dimension.js.map +1 -1
- package/dist/styles/directional.js +133 -0
- package/dist/styles/directional.js.map +1 -0
- package/dist/styles/display.d.ts +3 -10
- package/dist/styles/display.js +45 -39
- package/dist/styles/display.js.map +1 -1
- package/dist/styles/fade.d.ts +1 -1
- package/dist/styles/fade.js +9 -5
- package/dist/styles/fade.js.map +1 -1
- package/dist/styles/fill.d.ts +2 -2
- package/dist/styles/fill.js +3 -4
- package/dist/styles/fill.js.map +1 -1
- package/dist/styles/flow.js +1 -1
- package/dist/styles/gap.d.ts +1 -1
- package/dist/styles/gap.js +4 -3
- package/dist/styles/gap.js.map +1 -1
- package/dist/styles/height.d.ts +1 -1
- package/dist/styles/height.js +1 -2
- package/dist/styles/height.js.map +1 -1
- package/dist/styles/index.d.ts +0 -1
- package/dist/styles/index.js +3 -4
- package/dist/styles/index.js.map +1 -1
- package/dist/styles/inset.d.ts +1 -29
- package/dist/styles/inset.js +19 -135
- package/dist/styles/inset.js.map +1 -1
- package/dist/styles/list.d.ts +5 -5
- package/dist/styles/list.js +4 -2
- package/dist/styles/list.js.map +1 -1
- package/dist/styles/margin.d.ts +1 -1
- package/dist/styles/margin.js +17 -89
- package/dist/styles/margin.js.map +1 -1
- package/dist/styles/outline.d.ts +1 -1
- package/dist/styles/outline.js +6 -16
- package/dist/styles/outline.js.map +1 -1
- package/dist/styles/padding.d.ts +1 -1
- package/dist/styles/padding.js +17 -89
- package/dist/styles/padding.js.map +1 -1
- package/dist/styles/placement.d.ts +37 -0
- package/dist/styles/placement.js +74 -0
- package/dist/styles/placement.js.map +1 -0
- package/dist/styles/predefined.d.ts +4 -4
- package/dist/styles/predefined.js +8 -9
- package/dist/styles/predefined.js.map +1 -1
- package/dist/styles/preset.d.ts +1 -1
- package/dist/styles/preset.js +7 -7
- package/dist/styles/preset.js.map +1 -1
- package/dist/styles/radius.d.ts +1 -3
- package/dist/styles/radius.js +38 -6
- package/dist/styles/radius.js.map +1 -1
- package/dist/styles/scrollMargin.d.ts +24 -0
- package/dist/styles/scrollMargin.js +32 -0
- package/dist/styles/scrollMargin.js.map +1 -0
- package/dist/styles/scrollbar.d.ts +1 -1
- package/dist/styles/scrollbar.js +8 -5
- package/dist/styles/scrollbar.js.map +1 -1
- package/dist/styles/shadow.d.ts +1 -1
- package/dist/styles/shadow.js +4 -3
- package/dist/styles/shadow.js.map +1 -1
- package/dist/styles/shared.js +17 -0
- package/dist/styles/shared.js.map +1 -0
- package/dist/styles/transition.d.ts +1 -1
- package/dist/styles/transition.js +5 -4
- package/dist/styles/transition.js.map +1 -1
- package/dist/styles/types.d.ts +24 -7
- package/dist/styles/width.d.ts +1 -1
- package/dist/styles/width.js +1 -2
- package/dist/styles/width.js.map +1 -1
- package/dist/tasty.d.ts +29 -14
- package/dist/tasty.js +70 -62
- package/dist/tasty.js.map +1 -1
- package/dist/utils/cache-wrapper.js +1 -2
- package/dist/utils/cache-wrapper.js.map +1 -1
- package/dist/utils/case-converter.js +1 -1
- package/dist/utils/color-math.js +1 -1
- package/dist/utils/color-math.js.map +1 -1
- package/dist/utils/color-space.js +1 -2
- package/dist/utils/color-space.js.map +1 -1
- package/dist/utils/colors.js +1 -2
- package/dist/utils/colors.js.map +1 -1
- package/dist/utils/dotize.js +1 -1
- package/dist/utils/dotize.js.map +1 -1
- package/dist/utils/filter-base-props.js +1 -1
- package/dist/utils/get-display-name.js +1 -1
- package/dist/utils/has-keys.js +1 -1
- package/dist/utils/is-dev-env.js +1 -1
- package/dist/utils/is-dev-env.js.map +1 -1
- package/dist/utils/is-valid-element-type.js +1 -1
- package/dist/utils/merge-styles.js +1 -2
- package/dist/utils/merge-styles.js.map +1 -1
- package/dist/utils/mod-attrs.d.ts +0 -2
- package/dist/utils/mod-attrs.js +1 -2
- package/dist/utils/mod-attrs.js.map +1 -1
- package/dist/utils/process-tokens.d.ts +1 -5
- package/dist/utils/process-tokens.js +3 -11
- package/dist/utils/process-tokens.js.map +1 -1
- package/dist/utils/resolve-recipes.js +1 -2
- package/dist/utils/resolve-recipes.js.map +1 -1
- package/dist/utils/selector-transform.js +1 -1
- package/dist/utils/string.js +1 -1
- package/dist/utils/styles.d.ts +1 -1
- package/dist/utils/styles.js +2 -3
- package/dist/utils/styles.js.map +1 -1
- package/dist/utils/typography.js +1 -1
- package/dist/utils/typography.js.map +1 -1
- package/dist/utils/warnings.js +1 -1
- package/dist/zero/babel.d.ts +17 -2
- package/dist/zero/babel.js +105 -41
- package/dist/zero/babel.js.map +1 -1
- package/dist/zero/css-writer.js +1 -2
- package/dist/zero/css-writer.js.map +1 -1
- package/dist/zero/extractor.js +1 -2
- package/dist/zero/extractor.js.map +1 -1
- package/dist/zero/index.js +1 -2
- package/dist/zero/next.d.ts +12 -0
- package/dist/zero/next.js +5 -4
- package/dist/zero/next.js.map +1 -1
- package/docs/methodology.md +50 -1
- package/docs/runtime.md +90 -3
- package/docs/ssr.md +10 -10
- package/docs/styles.md +17 -0
- package/docs/tasty-static.md +87 -0
- package/package.json +12 -7
- package/dist/styles/align.d.ts +0 -15
- package/dist/styles/align.js +0 -14
- package/dist/styles/align.js.map +0 -1
- package/dist/styles/justify.d.ts +0 -15
- package/dist/styles/justify.js +0 -14
- package/dist/styles/justify.js.map +0 -1
package/dist/ssr/astro.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"astro.js","names":[],"sources":["../../src/ssr/astro.ts"],"sourcesContent":["/**\n * Astro integration for Tasty SSR.\n *\n * Provides tastyMiddleware() for Astro's middleware system.\n * The middleware wraps request handling in a ServerStyleCollector\n * via AsyncLocalStorage, then injects collected CSS into </head>.\n *\n * Import from '@tenphi/tasty/ssr/astro'.\n */\n\nimport { getConfig } from '../config';\nimport { getSSRCollector, runWithCollector } from './async-storage';\nimport { ServerStyleCollector } from './collector';\nimport { hydrateTastyCache } from './hydrate';\nimport { registerSSRCollectorGetter } from './ssr-collector-ref';\n\n// Wire up ALS-based collector discovery so useStyles can find\n// the collector set by tastyMiddleware's runWithCollector().\nregisterSSRCollectorGetter(getSSRCollector);\n\n// Re-export for convenience\nexport { hydrateTastyCache };\n\nexport interface TastyMiddlewareOptions {\n /**\n * Whether to embed the cache state script for client hydration.\n * Set to false to skip cache transfer. Default: true.\n */\n transferCache?: boolean;\n}\n\n/**\n * Create an Astro middleware that collects Tasty styles during SSR.\n *\n * All React components rendered during the request (both static\n * and islands) will have their useStyles() calls captured by the\n * collector via AsyncLocalStorage. After rendering, the middleware\n * injects the collected CSS into </head>.\n *\n * @example\n * ```ts\n * // src/middleware.ts\n * import { tastyMiddleware } from '@tenphi/tasty/ssr/astro';\n * export const onRequest = tastyMiddleware();\n * ```\n */\nexport function tastyMiddleware(options?: TastyMiddlewareOptions) {\n const { transferCache = true } = options ?? {};\n\n return async (\n _context: unknown,\n next: () => Promise<Response>,\n ): Promise<Response> => {\n const collector = new ServerStyleCollector();\n\n const response = await runWithCollector(collector, () => next());\n\n const css = collector.getCSS();\n if (!css) return response;\n\n const nonce = getConfig().nonce;\n const nonceAttr = nonce ? ` nonce=\"${nonce}\"` : '';\n const html = await response.text();\n const styleTag = `<style data-tasty-ssr${nonceAttr}>${css}</style>`;\n\n let cacheTag = '';\n if (transferCache) {\n const cacheState = collector.getCacheState();\n const hasHydratableStyles = Object.keys(cacheState.entries).length > 0;\n if (hasHydratableStyles) {\n cacheTag = `<script data-tasty-cache type=\"application/json\"${nonceAttr}>${JSON.stringify(cacheState)}</script>`;\n }\n }\n\n const modifiedHtml = html.replace(\n '</head>',\n `${styleTag}${cacheTag}</head>`,\n );\n\n return new Response(modifiedHtml, {\n status: response.status,\n headers: response.headers,\n });\n };\n}\n\n// Client-side auto-hydration.\n// When imported in the browser, reads the cache state from the DOM\n// and pre-populates the injector before any island hydrates.\nif (typeof window !== 'undefined') {\n const script = document.querySelector('script[data-tasty-cache]');\n if (script) {\n try {\n const state = JSON.parse(script.textContent!);\n hydrateTastyCache(state);\n } catch {\n // Ignore malformed cache state\n }\n }\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"astro.js","names":[],"sources":["../../src/ssr/astro.ts"],"sourcesContent":["/**\n * Astro integration for Tasty SSR.\n *\n * Provides tastyMiddleware() for Astro's middleware system.\n * The middleware wraps request handling in a ServerStyleCollector\n * via AsyncLocalStorage, then injects collected CSS into </head>.\n *\n * Import from '@tenphi/tasty/ssr/astro'.\n */\n\nimport { getConfig } from '../config';\nimport { getSSRCollector, runWithCollector } from './async-storage';\nimport { ServerStyleCollector } from './collector';\nimport { hydrateTastyCache } from './hydrate';\nimport { registerSSRCollectorGetter } from './ssr-collector-ref';\n\n// Wire up ALS-based collector discovery so useStyles can find\n// the collector set by tastyMiddleware's runWithCollector().\nregisterSSRCollectorGetter(getSSRCollector);\n\n// Re-export for convenience\nexport { hydrateTastyCache };\n\nexport interface TastyMiddlewareOptions {\n /**\n * Whether to embed the cache state script for client hydration.\n * Set to false to skip cache transfer. Default: true.\n */\n transferCache?: boolean;\n}\n\n/**\n * Create an Astro middleware that collects Tasty styles during SSR.\n *\n * All React components rendered during the request (both static\n * and islands) will have their useStyles() calls captured by the\n * collector via AsyncLocalStorage. After rendering, the middleware\n * injects the collected CSS into </head>.\n *\n * @example\n * ```ts\n * // src/middleware.ts\n * import { tastyMiddleware } from '@tenphi/tasty/ssr/astro';\n * export const onRequest = tastyMiddleware();\n * ```\n */\nexport function tastyMiddleware(options?: TastyMiddlewareOptions) {\n const { transferCache = true } = options ?? {};\n\n return async (\n _context: unknown,\n next: () => Promise<Response>,\n ): Promise<Response> => {\n const collector = new ServerStyleCollector();\n\n const response = await runWithCollector(collector, () => next());\n\n const css = collector.getCSS();\n if (!css) return response;\n\n const nonce = getConfig().nonce;\n const nonceAttr = nonce ? ` nonce=\"${nonce}\"` : '';\n const html = await response.text();\n const styleTag = `<style data-tasty-ssr${nonceAttr}>${css}</style>`;\n\n let cacheTag = '';\n if (transferCache) {\n const cacheState = collector.getCacheState();\n const hasHydratableStyles = Object.keys(cacheState.entries).length > 0;\n if (hasHydratableStyles) {\n cacheTag = `<script data-tasty-cache type=\"application/json\"${nonceAttr}>${JSON.stringify(cacheState)}</script>`;\n }\n }\n\n const modifiedHtml = html.replace(\n '</head>',\n `${styleTag}${cacheTag}</head>`,\n );\n\n return new Response(modifiedHtml, {\n status: response.status,\n headers: response.headers,\n });\n };\n}\n\n// Client-side auto-hydration.\n// When imported in the browser, reads the cache state from the DOM\n// and pre-populates the injector before any island hydrates.\nif (typeof window !== 'undefined') {\n const script = document.querySelector('script[data-tasty-cache]');\n if (script) {\n try {\n const state = JSON.parse(script.textContent!);\n hydrateTastyCache(state);\n } catch {\n // Ignore malformed cache state\n }\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;AAkBA,2BAA2B,gBAAgB;;;;;;;;;;;;;;;;AA4B3C,SAAgB,gBAAgB,SAAkC;CAChE,MAAM,EAAE,gBAAgB,SAAS,WAAW,EAAE;AAE9C,QAAO,OACL,UACA,SACsB;EACtB,MAAM,YAAY,IAAI,sBAAsB;EAE5C,MAAM,WAAW,MAAM,iBAAiB,iBAAiB,MAAM,CAAC;EAEhE,MAAM,MAAM,UAAU,QAAQ;AAC9B,MAAI,CAAC,IAAK,QAAO;EAEjB,MAAM,QAAQ,WAAW,CAAC;EAC1B,MAAM,YAAY,QAAQ,WAAW,MAAM,KAAK;EAChD,MAAM,OAAO,MAAM,SAAS,MAAM;EAClC,MAAM,WAAW,wBAAwB,UAAU,GAAG,IAAI;EAE1D,IAAI,WAAW;AACf,MAAI,eAAe;GACjB,MAAM,aAAa,UAAU,eAAe;AAE5C,OAD4B,OAAO,KAAK,WAAW,QAAQ,CAAC,SAAS,EAEnE,YAAW,mDAAmD,UAAU,GAAG,KAAK,UAAU,WAAW,CAAC;;EAI1G,MAAM,eAAe,KAAK,QACxB,WACA,GAAG,WAAW,SAAS,SACxB;AAED,SAAO,IAAI,SAAS,cAAc;GAChC,QAAQ,SAAS;GACjB,SAAS,SAAS;GACnB,CAAC;;;AAON,IAAI,OAAO,WAAW,aAAa;CACjC,MAAM,SAAS,SAAS,cAAc,2BAA2B;AACjE,KAAI,OACF,KAAI;AAEF,oBADc,KAAK,MAAM,OAAO,YAAa,CACrB;SAClB"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { AsyncLocalStorage } from "node:async_hooks";
|
|
2
|
-
|
|
3
2
|
//#region src/ssr/async-storage.ts
|
|
4
3
|
/**
|
|
5
4
|
* AsyncLocalStorage integration for SSR collector discovery.
|
|
@@ -29,7 +28,7 @@ function getSSRCollector() {
|
|
|
29
28
|
if (typeof tastySSRStorage?.getStore !== "function") return null;
|
|
30
29
|
return tastySSRStorage.getStore() ?? null;
|
|
31
30
|
}
|
|
32
|
-
|
|
33
31
|
//#endregion
|
|
34
32
|
export { getSSRCollector, runWithCollector };
|
|
33
|
+
|
|
35
34
|
//# sourceMappingURL=async-storage.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"async-storage.js","names":[],"sources":["../../src/ssr/async-storage.ts"],"sourcesContent":["/**\n * AsyncLocalStorage integration for SSR collector discovery.\n *\n * Used by Astro middleware and generic framework integrations where\n * the library cannot wrap the React tree with a context provider.\n * The middleware calls runWithCollector() around the render, and\n * useStyles() calls getSSRCollector() to find it.\n *\n * This module imports from 'node:async_hooks' — it must be excluded\n * from client bundles via the build configuration.\n */\n\nimport { AsyncLocalStorage } from 'node:async_hooks';\n\nimport type { ServerStyleCollector } from './collector';\n\nconst tastySSRStorage = new AsyncLocalStorage<ServerStyleCollector>();\n\n/**\n * Run a function with a ServerStyleCollector bound to the current\n * async context. All useStyles() calls within `fn` (and any async\n * continuations) will find this collector via getSSRCollector().\n */\nexport function runWithCollector<T>(\n collector: ServerStyleCollector,\n fn: () => T,\n): T {\n return tastySSRStorage.run(collector, fn);\n}\n\n/**\n * Retrieve the ServerStyleCollector bound to the current async context.\n * Returns null when called outside of runWithCollector() or on the client.\n */\nexport function getSSRCollector(): ServerStyleCollector | null {\n if (typeof tastySSRStorage?.getStore !== 'function') return null;\n return tastySSRStorage.getStore() ?? null;\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"async-storage.js","names":[],"sources":["../../src/ssr/async-storage.ts"],"sourcesContent":["/**\n * AsyncLocalStorage integration for SSR collector discovery.\n *\n * Used by Astro middleware and generic framework integrations where\n * the library cannot wrap the React tree with a context provider.\n * The middleware calls runWithCollector() around the render, and\n * useStyles() calls getSSRCollector() to find it.\n *\n * This module imports from 'node:async_hooks' — it must be excluded\n * from client bundles via the build configuration.\n */\n\nimport { AsyncLocalStorage } from 'node:async_hooks';\n\nimport type { ServerStyleCollector } from './collector';\n\nconst tastySSRStorage = new AsyncLocalStorage<ServerStyleCollector>();\n\n/**\n * Run a function with a ServerStyleCollector bound to the current\n * async context. All useStyles() calls within `fn` (and any async\n * continuations) will find this collector via getSSRCollector().\n */\nexport function runWithCollector<T>(\n collector: ServerStyleCollector,\n fn: () => T,\n): T {\n return tastySSRStorage.run(collector, fn);\n}\n\n/**\n * Retrieve the ServerStyleCollector bound to the current async context.\n * Returns null when called outside of runWithCollector() or on the client.\n */\nexport function getSSRCollector(): ServerStyleCollector | null {\n if (typeof tastySSRStorage?.getStore !== 'function') return null;\n return tastySSRStorage.getStore() ?? null;\n}\n"],"mappings":";;;;;;;;;;;;;AAgBA,MAAM,kBAAkB,IAAI,mBAAyC;;;;;;AAOrE,SAAgB,iBACd,WACA,IACG;AACH,QAAO,gBAAgB,IAAI,WAAW,GAAG;;;;;;AAO3C,SAAgB,kBAA+C;AAC7D,KAAI,OAAO,iBAAiB,aAAa,WAAY,QAAO;AAC5D,QAAO,gBAAgB,UAAU,IAAI"}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { parsePropertyToken } from "../properties/index.js";
|
|
2
2
|
import { PropertyTypeResolver } from "../properties/property-type-resolver.js";
|
|
3
3
|
import { formatPropertyCSS } from "./format-property.js";
|
|
4
|
-
|
|
5
4
|
//#region src/ssr/collect-auto-properties.ts
|
|
6
5
|
/**
|
|
7
6
|
* Scan rendered rules for custom property declarations and collect
|
|
@@ -34,7 +33,7 @@ function collectAutoInferredProperties(rules, collector, styles) {
|
|
|
34
33
|
});
|
|
35
34
|
}
|
|
36
35
|
}
|
|
37
|
-
|
|
38
36
|
//#endregion
|
|
39
37
|
export { collectAutoInferredProperties };
|
|
38
|
+
|
|
40
39
|
//# sourceMappingURL=collect-auto-properties.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"collect-auto-properties.js","names":[],"sources":["../../src/ssr/collect-auto-properties.ts"],"sourcesContent":["/**\n * SSR auto-property inference.\n *\n * Scans rendered CSS declarations for custom properties whose types\n * can be inferred from their values (e.g. `--angle: 30deg` → `<angle>`).\n * Mirrors the client-side auto-inference in StyleInjector.inject().\n */\n\nimport type { StyleResult } from '../pipeline';\nimport { parsePropertyToken } from '../properties';\nimport { PropertyTypeResolver } from '../properties/property-type-resolver';\nimport type { Styles } from '../styles/types';\n\nimport type { ServerStyleCollector } from './collector';\nimport { formatPropertyCSS } from './format-property';\n\n/**\n * Scan rendered rules for custom property declarations and collect\n * auto-inferred @property rules via the SSR collector.\n *\n * @param rules - Rendered style rules containing CSS declarations\n * @param collector - SSR collector to emit @property CSS into\n * @param styles - Original styles object (used to skip explicit @properties)\n */\nexport function collectAutoInferredProperties(\n rules: StyleResult[],\n collector: ServerStyleCollector,\n styles?: Styles,\n): void {\n const registered = new Set<string>();\n\n if (styles) {\n const localProps = styles['@properties'];\n if (localProps && typeof localProps === 'object') {\n for (const token of Object.keys(localProps as Record<string, unknown>)) {\n const parsed = parsePropertyToken(token);\n if (parsed.isValid) {\n registered.add(parsed.cssName);\n }\n }\n }\n }\n\n const resolver = new PropertyTypeResolver();\n\n for (const rule of rules) {\n if (!rule.declarations) continue;\n resolver.scanDeclarations(\n rule.declarations,\n (name) => registered.has(name),\n (name, syntax, initialValue) => {\n registered.add(name);\n const css = formatPropertyCSS(name, {\n syntax,\n inherits: true,\n initialValue,\n });\n if (css) {\n collector.collectProperty(`__auto:${name}`, css);\n }\n },\n );\n }\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"collect-auto-properties.js","names":[],"sources":["../../src/ssr/collect-auto-properties.ts"],"sourcesContent":["/**\n * SSR auto-property inference.\n *\n * Scans rendered CSS declarations for custom properties whose types\n * can be inferred from their values (e.g. `--angle: 30deg` → `<angle>`).\n * Mirrors the client-side auto-inference in StyleInjector.inject().\n */\n\nimport type { StyleResult } from '../pipeline';\nimport { parsePropertyToken } from '../properties';\nimport { PropertyTypeResolver } from '../properties/property-type-resolver';\nimport type { Styles } from '../styles/types';\n\nimport type { ServerStyleCollector } from './collector';\nimport { formatPropertyCSS } from './format-property';\n\n/**\n * Scan rendered rules for custom property declarations and collect\n * auto-inferred @property rules via the SSR collector.\n *\n * @param rules - Rendered style rules containing CSS declarations\n * @param collector - SSR collector to emit @property CSS into\n * @param styles - Original styles object (used to skip explicit @properties)\n */\nexport function collectAutoInferredProperties(\n rules: StyleResult[],\n collector: ServerStyleCollector,\n styles?: Styles,\n): void {\n const registered = new Set<string>();\n\n if (styles) {\n const localProps = styles['@properties'];\n if (localProps && typeof localProps === 'object') {\n for (const token of Object.keys(localProps as Record<string, unknown>)) {\n const parsed = parsePropertyToken(token);\n if (parsed.isValid) {\n registered.add(parsed.cssName);\n }\n }\n }\n }\n\n const resolver = new PropertyTypeResolver();\n\n for (const rule of rules) {\n if (!rule.declarations) continue;\n resolver.scanDeclarations(\n rule.declarations,\n (name) => registered.has(name),\n (name, syntax, initialValue) => {\n registered.add(name);\n const css = formatPropertyCSS(name, {\n syntax,\n inherits: true,\n initialValue,\n });\n if (css) {\n collector.collectProperty(`__auto:${name}`, css);\n }\n },\n );\n }\n}\n"],"mappings":";;;;;;;;;;;;AAwBA,SAAgB,8BACd,OACA,WACA,QACM;CACN,MAAM,6BAAa,IAAI,KAAa;AAEpC,KAAI,QAAQ;EACV,MAAM,aAAa,OAAO;AAC1B,MAAI,cAAc,OAAO,eAAe,SACtC,MAAK,MAAM,SAAS,OAAO,KAAK,WAAsC,EAAE;GACtE,MAAM,SAAS,mBAAmB,MAAM;AACxC,OAAI,OAAO,QACT,YAAW,IAAI,OAAO,QAAQ;;;CAMtC,MAAM,WAAW,IAAI,sBAAsB;AAE3C,MAAK,MAAM,QAAQ,OAAO;AACxB,MAAI,CAAC,KAAK,aAAc;AACxB,WAAS,iBACP,KAAK,eACJ,SAAS,WAAW,IAAI,KAAK,GAC7B,MAAM,QAAQ,iBAAiB;AAC9B,cAAW,IAAI,KAAK;GACpB,MAAM,MAAM,kBAAkB,MAAM;IAClC;IACA,UAAU;IACV;IACD,CAAC;AACF,OAAI,IACF,WAAU,gBAAgB,UAAU,QAAQ,IAAI;IAGrD"}
|
package/dist/ssr/collector.js
CHANGED
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
import { fontFaceContentHash, formatFontFaceRule } from "../font-face/index.js";
|
|
2
2
|
import { formatCounterStyleRule } from "../counter-style/index.js";
|
|
3
3
|
import { renderStyles } from "../pipeline/index.js";
|
|
4
|
-
import {
|
|
4
|
+
import { getEffectiveProperties, getGlobalConfigTokens, getGlobalCounterStyle, getGlobalFontFace } from "../config.js";
|
|
5
5
|
import { formatPropertyCSS } from "./format-property.js";
|
|
6
6
|
import { formatGlobalRules } from "./format-global-rules.js";
|
|
7
7
|
import { formatRules } from "./format-rules.js";
|
|
8
|
-
|
|
9
8
|
//#region src/ssr/collector.ts
|
|
10
9
|
/**
|
|
11
10
|
* ServerStyleCollector — server-safe style collector for SSR.
|
|
@@ -49,16 +48,9 @@ var ServerStyleCollector = class {
|
|
|
49
48
|
collectInternals() {
|
|
50
49
|
if (this.internalsCollected) return;
|
|
51
50
|
this.internalsCollected = true;
|
|
52
|
-
for (const [token, definition] of Object.entries(
|
|
51
|
+
for (const [token, definition] of Object.entries(getEffectiveProperties())) {
|
|
53
52
|
const css = formatPropertyCSS(token, definition);
|
|
54
|
-
if (css) this.collectProperty(`
|
|
55
|
-
}
|
|
56
|
-
if (hasGlobalProperties()) {
|
|
57
|
-
const globalProps = getGlobalProperties();
|
|
58
|
-
if (globalProps) for (const [token, definition] of Object.entries(globalProps)) {
|
|
59
|
-
const css = formatPropertyCSS(token, definition);
|
|
60
|
-
if (css) this.collectProperty(`__global:${token}`, css);
|
|
61
|
-
}
|
|
53
|
+
if (css) this.collectProperty(`__prop:${token}`, css);
|
|
62
54
|
}
|
|
63
55
|
const tokenStyles = getGlobalConfigTokens();
|
|
64
56
|
if (tokenStyles && Object.keys(tokenStyles).length > 0) {
|
|
@@ -221,7 +213,7 @@ var ServerStyleCollector = class {
|
|
|
221
213
|
};
|
|
222
214
|
}
|
|
223
215
|
};
|
|
224
|
-
|
|
225
216
|
//#endregion
|
|
226
217
|
export { ServerStyleCollector };
|
|
218
|
+
|
|
227
219
|
//# sourceMappingURL=collector.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"collector.js","names":[],"sources":["../../src/ssr/collector.ts"],"sourcesContent":["/**\n * ServerStyleCollector — server-safe style collector for SSR.\n *\n * Accumulates CSS rules and cache metadata during server rendering.\n * This is the server-side counterpart to StyleInjector: it allocates\n * sequential class names (t0, t1, …), formats CSS rules into text,\n * and serializes the cache state for client hydration.\n *\n * One instance is created per HTTP request. Concurrent requests\n * each get their own collector (via AsyncLocalStorage or React context).\n */\n\nimport {\n getGlobalCounterStyle,\n getGlobalFontFace,\n getGlobalProperties,\n getGlobalConfigTokens,\n hasGlobalProperties,\n INTERNAL_PROPERTIES,\n} from '../config';\nimport { formatCounterStyleRule } from '../counter-style';\nimport { fontFaceContentHash, formatFontFaceRule } from '../font-face';\nimport { renderStyles } from '../pipeline';\nimport type { StyleResult } from '../pipeline';\nimport { formatPropertyCSS } from './format-property';\nimport { formatGlobalRules } from './format-global-rules';\nimport { formatRules } from './format-rules';\n\n/**\n * Cache state serialized to the client for hydration.\n */\nexport interface SSRCacheState {\n /** cacheKey → className map, to pre-populate the client registry */\n entries: Record<string, string>;\n /** Counter value so client allocations don't collide with server ones */\n classCounter: number;\n}\n\nfunction generateClassName(counter: number): string {\n return `t${counter}`;\n}\n\nexport class ServerStyleCollector {\n private chunks = new Map<string, string>();\n private cacheKeyToClassName = new Map<string, string>();\n private classCounter = 0;\n private flushedKeys = new Set<string>();\n private propertyRules = new Map<string, string>();\n private flushedPropertyKeys = new Set<string>();\n private keyframeRules = new Map<string, string>();\n private flushedKeyframeKeys = new Set<string>();\n private globalStyles = new Map<string, string>();\n private flushedGlobalKeys = new Set<string>();\n private rawCSS = new Map<string, string>();\n private flushedRawKeys = new Set<string>();\n private fontFaceRules = new Map<string, string>();\n private flushedFontFaceKeys = new Set<string>();\n private counterStyleRules = new Map<string, string>();\n private flushedCounterStyleKeys = new Set<string>();\n private keyframesCounter = 0;\n private counterStyleCounter = 0;\n private internalsCollected = false;\n\n /**\n * Collect internal @property rules and :root token defaults.\n * Mirrors markStylesGenerated() from the client-side injector.\n * Called automatically on first chunk collection; idempotent.\n */\n collectInternals(): void {\n if (this.internalsCollected) return;\n this.internalsCollected = true;\n\n for (const [token, definition] of Object.entries(INTERNAL_PROPERTIES)) {\n const css = formatPropertyCSS(token, definition);\n if (css) {\n this.collectProperty(`__internal:${token}`, css);\n }\n }\n\n if (hasGlobalProperties()) {\n const globalProps = getGlobalProperties();\n if (globalProps) {\n for (const [token, definition] of Object.entries(globalProps)) {\n const css = formatPropertyCSS(token, definition);\n if (css) {\n this.collectProperty(`__global:${token}`, css);\n }\n }\n }\n }\n\n // Inject configured tokens as :root CSS custom properties\n const tokenStyles = getGlobalConfigTokens();\n if (tokenStyles && Object.keys(tokenStyles).length > 0) {\n const tokenRules = renderStyles(tokenStyles, ':root') as StyleResult[];\n if (tokenRules.length > 0) {\n const css = formatGlobalRules(tokenRules);\n if (css) {\n this.collectGlobalStyles('__global:tokens', css);\n }\n }\n }\n\n // Inject global @font-face rules (mirrors markStylesGenerated)\n const globalFF = getGlobalFontFace();\n if (globalFF) {\n for (const [family, input] of Object.entries(globalFF)) {\n const descriptors = Array.isArray(input) ? input : [input];\n for (const desc of descriptors) {\n const hash = fontFaceContentHash(family, desc);\n const css = formatFontFaceRule(family, desc);\n this.collectFontFace(hash, css);\n }\n }\n }\n\n // Inject global @counter-style rules (mirrors markStylesGenerated)\n const globalCS = getGlobalCounterStyle();\n if (globalCS) {\n for (const [name, descriptors] of Object.entries(globalCS)) {\n const css = formatCounterStyleRule(name, descriptors);\n this.collectCounterStyle(name, css);\n }\n }\n }\n\n /**\n * Allocate a className for a cache key, server-side.\n * Mirrors StyleInjector.allocateClassName but without DOM access.\n */\n allocateClassName(cacheKey: string): {\n className: string;\n isNewAllocation: boolean;\n } {\n const existing = this.cacheKeyToClassName.get(cacheKey);\n if (existing) {\n return { className: existing, isNewAllocation: false };\n }\n\n const className = generateClassName(this.classCounter++);\n this.cacheKeyToClassName.set(cacheKey, className);\n\n return { className, isNewAllocation: true };\n }\n\n /**\n * Record CSS rules for a chunk.\n * Called by useStyles during server render.\n */\n collectChunk(\n cacheKey: string,\n className: string,\n rules: StyleResult[],\n ): void {\n if (this.chunks.has(cacheKey)) return;\n const css = formatRules(rules, className);\n if (css) {\n this.chunks.set(cacheKey, css);\n }\n }\n\n /**\n * Record a @property rule. Deduplicated by name.\n */\n collectProperty(name: string, css: string): void {\n if (!this.propertyRules.has(name)) {\n this.propertyRules.set(name, css);\n }\n }\n\n /**\n * Record a @keyframes rule. Deduplicated by name.\n */\n collectKeyframes(name: string, css: string): void {\n if (!this.keyframeRules.has(name)) {\n this.keyframeRules.set(name, css);\n }\n }\n\n /**\n * Allocate a keyframe name for SSR. Uses provided name or generates one.\n */\n allocateKeyframeName(providedName?: string): string {\n return providedName ?? `k${this.keyframesCounter++}`;\n }\n\n /**\n * Record a @font-face rule. Deduplicated by key (content hash).\n */\n collectFontFace(key: string, css: string): void {\n if (!this.fontFaceRules.has(key)) {\n this.fontFaceRules.set(key, css);\n }\n }\n\n /**\n * Record a @counter-style rule. Deduplicated by name.\n */\n collectCounterStyle(name: string, css: string): void {\n if (!this.counterStyleRules.has(name)) {\n this.counterStyleRules.set(name, css);\n }\n }\n\n /**\n * Allocate a counter-style name for SSR. Uses provided name or generates one.\n */\n allocateCounterStyleName(providedName?: string): string {\n return providedName ?? `cs${this.counterStyleCounter++}`;\n }\n\n /**\n * Record global styles (from useGlobalStyles). Deduplicated by key.\n */\n collectGlobalStyles(key: string, css: string): void {\n if (!this.globalStyles.has(key)) {\n this.globalStyles.set(key, css);\n }\n }\n\n /**\n * Record raw CSS text (from useRawCSS). Deduplicated by key.\n */\n collectRawCSS(key: string, css: string): void {\n if (!this.rawCSS.has(key)) {\n this.rawCSS.set(key, css);\n }\n }\n\n /**\n * Extract all CSS collected so far as a single string.\n * Includes @property and @keyframes rules.\n * Used for non-streaming SSR (renderToString).\n */\n getCSS(): string {\n const parts: string[] = [];\n\n for (const css of this.propertyRules.values()) {\n parts.push(css);\n }\n\n for (const css of this.fontFaceRules.values()) {\n parts.push(css);\n }\n\n for (const css of this.counterStyleRules.values()) {\n parts.push(css);\n }\n\n for (const css of this.rawCSS.values()) {\n parts.push(css);\n }\n\n for (const css of this.globalStyles.values()) {\n parts.push(css);\n }\n\n for (const css of this.chunks.values()) {\n parts.push(css);\n }\n\n for (const css of this.keyframeRules.values()) {\n parts.push(css);\n }\n\n return parts.join('\\n');\n }\n\n /**\n * Flush only newly collected CSS since the last flush.\n * Used for streaming SSR (renderToPipeableStream + useServerInsertedHTML).\n */\n flushCSS(): string {\n const parts: string[] = [];\n\n for (const [name, css] of this.propertyRules) {\n if (!this.flushedPropertyKeys.has(name)) {\n parts.push(css);\n this.flushedPropertyKeys.add(name);\n }\n }\n\n for (const [key, css] of this.fontFaceRules) {\n if (!this.flushedFontFaceKeys.has(key)) {\n parts.push(css);\n this.flushedFontFaceKeys.add(key);\n }\n }\n\n for (const [key, css] of this.counterStyleRules) {\n if (!this.flushedCounterStyleKeys.has(key)) {\n parts.push(css);\n this.flushedCounterStyleKeys.add(key);\n }\n }\n\n for (const [key, css] of this.rawCSS) {\n if (!this.flushedRawKeys.has(key)) {\n parts.push(css);\n this.flushedRawKeys.add(key);\n }\n }\n\n for (const [key, css] of this.globalStyles) {\n if (!this.flushedGlobalKeys.has(key)) {\n parts.push(css);\n this.flushedGlobalKeys.add(key);\n }\n }\n\n for (const [key, css] of this.chunks) {\n if (!this.flushedKeys.has(key)) {\n parts.push(css);\n this.flushedKeys.add(key);\n }\n }\n\n for (const [name, css] of this.keyframeRules) {\n if (!this.flushedKeyframeKeys.has(name)) {\n parts.push(css);\n this.flushedKeyframeKeys.add(name);\n }\n }\n\n return parts.join('\\n');\n }\n\n /**\n * Serialize the cache state for client hydration.\n */\n getCacheState(): SSRCacheState {\n const entries: Record<string, string> = {};\n for (const [cacheKey, className] of this.cacheKeyToClassName) {\n entries[cacheKey] = className;\n }\n return { entries, classCounter: this.classCounter };\n }\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"collector.js","names":[],"sources":["../../src/ssr/collector.ts"],"sourcesContent":["/**\n * ServerStyleCollector — server-safe style collector for SSR.\n *\n * Accumulates CSS rules and cache metadata during server rendering.\n * This is the server-side counterpart to StyleInjector: it allocates\n * sequential class names (t0, t1, …), formats CSS rules into text,\n * and serializes the cache state for client hydration.\n *\n * One instance is created per HTTP request. Concurrent requests\n * each get their own collector (via AsyncLocalStorage or React context).\n */\n\nimport {\n getEffectiveProperties,\n getGlobalCounterStyle,\n getGlobalFontFace,\n getGlobalConfigTokens,\n} from '../config';\nimport { formatCounterStyleRule } from '../counter-style';\nimport { fontFaceContentHash, formatFontFaceRule } from '../font-face';\nimport { renderStyles } from '../pipeline';\nimport type { StyleResult } from '../pipeline';\nimport { formatPropertyCSS } from './format-property';\nimport { formatGlobalRules } from './format-global-rules';\nimport { formatRules } from './format-rules';\n\n/**\n * Cache state serialized to the client for hydration.\n */\nexport interface SSRCacheState {\n /** cacheKey → className map, to pre-populate the client registry */\n entries: Record<string, string>;\n /** Counter value so client allocations don't collide with server ones */\n classCounter: number;\n}\n\nfunction generateClassName(counter: number): string {\n return `t${counter}`;\n}\n\nexport class ServerStyleCollector {\n private chunks = new Map<string, string>();\n private cacheKeyToClassName = new Map<string, string>();\n private classCounter = 0;\n private flushedKeys = new Set<string>();\n private propertyRules = new Map<string, string>();\n private flushedPropertyKeys = new Set<string>();\n private keyframeRules = new Map<string, string>();\n private flushedKeyframeKeys = new Set<string>();\n private globalStyles = new Map<string, string>();\n private flushedGlobalKeys = new Set<string>();\n private rawCSS = new Map<string, string>();\n private flushedRawKeys = new Set<string>();\n private fontFaceRules = new Map<string, string>();\n private flushedFontFaceKeys = new Set<string>();\n private counterStyleRules = new Map<string, string>();\n private flushedCounterStyleKeys = new Set<string>();\n private keyframesCounter = 0;\n private counterStyleCounter = 0;\n private internalsCollected = false;\n\n /**\n * Collect internal @property rules and :root token defaults.\n * Mirrors markStylesGenerated() from the client-side injector.\n * Called automatically on first chunk collection; idempotent.\n */\n collectInternals(): void {\n if (this.internalsCollected) return;\n this.internalsCollected = true;\n\n for (const [token, definition] of Object.entries(\n getEffectiveProperties(),\n )) {\n const css = formatPropertyCSS(token, definition);\n if (css) {\n this.collectProperty(`__prop:${token}`, css);\n }\n }\n\n // Inject configured tokens as :root CSS custom properties\n const tokenStyles = getGlobalConfigTokens();\n if (tokenStyles && Object.keys(tokenStyles).length > 0) {\n const tokenRules = renderStyles(tokenStyles, ':root') as StyleResult[];\n if (tokenRules.length > 0) {\n const css = formatGlobalRules(tokenRules);\n if (css) {\n this.collectGlobalStyles('__global:tokens', css);\n }\n }\n }\n\n // Inject global @font-face rules (mirrors markStylesGenerated)\n const globalFF = getGlobalFontFace();\n if (globalFF) {\n for (const [family, input] of Object.entries(globalFF)) {\n const descriptors = Array.isArray(input) ? input : [input];\n for (const desc of descriptors) {\n const hash = fontFaceContentHash(family, desc);\n const css = formatFontFaceRule(family, desc);\n this.collectFontFace(hash, css);\n }\n }\n }\n\n // Inject global @counter-style rules (mirrors markStylesGenerated)\n const globalCS = getGlobalCounterStyle();\n if (globalCS) {\n for (const [name, descriptors] of Object.entries(globalCS)) {\n const css = formatCounterStyleRule(name, descriptors);\n this.collectCounterStyle(name, css);\n }\n }\n }\n\n /**\n * Allocate a className for a cache key, server-side.\n * Mirrors StyleInjector.allocateClassName but without DOM access.\n */\n allocateClassName(cacheKey: string): {\n className: string;\n isNewAllocation: boolean;\n } {\n const existing = this.cacheKeyToClassName.get(cacheKey);\n if (existing) {\n return { className: existing, isNewAllocation: false };\n }\n\n const className = generateClassName(this.classCounter++);\n this.cacheKeyToClassName.set(cacheKey, className);\n\n return { className, isNewAllocation: true };\n }\n\n /**\n * Record CSS rules for a chunk.\n * Called by useStyles during server render.\n */\n collectChunk(\n cacheKey: string,\n className: string,\n rules: StyleResult[],\n ): void {\n if (this.chunks.has(cacheKey)) return;\n const css = formatRules(rules, className);\n if (css) {\n this.chunks.set(cacheKey, css);\n }\n }\n\n /**\n * Record a @property rule. Deduplicated by name.\n */\n collectProperty(name: string, css: string): void {\n if (!this.propertyRules.has(name)) {\n this.propertyRules.set(name, css);\n }\n }\n\n /**\n * Record a @keyframes rule. Deduplicated by name.\n */\n collectKeyframes(name: string, css: string): void {\n if (!this.keyframeRules.has(name)) {\n this.keyframeRules.set(name, css);\n }\n }\n\n /**\n * Allocate a keyframe name for SSR. Uses provided name or generates one.\n */\n allocateKeyframeName(providedName?: string): string {\n return providedName ?? `k${this.keyframesCounter++}`;\n }\n\n /**\n * Record a @font-face rule. Deduplicated by key (content hash).\n */\n collectFontFace(key: string, css: string): void {\n if (!this.fontFaceRules.has(key)) {\n this.fontFaceRules.set(key, css);\n }\n }\n\n /**\n * Record a @counter-style rule. Deduplicated by name.\n */\n collectCounterStyle(name: string, css: string): void {\n if (!this.counterStyleRules.has(name)) {\n this.counterStyleRules.set(name, css);\n }\n }\n\n /**\n * Allocate a counter-style name for SSR. Uses provided name or generates one.\n */\n allocateCounterStyleName(providedName?: string): string {\n return providedName ?? `cs${this.counterStyleCounter++}`;\n }\n\n /**\n * Record global styles (from useGlobalStyles). Deduplicated by key.\n */\n collectGlobalStyles(key: string, css: string): void {\n if (!this.globalStyles.has(key)) {\n this.globalStyles.set(key, css);\n }\n }\n\n /**\n * Record raw CSS text (from useRawCSS). Deduplicated by key.\n */\n collectRawCSS(key: string, css: string): void {\n if (!this.rawCSS.has(key)) {\n this.rawCSS.set(key, css);\n }\n }\n\n /**\n * Extract all CSS collected so far as a single string.\n * Includes @property and @keyframes rules.\n * Used for non-streaming SSR (renderToString).\n */\n getCSS(): string {\n const parts: string[] = [];\n\n for (const css of this.propertyRules.values()) {\n parts.push(css);\n }\n\n for (const css of this.fontFaceRules.values()) {\n parts.push(css);\n }\n\n for (const css of this.counterStyleRules.values()) {\n parts.push(css);\n }\n\n for (const css of this.rawCSS.values()) {\n parts.push(css);\n }\n\n for (const css of this.globalStyles.values()) {\n parts.push(css);\n }\n\n for (const css of this.chunks.values()) {\n parts.push(css);\n }\n\n for (const css of this.keyframeRules.values()) {\n parts.push(css);\n }\n\n return parts.join('\\n');\n }\n\n /**\n * Flush only newly collected CSS since the last flush.\n * Used for streaming SSR (renderToPipeableStream + useServerInsertedHTML).\n */\n flushCSS(): string {\n const parts: string[] = [];\n\n for (const [name, css] of this.propertyRules) {\n if (!this.flushedPropertyKeys.has(name)) {\n parts.push(css);\n this.flushedPropertyKeys.add(name);\n }\n }\n\n for (const [key, css] of this.fontFaceRules) {\n if (!this.flushedFontFaceKeys.has(key)) {\n parts.push(css);\n this.flushedFontFaceKeys.add(key);\n }\n }\n\n for (const [key, css] of this.counterStyleRules) {\n if (!this.flushedCounterStyleKeys.has(key)) {\n parts.push(css);\n this.flushedCounterStyleKeys.add(key);\n }\n }\n\n for (const [key, css] of this.rawCSS) {\n if (!this.flushedRawKeys.has(key)) {\n parts.push(css);\n this.flushedRawKeys.add(key);\n }\n }\n\n for (const [key, css] of this.globalStyles) {\n if (!this.flushedGlobalKeys.has(key)) {\n parts.push(css);\n this.flushedGlobalKeys.add(key);\n }\n }\n\n for (const [key, css] of this.chunks) {\n if (!this.flushedKeys.has(key)) {\n parts.push(css);\n this.flushedKeys.add(key);\n }\n }\n\n for (const [name, css] of this.keyframeRules) {\n if (!this.flushedKeyframeKeys.has(name)) {\n parts.push(css);\n this.flushedKeyframeKeys.add(name);\n }\n }\n\n return parts.join('\\n');\n }\n\n /**\n * Serialize the cache state for client hydration.\n */\n getCacheState(): SSRCacheState {\n const entries: Record<string, string> = {};\n for (const [cacheKey, className] of this.cacheKeyToClassName) {\n entries[cacheKey] = className;\n }\n return { entries, classCounter: this.classCounter };\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAoCA,SAAS,kBAAkB,SAAyB;AAClD,QAAO,IAAI;;AAGb,IAAa,uBAAb,MAAkC;CAChC,yBAAiB,IAAI,KAAqB;CAC1C,sCAA8B,IAAI,KAAqB;CACvD,eAAuB;CACvB,8BAAsB,IAAI,KAAa;CACvC,gCAAwB,IAAI,KAAqB;CACjD,sCAA8B,IAAI,KAAa;CAC/C,gCAAwB,IAAI,KAAqB;CACjD,sCAA8B,IAAI,KAAa;CAC/C,+BAAuB,IAAI,KAAqB;CAChD,oCAA4B,IAAI,KAAa;CAC7C,yBAAiB,IAAI,KAAqB;CAC1C,iCAAyB,IAAI,KAAa;CAC1C,gCAAwB,IAAI,KAAqB;CACjD,sCAA8B,IAAI,KAAa;CAC/C,oCAA4B,IAAI,KAAqB;CACrD,0CAAkC,IAAI,KAAa;CACnD,mBAA2B;CAC3B,sBAA8B;CAC9B,qBAA6B;;;;;;CAO7B,mBAAyB;AACvB,MAAI,KAAK,mBAAoB;AAC7B,OAAK,qBAAqB;AAE1B,OAAK,MAAM,CAAC,OAAO,eAAe,OAAO,QACvC,wBAAwB,CACzB,EAAE;GACD,MAAM,MAAM,kBAAkB,OAAO,WAAW;AAChD,OAAI,IACF,MAAK,gBAAgB,UAAU,SAAS,IAAI;;EAKhD,MAAM,cAAc,uBAAuB;AAC3C,MAAI,eAAe,OAAO,KAAK,YAAY,CAAC,SAAS,GAAG;GACtD,MAAM,aAAa,aAAa,aAAa,QAAQ;AACrD,OAAI,WAAW,SAAS,GAAG;IACzB,MAAM,MAAM,kBAAkB,WAAW;AACzC,QAAI,IACF,MAAK,oBAAoB,mBAAmB,IAAI;;;EAMtD,MAAM,WAAW,mBAAmB;AACpC,MAAI,SACF,MAAK,MAAM,CAAC,QAAQ,UAAU,OAAO,QAAQ,SAAS,EAAE;GACtD,MAAM,cAAc,MAAM,QAAQ,MAAM,GAAG,QAAQ,CAAC,MAAM;AAC1D,QAAK,MAAM,QAAQ,aAAa;IAC9B,MAAM,OAAO,oBAAoB,QAAQ,KAAK;IAC9C,MAAM,MAAM,mBAAmB,QAAQ,KAAK;AAC5C,SAAK,gBAAgB,MAAM,IAAI;;;EAMrC,MAAM,WAAW,uBAAuB;AACxC,MAAI,SACF,MAAK,MAAM,CAAC,MAAM,gBAAgB,OAAO,QAAQ,SAAS,EAAE;GAC1D,MAAM,MAAM,uBAAuB,MAAM,YAAY;AACrD,QAAK,oBAAoB,MAAM,IAAI;;;;;;;CASzC,kBAAkB,UAGhB;EACA,MAAM,WAAW,KAAK,oBAAoB,IAAI,SAAS;AACvD,MAAI,SACF,QAAO;GAAE,WAAW;GAAU,iBAAiB;GAAO;EAGxD,MAAM,YAAY,kBAAkB,KAAK,eAAe;AACxD,OAAK,oBAAoB,IAAI,UAAU,UAAU;AAEjD,SAAO;GAAE;GAAW,iBAAiB;GAAM;;;;;;CAO7C,aACE,UACA,WACA,OACM;AACN,MAAI,KAAK,OAAO,IAAI,SAAS,CAAE;EAC/B,MAAM,MAAM,YAAY,OAAO,UAAU;AACzC,MAAI,IACF,MAAK,OAAO,IAAI,UAAU,IAAI;;;;;CAOlC,gBAAgB,MAAc,KAAmB;AAC/C,MAAI,CAAC,KAAK,cAAc,IAAI,KAAK,CAC/B,MAAK,cAAc,IAAI,MAAM,IAAI;;;;;CAOrC,iBAAiB,MAAc,KAAmB;AAChD,MAAI,CAAC,KAAK,cAAc,IAAI,KAAK,CAC/B,MAAK,cAAc,IAAI,MAAM,IAAI;;;;;CAOrC,qBAAqB,cAA+B;AAClD,SAAO,gBAAgB,IAAI,KAAK;;;;;CAMlC,gBAAgB,KAAa,KAAmB;AAC9C,MAAI,CAAC,KAAK,cAAc,IAAI,IAAI,CAC9B,MAAK,cAAc,IAAI,KAAK,IAAI;;;;;CAOpC,oBAAoB,MAAc,KAAmB;AACnD,MAAI,CAAC,KAAK,kBAAkB,IAAI,KAAK,CACnC,MAAK,kBAAkB,IAAI,MAAM,IAAI;;;;;CAOzC,yBAAyB,cAA+B;AACtD,SAAO,gBAAgB,KAAK,KAAK;;;;;CAMnC,oBAAoB,KAAa,KAAmB;AAClD,MAAI,CAAC,KAAK,aAAa,IAAI,IAAI,CAC7B,MAAK,aAAa,IAAI,KAAK,IAAI;;;;;CAOnC,cAAc,KAAa,KAAmB;AAC5C,MAAI,CAAC,KAAK,OAAO,IAAI,IAAI,CACvB,MAAK,OAAO,IAAI,KAAK,IAAI;;;;;;;CAS7B,SAAiB;EACf,MAAM,QAAkB,EAAE;AAE1B,OAAK,MAAM,OAAO,KAAK,cAAc,QAAQ,CAC3C,OAAM,KAAK,IAAI;AAGjB,OAAK,MAAM,OAAO,KAAK,cAAc,QAAQ,CAC3C,OAAM,KAAK,IAAI;AAGjB,OAAK,MAAM,OAAO,KAAK,kBAAkB,QAAQ,CAC/C,OAAM,KAAK,IAAI;AAGjB,OAAK,MAAM,OAAO,KAAK,OAAO,QAAQ,CACpC,OAAM,KAAK,IAAI;AAGjB,OAAK,MAAM,OAAO,KAAK,aAAa,QAAQ,CAC1C,OAAM,KAAK,IAAI;AAGjB,OAAK,MAAM,OAAO,KAAK,OAAO,QAAQ,CACpC,OAAM,KAAK,IAAI;AAGjB,OAAK,MAAM,OAAO,KAAK,cAAc,QAAQ,CAC3C,OAAM,KAAK,IAAI;AAGjB,SAAO,MAAM,KAAK,KAAK;;;;;;CAOzB,WAAmB;EACjB,MAAM,QAAkB,EAAE;AAE1B,OAAK,MAAM,CAAC,MAAM,QAAQ,KAAK,cAC7B,KAAI,CAAC,KAAK,oBAAoB,IAAI,KAAK,EAAE;AACvC,SAAM,KAAK,IAAI;AACf,QAAK,oBAAoB,IAAI,KAAK;;AAItC,OAAK,MAAM,CAAC,KAAK,QAAQ,KAAK,cAC5B,KAAI,CAAC,KAAK,oBAAoB,IAAI,IAAI,EAAE;AACtC,SAAM,KAAK,IAAI;AACf,QAAK,oBAAoB,IAAI,IAAI;;AAIrC,OAAK,MAAM,CAAC,KAAK,QAAQ,KAAK,kBAC5B,KAAI,CAAC,KAAK,wBAAwB,IAAI,IAAI,EAAE;AAC1C,SAAM,KAAK,IAAI;AACf,QAAK,wBAAwB,IAAI,IAAI;;AAIzC,OAAK,MAAM,CAAC,KAAK,QAAQ,KAAK,OAC5B,KAAI,CAAC,KAAK,eAAe,IAAI,IAAI,EAAE;AACjC,SAAM,KAAK,IAAI;AACf,QAAK,eAAe,IAAI,IAAI;;AAIhC,OAAK,MAAM,CAAC,KAAK,QAAQ,KAAK,aAC5B,KAAI,CAAC,KAAK,kBAAkB,IAAI,IAAI,EAAE;AACpC,SAAM,KAAK,IAAI;AACf,QAAK,kBAAkB,IAAI,IAAI;;AAInC,OAAK,MAAM,CAAC,KAAK,QAAQ,KAAK,OAC5B,KAAI,CAAC,KAAK,YAAY,IAAI,IAAI,EAAE;AAC9B,SAAM,KAAK,IAAI;AACf,QAAK,YAAY,IAAI,IAAI;;AAI7B,OAAK,MAAM,CAAC,MAAM,QAAQ,KAAK,cAC7B,KAAI,CAAC,KAAK,oBAAoB,IAAI,KAAK,EAAE;AACvC,SAAM,KAAK,IAAI;AACf,QAAK,oBAAoB,IAAI,KAAK;;AAItC,SAAO,MAAM,KAAK,KAAK;;;;;CAMzB,gBAA+B;EAC7B,MAAM,UAAkC,EAAE;AAC1C,OAAK,MAAM,CAAC,UAAU,cAAc,KAAK,oBACvC,SAAQ,YAAY;AAEtB,SAAO;GAAE;GAAS,cAAc,KAAK;GAAc"}
|
package/dist/ssr/context.d.ts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { ServerStyleCollector } from "./collector.js";
|
|
2
|
-
import * as react from "react";
|
|
2
|
+
import * as _$react from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/ssr/context.d.ts
|
|
5
|
-
declare const TastySSRContext: react.Context<ServerStyleCollector | null>;
|
|
5
|
+
declare const TastySSRContext: _$react.Context<ServerStyleCollector | null>;
|
|
6
6
|
//#endregion
|
|
7
7
|
export { TastySSRContext };
|
|
8
8
|
//# sourceMappingURL=context.d.ts.map
|
package/dist/ssr/context.js
CHANGED
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { createContext } from "react";
|
|
2
|
-
|
|
3
2
|
//#region src/ssr/context.ts
|
|
4
3
|
/**
|
|
5
4
|
* React context for SSR collector discovery.
|
|
@@ -8,7 +7,7 @@ import { createContext } from "react";
|
|
|
8
7
|
* to useStyles() via React context (the streaming-compatible path).
|
|
9
8
|
*/
|
|
10
9
|
const TastySSRContext = createContext(null);
|
|
11
|
-
|
|
12
10
|
//#endregion
|
|
13
11
|
export { TastySSRContext };
|
|
12
|
+
|
|
14
13
|
//# sourceMappingURL=context.js.map
|
package/dist/ssr/context.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"context.js","names":[],"sources":["../../src/ssr/context.ts"],"sourcesContent":["/**\n * React context for SSR collector discovery.\n *\n * Used by Next.js TastyRegistry to provide the ServerStyleCollector\n * to useStyles() via React context (the streaming-compatible path).\n */\n\nimport { createContext } from 'react';\n\nimport type { ServerStyleCollector } from './collector';\n\nexport const TastySSRContext = createContext<ServerStyleCollector | null>(null);\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"context.js","names":[],"sources":["../../src/ssr/context.ts"],"sourcesContent":["/**\n * React context for SSR collector discovery.\n *\n * Used by Next.js TastyRegistry to provide the ServerStyleCollector\n * to useStyles() via React context (the streaming-compatible path).\n */\n\nimport { createContext } from 'react';\n\nimport type { ServerStyleCollector } from './collector';\n\nexport const TastySSRContext = createContext<ServerStyleCollector | null>(null);\n"],"mappings":";;;;;;;;AAWA,MAAa,kBAAkB,cAA2C,KAAK"}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { createStyle } from "../styles/createStyle.js";
|
|
2
2
|
import { STYLE_HANDLER_MAP } from "../styles/index.js";
|
|
3
|
-
|
|
4
3
|
//#region src/ssr/format-keyframes.ts
|
|
5
4
|
/**
|
|
6
5
|
* Convert keyframes steps to a CSS string.
|
|
@@ -64,7 +63,7 @@ function stepsToCSS(steps) {
|
|
|
64
63
|
function formatKeyframesCSS(name, steps) {
|
|
65
64
|
return `@keyframes ${name} { ${stepsToCSS(steps)} }`;
|
|
66
65
|
}
|
|
67
|
-
|
|
68
66
|
//#endregion
|
|
69
67
|
export { formatKeyframesCSS };
|
|
68
|
+
|
|
70
69
|
//# sourceMappingURL=format-keyframes.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"format-keyframes.js","names":[],"sources":["../../src/ssr/format-keyframes.ts"],"sourcesContent":["/**\n * Format @keyframes CSS rules for SSR output.\n *\n * Replicates the stepsToCSS logic from SheetManager but as a\n * standalone function that doesn't need DOM access.\n */\n\nimport type { KeyframesSteps } from '../injector/types';\nimport { createStyle, STYLE_HANDLER_MAP } from '../styles';\nimport type { CSSMap, StyleHandler, StyleValueStateMap } from '../utils/styles';\n\n/**\n * Convert keyframes steps to a CSS string.\n * Replicates SheetManager.stepsToCSS() without the class instance.\n */\nfunction stepsToCSS(steps: KeyframesSteps): string {\n const rules: string[] = [];\n\n for (const [key, value] of Object.entries(steps)) {\n if (typeof value === 'string') {\n rules.push(`${key} { ${value.trim()} }`);\n continue;\n }\n\n const styleMap = (value || {}) as StyleValueStateMap;\n const styleNames = Object.keys(styleMap).sort();\n const handlerQueue: StyleHandler[] = [];\n const seenHandlers = new Set<StyleHandler>();\n\n styleNames.forEach((styleName) => {\n let handlers = STYLE_HANDLER_MAP[styleName];\n if (!handlers) {\n handlers = STYLE_HANDLER_MAP[styleName] = [createStyle(styleName)];\n }\n\n handlers.forEach((handler) => {\n if (!seenHandlers.has(handler)) {\n seenHandlers.add(handler);\n handlerQueue.push(handler);\n }\n });\n });\n\n const declarationPairs: { prop: string; value: string }[] = [];\n\n handlerQueue.forEach((handler) => {\n const lookup = handler.__lookupStyles;\n const filteredMap = lookup.reduce<StyleValueStateMap>((acc, name) => {\n const v = styleMap[name];\n if (v !== undefined) acc[name] = v;\n return acc;\n }, {});\n\n const result = handler(filteredMap);\n if (!result) return;\n\n const results = Array.isArray(result) ? result : [result];\n results.forEach((cssMap) => {\n if (!cssMap || typeof cssMap !== 'object') return;\n const { $: _$, ...props } = cssMap as CSSMap;\n\n Object.entries(props).forEach(([prop, val]) => {\n if (val == null || val === '') return;\n\n if (Array.isArray(val)) {\n val.forEach((v) => {\n if (v != null && v !== '') {\n declarationPairs.push({ prop, value: String(v) });\n }\n });\n } else {\n declarationPairs.push({ prop, value: String(val) });\n }\n });\n });\n });\n\n const declarations = declarationPairs\n .map((d) => `${d.prop}: ${d.value}`)\n .join('; ');\n\n rules.push(`${key} { ${declarations.trim()} }`);\n }\n\n return rules.join(' ');\n}\n\n/**\n * Format a @keyframes rule as a CSS string.\n */\nexport function formatKeyframesCSS(\n name: string,\n steps: KeyframesSteps,\n): string {\n const cssSteps = stepsToCSS(steps);\n return `@keyframes ${name} { ${cssSteps} }`;\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"format-keyframes.js","names":[],"sources":["../../src/ssr/format-keyframes.ts"],"sourcesContent":["/**\n * Format @keyframes CSS rules for SSR output.\n *\n * Replicates the stepsToCSS logic from SheetManager but as a\n * standalone function that doesn't need DOM access.\n */\n\nimport type { KeyframesSteps } from '../injector/types';\nimport { createStyle, STYLE_HANDLER_MAP } from '../styles';\nimport type { CSSMap, StyleHandler, StyleValueStateMap } from '../utils/styles';\n\n/**\n * Convert keyframes steps to a CSS string.\n * Replicates SheetManager.stepsToCSS() without the class instance.\n */\nfunction stepsToCSS(steps: KeyframesSteps): string {\n const rules: string[] = [];\n\n for (const [key, value] of Object.entries(steps)) {\n if (typeof value === 'string') {\n rules.push(`${key} { ${value.trim()} }`);\n continue;\n }\n\n const styleMap = (value || {}) as StyleValueStateMap;\n const styleNames = Object.keys(styleMap).sort();\n const handlerQueue: StyleHandler[] = [];\n const seenHandlers = new Set<StyleHandler>();\n\n styleNames.forEach((styleName) => {\n let handlers = STYLE_HANDLER_MAP[styleName];\n if (!handlers) {\n handlers = STYLE_HANDLER_MAP[styleName] = [createStyle(styleName)];\n }\n\n handlers.forEach((handler) => {\n if (!seenHandlers.has(handler)) {\n seenHandlers.add(handler);\n handlerQueue.push(handler);\n }\n });\n });\n\n const declarationPairs: { prop: string; value: string }[] = [];\n\n handlerQueue.forEach((handler) => {\n const lookup = handler.__lookupStyles;\n const filteredMap = lookup.reduce<StyleValueStateMap>((acc, name) => {\n const v = styleMap[name];\n if (v !== undefined) acc[name] = v;\n return acc;\n }, {});\n\n const result = handler(filteredMap);\n if (!result) return;\n\n const results = Array.isArray(result) ? result : [result];\n results.forEach((cssMap) => {\n if (!cssMap || typeof cssMap !== 'object') return;\n const { $: _$, ...props } = cssMap as CSSMap;\n\n Object.entries(props).forEach(([prop, val]) => {\n if (val == null || val === '') return;\n\n if (Array.isArray(val)) {\n val.forEach((v) => {\n if (v != null && v !== '') {\n declarationPairs.push({ prop, value: String(v) });\n }\n });\n } else {\n declarationPairs.push({ prop, value: String(val) });\n }\n });\n });\n });\n\n const declarations = declarationPairs\n .map((d) => `${d.prop}: ${d.value}`)\n .join('; ');\n\n rules.push(`${key} { ${declarations.trim()} }`);\n }\n\n return rules.join(' ');\n}\n\n/**\n * Format a @keyframes rule as a CSS string.\n */\nexport function formatKeyframesCSS(\n name: string,\n steps: KeyframesSteps,\n): string {\n const cssSteps = stepsToCSS(steps);\n return `@keyframes ${name} { ${cssSteps} }`;\n}\n"],"mappings":";;;;;;;AAeA,SAAS,WAAW,OAA+B;CACjD,MAAM,QAAkB,EAAE;AAE1B,MAAK,MAAM,CAAC,KAAK,UAAU,OAAO,QAAQ,MAAM,EAAE;AAChD,MAAI,OAAO,UAAU,UAAU;AAC7B,SAAM,KAAK,GAAG,IAAI,KAAK,MAAM,MAAM,CAAC,IAAI;AACxC;;EAGF,MAAM,WAAY,SAAS,EAAE;EAC7B,MAAM,aAAa,OAAO,KAAK,SAAS,CAAC,MAAM;EAC/C,MAAM,eAA+B,EAAE;EACvC,MAAM,+BAAe,IAAI,KAAmB;AAE5C,aAAW,SAAS,cAAc;GAChC,IAAI,WAAW,kBAAkB;AACjC,OAAI,CAAC,SACH,YAAW,kBAAkB,aAAa,CAAC,YAAY,UAAU,CAAC;AAGpE,YAAS,SAAS,YAAY;AAC5B,QAAI,CAAC,aAAa,IAAI,QAAQ,EAAE;AAC9B,kBAAa,IAAI,QAAQ;AACzB,kBAAa,KAAK,QAAQ;;KAE5B;IACF;EAEF,MAAM,mBAAsD,EAAE;AAE9D,eAAa,SAAS,YAAY;GAQhC,MAAM,SAAS,QAPA,QAAQ,eACI,QAA4B,KAAK,SAAS;IACnE,MAAM,IAAI,SAAS;AACnB,QAAI,MAAM,KAAA,EAAW,KAAI,QAAQ;AACjC,WAAO;MACN,EAAE,CAAC,CAE6B;AACnC,OAAI,CAAC,OAAQ;AAGb,IADgB,MAAM,QAAQ,OAAO,GAAG,SAAS,CAAC,OAAO,EACjD,SAAS,WAAW;AAC1B,QAAI,CAAC,UAAU,OAAO,WAAW,SAAU;IAC3C,MAAM,EAAE,GAAG,IAAI,GAAG,UAAU;AAE5B,WAAO,QAAQ,MAAM,CAAC,SAAS,CAAC,MAAM,SAAS;AAC7C,SAAI,OAAO,QAAQ,QAAQ,GAAI;AAE/B,SAAI,MAAM,QAAQ,IAAI,CACpB,KAAI,SAAS,MAAM;AACjB,UAAI,KAAK,QAAQ,MAAM,GACrB,kBAAiB,KAAK;OAAE;OAAM,OAAO,OAAO,EAAE;OAAE,CAAC;OAEnD;SAEF,kBAAiB,KAAK;MAAE;MAAM,OAAO,OAAO,IAAI;MAAE,CAAC;MAErD;KACF;IACF;EAEF,MAAM,eAAe,iBAClB,KAAK,MAAM,GAAG,EAAE,KAAK,IAAI,EAAE,QAAQ,CACnC,KAAK,KAAK;AAEb,QAAM,KAAK,GAAG,IAAI,KAAK,aAAa,MAAM,CAAC,IAAI;;AAGjD,QAAO,MAAM,KAAK,IAAI;;;;;AAMxB,SAAgB,mBACd,MACA,OACQ;AAER,QAAO,cAAc,KAAK,KADT,WAAW,MAAM,CACM"}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { colorInitialValueToComponents, getColorSpaceSuffix, getComponentPropertySyntax } from "../utils/color-space.js";
|
|
2
2
|
import { getEffectiveDefinition } from "../properties/index.js";
|
|
3
3
|
import { parseStyle } from "../utils/styles.js";
|
|
4
|
-
|
|
5
4
|
//#region src/ssr/format-property.ts
|
|
6
5
|
/**
|
|
7
6
|
* Format a single @property rule as a CSS string.
|
|
@@ -44,7 +43,7 @@ function buildPropertyRule(cssName, definition) {
|
|
|
44
43
|
}
|
|
45
44
|
return `@property ${cssName} { ${parts.join(" ").trim()} }`;
|
|
46
45
|
}
|
|
47
|
-
|
|
48
46
|
//#endregion
|
|
49
47
|
export { formatPropertyCSS };
|
|
48
|
+
|
|
50
49
|
//# sourceMappingURL=format-property.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"format-property.js","names":[],"sources":["../../src/ssr/format-property.ts"],"sourcesContent":["/**\n * Format @property CSS rules for SSR output.\n *\n * Replicates the CSS construction from StyleInjector.property()\n * but returns a CSS string instead of inserting into the DOM.\n */\n\nimport type { PropertyDefinition } from '../injector/types';\nimport { getEffectiveDefinition } from '../properties';\nimport {\n colorInitialValueToComponents,\n getColorSpaceSuffix,\n getComponentPropertySyntax,\n} from '../utils/color-space';\nimport type { StyleValue } from '../utils/styles';\nimport { parseStyle } from '../utils/styles';\n\n/**\n * Format a single @property rule as a CSS string.\n *\n * Returns the full `@property --name { ... }` text, or empty string\n * if the token is invalid. For color properties, also returns\n * the companion component property.\n */\nexport function formatPropertyCSS(\n token: string,\n definition: PropertyDefinition,\n): string {\n const result = getEffectiveDefinition(token, definition);\n if (!result.isValid) return '';\n\n const rules: string[] = [];\n\n rules.push(buildPropertyRule(result.cssName, result.definition));\n\n if (result.isColor) {\n const suffix = getColorSpaceSuffix();\n const componentCssName = `${result.cssName}-${suffix}`;\n const componentInitial = colorInitialValueToComponents(\n result.definition.initialValue,\n );\n rules.push(\n buildPropertyRule(componentCssName, {\n syntax: getComponentPropertySyntax(),\n inherits: result.definition.inherits,\n initialValue: componentInitial,\n }),\n );\n }\n\n return rules.join('\\n');\n}\n\nfunction buildPropertyRule(\n cssName: string,\n definition: PropertyDefinition,\n): string {\n const parts: string[] = [];\n\n if (definition.syntax != null) {\n let syntax = String(definition.syntax).trim();\n if (!/^['\"]/u.test(syntax)) syntax = `\"${syntax}\"`;\n parts.push(`syntax: ${syntax};`);\n }\n\n const inherits = definition.inherits ?? true;\n parts.push(`inherits: ${inherits ? 'true' : 'false'};`);\n\n if (definition.initialValue != null) {\n let initialValueStr: string;\n if (typeof definition.initialValue === 'number') {\n initialValueStr = String(definition.initialValue);\n } else {\n initialValueStr = parseStyle(\n definition.initialValue as StyleValue,\n ).output;\n }\n parts.push(`initial-value: ${initialValueStr};`);\n }\n\n const declarations = parts.join(' ').trim();\n return `@property ${cssName} { ${declarations} }`;\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"format-property.js","names":[],"sources":["../../src/ssr/format-property.ts"],"sourcesContent":["/**\n * Format @property CSS rules for SSR output.\n *\n * Replicates the CSS construction from StyleInjector.property()\n * but returns a CSS string instead of inserting into the DOM.\n */\n\nimport type { PropertyDefinition } from '../injector/types';\nimport { getEffectiveDefinition } from '../properties';\nimport {\n colorInitialValueToComponents,\n getColorSpaceSuffix,\n getComponentPropertySyntax,\n} from '../utils/color-space';\nimport type { StyleValue } from '../utils/styles';\nimport { parseStyle } from '../utils/styles';\n\n/**\n * Format a single @property rule as a CSS string.\n *\n * Returns the full `@property --name { ... }` text, or empty string\n * if the token is invalid. For color properties, also returns\n * the companion component property.\n */\nexport function formatPropertyCSS(\n token: string,\n definition: PropertyDefinition,\n): string {\n const result = getEffectiveDefinition(token, definition);\n if (!result.isValid) return '';\n\n const rules: string[] = [];\n\n rules.push(buildPropertyRule(result.cssName, result.definition));\n\n if (result.isColor) {\n const suffix = getColorSpaceSuffix();\n const componentCssName = `${result.cssName}-${suffix}`;\n const componentInitial = colorInitialValueToComponents(\n result.definition.initialValue,\n );\n rules.push(\n buildPropertyRule(componentCssName, {\n syntax: getComponentPropertySyntax(),\n inherits: result.definition.inherits,\n initialValue: componentInitial,\n }),\n );\n }\n\n return rules.join('\\n');\n}\n\nfunction buildPropertyRule(\n cssName: string,\n definition: PropertyDefinition,\n): string {\n const parts: string[] = [];\n\n if (definition.syntax != null) {\n let syntax = String(definition.syntax).trim();\n if (!/^['\"]/u.test(syntax)) syntax = `\"${syntax}\"`;\n parts.push(`syntax: ${syntax};`);\n }\n\n const inherits = definition.inherits ?? true;\n parts.push(`inherits: ${inherits ? 'true' : 'false'};`);\n\n if (definition.initialValue != null) {\n let initialValueStr: string;\n if (typeof definition.initialValue === 'number') {\n initialValueStr = String(definition.initialValue);\n } else {\n initialValueStr = parseStyle(\n definition.initialValue as StyleValue,\n ).output;\n }\n parts.push(`initial-value: ${initialValueStr};`);\n }\n\n const declarations = parts.join(' ').trim();\n return `@property ${cssName} { ${declarations} }`;\n}\n"],"mappings":";;;;;;;;;;;AAwBA,SAAgB,kBACd,OACA,YACQ;CACR,MAAM,SAAS,uBAAuB,OAAO,WAAW;AACxD,KAAI,CAAC,OAAO,QAAS,QAAO;CAE5B,MAAM,QAAkB,EAAE;AAE1B,OAAM,KAAK,kBAAkB,OAAO,SAAS,OAAO,WAAW,CAAC;AAEhE,KAAI,OAAO,SAAS;EAClB,MAAM,SAAS,qBAAqB;EACpC,MAAM,mBAAmB,GAAG,OAAO,QAAQ,GAAG;EAC9C,MAAM,mBAAmB,8BACvB,OAAO,WAAW,aACnB;AACD,QAAM,KACJ,kBAAkB,kBAAkB;GAClC,QAAQ,4BAA4B;GACpC,UAAU,OAAO,WAAW;GAC5B,cAAc;GACf,CAAC,CACH;;AAGH,QAAO,MAAM,KAAK,KAAK;;AAGzB,SAAS,kBACP,SACA,YACQ;CACR,MAAM,QAAkB,EAAE;AAE1B,KAAI,WAAW,UAAU,MAAM;EAC7B,IAAI,SAAS,OAAO,WAAW,OAAO,CAAC,MAAM;AAC7C,MAAI,CAAC,SAAS,KAAK,OAAO,CAAE,UAAS,IAAI,OAAO;AAChD,QAAM,KAAK,WAAW,OAAO,GAAG;;CAGlC,MAAM,WAAW,WAAW,YAAY;AACxC,OAAM,KAAK,aAAa,WAAW,SAAS,QAAQ,GAAG;AAEvD,KAAI,WAAW,gBAAgB,MAAM;EACnC,IAAI;AACJ,MAAI,OAAO,WAAW,iBAAiB,SACrC,mBAAkB,OAAO,WAAW,aAAa;MAEjD,mBAAkB,WAChB,WAAW,aACZ,CAAC;AAEJ,QAAM,KAAK,kBAAkB,gBAAgB,GAAG;;AAIlD,QAAO,aAAa,QAAQ,KADP,MAAM,KAAK,IAAI,CAAC,MAAM,CACG"}
|
package/dist/ssr/format-rules.js
CHANGED
package/dist/ssr/hydrate.js
CHANGED
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { getGlobalInjector } from "../config.js";
|
|
2
|
-
|
|
3
2
|
//#region src/ssr/hydrate.ts
|
|
4
3
|
/**
|
|
5
4
|
* Client-side cache hydration for SSR.
|
|
@@ -44,7 +43,7 @@ function hydrateTastyCache(state) {
|
|
|
44
43
|
registry.refCounts.set(className, 0);
|
|
45
44
|
}
|
|
46
45
|
}
|
|
47
|
-
|
|
48
46
|
//#endregion
|
|
49
47
|
export { hydrateTastyCache };
|
|
48
|
+
|
|
50
49
|
//# sourceMappingURL=hydrate.js.map
|
package/dist/ssr/hydrate.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hydrate.js","names":[],"sources":["../../src/ssr/hydrate.ts"],"sourcesContent":["/**\n * Client-side cache hydration for SSR.\n *\n * Pre-populates the client injector's cacheKeyToClassName map from the\n * server's serialized state. This ensures that useStyles() returns\n * cache hits during hydration, skipping the entire rendering pipeline.\n */\n\nimport { getGlobalInjector } from '../config';\nimport type { SSRCacheState } from './collector';\n\ndeclare global {\n interface Window {\n __TASTY_SSR_CACHE__?: SSRCacheState;\n }\n}\n\n/**\n * Pre-populate the client-side style cache from the server's SSR state.\n *\n * Call this before ReactDOM.hydrateRoot() or ensure it runs before\n * any tasty() component renders on the client.\n *\n * When called without arguments, reads state from:\n * 1. `window.__TASTY_SSR_CACHE__` (streaming — populated by inline scripts)\n * 2. `<script data-tasty-cache>` (non-streaming — JSON payload)\n */\nexport function hydrateTastyCache(state?: SSRCacheState): void {\n if (typeof document === 'undefined') return;\n\n if (!state) {\n state =\n (typeof window !== 'undefined' ? window.__TASTY_SSR_CACHE__ : null) ??\n undefined;\n if (!state) {\n const script = document.querySelector('script[data-tasty-cache]');\n if (script) {\n try {\n state = JSON.parse(script.textContent!) as SSRCacheState;\n } catch {\n return;\n }\n }\n }\n }\n\n if (!state) return;\n\n const injector = getGlobalInjector();\n const registry = injector._sheetManager.getRegistry(document);\n\n registry.classCounter = Math.max(registry.classCounter, state.classCounter);\n\n for (const [cacheKey, className] of Object.entries(state.entries)) {\n registry.cacheKeyToClassName.set(cacheKey, className);\n registry.rules.set(className, {\n className,\n ruleIndex: -2,\n sheetIndex: -2,\n });\n registry.refCounts.set(className, 0);\n }\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"hydrate.js","names":[],"sources":["../../src/ssr/hydrate.ts"],"sourcesContent":["/**\n * Client-side cache hydration for SSR.\n *\n * Pre-populates the client injector's cacheKeyToClassName map from the\n * server's serialized state. This ensures that useStyles() returns\n * cache hits during hydration, skipping the entire rendering pipeline.\n */\n\nimport { getGlobalInjector } from '../config';\nimport type { SSRCacheState } from './collector';\n\ndeclare global {\n interface Window {\n __TASTY_SSR_CACHE__?: SSRCacheState;\n }\n}\n\n/**\n * Pre-populate the client-side style cache from the server's SSR state.\n *\n * Call this before ReactDOM.hydrateRoot() or ensure it runs before\n * any tasty() component renders on the client.\n *\n * When called without arguments, reads state from:\n * 1. `window.__TASTY_SSR_CACHE__` (streaming — populated by inline scripts)\n * 2. `<script data-tasty-cache>` (non-streaming — JSON payload)\n */\nexport function hydrateTastyCache(state?: SSRCacheState): void {\n if (typeof document === 'undefined') return;\n\n if (!state) {\n state =\n (typeof window !== 'undefined' ? window.__TASTY_SSR_CACHE__ : null) ??\n undefined;\n if (!state) {\n const script = document.querySelector('script[data-tasty-cache]');\n if (script) {\n try {\n state = JSON.parse(script.textContent!) as SSRCacheState;\n } catch {\n return;\n }\n }\n }\n }\n\n if (!state) return;\n\n const injector = getGlobalInjector();\n const registry = injector._sheetManager.getRegistry(document);\n\n registry.classCounter = Math.max(registry.classCounter, state.classCounter);\n\n for (const [cacheKey, className] of Object.entries(state.entries)) {\n registry.cacheKeyToClassName.set(cacheKey, className);\n registry.rules.set(className, {\n className,\n ruleIndex: -2,\n sheetIndex: -2,\n });\n registry.refCounts.set(className, 0);\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AA2BA,SAAgB,kBAAkB,OAA6B;AAC7D,KAAI,OAAO,aAAa,YAAa;AAErC,KAAI,CAAC,OAAO;AACV,WACG,OAAO,WAAW,cAAc,OAAO,sBAAsB,SAC9D,KAAA;AACF,MAAI,CAAC,OAAO;GACV,MAAM,SAAS,SAAS,cAAc,2BAA2B;AACjE,OAAI,OACF,KAAI;AACF,YAAQ,KAAK,MAAM,OAAO,YAAa;WACjC;AACN;;;;AAMR,KAAI,CAAC,MAAO;CAGZ,MAAM,WADW,mBAAmB,CACV,cAAc,YAAY,SAAS;AAE7D,UAAS,eAAe,KAAK,IAAI,SAAS,cAAc,MAAM,aAAa;AAE3E,MAAK,MAAM,CAAC,UAAU,cAAc,OAAO,QAAQ,MAAM,QAAQ,EAAE;AACjE,WAAS,oBAAoB,IAAI,UAAU,UAAU;AACrD,WAAS,MAAM,IAAI,WAAW;GAC5B;GACA,WAAW;GACX,YAAY;GACb,CAAC;AACF,WAAS,UAAU,IAAI,WAAW,EAAE"}
|
package/dist/ssr/index.js
CHANGED
|
@@ -3,10 +3,9 @@ import { TastySSRContext } from "./context.js";
|
|
|
3
3
|
import { ServerStyleCollector } from "./collector.js";
|
|
4
4
|
import { getSSRCollector, runWithCollector } from "./async-storage.js";
|
|
5
5
|
import { hydrateTastyCache } from "./hydrate.js";
|
|
6
|
-
|
|
7
6
|
//#region src/ssr/index.ts
|
|
8
7
|
registerSSRCollectorGetter(getSSRCollector);
|
|
9
|
-
|
|
10
8
|
//#endregion
|
|
11
9
|
export { ServerStyleCollector, TastySSRContext, getSSRCollector, hydrateTastyCache, runWithCollector };
|
|
10
|
+
|
|
12
11
|
//# sourceMappingURL=index.js.map
|
package/dist/ssr/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../src/ssr/index.ts"],"sourcesContent":["/**\n * SSR entry point for @tenphi/tasty.\n *\n * Provides the core SSR infrastructure: ServerStyleCollector,\n * React context, AsyncLocalStorage integration, and cache hydration.\n *\n * Import from '@tenphi/tasty/ssr'.\n */\n\n// Core collector\nexport { ServerStyleCollector } from './collector';\nexport type { SSRCacheState } from './collector';\n\n// React context for Next.js streaming\nexport { TastySSRContext } from './context';\n\n// AsyncLocalStorage integration for Astro / generic frameworks\nexport { runWithCollector, getSSRCollector } from './async-storage';\n\n// Client-side cache hydration\nexport { hydrateTastyCache } from './hydrate';\n\n// Register the ALS getter so useStyles can find the collector\n// without importing 'node:async_hooks' in the browser bundle.\nimport { getSSRCollector } from './async-storage';\nimport { registerSSRCollectorGetter } from './ssr-collector-ref';\n\nregisterSSRCollectorGetter(getSSRCollector);\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../src/ssr/index.ts"],"sourcesContent":["/**\n * SSR entry point for @tenphi/tasty.\n *\n * Provides the core SSR infrastructure: ServerStyleCollector,\n * React context, AsyncLocalStorage integration, and cache hydration.\n *\n * Import from '@tenphi/tasty/ssr'.\n */\n\n// Core collector\nexport { ServerStyleCollector } from './collector';\nexport type { SSRCacheState } from './collector';\n\n// React context for Next.js streaming\nexport { TastySSRContext } from './context';\n\n// AsyncLocalStorage integration for Astro / generic frameworks\nexport { runWithCollector, getSSRCollector } from './async-storage';\n\n// Client-side cache hydration\nexport { hydrateTastyCache } from './hydrate';\n\n// Register the ALS getter so useStyles can find the collector\n// without importing 'node:async_hooks' in the browser bundle.\nimport { getSSRCollector } from './async-storage';\nimport { registerSSRCollectorGetter } from './ssr-collector-ref';\n\nregisterSSRCollectorGetter(getSSRCollector);\n"],"mappings":";;;;;;AA2BA,2BAA2B,gBAAgB"}
|
package/dist/ssr/next.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ServerStyleCollector } from "./collector.js";
|
|
2
|
-
import * as react from "react";
|
|
2
|
+
import * as _$react from "react";
|
|
3
3
|
import { ReactNode } from "react";
|
|
4
4
|
|
|
5
5
|
//#region src/ssr/next.d.ts
|
|
@@ -39,7 +39,7 @@ interface TastyRegistryProps {
|
|
|
39
39
|
declare function TastyRegistry({
|
|
40
40
|
children,
|
|
41
41
|
transferCache
|
|
42
|
-
}: TastyRegistryProps): react.FunctionComponentElement<react.ProviderProps<ServerStyleCollector | null>>;
|
|
42
|
+
}: TastyRegistryProps): _$react.FunctionComponentElement<_$react.ProviderProps<ServerStyleCollector | null>>;
|
|
43
43
|
//#endregion
|
|
44
44
|
export { TastyRegistry, TastyRegistryProps };
|
|
45
45
|
//# sourceMappingURL=next.d.ts.map
|
package/dist/ssr/next.js
CHANGED
|
@@ -1,12 +1,11 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
"use client";
|
|
3
2
|
import { getConfig } from "../config.js";
|
|
3
|
+
import { registerSSRCollectorGetter } from "./ssr-collector-ref.js";
|
|
4
4
|
import { TastySSRContext } from "./context.js";
|
|
5
5
|
import { ServerStyleCollector } from "./collector.js";
|
|
6
6
|
import { hydrateTastyCache } from "./hydrate.js";
|
|
7
7
|
import { Fragment, createElement, useState } from "react";
|
|
8
8
|
import { useServerInsertedHTML } from "next/navigation";
|
|
9
|
-
|
|
10
9
|
//#region src/ssr/next.ts
|
|
11
10
|
/**
|
|
12
11
|
* Next.js integration for Tasty SSR.
|
|
@@ -43,7 +42,12 @@ if (typeof window !== "undefined" && window.__TASTY_SSR_CACHE__) hydrateTastyCac
|
|
|
43
42
|
*/
|
|
44
43
|
function TastyRegistry({ children, transferCache = true }) {
|
|
45
44
|
const isClient = typeof window !== "undefined";
|
|
46
|
-
const [collector] = useState(() =>
|
|
45
|
+
const [collector] = useState(() => {
|
|
46
|
+
if (isClient) return null;
|
|
47
|
+
const instance = new ServerStyleCollector();
|
|
48
|
+
registerSSRCollectorGetter(() => instance);
|
|
49
|
+
return instance;
|
|
50
|
+
});
|
|
47
51
|
const nonce = getConfig().nonce;
|
|
48
52
|
useServerInsertedHTML(() => {
|
|
49
53
|
if (!collector) return null;
|
|
@@ -65,7 +69,7 @@ function TastyRegistry({ children, transferCache = true }) {
|
|
|
65
69
|
});
|
|
66
70
|
return createElement(TastySSRContext.Provider, { value: collector }, children);
|
|
67
71
|
}
|
|
68
|
-
|
|
69
72
|
//#endregion
|
|
70
73
|
export { TastyRegistry };
|
|
74
|
+
|
|
71
75
|
//# sourceMappingURL=next.js.map
|
package/dist/ssr/next.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"next.js","names":[],"sources":["../../src/ssr/next.ts"],"sourcesContent":["/**\n * Next.js integration for Tasty SSR.\n *\n * Provides TastyRegistry for App Router (streaming via useServerInsertedHTML)\n * and createTastySSRDocument for Pages Router (non-streaming).\n *\n * Import from '@tenphi/tasty/ssr/next'.\n */\n\n'use client';\n\n/// <reference path=\"./next-navigation.d.ts\" />\n\nimport { createElement, Fragment, useState, type ReactNode } from 'react';\nimport { useServerInsertedHTML } from 'next/navigation';\n\nimport { getConfig } from '../config';\nimport { ServerStyleCollector } from './collector';\nimport { TastySSRContext } from './context';\nimport { hydrateTastyCache } from './hydrate';\n\n// Auto-hydrate on module load (client only).\n// When this module is imported by the TastyRegistry client component,\n// the streaming cache scripts have already populated __TASTY_SSR_CACHE__.\nif (typeof window !== 'undefined' && window.__TASTY_SSR_CACHE__) {\n hydrateTastyCache(window.__TASTY_SSR_CACHE__);\n}\n\nexport interface TastyRegistryProps {\n children: ReactNode;\n /**\n * Whether to embed the cache state script for client hydration.\n * Set to false to skip cache transfer (useful when cache size\n * exceeds the hydration benefit). Default: true.\n */\n transferCache?: boolean;\n}\n\n/**\n * Next.js App Router registry for Tasty SSR.\n *\n * Wraps the component tree with a ServerStyleCollector and flushes\n * collected CSS into the HTML stream via useServerInsertedHTML.\n *\n * @example\n * ```tsx\n * // app/tasty-registry.tsx\n * 'use client';\n * import { TastyRegistry } from '@tenphi/tasty/ssr/next';\n * export default function TastyStyleRegistry({ children }) {\n * return <TastyRegistry>{children}</TastyRegistry>;\n * }\n *\n * // app/layout.tsx\n * import TastyStyleRegistry from './tasty-registry';\n * export default function RootLayout({ children }) {\n * return <html><body>\n * <TastyStyleRegistry>{children}</TastyStyleRegistry>\n * </body></html>;\n * }\n * ```\n */\nexport function TastyRegistry({\n children,\n transferCache = true,\n}: TastyRegistryProps) {\n const isClient = typeof window !== 'undefined';\n\n const [collector] = useState(()
|
|
1
|
+
{"version":3,"file":"next.js","names":[],"sources":["../../src/ssr/next.ts"],"sourcesContent":["/**\n * Next.js integration for Tasty SSR.\n *\n * Provides TastyRegistry for App Router (streaming via useServerInsertedHTML)\n * and createTastySSRDocument for Pages Router (non-streaming).\n *\n * Import from '@tenphi/tasty/ssr/next'.\n */\n\n'use client';\n\n/// <reference path=\"./next-navigation.d.ts\" />\n\nimport { createElement, Fragment, useState, type ReactNode } from 'react';\nimport { useServerInsertedHTML } from 'next/navigation';\n\nimport { getConfig } from '../config';\nimport { ServerStyleCollector } from './collector';\nimport { TastySSRContext } from './context';\nimport { hydrateTastyCache } from './hydrate';\nimport { registerSSRCollectorGetter } from './ssr-collector-ref';\n\n// Auto-hydrate on module load (client only).\n// When this module is imported by the TastyRegistry client component,\n// the streaming cache scripts have already populated __TASTY_SSR_CACHE__.\nif (typeof window !== 'undefined' && window.__TASTY_SSR_CACHE__) {\n hydrateTastyCache(window.__TASTY_SSR_CACHE__);\n}\n\nexport interface TastyRegistryProps {\n children: ReactNode;\n /**\n * Whether to embed the cache state script for client hydration.\n * Set to false to skip cache transfer (useful when cache size\n * exceeds the hydration benefit). Default: true.\n */\n transferCache?: boolean;\n}\n\n/**\n * Next.js App Router registry for Tasty SSR.\n *\n * Wraps the component tree with a ServerStyleCollector and flushes\n * collected CSS into the HTML stream via useServerInsertedHTML.\n *\n * @example\n * ```tsx\n * // app/tasty-registry.tsx\n * 'use client';\n * import { TastyRegistry } from '@tenphi/tasty/ssr/next';\n * export default function TastyStyleRegistry({ children }) {\n * return <TastyRegistry>{children}</TastyRegistry>;\n * }\n *\n * // app/layout.tsx\n * import TastyStyleRegistry from './tasty-registry';\n * export default function RootLayout({ children }) {\n * return <html><body>\n * <TastyStyleRegistry>{children}</TastyStyleRegistry>\n * </body></html>;\n * }\n * ```\n */\nexport function TastyRegistry({\n children,\n transferCache = true,\n}: TastyRegistryProps) {\n const isClient = typeof window !== 'undefined';\n\n const [collector] = useState(() => {\n if (isClient) return null;\n\n const instance = new ServerStyleCollector();\n\n // Register a global getter so that computeStyles() (which doesn't use\n // useContext) can discover this collector during SSR.\n registerSSRCollectorGetter(() => instance);\n\n return instance;\n });\n const nonce = getConfig().nonce;\n\n useServerInsertedHTML(() => {\n if (!collector) return null;\n\n const css = collector.flushCSS();\n const cacheState = collector.getCacheState();\n\n if (!css) return null;\n\n const styleEl = createElement('style', {\n key: 'tasty-ssr-styles',\n 'data-tasty-ssr': '',\n nonce,\n dangerouslySetInnerHTML: { __html: css },\n });\n\n if (!transferCache) return styleEl;\n\n const scriptEl = createElement('script', {\n key: 'tasty-ssr-cache',\n nonce,\n dangerouslySetInnerHTML: {\n __html:\n `(window.__TASTY_SSR_CACHE__=window.__TASTY_SSR_CACHE__||{entries:{},classCounter:0});` +\n `Object.assign(window.__TASTY_SSR_CACHE__.entries,${JSON.stringify(cacheState.entries)});` +\n `window.__TASTY_SSR_CACHE__.classCounter=${cacheState.classCounter};`,\n },\n });\n\n return createElement(Fragment, null, styleEl, scriptEl);\n });\n\n return createElement(\n TastySSRContext.Provider,\n { value: collector },\n children,\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAyBA,IAAI,OAAO,WAAW,eAAe,OAAO,oBAC1C,mBAAkB,OAAO,oBAAoB;;;;;;;;;;;;;;;;;;;;;;;;;AAqC/C,SAAgB,cAAc,EAC5B,UACA,gBAAgB,QACK;CACrB,MAAM,WAAW,OAAO,WAAW;CAEnC,MAAM,CAAC,aAAa,eAAe;AACjC,MAAI,SAAU,QAAO;EAErB,MAAM,WAAW,IAAI,sBAAsB;AAI3C,mCAAiC,SAAS;AAE1C,SAAO;GACP;CACF,MAAM,QAAQ,WAAW,CAAC;AAE1B,6BAA4B;AAC1B,MAAI,CAAC,UAAW,QAAO;EAEvB,MAAM,MAAM,UAAU,UAAU;EAChC,MAAM,aAAa,UAAU,eAAe;AAE5C,MAAI,CAAC,IAAK,QAAO;EAEjB,MAAM,UAAU,cAAc,SAAS;GACrC,KAAK;GACL,kBAAkB;GAClB;GACA,yBAAyB,EAAE,QAAQ,KAAK;GACzC,CAAC;AAEF,MAAI,CAAC,cAAe,QAAO;AAa3B,SAAO,cAAc,UAAU,MAAM,SAXpB,cAAc,UAAU;GACvC,KAAK;GACL;GACA,yBAAyB,EACvB,QACE,yIACoD,KAAK,UAAU,WAAW,QAAQ,CAAC,4CAC5C,WAAW,aAAa,IACtE;GACF,CAAC,CAEqD;GACvD;AAEF,QAAO,cACL,gBAAgB,UAChB,EAAE,OAAO,WAAW,EACpB,SACD"}
|
|
@@ -6,7 +6,7 @@ function registerSSRCollectorGetter(fn) {
|
|
|
6
6
|
function getRegisteredSSRCollector() {
|
|
7
7
|
return _getSSRCollector ? _getSSRCollector() : null;
|
|
8
8
|
}
|
|
9
|
-
|
|
10
9
|
//#endregion
|
|
11
10
|
export { getRegisteredSSRCollector, registerSSRCollectorGetter };
|
|
11
|
+
|
|
12
12
|
//# sourceMappingURL=ssr-collector-ref.js.map
|
package/dist/states/index.js
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { isDevEnv } from "../utils/is-dev-env.js";
|
|
2
2
|
import { hasStylesGenerated } from "../config.js";
|
|
3
|
-
|
|
4
3
|
//#region src/states/index.ts
|
|
5
4
|
/**
|
|
6
5
|
* Advanced State Mapping - Predefined States Management
|
|
@@ -165,7 +164,7 @@ function findTopLevelComma(s) {
|
|
|
165
164
|
else if (s[i] === "," && depth === 0) return i;
|
|
166
165
|
return -1;
|
|
167
166
|
}
|
|
168
|
-
|
|
169
167
|
//#endregion
|
|
170
168
|
export { createStateParserContext, expandDimensionShorthands, expandTastyUnits, extractLocalPredefinedStates, extractPredefinedStateRefs, findTopLevelComma, getGlobalPredefinedStates, resolvePredefinedState, setGlobalPredefinedStates };
|
|
169
|
+
|
|
171
170
|
//# sourceMappingURL=index.js.map
|