@tenphi/tasty 0.0.0-snapshot.d2dcdeb → 0.0.0-snapshot.d4ccea8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (357) hide show
  1. package/README.md +181 -131
  2. package/dist/{ssr/async-storage.js → async-storage-DKK-wTD4.js} +2 -2
  3. package/dist/async-storage-DKK-wTD4.js.map +1 -0
  4. package/dist/babel-eMs_zZjM.d.ts +83 -0
  5. package/dist/{ssr/collector.js → collector-BjkQEtbh.js} +111 -38
  6. package/dist/collector-BjkQEtbh.js.map +1 -0
  7. package/dist/{ssr/collector.d.ts → collector-DzeNxHOq.d.ts} +58 -7
  8. package/dist/config-DMslHK_e.d.ts +1298 -0
  9. package/dist/config-DX126v_w.js +12318 -0
  10. package/dist/config-DX126v_w.js.map +1 -0
  11. package/dist/{ssr/context.js → context-CA8YKeMn.js} +11 -3
  12. package/dist/context-CA8YKeMn.js.map +1 -0
  13. package/dist/core/index.d.ts +5 -34
  14. package/dist/core/index.js +6 -27
  15. package/dist/core-CMn-Tj2X.js +1573 -0
  16. package/dist/core-CMn-Tj2X.js.map +1 -0
  17. package/dist/{zero/extractor.js → css-writer-C8ShXK5R.js} +148 -24
  18. package/dist/css-writer-C8ShXK5R.js.map +1 -0
  19. package/dist/{ssr/format-global-rules.js → format-global-rules-DklyaXv-.js} +2 -2
  20. package/dist/format-global-rules-DklyaXv-.js.map +1 -0
  21. package/dist/{ssr/format-rules.js → format-rules-BkstDvlN.js} +59 -2
  22. package/dist/format-rules-BkstDvlN.js.map +1 -0
  23. package/dist/{ssr/hydrate.js → hydrate-DXXWZgm0.js} +4 -12
  24. package/dist/hydrate-DXXWZgm0.js.map +1 -0
  25. package/dist/index-BcsaHo8x.d.ts +1568 -0
  26. package/dist/index-CC0wykKn.d.ts +1909 -0
  27. package/dist/index.d.ts +5 -51
  28. package/dist/index.js +922 -36
  29. package/dist/index.js.map +1 -0
  30. package/dist/keyframes-Z0YLVOWq.js +493 -0
  31. package/dist/keyframes-Z0YLVOWq.js.map +1 -0
  32. package/dist/{utils/merge-styles.d.ts → merge-styles-BTFAkYSD.d.ts} +3 -3
  33. package/dist/{utils/merge-styles.js → merge-styles-Dpueyn82.js} +3 -4
  34. package/dist/merge-styles-Dpueyn82.js.map +1 -0
  35. package/dist/{utils/resolve-recipes.js → resolve-recipes-B2Vjr7ET.js} +4 -6
  36. package/dist/resolve-recipes-B2Vjr7ET.js.map +1 -0
  37. package/dist/ssr/astro-client.js +1 -1
  38. package/dist/ssr/astro-client.js.map +1 -1
  39. package/dist/ssr/astro-middleware-static.d.ts +16 -0
  40. package/dist/ssr/astro-middleware-static.js +18 -0
  41. package/dist/ssr/astro-middleware-static.js.map +1 -0
  42. package/dist/ssr/astro-middleware.d.ts +8 -6
  43. package/dist/ssr/astro-middleware.js +10 -10
  44. package/dist/ssr/astro-middleware.js.map +1 -1
  45. package/dist/ssr/astro.d.ts +2 -17
  46. package/dist/ssr/astro.js +29 -21
  47. package/dist/ssr/astro.js.map +1 -1
  48. package/dist/ssr/index.d.ts +37 -4
  49. package/dist/ssr/index.js +5 -5
  50. package/dist/ssr/index.js.map +1 -1
  51. package/dist/ssr/next.d.ts +2 -3
  52. package/dist/ssr/next.js +7 -8
  53. package/dist/ssr/next.js.map +1 -1
  54. package/dist/static/index.d.ts +91 -5
  55. package/dist/static/index.js +49 -3
  56. package/dist/static/index.js.map +1 -0
  57. package/dist/static/inject.js.map +1 -1
  58. package/dist/zero/babel.d.ts +2 -81
  59. package/dist/zero/babel.js +45 -29
  60. package/dist/zero/babel.js.map +1 -1
  61. package/dist/zero/index.d.ts +81 -3
  62. package/dist/zero/index.js +2 -3
  63. package/dist/zero/next.d.ts +1 -1
  64. package/dist/zero/next.js +1 -1
  65. package/dist/zero/next.js.map +1 -1
  66. package/docs/README.md +18 -10
  67. package/docs/adoption.md +56 -31
  68. package/docs/ai-agents.md +224 -0
  69. package/docs/comparison.md +69 -40
  70. package/docs/configuration.md +501 -72
  71. package/docs/debug.md +22 -18
  72. package/docs/design-system.md +43 -24
  73. package/docs/dsl.md +512 -179
  74. package/docs/getting-started.md +60 -39
  75. package/docs/injector.md +110 -32
  76. package/docs/methodology.md +68 -36
  77. package/docs/migration-v3.md +285 -0
  78. package/docs/pipeline.md +741 -0
  79. package/docs/plugins.md +353 -0
  80. package/docs/react-api.md +164 -40
  81. package/docs/runtime-benchmarks.md +216 -0
  82. package/docs/ssr.md +92 -81
  83. package/docs/styles.md +65 -16
  84. package/docs/tasty-static.md +149 -99
  85. package/package.json +49 -21
  86. package/tasty.config.ts +6 -0
  87. package/dist/_virtual/_rolldown/runtime.js +0 -7
  88. package/dist/chunks/cacheKey.d.ts +0 -1
  89. package/dist/chunks/cacheKey.js +0 -77
  90. package/dist/chunks/cacheKey.js.map +0 -1
  91. package/dist/chunks/definitions.d.ts +0 -37
  92. package/dist/chunks/definitions.js +0 -258
  93. package/dist/chunks/definitions.js.map +0 -1
  94. package/dist/chunks/index.d.ts +0 -1
  95. package/dist/chunks/renderChunk.d.ts +0 -1
  96. package/dist/chunks/renderChunk.js +0 -59
  97. package/dist/chunks/renderChunk.js.map +0 -1
  98. package/dist/compute-styles.d.ts +0 -31
  99. package/dist/compute-styles.js +0 -335
  100. package/dist/compute-styles.js.map +0 -1
  101. package/dist/config.d.ts +0 -407
  102. package/dist/config.js +0 -587
  103. package/dist/config.js.map +0 -1
  104. package/dist/counter-style/index.js +0 -51
  105. package/dist/counter-style/index.js.map +0 -1
  106. package/dist/debug.d.ts +0 -89
  107. package/dist/debug.js +0 -453
  108. package/dist/debug.js.map +0 -1
  109. package/dist/font-face/index.js +0 -63
  110. package/dist/font-face/index.js.map +0 -1
  111. package/dist/hooks/index.d.ts +0 -7
  112. package/dist/hooks/useCounterStyle.d.ts +0 -36
  113. package/dist/hooks/useCounterStyle.js +0 -65
  114. package/dist/hooks/useCounterStyle.js.map +0 -1
  115. package/dist/hooks/useFontFace.d.ts +0 -45
  116. package/dist/hooks/useFontFace.js +0 -66
  117. package/dist/hooks/useFontFace.js.map +0 -1
  118. package/dist/hooks/useGlobalStyles.d.ts +0 -46
  119. package/dist/hooks/useGlobalStyles.js +0 -88
  120. package/dist/hooks/useGlobalStyles.js.map +0 -1
  121. package/dist/hooks/useKeyframes.d.ts +0 -58
  122. package/dist/hooks/useKeyframes.js +0 -55
  123. package/dist/hooks/useKeyframes.js.map +0 -1
  124. package/dist/hooks/useProperty.d.ts +0 -81
  125. package/dist/hooks/useProperty.js +0 -96
  126. package/dist/hooks/useProperty.js.map +0 -1
  127. package/dist/hooks/useRawCSS.d.ts +0 -22
  128. package/dist/hooks/useRawCSS.js +0 -103
  129. package/dist/hooks/useRawCSS.js.map +0 -1
  130. package/dist/hooks/useStyles.d.ts +0 -40
  131. package/dist/hooks/useStyles.js +0 -31
  132. package/dist/hooks/useStyles.js.map +0 -1
  133. package/dist/injector/index.d.ts +0 -182
  134. package/dist/injector/index.js +0 -185
  135. package/dist/injector/index.js.map +0 -1
  136. package/dist/injector/injector.d.ts +0 -198
  137. package/dist/injector/injector.js +0 -651
  138. package/dist/injector/injector.js.map +0 -1
  139. package/dist/injector/sheet-manager.d.ts +0 -132
  140. package/dist/injector/sheet-manager.js +0 -699
  141. package/dist/injector/sheet-manager.js.map +0 -1
  142. package/dist/injector/types.d.ts +0 -235
  143. package/dist/keyframes/index.js +0 -206
  144. package/dist/keyframes/index.js.map +0 -1
  145. package/dist/parser/classify.js +0 -319
  146. package/dist/parser/classify.js.map +0 -1
  147. package/dist/parser/const.js +0 -60
  148. package/dist/parser/const.js.map +0 -1
  149. package/dist/parser/lru.js +0 -109
  150. package/dist/parser/lru.js.map +0 -1
  151. package/dist/parser/parser.d.ts +0 -25
  152. package/dist/parser/parser.js +0 -115
  153. package/dist/parser/parser.js.map +0 -1
  154. package/dist/parser/tokenizer.js +0 -69
  155. package/dist/parser/tokenizer.js.map +0 -1
  156. package/dist/parser/types.d.ts +0 -51
  157. package/dist/parser/types.js +0 -46
  158. package/dist/parser/types.js.map +0 -1
  159. package/dist/pipeline/conditions.d.ts +0 -134
  160. package/dist/pipeline/conditions.js +0 -406
  161. package/dist/pipeline/conditions.js.map +0 -1
  162. package/dist/pipeline/exclusive.js +0 -230
  163. package/dist/pipeline/exclusive.js.map +0 -1
  164. package/dist/pipeline/index.d.ts +0 -55
  165. package/dist/pipeline/index.js +0 -708
  166. package/dist/pipeline/index.js.map +0 -1
  167. package/dist/pipeline/materialize.js +0 -1103
  168. package/dist/pipeline/materialize.js.map +0 -1
  169. package/dist/pipeline/parseStateKey.d.ts +0 -15
  170. package/dist/pipeline/parseStateKey.js +0 -446
  171. package/dist/pipeline/parseStateKey.js.map +0 -1
  172. package/dist/pipeline/simplify.js +0 -515
  173. package/dist/pipeline/simplify.js.map +0 -1
  174. package/dist/pipeline/warnings.js +0 -18
  175. package/dist/pipeline/warnings.js.map +0 -1
  176. package/dist/plugins/index.d.ts +0 -2
  177. package/dist/plugins/okhsl-plugin.d.ts +0 -35
  178. package/dist/plugins/okhsl-plugin.js +0 -97
  179. package/dist/plugins/okhsl-plugin.js.map +0 -1
  180. package/dist/plugins/types.d.ts +0 -87
  181. package/dist/properties/index.js +0 -222
  182. package/dist/properties/index.js.map +0 -1
  183. package/dist/properties/property-type-resolver.d.ts +0 -24
  184. package/dist/properties/property-type-resolver.js +0 -90
  185. package/dist/properties/property-type-resolver.js.map +0 -1
  186. package/dist/rsc-cache.js +0 -79
  187. package/dist/rsc-cache.js.map +0 -1
  188. package/dist/ssr/async-storage.d.ts +0 -17
  189. package/dist/ssr/async-storage.js.map +0 -1
  190. package/dist/ssr/collect-auto-properties.js +0 -58
  191. package/dist/ssr/collect-auto-properties.js.map +0 -1
  192. package/dist/ssr/collector.js.map +0 -1
  193. package/dist/ssr/context.js.map +0 -1
  194. package/dist/ssr/format-global-rules.js.map +0 -1
  195. package/dist/ssr/format-keyframes.js +0 -69
  196. package/dist/ssr/format-keyframes.js.map +0 -1
  197. package/dist/ssr/format-property.js +0 -49
  198. package/dist/ssr/format-property.js.map +0 -1
  199. package/dist/ssr/format-rules.js.map +0 -1
  200. package/dist/ssr/hydrate.d.ts +0 -29
  201. package/dist/ssr/hydrate.js.map +0 -1
  202. package/dist/ssr/ssr-collector-ref.js +0 -29
  203. package/dist/ssr/ssr-collector-ref.js.map +0 -1
  204. package/dist/states/index.d.ts +0 -49
  205. package/dist/states/index.js +0 -170
  206. package/dist/states/index.js.map +0 -1
  207. package/dist/static/tastyStatic.d.ts +0 -46
  208. package/dist/static/tastyStatic.js +0 -30
  209. package/dist/static/tastyStatic.js.map +0 -1
  210. package/dist/static/types.d.ts +0 -49
  211. package/dist/static/types.js +0 -24
  212. package/dist/static/types.js.map +0 -1
  213. package/dist/styles/border.d.ts +0 -25
  214. package/dist/styles/border.js +0 -120
  215. package/dist/styles/border.js.map +0 -1
  216. package/dist/styles/color.d.ts +0 -14
  217. package/dist/styles/color.js +0 -26
  218. package/dist/styles/color.js.map +0 -1
  219. package/dist/styles/const.js +0 -17
  220. package/dist/styles/const.js.map +0 -1
  221. package/dist/styles/createStyle.js +0 -79
  222. package/dist/styles/createStyle.js.map +0 -1
  223. package/dist/styles/dimension.js +0 -109
  224. package/dist/styles/dimension.js.map +0 -1
  225. package/dist/styles/directional.js +0 -133
  226. package/dist/styles/directional.js.map +0 -1
  227. package/dist/styles/display.d.ts +0 -30
  228. package/dist/styles/display.js +0 -73
  229. package/dist/styles/display.js.map +0 -1
  230. package/dist/styles/fade.d.ts +0 -15
  231. package/dist/styles/fade.js +0 -62
  232. package/dist/styles/fade.js.map +0 -1
  233. package/dist/styles/fill.d.ts +0 -42
  234. package/dist/styles/fill.js +0 -51
  235. package/dist/styles/fill.js.map +0 -1
  236. package/dist/styles/flow.d.ts +0 -16
  237. package/dist/styles/flow.js +0 -12
  238. package/dist/styles/flow.js.map +0 -1
  239. package/dist/styles/gap.d.ts +0 -31
  240. package/dist/styles/gap.js +0 -38
  241. package/dist/styles/gap.js.map +0 -1
  242. package/dist/styles/height.d.ts +0 -17
  243. package/dist/styles/height.js +0 -19
  244. package/dist/styles/height.js.map +0 -1
  245. package/dist/styles/index.d.ts +0 -1
  246. package/dist/styles/index.js +0 -8
  247. package/dist/styles/index.js.map +0 -1
  248. package/dist/styles/inset.d.ts +0 -24
  249. package/dist/styles/inset.js +0 -34
  250. package/dist/styles/inset.js.map +0 -1
  251. package/dist/styles/list.d.ts +0 -16
  252. package/dist/styles/list.js +0 -100
  253. package/dist/styles/list.js.map +0 -1
  254. package/dist/styles/margin.d.ts +0 -24
  255. package/dist/styles/margin.js +0 -32
  256. package/dist/styles/margin.js.map +0 -1
  257. package/dist/styles/outline.d.ts +0 -29
  258. package/dist/styles/outline.js +0 -55
  259. package/dist/styles/outline.js.map +0 -1
  260. package/dist/styles/padding.d.ts +0 -24
  261. package/dist/styles/padding.js +0 -32
  262. package/dist/styles/padding.js.map +0 -1
  263. package/dist/styles/placement.d.ts +0 -37
  264. package/dist/styles/placement.js +0 -74
  265. package/dist/styles/placement.js.map +0 -1
  266. package/dist/styles/predefined.d.ts +0 -71
  267. package/dist/styles/predefined.js +0 -237
  268. package/dist/styles/predefined.js.map +0 -1
  269. package/dist/styles/preset.d.ts +0 -52
  270. package/dist/styles/preset.js +0 -127
  271. package/dist/styles/preset.js.map +0 -1
  272. package/dist/styles/radius.d.ts +0 -12
  273. package/dist/styles/radius.js +0 -83
  274. package/dist/styles/radius.js.map +0 -1
  275. package/dist/styles/scrollMargin.d.ts +0 -24
  276. package/dist/styles/scrollMargin.js +0 -32
  277. package/dist/styles/scrollMargin.js.map +0 -1
  278. package/dist/styles/scrollbar.d.ts +0 -25
  279. package/dist/styles/scrollbar.js +0 -51
  280. package/dist/styles/scrollbar.js.map +0 -1
  281. package/dist/styles/shadow.d.ts +0 -14
  282. package/dist/styles/shadow.js +0 -25
  283. package/dist/styles/shadow.js.map +0 -1
  284. package/dist/styles/shared.js +0 -17
  285. package/dist/styles/shared.js.map +0 -1
  286. package/dist/styles/transition.d.ts +0 -14
  287. package/dist/styles/transition.js +0 -159
  288. package/dist/styles/transition.js.map +0 -1
  289. package/dist/styles/types.d.ts +0 -564
  290. package/dist/styles/width.d.ts +0 -17
  291. package/dist/styles/width.js +0 -19
  292. package/dist/styles/width.js.map +0 -1
  293. package/dist/tasty.d.ts +0 -134
  294. package/dist/tasty.js +0 -248
  295. package/dist/tasty.js.map +0 -1
  296. package/dist/types.d.ts +0 -184
  297. package/dist/utils/cache-wrapper.js +0 -21
  298. package/dist/utils/cache-wrapper.js.map +0 -1
  299. package/dist/utils/case-converter.js +0 -8
  300. package/dist/utils/case-converter.js.map +0 -1
  301. package/dist/utils/color-math.d.ts +0 -46
  302. package/dist/utils/color-math.js +0 -749
  303. package/dist/utils/color-math.js.map +0 -1
  304. package/dist/utils/color-space.d.ts +0 -5
  305. package/dist/utils/color-space.js +0 -228
  306. package/dist/utils/color-space.js.map +0 -1
  307. package/dist/utils/colors.d.ts +0 -5
  308. package/dist/utils/colors.js +0 -10
  309. package/dist/utils/colors.js.map +0 -1
  310. package/dist/utils/css-types.d.ts +0 -7
  311. package/dist/utils/deps-equal.js +0 -15
  312. package/dist/utils/deps-equal.js.map +0 -1
  313. package/dist/utils/dotize.d.ts +0 -26
  314. package/dist/utils/dotize.js +0 -122
  315. package/dist/utils/dotize.js.map +0 -1
  316. package/dist/utils/filter-base-props.d.ts +0 -15
  317. package/dist/utils/filter-base-props.js +0 -45
  318. package/dist/utils/filter-base-props.js.map +0 -1
  319. package/dist/utils/get-display-name.d.ts +0 -7
  320. package/dist/utils/get-display-name.js +0 -10
  321. package/dist/utils/get-display-name.js.map +0 -1
  322. package/dist/utils/has-keys.js +0 -13
  323. package/dist/utils/has-keys.js.map +0 -1
  324. package/dist/utils/hash.js +0 -14
  325. package/dist/utils/hash.js.map +0 -1
  326. package/dist/utils/is-dev-env.js +0 -19
  327. package/dist/utils/is-dev-env.js.map +0 -1
  328. package/dist/utils/is-valid-element-type.js +0 -15
  329. package/dist/utils/is-valid-element-type.js.map +0 -1
  330. package/dist/utils/merge-styles.js.map +0 -1
  331. package/dist/utils/mod-attrs.d.ts +0 -6
  332. package/dist/utils/mod-attrs.js +0 -20
  333. package/dist/utils/mod-attrs.js.map +0 -1
  334. package/dist/utils/process-tokens.d.ts +0 -17
  335. package/dist/utils/process-tokens.js +0 -83
  336. package/dist/utils/process-tokens.js.map +0 -1
  337. package/dist/utils/resolve-recipes.d.ts +0 -17
  338. package/dist/utils/resolve-recipes.js.map +0 -1
  339. package/dist/utils/selector-transform.js +0 -32
  340. package/dist/utils/selector-transform.js.map +0 -1
  341. package/dist/utils/string.js +0 -8
  342. package/dist/utils/string.js.map +0 -1
  343. package/dist/utils/styles.d.ts +0 -99
  344. package/dist/utils/styles.js +0 -220
  345. package/dist/utils/styles.js.map +0 -1
  346. package/dist/utils/typography.d.ts +0 -58
  347. package/dist/utils/typography.js +0 -51
  348. package/dist/utils/typography.js.map +0 -1
  349. package/dist/utils/warnings.d.ts +0 -16
  350. package/dist/utils/warnings.js +0 -16
  351. package/dist/utils/warnings.js.map +0 -1
  352. package/dist/zero/css-writer.d.ts +0 -45
  353. package/dist/zero/css-writer.js +0 -73
  354. package/dist/zero/css-writer.js.map +0 -1
  355. package/dist/zero/extractor.d.ts +0 -24
  356. package/dist/zero/extractor.js.map +0 -1
  357. package/docs/PIPELINE.md +0 -519
@@ -0,0 +1,1909 @@
1
+ import { _ as TastyPluginFactory, w as StyleInjector } from "./config-DMslHK_e.js";
2
+ import { B as StyleValueStateMap, D as CSSMap, I as StyleHandlerResult, M as ResolvedStyleValue, R as StylePropValue, St as KeyframesSteps, _t as InjectResult, at as CSSProperties$1, b as Styles, dt as FunctionDefinition, gt as InjectOptions, ht as GlobalInjectResult, j as RawStyleHandler, kt as StyleInjectorConfig, lt as FontFaceDescriptors, mt as GCOptions, n as StyleResult, nt as StyleDetails, ot as CacheMetrics, st as CounterStyleDescriptors, ut as FontFaceInput, wt as PropertyOptions, x as StylesInterface, xt as KeyframesResult, z as StyleValue } from "./index-BcsaHo8x.js";
3
+ import { t as ServerStyleCollector } from "./collector-DzeNxHOq.js";
4
+ import { AllHTMLAttributes, CSSProperties, ComponentType, ElementType, ForwardRefExoticComponent, JSX, PropsWithoutRef, ReactNode, RefAttributes } from "react";
5
+
6
+ //#region src/utils/name-prefix.d.ts
7
+ /**
8
+ * Name prefix utilities for generated identifiers.
9
+ *
10
+ * Tasty generates three kinds of identifiers from content hashes:
11
+ * - class names (used in DOM `class` attribute)
12
+ * - keyframe names (used in CSS `animation`)
13
+ * - counter-style names (used in CSS `list-style-type`)
14
+ *
15
+ * All three derive from a single configurable prefix so that an app
16
+ * can namespace every identifier under one string. Discriminator letters
17
+ * (`k`, `c`) keep the three kinds visually distinct in devtools — they
18
+ * are not required for correctness (CSS keeps these in separate
19
+ * namespaces), only for readability.
20
+ *
21
+ * The runtime / SSR / RSC paths must agree on the prefix; otherwise the
22
+ * client-side hash for a given style will not match the server-rendered
23
+ * class and hydration breaks. The zero-runtime build path uses a
24
+ * different default (`'ts'`) so its classes can't collide with runtime
25
+ * (`'t'`) classes when both are loaded on the same page.
26
+ */
27
+ /** Default prefix used by the runtime / SSR / RSC paths. */
28
+ declare const DEFAULT_NAME_PREFIX = "t";
29
+ /** Default prefix used by the zero-runtime (`tastyStatic`) build path. */
30
+ declare const DEFAULT_ZERO_NAME_PREFIX = "ts";
31
+ //#endregion
32
+ //#region src/styles/list.d.ts
33
+ declare const BASE_STYLES: readonly ["display", "font", "preset", "hide", "whiteSpace", "opacity", "transition"];
34
+ declare const POSITION_STYLES: readonly ["gridArea", "order", "gridColumn", "gridRow", "placeSelf", "alignSelf", "justifySelf", "zIndex", "margin", "inset", "position", "scrollMargin"];
35
+ declare const BLOCK_INNER_STYLES: readonly ["padding", "paddingInline", "paddingBlock", "overflow", "scrollbar", "textAlign"];
36
+ declare const BLOCK_OUTER_STYLES: readonly ["border", "radius", "shadow", "outline"];
37
+ declare const BLOCK_STYLES: readonly ["padding", "paddingInline", "paddingBlock", "overflow", "scrollbar", "textAlign", "border", "radius", "shadow", "outline"];
38
+ declare const COLOR_STYLES: readonly ["color", "fill", "fade", "image"];
39
+ declare const TEXT_STYLES: readonly ["textTransform", "fontWeight", "fontStyle"];
40
+ declare const DIMENSION_STYLES: readonly ["width", "height", "flexBasis", "flexGrow", "flexShrink", "flex"];
41
+ declare const FLOW_STYLES: readonly ["flow", "place", "placeItems", "placeContent", "alignItems", "alignContent", "justifyItems", "justifyContent", "align", "justify", "gap", "columnGap", "rowGap", "gridColumns", "gridRows", "gridTemplate", "gridAreas"];
42
+ declare const CONTAINER_STYLES: readonly ["display", "font", "preset", "hide", "whiteSpace", "opacity", "transition", "color", "fill", "fade", "image", "width", "height", "flexBasis", "flexGrow", "flexShrink", "flex", "gridArea", "order", "gridColumn", "gridRow", "placeSelf", "alignSelf", "justifySelf", "zIndex", "margin", "inset", "position", "scrollMargin", "padding", "paddingInline", "paddingBlock", "overflow", "scrollbar", "textAlign", "border", "radius", "shadow", "outline", "flow", "place", "placeItems", "placeContent", "alignItems", "alignContent", "justifyItems", "justifyContent", "align", "justify", "gap", "columnGap", "rowGap", "gridColumns", "gridRows", "gridTemplate", "gridAreas"];
43
+ declare const OUTER_STYLES: readonly ["gridArea", "order", "gridColumn", "gridRow", "placeSelf", "alignSelf", "justifySelf", "zIndex", "margin", "inset", "position", "scrollMargin", "width", "height", "flexBasis", "flexGrow", "flexShrink", "flex", "border", "radius", "shadow", "outline"];
44
+ declare const INNER_STYLES: readonly ["display", "font", "preset", "hide", "whiteSpace", "opacity", "transition", "color", "fill", "fade", "image", "padding", "paddingInline", "paddingBlock", "overflow", "scrollbar", "textAlign", "flow", "place", "placeItems", "placeContent", "alignItems", "alignContent", "justifyItems", "justifyContent", "align", "justify", "gap", "columnGap", "rowGap", "gridColumns", "gridRows", "gridTemplate", "gridAreas"];
45
+ //#endregion
46
+ //#region src/types.d.ts
47
+ /**
48
+ * Extensible interface for theme names.
49
+ * Augment this interface to register project-specific theme names for autocomplete.
50
+ *
51
+ * @example
52
+ * ```typescript
53
+ * declare module '@tenphi/tasty' {
54
+ * interface TastyThemeNames {
55
+ * danger: true;
56
+ * success: true;
57
+ * }
58
+ * }
59
+ * ```
60
+ */
61
+ interface TastyThemeNames {}
62
+ type ThemeNameKey = Extract<keyof TastyThemeNames, string>;
63
+ type ThemeName = [ThemeNameKey] extends [never] ? string : ThemeNameKey;
64
+ /**
65
+ * Extensible interface for custom props added via `configure({ propHandlers })`.
66
+ * Augment it to type those props on every tasty component.
67
+ *
68
+ * @example
69
+ * ```typescript
70
+ * declare module '@tenphi/tasty' {
71
+ * interface TastyCustomProps {
72
+ * glaze: 'soft' | 'strong' | { tone: string; intensity?: number };
73
+ * }
74
+ * }
75
+ * ```
76
+ */
77
+ interface TastyCustomProps {}
78
+ /**
79
+ * Extensible interface for style names promoted via
80
+ * `configure({ baseStyleProps })`. Set each name to `true`; the prop is then typed
81
+ * exactly like the style it names.
82
+ *
83
+ * @example
84
+ * ```typescript
85
+ * declare module '@tenphi/tasty' {
86
+ * interface TastyBaseStylePropNames {
87
+ * radius: true;
88
+ * shadow: true;
89
+ * }
90
+ * }
91
+ * ```
92
+ */
93
+ interface TastyBaseStylePropNames {}
94
+ /**
95
+ * Props contributed by `configure({ baseStyleProps })`, each typed like the style
96
+ * it names. Intersecting with `keyof StylesInterface` makes a name that isn't a
97
+ * real style inert rather than `never`-typed.
98
+ */
99
+ type ExtraBaseStyleProps = { [key in keyof TastyBaseStylePropNames & keyof StylesInterface]?: StylePropValue<StylesInterface[key]> };
100
+ /** Allowed mod value types */
101
+ type ModValue = boolean | string | number | undefined | null;
102
+ /**
103
+ * Type for element modifiers (mods prop).
104
+ * Can be used as a generic to define known modifiers with autocomplete:
105
+ * @example
106
+ * type ButtonMods = Mods<{
107
+ * loading?: boolean;
108
+ * selected?: boolean;
109
+ * }>;
110
+ */
111
+ type Mods<T extends Record<string, ModValue> = Record<string, ModValue>> = T & Record<string, ModValue>;
112
+ /**
113
+ * Token value: string or number (processed), boolean for special handling, undefined/null (skipped).
114
+ * For color tokens (#name), boolean `true` is converted to `transparent`.
115
+ * For non-color tokens ($name), boolean `true` results in an empty string value.
116
+ * Boolean `false` results in no CSS output (token is skipped).
117
+ */
118
+ type TokenValue = string | number | boolean | undefined | null;
119
+ /**
120
+ * Tokens definition for inline CSS custom properties.
121
+ * - `$name` keys become `--name` CSS properties
122
+ * - `#name` keys become `--name-color` CSS properties
123
+ */
124
+ type Tokens = Record<`$${string}` | `#${string}`, TokenValue>;
125
+ type Caps = 'A' | 'B' | 'C' | 'D' | 'E' | 'F' | 'G' | 'H' | 'I' | 'J' | 'K' | 'L' | 'M' | 'N' | 'O' | 'P' | 'Q' | 'R' | 'S' | 'T' | 'U' | 'V' | 'W' | 'X' | 'Y' | 'Z';
126
+ interface BasePropsWithoutChildren<K extends TagName = TagName> extends Pick<AllHTMLAttributes<HTMLElement>, 'className' | 'role' | 'id'> {
127
+ /** The HTML tag or React component to render as */
128
+ as?: K | ComponentType<any>;
129
+ /** QA ID for e2e testing. An alias for `data-qa` attribute. */
130
+ qa?: string;
131
+ /** QA value for e2e testing. An alias for `data-qaval` attribute. */
132
+ qaVal?: string | number;
133
+ /** Inner element name */
134
+ element?: `${Caps}${string}`;
135
+ /** The style map */
136
+ styles?: Styles;
137
+ /** The list of element modifiers **/
138
+ mods?: Mods;
139
+ /** Whether the element is hidden (`hidden` attribute is set) */
140
+ isHidden?: boolean;
141
+ /** Whether the element is disabled (`disabled` attribute is set) */
142
+ isDisabled?: boolean;
143
+ /** Whether the element is checked (`checked` attribute is set) */
144
+ isChecked?: boolean;
145
+ /** The CSS style map */
146
+ style?: CSSProperties$1 | (CSSProperties$1 & Record<string, string | number | null | undefined>);
147
+ /** User-defined theme for the element. Mapped to `data-theme` attribute. Augment `TastyThemeNames` to register project-specific themes for autocomplete. */
148
+ theme?: ThemeName | (string & {});
149
+ /** CSS custom property tokens rendered as inline styles */
150
+ tokens?: Tokens;
151
+ }
152
+ interface BaseProps<K extends TagName = TagName> extends BasePropsWithoutChildren<K>, Pick<AllHTMLAttributes<HTMLElementTagNameMap[K]>, 'children'> {}
153
+ interface AllBaseProps<K extends TagName = TagName> extends BaseProps<K>, Omit<AllHTMLAttributes<HTMLElementTagNameMap[K]>, 'style' | 'disabled' | 'hidden' | 'css' | 'content' | 'translate' | 'as' | 'form' | 'bgcolor' | 'background' | 'align' | 'border' | 'color' | 'height' | 'size' | 'width' | 'prefix'> {}
154
+ type BaseStyleProps = Pick<Styles, (typeof BASE_STYLES)[number]>;
155
+ type PositionStyleProps = Pick<Styles, (typeof POSITION_STYLES)[number]>;
156
+ type BlockStyleProps = Pick<Styles, (typeof BLOCK_STYLES)[number]>;
157
+ type BlockInnerStyleProps = Pick<Styles, (typeof BLOCK_INNER_STYLES)[number]>;
158
+ type BlockOuterStyleProps = Pick<Styles, (typeof BLOCK_OUTER_STYLES)[number]>;
159
+ type ColorStyleProps = Pick<Styles, (typeof COLOR_STYLES)[number]>;
160
+ type TextStyleProps = Pick<Styles, (typeof TEXT_STYLES)[number]>;
161
+ type DimensionStyleProps = Pick<Styles, (typeof DIMENSION_STYLES)[number]>;
162
+ type FlowStyleProps = Pick<Styles, (typeof FLOW_STYLES)[number]>;
163
+ type ContainerStyleProps = Pick<Styles, (typeof CONTAINER_STYLES)[number]>;
164
+ type OuterStyleProps = Pick<Styles, (typeof OUTER_STYLES)[number]>;
165
+ type InnerStyleProps = Pick<Styles, (typeof INNER_STYLES)[number]>;
166
+ interface ShortGridStyles {
167
+ template?: Styles['gridTemplate'];
168
+ columns?: Styles['gridColumns'];
169
+ rows?: Styles['gridRows'];
170
+ areas?: Styles['gridAreas'];
171
+ }
172
+ type TagName = keyof HTMLElementTagNameMap;
173
+ /**
174
+ * Configuration type for tasty.config.ts files.
175
+ * Used by the Tasty VSCode extension for validation and autocomplete.
176
+ *
177
+ * @example
178
+ * ```typescript
179
+ * import type { TastyExtensionConfig } from '@tenphi/tasty';
180
+ *
181
+ * const config: TastyExtensionConfig = {
182
+ * tokens: ['#primary', '#danger', '$spacing'],
183
+ * units: ['x', 'r', 'bw'],
184
+ * states: ['@mobile', '@tablet', '@dark'],
185
+ * presets: ['h1', 'h2', 't1', 't2'],
186
+ * };
187
+ *
188
+ * export default config;
189
+ * ```
190
+ */
191
+ interface TastyExtensionConfig {
192
+ /**
193
+ * Extend another config file. Path is relative to this config file.
194
+ * The extended config is merged first, then this config's values are added.
195
+ * @example '../tasty.config.ts'
196
+ */
197
+ extends?: string;
198
+ /**
199
+ * Valid token names for validation and autocomplete.
200
+ * Use # prefix for colors, $ prefix for custom properties.
201
+ * Set to `false` to disable token validation (overrides parent).
202
+ * @example ['#primary', '#danger', '$spacing', '$gap']
203
+ */
204
+ tokens?: false | string[];
205
+ /**
206
+ * Valid custom unit names.
207
+ * Set to `false` to disable unit validation (overrides parent).
208
+ * @example ['x', 'r', 'bw', 'cols']
209
+ */
210
+ units?: false | string[];
211
+ /**
212
+ * Valid custom function names.
213
+ * Set to `false` to disable function validation (overrides parent).
214
+ * @example ['clamp', 'double']
215
+ */
216
+ functions?: false | string[];
217
+ /**
218
+ * State alias names for autocomplete.
219
+ * Must start with @ prefix.
220
+ * @example ['@mobile', '@tablet', '@dark']
221
+ */
222
+ states?: string[];
223
+ /**
224
+ * Valid preset names for the `preset` style property.
225
+ * Tasty has no built-in presets - they are project-specific.
226
+ * @example ['h1', 'h2', 'h3', 't1', 't2', 't3', 'tag']
227
+ */
228
+ presets?: string[];
229
+ /**
230
+ * Custom style property names added via configure({ handlers }).
231
+ * Suppresses "unknown property" warnings for these names.
232
+ * @example ['myGradient', 'customLayout', 'brandBorder']
233
+ */
234
+ styles?: string[];
235
+ /**
236
+ * Descriptions for presets, shown on hover in the extension.
237
+ * Maps preset names to human-readable descriptions.
238
+ * @example { h1: 'Heading 1 (36px/44px, semibold)', t1: 'Text large (18px/24px)' }
239
+ */
240
+ presetDescriptions?: Record<string, string>;
241
+ /**
242
+ * Descriptions for state aliases, shown on hover in the extension.
243
+ * Maps state names to human-readable descriptions.
244
+ * @example { '@mobile': 'Mobile viewport (width < 768px)' }
245
+ */
246
+ stateDescriptions?: Record<string, string>;
247
+ }
248
+ //#endregion
249
+ //#region src/tasty.d.ts
250
+ type StyleList = readonly (keyof { [key in keyof StylesInterface]: StylesInterface[key] })[];
251
+ /** Type descriptor for a single mod prop: a JS constructor or an enum array. */
252
+ type ModPropDef = BooleanConstructor | StringConstructor | NumberConstructor | readonly string[];
253
+ /** Array form: list of mod key names (types default to ModValue). */
254
+ type ModPropsList = readonly string[];
255
+ /** Object form: map of mod key names to type descriptors. */
256
+ type ModPropsMap = Readonly<Record<string, ModPropDef>>;
257
+ /** Either array or object form accepted by `modProps` option. */
258
+ type ModPropsInput = ModPropsList | ModPropsMap;
259
+ /** Resolve a single ModPropDef to its TypeScript type. */
260
+ type ResolveModPropDef<T> = T extends BooleanConstructor ? boolean : T extends StringConstructor ? string : T extends NumberConstructor ? number : T extends readonly (infer U)[] ? U : ModValue;
261
+ /** Resolve an entire `modProps` definition to the component prop types it adds. */
262
+ type ResolveModProps<M extends ModPropsInput> = M extends readonly (infer K)[] ? Partial<Record<K & string, ModValue>> : M extends Record<string, ModPropDef> ? { [key in keyof M & string]?: ResolveModPropDef<M[key]> } : {};
263
+ /** A token key with `$` or `#` prefix. */
264
+ type TokenPropKey = `$${string}` | `#${string}`;
265
+ /** Array form: list of prop names. Names ending in `Color` map to `#` color tokens. */
266
+ type TokenPropsList = readonly string[];
267
+ /** Object form: prop name -> token key with explicit `$`/`#` prefix. */
268
+ type TokenPropsMap = Readonly<Record<string, TokenPropKey>>;
269
+ /** Either array or object form accepted by `tokenProps` option. */
270
+ type TokenPropsInput = TokenPropsList | TokenPropsMap;
271
+ /** Resolve a `tokenProps` definition to the component prop types it adds. */
272
+ type ResolveTokenProps<TP extends TokenPropsInput> = TP extends readonly (infer K)[] ? Partial<Record<K & string, TokenValue>> : TP extends Record<string, TokenPropKey> ? Partial<Record<keyof TP & string, TokenValue>> : {};
273
+ type AnyProps = Record<string, any>;
274
+ type PropsWithStyles = {
275
+ styles?: Styles;
276
+ } & Omit<Record<string, any>, 'styles'>;
277
+ type VariantMap = Record<string, Styles>;
278
+ interface WithVariant<V extends VariantMap> {
279
+ variant?: keyof V;
280
+ }
281
+ /**
282
+ * Definition for a sub-element. Can be either:
283
+ * - A tag name string (e.g., 'div', 'span')
284
+ * - An object with configuration options
285
+ */
286
+ type SubElementDefinition<Tag extends keyof JSX.IntrinsicElements = 'div'> = Tag | {
287
+ as?: Tag;
288
+ qa?: string;
289
+ qaVal?: string | number;
290
+ };
291
+ /**
292
+ * Map of sub-element definitions.
293
+ * Keys become the sub-component names (e.g., { Icon: 'span' } -> Component.Icon)
294
+ */
295
+ type ElementsDefinition = Record<string, SubElementDefinition<keyof JSX.IntrinsicElements>>;
296
+ /**
297
+ * Resolves the tag from a SubElementDefinition
298
+ */
299
+ type ResolveElementTag<T extends SubElementDefinition<any>> = T extends string ? T : T extends {
300
+ as?: infer Tag;
301
+ } ? Tag extends keyof JSX.IntrinsicElements ? Tag : 'div' : 'div';
302
+ /**
303
+ * Props for sub-element components.
304
+ * Combines HTML attributes with tasty-specific props (qa, qaVal, mods, tokens, isDisabled, etc.)
305
+ */
306
+ type SubElementProps<Tag extends keyof JSX.IntrinsicElements = 'div'> = Omit<JSX.IntrinsicElements[Tag], 'ref' | 'color' | 'content' | 'translate'> & {
307
+ qa?: string;
308
+ qaVal?: string | number;
309
+ mods?: Mods;
310
+ tokens?: Tokens;
311
+ isDisabled?: boolean;
312
+ isHidden?: boolean;
313
+ isChecked?: boolean;
314
+ };
315
+ /**
316
+ * Generates the sub-element component types from an ElementsDefinition
317
+ */
318
+ type SubElementComponents<E extends ElementsDefinition> = { [K in keyof E]: ForwardRefExoticComponent<PropsWithoutRef<SubElementProps<ResolveElementTag<E[K]>>> & RefAttributes<ResolveElementTag<E[K]> extends keyof HTMLElementTagNameMap ? HTMLElementTagNameMap[ResolveElementTag<E[K]>] : Element$1>> };
319
+ /**
320
+ * Base type containing common properties shared between TastyProps and TastyElementOptions.
321
+ * Separated to avoid code duplication while allowing different type constraints.
322
+ */
323
+ type TastyBaseProps<K extends StyleList, V extends VariantMap, E extends ElementsDefinition = Record<string, never>, M extends ModPropsInput = readonly never[], TP extends TokenPropsInput = readonly never[]> = {
324
+ /** Default styles of the element. */styles?: Styles; /** The list of styles that can be provided by props */
325
+ styleProps?: K; /** Modifier keys exposed as top-level component props (array or typed object form). */
326
+ modProps?: M; /** Token keys exposed as top-level component props (array or typed object form). */
327
+ tokenProps?: TP;
328
+ element?: BaseProps['element'];
329
+ variants?: V; /** Default tokens for inline CSS custom properties */
330
+ tokens?: Tokens; /** Sub-element definitions for compound components */
331
+ elements?: E;
332
+ } & Pick<BaseProps, 'qa' | 'qaVal'> & WithVariant<V>;
333
+ type TastyProps<K extends StyleList, V extends VariantMap, E extends ElementsDefinition = Record<string, never>, DefaultProps = AnyProps, M extends ModPropsInput = readonly never[], TP extends TokenPropsInput = readonly never[]> = TastyBaseProps<K, V, E, M, TP> & {
334
+ /** The tag name of the element or a React component. */as?: string | ComponentType<any>;
335
+ } & Partial<Omit<DefaultProps, 'as' | 'styles' | 'styleProps' | 'modProps' | 'tokenProps' | 'tokens'>>;
336
+ /**
337
+ * Resolves the props of a polymorphic `as` value (intrinsic tag or component).
338
+ * - For intrinsic tags (`'div'`, `'button'`, ...): returns `JSX.IntrinsicElements[Tag]`.
339
+ * - For React component types: returns the component's own props.
340
+ * - Falls back to an empty record for anything else.
341
+ */
342
+ type ResolveAsProps<AsType extends ElementType> = AsType extends keyof JSX.IntrinsicElements ? JSX.IntrinsicElements[AsType] : AsType extends ComponentType<infer P> ? P : Record<string, never>;
343
+ /**
344
+ * TastyElementOptions is used for the element-creation overload of tasty().
345
+ * It includes an `AsType` generic that allows TypeScript to infer the correct
346
+ * element type from the `as` prop — both for intrinsic tags and for React
347
+ * components (so the wrapped component's prop API is preserved).
348
+ *
349
+ * Note: Uses a separate index signature with `unknown` instead of an `any`
350
+ * record to ensure strict type checking for styles.
351
+ */
352
+ type TastyElementOptions<K extends StyleList, V extends VariantMap, E extends ElementsDefinition = Record<string, never>, AsType extends ElementType = 'div', M extends ModPropsInput = readonly never[], TP extends TokenPropsInput = readonly never[]> = TastyBaseProps<K, V, E, M, TP> & {
353
+ /** The tag name of the element or a React component. */as?: AsType;
354
+ } & Record<string, unknown>;
355
+ type AllBasePropsWithMods<K extends StyleList, M extends ModPropsInput = readonly never[], TP extends TokenPropsInput = readonly never[]> = AllBaseProps & { [key in K[number]]?: StyleValue<StylesInterface[key]> | StyleValueStateMap<StylesInterface[key]> } & BaseStyleProps & ExtraBaseStyleProps & Partial<TastyCustomProps> & ResolveModProps<M> & ResolveTokenProps<TP>;
356
+ /**
357
+ * Keys from BasePropsWithoutChildren that should be omitted from HTML attributes.
358
+ * This excludes event handlers so they can be properly typed from JSX.IntrinsicElements.
359
+ */
360
+ type TastySpecificKeys = 'as' | 'qa' | 'qaVal' | 'element' | 'styles' | 'mods' | 'isHidden' | 'isDisabled' | 'isChecked' | 'style' | 'theme' | 'tokens' | 'ref' | 'color';
361
+ /** Extract prop key names from a ModPropsInput (array elements or object keys). */
362
+ type ModPropsKeys<M extends ModPropsInput> = M extends readonly (infer K)[] ? K & string : keyof M & string;
363
+ /** Extract prop key names from a TokenPropsInput (array elements or object keys). */
364
+ type TokenPropsKeys<TP extends TokenPropsInput> = TP extends readonly (infer K)[] ? K & string : keyof TP & string;
365
+ /**
366
+ * Props type for tasty elements that combines:
367
+ * - AllBasePropsWithMods for style props with strict tokens type
368
+ * - HTML attributes for flexibility (properly typed based on `as`)
369
+ * - Variant support
370
+ *
371
+ * AllBasePropsWithMods carries generic AllHTMLAttributes which can conflict
372
+ * with element-specific types (e.g. `src` is `string` in AllHTMLAttributes but
373
+ * `string | Blob` in ImgHTMLAttributes, or the custom props on a third-party
374
+ * component like Next.js `Link`). To avoid intersection-narrowing, we Omit
375
+ * element-specific keys from AllBasePropsWithMods (keeping TastySpecificKeys,
376
+ * style props, mod props, and token props) and let the resolved `as` props
377
+ * supply the authoritative attribute types. The `AllHTMLAttributes<HTMLElement>`
378
+ * baseline is preserved so generic HTML attributes still work even when `as`
379
+ * is a component type with a narrower prop API.
380
+ */
381
+ type TastyElementProps<K extends StyleList, V extends VariantMap, AsType extends ElementType = 'div', M extends ModPropsInput = readonly never[], TP extends TokenPropsInput = readonly never[]> = Omit<AllBasePropsWithMods<K, M, TP>, Exclude<keyof ResolveAsProps<AsType>, TastySpecificKeys | keyof TastyCustomProps | keyof ExtraBaseStyleProps | K[number] | ModPropsKeys<M> | TokenPropsKeys<TP>>> & WithVariant<V> & Omit<Omit<AllHTMLAttributes<HTMLElement>, keyof ResolveAsProps<AsType>> & ResolveAsProps<AsType>, TastySpecificKeys | keyof TastyCustomProps | keyof ExtraBaseStyleProps | K[number] | ModPropsKeys<M> | TokenPropsKeys<TP>>;
382
+ type TastyComponentPropsWithDefaults<Props extends PropsWithStyles, DefaultProps extends Partial<Props>> = keyof DefaultProps extends never ? Props : { [key in Extract<keyof Props, keyof DefaultProps>]?: Props[key] } & { [key in keyof Omit<Props, keyof DefaultProps>]: Props[key] };
383
+ /**
384
+ * The component type returned by the `tasty(options)` element-factory overload.
385
+ *
386
+ * It's a regular React forward-ref component whose props are typed from the
387
+ * factory-time `as` value. Polymorphism is at factory time: each call to
388
+ * `tasty({ as: X })` produces a component whose prop API includes `X`'s own
389
+ * props (so `tasty({ as: NextLink })` exposes `href`, `replace`, `prefetch`,
390
+ * etc.) alongside the Tasty-specific props (`mods`, `tokens`, `styleProps`,
391
+ * `modProps`, `tokenProps`).
392
+ *
393
+ * Note: a render-time `<X as={SomeComponent} />` does not re-infer props from
394
+ * `SomeComponent`; create another `tasty({ as: SomeComponent })` for that.
395
+ */
396
+ type TastyPolymorphicComponent<DefaultAs extends ElementType, K extends StyleList, V extends VariantMap, M extends ModPropsInput, TP extends TokenPropsInput> = ForwardRefExoticComponent<PropsWithoutRef<TastyElementProps<K, V, DefaultAs, M, TP>> & RefAttributes<unknown>>;
397
+ declare function tasty<K extends StyleList, V extends VariantMap, E extends ElementsDefinition = Record<string, never>, AsType extends ElementType = 'div', M extends ModPropsInput = readonly never[], TP extends TokenPropsInput = readonly never[]>(options: TastyElementOptions<K, V, E, AsType, M, TP>, secondArg?: never): TastyPolymorphicComponent<AsType, K, V, M, TP> & SubElementComponents<E>;
398
+ declare function tasty<Props extends PropsWithStyles, DefaultProps extends Partial<Props> = Partial<Props>, K extends StyleList = readonly never[], V extends VariantMap = VariantMap, E extends ElementsDefinition = Record<string, never>, M extends ModPropsInput = readonly never[], TP extends TokenPropsInput = readonly never[]>(Component: ComponentType<Props>, options?: TastyProps<K, V, E, Props, M, TP>): ComponentType<TastyComponentPropsWithDefaults<Props, DefaultProps>>;
399
+ declare const Element$1: TastyPolymorphicComponent<"div", StyleList, VariantMap, readonly never[], readonly never[]> & SubElementComponents<Record<string, never>>;
400
+ //#endregion
401
+ //#region src/hooks/useStyles.d.ts
402
+ interface UseStylesResult {
403
+ /**
404
+ * Generated className(s) to apply to the element.
405
+ * Can be empty string if no styles are provided.
406
+ * With chunking enabled, may contain multiple space-separated class names.
407
+ */
408
+ className: string;
409
+ }
410
+ /**
411
+ * Hook to generate CSS classes from Tasty styles.
412
+ * Thin wrapper around `computeStyles()` that adds React context-based
413
+ * SSR collector discovery for backward compatibility with TastyRegistry.
414
+ *
415
+ * For hook-free usage (e.g. in server components), use `computeStyles()` directly.
416
+ *
417
+ * @example
418
+ * ```tsx
419
+ * function MyComponent() {
420
+ * const { className } = useStyles({
421
+ * padding: '2x',
422
+ * fill: '#purple',
423
+ * radius: '1r',
424
+ * });
425
+ *
426
+ * return <div className={className}>Styled content</div>;
427
+ * }
428
+ * ```
429
+ */
430
+ declare function useStyles(styles: Styles | undefined, options?: {
431
+ root?: Document | ShadowRoot;
432
+ }): UseStylesResult;
433
+ //#endregion
434
+ //#region src/hooks/useGlobalStyles.d.ts
435
+ interface UseGlobalStylesOptions {
436
+ /**
437
+ * Stable identifier for update tracking (client-only). When provided,
438
+ * changing the styles will dispose the previous injection and inject the
439
+ * new one. Without an id, the selector is used as the slot key.
440
+ * In RSC mode, renders are single-pass so update tracking does not apply.
441
+ */
442
+ id?: string;
443
+ /** Shadow root or document to inject into (client only). */
444
+ root?: Document | ShadowRoot;
445
+ }
446
+ /**
447
+ * Inject global styles for a given selector.
448
+ * Useful for styling elements by selector without generating classNames.
449
+ *
450
+ * SSR-aware: when a ServerStyleCollector is available, CSS is collected
451
+ * during the render phase instead of being injected into the DOM.
452
+ *
453
+ * Works in all environments: client, SSR with collector, and React Server Components.
454
+ *
455
+ * Injected styles are permanent — they are not cleaned up on component unmount.
456
+ * Use the `id` option for update tracking when styles change over the
457
+ * component lifecycle.
458
+ *
459
+ * Update tracking is per-slot and per-root: a slot (`id`, or the selector when
460
+ * no `id` is given) holds exactly one injection per `root`. Changing the styles
461
+ * replaces it; rendering styles that produce no CSS clears it.
462
+ *
463
+ * @param selector - CSS selector to apply styles to (e.g., '.my-class', ':root', 'body')
464
+ * @param styles - Tasty styles object
465
+ * @param options - Optional settings including `id` for update tracking
466
+ *
467
+ * @example
468
+ * ```tsx
469
+ * function MyComponent() {
470
+ * useGlobalStyles('.card', {
471
+ * padding: '2x',
472
+ * radius: '1r',
473
+ * fill: '#white',
474
+ * });
475
+ *
476
+ * return <div className="card">Content</div>;
477
+ * }
478
+ * ```
479
+ */
480
+ declare function useGlobalStyles(selector: string, styles?: Styles, options?: UseGlobalStylesOptions): void;
481
+ //#endregion
482
+ //#region src/hooks/useRawCSS.d.ts
483
+ interface UseRawCSSOptions {
484
+ /**
485
+ * Shadow root or document to inject into. Update tracking is per-root: the
486
+ * same id in two roots holds a separate injection in each.
487
+ */
488
+ root?: Document | ShadowRoot;
489
+ /**
490
+ * Stable identifier for update tracking (client-only). When provided,
491
+ * changing the CSS content will dispose the previous injection and inject
492
+ * the new one. Without an id, deduplication is purely content-based (same
493
+ * CSS is injected only once). In RSC mode, renders are single-pass so
494
+ * update tracking does not apply.
495
+ */
496
+ id?: string;
497
+ }
498
+ declare function useRawCSS(css: string, options?: UseRawCSSOptions): void;
499
+ declare function useRawCSS(factory: () => string, deps: readonly unknown[], options?: UseRawCSSOptions): void;
500
+ //#endregion
501
+ //#region src/hooks/useKeyframes.d.ts
502
+ interface UseKeyframesOptions {
503
+ name?: string;
504
+ root?: Document | ShadowRoot;
505
+ }
506
+ /**
507
+ * Inject CSS @keyframes and return the generated animation name.
508
+ * Deduplicates by content — identical steps always return the same name.
509
+ *
510
+ * Works in all environments: client, SSR with collector, and React Server Components.
511
+ *
512
+ * Passing `name` claims a slot owned by that one call site (like `useRawCSS`'s
513
+ * `id`): when its steps change, the previous injection is disposed and the name
514
+ * is reused, so the rules don't accumulate. Anonymous keyframes are permanent
515
+ * and shared by content.
516
+ *
517
+ * @example Basic usage - steps object is the dependency
518
+ * ```tsx
519
+ * function MyComponent() {
520
+ * const bounce = useKeyframes({
521
+ * '0%': { transform: 'scale(1)' },
522
+ * '50%': { transform: 'scale(1.1)' },
523
+ * '100%': { transform: 'scale(1)' },
524
+ * });
525
+ *
526
+ * return <div style={{ animation: `${bounce} 1s infinite` }}>Bouncing</div>;
527
+ * }
528
+ * ```
529
+ *
530
+ * @example With custom name
531
+ * ```tsx
532
+ * function MyComponent() {
533
+ * const fadeIn = useKeyframes(
534
+ * { from: { opacity: 0 }, to: { opacity: 1 } },
535
+ * { name: 'fadeIn' }
536
+ * );
537
+ *
538
+ * return <div style={{ animation: `${fadeIn} 0.3s ease-out` }}>Fading in</div>;
539
+ * }
540
+ * ```
541
+ *
542
+ * @example Factory function with dependencies
543
+ * ```tsx
544
+ * function MyComponent({ scale }: { scale: number }) {
545
+ * const pulse = useKeyframes(
546
+ * () => ({
547
+ * '0%': { transform: 'scale(1)' },
548
+ * '100%': { transform: `scale(${scale})` },
549
+ * }),
550
+ * [scale]
551
+ * );
552
+ *
553
+ * return <div style={{ animation: `${pulse} 1s infinite` }}>Pulsing</div>;
554
+ * }
555
+ * ```
556
+ */
557
+ declare function useKeyframes(steps: KeyframesSteps, options?: UseKeyframesOptions): string;
558
+ declare function useKeyframes(factory: () => KeyframesSteps, deps: readonly unknown[], options?: UseKeyframesOptions): string;
559
+ //#endregion
560
+ //#region src/hooks/useProperty.d.ts
561
+ /**
562
+ * Options for {@link useProperty}. Extends the shared {@link PropertyOptions}
563
+ * (which is `PropertyDefinition` plus an optional injection `root`).
564
+ */
565
+ type UsePropertyOptions = PropertyOptions;
566
+ /**
567
+ * Register a CSS @property custom property.
568
+ * This enables advanced features like animating custom properties.
569
+ *
570
+ * Note: @property rules are global and persistent once defined.
571
+ * The function ensures the property is only registered once per root.
572
+ *
573
+ * Accepts tasty token syntax for the property name:
574
+ * - `$name` → defines `--name`
575
+ * - `#name` → defines `--name-color` (auto-sets syntax: '<color>', defaults initialValue: 'transparent')
576
+ * - `--name` → defines `--name` (legacy format)
577
+ *
578
+ * Works in all environments: client, SSR with collector, and React Server Components.
579
+ *
580
+ * @param name - The property token ($name, #name) or CSS property name (--name)
581
+ * @param options - Property configuration
582
+ *
583
+ * @example Basic property with token syntax
584
+ * ```tsx
585
+ * function Spinner() {
586
+ * useProperty('$rotation', {
587
+ * syntax: '<angle>',
588
+ * inherits: false,
589
+ * initialValue: '0deg',
590
+ * });
591
+ *
592
+ * return <div className="spinner" />;
593
+ * }
594
+ * ```
595
+ *
596
+ * @example Color property with token syntax (auto-sets syntax)
597
+ * ```tsx
598
+ * function MyComponent() {
599
+ * useProperty('#theme', {
600
+ * initialValue: 'red', // syntax: '<color>' is auto-set
601
+ * });
602
+ *
603
+ * // Now --theme-color can be animated with CSS transitions
604
+ * return <div style={{ '--theme-color': 'blue' } as React.CSSProperties}>Colored</div>;
605
+ * }
606
+ * ```
607
+ *
608
+ * @example Legacy format (still supported)
609
+ * ```tsx
610
+ * function ResizableBox() {
611
+ * useProperty('--box-size', {
612
+ * syntax: '<length>',
613
+ * initialValue: '100px',
614
+ * });
615
+ *
616
+ * return <div style={{ width: 'var(--box-size)' }} />;
617
+ * }
618
+ * ```
619
+ */
620
+ declare function useProperty(name: string, options?: UsePropertyOptions): void;
621
+ //#endregion
622
+ //#region src/hooks/useFontFace.d.ts
623
+ interface UseFontFaceOptions {
624
+ root?: Document | ShadowRoot;
625
+ }
626
+ /**
627
+ * Inject CSS @font-face rules.
628
+ * Permanent — no cleanup on unmount. Deduplicates by content hash.
629
+ *
630
+ * Works in all environments: client, SSR with collector, and React Server Components.
631
+ *
632
+ * @param family - The font-family name
633
+ * @param input - Single descriptor object or array of descriptors (for multiple weights/styles)
634
+ * @param options - Optional settings (e.g. Shadow DOM root)
635
+ *
636
+ * @example Single weight
637
+ * ```tsx
638
+ * function App() {
639
+ * useFontFace('Brand Sans', {
640
+ * src: 'url("/fonts/brand-sans.woff2") format("woff2")',
641
+ * fontWeight: '400 700',
642
+ * fontDisplay: 'swap',
643
+ * });
644
+ *
645
+ * return <div style={{ fontFamily: '"Brand Sans", sans-serif' }}>Hello</div>;
646
+ * }
647
+ * ```
648
+ *
649
+ * @example Multiple weights
650
+ * ```tsx
651
+ * function App() {
652
+ * useFontFace('Brand Sans', [
653
+ * { src: 'url("/fonts/brand-regular.woff2") format("woff2")', fontWeight: 400, fontDisplay: 'swap' },
654
+ * { src: 'url("/fonts/brand-bold.woff2") format("woff2")', fontWeight: 700, fontDisplay: 'swap' },
655
+ * ]);
656
+ *
657
+ * return <div style={{ fontFamily: '"Brand Sans", sans-serif' }}>Hello</div>;
658
+ * }
659
+ * ```
660
+ */
661
+ declare function useFontFace(family: string, input: FontFaceInput, options?: UseFontFaceOptions): void;
662
+ //#endregion
663
+ //#region src/hooks/useCounterStyle.d.ts
664
+ interface UseCounterStyleOptions {
665
+ name?: string;
666
+ root?: Document | ShadowRoot;
667
+ }
668
+ /**
669
+ * Inject a CSS @counter-style rule and return the generated name.
670
+ * Permanent — no cleanup on unmount. Deduplicates by name.
671
+ *
672
+ * Works in all environments: client, SSR with collector, and React Server Components.
673
+ *
674
+ * @example Basic usage
675
+ * ```tsx
676
+ * function EmojiList() {
677
+ * const styleName = useCounterStyle({
678
+ * system: 'cyclic',
679
+ * symbols: '"👍"',
680
+ * suffix: '" "',
681
+ * }, { name: 'thumbs' });
682
+ *
683
+ * return (
684
+ * <ol style={{ listStyleType: styleName }}>
685
+ * <li>First</li>
686
+ * <li>Second</li>
687
+ * </ol>
688
+ * );
689
+ * }
690
+ * ```
691
+ *
692
+ */
693
+ declare function useCounterStyle(descriptors: CounterStyleDescriptors, options?: UseCounterStyleOptions): string;
694
+ //#endregion
695
+ //#region src/hooks/useFunction.d.ts
696
+ interface UseFunctionOptions {
697
+ /** Shadow root or document to inject into. */
698
+ root?: Document | ShadowRoot;
699
+ }
700
+ /**
701
+ * Register a CSS @function (custom function).
702
+ *
703
+ * @function rules are global and persistent once defined. The hook ensures the
704
+ * function is only registered once per root (deduplicated by function name).
705
+ *
706
+ * Accepts tasty token syntax for the function name:
707
+ * - `$$name` → defines `--name` (matches the call site `$$name(...)`)
708
+ * - `$name` / `--name` → also accepted
709
+ *
710
+ * Works in all environments: client, SSR with collector, and React Server Components.
711
+ *
712
+ * @param name - The function name token (`$$name`, `$name`, or `--name`)
713
+ * @param definition - Function definition (args, returns, result, local vars)
714
+ *
715
+ * Call the function through the Tasty DSL, not a raw `style` prop: an inline
716
+ * `style` value reaches the browser unparsed, so the `$$name(...)` sugar is never
717
+ * expanded and `polyfills.functions` cannot rewrite it either.
718
+ *
719
+ * @example
720
+ * ```tsx
721
+ * const Box = tasty({ styles: { marginTop: '$$negative(10px)' } });
722
+ *
723
+ * function Layout() {
724
+ * useFunction('$$negative', { args: ['$value'], result: '(-1 * $value)' });
725
+ * return <Box />;
726
+ * }
727
+ * ```
728
+ */
729
+ declare function useFunction(name: string, definition: FunctionDefinition, options?: UseFunctionOptions): void;
730
+ //#endregion
731
+ //#region src/batch-provider.d.ts
732
+ interface TastyBatchProviderProps {
733
+ children?: ReactNode;
734
+ }
735
+ /**
736
+ * Opens a *batch window* for the commit it renders in, so `batchInjection`
737
+ * can defer stylesheet writes without ever letting a layout effect measure an
738
+ * unstyled element.
739
+ *
740
+ * Every `insertRule()` on a live sheet invalidates style for that sheet's
741
+ * scope. When components inject during React's render phase while others read
742
+ * layout in the same pass, the two interleave and the browser recalculates
743
+ * style between every injection. Batching collapses that into one invalidation
744
+ * per flush — but only if the flush happens before anything can measure.
745
+ *
746
+ * ```
747
+ * provider renders -> window OPEN
748
+ * children render -> injections queued
749
+ * provider insertionEffect -> FLUSH, window CLOSED
750
+ * layout effects run -> rules are in the sheet
751
+ * ```
752
+ *
753
+ * `useInsertionEffect` runs in React's mutation phase, after every render in
754
+ * the commit and before any `useLayoutEffect` — which is exactly why React
755
+ * added it for CSS-in-JS libraries. Effects fire child-first, so this
756
+ * provider's runs after every descendant's and still before all layout
757
+ * effects.
758
+ *
759
+ * A commit that does not re-render this provider gets no window, and those
760
+ * injections are written synchronously instead. That is the point: turning
761
+ * `batchInjection: true` on can only ever make injection cheaper, never make a
762
+ * measurement wrong. It also means batching applies to commits this provider
763
+ * takes part in, so mount it as high in the tree as you can.
764
+ *
765
+ * Requires `configure({ batchInjection: true })`; without it this component
766
+ * only renders its children. `batchInjection: 'always'` does not need the
767
+ * provider at all — see that option's docs for the trade-off it accepts.
768
+ *
769
+ * @example
770
+ * ```tsx
771
+ * configure({ batchInjection: true });
772
+ *
773
+ * createRoot(el).render(
774
+ * <TastyBatchProvider>
775
+ * <App />
776
+ * </TastyBatchProvider>,
777
+ * );
778
+ * ```
779
+ */
780
+ declare function TastyBatchProvider({
781
+ children
782
+ }: TastyBatchProviderProps): ReactNode;
783
+ //#endregion
784
+ //#region src/utils/get-display-name.d.ts
785
+ declare function getDisplayName<T>(Component: ElementType<T>, fallbackName?: string): string;
786
+ //#endregion
787
+ //#region src/index.d.ts
788
+ declare module './utils/css-types' {
789
+ interface CSSProperties extends CSSProperties {}
790
+ }
791
+ //#endregion
792
+ //#region src/plugins/okhsl-plugin.d.ts
793
+ /**
794
+ * The okhsl function handler for tasty parser.
795
+ * Receives parsed style groups and returns an RGB color string.
796
+ */
797
+ declare const okhslFunction: (groups: StyleDetails[]) => string;
798
+ /**
799
+ * OKHSL Plugin for Tasty.
800
+ *
801
+ * Adds support for the `okhsl()` color function in tasty styles.
802
+ *
803
+ * @example
804
+ * ```ts
805
+ * import { configure } from '@tenphi/tasty';
806
+ * import { okhslPlugin } from '@tenphi/tasty';
807
+ *
808
+ * configure({
809
+ * plugins: [okhslPlugin()],
810
+ * });
811
+ *
812
+ * // Now you can use okhsl in styles:
813
+ * const Box = tasty({
814
+ * styles: {
815
+ * fill: 'okhsl(240 50% 50%)',
816
+ * },
817
+ * });
818
+ * ```
819
+ */
820
+ declare const okhslPlugin: TastyPluginFactory;
821
+ //#endregion
822
+ //#region src/plugins/okhst-plugin.d.ts
823
+ /**
824
+ * The okhst function handler for tasty parser.
825
+ * Receives parsed style groups and returns an RGB color string.
826
+ */
827
+ declare const okhstFunction: (groups: StyleDetails[]) => string;
828
+ /**
829
+ * OKHST Plugin for Tasty.
830
+ *
831
+ * Adds support for the `okhst()` color function in tasty styles.
832
+ *
833
+ * @example
834
+ * ```ts
835
+ * import { configure } from '@tenphi/tasty';
836
+ * import { okhstPlugin } from '@tenphi/tasty';
837
+ *
838
+ * configure({
839
+ * plugins: [okhstPlugin()],
840
+ * });
841
+ *
842
+ * // Now you can use okhst in styles:
843
+ * const Box = tasty({
844
+ * styles: {
845
+ * fill: 'okhst(240 50% 50%)',
846
+ * },
847
+ * });
848
+ * ```
849
+ */
850
+ declare const okhstPlugin: TastyPluginFactory;
851
+ //#endregion
852
+ //#region src/plugins/color-func.d.ts
853
+ /**
854
+ * Creates a color function handler for the tasty parser.
855
+ *
856
+ * A color function is a custom `functions` entry that converts its arguments
857
+ * to an `rgb(...)` string (an already-supported color), so it needs no special
858
+ * core integration — registering it as a parse function is enough.
859
+ *
860
+ * @param name The name of the color function (e.g., 'okhsl', 'okhst')
861
+ * @param convert Converts the parsed first three channel values (after angle/
862
+ * percent normalization) to sRGB `[r, g, b]` in the 0-1 range
863
+ * @param label Optional diagnostic label shown in dev warnings when the wrong
864
+ * number of arguments is supplied (e.g., 'H S L'). Has no effect on parsing
865
+ * or output.
866
+ */
867
+ declare function createColorFunc(name: string, convert: (h: number, c2: number, c3: number) => [number, number, number], label?: string): (groups: StyleDetails[]) => string;
868
+ //#endregion
869
+ //#region src/utils/function-color.d.ts
870
+ /**
871
+ * Resolve a `name(...)` value produced by a registered custom parse function
872
+ * into its concrete color output.
873
+ *
874
+ * A color function is just a `functions` entry whose output is an already
875
+ * supported color (`rgb`, `hsl`, `#…`, `oklch`, …). This helper delegates the
876
+ * value to the global parser (which already runs the registered parse function)
877
+ * and returns the result only when it looks like a color. Returns `null` when
878
+ * `str` is not a registered custom function or its output is not a color.
879
+ *
880
+ * This is the generic replacement for the previously hardcoded okhsl/okhst
881
+ * conversion branches scattered across `strToRgb`, `resolveToRgbaValues`, and
882
+ * the `#token.alpha` injection path.
883
+ */
884
+ declare function resolveFunctionColor(str: string): string | null;
885
+ //#endregion
886
+ //#region src/chunks/style-chunk-map.d.ts
887
+ /**
888
+ * Chunk names, the built-in chunk style lists, and the style→chunk lookup.
889
+ *
890
+ * This is a **leaf module with no imports**. It exists separately from
891
+ * `definitions.ts` for two reasons:
892
+ *
893
+ * 1. The style handler registry (`styles/predefined.ts`) needs to assign chunk
894
+ * membership for custom handlers. Reaching for `definitions.ts` would create an
895
+ * import cycle (`definitions` -> `pipeline` -> `styles` -> `predefined`).
896
+ * 2. `STYLE_TO_CHUNK` is populated as a side effect of module load, so it must be
897
+ * populated by the module that *owns* it. Otherwise an importer that only pulls
898
+ * in this module would see an empty map and misclassify every style as `misc`.
899
+ *
900
+ * `definitions.ts` re-exports everything here, so existing import paths and the
901
+ * public API surface are unchanged.
902
+ */
903
+ declare const CHUNK_NAMES: {
904
+ /** Special chunk for styles that cannot be split */readonly COMBINED: "combined";
905
+ readonly SUBCOMPONENTS: "subcomponents";
906
+ readonly APPEARANCE: "appearance";
907
+ readonly FONT: "font";
908
+ readonly DIMENSION: "dimension";
909
+ readonly DISPLAY: "display";
910
+ readonly LAYOUT: "layout";
911
+ readonly POSITION: "position";
912
+ readonly MISC: "misc";
913
+ };
914
+ type ChunkName = (typeof CHUNK_NAMES)[keyof typeof CHUNK_NAMES];
915
+ /**
916
+ * Appearance chunk - visual styling with independent handlers
917
+ *
918
+ * @public
919
+ */
920
+ declare const APPEARANCE_CHUNK_STYLES: readonly ["fill", "color", "opacity", "border", "radius", "outline", "outlineOffset", "shadow", "fade"];
921
+ /**
922
+ * Font chunk - typography styles
923
+ *
924
+ * Handler dependencies (all styles in each handler MUST stay in this chunk):
925
+ * ⚠️ presetStyle: preset, fontSize, lineHeight, letterSpacing, textTransform,
926
+ * fontWeight, fontStyle, font
927
+ */
928
+ /** @public */
929
+ declare const FONT_CHUNK_STYLES: readonly ["preset", "font", "fontWeight", "fontStyle", "fontSize", "lineHeight", "letterSpacing", "textTransform", "fontFamily", "textAlign", "textDecoration", "wordBreak", "wordWrap", "boldFontWeight"];
930
+ /**
931
+ * Dimension chunk - sizing and spacing
932
+ *
933
+ * Handler dependencies (all styles in each handler MUST stay in this chunk):
934
+ * ⚠️ paddingStyle: padding, paddingTop/Right/Bottom/Left, paddingBlock/Inline
935
+ * ⚠️ marginStyle: margin, marginTop/Right/Bottom/Left, marginBlock/Inline
936
+ * ⚠️ widthStyle: width, minWidth, maxWidth
937
+ * ⚠️ heightStyle: height, minHeight, maxHeight
938
+ */
939
+ /** @public */
940
+ declare const DIMENSION_CHUNK_STYLES: readonly ["padding", "paddingTop", "paddingRight", "paddingBottom", "paddingLeft", "paddingBlock", "paddingInline", "margin", "marginTop", "marginRight", "marginBottom", "marginLeft", "marginBlock", "marginInline", "width", "minWidth", "maxWidth", "height", "minHeight", "maxHeight", "flexBasis", "flexGrow", "flexShrink", "flex"];
941
+ /**
942
+ * Display chunk - display mode, layout flow, text overflow, and scrollbar
943
+ *
944
+ * Handler dependencies (all styles in each handler MUST stay in this chunk):
945
+ * ⚠️ displayStyle: display, hide, textOverflow, overflow, whiteSpace
946
+ * ⚠️ flowStyle: display, flow
947
+ * ⚠️ gapStyle: display, flow, gap
948
+ * ⚠️ scrollbarStyle: scrollbar, overflow
949
+ */
950
+ /** @public */
951
+ declare const DISPLAY_CHUNK_STYLES: readonly ["display", "hide", "textOverflow", "overflow", "whiteSpace", "flow", "gap", "scrollbar"];
952
+ /**
953
+ * Layout chunk - flex/grid alignment and grid templates
954
+ *
955
+ * Note: flow and gap are in DISPLAY chunk due to handler dependencies
956
+ * (flowStyle and gapStyle both require 'display' prop).
957
+ */
958
+ /** @public */
959
+ declare const LAYOUT_CHUNK_STYLES: readonly ["placeItems", "placeContent", "alignItems", "alignContent", "justifyItems", "justifyContent", "align", "justify", "place", "columnGap", "rowGap", "gridColumns", "gridRows", "gridTemplate", "gridAreas", "gridAutoFlow", "gridAutoColumns", "gridAutoRows"];
960
+ /**
961
+ * Position chunk - element positioning
962
+ *
963
+ * Handler dependencies (all styles in each handler MUST stay in this chunk):
964
+ * ⚠️ insetStyle: inset, insetBlock, insetInline, top, right, bottom, left
965
+ */
966
+ /** @public */
967
+ declare const POSITION_CHUNK_STYLES: readonly ["position", "inset", "insetBlock", "insetInline", "top", "right", "bottom", "left", "zIndex", "gridArea", "gridColumn", "gridRow", "order", "placeSelf", "alignSelf", "justifySelf", "transform", "transition", "animation"];
968
+ /**
969
+ * Map for O(1) style-to-chunk lookup. Seeded with the built-in lists above and
970
+ * extended by {@link assignStyleChunk} when a custom handler declares style names
971
+ * the built-in lists don't know.
972
+ */
973
+ declare const STYLE_TO_CHUNK: Map<string, ChunkName>;
974
+ //#endregion
975
+ //#region src/chunks/definitions.d.ts
976
+ interface ChunkInfo {
977
+ /** Name of the chunk */
978
+ name: ChunkName | string;
979
+ /** Style keys belonging to this chunk */
980
+ styleKeys: string[];
981
+ }
982
+ /**
983
+ * Categorize style keys into chunks.
984
+ *
985
+ * Returns chunks in a deterministic order (by CHUNK_ORDER) regardless
986
+ * of the order of keys in the input styles object.
987
+ *
988
+ * @param styles - The styles object to categorize
989
+ * @returns Map of chunk name to array of style keys in that chunk (in priority order)
990
+ */
991
+ declare function categorizeStyleKeys(styles: Record<string, unknown>): Map<string, string[]>;
992
+ //#endregion
993
+ //#region src/styles/border.d.ts
994
+ /**
995
+ * Border style handler with multi-group support.
996
+ *
997
+ * Single group (backward compatible):
998
+ * - `border="1bw solid #red"` - all sides
999
+ * - `border="1bw solid #red top left"` - only top and left
1000
+ *
1001
+ * Multi-group (new):
1002
+ * - `border="1bw #red, 2bw #blue top"` - all sides red 1bw, then top overridden to blue 2bw
1003
+ * - `border="1bw, dashed top bottom, #purple left right"` - base 1bw, dashed on top/bottom, purple on left/right
1004
+ *
1005
+ * Later groups override earlier groups for conflicting directions.
1006
+ */
1007
+ declare function borderStyle({
1008
+ border
1009
+ }: {
1010
+ border?: string | number | boolean;
1011
+ }): Record<string, string> | null;
1012
+ declare namespace borderStyle {
1013
+ var __lookupStyles: string[];
1014
+ }
1015
+ //#endregion
1016
+ //#region src/styles/color.d.ts
1017
+ declare function colorStyle({
1018
+ color
1019
+ }: {
1020
+ color?: string | boolean;
1021
+ }): Record<string, string> | null;
1022
+ declare namespace colorStyle {
1023
+ var __lookupStyles: string[];
1024
+ }
1025
+ //#endregion
1026
+ //#region src/styles/display.d.ts
1027
+ interface DisplayStyleProps {
1028
+ display?: string;
1029
+ hide?: boolean;
1030
+ textOverflow?: string | boolean;
1031
+ overflow?: string;
1032
+ whiteSpace?: string;
1033
+ }
1034
+ /**
1035
+ * Handles display, hide, textOverflow, overflow, and whiteSpace styles.
1036
+ *
1037
+ * Priority:
1038
+ * 1. `hide` takes precedence (display: none)
1039
+ * 2. Multi-line `textOverflow` forces display: -webkit-box
1040
+ * 3. Single-line `textOverflow` defaults white-space to nowrap
1041
+ * 4. Explicit `whiteSpace` overrides the default from `textOverflow`
1042
+ */
1043
+ declare function displayStyle({
1044
+ display,
1045
+ hide,
1046
+ textOverflow,
1047
+ overflow,
1048
+ whiteSpace
1049
+ }: DisplayStyleProps): Record<string, string | number> | null;
1050
+ declare namespace displayStyle {
1051
+ var __lookupStyles: string[];
1052
+ }
1053
+ //#endregion
1054
+ //#region src/styles/fade.d.ts
1055
+ declare function fadeStyle({
1056
+ fade
1057
+ }: {
1058
+ fade?: string;
1059
+ }): {
1060
+ mask: string;
1061
+ 'mask-composite': string;
1062
+ } | null;
1063
+ declare namespace fadeStyle {
1064
+ var __lookupStyles: string[];
1065
+ }
1066
+ //#endregion
1067
+ //#region src/styles/fill.d.ts
1068
+ declare function fillStyle({
1069
+ fill,
1070
+ backgroundColor,
1071
+ image,
1072
+ backgroundImage,
1073
+ backgroundPosition,
1074
+ backgroundSize,
1075
+ backgroundRepeat,
1076
+ backgroundAttachment,
1077
+ backgroundOrigin,
1078
+ backgroundClip,
1079
+ background
1080
+ }: {
1081
+ fill?: string;
1082
+ backgroundColor?: string;
1083
+ image?: string;
1084
+ backgroundImage?: string;
1085
+ backgroundPosition?: string;
1086
+ backgroundSize?: string;
1087
+ backgroundRepeat?: string;
1088
+ backgroundAttachment?: string;
1089
+ backgroundOrigin?: string;
1090
+ backgroundClip?: string;
1091
+ background?: string;
1092
+ }): Record<string, string> | null;
1093
+ declare namespace fillStyle {
1094
+ var __lookupStyles: string[];
1095
+ }
1096
+ declare function svgFillStyle({
1097
+ svgFill
1098
+ }: {
1099
+ svgFill?: string;
1100
+ }): {
1101
+ fill: string;
1102
+ } | null;
1103
+ declare namespace svgFillStyle {
1104
+ var __lookupStyles: string[];
1105
+ }
1106
+ //#endregion
1107
+ //#region src/styles/flow.d.ts
1108
+ declare function flowStyle({
1109
+ display,
1110
+ flow
1111
+ }: {
1112
+ display?: string;
1113
+ flow?: string;
1114
+ }): {
1115
+ [x: string]: string;
1116
+ } | null;
1117
+ declare namespace flowStyle {
1118
+ var __lookupStyles: string[];
1119
+ }
1120
+ //#endregion
1121
+ //#region src/styles/gap.d.ts
1122
+ declare function gapStyle({
1123
+ display,
1124
+ flow,
1125
+ gap
1126
+ }: {
1127
+ display?: string;
1128
+ flow?: string;
1129
+ gap?: string | number | boolean;
1130
+ }): {
1131
+ gap: string;
1132
+ $?: undefined;
1133
+ } | ({
1134
+ 'margin-right': string;
1135
+ 'margin-bottom': string;
1136
+ $?: undefined;
1137
+ } | {
1138
+ $: string;
1139
+ 'margin-right': string;
1140
+ 'margin-bottom': string;
1141
+ })[] | {
1142
+ [x: string]: string;
1143
+ $: string;
1144
+ gap?: undefined;
1145
+ } | null;
1146
+ declare namespace gapStyle {
1147
+ var __lookupStyles: string[];
1148
+ }
1149
+ //#endregion
1150
+ //#region src/styles/height.d.ts
1151
+ interface HeightStyleProps {
1152
+ height?: string | number | boolean;
1153
+ minHeight?: string | number | boolean;
1154
+ maxHeight?: string | number | boolean;
1155
+ }
1156
+ declare function heightStyle({
1157
+ height,
1158
+ minHeight,
1159
+ maxHeight
1160
+ }: HeightStyleProps): Record<string, string | string[]> | null;
1161
+ declare namespace heightStyle {
1162
+ var __lookupStyles: string[];
1163
+ }
1164
+ //#endregion
1165
+ //#region src/styles/inset.d.ts
1166
+ declare function insetStyle({
1167
+ inset,
1168
+ insetBlock,
1169
+ insetInline,
1170
+ top,
1171
+ right,
1172
+ bottom,
1173
+ left
1174
+ }: {
1175
+ inset?: string | number | boolean;
1176
+ insetBlock?: string | number | boolean;
1177
+ insetInline?: string | number | boolean;
1178
+ top?: string | number | boolean;
1179
+ right?: string | number | boolean;
1180
+ bottom?: string | number | boolean;
1181
+ left?: string | number | boolean;
1182
+ }): Record<string, string> | null;
1183
+ declare namespace insetStyle {
1184
+ var __lookupStyles: string[];
1185
+ }
1186
+ //#endregion
1187
+ //#region src/styles/margin.d.ts
1188
+ declare function marginStyle({
1189
+ margin,
1190
+ marginBlock,
1191
+ marginInline,
1192
+ marginTop,
1193
+ marginRight,
1194
+ marginBottom,
1195
+ marginLeft
1196
+ }: {
1197
+ margin?: string | number | boolean;
1198
+ marginBlock?: string | number | boolean;
1199
+ marginInline?: string | number | boolean;
1200
+ marginTop?: string | number | boolean;
1201
+ marginRight?: string | number | boolean;
1202
+ marginBottom?: string | number | boolean;
1203
+ marginLeft?: string | number | boolean;
1204
+ }): Record<string, string> | null;
1205
+ declare namespace marginStyle {
1206
+ var __lookupStyles: string[];
1207
+ }
1208
+ //#endregion
1209
+ //#region src/styles/outline.d.ts
1210
+ interface OutlineStyleProps {
1211
+ outline?: string | boolean | number;
1212
+ outlineOffset?: string | number;
1213
+ }
1214
+ /**
1215
+ * Generates CSS for outline property with optional offset.
1216
+ *
1217
+ * Syntax:
1218
+ * - `outline="2px solid #red"` - outline only
1219
+ * - `outline="2px solid #red / 4px"` - outline with offset (slash separator)
1220
+ * - `outline="2px / 4px"` - width with offset (simpler form)
1221
+ * - `outline={true}` - default 1ow solid outline
1222
+ * - `outlineOffset="4px"` - offset as separate prop (can be combined with outline)
1223
+ *
1224
+ * Priority: slash syntax in outline takes precedence over outlineOffset prop
1225
+ *
1226
+ * @return CSS properties for outline and optionally outline-offset
1227
+ */
1228
+ declare function outlineStyle({
1229
+ outline,
1230
+ outlineOffset
1231
+ }: OutlineStyleProps): Record<string, string> | null;
1232
+ declare namespace outlineStyle {
1233
+ var __lookupStyles: string[];
1234
+ }
1235
+ //#endregion
1236
+ //#region src/styles/padding.d.ts
1237
+ declare function paddingStyle({
1238
+ padding,
1239
+ paddingBlock,
1240
+ paddingInline,
1241
+ paddingTop,
1242
+ paddingRight,
1243
+ paddingBottom,
1244
+ paddingLeft
1245
+ }: {
1246
+ padding?: string | number | boolean;
1247
+ paddingBlock?: string | number | boolean;
1248
+ paddingInline?: string | number | boolean;
1249
+ paddingTop?: string | number | boolean;
1250
+ paddingRight?: string | number | boolean;
1251
+ paddingBottom?: string | number | boolean;
1252
+ paddingLeft?: string | number | boolean;
1253
+ }): Record<string, string> | null;
1254
+ declare namespace paddingStyle {
1255
+ var __lookupStyles: string[];
1256
+ }
1257
+ //#endregion
1258
+ //#region src/styles/placement.d.ts
1259
+ interface PlacementStyleProps {
1260
+ place?: string | boolean;
1261
+ placeItems?: string | boolean;
1262
+ placeContent?: string | boolean;
1263
+ align?: string | boolean;
1264
+ justify?: string | boolean;
1265
+ alignItems?: string | boolean;
1266
+ alignContent?: string | boolean;
1267
+ justifyItems?: string | boolean;
1268
+ justifyContent?: string | boolean;
1269
+ }
1270
+ /**
1271
+ * Unified placement handler replacing align, justify, and place.
1272
+ *
1273
+ * Priority (later overrides earlier):
1274
+ * 1. place (lowest) — sets all 4 longhands
1275
+ * 2. placeItems, placeContent, align, justify (medium) — each sets 2 longhands
1276
+ * 3. alignItems, alignContent, justifyItems, justifyContent (highest) — each sets 1 longhand
1277
+ */
1278
+ declare function placementStyle({
1279
+ place,
1280
+ placeItems,
1281
+ placeContent,
1282
+ align,
1283
+ justify,
1284
+ alignItems,
1285
+ alignContent,
1286
+ justifyItems,
1287
+ justifyContent
1288
+ }: PlacementStyleProps): Record<string, string> | null;
1289
+ declare namespace placementStyle {
1290
+ var __lookupStyles: string[];
1291
+ }
1292
+ //#endregion
1293
+ //#region src/styles/preset.d.ts
1294
+ interface PresetStyleProps {
1295
+ preset?: string | boolean;
1296
+ fontSize?: string | number;
1297
+ lineHeight?: string | number;
1298
+ textTransform?: string;
1299
+ letterSpacing?: string | number;
1300
+ fontWeight?: string | number;
1301
+ fontStyle?: string | boolean;
1302
+ fontFamily?: string;
1303
+ /** Alias for fontFamily with special handling for 'monospace' and boolean */
1304
+ font?: string | boolean;
1305
+ }
1306
+ /**
1307
+ * Handles typography preset and individual font properties.
1308
+ *
1309
+ * Preset syntax uses `/` to separate the name from one or more
1310
+ * space-separated modifiers:
1311
+ * - `preset="h1"` — name only
1312
+ * - `preset="h2 / strong"` — name + modifier
1313
+ * - `preset="h2 / strong italic"` — name + multiple modifiers
1314
+ * - `preset="bold"` — modifier-only shorthand (name defaults to `inherit`)
1315
+ * - `preset="bold italic"` — modifier-only shorthand with multiple modifiers
1316
+ *
1317
+ * When `preset` is defined, it sets up CSS custom properties for typography.
1318
+ * Individual font props can be used with or without `preset`:
1319
+ * - With `preset`: overrides the preset value for that property
1320
+ * - Without `preset`: outputs the CSS directly
1321
+ *
1322
+ * Number values are converted to pixels for fontSize, lineHeight, letterSpacing.
1323
+ * fontWeight accepts numbers directly (e.g., 400, 700).
1324
+ *
1325
+ * font vs fontFamily:
1326
+ * - `font` is the recommended prop with special handling (monospace, boolean, fallback)
1327
+ * - `fontFamily` is a direct value without special handling
1328
+ */
1329
+ declare function presetStyle({
1330
+ preset,
1331
+ fontSize,
1332
+ lineHeight,
1333
+ textTransform,
1334
+ letterSpacing,
1335
+ fontWeight,
1336
+ fontStyle,
1337
+ fontFamily,
1338
+ font
1339
+ }: PresetStyleProps): CSSMap | null;
1340
+ declare namespace presetStyle {
1341
+ var __lookupStyles: string[];
1342
+ }
1343
+ //#endregion
1344
+ //#region src/styles/radius.d.ts
1345
+ declare function radiusStyle({
1346
+ radius
1347
+ }: {
1348
+ radius?: string | number | boolean;
1349
+ }): Record<string, string> | null;
1350
+ declare namespace radiusStyle {
1351
+ var __lookupStyles: string[];
1352
+ }
1353
+ //#endregion
1354
+ //#region src/styles/scrollMargin.d.ts
1355
+ declare function scrollMarginStyle({
1356
+ scrollMargin,
1357
+ scrollMarginBlock,
1358
+ scrollMarginInline,
1359
+ scrollMarginTop,
1360
+ scrollMarginRight,
1361
+ scrollMarginBottom,
1362
+ scrollMarginLeft
1363
+ }: {
1364
+ scrollMargin?: string | number | boolean;
1365
+ scrollMarginBlock?: string | number | boolean;
1366
+ scrollMarginInline?: string | number | boolean;
1367
+ scrollMarginTop?: string | number | boolean;
1368
+ scrollMarginRight?: string | number | boolean;
1369
+ scrollMarginBottom?: string | number | boolean;
1370
+ scrollMarginLeft?: string | number | boolean;
1371
+ }): Record<string, string> | null;
1372
+ declare namespace scrollMarginStyle {
1373
+ var __lookupStyles: string[];
1374
+ }
1375
+ //#endregion
1376
+ //#region src/styles/scrollbar.d.ts
1377
+ interface ScrollbarStyleProps {
1378
+ scrollbar?: string | boolean;
1379
+ overflow?: string;
1380
+ }
1381
+ /**
1382
+ * Standard CSS scrollbar styling via `scrollbar-width`, `scrollbar-color`,
1383
+ * and `scrollbar-gutter`.
1384
+ *
1385
+ * Width values: `thin` (default), `auto`, `none`
1386
+ * Modifiers: `stable`, `both-edges`, `always`
1387
+ *
1388
+ * Note: `auto` is classified as a VALUE_KEYWORD by the parser, so it lands
1389
+ * in `values` rather than `mods`. Both locations are checked for robustness.
1390
+ */
1391
+ declare function scrollbarStyle({
1392
+ scrollbar,
1393
+ overflow
1394
+ }: ScrollbarStyleProps): Record<string, string> | null;
1395
+ declare namespace scrollbarStyle {
1396
+ var __lookupStyles: string[];
1397
+ }
1398
+ //#endregion
1399
+ //#region src/styles/shadow.d.ts
1400
+ declare function shadowStyle({
1401
+ shadow
1402
+ }: {
1403
+ shadow?: string | boolean;
1404
+ }): {
1405
+ 'box-shadow': string;
1406
+ } | null;
1407
+ declare namespace shadowStyle {
1408
+ var __lookupStyles: string[];
1409
+ }
1410
+ //#endregion
1411
+ //#region src/styles/transition.d.ts
1412
+ declare function transitionStyle({
1413
+ transition
1414
+ }: {
1415
+ transition?: string;
1416
+ }): {
1417
+ transition: string;
1418
+ } | null;
1419
+ declare namespace transitionStyle {
1420
+ var __lookupStyles: string[];
1421
+ }
1422
+ //#endregion
1423
+ //#region src/styles/width.d.ts
1424
+ interface WidthStyleProps {
1425
+ width?: string | number | boolean;
1426
+ minWidth?: string | number | boolean;
1427
+ maxWidth?: string | number | boolean;
1428
+ }
1429
+ declare function widthStyle({
1430
+ width,
1431
+ minWidth,
1432
+ maxWidth
1433
+ }: WidthStyleProps): Record<string, string | string[]> | null;
1434
+ declare namespace widthStyle {
1435
+ var __lookupStyles: string[];
1436
+ }
1437
+ //#endregion
1438
+ //#region src/styles/predefined.d.ts
1439
+ /**
1440
+ * Exported object containing wrapped predefined style handlers.
1441
+ * Users can import and call these to extend or delegate to built-in behavior.
1442
+ *
1443
+ * Internal handlers use *Style suffix for searchability.
1444
+ * External API uses short names for convenience.
1445
+ *
1446
+ * @example
1447
+ * ```ts
1448
+ * import { styleHandlers, configure } from '@tenphi/tasty';
1449
+ *
1450
+ * configure({
1451
+ * handlers: {
1452
+ * fill: ({ fill }) => {
1453
+ * if (fill?.startsWith('gradient:')) {
1454
+ * return { background: fill.slice(9) };
1455
+ * }
1456
+ * return styleHandlers.fill({ fill });
1457
+ * },
1458
+ * },
1459
+ * });
1460
+ * ```
1461
+ */
1462
+ declare const styleHandlers: {
1463
+ readonly border: typeof borderStyle;
1464
+ readonly color: typeof colorStyle;
1465
+ readonly display: typeof displayStyle;
1466
+ readonly fade: typeof fadeStyle;
1467
+ readonly fill: typeof fillStyle;
1468
+ readonly svgFill: typeof svgFillStyle;
1469
+ readonly flow: typeof flowStyle;
1470
+ readonly gap: typeof gapStyle;
1471
+ readonly height: typeof heightStyle;
1472
+ readonly inset: typeof insetStyle;
1473
+ readonly margin: typeof marginStyle;
1474
+ readonly outline: typeof outlineStyle;
1475
+ readonly padding: typeof paddingStyle;
1476
+ readonly placement: typeof placementStyle;
1477
+ readonly preset: typeof presetStyle;
1478
+ readonly radius: typeof radiusStyle;
1479
+ readonly scrollMargin: typeof scrollMarginStyle;
1480
+ readonly scrollbar: typeof scrollbarStyle;
1481
+ readonly shadow: typeof shadowStyle;
1482
+ readonly transition: typeof transitionStyle;
1483
+ readonly width: typeof widthStyle;
1484
+ };
1485
+ //#endregion
1486
+ //#region src/styles/define-handler.d.ts
1487
+ /**
1488
+ * Declare a multi-dependency style handler with its dependency names inferred
1489
+ * into the handler's parameter type.
1490
+ *
1491
+ * Without it, the multi-dependency tuple form needs a hand-written parameter
1492
+ * annotation that can silently drift from the dependency list:
1493
+ *
1494
+ * ```ts
1495
+ * // Annotation and dependency list are maintained separately.
1496
+ * handlers: {
1497
+ * spacing: [['gap', 'padding'], ({ gap, padding }: { gap?: string; padding?: string }) => …],
1498
+ * }
1499
+ *
1500
+ * // Both come from the same array; a typo in the destructure is a type error.
1501
+ * handlers: {
1502
+ * spacing: defineHandler(['gap', 'padding'], ({ gap, padding }) => …),
1503
+ * }
1504
+ * ```
1505
+ *
1506
+ * Values arrive **state-resolved but unparsed** — the raw authored DSL string
1507
+ * (`'2x'`, `'#purple.5'`), so call `parseStyle()` / `parseColor()` as needed. The
1508
+ * result is a kebab-case CSS declaration map (or an array of them); the reserved
1509
+ * `$` key applies the declarations to a nested selector.
1510
+ *
1511
+ * All names must belong to the same chunk. Names the built-in chunk lists don't
1512
+ * know are pulled into their handler's chunk automatically at registration.
1513
+ */
1514
+ declare function defineHandler<const TDeps extends readonly string[]>(deps: TDeps, handler: (props: Partial<Record<TDeps[number], ResolvedStyleValue>>) => StyleHandlerResult): [readonly string[], RawStyleHandler];
1515
+ //#endregion
1516
+ //#region src/compute-styles.d.ts
1517
+ interface ComputeStylesResult {
1518
+ className: string;
1519
+ /** CSS text to emit as an inline <style> tag (RSC mode only). */
1520
+ css?: string;
1521
+ }
1522
+ interface ComputeStylesOptions {
1523
+ ssrCollector?: ServerStyleCollector | null;
1524
+ /** Target root for style injection (client only). Defaults to `document`. */
1525
+ root?: Document | ShadowRoot;
1526
+ /**
1527
+ * Set when `styles` outlives this call and will be passed in again — a
1528
+ * `tasty()` factory's own styles object rather than a per-render merge.
1529
+ * It lets chunk cache keys be memoized on the object, which is worth the
1530
+ * bookkeeping only when there is a next render to spend it on.
1531
+ */
1532
+ stableStyles?: boolean;
1533
+ }
1534
+ /**
1535
+ * Synchronous, hook-free style computation.
1536
+ *
1537
+ * Resolves recipes, categorizes style keys into chunks, renders CSS rules,
1538
+ * allocates class names, and injects / collects / returns the CSS.
1539
+ *
1540
+ * Three code paths:
1541
+ * 1. SSR collector — discovered via ALS or passed explicitly; CSS collected
1542
+ * 2. RSC inline — no collector and no `document`; CSS returned as `result.css`
1543
+ * for the caller to emit as an inline `<style>` tag
1544
+ * 3. Client inject — CSS injected synchronously into the DOM (idempotent)
1545
+ *
1546
+ * @param styles - Tasty styles object (or undefined for no styles)
1547
+ * @param options - Optional SSR collector override
1548
+ */
1549
+ declare function computeStyles(styles: Styles | undefined, options?: ComputeStylesOptions): ComputeStylesResult;
1550
+ //#endregion
1551
+ //#region src/injector/chunk-sheet-registry.d.ts
1552
+ /**
1553
+ * Global registry mapping CSS content hashes to shared constructable
1554
+ * CSSStyleSheet objects with reference counting.
1555
+ *
1556
+ * Multiple shadow roots adopting the same chunk share a single underlying
1557
+ * stylesheet object — parse once, adopt everywhere.
1558
+ */
1559
+ declare class ChunkSheetRegistry {
1560
+ private sheets;
1561
+ private sheetToHash;
1562
+ /**
1563
+ * Get or create a CSSStyleSheet for the given CSS text.
1564
+ * Increments refCount. Uses content hash as the dedup key.
1565
+ */
1566
+ acquire(cssText: string): CSSStyleSheet;
1567
+ /**
1568
+ * Decrement refCount for a sheet. When refCount reaches 0,
1569
+ * the sheet is removed from the registry.
1570
+ */
1571
+ release(sheet: CSSStyleSheet): void;
1572
+ /**
1573
+ * Bulk acquire — returns an array of CSSStyleSheet in the same order.
1574
+ */
1575
+ acquireAll(cssTexts: string[]): CSSStyleSheet[];
1576
+ /**
1577
+ * Bulk release — decrements refCount for each sheet.
1578
+ */
1579
+ releaseAll(sheets: CSSStyleSheet[]): void;
1580
+ /** Number of unique sheets currently held. */
1581
+ get size(): number;
1582
+ }
1583
+ /** Module-level singleton shared across the entire application. */
1584
+ declare const chunkSheetRegistry: ChunkSheetRegistry;
1585
+ //#endregion
1586
+ //#region src/injector/index.d.ts
1587
+ /**
1588
+ * Inject styles and return className with dispose function
1589
+ */
1590
+ declare function inject(rules: StyleResult[], options?: InjectOptions): InjectResult;
1591
+ /**
1592
+ * Inject global rules that should not reserve tasty class names
1593
+ */
1594
+ declare function injectGlobal(rules: StyleResult[], options?: {
1595
+ root?: Document | ShadowRoot;
1596
+ }): GlobalInjectResult;
1597
+ /**
1598
+ * Inject raw CSS text directly without parsing
1599
+ * This is a low-overhead method for injecting raw CSS that doesn't need tasty processing.
1600
+ * The CSS is inserted into a separate style element to avoid conflicts with tasty's chunking.
1601
+ *
1602
+ * @example
1603
+ * ```tsx
1604
+ * // Inject raw CSS
1605
+ * const { dispose } = injectRawCSS(`
1606
+ * body { margin: 0; padding: 0; }
1607
+ * .my-class { color: red; }
1608
+ * `);
1609
+ *
1610
+ * // Later, remove the injected CSS
1611
+ * dispose();
1612
+ * ```
1613
+ */
1614
+ declare function injectRawCSS(css: string, options?: {
1615
+ root?: Document | ShadowRoot;
1616
+ }): {
1617
+ dispose: () => void;
1618
+ };
1619
+ /**
1620
+ * Get raw CSS text for SSR
1621
+ */
1622
+ declare function getRawCSSText(options?: {
1623
+ root?: Document | ShadowRoot;
1624
+ }): string;
1625
+ /**
1626
+ * Inject keyframes and return object with toString() and dispose()
1627
+ */
1628
+ declare function keyframes(steps: KeyframesSteps, nameOrOptions?: string | {
1629
+ root?: Document | ShadowRoot;
1630
+ name?: string;
1631
+ }): KeyframesResult;
1632
+ /**
1633
+ * Define a CSS @property custom property.
1634
+ * This enables advanced features like animating custom properties.
1635
+ *
1636
+ * Note: @property rules are global and persistent once defined.
1637
+ * Re-registering the same property name is a no-op.
1638
+ *
1639
+ * @param name - The custom property name (must start with --)
1640
+ * @param options - Property configuration
1641
+ *
1642
+ * @example
1643
+ * ```ts
1644
+ * // Define a color property that can be animated
1645
+ * property('--my-color', {
1646
+ * syntax: '<color>',
1647
+ * initialValue: 'red',
1648
+ * });
1649
+ *
1650
+ * // Define an angle property
1651
+ * property('--rotation', {
1652
+ * syntax: '<angle>',
1653
+ * inherits: false,
1654
+ * initialValue: '0deg',
1655
+ * });
1656
+ * ```
1657
+ */
1658
+ declare function property(name: string, options?: PropertyOptions): void;
1659
+ /**
1660
+ * Check if a CSS @property has already been defined
1661
+ *
1662
+ * @param name - The custom property name to check
1663
+ * @param options - Options including root
1664
+ */
1665
+ declare function isPropertyDefined(name: string, options?: {
1666
+ root?: Document | ShadowRoot;
1667
+ }): boolean;
1668
+ /**
1669
+ * Inject a CSS @font-face rule.
1670
+ *
1671
+ * Permanent and global — no dispose or ref-counting.
1672
+ * Deduplicates by content hash (family + descriptors).
1673
+ */
1674
+ declare function fontFace(family: string, descriptors: FontFaceDescriptors, options?: {
1675
+ root?: Document | ShadowRoot;
1676
+ }): void;
1677
+ /**
1678
+ * Inject a CSS @counter-style rule.
1679
+ *
1680
+ * Permanent and global — no dispose or ref-counting. Deduplicates by name and
1681
+ * overrides an existing rule by default. Pass `weak: true` for global
1682
+ * `configure()` definitions, which never clobber an existing rule.
1683
+ */
1684
+ declare function counterStyle(name: string, descriptors: CounterStyleDescriptors, options?: {
1685
+ root?: Document | ShadowRoot;
1686
+ weak?: boolean;
1687
+ }): void;
1688
+ /**
1689
+ * Inject a CSS @function rule (custom function).
1690
+ *
1691
+ * Permanent and global — no dispose or ref-counting. Deduplicates by function
1692
+ * name and overrides an existing rule by default. Pass `weak: true` for global
1693
+ * `configure()` definitions, which never clobber an existing rule.
1694
+ *
1695
+ * @param name - The function name (`$$name`, `$name`, or `--name`)
1696
+ * @param definition - Function definition (args, returns, result, local vars)
1697
+ *
1698
+ * @example
1699
+ * ```ts
1700
+ * func('$$negative', { args: ['$value'], result: '(-1 * $value)' });
1701
+ * ```
1702
+ */
1703
+ declare function func(name: string, definition: FunctionDefinition, options?: {
1704
+ root?: Document | ShadowRoot;
1705
+ weak?: boolean;
1706
+ }): void;
1707
+ /**
1708
+ * Get CSS text from all sheets (for SSR)
1709
+ */
1710
+ declare function getCSSText(options?: {
1711
+ root?: Document | ShadowRoot;
1712
+ }): string;
1713
+ /**
1714
+ * Collect only CSS used by a rendered subtree (like jest-styled-components).
1715
+ * Pass the container returned by render(...).
1716
+ */
1717
+ declare function getCSSTextForNode(node: ParentNode | Element | DocumentFragment, options?: {
1718
+ root?: Document | ShadowRoot;
1719
+ }): string;
1720
+ /**
1721
+ * Remove every injected rule that is neither in the DOM nor held by an
1722
+ * outstanding `inject()` handle. Equivalent to `gc({ force: true })`.
1723
+ */
1724
+ declare function cleanup(root?: Document | ShadowRoot): void;
1725
+ /**
1726
+ * Record a render-time usage hit for one or more classNames.
1727
+ * Used internally by computeStyles and tasty() to track usage for GC.
1728
+ * When the global touch counter reaches `touchInterval`, schedules GC.
1729
+ */
1730
+ declare function touch(className: string, options?: {
1731
+ root?: Document | ShadowRoot;
1732
+ }): void;
1733
+ /**
1734
+ * Synchronous garbage collection of unused styles — those no element carries
1735
+ * and no `inject()` handle references. Evicts the oldest ones once they exceed
1736
+ * capacity. With `{ force: true }`, removes all of them regardless of capacity.
1737
+ *
1738
+ * @returns Number of styles evicted.
1739
+ */
1740
+ declare function gc(options?: GCOptions): number;
1741
+ /**
1742
+ * Get the global injector instance for debugging
1743
+ */
1744
+ declare const injector: {
1745
+ readonly instance: StyleInjector;
1746
+ };
1747
+ /**
1748
+ * Destroy all resources and clean up
1749
+ */
1750
+ declare function destroy(root?: Document | ShadowRoot): void;
1751
+ /**
1752
+ * Create a new isolated injector instance
1753
+ */
1754
+ declare function createInjector(config?: Partial<StyleInjectorConfig>): StyleInjector;
1755
+ //#endregion
1756
+ //#region src/utils/filter-base-props.d.ts
1757
+ interface PropsFilterOptions {
1758
+ labelable?: boolean;
1759
+ propNames?: Set<string>;
1760
+ eventProps?: boolean;
1761
+ }
1762
+ /**
1763
+ * Filters out all props that aren't valid DOM props or defined via override prop obj.
1764
+ * @param props - The component props to be filtered.
1765
+ * @param opts - Props to override.
1766
+ */
1767
+ declare function filterBaseProps<T extends object>(props: T, opts?: PropsFilterOptions): Partial<T>;
1768
+ //#endregion
1769
+ //#region src/utils/colors.d.ts
1770
+ declare function color$1(name: string, opacity?: number): string;
1771
+ //#endregion
1772
+ //#region src/utils/mod-attrs.d.ts
1773
+ declare const _modAttrs: (firstArg: Record<string, ModValue> | undefined, secondArg?: unknown) => Record<string, string> | null;
1774
+ //#endregion
1775
+ //#region src/utils/dotize.d.ts
1776
+ declare const dotize: {
1777
+ valTypes: {
1778
+ none: string;
1779
+ primitive: string;
1780
+ object: string;
1781
+ array: string;
1782
+ };
1783
+ getValType: (val: any) => string | undefined;
1784
+ getPathType: (arrPath: any) => string[];
1785
+ isUndefined: (obj: any) => obj is undefined;
1786
+ isNumber: (f: any) => boolean;
1787
+ isEmptyObj: (obj: any) => boolean;
1788
+ isPlainObject: (obj: any) => boolean;
1789
+ isNotObject: (obj: any) => boolean;
1790
+ isEmptyArray: (arr: any) => boolean;
1791
+ isNotArray: (arr: any) => boolean;
1792
+ removeEmptyArrayItem: (arr: any) => any;
1793
+ getFieldName: (field: any, prefix: any, isRoot: any, isArrayItem: any, isArray: any) => string;
1794
+ startsWith: (val: any, valToSearch: any) => boolean;
1795
+ convert: (obj: any, prefix?: string) => any;
1796
+ backward: (obj: any, prefix: any) => any;
1797
+ };
1798
+ //#endregion
1799
+ //#region src/utils/resolve-recipes.d.ts
1800
+ /**
1801
+ * Resolve all `recipe` style properties in a styles object.
1802
+ *
1803
+ * Handles both top-level and sub-element recipe references.
1804
+ * Returns the same object reference if no recipes are present anywhere
1805
+ * (zero overhead for the common case).
1806
+ *
1807
+ * @param styles - The styles object potentially containing `recipe` keys
1808
+ * @returns Resolved styles with recipe values merged in, or the original object if unchanged
1809
+ */
1810
+ declare function resolveRecipes(styles: Styles): Styles;
1811
+ //#endregion
1812
+ //#region src/utils/process-tokens.d.ts
1813
+ /**
1814
+ * Process tokens object into inline style properties.
1815
+ * - `$name` -> `--name` with the parsed value
1816
+ * - `#name` -> `--name-color` with the parsed value
1817
+ *
1818
+ * @param tokens - The tokens object to process
1819
+ * @returns CSSProperties object or undefined if no tokens to process
1820
+ */
1821
+ declare function processTokens(tokens: Tokens | undefined): CSSProperties$1 | undefined;
1822
+ //#endregion
1823
+ //#region src/debug.d.ts
1824
+ declare global {
1825
+ interface Window {
1826
+ tastyDebug?: typeof tastyDebug;
1827
+ }
1828
+ }
1829
+ type CSSTarget = 'all' | 'global' | 'active' | 'unused' | 'page' | string | string[] | Element;
1830
+ interface DebugOptions {
1831
+ root?: Document | ShadowRoot;
1832
+ /** Suppress console logging and return data only (default: false) */
1833
+ raw?: boolean;
1834
+ }
1835
+ interface CSSOptions extends DebugOptions {
1836
+ prettify?: boolean;
1837
+ /** Read from stored source CSS (dev-mode only) instead of live CSSOM */
1838
+ source?: boolean;
1839
+ }
1840
+ interface DebugChunkInfo {
1841
+ className: string;
1842
+ chunkName: string | null;
1843
+ }
1844
+ interface InspectResult {
1845
+ element?: Element | null;
1846
+ classes: string[];
1847
+ chunks: DebugChunkInfo[];
1848
+ css: string;
1849
+ size: number;
1850
+ rules: number;
1851
+ }
1852
+ interface CacheStatus {
1853
+ classes: {
1854
+ active: string[];
1855
+ unused: string[];
1856
+ all: string[];
1857
+ };
1858
+ metrics: CacheMetrics | null;
1859
+ }
1860
+ interface ChunkBreakdown {
1861
+ byChunk: Record<string, {
1862
+ classes: string[];
1863
+ cssSize: number;
1864
+ ruleCount: number;
1865
+ }>;
1866
+ totalChunkTypes: number;
1867
+ totalClasses: number;
1868
+ }
1869
+ interface Summary {
1870
+ activeClasses: string[];
1871
+ unusedClasses: string[];
1872
+ totalStyledClasses: string[];
1873
+ activeCSSSize: number;
1874
+ unusedCSSSize: number;
1875
+ globalCSSSize: number;
1876
+ rawCSSSize: number;
1877
+ keyframesCSSSize: number;
1878
+ propertyCSSSize: number;
1879
+ totalCSSSize: number;
1880
+ activeRuleCount: number;
1881
+ unusedRuleCount: number;
1882
+ globalRuleCount: number;
1883
+ rawRuleCount: number;
1884
+ keyframesRuleCount: number;
1885
+ propertyRuleCount: number;
1886
+ totalRuleCount: number;
1887
+ metrics: CacheMetrics | null;
1888
+ definedProperties: string[];
1889
+ definedKeyframes: {
1890
+ name: string;
1891
+ refCount: number;
1892
+ }[];
1893
+ chunkBreakdown: ChunkBreakdown;
1894
+ }
1895
+ declare const tastyDebug: {
1896
+ css(target: CSSTarget, opts?: CSSOptions): string;
1897
+ inspect(target: string | Element, opts?: DebugOptions): InspectResult;
1898
+ summary(opts?: DebugOptions): Summary;
1899
+ chunks(opts?: DebugOptions): ChunkBreakdown;
1900
+ cache(opts?: DebugOptions): CacheStatus;
1901
+ cleanup(opts?: {
1902
+ root?: Document | ShadowRoot;
1903
+ }): void;
1904
+ help(): void;
1905
+ install(): void;
1906
+ };
1907
+ //#endregion
1908
+ export { okhstFunction as $, PositionStyleProps as $t, keyframes as A, TastyElementProps as At, ChunkInfo as B, BaseStyleProps as Bt, getCSSTextForNode as C, ResolveModPropDef as Ct, injectRawCSS as D, SubElementProps as Dt, injectGlobal as E, SubElementDefinition as Et, ComputeStylesOptions as F, WithVariant as Ft, DIMENSION_CHUNK_STYLES as G, ContainerStyleProps as Gt, APPEARANCE_CHUNK_STYLES as H, BlockOuterStyleProps as Ht, ComputeStylesResult as I, tasty as It, LAYOUT_CHUNK_STYLES as J, FlowStyleProps as Jt, DISPLAY_CHUNK_STYLES as K, DimensionStyleProps as Kt, computeStyles as L, AllBaseProps as Lt, touch as M, TastyProps as Mt, ChunkSheetRegistry as N, TokenPropsInput as Nt, injector as O, TastyComponentPropsWithDefaults as Ot, chunkSheetRegistry as P, VariantMap as Pt, createColorFunc as Q, OuterStyleProps as Qt, defineHandler as R, BaseProps as Rt, getCSSText as S, DEFAULT_ZERO_NAME_PREFIX as Sn, ResolveAsProps as St, inject as T, ResolveTokenProps as Tt, CHUNK_NAMES as U, BlockStyleProps as Ut, categorizeStyleKeys as V, BlockInnerStyleProps as Vt, ChunkName as W, ColorStyleProps as Wt, STYLE_TO_CHUNK as X, ModValue as Xt, POSITION_CHUNK_STYLES as Y, InnerStyleProps as Yt, resolveFunctionColor as Z, Mods as Zt, createInjector as _, INNER_STYLES as _n, AllBasePropsWithMods as _t, DebugOptions as a, TastyThemeNames as an, TastyBatchProviderProps as at, func as b, TEXT_STYLES as bn, ModPropDef as bt, tastyDebug as c, Tokens as cn, useCounterStyle as ct, dotize as d, BLOCK_OUTER_STYLES as dn, useProperty as dt, ShortGridStyles as en, okhstPlugin as et, _modAttrs as f, BLOCK_STYLES as fn, useKeyframes as ft, counterStyle as g, FLOW_STYLES as gn, useStyles as gt, cleanup as h, DIMENSION_STYLES as hn, UseStylesResult as ht, DebugChunkInfo as i, TastyExtensionConfig as in, TastyBatchProvider as it, property as j, TastyPolymorphicComponent as jt, isPropertyDefined as k, TastyElementOptions as kt, processTokens as l, BASE_STYLES as ln, useFontFace as lt, filterBaseProps as m, CONTAINER_STYLES as mn, useGlobalStyles as mt, CacheStatus as n, TastyBaseStylePropNames as nn, okhslPlugin as nt, InspectResult as o, TextStyleProps as on, UseFunctionOptions as ot, color$1 as p, COLOR_STYLES as pn, useRawCSS as pt, FONT_CHUNK_STYLES as q, ExtraBaseStyleProps as qt, ChunkBreakdown as r, TastyCustomProps as rn, getDisplayName as rt, Summary as s, TokenValue as sn, useFunction as st, CSSOptions as t, TagName as tn, okhslFunction as tt, resolveRecipes as u, BLOCK_INNER_STYLES as un, UsePropertyOptions as ut, destroy as v, OUTER_STYLES as vn, Element$1 as vt, getRawCSSText as w, ResolveModProps as wt, gc as x, DEFAULT_NAME_PREFIX as xn, ModPropsInput as xt, fontFace as y, POSITION_STYLES as yn, ElementsDefinition as yt, styleHandlers as z, BasePropsWithoutChildren as zt };
1909
+ //# sourceMappingURL=index-CC0wykKn.d.ts.map