pagyra-js 0.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (540) hide show
  1. package/.eslintrc.json +30 -0
  2. package/CHANGELOG.md +13 -0
  3. package/README.md +275 -0
  4. package/UA_Styles_Chromium.md +93 -0
  5. package/_ext/woff2_conversion/brotli-decode.d.ts +139 -0
  6. package/_ext/woff2_conversion/brotli-encode.d.ts +129 -0
  7. package/_ext/woff2_conversion/brotli-port.d.ts +12 -0
  8. package/_ext/woff2_conversion/brotli-shared-dictionary.d.ts +25 -0
  9. package/_ext/woff2_conversion/brotli-types.d.ts +15 -0
  10. package/_ext/woff2_conversion/woff2-common.d.ts +37 -0
  11. package/_ext/woff2_conversion/woff2-decode.d.ts +32 -0
  12. package/_ext/woff2_conversion/woff2-encode.d.ts +31 -0
  13. package/_ext/woff2_conversion/woff2-output.d.ts +39 -0
  14. package/_ext/woff2_original_cpp/brotli/brotli.c +1559 -0
  15. package/_ext/woff2_original_cpp/brotli/brotli.md +116 -0
  16. package/_ext/woff2_original_cpp/brotli/decode.h +409 -0
  17. package/_ext/woff2_original_cpp/brotli/encode.h +505 -0
  18. package/_ext/woff2_original_cpp/brotli/port.h +302 -0
  19. package/_ext/woff2_original_cpp/brotli/shared_dictionary.h +100 -0
  20. package/_ext/woff2_original_cpp/brotli/types.h +83 -0
  21. package/_ext/woff2_original_cpp/cmake/FindBrotliDec.cmake +35 -0
  22. package/_ext/woff2_original_cpp/cmake/FindBrotliEnc.cmake +35 -0
  23. package/_ext/woff2_original_cpp/include/woff2/decode.h +36 -0
  24. package/_ext/woff2_original_cpp/include/woff2/encode.h +43 -0
  25. package/_ext/woff2_original_cpp/include/woff2/output.h +86 -0
  26. package/_ext/woff2_original_cpp/src/buffer.h +164 -0
  27. package/_ext/woff2_original_cpp/src/convert_woff2ttf_fuzzer.cc +13 -0
  28. package/_ext/woff2_original_cpp/src/convert_woff2ttf_fuzzer_new_entry.cc +12 -0
  29. package/_ext/woff2_original_cpp/src/file.h +30 -0
  30. package/_ext/woff2_original_cpp/src/font.cc +400 -0
  31. package/_ext/woff2_original_cpp/src/font.h +105 -0
  32. package/_ext/woff2_original_cpp/src/glyph.cc +383 -0
  33. package/_ext/woff2_original_cpp/src/glyph.h +71 -0
  34. package/_ext/woff2_original_cpp/src/normalize.cc +314 -0
  35. package/_ext/woff2_original_cpp/src/normalize.h +39 -0
  36. package/_ext/woff2_original_cpp/src/port.h +66 -0
  37. package/_ext/woff2_original_cpp/src/round.h +27 -0
  38. package/_ext/woff2_original_cpp/src/store_bytes.h +55 -0
  39. package/_ext/woff2_original_cpp/src/table_tags.cc +82 -0
  40. package/_ext/woff2_original_cpp/src/table_tags.h +30 -0
  41. package/_ext/woff2_original_cpp/src/transform.cc +430 -0
  42. package/_ext/woff2_original_cpp/src/transform.h +26 -0
  43. package/_ext/woff2_original_cpp/src/variable_length.cc +129 -0
  44. package/_ext/woff2_original_cpp/src/variable_length.h +30 -0
  45. package/_ext/woff2_original_cpp/src/woff2_common.cc +50 -0
  46. package/_ext/woff2_original_cpp/src/woff2_common.h +64 -0
  47. package/_ext/woff2_original_cpp/src/woff2_compress.cc +43 -0
  48. package/_ext/woff2_original_cpp/src/woff2_dec.cc +1398 -0
  49. package/_ext/woff2_original_cpp/src/woff2_decompress.cc +41 -0
  50. package/_ext/woff2_original_cpp/src/woff2_enc.cc +458 -0
  51. package/_ext/woff2_original_cpp/src/woff2_info.cc +142 -0
  52. package/_ext/woff2_original_cpp/src/woff2_out.cc +63 -0
  53. package/assets/fonts/ttf/arimo/Arimo-Bold.ttf +0 -0
  54. package/assets/fonts/ttf/arimo/Arimo-BoldItalic.ttf +0 -0
  55. package/assets/fonts/ttf/arimo/Arimo-Italic.ttf +0 -0
  56. package/assets/fonts/ttf/arimo/Arimo-Regular.ttf +0 -0
  57. package/assets/fonts/ttf/cinzeldecorative/CinzelDecorative-Black.ttf +0 -0
  58. package/assets/fonts/ttf/cinzeldecorative/CinzelDecorative-Bold.ttf +0 -0
  59. package/assets/fonts/ttf/cinzeldecorative/CinzelDecorative-Regular.ttf +0 -0
  60. package/assets/fonts/ttf/dejavu/DejaVuSans.ttf +0 -0
  61. package/assets/fonts/ttf/firecode/FiraCode-Bold.ttf +0 -0
  62. package/assets/fonts/ttf/firecode/FiraCode-Light.ttf +0 -0
  63. package/assets/fonts/ttf/firecode/FiraCode-Medium.ttf +0 -0
  64. package/assets/fonts/ttf/firecode/FiraCode-Regular.ttf +0 -0
  65. package/assets/fonts/ttf/firecode/FiraCode-SemiBold.ttf +0 -0
  66. package/assets/fonts/ttf/notoemoji/NotoEmoji-Bold.ttf +0 -0
  67. package/assets/fonts/ttf/notoemoji/NotoEmoji-Light.ttf +0 -0
  68. package/assets/fonts/ttf/notoemoji/NotoEmoji-Medium.ttf +0 -0
  69. package/assets/fonts/ttf/notoemoji/NotoEmoji-Regular.ttf +0 -0
  70. package/assets/fonts/ttf/notoemoji/NotoEmoji-SemiBold.ttf +0 -0
  71. package/assets/fonts/ttf/notosans/NotoSans-Regular.ttf +0 -0
  72. package/assets/fonts/ttf/roboto/Roboto-Bold.ttf +0 -0
  73. package/assets/fonts/ttf/roboto/Roboto-BoldItalic.ttf +0 -0
  74. package/assets/fonts/ttf/roboto/Roboto-Italic.ttf +0 -0
  75. package/assets/fonts/ttf/roboto/Roboto-Regular.ttf +0 -0
  76. package/assets/fonts/ttf/stixtwomath/STIXTwoMath-Regular.ttf +0 -0
  77. package/assets/fonts/ttf/tinos/Tinos-Bold.ttf +0 -0
  78. package/assets/fonts/ttf/tinos/Tinos-BoldItalic.ttf +0 -0
  79. package/assets/fonts/ttf/tinos/Tinos-Italic.ttf +0 -0
  80. package/assets/fonts/ttf/tinos/Tinos-Regular.ttf +0 -0
  81. package/assets/fonts/woff/lato/lato-latin-400-italic.woff +0 -0
  82. package/assets/fonts/woff/lato/lato-latin-400-normal.woff +0 -0
  83. package/assets/fonts/woff/lato/lato-latin-700-italic.woff +0 -0
  84. package/assets/fonts/woff/lato/lato-latin-700-normal.woff +0 -0
  85. package/assets/fonts/woff2/caveat/Caveat-Bold.woff2 +0 -0
  86. package/assets/fonts/woff2/caveat/Caveat-Regular.woff2 +0 -0
  87. package/assets/fonts/woff2/lato/lato-latin-400-italic.woff2 +0 -0
  88. package/assets/fonts/woff2/lato/lato-latin-400-normal.woff2 +0 -0
  89. package/assets/fonts/woff2/lato/lato-latin-700-italic.woff2 +0 -0
  90. package/assets/fonts/woff2/lato/lato-latin-700-normal.woff2 +0 -0
  91. package/docs/AGENTS.md +288 -0
  92. package/docs/BACKGROUND-REPEAT-IMPLEMENTATION.md +127 -0
  93. package/docs/BACKGROUND-REPEAT-REFERENCE.md +127 -0
  94. package/docs/BACKGROUND-REPEAT-SPACE-ROUND.md +164 -0
  95. package/docs/css-properties-support.md +256 -0
  96. package/docs/src_modules_table.md +172 -0
  97. package/docs/text-overlap-fix.md +85 -0
  98. package/docs/text-overlap-investigation.md +27 -0
  99. package/eslint.config.js +36 -0
  100. package/glyph_measure.htm +1458 -0
  101. package/package.json +50 -0
  102. package/playground/browser-entry.ts +2 -0
  103. package/playground/exports/background-text-debug.pdf +0 -0
  104. package/playground/public/app.js +875 -0
  105. package/playground/public/assets/1.webp +0 -0
  106. package/playground/public/examples/accents-test.html +24 -0
  107. package/playground/public/examples/advanced-selectors-demo.html +118 -0
  108. package/playground/public/examples/background-advanced-showcase.html +82 -0
  109. package/playground/public/examples/background-clip-text.html +36 -0
  110. package/playground/public/examples/background-origin-showcase.html +137 -0
  111. package/playground/public/examples/background-position-showcase.html +83 -0
  112. package/playground/public/examples/background-repeat-showcase.html +83 -0
  113. package/playground/public/examples/background-repeat-space-round.html +348 -0
  114. package/playground/public/examples/background-size-showcase.html +82 -0
  115. package/playground/public/examples/background-text-debug.html +18 -0
  116. package/playground/public/examples/baseline-test.html +24 -0
  117. package/playground/public/examples/bold-showcase.html +150 -0
  118. package/playground/public/examples/bold-strike-example.html +12 -0
  119. package/playground/public/examples/border-collapse-test.html +23 -0
  120. package/playground/public/examples/centered-shadow-div.html +72 -0
  121. package/playground/public/examples/css-variables.html +50 -0
  122. package/playground/public/examples/debug-accents.html +11 -0
  123. package/playground/public/examples/debug-text-overlap.html +46 -0
  124. package/playground/public/examples/flex-gap-column.html +130 -0
  125. package/playground/public/examples/flex-gap-row.html +137 -0
  126. package/playground/public/examples/flex-padding-test.html +29 -0
  127. package/playground/public/examples/flexbox-text-test.html +193 -0
  128. package/playground/public/examples/fonts-demo.html +126 -0
  129. package/playground/public/examples/footer-example.html +4 -0
  130. package/playground/public/examples/gradient-text.html +54 -0
  131. package/playground/public/examples/grid-gap-demo.html +156 -0
  132. package/playground/public/examples/header-example.html +4 -0
  133. package/playground/public/examples/header-footer-example.html +27 -0
  134. package/playground/public/examples/image-showcase.html +33 -0
  135. package/playground/public/examples/justify-text.html +22 -0
  136. package/playground/public/examples/linear-gradient-example.html +38 -0
  137. package/playground/public/examples/lorem-span.html +14 -0
  138. package/playground/public/examples/margin-block-showcase.html +21 -0
  139. package/playground/public/examples/margin-inline-showcase.html +21 -0
  140. package/playground/public/examples/monthly-summary.html +95 -0
  141. package/playground/public/examples/multi-page-lorem.html +190 -0
  142. package/playground/public/examples/opacity-debug.html +39 -0
  143. package/playground/public/examples/opacity-example.html +70 -0
  144. package/playground/public/examples/png-image-example.html +13 -0
  145. package/playground/public/examples/red-rectangle.html +18 -0
  146. package/playground/public/examples/repro.html +24 -0
  147. package/playground/public/examples/rounded-borders-test.html +24 -0
  148. package/playground/public/examples/simple-list.html +89 -0
  149. package/playground/public/examples/simple-svg.html +37 -0
  150. package/playground/public/examples/simple-table.html +52 -0
  151. package/playground/public/examples/skew-div.html +138 -0
  152. package/playground/public/examples/skew-text.html +21 -0
  153. package/playground/public/examples/starter-report.css +51 -0
  154. package/playground/public/examples/starter-report.html +23 -0
  155. package/playground/public/examples/svg-aspect-ratio-showcase.html +116 -0
  156. package/playground/public/examples/svg-gradients-linear.html +28 -0
  157. package/playground/public/examples/svg-gradients-radial.html +29 -0
  158. package/playground/public/examples/svg-gradients-showcase.html +66 -0
  159. package/playground/public/examples/svg-image-path-test.html +43 -0
  160. package/playground/public/examples/svg-images-clipping.html +27 -0
  161. package/playground/public/examples/svg-path-gallery.html +118 -0
  162. package/playground/public/examples/svg-radial-transform-demo.html +78 -0
  163. package/playground/public/examples/svg-transform-stack.html +103 -0
  164. package/playground/public/examples/svg-transforms-demo.html +127 -0
  165. package/playground/public/examples/table-merge-test.html +34 -0
  166. package/playground/public/examples/text-decoration-showcase.html +138 -0
  167. package/playground/public/examples/text-indent-showcase.html +137 -0
  168. package/playground/public/examples/text-shadow-example.html +29 -0
  169. package/playground/public/examples/very-complex-css.html +293 -0
  170. package/playground/public/examples/webp-example.html +13 -0
  171. package/playground/public/examples/z-index-demo.html +93 -0
  172. package/playground/public/examples.json +240 -0
  173. package/playground/public/images/dice.png +0 -0
  174. package/playground/public/images/duck.jpg +0 -0
  175. package/playground/public/index.html +149 -0
  176. package/playground/public/mode.js +1 -0
  177. package/playground/public/styles.css +382 -0
  178. package/playground/public/tmp-h2-debug.html +33 -0
  179. package/playground/public/tmp-italic-debug.html +32 -0
  180. package/playground/public/vendor/codemirror/codemirror.min.css +1 -0
  181. package/playground/public/vendor/codemirror/codemirror.min.js +1 -0
  182. package/playground/public/vendor/codemirror/css.min.js +1 -0
  183. package/playground/public/vendor/codemirror/darcula.min.css +1 -0
  184. package/playground/public/vendor/codemirror/htmlmixed.min.js +1 -0
  185. package/playground/public/vendor/codemirror/javascript.min.js +1 -0
  186. package/playground/public/vendor/codemirror/xml.min.js +1 -0
  187. package/playground/public/vendor/pagyra-playground-browser.js +165966 -0
  188. package/playground/public/vendor/pagyra-playground-browser.js.map +7 -0
  189. package/playground/server.d.ts +1 -0
  190. package/playground/server.js +68 -0
  191. package/playground/server.ts +128 -0
  192. package/scripts/browser-build.ts +101 -0
  193. package/scripts/build-browser-bundle.ts +52 -0
  194. package/scripts/glyph-comparison/simulate.ts +744 -0
  195. package/scripts/playground-browser-server.ts +57 -0
  196. package/scripts/probe-roboto.ts +6 -0
  197. package/scripts/render-playground-example.ts +121 -0
  198. package/scripts/run-glyph-atlas-tuner-runner.mjs +113 -0
  199. package/scripts/run-glyph-atlas-tuner.ts +141 -0
  200. package/scripts/top-ts-files.ps1 +39 -0
  201. package/scripts/top-ts-files.sh +37 -0
  202. package/scripts/woff2_info.ps1 +132 -0
  203. package/src/browser-entry.ts +14 -0
  204. package/src/compression/adler32.ts +45 -0
  205. package/src/compression/brotli/brotli.ts +463 -0
  206. package/src/compression/brotli/index.ts +15 -0
  207. package/src/compression/brotli/transform.ts +184 -0
  208. package/src/compression/brotli/types.ts +58 -0
  209. package/src/compression/brotli/utils.ts +157 -0
  210. package/src/compression/brotli/vendor/bit_reader.js +124 -0
  211. package/src/compression/brotli/vendor/context.js +250 -0
  212. package/src/compression/brotli/vendor/decode.d.ts +2 -0
  213. package/src/compression/brotli/vendor/decode.js +938 -0
  214. package/src/compression/brotli/vendor/dictionary-data.js +9469 -0
  215. package/src/compression/brotli/vendor/dictionary.js +36 -0
  216. package/src/compression/brotli/vendor/huffman.js +123 -0
  217. package/src/compression/brotli/vendor/package.json +3 -0
  218. package/src/compression/brotli/vendor/prefix.js +60 -0
  219. package/src/compression/brotli/vendor/streams.js +31 -0
  220. package/src/compression/brotli/vendor/transform.js +247 -0
  221. package/src/compression/brotli/vendor-decode.d.ts +4 -0
  222. package/src/compression/brotli/woff2-glyf-transform.ts +623 -0
  223. package/src/compression/decompress.ts +16 -0
  224. package/src/compression/deflate.ts +295 -0
  225. package/src/compression/index.ts +4 -0
  226. package/src/compression/types.ts +26 -0
  227. package/src/compression/utils.ts +107 -0
  228. package/src/core.ts +18 -0
  229. package/src/css/apply-declarations.ts +86 -0
  230. package/src/css/background-types.ts +65 -0
  231. package/src/css/browser-defaults.ts +16 -0
  232. package/src/css/clip-path-types.ts +13 -0
  233. package/src/css/compute-style.ts +494 -0
  234. package/src/css/css-unit-resolver.ts +65 -0
  235. package/src/css/custom-properties.ts +215 -0
  236. package/src/css/enums.ts +127 -0
  237. package/src/css/font-face-parser.ts +233 -0
  238. package/src/css/font-weight.ts +65 -0
  239. package/src/css/inline-style-parser.ts +27 -0
  240. package/src/css/layout-property-resolver.ts +75 -0
  241. package/src/css/length.ts +141 -0
  242. package/src/css/line-height.ts +96 -0
  243. package/src/css/named-colors.ts +150 -0
  244. package/src/css/parsers/background-parser-extended.ts +111 -0
  245. package/src/css/parsers/background-parser.ts +456 -0
  246. package/src/css/parsers/border-block-parser.ts +26 -0
  247. package/src/css/parsers/border-inline-parser.ts +26 -0
  248. package/src/css/parsers/border-parser-extended.ts +256 -0
  249. package/src/css/parsers/border-parser.ts +175 -0
  250. package/src/css/parsers/box-shadow-parser.ts +106 -0
  251. package/src/css/parsers/clip-path-parser.ts +92 -0
  252. package/src/css/parsers/color-parser.ts +14 -0
  253. package/src/css/parsers/dimension-parser.ts +117 -0
  254. package/src/css/parsers/display-flex-parser.ts +59 -0
  255. package/src/css/parsers/flex-parser.ts +144 -0
  256. package/src/css/parsers/font-parser.ts +40 -0
  257. package/src/css/parsers/gradient-parser.ts +366 -0
  258. package/src/css/parsers/grid-parser-extended.ts +55 -0
  259. package/src/css/parsers/grid-parser.ts +218 -0
  260. package/src/css/parsers/length-parser.ts +95 -0
  261. package/src/css/parsers/list-style-parser.ts +39 -0
  262. package/src/css/parsers/margin-block-parser.ts +12 -0
  263. package/src/css/parsers/margin-inline-parser.ts +12 -0
  264. package/src/css/parsers/margin-parser.ts +30 -0
  265. package/src/css/parsers/opacity-parser.ts +32 -0
  266. package/src/css/parsers/overflow-wrap-parser.ts +38 -0
  267. package/src/css/parsers/padding-block-parser.ts +12 -0
  268. package/src/css/parsers/padding-inline-parser.ts +12 -0
  269. package/src/css/parsers/padding-parser.ts +30 -0
  270. package/src/css/parsers/position-parser.ts +75 -0
  271. package/src/css/parsers/register-parsers.ts +302 -0
  272. package/src/css/parsers/registry.ts +18 -0
  273. package/src/css/parsers/text-parser-extended.ts +144 -0
  274. package/src/css/parsers/text-parser.ts +25 -0
  275. package/src/css/parsers/text-shadow-parser.ts +94 -0
  276. package/src/css/properties/box-model.ts +82 -0
  277. package/src/css/properties/flexbox.ts +44 -0
  278. package/src/css/properties/gap.ts +14 -0
  279. package/src/css/properties/grid.ts +94 -0
  280. package/src/css/properties/layout.ts +59 -0
  281. package/src/css/properties/misc.ts +44 -0
  282. package/src/css/properties/typography.ts +71 -0
  283. package/src/css/properties/visual.ts +68 -0
  284. package/src/css/selectors/matcher.ts +219 -0
  285. package/src/css/selectors/parser.ts +163 -0
  286. package/src/css/selectors/simple-key.ts +31 -0
  287. package/src/css/selectors/specificity.ts +41 -0
  288. package/src/css/selectors/types.ts +31 -0
  289. package/src/css/shorthands/border-shorthand.ts +68 -0
  290. package/src/css/shorthands/box-shorthand.ts +33 -0
  291. package/src/css/style-inheritance.ts +50 -0
  292. package/src/css/style.ts +402 -0
  293. package/src/css/ua-defaults/base-defaults.ts +266 -0
  294. package/src/css/ua-defaults/browser-defaults.ts +134 -0
  295. package/src/css/ua-defaults/element-defaults.ts +374 -0
  296. package/src/css/ua-defaults/types.ts +43 -0
  297. package/src/css/unit-conversion.ts +24 -0
  298. package/src/css/utils.ts +108 -0
  299. package/src/css/viewport.ts +17 -0
  300. package/src/debug/audit.ts +20 -0
  301. package/src/debug/ids.ts +13 -0
  302. package/src/debug/log.js +28 -0
  303. package/src/debug/log.ts +52 -0
  304. package/src/debug/tree.ts +57 -0
  305. package/src/dom/node.ts +133 -0
  306. package/src/environment/browser-environment.ts +78 -0
  307. package/src/environment/environment.ts +35 -0
  308. package/src/environment/global.ts +13 -0
  309. package/src/environment/node-environment.browser.ts +28 -0
  310. package/src/environment/node-environment.ts +64 -0
  311. package/src/fonts/detector.ts +28 -0
  312. package/src/fonts/engines/ttf-engine.ts +28 -0
  313. package/src/fonts/engines/woff-engine.ts +38 -0
  314. package/src/fonts/engines/woff2-engine.ts +41 -0
  315. package/src/fonts/extractors/metrics-extractor.ts +362 -0
  316. package/src/fonts/font-registry-resolver.ts +132 -0
  317. package/src/fonts/index.ts +3 -0
  318. package/src/fonts/orchestrator.ts +92 -0
  319. package/src/fonts/parsers/base-parser.ts +23 -0
  320. package/src/fonts/types.ts +85 -0
  321. package/src/fonts/utils/ttf-reconstructor.ts +120 -0
  322. package/src/fonts/woff/decoder.ts +105 -0
  323. package/src/fonts/woff2/buffer.ts +106 -0
  324. package/src/fonts/woff2/decoder.ts +981 -0
  325. package/src/geometry/box.ts +48 -0
  326. package/src/geometry/matrix.ts +59 -0
  327. package/src/html/css/parse-css.ts +85 -0
  328. package/src/html/dom-converter.ts +433 -0
  329. package/src/html/image-converter.ts +200 -0
  330. package/src/html-to-pdf.ts +410 -0
  331. package/src/image/base-decoder.ts +149 -0
  332. package/src/image/image-service.ts +188 -0
  333. package/src/image/jpeg-decoder.ts +73 -0
  334. package/src/image/png-decoder.ts +550 -0
  335. package/src/image/types.ts +20 -0
  336. package/src/image/webp-decoder.ts +242 -0
  337. package/src/image/webp-huffman.ts +218 -0
  338. package/src/image/webp-riff-parser.ts +54 -0
  339. package/src/image/webp-vp8l-decoder.ts +199 -0
  340. package/src/index.ts +35 -0
  341. package/src/layout/context/float-context.ts +62 -0
  342. package/src/layout/context/layout-environment.ts +29 -0
  343. package/src/layout/debug.ts +18 -0
  344. package/src/layout/inline/bounding-box-calculator.ts +132 -0
  345. package/src/layout/inline/font-baseline-calculator.ts +76 -0
  346. package/src/layout/inline/inline-utils.ts +94 -0
  347. package/src/layout/inline/layout.ts +285 -0
  348. package/src/layout/inline/line_breaker.ts +109 -0
  349. package/src/layout/inline/measurement.ts +144 -0
  350. package/src/layout/inline/run-placer.ts +139 -0
  351. package/src/layout/inline/text-alignment.ts +70 -0
  352. package/src/layout/inline/tokenizer.ts +195 -0
  353. package/src/layout/inline/types.ts +76 -0
  354. package/src/layout/pipeline/context-factory.ts +16 -0
  355. package/src/layout/pipeline/default-engine.ts +24 -0
  356. package/src/layout/pipeline/engine.ts +59 -0
  357. package/src/layout/pipeline/layout-tree.ts +13 -0
  358. package/src/layout/pipeline/out-of-flow-manager.ts +73 -0
  359. package/src/layout/pipeline/strategy.ts +12 -0
  360. package/src/layout/pipeline/text-metrics-initializer.ts +13 -0
  361. package/src/layout/strategies/block.ts +236 -0
  362. package/src/layout/strategies/display-none.ts +14 -0
  363. package/src/layout/strategies/fallback.ts +15 -0
  364. package/src/layout/strategies/flex.ts +477 -0
  365. package/src/layout/strategies/fragmentation.ts +17 -0
  366. package/src/layout/strategies/grid.ts +247 -0
  367. package/src/layout/strategies/image.ts +342 -0
  368. package/src/layout/strategies/inline.ts +128 -0
  369. package/src/layout/strategies/table.ts +595 -0
  370. package/src/layout/table/cell_layout.ts +31 -0
  371. package/src/layout/table/diagnostics.ts +19 -0
  372. package/src/layout/text-run.ts +42 -0
  373. package/src/layout/utils/content-measurer.ts +117 -0
  374. package/src/layout/utils/display-utils.ts +24 -0
  375. package/src/layout/utils/floats.ts +98 -0
  376. package/src/layout/utils/gap-calculator.ts +167 -0
  377. package/src/layout/utils/inline-formatter.ts +31 -0
  378. package/src/layout/utils/inline-formatting.ts +9 -0
  379. package/src/layout/utils/margin.ts +140 -0
  380. package/src/layout/utils/node-math.ts +237 -0
  381. package/src/layout/utils/overflow.ts +14 -0
  382. package/src/layout/utils/sizing.ts +12 -0
  383. package/src/layout/utils/text-metrics.ts +361 -0
  384. package/src/logging/debug.ts +58 -0
  385. package/src/pdf/font/base14/widths-courier-bold.ts +159 -0
  386. package/src/pdf/font/base14/widths-courier.ts +159 -0
  387. package/src/pdf/font/base14/widths-helvetica-bold.ts +158 -0
  388. package/src/pdf/font/base14/widths-helvetica.ts +158 -0
  389. package/src/pdf/font/base14/widths-times-bold.ts +158 -0
  390. package/src/pdf/font/base14/widths-times-roman.ts +158 -0
  391. package/src/pdf/font/base14/widths-types.ts +25 -0
  392. package/src/pdf/font/base14-widths.ts +32 -0
  393. package/src/pdf/font/blur.ts +81 -0
  394. package/src/pdf/font/builtin-fonts.browser.ts +262 -0
  395. package/src/pdf/font/builtin-fonts.ts +126 -0
  396. package/src/pdf/font/composite-glyph-parser.ts +242 -0
  397. package/src/pdf/font/embedder.ts +395 -0
  398. package/src/pdf/font/font-config.ts +190 -0
  399. package/src/pdf/font/font-registry.ts +263 -0
  400. package/src/pdf/font/font-subset.ts +258 -0
  401. package/src/pdf/font/glyph-atlas-maxrects.ts +305 -0
  402. package/src/pdf/font/glyph-atlas-tuner.ts +98 -0
  403. package/src/pdf/font/glyph-atlas.ts +226 -0
  404. package/src/pdf/font/glyph-cache.ts +127 -0
  405. package/src/pdf/font/loca-reader.ts +109 -0
  406. package/src/pdf/font/managers/font-resource-manager.ts +73 -0
  407. package/src/pdf/font/managers/subset-resource-manager.ts +164 -0
  408. package/src/pdf/font/rasterizer.ts +270 -0
  409. package/src/pdf/font/resolvers/base-font-mapper.ts +77 -0
  410. package/src/pdf/font/resolvers/family-resolver.ts +33 -0
  411. package/src/pdf/font/resolvers/weight-style-applicator.ts +63 -0
  412. package/src/pdf/font/simple-glyph-parser.ts +289 -0
  413. package/src/pdf/font/to-unicode.ts +109 -0
  414. package/src/pdf/font/transformation-matrix.ts +136 -0
  415. package/src/pdf/font/ttf-cmap.ts +180 -0
  416. package/src/pdf/font/ttf-global-metrics.ts +58 -0
  417. package/src/pdf/font/ttf-glyf.ts +125 -0
  418. package/src/pdf/font/ttf-glyph-metrics.ts +43 -0
  419. package/src/pdf/font/ttf-lite.ts +269 -0
  420. package/src/pdf/font/ttf-table-parser.ts +132 -0
  421. package/src/pdf/font/ttf-table-provider.ts +61 -0
  422. package/src/pdf/font/widths.ts +79 -0
  423. package/src/pdf/font-subset/font-registry.ts +127 -0
  424. package/src/pdf/header-footer-layout.ts +153 -0
  425. package/src/pdf/header-footer-painter.ts +209 -0
  426. package/src/pdf/header-footer-renderer.ts +357 -0
  427. package/src/pdf/header-footer-tokens.ts +55 -0
  428. package/src/pdf/header-footer.ts +25 -0
  429. package/src/pdf/layout-tree-builder.ts +261 -0
  430. package/src/pdf/page-painter.ts +241 -0
  431. package/src/pdf/pagination.ts +155 -0
  432. package/src/pdf/primitives/pdf-builder.ts +378 -0
  433. package/src/pdf/primitives/pdf-bytes.ts +40 -0
  434. package/src/pdf/primitives/pdf-document.ts +108 -0
  435. package/src/pdf/primitives/pdf-reference-manager.ts +47 -0
  436. package/src/pdf/primitives/pdf-resource-registries.ts +255 -0
  437. package/src/pdf/primitives/pdf-serializers.ts +194 -0
  438. package/src/pdf/primitives/pdf-types.ts +73 -0
  439. package/src/pdf/render.ts +210 -0
  440. package/src/pdf/renderer/box-painter.ts +236 -0
  441. package/src/pdf/renderer/page-paint.ts +102 -0
  442. package/src/pdf/renderer/paint-box-shadows.ts +218 -0
  443. package/src/pdf/renderer/radius.ts +58 -0
  444. package/src/pdf/renderers/graphics-state-manager.ts +40 -0
  445. package/src/pdf/renderers/image-renderer.ts +127 -0
  446. package/src/pdf/renderers/radius-utils.ts +80 -0
  447. package/src/pdf/renderers/rectangle-renderer.ts +129 -0
  448. package/src/pdf/renderers/rounded-rect-path.ts +120 -0
  449. package/src/pdf/renderers/shape-renderer.ts +563 -0
  450. package/src/pdf/renderers/shape-utils.ts +194 -0
  451. package/src/pdf/renderers/text-decoration-renderer.ts +313 -0
  452. package/src/pdf/renderers/text-encoder.ts +41 -0
  453. package/src/pdf/renderers/text-font-resolver.ts +75 -0
  454. package/src/pdf/renderers/text-renderer-utils.ts +28 -0
  455. package/src/pdf/renderers/text-renderer.ts +391 -0
  456. package/src/pdf/renderers/text-shadow-renderer.ts +300 -0
  457. package/src/pdf/shading/gradient-service.ts +525 -0
  458. package/src/pdf/shading/index.ts +1 -0
  459. package/src/pdf/stacking/build-stacking-contexts.ts +93 -0
  460. package/src/pdf/stacking/resolve-paint-order.ts +157 -0
  461. package/src/pdf/stacking/types.ts +40 -0
  462. package/src/pdf/svg/aspect-ratio.ts +81 -0
  463. package/src/pdf/svg/coordinate-mapper.ts +81 -0
  464. package/src/pdf/svg/geometry-builder.ts +45 -0
  465. package/src/pdf/svg/render-svg.ts +296 -0
  466. package/src/pdf/svg/shape-renderer.ts +463 -0
  467. package/src/pdf/svg/style-computer.ts +246 -0
  468. package/src/pdf/transform-adapter.ts +26 -0
  469. package/src/pdf/types.ts +377 -0
  470. package/src/pdf/utils/background-layer-resolver.ts +439 -0
  471. package/src/pdf/utils/background-tiles.ts +192 -0
  472. package/src/pdf/utils/border-dashes.ts +109 -0
  473. package/src/pdf/utils/border-radius-utils.ts +86 -0
  474. package/src/pdf/utils/box-dimensions-utils.ts +47 -0
  475. package/src/pdf/utils/clip-path-resolver.ts +50 -0
  476. package/src/pdf/utils/clipping-path-builder.ts +190 -0
  477. package/src/pdf/utils/color-utils.ts +102 -0
  478. package/src/pdf/utils/coordinate-transformer.ts +30 -0
  479. package/src/pdf/utils/drop-shadow-raster.ts +233 -0
  480. package/src/pdf/utils/encoding.ts +98 -0
  481. package/src/pdf/utils/glyph-atlas-registrar.ts +13 -0
  482. package/src/pdf/utils/glyph-run-renderer.ts +129 -0
  483. package/src/pdf/utils/image-command-partitioner.ts +28 -0
  484. package/src/pdf/utils/image-matrix-builder.ts +31 -0
  485. package/src/pdf/utils/image-utils.ts +26 -0
  486. package/src/pdf/utils/list-utils.ts +194 -0
  487. package/src/pdf/utils/node-text-run-factory.ts +202 -0
  488. package/src/pdf/utils/page-resource-registrar.ts +46 -0
  489. package/src/pdf/utils/result-combiner.ts +102 -0
  490. package/src/pdf/utils/shadow-utils.ts +127 -0
  491. package/src/pdf/utils/text-alignment-resolver.ts +76 -0
  492. package/src/pdf/utils/text-decoration-utils.ts +64 -0
  493. package/src/pdf/utils/text-layout-adjuster.ts +185 -0
  494. package/src/pdf/utils/text-utils.ts +193 -0
  495. package/src/pdf/utils/transform-scope-manager.ts +69 -0
  496. package/src/render/offset.ts +170 -0
  497. package/src/shim/empty.ts +2 -0
  498. package/src/shim/fs-empty.ts +5 -0
  499. package/src/shim/url-empty.ts +7 -0
  500. package/src/shim/zlib-empty.ts +9 -0
  501. package/src/style/shorthands/index.ts +19 -0
  502. package/src/style/ua/defaults.ts +69 -0
  503. package/src/svg/index.ts +4 -0
  504. package/src/svg/parser-registry.ts +71 -0
  505. package/src/svg/parser.ts +486 -0
  506. package/src/svg/path-data.ts +515 -0
  507. package/src/svg/types.ts +194 -0
  508. package/src/text/line-breaker.ts +321 -0
  509. package/src/text/text-transform.ts +43 -0
  510. package/src/text/text.ts +33 -0
  511. package/src/transform/css-parser.ts +95 -0
  512. package/src/types/fonts.ts +62 -0
  513. package/src/types/public.ts +19 -0
  514. package/src/units/page-utils.ts +58 -0
  515. package/src/units/units.ts +50 -0
  516. package/src/utils/base64.ts +24 -0
  517. package/test-output.txt +79 -0
  518. package/tests/css/background-parser.spec.ts +14 -0
  519. package/tests/css/clip-path-parser.spec.ts +66 -0
  520. package/tests/environment/path-resolution.spec.ts +104 -0
  521. package/tests/helpers/ai-layout-diagnostics.ts +141 -0
  522. package/tests/helpers/render-utils.ts +52 -0
  523. package/tests/helpers/text-geometry.ts +56 -0
  524. package/tests/layout/custom-properties.test.ts +38 -0
  525. package/tests/layout/gap-calculator.spec.ts +196 -0
  526. package/tests/layout/inline-background-alignment.spec.ts +93 -0
  527. package/tests/layout/inline-fragments.spec.ts +26 -0
  528. package/tests/layout/run-placer-baseline.spec.ts +108 -0
  529. package/tests/pdf/alignments.spec.ts +26 -0
  530. package/tests/pdf/background-clip.spec.ts +57 -0
  531. package/tests/pdf/background-repeat-space-round.spec.ts +35 -0
  532. package/tests/pdf/background-repeat.spec.ts +137 -0
  533. package/tests/pdf/border-radius.spec.ts +151 -0
  534. package/tests/pdf/clip-path.spec.ts +92 -0
  535. package/tests/pdf/radial-gradient.spec.ts +50 -0
  536. package/tests/pdf/svg-stroke-dash.spec.ts +81 -0
  537. package/tests/pdf/text-transform-matrix.spec.ts +43 -0
  538. package/tsconfig.json +17 -0
  539. package/types/fonts.js +10 -0
  540. package/vitest.config.ts +9 -0
package/playground/public/examples/very-complex-css.html ADDED
@@ -0,0 +1,293 @@
1
+ <!DOCTYPE html>
2
+ <html lang="pt-BR">
3
+ <head>
4
+ <meta charset="utf-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
6
+ <title>Conversão HTML→PDF — Fluxo Puro (Sem JS)</title>
7
+ <style>
8
+ :root{
9
+ --muted:#475569; --brandA:#7c3aed; --brandB:#06b6d4; --brandC:#22c55e;
10
+ --ok:#10b981; --err:#ef4444; --warn:#f59e0b; --gap:20px; --radius:16px;
11
+ --paper-w:210mm;
12
+ --fs-hero: clamp(30px, 5vw, 58px); --fs-h2: clamp(20px, 3vw, 32px); --fs-base: 12pt;
13
+ --body-font: system-ui,-apple-system,"Segoe UI",Roboto,Ubuntu,"Helvetica Neue",Arial,sans-serif;
14
+ --mono: ui-monospace,Menlo,Consolas,"Courier New",monospace;
15
+ }
16
+ *{box-sizing:border-box}
17
+ html,body{height:100%;margin:0}
18
+ body{
19
+ font-family:var(--body-font); line-height:1.5; color:#0f172a;
20
+ background:
21
+ radial-gradient(1200px 500px at 20% -10%, #e0e7ff66, transparent 60%),
22
+ linear-gradient(180deg, #f9fafb 0%, #f1f5f9 100%);
23
+ -webkit-font-smoothing: antialiased;
24
+ }
25
+
26
+ /* HEADER (fluxo) + integração com HERO */
27
+ .header{
28
+ width:var(--paper-w); margin:20mm auto -20mm auto;
29
+ background:linear-gradient(180deg,#ffffff 0%,#f8fafc 100%);
30
+ border:1px solid #00000012; border-radius:12px 12px 0 0;
31
+ box-shadow:0 10px 24px rgba(0,0,0,0.05);
32
+ padding:10mm 12mm; position:relative; z-index:2;
33
+ }
34
+ .header .title{ display:flex; gap:8mm; align-items:center; font-weight:700 }
35
+ .header .badge{
36
+ padding:2mm 4mm; border-radius:6mm;
37
+ background:linear-gradient(135deg, var(--brandA), var(--brandB));
38
+ color:#fff; letter-spacing:.03em;
39
+ }
40
+
41
+ /* HERO */
42
+ .hero{
43
+ margin-top:0; padding:32mm 28mm 20mm 28mm;
44
+ background:
45
+ radial-gradient(1000px 400px at 50% -10%, #c7d2fe40, transparent 60%),
46
+ linear-gradient(180deg, #ffffff 0%, #f9fafb 100%);
47
+ border-top:1px solid rgba(0,0,0,0.05);
48
+ border-radius:0 0 12px 12px;
49
+ box-shadow:0 8px 30px rgba(15,23,42,0.08);
50
+ }
51
+ .hero h1{
52
+ font-size:var(--fs-hero); margin:0 0 8mm 0; line-height:1.05; letter-spacing:-.02em;
53
+ background:linear-gradient(90deg,#7c3aed 0%,#06b6d4 40%,#22c55e 80%);
54
+ -webkit-background-clip:text; background-clip:text; color:transparent;
55
+ }
56
+ .hero p{ color:var(--muted); margin:0 0 12mm 0 }
57
+
58
+ /* KPI CARDS — com proteção contra overflow do <strong> */
59
+ .kpi{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6mm }
60
+ .kpi .card{
61
+ display:flex; flex-direction:column; justify-content:space-between; align-items:center;
62
+ min-height: 90px; text-align:center;
63
+ padding:8mm; border-radius:14px;
64
+ background:rgba(255,255,255,0.9);
65
+ backdrop-filter: blur(6px);
66
+ border:1px solid rgba(255,255,255,0.3);
67
+ box-shadow:0 8px 24px rgba(0,0,0,0.06);
68
+ word-wrap: break-word; overflow-wrap: break-word;
69
+ }
70
+ .kpi .card strong{
71
+ display:block; margin-bottom:3mm; font-size:18pt; max-width:100%;
72
+ text-align:center; word-break: break-word; overflow-wrap: anywhere;
73
+ }
74
+ .kpi .bar{ height:10mm; border-radius:999px; background:linear-gradient(90deg,#7c3aed,#06b6d4) }
75
+
76
+ /* PÁGINA/SEÇÕES NO FLUXO */
77
+ .page{
78
+ width:var(--paper-w); margin:0 auto 12mm auto;
79
+ background:#fff; border:1px solid #00000012; border-radius:12px;
80
+ box-shadow:0 20px 60px rgba(2,6,23,.10);
81
+ }
82
+ .section{ padding:10mm 28mm; display:grid; gap:8mm }
83
+ .section h2{ font-size:var(--fs-h2); margin:0 }
84
+ .section p{ font-size:var(--fs-base); margin:0; color:#334155 }
85
+
86
+ /* GRID/FLEX */
87
+ .grid{ display:grid; grid-template-columns:repeat(12,1fr); gap:var(--gap) }
88
+ .tile{
89
+ grid-column: span 4; padding:6mm; border-radius:14px;
90
+ background:linear-gradient(180deg,#fff,#f8fafc);
91
+ border:1px solid #00000010;
92
+ box-shadow:0 2px 0 #fff inset, 0 18px 36px rgba(2,6,23,.08);
93
+ }
94
+ .tile .bar{ height:10mm; border-radius:999px; background:linear-gradient(90deg,#22c55e,#06b6d4); margin-bottom:4mm }
95
+
96
+ /* LISTA COM COUNTERS */
97
+ .counter-demo{ counter-reset:steps 0; display:grid; gap:4mm }
98
+ .counter-demo div{
99
+ counter-increment:steps 1; padding:4mm 6mm; border-radius:10px;
100
+ background:linear-gradient(180deg,#fff,#f1f5f9);
101
+ border:1px solid #00000012; position:relative;
102
+ }
103
+ .counter-demo div::before{
104
+ content: counter(steps, decimal-leading-zero);
105
+ position:absolute; left:-10mm; top:50%; transform:translateY(-50%);
106
+ font-variant-numeric: tabular-nums; font-weight:700;
107
+ background:linear-gradient(135deg,#7c3aed,#06b6d4); color:#fff;
108
+ padding:2mm 3.2mm; border-radius:8px; box-shadow:0 8px 16px rgba(2,6,23,.2);
109
+ }
110
+
111
+ /* TABELA */
112
+ .table-wrap{ break-inside:avoid; background:#fff; border:1px solid #00000015; border-radius:12px; overflow:hidden; box-shadow:0 12px 30px rgba(2,6,23,.08) }
113
+ table{ width:100%; border-collapse:collapse; font-size:10pt }
114
+ thead{ background:linear-gradient(180deg,#f8fafc,#eef2ff) }
115
+ thead th, tfoot td{ padding:4mm 6mm; text-align:left; color:#0f172a; border-bottom:1px solid #00000015 }
116
+ tbody td{ padding:3.2mm 6mm; border-bottom:1px solid #0000000a }
117
+ tbody tr:nth-child(odd){ background:#fafafa }
118
+ tfoot td{ border-top:1px solid #00000015; font-weight:700 }
119
+
120
+ /* EFEITOS */
121
+ .fx-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--gap) }
122
+ .fx{
123
+ padding:6mm; border-radius:18px;
124
+ background:radial-gradient(600px 200px at 20% -10%, #a78bfa44, transparent 60%), #ffffff;
125
+ border:1px solid #00000012; overflow:hidden;
126
+ box-shadow:0 8px 20px rgba(0,0,0,0.05);
127
+ }
128
+ .fx .blob{
129
+ width:90px; height:90px;
130
+ background: radial-gradient(circle at 30% 30%, #22d3ee, #7c3aed);
131
+ border-radius:30% 70% 60% 40% / 30% 30% 70% 70%;
132
+ filter: drop-shadow(0 20px 40px rgba(2,6,23,.25));
133
+ transform: rotate(15deg);
134
+ clip-path: path("M0,40 C20,0 70,0 90,40 C70,90 20,90 0,40 Z");
135
+ }
136
+ .img-mask{ display:flex; gap:8mm; align-items:center }
137
+ .badge-img{
138
+ width:64px; height:64px;
139
+ --mask: radial-gradient(circle at 70% 30%, white 50%, transparent 51%),
140
+ radial-gradient(circle at 30% 70%, white 50%, transparent 51%);
141
+ -webkit-mask: var(--mask); mask: var(--mask);
142
+ border:2px solid #00000022; border-radius:12px;
143
+ background:linear-gradient(135deg,#fda4af,#f0abfc,#93c5fd);
144
+ }
145
+ .cliptext{
146
+ font-size:28pt; font-weight:900; letter-spacing:.02em; margin:0;
147
+ background:linear-gradient(90deg,#0ea5e9,#22c55e,#f59e0b,#ef4444);
148
+ -webkit-background-clip:text; background-clip:text; color:transparent;
149
+ }
150
+
151
+ /* CARDS DE QUEBRA — versão “não vazia” */
152
+ .pagebreaker{ display:grid; grid-template-columns:repeat(2,1fr); gap:6mm }
153
+ .box{
154
+ min-height:55mm; padding:6mm; border-radius:14px;
155
+ background:
156
+ radial-gradient(400px 200px at 30% 20%, #e0e7ff66, transparent 70%),
157
+ linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
158
+ border:1px solid rgba(0,0,0,0.06);
159
+ box-shadow:
160
+ 0 2px 3px rgba(0,0,0,0.04),
161
+ 0 8px 16px rgba(0,0,0,0.06);
162
+ break-inside: avoid;
163
+ transition: transform .15s ease, box-shadow .15s ease;
164
+ }
165
+ .box:hover{
166
+ transform: translateY(-1mm);
167
+ box-shadow:
168
+ 0 4px 8px rgba(0,0,0,0.08),
169
+ 0 10px 24px rgba(0,0,0,0.10);
170
+ }
171
+
172
+ /* FOOTER (fluxo) */
173
+ .footer{
174
+ width:var(--paper-w); margin:0 auto 20mm auto;
175
+ background:linear-gradient(180deg,#f8fafc,#ffffff);
176
+ border:1px solid #00000012; border-radius:0 0 12px 12px;
177
+ box-shadow:0 10px 24px rgba(0,0,0,0.05);
178
+ padding:10mm 12mm;
179
+ }
180
+ .footer .muted{ color:var(--muted); font-size:10pt }
181
+
182
+ /* IMPRESSÃO */
183
+ @page{ size:A4; margin:16mm 14mm 16mm 14mm }
184
+ @media print{
185
+ body{ background:white !important }
186
+ .page{ margin:0 auto; border-radius:0; box-shadow:none; border:1px solid #00000010 }
187
+ thead{ display: table-header-group }
188
+ tfoot{ display: table-footer-group }
189
+ }
190
+ .mono{font-family:var(--mono)}
191
+ .right{text-align:right}
192
+ </style>
193
+ </head>
194
+ <body>
195
+
196
+ <header class="header">
197
+ <div class="title">
198
+ <div class="badge">HTML→PDF Stress</div>
199
+ <div>Fluxo puro • sem JS • sem fixed/sticky</div>
200
+ </div>
201
+ <p class="muted">Documento para testar conversão PDF com layout 100% no fluxo e visual refinado.</p>
202
+ </header>
203
+
204
+ <section class="hero">
205
+ <h1>Conversão HTML → PDF (sem JS)</h1>
206
+ <p>Gradientes, Grid/Flex, Tabelas, Efeitos, SVG, Quebras e Formulário — tudo no fluxo.</p>
207
+ <div class="kpi">
208
+ <div class="card"><span>Layout</span><strong>Grid • Flex</strong><div class="bar"></div></div>
209
+ <div class="card"><span>Páginas</span><strong>A4</strong><div class="bar" style="background:linear-gradient(90deg,#22c55e,#16a34a)"></div></div>
210
+ <div class="card"><span>Efeitos</span><strong>Clip • Filtros</strong><div class="bar" style="background:linear-gradient(90deg,#f59e0b,#ef4444)"></div></div>
211
+ <div class="card"><span>SVG</span><strong>Gradiente + Sombra</strong><div class="bar" style="background:linear-gradient(90deg,#06b6d4,#7c3aed)"></div></div>
212
+ </div>
213
+ </section>
214
+
215
+ <main class="page">
216
+ <section class="section">
217
+ <h2>Grid, Flex e <code class="mono">clamp()/calc()</code></h2>
218
+ <div class="grid">
219
+ <div class="tile"><strong>Tile 1</strong><div class="bar"></div><p>Texto dimensionado com <code class="mono">clamp()</code>.</p></div>
220
+ <div class="tile"><strong>Tile 2</strong><div class="bar" style="background:linear-gradient(90deg,#ef4444,#f59e0b)"></div><p>Sombras e bordas suaves.</p></div>
221
+ <div class="tile"><strong>Tile 3</strong><div class="bar" style="background:linear-gradient(90deg,#22c55e,#06b6d4)"></div><p>Gradientes via variáveis CSS.</p></div>
222
+ </div>
223
+ </section>
224
+
225
+ <section class="section">
226
+ <h2>Listas, Pseudo-elementos e Contadores</h2>
227
+ <div class="counter-demo">
228
+ <div>Índice via <code class="mono">counter()</code>.</div>
229
+ <div>Quebra estável com <code class="mono">break-inside: avoid</code>.</div>
230
+ <div>Fundo em gradiente vertical.</div>
231
+ </div>
232
+ </section>
233
+
234
+ <section class="section">
235
+ <h2>Tabela com Cabeçalho/Rodapé Repetidos</h2>
236
+ <div class="table-wrap">
237
+ <table>
238
+ <thead><tr><th>#</th><th>Descrição</th><th>Valor</th><th>Status</th></tr></thead>
239
+ <tbody>
240
+ <tr><td>1</td><td>Entrada longa para testar quebra de linha.</td><td>R$ 120,00</td><td><b style="color:var(--ok)">OK</b></td></tr>
241
+ <tr><td>2</td><td>Texto curto.</td><td>R$ 80,00</td><td><b style="color:var(--warn)">PENDENTE</b></td></tr>
242
+ <tr><td>3</td><td>Valores tabulares.</td><td>R$ 50,00</td><td><b style="color:var(--err)">ERRO</b></td></tr>
243
+ </tbody>
244
+ <tfoot><tr><td colspan="3">Total (não calculado)</td><td class="right">—</td></tr></tfoot>
245
+ </table>
246
+ </div>
247
+ </section>
248
+
249
+ <section class="section">
250
+ <h2>Efeitos</h2>
251
+ <div class="fx-grid">
252
+ <div class="fx"><h3>Glow & Clip</h3><div class="blob" aria-hidden="true"></div></div>
253
+ <div class="fx"><h3>Mask</h3><div class="img-mask"><div class="badge-img" aria-hidden="true"></div><p class="muted">Máscara via <em>radial-gradient</em>.</p></div></div>
254
+ <div class="fx"><h3>Texto com Gradiente</h3><p class="cliptext">Gradient Text</p></div>
255
+ </div>
256
+ </section>
257
+
258
+ <section class="section">
259
+ <h2>SVG Inline com Gradiente e Sombra</h2>
260
+ <svg width="100%" height="120" viewBox="0 0 800 120" role="img" aria-label="Banner com gradiente">
261
+ <defs>
262
+ <linearGradient id="g1" x1="0" x2="1" y1="0" y2="0">
263
+ <stop offset="0%" stop-color="#7c3aed"/>
264
+ <stop offset="50%" stop-color="#06b6d4"/>
265
+ <stop offset="100%" stop-color="#22c55e"/>
266
+ </linearGradient>
267
+ <filter id="shadow" x="-20%" y="-20%" width="140%" height="140%">
268
+ <feDropShadow dx="0" dy="8" stdDeviation="6" flood-color="#000" flood-opacity=".25"/>
269
+ </filter>
270
+ </defs>
271
+ <rect x="10" y="20" width="780" height="80" rx="16" fill="url(#g1)" filter="url(#shadow)" />
272
+ <text x="400" y="75" text-anchor="middle" fill="#fff" font-family="system-ui, Arial" font-weight="800" font-size="36">SVG + Gradiente + Sombra</text>
273
+ </svg>
274
+ </section>
275
+
276
+ <section class="section">
277
+ <h2>Quebra de Página com Cards</h2>
278
+ <div class="pagebreaker">
279
+ <div class="box">Caixa 1 — evita divisão.</div>
280
+ <div class="box">Caixa 2 — sombras e gradiente.</div>
281
+ <div class="box">Caixa 3 — overflow proposital.</div>
282
+ <div class="box">Caixa 4 — mais conteúdo.</div>
283
+ </div>
284
+ </section>
285
+ </main>
286
+
287
+ <footer class="footer">
288
+ <div><strong>Rodapé</strong> — em fluxo (sem contador de página, sem JS).</div>
289
+ <p class="muted">Compatível com motores que suportam CSS3 e PDF A4.</p>
290
+ </footer>
291
+
292
+ </body>
293
+ </html>
package/playground/public/examples/webp-example.html ADDED
@@ -0,0 +1,13 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>WebP Image Example</title>
7
+ </head>
8
+ <body>
9
+ <h1>WebP Image Example</h1>
10
+ <p>This example demonstrates the rendering of a WebP image.</p>
11
+ <img src="/assets/1.webp" alt="Nærøyfjorden, Norway">
12
+ </body>
13
+ </html>
package/playground/public/examples/z-index-demo.html ADDED
@@ -0,0 +1,93 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <style>
5
+ body {
6
+ margin: 0;
7
+ padding: 20px;
8
+ font-family: Arial, sans-serif;
9
+ }
10
+
11
+ .container {
12
+ position: relative;
13
+ width: 400px;
14
+ height: 300px;
15
+ border: 1px solid #ccc;
16
+ margin: 20px;
17
+ }
18
+
19
+ .box {
20
+ position: absolute;
21
+ width: 150px;
22
+ height: 150px;
23
+ display: flex;
24
+ align-items: center;
25
+ justify-content: center;
26
+ font-weight: bold;
27
+ color: white;
28
+ border: 2px solid black;
29
+ }
30
+
31
+ .red-box {
32
+ background-color: red;
33
+ top: 20px;
34
+ left: 20px;
35
+ z-index: 1;
36
+ }
37
+
38
+ .blue-box {
39
+ background-color: blue;
40
+ top: 50px;
41
+ left: 50px;
42
+ z-index: 2;
43
+ }
44
+
45
+ .green-box {
46
+ background-color: green;
47
+ top: 80px;
48
+ left: 80px;
49
+ z-index: 3;
50
+ }
51
+
52
+
53
+
54
+ .info {
55
+ margin: 20px;
56
+ padding: 15px;
57
+ background-color: #f5f5f5;
58
+ border-radius: 5px;
59
+ }
60
+
61
+ .info h3 {
62
+ margin-top: 0;
63
+ color: #333;
64
+ }
65
+
66
+ .info p {
67
+ margin: 5px 0;
68
+ }
69
+ </style>
70
+ </head>
71
+ <body>
72
+
73
+ <h1>Z-Index Demo</h1>
74
+
75
+ <div class="info">
76
+ <h3>Z-Index Stacking Order</h3>
77
+ <p><strong>Red box:</strong> z-index: 1 (bottom)</p>
78
+ <p><strong>Blue box:</strong> z-index: 2 (middle)</p>
79
+ <p><strong>Green box:</strong> z-index: 3 (top)</p>
80
+ </div>
81
+
82
+ <div class="container">
83
+ <div class="box red-box">Red<br/>z-index: 1</div>
84
+ <div class="box blue-box">Blue<br/>z-index: 2</div>
85
+ <div class="box green-box">Green<br/>z-index: 3</div>
86
+ </div>
87
+
88
+ <div class="info">
89
+ <p>The green box appears on top, followed by blue, then red.</p>
90
+ </div>
91
+
92
+ </body>
93
+ </html>
package/playground/public/examples.json ADDED
@@ -0,0 +1,240 @@
1
+ [
2
+ {
3
+ "id": "starter-report",
4
+ "label": "Starter Report (EN)",
5
+ "htmlUrl": "examples/starter-report.html",
6
+ "cssUrl": "examples/starter-report.css"
7
+ },
8
+ {
9
+ "id": "monthly-summary",
10
+ "label": "Relatório Básico (pt-BR)",
11
+ "htmlUrl": "examples/monthly-summary.html"
12
+ },
13
+ {
14
+ "id": "accents-test",
15
+ "label": "Accents Test (pt-BR)",
16
+ "htmlUrl": "examples/accents-test.html"
17
+ },
18
+ {
19
+ "id": "lorem-span",
20
+ "label": "Span Lorem Ipsum Test",
21
+ "htmlUrl": "examples/lorem-span.html"
22
+ },
23
+ {
24
+ "id": "simple-table",
25
+ "label": "Simple Table Test",
26
+ "htmlUrl": "examples/simple-table.html"
27
+ },
28
+ {
29
+ "id": "bold-showcase",
30
+ "label": "Bold Typography Showcase",
31
+ "htmlUrl": "examples/bold-showcase.html"
32
+ },
33
+ {
34
+ "id": "justify-text",
35
+ "label": "Justified Text Showcase",
36
+ "htmlUrl": "examples/justify-text.html"
37
+ },
38
+ {
39
+ "id": "text-indent-showcase",
40
+ "label": "Text Indent Showcase",
41
+ "htmlUrl": "examples/text-indent-showcase.html"
42
+ },
43
+ {
44
+ "id": "multi-page-lorem",
45
+ "label": "Multi-Page Lorem Ipsum Document",
46
+ "htmlUrl": "examples/multi-page-lorem.html"
47
+ },
48
+ {
49
+ "id": "image-showcase",
50
+ "label": "Image Showcase with Duck.jpg",
51
+ "htmlUrl": "examples/image-showcase.html"
52
+ },
53
+ {
54
+ "id": "bold-strike-example",
55
+ "label": "Bold and Strike Typography Example",
56
+ "htmlUrl": "examples/bold-strike-example.html"
57
+ },
58
+ {
59
+ "id": "rounded-borders-test",
60
+ "label": "Rounded Borders Test",
61
+ "htmlUrl": "examples/rounded-borders-test.html"
62
+ },
63
+ {
64
+ "id": "simple-list",
65
+ "label": "List Style Type Showcase",
66
+ "htmlUrl": "examples/simple-list.html"
67
+ },
68
+ {
69
+ "id": "centered-shadow-div",
70
+ "label": "Centered Shadow Div Example",
71
+ "htmlUrl": "examples/centered-shadow-div.html"
72
+ },
73
+ {
74
+ "id": "png-image-example",
75
+ "label": "PNG Image Example",
76
+ "htmlUrl": "examples/png-image-example.html"
77
+ },
78
+ {
79
+ "id": "linear-gradient-example",
80
+ "label": "Linear Gradient Example",
81
+ "htmlUrl": "examples/linear-gradient-example.html"
82
+ },
83
+ {
84
+ "id": "red-rectangle",
85
+ "label": "Red Rectangle Example",
86
+ "htmlUrl": "examples/red-rectangle.html"
87
+ },
88
+ {
89
+ "id": "simple-svg",
90
+ "label": "Simple SVG Example",
91
+ "htmlUrl": "examples/simple-svg.html"
92
+ },
93
+ {
94
+ "id": "svg-path-gallery",
95
+ "label": "SVG Path Gallery",
96
+ "htmlUrl": "examples/svg-path-gallery.html"
97
+ },
98
+ {
99
+ "id": "svg-transform-stack",
100
+ "label": "SVG Transform Stack",
101
+ "htmlUrl": "examples/svg-transform-stack.html"
102
+ },
103
+ {
104
+ "id": "svg-aspect-ratio-showcase",
105
+ "label": "SVG Aspect Ratio Showcase",
106
+ "htmlUrl": "examples/svg-aspect-ratio-showcase.html"
107
+ },
108
+ {
109
+ "id": "very-complex-css",
110
+ "label": "Very Complex CSS Example (pt-BR)",
111
+ "htmlUrl": "examples/very-complex-css.html"
112
+ },
113
+ {
114
+ "id": "svg-gradients-showcase",
115
+ "label": "SVG Gradients Showcase",
116
+ "htmlUrl": "examples/svg-gradients-showcase.html"
117
+ },
118
+ {
119
+ "id": "svg-gradients-linear",
120
+ "label": "SVG Linear Gradients",
121
+ "htmlUrl": "examples/svg-gradients-linear.html"
122
+ },
123
+ {
124
+ "id": "svg-gradients-radial",
125
+ "label": "SVG Radial Gradients",
126
+ "htmlUrl": "examples/svg-gradients-radial.html"
127
+ },
128
+ {
129
+ "id": "svg-transforms-demo",
130
+ "label": "SVG Transforms Demo",
131
+ "htmlUrl": "examples/svg-transforms-demo.html"
132
+ },
133
+ {
134
+ "id": "svg-images-clipping",
135
+ "label": "SVG Images and Clipping",
136
+ "htmlUrl": "examples/svg-images-clipping.html"
137
+ },
138
+ {
139
+ "id": "svg-radial-transform-demo",
140
+ "label": "SVG Radial Gradient Transform Demo",
141
+ "htmlUrl": "examples/svg-radial-transform-demo.html"
142
+ },
143
+ {
144
+ "id": "header-footer-example",
145
+ "label": "Header and Footer Example (pt-BR)",
146
+ "htmlUrl": "examples/header-footer-example.html",
147
+ "headerUrl": "examples/header-example.html",
148
+ "footerUrl": "examples/footer-example.html"
149
+ },
150
+ {
151
+ "id": "advanced-selectors-demo",
152
+ "label": "Advanced CSS Selectors Demo",
153
+ "htmlUrl": "examples/advanced-selectors-demo.html"
154
+ },
155
+ {
156
+ "id": "background-size-showcase",
157
+ "label": "Background Size Examples",
158
+ "htmlUrl": "examples/background-size-showcase.html"
159
+ },
160
+ {
161
+ "id": "background-position-showcase",
162
+ "label": "Background Position Examples",
163
+ "htmlUrl": "examples/background-position-showcase.html"
164
+ },
165
+ {
166
+ "id": "background-repeat-showcase",
167
+ "label": "Background Repeat Examples",
168
+ "htmlUrl": "examples/background-repeat-showcase.html"
169
+ },
170
+ {
171
+ "id": "background-repeat-space-round",
172
+ "label": "Background Repeat: Space & Round",
173
+ "htmlUrl": "examples/background-repeat-space-round.html"
174
+ },
175
+ {
176
+ "id": "background-advanced-showcase",
177
+ "label": "Advanced Background Techniques",
178
+ "htmlUrl": "examples/background-advanced-showcase.html"
179
+ },
180
+ {
181
+ "id": "background-origin-showcase",
182
+ "label": "Background Origin Examples",
183
+ "htmlUrl": "examples/background-origin-showcase.html"
184
+ },
185
+ {
186
+ "id": "background-clip-text",
187
+ "label": "Background Clip Text Gradient",
188
+ "htmlUrl": "examples/background-clip-text.html"
189
+ },
190
+ {
191
+ "id": "webp-example",
192
+ "label": "WebP Image Example",
193
+ "htmlUrl": "examples/webp-example.html"
194
+ },
195
+ {
196
+ "id": "z-index-demo",
197
+ "label": "Z-Index Stacking Demo",
198
+ "htmlUrl": "examples/z-index-demo.html"
199
+ },
200
+ {
201
+ "id": "margin-block-showcase",
202
+ "label": "Margin Block Showcase",
203
+ "htmlUrl": "examples/margin-block-showcase.html"
204
+ },
205
+ {
206
+ "id": "margin-inline-showcase",
207
+ "label": "Margin Inline Showcase",
208
+ "htmlUrl": "examples/margin-inline-showcase.html"
209
+ },
210
+ {
211
+ "id": "text-decoration-showcase",
212
+ "label": "Text Decoration Showcase",
213
+ "htmlUrl": "examples/text-decoration-showcase.html"
214
+ },
215
+ {
216
+ "id": "text-shadow-example",
217
+ "label": "Text Shadow Example",
218
+ "htmlUrl": "examples/text-shadow-example.html"
219
+ },
220
+ {
221
+ "id": "opacity-example",
222
+ "label": "Opacity Example",
223
+ "htmlUrl": "examples/opacity-example.html"
224
+ },
225
+ {
226
+ "id": "skew-text",
227
+ "label": "Skew Text Example",
228
+ "htmlUrl": "examples/skew-text.html"
229
+ },
230
+ {
231
+ "id": "skew-div",
232
+ "label": "Skew DIV with Background & Border",
233
+ "htmlUrl": "examples/skew-div.html"
234
+ },
235
+ {
236
+ "id": "fonts-demo",
237
+ "label": "LoadedFont @font-face Demo",
238
+ "htmlUrl": "examples/fonts-demo.html"
239
+ }
240
+ ]