@tenphi/tasty 1.1.0 → 1.2.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/config.js +1 -2
- package/dist/config.js.map +1 -1
- package/dist/core/index.d.ts +0 -1
- package/dist/core/index.js +1 -2
- 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 +1 -2
- package/dist/hooks/useCounterStyle.js.map +1 -1
- package/dist/hooks/useFontFace.js +1 -2
- package/dist/hooks/useFontFace.js.map +1 -1
- package/dist/hooks/useGlobalStyles.js +1 -2
- package/dist/hooks/useGlobalStyles.js.map +1 -1
- package/dist/hooks/useKeyframes.js +1 -2
- package/dist/hooks/useKeyframes.js.map +1 -1
- package/dist/hooks/useProperty.js +1 -2
- package/dist/hooks/useProperty.js.map +1 -1
- package/dist/hooks/useRawCSS.js +1 -2
- package/dist/hooks/useRawCSS.js.map +1 -1
- package/dist/hooks/useStyles.js +1 -2
- package/dist/hooks/useStyles.js.map +1 -1
- package/dist/index.d.ts +0 -1
- package/dist/index.js +1 -2
- package/dist/injector/index.js +2 -3
- 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 +1 -2
- 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 +2 -4
- 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 +2 -2
- package/dist/tasty.js +1 -2
- 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.js +2 -3
- 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/styles.md +17 -0
- package/docs/tasty-static.md +87 -0
- package/package.json +11 -6
- 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/debug.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"debug.js","names":[],"sources":["../src/debug.ts"],"sourcesContent":["/* eslint-disable no-console */\nimport { CHUNK_NAMES } from './chunks/definitions';\nimport { getCssTextForNode, injector } from './injector';\nimport type { CacheMetrics, RootRegistry } from './injector/types';\nimport { isDevEnv } from './utils/is-dev-env';\n\ndeclare global {\n interface Window {\n tastyDebug?: typeof tastyDebug;\n }\n}\n\n// ---------------------------------------------------------------------------\n// Types\n// ---------------------------------------------------------------------------\n\ntype CSSTarget =\n | 'all'\n | 'global'\n | 'active'\n | 'unused'\n | 'page'\n | string\n | string[]\n | Element;\n\ninterface DebugOptions {\n root?: Document | ShadowRoot;\n /** Suppress console logging and return data only (default: false) */\n raw?: boolean;\n}\n\ninterface CssOptions extends DebugOptions {\n prettify?: boolean;\n /** Read from stored source CSS (dev-mode only) instead of live CSSOM */\n source?: boolean;\n}\n\ninterface ChunkInfo {\n className: string;\n chunkName: string | null;\n}\n\ninterface InspectResult {\n element?: Element | null;\n classes: string[];\n chunks: ChunkInfo[];\n css: string;\n size: number;\n rules: number;\n}\n\ninterface CacheStatus {\n classes: {\n active: string[];\n unused: string[];\n all: string[];\n };\n metrics: CacheMetrics | null;\n}\n\ninterface ChunkBreakdown {\n byChunk: Record<\n string,\n { classes: string[]; cssSize: number; ruleCount: number }\n >;\n totalChunkTypes: number;\n totalClasses: number;\n}\n\ninterface Summary {\n activeClasses: string[];\n unusedClasses: string[];\n totalStyledClasses: string[];\n\n activeCSSSize: number;\n unusedCSSSize: number;\n globalCSSSize: number;\n rawCSSSize: number;\n keyframesCSSSize: number;\n propertyCSSSize: number;\n totalCSSSize: number;\n\n activeRuleCount: number;\n unusedRuleCount: number;\n globalRuleCount: number;\n rawRuleCount: number;\n keyframesRuleCount: number;\n propertyRuleCount: number;\n totalRuleCount: number;\n\n metrics: CacheMetrics | null;\n definedProperties: string[];\n definedKeyframes: { name: string; refCount: number }[];\n chunkBreakdown: ChunkBreakdown;\n}\n\n// ---------------------------------------------------------------------------\n// Helpers\n// ---------------------------------------------------------------------------\n\nfunction fmtSize(bytes: number): string {\n return bytes > 1024 ? `${(bytes / 1024).toFixed(1)}KB` : `${bytes}B`;\n}\n\nfunction countRules(css: string): number {\n return (css.match(/\\{[^}]*\\}/g) || []).length;\n}\n\nfunction sortTastyClasses(classes: Iterable<string>): string[] {\n return Array.from(classes).sort(\n (a, b) => parseInt(a.slice(1)) - parseInt(b.slice(1)),\n );\n}\n\nfunction getRegistry(\n root: Document | ShadowRoot = document,\n): RootRegistry | undefined {\n return injector.instance._sheetManager?.getRegistry(root);\n}\n\nfunction getUnusedClasses(root: Document | ShadowRoot = document): string[] {\n const registry = getRegistry(root);\n if (!registry) return [];\n const result: string[] = [];\n for (const [cls, rc] of registry.refCounts as Map<string, number>) {\n if (rc === 0) result.push(cls);\n }\n return sortTastyClasses(result);\n}\n\nfunction findDomTastyClasses(root: Document | ShadowRoot = document): string[] {\n const classes = new Set<string>();\n const elements = (root as Document).querySelectorAll?.('[class]') || [];\n elements.forEach((el) => {\n const attr = el.getAttribute('class');\n if (attr) {\n for (const cls of attr.split(/\\s+/)) {\n if (/^t\\d+$/.test(cls)) classes.add(cls);\n }\n }\n });\n return sortTastyClasses(classes);\n}\n\n// ---------------------------------------------------------------------------\n// prettifyCSS — readable output for nested at-rules & comma selectors\n// ---------------------------------------------------------------------------\n\nfunction prettifyCSS(css: string): string {\n if (!css || !css.trim()) return '';\n\n const out: string[] = [];\n let depth = 0;\n const indent = () => ' '.repeat(depth);\n\n let normalized = css.replace(/\\s+/g, ' ').trim();\n // Ensure braces are surrounded by spaces for splitting\n normalized = normalized.replace(/\\s*\\{\\s*/g, ' { ');\n normalized = normalized.replace(/\\s*\\}\\s*/g, ' } ');\n normalized = normalized.replace(/;\\s*/g, '; ');\n\n const tokens = normalized.split(/\\s+/);\n let buf = '';\n\n for (const t of tokens) {\n if (t === '{') {\n // buf contains the selector / at-rule header\n const header = buf.trim();\n if (header) {\n // Split comma-separated selectors onto their own lines\n // but only if the comma is outside parentheses\n const parts = splitOutsideParens(header, ',');\n if (parts.length > 1) {\n out.push(\n parts\n .map((p, idx) =>\n idx === 0\n ? `${indent()}${p.trim()},`\n : `${indent()}${p.trim()}${idx < parts.length - 1 ? ',' : ''}`,\n )\n .join('\\n') + ' {',\n );\n } else {\n out.push(`${indent()}${header} {`);\n }\n } else {\n out.push(`${indent()}{`);\n }\n depth++;\n buf = '';\n } else if (t === '}') {\n // Flush any trailing declarations\n if (buf.trim()) {\n for (const decl of buf.split(';').filter((s) => s.trim())) {\n out.push(`${indent()}${decl.trim()};`);\n }\n buf = '';\n }\n depth = Math.max(0, depth - 1);\n out.push(`${indent()}}`);\n } else if (t.endsWith(';')) {\n buf += ` ${t}`;\n const full = buf.trim();\n if (full) out.push(`${indent()}${full}`);\n buf = '';\n } else {\n buf += ` ${t}`;\n }\n }\n if (buf.trim()) out.push(buf.trim());\n\n return out\n .filter((l) => l.trim())\n .join('\\n')\n .replace(/\\n{3,}/g, '\\n\\n')\n .trim();\n}\n\n/** Split `str` by `sep` only when not inside parentheses */\nfunction splitOutsideParens(str: string, sep: string): string[] {\n const parts: string[] = [];\n let depth = 0;\n let start = 0;\n for (let i = 0; i < str.length; i++) {\n const ch = str[i];\n if (ch === '(') depth++;\n else if (ch === ')') depth--;\n else if (depth === 0 && str.startsWith(sep, i)) {\n parts.push(str.slice(start, i));\n start = i + sep.length;\n }\n }\n parts.push(str.slice(start));\n return parts;\n}\n\n// ---------------------------------------------------------------------------\n// Chunk helpers\n// ---------------------------------------------------------------------------\n\nfunction extractChunkName(cacheKey: string): string | null {\n for (const part of cacheKey.split('\\0')) {\n if (part.startsWith('[states:')) continue;\n if (!part.includes(':') && part.length > 0) return part;\n }\n return null;\n}\n\nfunction getChunkForClass(\n className: string,\n root: Document | ShadowRoot = document,\n): string | null {\n const registry = getRegistry(root);\n if (!registry) return null;\n for (const [key, cn] of registry.cacheKeyToClassName) {\n if (cn === className) return extractChunkName(key);\n }\n return null;\n}\n\nfunction buildChunkBreakdown(\n root: Document | ShadowRoot = document,\n): ChunkBreakdown {\n const registry = getRegistry(root);\n if (!registry) return { byChunk: {}, totalChunkTypes: 0, totalClasses: 0 };\n\n const byChunk: ChunkBreakdown['byChunk'] = {};\n for (const [cacheKey, className] of registry.cacheKeyToClassName) {\n const chunk = extractChunkName(cacheKey) || 'unknown';\n if (!byChunk[chunk])\n byChunk[chunk] = { classes: [], cssSize: 0, ruleCount: 0 };\n byChunk[chunk].classes.push(className);\n const css = injector.instance.getCssTextForClasses([className], { root });\n byChunk[chunk].cssSize += css.length;\n byChunk[chunk].ruleCount += countRules(css);\n }\n\n for (const entry of Object.values(byChunk)) {\n entry.classes = sortTastyClasses(entry.classes);\n }\n\n const totalClasses = Object.values(byChunk).reduce(\n (s, e) => s + e.classes.length,\n 0,\n );\n return {\n byChunk,\n totalChunkTypes: Object.keys(byChunk).length,\n totalClasses,\n };\n}\n\n// ---------------------------------------------------------------------------\n// Global-type CSS helper (internal only)\n// ---------------------------------------------------------------------------\n\nfunction getGlobalTypeCSS(\n type: 'global' | 'raw' | 'keyframes' | 'property',\n root: Document | ShadowRoot = document,\n): { css: string; ruleCount: number; size: number } {\n const registry = getRegistry(root);\n if (!registry) return { css: '', ruleCount: 0, size: 0 };\n\n const chunks: string[] = [];\n let rc = 0;\n\n if (type === 'keyframes') {\n for (const [, entry] of registry.keyframesCache) {\n const info = entry.info;\n const sheet = registry.sheets[info.sheetIndex];\n const ss = sheet?.sheet?.sheet;\n if (ss && info.ruleIndex < ss.cssRules.length) {\n const rule = ss.cssRules[info.ruleIndex];\n if (rule) {\n chunks.push(rule.cssText);\n rc++;\n }\n } else if (info.cssText) {\n chunks.push(info.cssText);\n rc++;\n }\n }\n } else {\n const prefix =\n type === 'global' ? 'global:' : type === 'raw' ? 'raw:' : 'property:';\n for (const [key, ri] of registry.globalRules) {\n if (!key.startsWith(prefix)) continue;\n const sheet = registry.sheets[ri.sheetIndex];\n const ss = sheet?.sheet?.sheet;\n if (ss) {\n const start = Math.max(0, ri.ruleIndex);\n const end = Math.min(\n ss.cssRules.length - 1,\n (ri.endRuleIndex as number) ?? ri.ruleIndex,\n );\n if (start >= 0 && end >= start && start < ss.cssRules.length) {\n for (let i = start; i <= end; i++) {\n const rule = ss.cssRules[i];\n if (rule) {\n chunks.push(rule.cssText);\n rc++;\n }\n }\n }\n } else if (ri.cssText?.length) {\n chunks.push(...ri.cssText);\n rc += ri.cssText.length;\n }\n }\n }\n\n const raw = chunks.join('\\n');\n return { css: prettifyCSS(raw), ruleCount: rc, size: raw.length };\n}\n\n// ---------------------------------------------------------------------------\n// Source CSS (dev-mode RuleInfo.cssText)\n// ---------------------------------------------------------------------------\n\nfunction getSourceCssForClasses(\n classNames: string[],\n root: Document | ShadowRoot = document,\n): string | null {\n const registry = getRegistry(root);\n if (!registry) return null;\n\n const chunks: string[] = [];\n let found = false;\n for (const cls of classNames) {\n const info = registry.rules.get(cls);\n if (info?.cssText?.length) {\n chunks.push(...info.cssText);\n found = true;\n }\n }\n return found ? chunks.join('\\n') : null;\n}\n\n// ---------------------------------------------------------------------------\n// Definitions helper (internal)\n// ---------------------------------------------------------------------------\n\nfunction getDefs(root: Document | ShadowRoot = document) {\n const registry = getRegistry(root);\n let properties: string[] = [];\n if (registry?.injectedProperties) {\n properties = Array.from(\n (registry.injectedProperties as Map<string, string>).keys(),\n ).sort();\n }\n\n const keyframes: { name: string; refCount: number }[] = [];\n if (registry) {\n for (const entry of registry.keyframesCache.values()) {\n keyframes.push({ name: entry.name, refCount: entry.refCount });\n }\n keyframes.sort((a, b) => a.name.localeCompare(b.name));\n }\n\n return { properties, keyframes };\n}\n\n// ---------------------------------------------------------------------------\n// Chunk display order\n// ---------------------------------------------------------------------------\n\nconst CHUNK_ORDER = [\n CHUNK_NAMES.COMBINED,\n CHUNK_NAMES.APPEARANCE,\n CHUNK_NAMES.FONT,\n CHUNK_NAMES.DIMENSION,\n CHUNK_NAMES.DISPLAY,\n CHUNK_NAMES.LAYOUT,\n CHUNK_NAMES.POSITION,\n CHUNK_NAMES.MISC,\n CHUNK_NAMES.SUBCOMPONENTS,\n];\n\n// ---------------------------------------------------------------------------\n// tastyDebug API\n// ---------------------------------------------------------------------------\n\nexport const tastyDebug = {\n css(target: CSSTarget, opts?: CssOptions): string {\n const {\n root = document,\n prettify = true,\n raw = false,\n source = false,\n } = opts || {};\n let css = '';\n\n if (source && typeof target === 'string' && /^t\\d+$/.test(target)) {\n const src = getSourceCssForClasses([target], root);\n if (src) {\n css = src;\n } else {\n if (!raw) {\n console.warn(\n 'tastyDebug: source CSS not available (requires dev mode or TASTY_DEBUG=true). Falling back to live CSSOM.',\n );\n }\n css = injector.instance.getCssTextForClasses([target], { root });\n }\n } else if (source && Array.isArray(target)) {\n const src = getSourceCssForClasses(target, root);\n if (src) {\n css = src;\n } else {\n if (!raw) {\n console.warn(\n 'tastyDebug: source CSS not available. Falling back to live CSSOM.',\n );\n }\n css = injector.instance.getCssTextForClasses(target, { root });\n }\n } else if (typeof target === 'string') {\n if (target === 'all') {\n css = injector.instance.getCssText({ root });\n } else if (target === 'global') {\n css = getGlobalTypeCSS('global', root).css;\n return css; // already prettified\n } else if (target === 'active') {\n const active = findDomTastyClasses(root);\n css = injector.instance.getCssTextForClasses(active, { root });\n } else if (target === 'unused') {\n const unused = getUnusedClasses(root);\n css = injector.instance.getCssTextForClasses(unused, { root });\n } else if (target === 'page') {\n css = getPageCSS(root);\n } else if (/^t\\d+$/.test(target)) {\n css = injector.instance.getCssTextForClasses([target], { root });\n } else {\n const el = (root as Document).querySelector?.(target);\n if (el) css = getCssTextForNode(el, { root });\n }\n } else if (Array.isArray(target)) {\n css = injector.instance.getCssTextForClasses(target, { root });\n } else if (target instanceof Element) {\n css = getCssTextForNode(target, { root });\n }\n\n const result = prettify ? prettifyCSS(css) : css;\n\n if (!raw) {\n const label = Array.isArray(target) ? `[${target.join(', ')}]` : target;\n const rc = countRules(css);\n console.group(`CSS for ${label} (${rc} rules, ${fmtSize(css.length)})`);\n console.log(result || '(empty)');\n console.groupEnd();\n }\n\n return result;\n },\n\n inspect(target: string | Element, opts?: DebugOptions): InspectResult {\n const { root = document, raw = false } = opts || {};\n const element =\n typeof target === 'string'\n ? (root as Document).querySelector?.(target)\n : target;\n\n if (!element) {\n const empty: InspectResult = {\n element: null,\n classes: [],\n chunks: [],\n css: '',\n size: 0,\n rules: 0,\n };\n if (!raw) console.warn('tastyDebug.inspect: element not found');\n return empty;\n }\n\n const classList = element.getAttribute('class') || '';\n const tastyClasses = classList\n .split(/\\s+/)\n .filter((cls) => /^t\\d+$/.test(cls));\n\n const chunks: ChunkInfo[] = tastyClasses.map((className) => ({\n className,\n chunkName: getChunkForClass(className, root),\n }));\n\n const css = getCssTextForNode(element, { root });\n const rules = countRules(css);\n\n const result: InspectResult = {\n element,\n classes: tastyClasses,\n chunks,\n css: prettifyCSS(css),\n size: css.length,\n rules,\n };\n\n if (!raw) {\n const tag = element.tagName.toLowerCase();\n const id = element.id ? `#${element.id}` : '';\n console.group(\n `inspect ${tag}${id} — ${tastyClasses.length} classes, ${rules} rules, ${fmtSize(css.length)}`,\n );\n if (chunks.length) {\n console.log(\n 'Chunks:',\n chunks.map((c) => `${c.className}→${c.chunkName || '?'}`).join(', '),\n );\n }\n console.groupCollapsed('CSS');\n console.log(result.css || '(empty)');\n console.groupEnd();\n console.groupEnd();\n }\n\n return result;\n },\n\n summary(opts?: DebugOptions): Summary {\n const { root = document, raw = false } = opts || {};\n\n const activeClasses = findDomTastyClasses(root);\n const unusedClasses = getUnusedClasses(root);\n const totalStyledClasses = [...activeClasses, ...unusedClasses];\n\n const activeCSS = injector.instance.getCssTextForClasses(activeClasses, {\n root,\n });\n const unusedCSS = injector.instance.getCssTextForClasses(unusedClasses, {\n root,\n });\n const allCSS = injector.instance.getCssText({ root });\n\n const activeRuleCount = countRules(activeCSS);\n const unusedRuleCount = countRules(unusedCSS);\n\n const globalData = getGlobalTypeCSS('global', root);\n const rawData = getGlobalTypeCSS('raw', root);\n const kfData = getGlobalTypeCSS('keyframes', root);\n const propData = getGlobalTypeCSS('property', root);\n\n const totalRuleCount =\n activeRuleCount +\n unusedRuleCount +\n globalData.ruleCount +\n rawData.ruleCount +\n kfData.ruleCount +\n propData.ruleCount;\n\n const metrics = injector.instance.getMetrics({ root });\n const defs = getDefs(root);\n const chunkBreakdown = buildChunkBreakdown(root);\n\n const summary: Summary = {\n activeClasses,\n unusedClasses,\n totalStyledClasses,\n activeCSSSize: activeCSS.length,\n unusedCSSSize: unusedCSS.length,\n globalCSSSize: globalData.size,\n rawCSSSize: rawData.size,\n keyframesCSSSize: kfData.size,\n propertyCSSSize: propData.size,\n totalCSSSize: allCSS.length,\n activeRuleCount,\n unusedRuleCount,\n globalRuleCount: globalData.ruleCount,\n rawRuleCount: rawData.ruleCount,\n keyframesRuleCount: kfData.ruleCount,\n propertyRuleCount: propData.ruleCount,\n totalRuleCount,\n metrics,\n definedProperties: defs.properties,\n definedKeyframes: defs.keyframes,\n chunkBreakdown,\n };\n\n if (!raw) {\n console.group('Tasty Summary');\n console.log(\n `Active: ${activeClasses.length} classes, ${activeRuleCount} rules, ${fmtSize(activeCSS.length)}`,\n );\n console.log(\n `Unused: ${unusedClasses.length} classes, ${unusedRuleCount} rules, ${fmtSize(unusedCSS.length)}`,\n );\n console.log(\n `Global: ${globalData.ruleCount} rules, ${fmtSize(globalData.size)}`,\n );\n if (rawData.ruleCount)\n console.log(\n `Raw: ${rawData.ruleCount} rules, ${fmtSize(rawData.size)}`,\n );\n if (kfData.ruleCount)\n console.log(\n `Keyframes: ${kfData.ruleCount} rules, ${fmtSize(kfData.size)}`,\n );\n if (propData.ruleCount)\n console.log(\n `@property: ${propData.ruleCount} rules, ${fmtSize(propData.size)}`,\n );\n console.log(\n `Total: ${totalStyledClasses.length} classes, ${totalRuleCount} rules, ${fmtSize(allCSS.length)}`,\n );\n\n if (metrics) {\n const total = metrics.hits + metrics.misses;\n const rate = total > 0 ? ((metrics.hits / total) * 100).toFixed(1) : 0;\n console.log(`Cache: ${rate}% hit rate (${total} lookups)`);\n }\n\n if (chunkBreakdown.totalChunkTypes > 0) {\n console.groupCollapsed(\n `Chunks (${chunkBreakdown.totalChunkTypes} types, ${chunkBreakdown.totalClasses} classes)`,\n );\n for (const name of CHUNK_ORDER) {\n const d = chunkBreakdown.byChunk[name];\n if (d)\n console.log(\n ` ${name}: ${d.classes.length} cls, ${d.ruleCount} rules, ${fmtSize(d.cssSize)}`,\n );\n }\n for (const [name, d] of Object.entries(chunkBreakdown.byChunk)) {\n if (!CHUNK_ORDER.includes(name as (typeof CHUNK_ORDER)[number]))\n console.log(\n ` ${name}: ${d.classes.length} cls, ${d.ruleCount} rules, ${fmtSize(d.cssSize)}`,\n );\n }\n console.groupEnd();\n }\n\n if (defs.properties.length || defs.keyframes.length) {\n console.log(\n `Defs: ${defs.properties.length} @property, ${defs.keyframes.length} @keyframes`,\n );\n }\n\n console.groupEnd();\n }\n\n return summary;\n },\n\n chunks(opts?: DebugOptions): ChunkBreakdown {\n const { root = document, raw = false } = opts || {};\n const breakdown = buildChunkBreakdown(root);\n\n if (!raw) {\n console.group(\n `Chunks (${breakdown.totalChunkTypes} types, ${breakdown.totalClasses} classes)`,\n );\n for (const name of CHUNK_ORDER) {\n const d = breakdown.byChunk[name];\n if (d)\n console.log(\n ` ${name}: ${d.classes.length} cls, ${d.ruleCount} rules, ${fmtSize(d.cssSize)}`,\n );\n }\n for (const [name, d] of Object.entries(breakdown.byChunk)) {\n if (!CHUNK_ORDER.includes(name as (typeof CHUNK_ORDER)[number]))\n console.log(\n ` ${name}: ${d.classes.length} cls, ${d.ruleCount} rules, ${fmtSize(d.cssSize)}`,\n );\n }\n console.groupEnd();\n }\n\n return breakdown;\n },\n\n cache(opts?: DebugOptions): CacheStatus {\n const { root = document, raw = false } = opts || {};\n const active = findDomTastyClasses(root);\n const unused = getUnusedClasses(root);\n const metrics = injector.instance.getMetrics({ root });\n\n const status: CacheStatus = {\n classes: { active, unused, all: [...active, ...unused] },\n metrics,\n };\n\n if (!raw) {\n console.group('Cache');\n console.log(`Active: ${active.length}, Unused: ${unused.length}`);\n if (metrics) {\n const total = metrics.hits + metrics.misses;\n const rate = total > 0 ? ((metrics.hits / total) * 100).toFixed(1) : 0;\n console.log(\n `Hits: ${metrics.hits}, Misses: ${metrics.misses}, Rate: ${rate}%`,\n );\n }\n console.groupEnd();\n }\n\n return status;\n },\n\n cleanup(opts?: { root?: Document | ShadowRoot }): void {\n injector.instance.cleanup(opts?.root);\n },\n\n help(): void {\n console.log(`tastyDebug API:\n .summary() — overview (classes, rules, sizes)\n .css(\"active\") — CSS for classes in DOM\n .css(\"t42\") — CSS for a specific class\n .css(\"t42\",{source:1})— original CSS before browser parsing (dev only)\n .css(\".selector\") — CSS for a DOM element\n .inspect(\".selector\") — element details (classes, chunks, rules)\n .chunks() — style chunk breakdown\n .cache() — cache status and metrics\n .cleanup() — force unused style cleanup\nOptions: { raw: true } suppresses logging, { root: shadowRoot } targets Shadow DOM`);\n },\n\n install(): void {\n if (typeof window !== 'undefined' && window.tastyDebug !== tastyDebug) {\n window.tastyDebug = tastyDebug;\n console.log('tastyDebug installed. Run tastyDebug.help() for commands.');\n }\n },\n};\n\n// ---------------------------------------------------------------------------\n// Page CSS (minimal, kept internal)\n// ---------------------------------------------------------------------------\n\nfunction getPageCSS(root: Document | ShadowRoot = document): string {\n const chunks: string[] = [];\n try {\n if ('styleSheets' in root) {\n for (const sheet of Array.from((root as Document).styleSheets)) {\n try {\n if (sheet.cssRules)\n chunks.push(\n Array.from(sheet.cssRules)\n .map((r) => r.cssText)\n .join('\\n'),\n );\n } catch {\n /* cross-origin */\n }\n }\n }\n } catch {\n /* ignore */\n }\n return chunks.join('\\n');\n}\n\n// ---------------------------------------------------------------------------\n// Auto-install in development\n// ---------------------------------------------------------------------------\n\nif (typeof window !== 'undefined' && isDevEnv()) {\n tastyDebug.install();\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"debug.js","names":[],"sources":["../src/debug.ts"],"sourcesContent":["/* eslint-disable no-console */\nimport { CHUNK_NAMES } from './chunks/definitions';\nimport { getCssTextForNode, injector } from './injector';\nimport type { CacheMetrics, RootRegistry } from './injector/types';\nimport { isDevEnv } from './utils/is-dev-env';\n\ndeclare global {\n interface Window {\n tastyDebug?: typeof tastyDebug;\n }\n}\n\n// ---------------------------------------------------------------------------\n// Types\n// ---------------------------------------------------------------------------\n\ntype CSSTarget =\n | 'all'\n | 'global'\n | 'active'\n | 'unused'\n | 'page'\n | string\n | string[]\n | Element;\n\ninterface DebugOptions {\n root?: Document | ShadowRoot;\n /** Suppress console logging and return data only (default: false) */\n raw?: boolean;\n}\n\ninterface CssOptions extends DebugOptions {\n prettify?: boolean;\n /** Read from stored source CSS (dev-mode only) instead of live CSSOM */\n source?: boolean;\n}\n\ninterface ChunkInfo {\n className: string;\n chunkName: string | null;\n}\n\ninterface InspectResult {\n element?: Element | null;\n classes: string[];\n chunks: ChunkInfo[];\n css: string;\n size: number;\n rules: number;\n}\n\ninterface CacheStatus {\n classes: {\n active: string[];\n unused: string[];\n all: string[];\n };\n metrics: CacheMetrics | null;\n}\n\ninterface ChunkBreakdown {\n byChunk: Record<\n string,\n { classes: string[]; cssSize: number; ruleCount: number }\n >;\n totalChunkTypes: number;\n totalClasses: number;\n}\n\ninterface Summary {\n activeClasses: string[];\n unusedClasses: string[];\n totalStyledClasses: string[];\n\n activeCSSSize: number;\n unusedCSSSize: number;\n globalCSSSize: number;\n rawCSSSize: number;\n keyframesCSSSize: number;\n propertyCSSSize: number;\n totalCSSSize: number;\n\n activeRuleCount: number;\n unusedRuleCount: number;\n globalRuleCount: number;\n rawRuleCount: number;\n keyframesRuleCount: number;\n propertyRuleCount: number;\n totalRuleCount: number;\n\n metrics: CacheMetrics | null;\n definedProperties: string[];\n definedKeyframes: { name: string; refCount: number }[];\n chunkBreakdown: ChunkBreakdown;\n}\n\n// ---------------------------------------------------------------------------\n// Helpers\n// ---------------------------------------------------------------------------\n\nfunction fmtSize(bytes: number): string {\n return bytes > 1024 ? `${(bytes / 1024).toFixed(1)}KB` : `${bytes}B`;\n}\n\nfunction countRules(css: string): number {\n return (css.match(/\\{[^}]*\\}/g) || []).length;\n}\n\nfunction sortTastyClasses(classes: Iterable<string>): string[] {\n return Array.from(classes).sort(\n (a, b) => parseInt(a.slice(1)) - parseInt(b.slice(1)),\n );\n}\n\nfunction getRegistry(\n root: Document | ShadowRoot = document,\n): RootRegistry | undefined {\n return injector.instance._sheetManager?.getRegistry(root);\n}\n\nfunction getUnusedClasses(root: Document | ShadowRoot = document): string[] {\n const registry = getRegistry(root);\n if (!registry) return [];\n const result: string[] = [];\n for (const [cls, rc] of registry.refCounts as Map<string, number>) {\n if (rc === 0) result.push(cls);\n }\n return sortTastyClasses(result);\n}\n\nfunction findDomTastyClasses(root: Document | ShadowRoot = document): string[] {\n const classes = new Set<string>();\n const elements = (root as Document).querySelectorAll?.('[class]') || [];\n elements.forEach((el) => {\n const attr = el.getAttribute('class');\n if (attr) {\n for (const cls of attr.split(/\\s+/)) {\n if (/^t\\d+$/.test(cls)) classes.add(cls);\n }\n }\n });\n return sortTastyClasses(classes);\n}\n\n// ---------------------------------------------------------------------------\n// prettifyCSS — readable output for nested at-rules & comma selectors\n// ---------------------------------------------------------------------------\n\nfunction prettifyCSS(css: string): string {\n if (!css || !css.trim()) return '';\n\n const out: string[] = [];\n let depth = 0;\n const indent = () => ' '.repeat(depth);\n\n let normalized = css.replace(/\\s+/g, ' ').trim();\n // Ensure braces are surrounded by spaces for splitting\n normalized = normalized.replace(/\\s*\\{\\s*/g, ' { ');\n normalized = normalized.replace(/\\s*\\}\\s*/g, ' } ');\n normalized = normalized.replace(/;\\s*/g, '; ');\n\n const tokens = normalized.split(/\\s+/);\n let buf = '';\n\n for (const t of tokens) {\n if (t === '{') {\n // buf contains the selector / at-rule header\n const header = buf.trim();\n if (header) {\n // Split comma-separated selectors onto their own lines\n // but only if the comma is outside parentheses\n const parts = splitOutsideParens(header, ',');\n if (parts.length > 1) {\n out.push(\n parts\n .map((p, idx) =>\n idx === 0\n ? `${indent()}${p.trim()},`\n : `${indent()}${p.trim()}${idx < parts.length - 1 ? ',' : ''}`,\n )\n .join('\\n') + ' {',\n );\n } else {\n out.push(`${indent()}${header} {`);\n }\n } else {\n out.push(`${indent()}{`);\n }\n depth++;\n buf = '';\n } else if (t === '}') {\n // Flush any trailing declarations\n if (buf.trim()) {\n for (const decl of buf.split(';').filter((s) => s.trim())) {\n out.push(`${indent()}${decl.trim()};`);\n }\n buf = '';\n }\n depth = Math.max(0, depth - 1);\n out.push(`${indent()}}`);\n } else if (t.endsWith(';')) {\n buf += ` ${t}`;\n const full = buf.trim();\n if (full) out.push(`${indent()}${full}`);\n buf = '';\n } else {\n buf += ` ${t}`;\n }\n }\n if (buf.trim()) out.push(buf.trim());\n\n return out\n .filter((l) => l.trim())\n .join('\\n')\n .replace(/\\n{3,}/g, '\\n\\n')\n .trim();\n}\n\n/** Split `str` by `sep` only when not inside parentheses */\nfunction splitOutsideParens(str: string, sep: string): string[] {\n const parts: string[] = [];\n let depth = 0;\n let start = 0;\n for (let i = 0; i < str.length; i++) {\n const ch = str[i];\n if (ch === '(') depth++;\n else if (ch === ')') depth--;\n else if (depth === 0 && str.startsWith(sep, i)) {\n parts.push(str.slice(start, i));\n start = i + sep.length;\n }\n }\n parts.push(str.slice(start));\n return parts;\n}\n\n// ---------------------------------------------------------------------------\n// Chunk helpers\n// ---------------------------------------------------------------------------\n\nfunction extractChunkName(cacheKey: string): string | null {\n for (const part of cacheKey.split('\\0')) {\n if (part.startsWith('[states:')) continue;\n if (!part.includes(':') && part.length > 0) return part;\n }\n return null;\n}\n\nfunction getChunkForClass(\n className: string,\n root: Document | ShadowRoot = document,\n): string | null {\n const registry = getRegistry(root);\n if (!registry) return null;\n for (const [key, cn] of registry.cacheKeyToClassName) {\n if (cn === className) return extractChunkName(key);\n }\n return null;\n}\n\nfunction buildChunkBreakdown(\n root: Document | ShadowRoot = document,\n): ChunkBreakdown {\n const registry = getRegistry(root);\n if (!registry) return { byChunk: {}, totalChunkTypes: 0, totalClasses: 0 };\n\n const byChunk: ChunkBreakdown['byChunk'] = {};\n for (const [cacheKey, className] of registry.cacheKeyToClassName) {\n const chunk = extractChunkName(cacheKey) || 'unknown';\n if (!byChunk[chunk])\n byChunk[chunk] = { classes: [], cssSize: 0, ruleCount: 0 };\n byChunk[chunk].classes.push(className);\n const css = injector.instance.getCssTextForClasses([className], { root });\n byChunk[chunk].cssSize += css.length;\n byChunk[chunk].ruleCount += countRules(css);\n }\n\n for (const entry of Object.values(byChunk)) {\n entry.classes = sortTastyClasses(entry.classes);\n }\n\n const totalClasses = Object.values(byChunk).reduce(\n (s, e) => s + e.classes.length,\n 0,\n );\n return {\n byChunk,\n totalChunkTypes: Object.keys(byChunk).length,\n totalClasses,\n };\n}\n\n// ---------------------------------------------------------------------------\n// Global-type CSS helper (internal only)\n// ---------------------------------------------------------------------------\n\nfunction getGlobalTypeCSS(\n type: 'global' | 'raw' | 'keyframes' | 'property',\n root: Document | ShadowRoot = document,\n): { css: string; ruleCount: number; size: number } {\n const registry = getRegistry(root);\n if (!registry) return { css: '', ruleCount: 0, size: 0 };\n\n const chunks: string[] = [];\n let rc = 0;\n\n if (type === 'keyframes') {\n for (const [, entry] of registry.keyframesCache) {\n const info = entry.info;\n const sheet = registry.sheets[info.sheetIndex];\n const ss = sheet?.sheet?.sheet;\n if (ss && info.ruleIndex < ss.cssRules.length) {\n const rule = ss.cssRules[info.ruleIndex];\n if (rule) {\n chunks.push(rule.cssText);\n rc++;\n }\n } else if (info.cssText) {\n chunks.push(info.cssText);\n rc++;\n }\n }\n } else {\n const prefix =\n type === 'global' ? 'global:' : type === 'raw' ? 'raw:' : 'property:';\n for (const [key, ri] of registry.globalRules) {\n if (!key.startsWith(prefix)) continue;\n const sheet = registry.sheets[ri.sheetIndex];\n const ss = sheet?.sheet?.sheet;\n if (ss) {\n const start = Math.max(0, ri.ruleIndex);\n const end = Math.min(\n ss.cssRules.length - 1,\n (ri.endRuleIndex as number) ?? ri.ruleIndex,\n );\n if (start >= 0 && end >= start && start < ss.cssRules.length) {\n for (let i = start; i <= end; i++) {\n const rule = ss.cssRules[i];\n if (rule) {\n chunks.push(rule.cssText);\n rc++;\n }\n }\n }\n } else if (ri.cssText?.length) {\n chunks.push(...ri.cssText);\n rc += ri.cssText.length;\n }\n }\n }\n\n const raw = chunks.join('\\n');\n return { css: prettifyCSS(raw), ruleCount: rc, size: raw.length };\n}\n\n// ---------------------------------------------------------------------------\n// Source CSS (dev-mode RuleInfo.cssText)\n// ---------------------------------------------------------------------------\n\nfunction getSourceCssForClasses(\n classNames: string[],\n root: Document | ShadowRoot = document,\n): string | null {\n const registry = getRegistry(root);\n if (!registry) return null;\n\n const chunks: string[] = [];\n let found = false;\n for (const cls of classNames) {\n const info = registry.rules.get(cls);\n if (info?.cssText?.length) {\n chunks.push(...info.cssText);\n found = true;\n }\n }\n return found ? chunks.join('\\n') : null;\n}\n\n// ---------------------------------------------------------------------------\n// Definitions helper (internal)\n// ---------------------------------------------------------------------------\n\nfunction getDefs(root: Document | ShadowRoot = document) {\n const registry = getRegistry(root);\n let properties: string[] = [];\n if (registry?.injectedProperties) {\n properties = Array.from(\n (registry.injectedProperties as Map<string, string>).keys(),\n ).sort();\n }\n\n const keyframes: { name: string; refCount: number }[] = [];\n if (registry) {\n for (const entry of registry.keyframesCache.values()) {\n keyframes.push({ name: entry.name, refCount: entry.refCount });\n }\n keyframes.sort((a, b) => a.name.localeCompare(b.name));\n }\n\n return { properties, keyframes };\n}\n\n// ---------------------------------------------------------------------------\n// Chunk display order\n// ---------------------------------------------------------------------------\n\nconst CHUNK_ORDER = [\n CHUNK_NAMES.COMBINED,\n CHUNK_NAMES.APPEARANCE,\n CHUNK_NAMES.FONT,\n CHUNK_NAMES.DIMENSION,\n CHUNK_NAMES.DISPLAY,\n CHUNK_NAMES.LAYOUT,\n CHUNK_NAMES.POSITION,\n CHUNK_NAMES.MISC,\n CHUNK_NAMES.SUBCOMPONENTS,\n];\n\n// ---------------------------------------------------------------------------\n// tastyDebug API\n// ---------------------------------------------------------------------------\n\nexport const tastyDebug = {\n css(target: CSSTarget, opts?: CssOptions): string {\n const {\n root = document,\n prettify = true,\n raw = false,\n source = false,\n } = opts || {};\n let css = '';\n\n if (source && typeof target === 'string' && /^t\\d+$/.test(target)) {\n const src = getSourceCssForClasses([target], root);\n if (src) {\n css = src;\n } else {\n if (!raw) {\n console.warn(\n 'tastyDebug: source CSS not available (requires dev mode or TASTY_DEBUG=true). Falling back to live CSSOM.',\n );\n }\n css = injector.instance.getCssTextForClasses([target], { root });\n }\n } else if (source && Array.isArray(target)) {\n const src = getSourceCssForClasses(target, root);\n if (src) {\n css = src;\n } else {\n if (!raw) {\n console.warn(\n 'tastyDebug: source CSS not available. Falling back to live CSSOM.',\n );\n }\n css = injector.instance.getCssTextForClasses(target, { root });\n }\n } else if (typeof target === 'string') {\n if (target === 'all') {\n css = injector.instance.getCssText({ root });\n } else if (target === 'global') {\n css = getGlobalTypeCSS('global', root).css;\n return css; // already prettified\n } else if (target === 'active') {\n const active = findDomTastyClasses(root);\n css = injector.instance.getCssTextForClasses(active, { root });\n } else if (target === 'unused') {\n const unused = getUnusedClasses(root);\n css = injector.instance.getCssTextForClasses(unused, { root });\n } else if (target === 'page') {\n css = getPageCSS(root);\n } else if (/^t\\d+$/.test(target)) {\n css = injector.instance.getCssTextForClasses([target], { root });\n } else {\n const el = (root as Document).querySelector?.(target);\n if (el) css = getCssTextForNode(el, { root });\n }\n } else if (Array.isArray(target)) {\n css = injector.instance.getCssTextForClasses(target, { root });\n } else if (target instanceof Element) {\n css = getCssTextForNode(target, { root });\n }\n\n const result = prettify ? prettifyCSS(css) : css;\n\n if (!raw) {\n const label = Array.isArray(target) ? `[${target.join(', ')}]` : target;\n const rc = countRules(css);\n console.group(`CSS for ${label} (${rc} rules, ${fmtSize(css.length)})`);\n console.log(result || '(empty)');\n console.groupEnd();\n }\n\n return result;\n },\n\n inspect(target: string | Element, opts?: DebugOptions): InspectResult {\n const { root = document, raw = false } = opts || {};\n const element =\n typeof target === 'string'\n ? (root as Document).querySelector?.(target)\n : target;\n\n if (!element) {\n const empty: InspectResult = {\n element: null,\n classes: [],\n chunks: [],\n css: '',\n size: 0,\n rules: 0,\n };\n if (!raw) console.warn('tastyDebug.inspect: element not found');\n return empty;\n }\n\n const classList = element.getAttribute('class') || '';\n const tastyClasses = classList\n .split(/\\s+/)\n .filter((cls) => /^t\\d+$/.test(cls));\n\n const chunks: ChunkInfo[] = tastyClasses.map((className) => ({\n className,\n chunkName: getChunkForClass(className, root),\n }));\n\n const css = getCssTextForNode(element, { root });\n const rules = countRules(css);\n\n const result: InspectResult = {\n element,\n classes: tastyClasses,\n chunks,\n css: prettifyCSS(css),\n size: css.length,\n rules,\n };\n\n if (!raw) {\n const tag = element.tagName.toLowerCase();\n const id = element.id ? `#${element.id}` : '';\n console.group(\n `inspect ${tag}${id} — ${tastyClasses.length} classes, ${rules} rules, ${fmtSize(css.length)}`,\n );\n if (chunks.length) {\n console.log(\n 'Chunks:',\n chunks.map((c) => `${c.className}→${c.chunkName || '?'}`).join(', '),\n );\n }\n console.groupCollapsed('CSS');\n console.log(result.css || '(empty)');\n console.groupEnd();\n console.groupEnd();\n }\n\n return result;\n },\n\n summary(opts?: DebugOptions): Summary {\n const { root = document, raw = false } = opts || {};\n\n const activeClasses = findDomTastyClasses(root);\n const unusedClasses = getUnusedClasses(root);\n const totalStyledClasses = [...activeClasses, ...unusedClasses];\n\n const activeCSS = injector.instance.getCssTextForClasses(activeClasses, {\n root,\n });\n const unusedCSS = injector.instance.getCssTextForClasses(unusedClasses, {\n root,\n });\n const allCSS = injector.instance.getCssText({ root });\n\n const activeRuleCount = countRules(activeCSS);\n const unusedRuleCount = countRules(unusedCSS);\n\n const globalData = getGlobalTypeCSS('global', root);\n const rawData = getGlobalTypeCSS('raw', root);\n const kfData = getGlobalTypeCSS('keyframes', root);\n const propData = getGlobalTypeCSS('property', root);\n\n const totalRuleCount =\n activeRuleCount +\n unusedRuleCount +\n globalData.ruleCount +\n rawData.ruleCount +\n kfData.ruleCount +\n propData.ruleCount;\n\n const metrics = injector.instance.getMetrics({ root });\n const defs = getDefs(root);\n const chunkBreakdown = buildChunkBreakdown(root);\n\n const summary: Summary = {\n activeClasses,\n unusedClasses,\n totalStyledClasses,\n activeCSSSize: activeCSS.length,\n unusedCSSSize: unusedCSS.length,\n globalCSSSize: globalData.size,\n rawCSSSize: rawData.size,\n keyframesCSSSize: kfData.size,\n propertyCSSSize: propData.size,\n totalCSSSize: allCSS.length,\n activeRuleCount,\n unusedRuleCount,\n globalRuleCount: globalData.ruleCount,\n rawRuleCount: rawData.ruleCount,\n keyframesRuleCount: kfData.ruleCount,\n propertyRuleCount: propData.ruleCount,\n totalRuleCount,\n metrics,\n definedProperties: defs.properties,\n definedKeyframes: defs.keyframes,\n chunkBreakdown,\n };\n\n if (!raw) {\n console.group('Tasty Summary');\n console.log(\n `Active: ${activeClasses.length} classes, ${activeRuleCount} rules, ${fmtSize(activeCSS.length)}`,\n );\n console.log(\n `Unused: ${unusedClasses.length} classes, ${unusedRuleCount} rules, ${fmtSize(unusedCSS.length)}`,\n );\n console.log(\n `Global: ${globalData.ruleCount} rules, ${fmtSize(globalData.size)}`,\n );\n if (rawData.ruleCount)\n console.log(\n `Raw: ${rawData.ruleCount} rules, ${fmtSize(rawData.size)}`,\n );\n if (kfData.ruleCount)\n console.log(\n `Keyframes: ${kfData.ruleCount} rules, ${fmtSize(kfData.size)}`,\n );\n if (propData.ruleCount)\n console.log(\n `@property: ${propData.ruleCount} rules, ${fmtSize(propData.size)}`,\n );\n console.log(\n `Total: ${totalStyledClasses.length} classes, ${totalRuleCount} rules, ${fmtSize(allCSS.length)}`,\n );\n\n if (metrics) {\n const total = metrics.hits + metrics.misses;\n const rate = total > 0 ? ((metrics.hits / total) * 100).toFixed(1) : 0;\n console.log(`Cache: ${rate}% hit rate (${total} lookups)`);\n }\n\n if (chunkBreakdown.totalChunkTypes > 0) {\n console.groupCollapsed(\n `Chunks (${chunkBreakdown.totalChunkTypes} types, ${chunkBreakdown.totalClasses} classes)`,\n );\n for (const name of CHUNK_ORDER) {\n const d = chunkBreakdown.byChunk[name];\n if (d)\n console.log(\n ` ${name}: ${d.classes.length} cls, ${d.ruleCount} rules, ${fmtSize(d.cssSize)}`,\n );\n }\n for (const [name, d] of Object.entries(chunkBreakdown.byChunk)) {\n if (!CHUNK_ORDER.includes(name as (typeof CHUNK_ORDER)[number]))\n console.log(\n ` ${name}: ${d.classes.length} cls, ${d.ruleCount} rules, ${fmtSize(d.cssSize)}`,\n );\n }\n console.groupEnd();\n }\n\n if (defs.properties.length || defs.keyframes.length) {\n console.log(\n `Defs: ${defs.properties.length} @property, ${defs.keyframes.length} @keyframes`,\n );\n }\n\n console.groupEnd();\n }\n\n return summary;\n },\n\n chunks(opts?: DebugOptions): ChunkBreakdown {\n const { root = document, raw = false } = opts || {};\n const breakdown = buildChunkBreakdown(root);\n\n if (!raw) {\n console.group(\n `Chunks (${breakdown.totalChunkTypes} types, ${breakdown.totalClasses} classes)`,\n );\n for (const name of CHUNK_ORDER) {\n const d = breakdown.byChunk[name];\n if (d)\n console.log(\n ` ${name}: ${d.classes.length} cls, ${d.ruleCount} rules, ${fmtSize(d.cssSize)}`,\n );\n }\n for (const [name, d] of Object.entries(breakdown.byChunk)) {\n if (!CHUNK_ORDER.includes(name as (typeof CHUNK_ORDER)[number]))\n console.log(\n ` ${name}: ${d.classes.length} cls, ${d.ruleCount} rules, ${fmtSize(d.cssSize)}`,\n );\n }\n console.groupEnd();\n }\n\n return breakdown;\n },\n\n cache(opts?: DebugOptions): CacheStatus {\n const { root = document, raw = false } = opts || {};\n const active = findDomTastyClasses(root);\n const unused = getUnusedClasses(root);\n const metrics = injector.instance.getMetrics({ root });\n\n const status: CacheStatus = {\n classes: { active, unused, all: [...active, ...unused] },\n metrics,\n };\n\n if (!raw) {\n console.group('Cache');\n console.log(`Active: ${active.length}, Unused: ${unused.length}`);\n if (metrics) {\n const total = metrics.hits + metrics.misses;\n const rate = total > 0 ? ((metrics.hits / total) * 100).toFixed(1) : 0;\n console.log(\n `Hits: ${metrics.hits}, Misses: ${metrics.misses}, Rate: ${rate}%`,\n );\n }\n console.groupEnd();\n }\n\n return status;\n },\n\n cleanup(opts?: { root?: Document | ShadowRoot }): void {\n injector.instance.cleanup(opts?.root);\n },\n\n help(): void {\n console.log(`tastyDebug API:\n .summary() — overview (classes, rules, sizes)\n .css(\"active\") — CSS for classes in DOM\n .css(\"t42\") — CSS for a specific class\n .css(\"t42\",{source:1})— original CSS before browser parsing (dev only)\n .css(\".selector\") — CSS for a DOM element\n .inspect(\".selector\") — element details (classes, chunks, rules)\n .chunks() — style chunk breakdown\n .cache() — cache status and metrics\n .cleanup() — force unused style cleanup\nOptions: { raw: true } suppresses logging, { root: shadowRoot } targets Shadow DOM`);\n },\n\n install(): void {\n if (typeof window !== 'undefined' && window.tastyDebug !== tastyDebug) {\n window.tastyDebug = tastyDebug;\n console.log('tastyDebug installed. Run tastyDebug.help() for commands.');\n }\n },\n};\n\n// ---------------------------------------------------------------------------\n// Page CSS (minimal, kept internal)\n// ---------------------------------------------------------------------------\n\nfunction getPageCSS(root: Document | ShadowRoot = document): string {\n const chunks: string[] = [];\n try {\n if ('styleSheets' in root) {\n for (const sheet of Array.from((root as Document).styleSheets)) {\n try {\n if (sheet.cssRules)\n chunks.push(\n Array.from(sheet.cssRules)\n .map((r) => r.cssText)\n .join('\\n'),\n );\n } catch {\n /* cross-origin */\n }\n }\n }\n } catch {\n /* ignore */\n }\n return chunks.join('\\n');\n}\n\n// ---------------------------------------------------------------------------\n// Auto-install in development\n// ---------------------------------------------------------------------------\n\nif (typeof window !== 'undefined' && isDevEnv()) {\n tastyDebug.install();\n}\n"],"mappings":"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"}
|
package/dist/font-face/index.js
CHANGED
|
@@ -57,7 +57,7 @@ function fontFaceContentHash(family, descriptors) {
|
|
|
57
57
|
...descriptors
|
|
58
58
|
});
|
|
59
59
|
}
|
|
60
|
-
|
|
61
60
|
//#endregion
|
|
62
61
|
export { extractLocalFontFace, fontFaceContentHash, formatFontFaceDeclarations, formatFontFaceRule, hasLocalFontFace };
|
|
62
|
+
|
|
63
63
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../src/font-face/index.ts"],"sourcesContent":["/**\n * Font Face Utilities\n *\n * Utilities for extracting and processing CSS @font-face definitions in styles.\n * Font-face rules are permanent once injected and do not need cleanup.\n */\n\nimport type { FontFaceDescriptors, FontFaceInput } from '../injector/types';\nimport type { Styles } from '../styles/types';\n\n// ============================================================================\n// Constants\n// ============================================================================\n\nconst FONT_FACE_KEY = '@fontFace';\n\n// ============================================================================\n// Extraction Functions\n// ============================================================================\n\n/**\n * Check if styles object has local @fontFace definition.\n */\nexport function hasLocalFontFace(styles: Styles): boolean {\n return FONT_FACE_KEY in styles;\n}\n\n/**\n * Extract local @fontFace from styles object.\n * Returns null if no local font faces (fast path).\n */\nexport function extractLocalFontFace(\n styles: Styles,\n): Record<string, FontFaceInput> | null {\n const fontFace = styles[FONT_FACE_KEY];\n if (!fontFace || typeof fontFace !== 'object') {\n return null;\n }\n return fontFace as Record<string, FontFaceInput>;\n}\n\n// ============================================================================\n// CSS Formatting\n// ============================================================================\n\nconst FONT_FACE_DESCRIPTOR_MAP: Record<string, string> = {\n fontWeight: 'font-weight',\n fontStyle: 'font-style',\n fontStretch: 'font-stretch',\n fontDisplay: 'font-display',\n unicodeRange: 'unicode-range',\n ascentOverride: 'ascent-override',\n descentOverride: 'descent-override',\n lineGapOverride: 'line-gap-override',\n sizeAdjust: 'size-adjust',\n fontFeatureSettings: 'font-feature-settings',\n fontVariationSettings: 'font-variation-settings',\n};\n\n/**\n * Format the inner declarations of a @font-face rule (no wrapper).\n * Used by the injector which needs selector and declarations separately.\n */\nexport function formatFontFaceDeclarations(\n family: string,\n descriptors: FontFaceDescriptors,\n): string {\n const parts: string[] = [];\n\n parts.push(`font-family: \"${family}\";`);\n parts.push(`src: ${descriptors.src};`);\n\n for (const [key, cssName] of Object.entries(FONT_FACE_DESCRIPTOR_MAP)) {\n const value = descriptors[key as keyof FontFaceDescriptors];\n if (value !== undefined) {\n parts.push(`${cssName}: ${value};`);\n }\n }\n\n return parts.join(' ');\n}\n\n/**\n * Format a single @font-face rule as CSS.\n */\nexport function formatFontFaceRule(\n family: string,\n descriptors: FontFaceDescriptors,\n): string {\n return `@font-face { ${formatFontFaceDeclarations(family, descriptors)} }`;\n}\n\n/**\n * Format all @font-face rules for a family (handles single or array form).\n * Returns an array of CSS strings, one per rule.\n */\nexport function formatFontFaceRules(\n family: string,\n input: FontFaceInput,\n): string[] {\n const descriptors = Array.isArray(input) ? input : [input];\n return descriptors.map((desc) => formatFontFaceRule(family, desc));\n}\n\n/**\n * Generate a content hash for deduplication of a single font-face rule.\n */\nexport function fontFaceContentHash(\n family: string,\n descriptors: FontFaceDescriptors,\n): string {\n return JSON.stringify({ family, ...descriptors });\n}\n"],"mappings":";AAcA,MAAM,gBAAgB;;;;AAStB,SAAgB,iBAAiB,QAAyB;AACxD,QAAO,iBAAiB;;;;;;AAO1B,SAAgB,qBACd,QACsC;CACtC,MAAM,WAAW,OAAO;AACxB,KAAI,CAAC,YAAY,OAAO,aAAa,SACnC,QAAO;AAET,QAAO;;AAOT,MAAM,2BAAmD;CACvD,YAAY;CACZ,WAAW;CACX,aAAa;CACb,aAAa;CACb,cAAc;CACd,gBAAgB;CAChB,iBAAiB;CACjB,iBAAiB;CACjB,YAAY;CACZ,qBAAqB;CACrB,uBAAuB;CACxB;;;;;AAMD,SAAgB,2BACd,QACA,aACQ;CACR,MAAM,QAAkB,EAAE;AAE1B,OAAM,KAAK,iBAAiB,OAAO,IAAI;AACvC,OAAM,KAAK,QAAQ,YAAY,IAAI,GAAG;AAEtC,MAAK,MAAM,CAAC,KAAK,YAAY,OAAO,QAAQ,yBAAyB,EAAE;EACrE,MAAM,QAAQ,YAAY;AAC1B,MAAI,UAAU,
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../src/font-face/index.ts"],"sourcesContent":["/**\n * Font Face Utilities\n *\n * Utilities for extracting and processing CSS @font-face definitions in styles.\n * Font-face rules are permanent once injected and do not need cleanup.\n */\n\nimport type { FontFaceDescriptors, FontFaceInput } from '../injector/types';\nimport type { Styles } from '../styles/types';\n\n// ============================================================================\n// Constants\n// ============================================================================\n\nconst FONT_FACE_KEY = '@fontFace';\n\n// ============================================================================\n// Extraction Functions\n// ============================================================================\n\n/**\n * Check if styles object has local @fontFace definition.\n */\nexport function hasLocalFontFace(styles: Styles): boolean {\n return FONT_FACE_KEY in styles;\n}\n\n/**\n * Extract local @fontFace from styles object.\n * Returns null if no local font faces (fast path).\n */\nexport function extractLocalFontFace(\n styles: Styles,\n): Record<string, FontFaceInput> | null {\n const fontFace = styles[FONT_FACE_KEY];\n if (!fontFace || typeof fontFace !== 'object') {\n return null;\n }\n return fontFace as Record<string, FontFaceInput>;\n}\n\n// ============================================================================\n// CSS Formatting\n// ============================================================================\n\nconst FONT_FACE_DESCRIPTOR_MAP: Record<string, string> = {\n fontWeight: 'font-weight',\n fontStyle: 'font-style',\n fontStretch: 'font-stretch',\n fontDisplay: 'font-display',\n unicodeRange: 'unicode-range',\n ascentOverride: 'ascent-override',\n descentOverride: 'descent-override',\n lineGapOverride: 'line-gap-override',\n sizeAdjust: 'size-adjust',\n fontFeatureSettings: 'font-feature-settings',\n fontVariationSettings: 'font-variation-settings',\n};\n\n/**\n * Format the inner declarations of a @font-face rule (no wrapper).\n * Used by the injector which needs selector and declarations separately.\n */\nexport function formatFontFaceDeclarations(\n family: string,\n descriptors: FontFaceDescriptors,\n): string {\n const parts: string[] = [];\n\n parts.push(`font-family: \"${family}\";`);\n parts.push(`src: ${descriptors.src};`);\n\n for (const [key, cssName] of Object.entries(FONT_FACE_DESCRIPTOR_MAP)) {\n const value = descriptors[key as keyof FontFaceDescriptors];\n if (value !== undefined) {\n parts.push(`${cssName}: ${value};`);\n }\n }\n\n return parts.join(' ');\n}\n\n/**\n * Format a single @font-face rule as CSS.\n */\nexport function formatFontFaceRule(\n family: string,\n descriptors: FontFaceDescriptors,\n): string {\n return `@font-face { ${formatFontFaceDeclarations(family, descriptors)} }`;\n}\n\n/**\n * Format all @font-face rules for a family (handles single or array form).\n * Returns an array of CSS strings, one per rule.\n */\nexport function formatFontFaceRules(\n family: string,\n input: FontFaceInput,\n): string[] {\n const descriptors = Array.isArray(input) ? input : [input];\n return descriptors.map((desc) => formatFontFaceRule(family, desc));\n}\n\n/**\n * Generate a content hash for deduplication of a single font-face rule.\n */\nexport function fontFaceContentHash(\n family: string,\n descriptors: FontFaceDescriptors,\n): string {\n return JSON.stringify({ family, ...descriptors });\n}\n"],"mappings":";AAcA,MAAM,gBAAgB;;;;AAStB,SAAgB,iBAAiB,QAAyB;AACxD,QAAO,iBAAiB;;;;;;AAO1B,SAAgB,qBACd,QACsC;CACtC,MAAM,WAAW,OAAO;AACxB,KAAI,CAAC,YAAY,OAAO,aAAa,SACnC,QAAO;AAET,QAAO;;AAOT,MAAM,2BAAmD;CACvD,YAAY;CACZ,WAAW;CACX,aAAa;CACb,aAAa;CACb,cAAc;CACd,gBAAgB;CAChB,iBAAiB;CACjB,iBAAiB;CACjB,YAAY;CACZ,qBAAqB;CACrB,uBAAuB;CACxB;;;;;AAMD,SAAgB,2BACd,QACA,aACQ;CACR,MAAM,QAAkB,EAAE;AAE1B,OAAM,KAAK,iBAAiB,OAAO,IAAI;AACvC,OAAM,KAAK,QAAQ,YAAY,IAAI,GAAG;AAEtC,MAAK,MAAM,CAAC,KAAK,YAAY,OAAO,QAAQ,yBAAyB,EAAE;EACrE,MAAM,QAAQ,YAAY;AAC1B,MAAI,UAAU,KAAA,EACZ,OAAM,KAAK,GAAG,QAAQ,IAAI,MAAM,GAAG;;AAIvC,QAAO,MAAM,KAAK,IAAI;;;;;AAMxB,SAAgB,mBACd,QACA,aACQ;AACR,QAAO,gBAAgB,2BAA2B,QAAQ,YAAY,CAAC;;;;;AAkBzE,SAAgB,oBACd,QACA,aACQ;AACR,QAAO,KAAK,UAAU;EAAE;EAAQ,GAAG;EAAa,CAAC"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { UseStylesOptions, UseStylesResult, useStyles } from "./useStyles.js";
|
|
2
|
+
import { useGlobalStyles } from "./useGlobalStyles.js";
|
|
3
|
+
import { useRawCSS } from "./useRawCSS.js";
|
|
4
|
+
import { useKeyframes } from "./useKeyframes.js";
|
|
5
|
+
import { UsePropertyOptions, useProperty } from "./useProperty.js";
|
|
6
|
+
import { useFontFace } from "./useFontFace.js";
|
|
7
|
+
import { useCounterStyle } from "./useCounterStyle.js";
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { getRegisteredSSRCollector } from "../ssr/ssr-collector-ref.js";
|
|
2
|
-
|
|
3
2
|
//#region src/hooks/resolve-ssr-collector.ts
|
|
4
3
|
/**
|
|
5
4
|
* Resolve the SSR collector from React context or AsyncLocalStorage.
|
|
@@ -9,7 +8,7 @@ function resolveSSRCollector(reactContext) {
|
|
|
9
8
|
if (reactContext) return reactContext;
|
|
10
9
|
return getRegisteredSSRCollector();
|
|
11
10
|
}
|
|
12
|
-
|
|
13
11
|
//#endregion
|
|
14
12
|
export { resolveSSRCollector };
|
|
13
|
+
|
|
15
14
|
//# sourceMappingURL=resolve-ssr-collector.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"resolve-ssr-collector.js","names":[],"sources":["../../src/hooks/resolve-ssr-collector.ts"],"sourcesContent":["import type { ServerStyleCollector } from '../ssr/collector';\nimport { getRegisteredSSRCollector } from '../ssr/ssr-collector-ref';\n\n/**\n * Resolve the SSR collector from React context or AsyncLocalStorage.\n * Returns null on the client (no collector available).\n */\nexport function resolveSSRCollector(\n reactContext: ServerStyleCollector | null,\n): ServerStyleCollector | null {\n if (reactContext) return reactContext;\n return getRegisteredSSRCollector();\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"resolve-ssr-collector.js","names":[],"sources":["../../src/hooks/resolve-ssr-collector.ts"],"sourcesContent":["import type { ServerStyleCollector } from '../ssr/collector';\nimport { getRegisteredSSRCollector } from '../ssr/ssr-collector-ref';\n\n/**\n * Resolve the SSR collector from React context or AsyncLocalStorage.\n * Returns null on the client (no collector available).\n */\nexport function resolveSSRCollector(\n reactContext: ServerStyleCollector | null,\n): ServerStyleCollector | null {\n if (reactContext) return reactContext;\n return getRegisteredSSRCollector();\n}\n"],"mappings":";;;;;;AAOA,SAAgB,oBACd,cAC6B;AAC7B,KAAI,aAAc,QAAO;AACzB,QAAO,2BAA2B"}
|
|
@@ -3,7 +3,6 @@ import { getGlobalInjector } from "../config.js";
|
|
|
3
3
|
import { resolveSSRCollector } from "./resolve-ssr-collector.js";
|
|
4
4
|
import { TastySSRContext } from "../ssr/context.js";
|
|
5
5
|
import { useContext, useInsertionEffect, useMemo } from "react";
|
|
6
|
-
|
|
7
6
|
//#region src/hooks/useCounterStyle.ts
|
|
8
7
|
let clientCounterStyleCounter = 0;
|
|
9
8
|
function useCounterStyle(descriptorsOrFactory, depsOrOptions, options) {
|
|
@@ -41,7 +40,7 @@ function useCounterStyle(descriptorsOrFactory, depsOrOptions, options) {
|
|
|
41
40
|
]);
|
|
42
41
|
return name;
|
|
43
42
|
}
|
|
44
|
-
|
|
45
43
|
//#endregion
|
|
46
44
|
export { useCounterStyle };
|
|
45
|
+
|
|
47
46
|
//# sourceMappingURL=useCounterStyle.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useCounterStyle.js","names":[],"sources":["../../src/hooks/useCounterStyle.ts"],"sourcesContent":["import { useContext, useInsertionEffect, useMemo } from 'react';\n\nimport { getGlobalInjector } from '../config';\nimport { formatCounterStyleRule } from '../counter-style';\nimport type { CounterStyleDescriptors } from '../injector/types';\nimport { resolveSSRCollector } from './resolve-ssr-collector';\nimport { TastySSRContext } from '../ssr/context';\n\ninterface UseCounterStyleOptions {\n name?: string;\n root?: Document | ShadowRoot;\n}\n\nlet clientCounterStyleCounter = 0;\n\n/**\n * Hook to inject a CSS @counter-style rule and return the generated name.\n * Permanent — no cleanup on unmount. Deduplicates by name.\n *\n * @example Basic usage\n * ```tsx\n * function EmojiList() {\n * const styleName = useCounterStyle({\n * system: 'cyclic',\n * symbols: '\"👍\"',\n * suffix: '\" \"',\n * }, { name: 'thumbs' });\n *\n * return (\n * <ol style={{ listStyleType: styleName }}>\n * <li>First</li>\n * <li>Second</li>\n * </ol>\n * );\n * }\n * ```\n *\n * @example Factory function with dependencies\n * ```tsx\n * function DynamicList({ marker }: { marker: string }) {\n * const styleName = useCounterStyle(\n * () => ({\n * system: 'cyclic',\n * symbols: `\"${marker}\"`,\n * suffix: '\" \"',\n * }),\n * [marker],\n * );\n *\n * return <ol style={{ listStyleType: styleName }}>...</ol>;\n * }\n * ```\n */\n\n// Overload 1: Static descriptors\nexport function useCounterStyle(\n descriptors: CounterStyleDescriptors,\n options?: UseCounterStyleOptions,\n): string;\n\n// Overload 2: Factory function with dependencies\nexport function useCounterStyle(\n factory: () => CounterStyleDescriptors,\n deps: readonly unknown[],\n options?: UseCounterStyleOptions,\n): string;\n\n// Implementation\nexport function useCounterStyle(\n descriptorsOrFactory:\n | CounterStyleDescriptors\n | (() => CounterStyleDescriptors),\n depsOrOptions?: readonly unknown[] | UseCounterStyleOptions,\n options?: UseCounterStyleOptions,\n): string {\n const ssrContextValue = useContext(TastySSRContext);\n const ssrCollector = resolveSSRCollector(ssrContextValue);\n\n const isFactory = typeof descriptorsOrFactory === 'function';\n\n const deps =\n isFactory && Array.isArray(depsOrOptions) ? depsOrOptions : undefined;\n const opts = isFactory\n ? options\n : (depsOrOptions as UseCounterStyleOptions | undefined);\n\n // Stable key for the static path — avoids re-triggering when caller\n // passes an inline object literal with the same content.\n const inputKey = useMemo(\n () => (isFactory ? null : JSON.stringify(descriptorsOrFactory)),\n [isFactory ? null : descriptorsOrFactory],\n );\n\n const descriptorsData = useMemo(\n () => {\n const descriptors = isFactory\n ? (descriptorsOrFactory as () => CounterStyleDescriptors)()\n : (descriptorsOrFactory as CounterStyleDescriptors);\n\n if (!descriptors || !descriptors.system) {\n return null;\n }\n\n return descriptors;\n },\n\n isFactory ? (deps ?? []) : [inputKey],\n );\n\n const name = useMemo(() => {\n if (!descriptorsData) {\n return '';\n }\n\n // SSR path: format and collect, return name without DOM injection\n if (ssrCollector) {\n const actualName = ssrCollector.allocateCounterStyleName(opts?.name);\n const css = formatCounterStyleRule(actualName, descriptorsData);\n ssrCollector.collectCounterStyle(actualName, css);\n return actualName;\n }\n\n // Client path: return the name (injection happens in useInsertionEffect)\n return opts?.name ?? `cs${clientCounterStyleCounter++}`;\n }, [descriptorsData, opts?.name, ssrCollector]);\n\n // Client path: inject via DOM\n useInsertionEffect(() => {\n if (!descriptorsData || !name) return;\n\n const injector = getGlobalInjector();\n injector.counterStyle(name, descriptorsData, { root: opts?.root });\n }, [descriptorsData, name, opts?.root]);\n\n return name;\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"useCounterStyle.js","names":[],"sources":["../../src/hooks/useCounterStyle.ts"],"sourcesContent":["import { useContext, useInsertionEffect, useMemo } from 'react';\n\nimport { getGlobalInjector } from '../config';\nimport { formatCounterStyleRule } from '../counter-style';\nimport type { CounterStyleDescriptors } from '../injector/types';\nimport { resolveSSRCollector } from './resolve-ssr-collector';\nimport { TastySSRContext } from '../ssr/context';\n\ninterface UseCounterStyleOptions {\n name?: string;\n root?: Document | ShadowRoot;\n}\n\nlet clientCounterStyleCounter = 0;\n\n/**\n * Hook to inject a CSS @counter-style rule and return the generated name.\n * Permanent — no cleanup on unmount. Deduplicates by name.\n *\n * @example Basic usage\n * ```tsx\n * function EmojiList() {\n * const styleName = useCounterStyle({\n * system: 'cyclic',\n * symbols: '\"👍\"',\n * suffix: '\" \"',\n * }, { name: 'thumbs' });\n *\n * return (\n * <ol style={{ listStyleType: styleName }}>\n * <li>First</li>\n * <li>Second</li>\n * </ol>\n * );\n * }\n * ```\n *\n * @example Factory function with dependencies\n * ```tsx\n * function DynamicList({ marker }: { marker: string }) {\n * const styleName = useCounterStyle(\n * () => ({\n * system: 'cyclic',\n * symbols: `\"${marker}\"`,\n * suffix: '\" \"',\n * }),\n * [marker],\n * );\n *\n * return <ol style={{ listStyleType: styleName }}>...</ol>;\n * }\n * ```\n */\n\n// Overload 1: Static descriptors\nexport function useCounterStyle(\n descriptors: CounterStyleDescriptors,\n options?: UseCounterStyleOptions,\n): string;\n\n// Overload 2: Factory function with dependencies\nexport function useCounterStyle(\n factory: () => CounterStyleDescriptors,\n deps: readonly unknown[],\n options?: UseCounterStyleOptions,\n): string;\n\n// Implementation\nexport function useCounterStyle(\n descriptorsOrFactory:\n | CounterStyleDescriptors\n | (() => CounterStyleDescriptors),\n depsOrOptions?: readonly unknown[] | UseCounterStyleOptions,\n options?: UseCounterStyleOptions,\n): string {\n const ssrContextValue = useContext(TastySSRContext);\n const ssrCollector = resolveSSRCollector(ssrContextValue);\n\n const isFactory = typeof descriptorsOrFactory === 'function';\n\n const deps =\n isFactory && Array.isArray(depsOrOptions) ? depsOrOptions : undefined;\n const opts = isFactory\n ? options\n : (depsOrOptions as UseCounterStyleOptions | undefined);\n\n // Stable key for the static path — avoids re-triggering when caller\n // passes an inline object literal with the same content.\n const inputKey = useMemo(\n () => (isFactory ? null : JSON.stringify(descriptorsOrFactory)),\n [isFactory ? null : descriptorsOrFactory],\n );\n\n const descriptorsData = useMemo(\n () => {\n const descriptors = isFactory\n ? (descriptorsOrFactory as () => CounterStyleDescriptors)()\n : (descriptorsOrFactory as CounterStyleDescriptors);\n\n if (!descriptors || !descriptors.system) {\n return null;\n }\n\n return descriptors;\n },\n\n isFactory ? (deps ?? []) : [inputKey],\n );\n\n const name = useMemo(() => {\n if (!descriptorsData) {\n return '';\n }\n\n // SSR path: format and collect, return name without DOM injection\n if (ssrCollector) {\n const actualName = ssrCollector.allocateCounterStyleName(opts?.name);\n const css = formatCounterStyleRule(actualName, descriptorsData);\n ssrCollector.collectCounterStyle(actualName, css);\n return actualName;\n }\n\n // Client path: return the name (injection happens in useInsertionEffect)\n return opts?.name ?? `cs${clientCounterStyleCounter++}`;\n }, [descriptorsData, opts?.name, ssrCollector]);\n\n // Client path: inject via DOM\n useInsertionEffect(() => {\n if (!descriptorsData || !name) return;\n\n const injector = getGlobalInjector();\n injector.counterStyle(name, descriptorsData, { root: opts?.root });\n }, [descriptorsData, name, opts?.root]);\n\n return name;\n}\n"],"mappings":";;;;;;AAaA,IAAI,4BAA4B;AAuDhC,SAAgB,gBACd,sBAGA,eACA,SACQ;CAER,MAAM,eAAe,oBADG,WAAW,gBAAgB,CACM;CAEzD,MAAM,YAAY,OAAO,yBAAyB;CAElD,MAAM,OACJ,aAAa,MAAM,QAAQ,cAAc,GAAG,gBAAgB,KAAA;CAC9D,MAAM,OAAO,YACT,UACC;CAIL,MAAM,WAAW,cACR,YAAY,OAAO,KAAK,UAAU,qBAAqB,EAC9D,CAAC,YAAY,OAAO,qBAAqB,CAC1C;CAED,MAAM,kBAAkB,cAChB;EACJ,MAAM,cAAc,YACf,sBAAwD,GACxD;AAEL,MAAI,CAAC,eAAe,CAAC,YAAY,OAC/B,QAAO;AAGT,SAAO;IAGT,YAAa,QAAQ,EAAE,GAAI,CAAC,SAAS,CACtC;CAED,MAAM,OAAO,cAAc;AACzB,MAAI,CAAC,gBACH,QAAO;AAIT,MAAI,cAAc;GAChB,MAAM,aAAa,aAAa,yBAAyB,MAAM,KAAK;GACpE,MAAM,MAAM,uBAAuB,YAAY,gBAAgB;AAC/D,gBAAa,oBAAoB,YAAY,IAAI;AACjD,UAAO;;AAIT,SAAO,MAAM,QAAQ,KAAK;IACzB;EAAC;EAAiB,MAAM;EAAM;EAAa,CAAC;AAG/C,0BAAyB;AACvB,MAAI,CAAC,mBAAmB,CAAC,KAAM;AAEd,qBAAmB,CAC3B,aAAa,MAAM,iBAAiB,EAAE,MAAM,MAAM,MAAM,CAAC;IACjE;EAAC;EAAiB;EAAM,MAAM;EAAK,CAAC;AAEvC,QAAO"}
|
|
@@ -3,7 +3,6 @@ import { getGlobalInjector } from "../config.js";
|
|
|
3
3
|
import { resolveSSRCollector } from "./resolve-ssr-collector.js";
|
|
4
4
|
import { TastySSRContext } from "../ssr/context.js";
|
|
5
5
|
import { useContext, useInsertionEffect, useMemo } from "react";
|
|
6
|
-
|
|
7
6
|
//#region src/hooks/useFontFace.ts
|
|
8
7
|
/**
|
|
9
8
|
* Hook to inject CSS @font-face rules.
|
|
@@ -65,7 +64,7 @@ function useFontFace(family, input, options) {
|
|
|
65
64
|
options?.root
|
|
66
65
|
]);
|
|
67
66
|
}
|
|
68
|
-
|
|
69
67
|
//#endregion
|
|
70
68
|
export { useFontFace };
|
|
69
|
+
|
|
71
70
|
//# sourceMappingURL=useFontFace.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useFontFace.js","names":[],"sources":["../../src/hooks/useFontFace.ts"],"sourcesContent":["import { useContext, useInsertionEffect, useMemo } from 'react';\n\nimport { getGlobalInjector } from '../config';\nimport { fontFaceContentHash, formatFontFaceRule } from '../font-face';\nimport type { FontFaceDescriptors, FontFaceInput } from '../injector/types';\nimport { resolveSSRCollector } from './resolve-ssr-collector';\nimport { TastySSRContext } from '../ssr/context';\n\ninterface UseFontFaceOptions {\n root?: Document | ShadowRoot;\n}\n\n/**\n * Hook to inject CSS @font-face rules.\n * Permanent — no cleanup on unmount. Deduplicates by content hash.\n *\n * @param family - The font-family name\n * @param input - Single descriptor object or array of descriptors (for multiple weights/styles)\n * @param options - Optional settings (e.g. Shadow DOM root)\n *\n * @example Single weight\n * ```tsx\n * function App() {\n * useFontFace('Brand Sans', {\n * src: 'url(\"/fonts/brand-sans.woff2\") format(\"woff2\")',\n * fontWeight: '400 700',\n * fontDisplay: 'swap',\n * });\n *\n * return <div style={{ fontFamily: '\"Brand Sans\", sans-serif' }}>Hello</div>;\n * }\n * ```\n *\n * @example Multiple weights\n * ```tsx\n * function App() {\n * useFontFace('Brand Sans', [\n * { src: 'url(\"/fonts/brand-regular.woff2\") format(\"woff2\")', fontWeight: 400, fontDisplay: 'swap' },\n * { src: 'url(\"/fonts/brand-bold.woff2\") format(\"woff2\")', fontWeight: 700, fontDisplay: 'swap' },\n * ]);\n *\n * return <div style={{ fontFamily: '\"Brand Sans\", sans-serif' }}>Hello</div>;\n * }\n * ```\n */\nexport function useFontFace(\n family: string,\n input: FontFaceInput,\n options?: UseFontFaceOptions,\n): void {\n const ssrContextValue = useContext(TastySSRContext);\n const ssrCollector = resolveSSRCollector(ssrContextValue);\n\n const inputKey = useMemo(() => JSON.stringify(input), [input]);\n\n // SSR path: collect @font-face CSS during render\n useMemo(() => {\n if (!ssrCollector || !family) return;\n\n const descriptors: FontFaceDescriptors[] = Array.isArray(input)\n ? input\n : [input];\n\n for (const desc of descriptors) {\n const hash = fontFaceContentHash(family, desc);\n const css = formatFontFaceRule(family, desc);\n ssrCollector.collectFontFace(hash, css);\n }\n }, [ssrCollector, family, inputKey]);\n\n // Client path: inject via DOM\n useInsertionEffect(() => {\n if (!family) return;\n\n const injector = getGlobalInjector();\n const descriptors: FontFaceDescriptors[] = Array.isArray(input)\n ? input\n : [input];\n\n for (const desc of descriptors) {\n injector.fontFace(family, desc, { root: options?.root });\n }\n }, [family, inputKey, options?.root]);\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"useFontFace.js","names":[],"sources":["../../src/hooks/useFontFace.ts"],"sourcesContent":["import { useContext, useInsertionEffect, useMemo } from 'react';\n\nimport { getGlobalInjector } from '../config';\nimport { fontFaceContentHash, formatFontFaceRule } from '../font-face';\nimport type { FontFaceDescriptors, FontFaceInput } from '../injector/types';\nimport { resolveSSRCollector } from './resolve-ssr-collector';\nimport { TastySSRContext } from '../ssr/context';\n\ninterface UseFontFaceOptions {\n root?: Document | ShadowRoot;\n}\n\n/**\n * Hook to inject CSS @font-face rules.\n * Permanent — no cleanup on unmount. Deduplicates by content hash.\n *\n * @param family - The font-family name\n * @param input - Single descriptor object or array of descriptors (for multiple weights/styles)\n * @param options - Optional settings (e.g. Shadow DOM root)\n *\n * @example Single weight\n * ```tsx\n * function App() {\n * useFontFace('Brand Sans', {\n * src: 'url(\"/fonts/brand-sans.woff2\") format(\"woff2\")',\n * fontWeight: '400 700',\n * fontDisplay: 'swap',\n * });\n *\n * return <div style={{ fontFamily: '\"Brand Sans\", sans-serif' }}>Hello</div>;\n * }\n * ```\n *\n * @example Multiple weights\n * ```tsx\n * function App() {\n * useFontFace('Brand Sans', [\n * { src: 'url(\"/fonts/brand-regular.woff2\") format(\"woff2\")', fontWeight: 400, fontDisplay: 'swap' },\n * { src: 'url(\"/fonts/brand-bold.woff2\") format(\"woff2\")', fontWeight: 700, fontDisplay: 'swap' },\n * ]);\n *\n * return <div style={{ fontFamily: '\"Brand Sans\", sans-serif' }}>Hello</div>;\n * }\n * ```\n */\nexport function useFontFace(\n family: string,\n input: FontFaceInput,\n options?: UseFontFaceOptions,\n): void {\n const ssrContextValue = useContext(TastySSRContext);\n const ssrCollector = resolveSSRCollector(ssrContextValue);\n\n const inputKey = useMemo(() => JSON.stringify(input), [input]);\n\n // SSR path: collect @font-face CSS during render\n useMemo(() => {\n if (!ssrCollector || !family) return;\n\n const descriptors: FontFaceDescriptors[] = Array.isArray(input)\n ? input\n : [input];\n\n for (const desc of descriptors) {\n const hash = fontFaceContentHash(family, desc);\n const css = formatFontFaceRule(family, desc);\n ssrCollector.collectFontFace(hash, css);\n }\n }, [ssrCollector, family, inputKey]);\n\n // Client path: inject via DOM\n useInsertionEffect(() => {\n if (!family) return;\n\n const injector = getGlobalInjector();\n const descriptors: FontFaceDescriptors[] = Array.isArray(input)\n ? input\n : [input];\n\n for (const desc of descriptors) {\n injector.fontFace(family, desc, { root: options?.root });\n }\n }, [family, inputKey, options?.root]);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6CA,SAAgB,YACd,QACA,OACA,SACM;CAEN,MAAM,eAAe,oBADG,WAAW,gBAAgB,CACM;CAEzD,MAAM,WAAW,cAAc,KAAK,UAAU,MAAM,EAAE,CAAC,MAAM,CAAC;AAG9D,eAAc;AACZ,MAAI,CAAC,gBAAgB,CAAC,OAAQ;EAE9B,MAAM,cAAqC,MAAM,QAAQ,MAAM,GAC3D,QACA,CAAC,MAAM;AAEX,OAAK,MAAM,QAAQ,aAAa;GAC9B,MAAM,OAAO,oBAAoB,QAAQ,KAAK;GAC9C,MAAM,MAAM,mBAAmB,QAAQ,KAAK;AAC5C,gBAAa,gBAAgB,MAAM,IAAI;;IAExC;EAAC;EAAc;EAAQ;EAAS,CAAC;AAGpC,0BAAyB;AACvB,MAAI,CAAC,OAAQ;EAEb,MAAM,WAAW,mBAAmB;EACpC,MAAM,cAAqC,MAAM,QAAQ,MAAM,GAC3D,QACA,CAAC,MAAM;AAEX,OAAK,MAAM,QAAQ,YACjB,UAAS,SAAS,QAAQ,MAAM,EAAE,MAAM,SAAS,MAAM,CAAC;IAEzD;EAAC;EAAQ;EAAU,SAAS;EAAK,CAAC"}
|
|
@@ -7,7 +7,6 @@ import { resolveSSRCollector } from "./resolve-ssr-collector.js";
|
|
|
7
7
|
import { TastySSRContext } from "../ssr/context.js";
|
|
8
8
|
import { formatGlobalRules } from "../ssr/format-global-rules.js";
|
|
9
9
|
import { useContext, useInsertionEffect, useMemo, useRef } from "react";
|
|
10
|
-
|
|
11
10
|
//#region src/hooks/useGlobalStyles.ts
|
|
12
11
|
/**
|
|
13
12
|
* Hook to inject global styles for a given selector.
|
|
@@ -73,7 +72,7 @@ function useGlobalStyles(selector, styles) {
|
|
|
73
72
|
};
|
|
74
73
|
}, [styleResults]);
|
|
75
74
|
}
|
|
76
|
-
|
|
77
75
|
//#endregion
|
|
78
76
|
export { useGlobalStyles };
|
|
77
|
+
|
|
79
78
|
//# sourceMappingURL=useGlobalStyles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useGlobalStyles.js","names":[],"sources":["../../src/hooks/useGlobalStyles.ts"],"sourcesContent":["import { useContext, useInsertionEffect, useMemo, useRef } from 'react';\n\nimport { getConfig } from '../config';\nimport { injectGlobal } from '../injector';\nimport type { StyleResult } from '../pipeline';\nimport { renderStyles } from '../pipeline';\nimport { collectAutoInferredProperties } from '../ssr/collect-auto-properties';\nimport { resolveSSRCollector } from './resolve-ssr-collector';\nimport { TastySSRContext } from '../ssr/context';\nimport { formatGlobalRules } from '../ssr/format-global-rules';\nimport type { Styles } from '../styles/types';\nimport { resolveRecipes } from '../utils/resolve-recipes';\n\n/**\n * Hook to inject global styles for a given selector.\n * Useful for styling elements by selector without generating classNames.\n *\n * SSR-aware: when a ServerStyleCollector is available, CSS is collected\n * during the render phase instead of being injected into the DOM.\n *\n * @param selector - CSS selector to apply styles to (e.g., '.my-class', ':root', 'body')\n * @param styles - Tasty styles object\n *\n * @example\n * ```tsx\n * function MyComponent() {\n * useGlobalStyles('.card', {\n * padding: '2x',\n * radius: '1r',\n * fill: '#white',\n * });\n *\n * return <div className=\"card\">Content</div>;\n * }\n * ```\n */\nexport function useGlobalStyles(selector: string, styles?: Styles): void {\n const ssrContextValue = useContext(TastySSRContext);\n const ssrCollector = resolveSSRCollector(ssrContextValue);\n\n const disposeRef = useRef<(() => void) | null>(null);\n\n // Resolve recipes before rendering (zero overhead if no recipes configured)\n const resolvedStyles = useMemo(() => {\n if (!styles) return styles;\n return resolveRecipes(styles);\n }, [styles]);\n\n // Render styles with the provided selector\n // Note: renderStyles overload with selector string returns StyleResult[] directly\n const styleResults = useMemo((): StyleResult[] => {\n if (!resolvedStyles) return [];\n\n if (!selector) {\n if (process.env.NODE_ENV !== 'production') {\n console.warn(\n '[Tasty] useGlobalStyles: selector is required and cannot be empty. ' +\n 'Styles will not be injected.',\n );\n }\n return [];\n }\n\n const result = renderStyles(resolvedStyles, selector);\n return result as StyleResult[];\n }, [resolvedStyles, selector]);\n\n // SSR path: collect CSS during render\n useMemo(() => {\n if (!ssrCollector || styleResults.length === 0) return;\n\n ssrCollector.collectInternals();\n\n const css = formatGlobalRules(styleResults);\n if (css) {\n const key = `global:${selector}:${css.length}:${css.slice(0, 64)}`;\n ssrCollector.collectGlobalStyles(key, css);\n }\n\n if (getConfig().autoPropertyTypes !== false) {\n collectAutoInferredProperties(styleResults, ssrCollector, resolvedStyles);\n }\n }, [ssrCollector, styleResults, selector]);\n\n // Client path: inject via DOM\n useInsertionEffect(() => {\n disposeRef.current?.();\n\n if (styleResults.length > 0) {\n const { dispose } = injectGlobal(styleResults);\n disposeRef.current = dispose;\n } else {\n disposeRef.current = null;\n }\n\n return () => {\n disposeRef.current?.();\n disposeRef.current = null;\n };\n }, [styleResults]);\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"useGlobalStyles.js","names":[],"sources":["../../src/hooks/useGlobalStyles.ts"],"sourcesContent":["import { useContext, useInsertionEffect, useMemo, useRef } from 'react';\n\nimport { getConfig } from '../config';\nimport { injectGlobal } from '../injector';\nimport type { StyleResult } from '../pipeline';\nimport { renderStyles } from '../pipeline';\nimport { collectAutoInferredProperties } from '../ssr/collect-auto-properties';\nimport { resolveSSRCollector } from './resolve-ssr-collector';\nimport { TastySSRContext } from '../ssr/context';\nimport { formatGlobalRules } from '../ssr/format-global-rules';\nimport type { Styles } from '../styles/types';\nimport { resolveRecipes } from '../utils/resolve-recipes';\n\n/**\n * Hook to inject global styles for a given selector.\n * Useful for styling elements by selector without generating classNames.\n *\n * SSR-aware: when a ServerStyleCollector is available, CSS is collected\n * during the render phase instead of being injected into the DOM.\n *\n * @param selector - CSS selector to apply styles to (e.g., '.my-class', ':root', 'body')\n * @param styles - Tasty styles object\n *\n * @example\n * ```tsx\n * function MyComponent() {\n * useGlobalStyles('.card', {\n * padding: '2x',\n * radius: '1r',\n * fill: '#white',\n * });\n *\n * return <div className=\"card\">Content</div>;\n * }\n * ```\n */\nexport function useGlobalStyles(selector: string, styles?: Styles): void {\n const ssrContextValue = useContext(TastySSRContext);\n const ssrCollector = resolveSSRCollector(ssrContextValue);\n\n const disposeRef = useRef<(() => void) | null>(null);\n\n // Resolve recipes before rendering (zero overhead if no recipes configured)\n const resolvedStyles = useMemo(() => {\n if (!styles) return styles;\n return resolveRecipes(styles);\n }, [styles]);\n\n // Render styles with the provided selector\n // Note: renderStyles overload with selector string returns StyleResult[] directly\n const styleResults = useMemo((): StyleResult[] => {\n if (!resolvedStyles) return [];\n\n if (!selector) {\n if (process.env.NODE_ENV !== 'production') {\n console.warn(\n '[Tasty] useGlobalStyles: selector is required and cannot be empty. ' +\n 'Styles will not be injected.',\n );\n }\n return [];\n }\n\n const result = renderStyles(resolvedStyles, selector);\n return result as StyleResult[];\n }, [resolvedStyles, selector]);\n\n // SSR path: collect CSS during render\n useMemo(() => {\n if (!ssrCollector || styleResults.length === 0) return;\n\n ssrCollector.collectInternals();\n\n const css = formatGlobalRules(styleResults);\n if (css) {\n const key = `global:${selector}:${css.length}:${css.slice(0, 64)}`;\n ssrCollector.collectGlobalStyles(key, css);\n }\n\n if (getConfig().autoPropertyTypes !== false) {\n collectAutoInferredProperties(styleResults, ssrCollector, resolvedStyles);\n }\n }, [ssrCollector, styleResults, selector]);\n\n // Client path: inject via DOM\n useInsertionEffect(() => {\n disposeRef.current?.();\n\n if (styleResults.length > 0) {\n const { dispose } = injectGlobal(styleResults);\n disposeRef.current = dispose;\n } else {\n disposeRef.current = null;\n }\n\n return () => {\n disposeRef.current?.();\n disposeRef.current = null;\n };\n }, [styleResults]);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCA,SAAgB,gBAAgB,UAAkB,QAAuB;CAEvE,MAAM,eAAe,oBADG,WAAW,gBAAgB,CACM;CAEzD,MAAM,aAAa,OAA4B,KAAK;CAGpD,MAAM,iBAAiB,cAAc;AACnC,MAAI,CAAC,OAAQ,QAAO;AACpB,SAAO,eAAe,OAAO;IAC5B,CAAC,OAAO,CAAC;CAIZ,MAAM,eAAe,cAA6B;AAChD,MAAI,CAAC,eAAgB,QAAO,EAAE;AAE9B,MAAI,CAAC,UAAU;AAEX,WAAQ,KACN,kGAED;AAEH,UAAO,EAAE;;AAIX,SADe,aAAa,gBAAgB,SAAS;IAEpD,CAAC,gBAAgB,SAAS,CAAC;AAG9B,eAAc;AACZ,MAAI,CAAC,gBAAgB,aAAa,WAAW,EAAG;AAEhD,eAAa,kBAAkB;EAE/B,MAAM,MAAM,kBAAkB,aAAa;AAC3C,MAAI,KAAK;GACP,MAAM,MAAM,UAAU,SAAS,GAAG,IAAI,OAAO,GAAG,IAAI,MAAM,GAAG,GAAG;AAChE,gBAAa,oBAAoB,KAAK,IAAI;;AAG5C,MAAI,WAAW,CAAC,sBAAsB,MACpC,+BAA8B,cAAc,cAAc,eAAe;IAE1E;EAAC;EAAc;EAAc;EAAS,CAAC;AAG1C,0BAAyB;AACvB,aAAW,WAAW;AAEtB,MAAI,aAAa,SAAS,GAAG;GAC3B,MAAM,EAAE,YAAY,aAAa,aAAa;AAC9C,cAAW,UAAU;QAErB,YAAW,UAAU;AAGvB,eAAa;AACX,cAAW,WAAW;AACtB,cAAW,UAAU;;IAEtB,CAAC,aAAa,CAAC"}
|
|
@@ -3,7 +3,6 @@ import { resolveSSRCollector } from "./resolve-ssr-collector.js";
|
|
|
3
3
|
import { TastySSRContext } from "../ssr/context.js";
|
|
4
4
|
import { formatKeyframesCSS } from "../ssr/format-keyframes.js";
|
|
5
5
|
import { useContext, useInsertionEffect, useMemo, useRef } from "react";
|
|
6
|
-
|
|
7
6
|
//#region src/hooks/useKeyframes.ts
|
|
8
7
|
function useKeyframes(stepsOrFactory, depsOrOptions, options) {
|
|
9
8
|
const ssrCollector = resolveSSRCollector(useContext(TastySSRContext));
|
|
@@ -59,7 +58,7 @@ function useKeyframes(stepsOrFactory, depsOrOptions, options) {
|
|
|
59
58
|
]);
|
|
60
59
|
return name;
|
|
61
60
|
}
|
|
62
|
-
|
|
63
61
|
//#endregion
|
|
64
62
|
export { useKeyframes };
|
|
63
|
+
|
|
65
64
|
//# sourceMappingURL=useKeyframes.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useKeyframes.js","names":[],"sources":["../../src/hooks/useKeyframes.ts"],"sourcesContent":["import { useContext, useInsertionEffect, useMemo, useRef } from 'react';\n\nimport { keyframes } from '../injector';\nimport type { KeyframesResult, KeyframesSteps } from '../injector/types';\nimport { resolveSSRCollector } from './resolve-ssr-collector';\nimport { TastySSRContext } from '../ssr/context';\nimport { formatKeyframesCSS } from '../ssr/format-keyframes';\n\ninterface UseKeyframesOptions {\n name?: string;\n root?: Document | ShadowRoot;\n}\n\n/**\n * Hook to inject CSS @keyframes and return the generated animation name.\n * Handles keyframes injection with proper cleanup on unmount or dependency changes.\n *\n * @example Basic usage - steps object is the dependency\n * ```tsx\n * function MyComponent() {\n * const bounce = useKeyframes({\n * '0%': { transform: 'scale(1)' },\n * '50%': { transform: 'scale(1.1)' },\n * '100%': { transform: 'scale(1)' },\n * });\n *\n * return <div style={{ animation: `${bounce} 1s infinite` }}>Bouncing</div>;\n * }\n * ```\n *\n * @example With custom name\n * ```tsx\n * function MyComponent() {\n * const fadeIn = useKeyframes(\n * { from: { opacity: 0 }, to: { opacity: 1 } },\n * { name: 'fadeIn' }\n * );\n *\n * return <div style={{ animation: `${fadeIn} 0.3s ease-out` }}>Fading in</div>;\n * }\n * ```\n *\n * @example Factory function with dependencies\n * ```tsx\n * function MyComponent({ scale }: { scale: number }) {\n * const pulse = useKeyframes(\n * () => ({\n * '0%': { transform: 'scale(1)' },\n * '100%': { transform: `scale(${scale})` },\n * }),\n * [scale]\n * );\n *\n * return <div style={{ animation: `${pulse} 1s infinite` }}>Pulsing</div>;\n * }\n * ```\n */\n\n// Overload 1: Static steps object\nexport function useKeyframes(\n steps: KeyframesSteps,\n options?: UseKeyframesOptions,\n): string;\n\n// Overload 2: Factory function with dependencies\nexport function useKeyframes(\n factory: () => KeyframesSteps,\n deps: readonly unknown[],\n options?: UseKeyframesOptions,\n): string;\n\n// Implementation\nexport function useKeyframes(\n stepsOrFactory: KeyframesSteps | (() => KeyframesSteps),\n depsOrOptions?: readonly unknown[] | UseKeyframesOptions,\n options?: UseKeyframesOptions,\n): string {\n const ssrContextValue = useContext(TastySSRContext);\n const ssrCollector = resolveSSRCollector(ssrContextValue);\n\n // Detect which overload is being used\n const isFactory = typeof stepsOrFactory === '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 UseKeyframesOptions | undefined);\n\n // Memoize the keyframes steps to get a stable reference\n const stepsData = useMemo(\n () => {\n const steps = isFactory\n ? (stepsOrFactory as () => KeyframesSteps)()\n : (stepsOrFactory as KeyframesSteps);\n\n if (!steps || Object.keys(steps).length === 0) {\n return null;\n }\n\n return steps;\n },\n\n isFactory ? (deps ?? []) : [stepsOrFactory],\n );\n\n // Store keyframes results for cleanup (client only)\n const renderResultRef = useRef<KeyframesResult | null>(null);\n const effectResultRef = useRef<KeyframesResult | null>(null);\n\n const name = useMemo(() => {\n if (!stepsData) {\n return '';\n }\n\n // SSR path: format and collect, return name without DOM injection\n if (ssrCollector) {\n const actualName = ssrCollector.allocateKeyframeName(opts?.name);\n const css = formatKeyframesCSS(actualName, stepsData);\n ssrCollector.collectKeyframes(actualName, css);\n return actualName;\n }\n\n // Client path: inject keyframes synchronously for immediate name availability\n renderResultRef.current?.dispose();\n renderResultRef.current = null;\n\n const result = keyframes(stepsData, {\n name: opts?.name,\n root: opts?.root,\n });\n\n renderResultRef.current = result;\n\n return result.toString();\n }, [stepsData, opts?.name, opts?.root, ssrCollector]);\n\n // Client path: handle Strict Mode double-invocation and cleanup\n useInsertionEffect(() => {\n effectResultRef.current?.dispose();\n effectResultRef.current = null;\n\n if (stepsData) {\n const result = keyframes(stepsData, {\n name: opts?.name,\n root: opts?.root,\n });\n effectResultRef.current = result;\n }\n\n return () => {\n effectResultRef.current?.dispose();\n effectResultRef.current = null;\n renderResultRef.current?.dispose();\n renderResultRef.current = null;\n };\n }, [stepsData, opts?.name, opts?.root]);\n\n return name;\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"useKeyframes.js","names":[],"sources":["../../src/hooks/useKeyframes.ts"],"sourcesContent":["import { useContext, useInsertionEffect, useMemo, useRef } from 'react';\n\nimport { keyframes } from '../injector';\nimport type { KeyframesResult, KeyframesSteps } from '../injector/types';\nimport { resolveSSRCollector } from './resolve-ssr-collector';\nimport { TastySSRContext } from '../ssr/context';\nimport { formatKeyframesCSS } from '../ssr/format-keyframes';\n\ninterface UseKeyframesOptions {\n name?: string;\n root?: Document | ShadowRoot;\n}\n\n/**\n * Hook to inject CSS @keyframes and return the generated animation name.\n * Handles keyframes injection with proper cleanup on unmount or dependency changes.\n *\n * @example Basic usage - steps object is the dependency\n * ```tsx\n * function MyComponent() {\n * const bounce = useKeyframes({\n * '0%': { transform: 'scale(1)' },\n * '50%': { transform: 'scale(1.1)' },\n * '100%': { transform: 'scale(1)' },\n * });\n *\n * return <div style={{ animation: `${bounce} 1s infinite` }}>Bouncing</div>;\n * }\n * ```\n *\n * @example With custom name\n * ```tsx\n * function MyComponent() {\n * const fadeIn = useKeyframes(\n * { from: { opacity: 0 }, to: { opacity: 1 } },\n * { name: 'fadeIn' }\n * );\n *\n * return <div style={{ animation: `${fadeIn} 0.3s ease-out` }}>Fading in</div>;\n * }\n * ```\n *\n * @example Factory function with dependencies\n * ```tsx\n * function MyComponent({ scale }: { scale: number }) {\n * const pulse = useKeyframes(\n * () => ({\n * '0%': { transform: 'scale(1)' },\n * '100%': { transform: `scale(${scale})` },\n * }),\n * [scale]\n * );\n *\n * return <div style={{ animation: `${pulse} 1s infinite` }}>Pulsing</div>;\n * }\n * ```\n */\n\n// Overload 1: Static steps object\nexport function useKeyframes(\n steps: KeyframesSteps,\n options?: UseKeyframesOptions,\n): string;\n\n// Overload 2: Factory function with dependencies\nexport function useKeyframes(\n factory: () => KeyframesSteps,\n deps: readonly unknown[],\n options?: UseKeyframesOptions,\n): string;\n\n// Implementation\nexport function useKeyframes(\n stepsOrFactory: KeyframesSteps | (() => KeyframesSteps),\n depsOrOptions?: readonly unknown[] | UseKeyframesOptions,\n options?: UseKeyframesOptions,\n): string {\n const ssrContextValue = useContext(TastySSRContext);\n const ssrCollector = resolveSSRCollector(ssrContextValue);\n\n // Detect which overload is being used\n const isFactory = typeof stepsOrFactory === '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 UseKeyframesOptions | undefined);\n\n // Memoize the keyframes steps to get a stable reference\n const stepsData = useMemo(\n () => {\n const steps = isFactory\n ? (stepsOrFactory as () => KeyframesSteps)()\n : (stepsOrFactory as KeyframesSteps);\n\n if (!steps || Object.keys(steps).length === 0) {\n return null;\n }\n\n return steps;\n },\n\n isFactory ? (deps ?? []) : [stepsOrFactory],\n );\n\n // Store keyframes results for cleanup (client only)\n const renderResultRef = useRef<KeyframesResult | null>(null);\n const effectResultRef = useRef<KeyframesResult | null>(null);\n\n const name = useMemo(() => {\n if (!stepsData) {\n return '';\n }\n\n // SSR path: format and collect, return name without DOM injection\n if (ssrCollector) {\n const actualName = ssrCollector.allocateKeyframeName(opts?.name);\n const css = formatKeyframesCSS(actualName, stepsData);\n ssrCollector.collectKeyframes(actualName, css);\n return actualName;\n }\n\n // Client path: inject keyframes synchronously for immediate name availability\n renderResultRef.current?.dispose();\n renderResultRef.current = null;\n\n const result = keyframes(stepsData, {\n name: opts?.name,\n root: opts?.root,\n });\n\n renderResultRef.current = result;\n\n return result.toString();\n }, [stepsData, opts?.name, opts?.root, ssrCollector]);\n\n // Client path: handle Strict Mode double-invocation and cleanup\n useInsertionEffect(() => {\n effectResultRef.current?.dispose();\n effectResultRef.current = null;\n\n if (stepsData) {\n const result = keyframes(stepsData, {\n name: opts?.name,\n root: opts?.root,\n });\n effectResultRef.current = result;\n }\n\n return () => {\n effectResultRef.current?.dispose();\n effectResultRef.current = null;\n renderResultRef.current?.dispose();\n renderResultRef.current = null;\n };\n }, [stepsData, opts?.name, opts?.root]);\n\n return name;\n}\n"],"mappings":";;;;;;AAwEA,SAAgB,aACd,gBACA,eACA,SACQ;CAER,MAAM,eAAe,oBADG,WAAW,gBAAgB,CACM;CAGzD,MAAM,YAAY,OAAO,mBAAmB;CAG5C,MAAM,OACJ,aAAa,MAAM,QAAQ,cAAc,GAAG,gBAAgB,KAAA;CAC9D,MAAM,OAAO,YACT,UACC;CAGL,MAAM,YAAY,cACV;EACJ,MAAM,QAAQ,YACT,gBAAyC,GACzC;AAEL,MAAI,CAAC,SAAS,OAAO,KAAK,MAAM,CAAC,WAAW,EAC1C,QAAO;AAGT,SAAO;IAGT,YAAa,QAAQ,EAAE,GAAI,CAAC,eAAe,CAC5C;CAGD,MAAM,kBAAkB,OAA+B,KAAK;CAC5D,MAAM,kBAAkB,OAA+B,KAAK;CAE5D,MAAM,OAAO,cAAc;AACzB,MAAI,CAAC,UACH,QAAO;AAIT,MAAI,cAAc;GAChB,MAAM,aAAa,aAAa,qBAAqB,MAAM,KAAK;GAChE,MAAM,MAAM,mBAAmB,YAAY,UAAU;AACrD,gBAAa,iBAAiB,YAAY,IAAI;AAC9C,UAAO;;AAIT,kBAAgB,SAAS,SAAS;AAClC,kBAAgB,UAAU;EAE1B,MAAM,SAAS,UAAU,WAAW;GAClC,MAAM,MAAM;GACZ,MAAM,MAAM;GACb,CAAC;AAEF,kBAAgB,UAAU;AAE1B,SAAO,OAAO,UAAU;IACvB;EAAC;EAAW,MAAM;EAAM,MAAM;EAAM;EAAa,CAAC;AAGrD,0BAAyB;AACvB,kBAAgB,SAAS,SAAS;AAClC,kBAAgB,UAAU;AAE1B,MAAI,UAKF,iBAAgB,UAJD,UAAU,WAAW;GAClC,MAAM,MAAM;GACZ,MAAM,MAAM;GACb,CAAC;AAIJ,eAAa;AACX,mBAAgB,SAAS,SAAS;AAClC,mBAAgB,UAAU;AAC1B,mBAAgB,SAAS,SAAS;AAClC,mBAAgB,UAAU;;IAE3B;EAAC;EAAW,MAAM;EAAM,MAAM;EAAK,CAAC;AAEvC,QAAO"}
|
|
@@ -3,7 +3,6 @@ import { formatPropertyCSS } from "../ssr/format-property.js";
|
|
|
3
3
|
import { resolveSSRCollector } from "./resolve-ssr-collector.js";
|
|
4
4
|
import { TastySSRContext } from "../ssr/context.js";
|
|
5
5
|
import { useContext, useInsertionEffect, useMemo } from "react";
|
|
6
|
-
|
|
7
6
|
//#region src/hooks/useProperty.ts
|
|
8
7
|
/**
|
|
9
8
|
* Hook to register a CSS @property custom property.
|
|
@@ -104,7 +103,7 @@ function useProperty(name, options) {
|
|
|
104
103
|
options?.root
|
|
105
104
|
]);
|
|
106
105
|
}
|
|
107
|
-
|
|
108
106
|
//#endregion
|
|
109
107
|
export { useProperty };
|
|
108
|
+
|
|
110
109
|
//# sourceMappingURL=useProperty.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useProperty.js","names":[],"sources":["../../src/hooks/useProperty.ts"],"sourcesContent":["import { useContext, useInsertionEffect, useMemo } from 'react';\n\nimport { getGlobalInjector } from '../config';\nimport { resolveSSRCollector } from './resolve-ssr-collector';\nimport { TastySSRContext } from '../ssr/context';\nimport { formatPropertyCSS } from '../ssr/format-property';\n\nexport interface UsePropertyOptions {\n /**\n * CSS syntax string for the property (e.g., '<color>', '<length>', '<angle>').\n * For color tokens (#name), this is auto-set to '<color>' and cannot be overridden.\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 * For color tokens (#name), this defaults to 'transparent' if not specified.\n */\n initialValue?: string | number;\n /**\n * Shadow root or document to inject into\n */\n root?: Document | ShadowRoot;\n}\n\n/**\n * Hook to register 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 * The hook ensures the property is only registered once per root.\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 * @param name - The property token ($name, #name) or CSS property name (--name)\n * @param options - Property configuration\n *\n * @example Basic property with token syntax\n * ```tsx\n * function Spinner() {\n * useProperty('$rotation', {\n * syntax: '<angle>',\n * inherits: false,\n * initialValue: '0deg',\n * });\n *\n * return <div className=\"spinner\" />;\n * }\n * ```\n *\n * @example Color property with token syntax (auto-sets syntax)\n * ```tsx\n * function MyComponent() {\n * useProperty('#theme', {\n * initialValue: 'red', // syntax: '<color>' is auto-set\n * });\n *\n * // Now --theme-color can be animated with CSS transitions\n * return <div style={{ '--theme-color': 'blue' } as React.CSSProperties}>Colored</div>;\n * }\n * ```\n *\n * @example Legacy format (still supported)\n * ```tsx\n * function ResizableBox() {\n * useProperty('--box-size', {\n * syntax: '<length>',\n * initialValue: '100px',\n * });\n *\n * return <div style={{ width: 'var(--box-size)' }} />;\n * }\n * ```\n */\nexport function useProperty(name: string, options?: UsePropertyOptions): void {\n const ssrContextValue = useContext(TastySSRContext);\n const ssrCollector = resolveSSRCollector(ssrContextValue);\n\n // Memoize the options to create a stable dependency\n const optionsKey = useMemo(() => {\n if (!options) return '';\n return JSON.stringify({\n syntax: options.syntax,\n inherits: options.inherits,\n initialValue: options.initialValue,\n });\n }, [options?.syntax, options?.inherits, options?.initialValue]);\n\n // SSR path: collect @property CSS during render\n useMemo(() => {\n if (!ssrCollector || !name) return;\n\n ssrCollector.collectInternals();\n\n const css = formatPropertyCSS(name, {\n syntax: options?.syntax,\n inherits: options?.inherits,\n initialValue: options?.initialValue,\n });\n if (css) {\n ssrCollector.collectProperty(name, css);\n }\n }, [ssrCollector, name, optionsKey]);\n\n // Client path: inject via DOM\n useInsertionEffect(() => {\n if (!name) {\n if (process.env.NODE_ENV !== 'production') {\n console.warn(`[Tasty] useProperty: property name is required`);\n }\n return;\n }\n\n const injector = getGlobalInjector();\n\n if (injector.isPropertyDefined(name, { root: options?.root })) {\n return;\n }\n\n injector.property(name, {\n syntax: options?.syntax,\n inherits: options?.inherits,\n initialValue: options?.initialValue,\n root: options?.root,\n });\n }, [name, optionsKey, options?.root]);\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"useProperty.js","names":[],"sources":["../../src/hooks/useProperty.ts"],"sourcesContent":["import { useContext, useInsertionEffect, useMemo } from 'react';\n\nimport { getGlobalInjector } from '../config';\nimport { resolveSSRCollector } from './resolve-ssr-collector';\nimport { TastySSRContext } from '../ssr/context';\nimport { formatPropertyCSS } from '../ssr/format-property';\n\nexport interface UsePropertyOptions {\n /**\n * CSS syntax string for the property (e.g., '<color>', '<length>', '<angle>').\n * For color tokens (#name), this is auto-set to '<color>' and cannot be overridden.\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 * For color tokens (#name), this defaults to 'transparent' if not specified.\n */\n initialValue?: string | number;\n /**\n * Shadow root or document to inject into\n */\n root?: Document | ShadowRoot;\n}\n\n/**\n * Hook to register 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 * The hook ensures the property is only registered once per root.\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 * @param name - The property token ($name, #name) or CSS property name (--name)\n * @param options - Property configuration\n *\n * @example Basic property with token syntax\n * ```tsx\n * function Spinner() {\n * useProperty('$rotation', {\n * syntax: '<angle>',\n * inherits: false,\n * initialValue: '0deg',\n * });\n *\n * return <div className=\"spinner\" />;\n * }\n * ```\n *\n * @example Color property with token syntax (auto-sets syntax)\n * ```tsx\n * function MyComponent() {\n * useProperty('#theme', {\n * initialValue: 'red', // syntax: '<color>' is auto-set\n * });\n *\n * // Now --theme-color can be animated with CSS transitions\n * return <div style={{ '--theme-color': 'blue' } as React.CSSProperties}>Colored</div>;\n * }\n * ```\n *\n * @example Legacy format (still supported)\n * ```tsx\n * function ResizableBox() {\n * useProperty('--box-size', {\n * syntax: '<length>',\n * initialValue: '100px',\n * });\n *\n * return <div style={{ width: 'var(--box-size)' }} />;\n * }\n * ```\n */\nexport function useProperty(name: string, options?: UsePropertyOptions): void {\n const ssrContextValue = useContext(TastySSRContext);\n const ssrCollector = resolveSSRCollector(ssrContextValue);\n\n // Memoize the options to create a stable dependency\n const optionsKey = useMemo(() => {\n if (!options) return '';\n return JSON.stringify({\n syntax: options.syntax,\n inherits: options.inherits,\n initialValue: options.initialValue,\n });\n }, [options?.syntax, options?.inherits, options?.initialValue]);\n\n // SSR path: collect @property CSS during render\n useMemo(() => {\n if (!ssrCollector || !name) return;\n\n ssrCollector.collectInternals();\n\n const css = formatPropertyCSS(name, {\n syntax: options?.syntax,\n inherits: options?.inherits,\n initialValue: options?.initialValue,\n });\n if (css) {\n ssrCollector.collectProperty(name, css);\n }\n }, [ssrCollector, name, optionsKey]);\n\n // Client path: inject via DOM\n useInsertionEffect(() => {\n if (!name) {\n if (process.env.NODE_ENV !== 'production') {\n console.warn(`[Tasty] useProperty: property name is required`);\n }\n return;\n }\n\n const injector = getGlobalInjector();\n\n if (injector.isPropertyDefined(name, { root: options?.root })) {\n return;\n }\n\n injector.property(name, {\n syntax: options?.syntax,\n inherits: options?.inherits,\n initialValue: options?.initialValue,\n root: options?.root,\n });\n }, [name, optionsKey, options?.root]);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkFA,SAAgB,YAAY,MAAc,SAAoC;CAE5E,MAAM,eAAe,oBADG,WAAW,gBAAgB,CACM;CAGzD,MAAM,aAAa,cAAc;AAC/B,MAAI,CAAC,QAAS,QAAO;AACrB,SAAO,KAAK,UAAU;GACpB,QAAQ,QAAQ;GAChB,UAAU,QAAQ;GAClB,cAAc,QAAQ;GACvB,CAAC;IACD;EAAC,SAAS;EAAQ,SAAS;EAAU,SAAS;EAAa,CAAC;AAG/D,eAAc;AACZ,MAAI,CAAC,gBAAgB,CAAC,KAAM;AAE5B,eAAa,kBAAkB;EAE/B,MAAM,MAAM,kBAAkB,MAAM;GAClC,QAAQ,SAAS;GACjB,UAAU,SAAS;GACnB,cAAc,SAAS;GACxB,CAAC;AACF,MAAI,IACF,cAAa,gBAAgB,MAAM,IAAI;IAExC;EAAC;EAAc;EAAM;EAAW,CAAC;AAGpC,0BAAyB;AACvB,MAAI,CAAC,MAAM;AAEP,WAAQ,KAAK,iDAAiD;AAEhE;;EAGF,MAAM,WAAW,mBAAmB;AAEpC,MAAI,SAAS,kBAAkB,MAAM,EAAE,MAAM,SAAS,MAAM,CAAC,CAC3D;AAGF,WAAS,SAAS,MAAM;GACtB,QAAQ,SAAS;GACjB,UAAU,SAAS;GACnB,cAAc,SAAS;GACvB,MAAM,SAAS;GAChB,CAAC;IACD;EAAC;EAAM;EAAY,SAAS;EAAK,CAAC"}
|
package/dist/hooks/useRawCSS.js
CHANGED
|
@@ -2,7 +2,6 @@ import { injectRawCSS } from "../injector/index.js";
|
|
|
2
2
|
import { resolveSSRCollector } from "./resolve-ssr-collector.js";
|
|
3
3
|
import { TastySSRContext } from "../ssr/context.js";
|
|
4
4
|
import { useContext, useInsertionEffect, useMemo, useRef } from "react";
|
|
5
|
-
|
|
6
5
|
//#region src/hooks/useRawCSS.ts
|
|
7
6
|
function useRawCSS(cssOrFactory, depsOrOptions, options) {
|
|
8
7
|
const ssrCollector = resolveSSRCollector(useContext(TastySSRContext));
|
|
@@ -30,7 +29,7 @@ function useRawCSS(cssOrFactory, depsOrOptions, options) {
|
|
|
30
29
|
};
|
|
31
30
|
}, [css, opts?.root]);
|
|
32
31
|
}
|
|
33
|
-
|
|
34
32
|
//#endregion
|
|
35
33
|
export { useRawCSS };
|
|
34
|
+
|
|
36
35
|
//# sourceMappingURL=useRawCSS.js.map
|
|
@@ -1 +1 @@
|
|
|
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 { resolveSSRCollector } from './resolve-ssr-collector';\nimport { TastySSRContext } from '../ssr/context';\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 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":"
|
|
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 { resolveSSRCollector } from './resolve-ssr-collector';\nimport { TastySSRContext } from '../ssr/context';\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 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":";;;;;AAkEA,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,KAAA;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"}
|
package/dist/hooks/useStyles.js
CHANGED
|
@@ -16,7 +16,6 @@ import { TastySSRContext } from "../ssr/context.js";
|
|
|
16
16
|
import { formatKeyframesCSS } from "../ssr/format-keyframes.js";
|
|
17
17
|
import { hasKeys } from "../utils/has-keys.js";
|
|
18
18
|
import { useContext, useInsertionEffect, useMemo, useRef } from "react";
|
|
19
|
-
|
|
20
19
|
//#region src/hooks/useStyles.ts
|
|
21
20
|
/**
|
|
22
21
|
* Render, cache-key, and allocate a className for a single chunk.
|
|
@@ -232,7 +231,7 @@ function useStyles(styles) {
|
|
|
232
231
|
return processedChunks.map((chunk) => chunk.className).join(" ");
|
|
233
232
|
}, [processedChunks]) };
|
|
234
233
|
}
|
|
235
|
-
|
|
236
234
|
//#endregion
|
|
237
235
|
export { useStyles };
|
|
236
|
+
|
|
238
237
|
//# sourceMappingURL=useStyles.js.map
|