@akairos/pipeline 0.18.1 → 0.18.5

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 (212) hide show
  1. package/ARTICLE-THEMES.md +2 -0
  2. package/README.md +5 -3
  3. package/package.json +5 -4
  4. package/src/article-theme.test.ts +55 -0
  5. package/src/article-theme.ts +10 -2
  6. package/src/commands/article-theme.ts +1 -1
  7. package/src/commands/init.ts +2 -0
  8. package/src/commands/publish.ts +1 -1
  9. package/src/commands/typeset-assets-sync.test.ts +9 -1
  10. package/src/commands/wechat-export.ts +9 -4
  11. package/src/providers/index.ts +4 -2
  12. package/src/runtime-package.ts +4 -3
  13. package/src/wechat-preview/assets/browser-dist/.vite/manifest.json +1280 -5
  14. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_AMS-Regular-BQhdFMY1.woff2 +0 -0
  15. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_AMS-Regular-DMm9YOAa.woff +0 -0
  16. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_AMS-Regular-DRggAlZN.ttf +0 -0
  17. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Caligraphic-Bold-ATXxdsX0.ttf +0 -0
  18. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Caligraphic-Bold-BEiXGLvX.woff +0 -0
  19. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Caligraphic-Bold-Dq_IR9rO.woff2 +0 -0
  20. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Caligraphic-Regular-CTRA-rTL.woff +0 -0
  21. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Caligraphic-Regular-Di6jR-x-.woff2 +0 -0
  22. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Caligraphic-Regular-wX97UBjC.ttf +0 -0
  23. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Fraktur-Bold-BdnERNNW.ttf +0 -0
  24. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Fraktur-Bold-BsDP51OF.woff +0 -0
  25. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Fraktur-Bold-CL6g_b3V.woff2 +0 -0
  26. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Fraktur-Regular-CB_wures.ttf +0 -0
  27. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Fraktur-Regular-CTYiF6lA.woff2 +0 -0
  28. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Fraktur-Regular-Dxdc4cR9.woff +0 -0
  29. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Main-Bold-Cx986IdX.woff2 +0 -0
  30. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Main-Bold-Jm3AIy58.woff +0 -0
  31. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Main-Bold-waoOVXN0.ttf +0 -0
  32. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Main-BoldItalic-DxDJ3AOS.woff2 +0 -0
  33. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Main-BoldItalic-DzxPMmG6.ttf +0 -0
  34. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Main-BoldItalic-SpSLRI95.woff +0 -0
  35. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Main-Italic-3WenGoN9.ttf +0 -0
  36. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Main-Italic-BMLOBm91.woff +0 -0
  37. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Main-Italic-NWA7e6Wa.woff2 +0 -0
  38. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Main-Regular-B22Nviop.woff2 +0 -0
  39. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Main-Regular-Dr94JaBh.woff +0 -0
  40. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Main-Regular-ypZvNtVU.ttf +0 -0
  41. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Math-BoldItalic-B3XSjfu4.ttf +0 -0
  42. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Math-BoldItalic-CZnvNsCZ.woff2 +0 -0
  43. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Math-BoldItalic-iY-2wyZ7.woff +0 -0
  44. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Math-Italic-DA0__PXp.woff +0 -0
  45. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Math-Italic-flOr_0UB.ttf +0 -0
  46. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Math-Italic-t53AETM-.woff2 +0 -0
  47. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_SansSerif-Bold-CFMepnvq.ttf +0 -0
  48. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_SansSerif-Bold-D1sUS0GD.woff2 +0 -0
  49. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_SansSerif-Bold-DbIhKOiC.woff +0 -0
  50. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_SansSerif-Italic-C3H0VqGB.woff2 +0 -0
  51. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_SansSerif-Italic-DN2j7dab.woff +0 -0
  52. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_SansSerif-Italic-YYjJ1zSn.ttf +0 -0
  53. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_SansSerif-Regular-BNo7hRIc.ttf +0 -0
  54. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_SansSerif-Regular-CS6fqUqJ.woff +0 -0
  55. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_SansSerif-Regular-DDBCnlJ7.woff2 +0 -0
  56. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Script-Regular-C5JkGWo-.ttf +0 -0
  57. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Script-Regular-D3wIWfF6.woff2 +0 -0
  58. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Script-Regular-D5yQViql.woff +0 -0
  59. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Size1-Regular-C195tn64.woff +0 -0
  60. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Size1-Regular-Dbsnue_I.ttf +0 -0
  61. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Size1-Regular-mCD8mA8B.woff2 +0 -0
  62. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Size2-Regular-B7gKUWhC.ttf +0 -0
  63. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Size2-Regular-Dy4dx90m.woff2 +0 -0
  64. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Size2-Regular-oD1tc_U0.woff +0 -0
  65. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Size3-Regular-CTq5MqoE.woff +0 -0
  66. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Size3-Regular-DgpXs0kz.ttf +0 -0
  67. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Size4-Regular-BF-4gkZK.woff +0 -0
  68. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Size4-Regular-DWFBv043.ttf +0 -0
  69. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Size4-Regular-Dl5lxZxV.woff2 +0 -0
  70. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Typewriter-Regular-C0xS9mPB.woff +0 -0
  71. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Typewriter-Regular-CO6r4hn1.woff2 +0 -0
  72. package/src/wechat-preview/assets/browser-dist/assets/KaTeX_Typewriter-Regular-D3Ib7_Hf.ttf +0 -0
  73. package/src/wechat-preview/assets/browser-dist/assets/apl-B4CMkyY2.js +1 -0
  74. package/src/wechat-preview/assets/browser-dist/assets/asciiarmor-Df11BRmG.js +1 -0
  75. package/src/wechat-preview/assets/browser-dist/assets/asn1-EdZsLKOL.js +1 -0
  76. package/src/wechat-preview/assets/browser-dist/assets/asterisk-B-8jnY81.js +1 -0
  77. package/src/wechat-preview/assets/browser-dist/assets/brainfuck-C4LP7Hcl.js +1 -0
  78. package/src/wechat-preview/assets/browser-dist/assets/clike-B9uivgTg.js +1 -0
  79. package/src/wechat-preview/assets/browser-dist/assets/clojure-BMjYHr_A.js +1 -0
  80. package/src/wechat-preview/assets/browser-dist/assets/cmake-BQqOBYOt.js +1 -0
  81. package/src/wechat-preview/assets/browser-dist/assets/cobol-CWcv1MsR.js +1 -0
  82. package/src/wechat-preview/assets/browser-dist/assets/coffeescript-S37ZYGWr.js +1 -0
  83. package/src/wechat-preview/assets/browser-dist/assets/commonlisp-DBKNyK5s.js +1 -0
  84. package/src/wechat-preview/assets/browser-dist/assets/crystal-SjHAIU92.js +1 -0
  85. package/src/wechat-preview/assets/browser-dist/assets/css-BnMrqG3P.js +1 -0
  86. package/src/wechat-preview/assets/browser-dist/assets/cypher-C_CwsFkJ.js +1 -0
  87. package/src/wechat-preview/assets/browser-dist/assets/d-pRatUO7H.js +1 -0
  88. package/src/wechat-preview/assets/browser-dist/assets/diff-DbItnlRl.js +1 -0
  89. package/src/wechat-preview/assets/browser-dist/assets/dockerfile-BKs6k2Af.js +1 -0
  90. package/src/wechat-preview/assets/browser-dist/assets/dtd-DF_7sFjM.js +1 -0
  91. package/src/wechat-preview/assets/browser-dist/assets/dylan-DwRh75JA.js +1 -0
  92. package/src/wechat-preview/assets/browser-dist/assets/ebnf-CDyGwa7X.js +1 -0
  93. package/src/wechat-preview/assets/browser-dist/assets/ecl-Cabwm37j.js +1 -0
  94. package/src/wechat-preview/assets/browser-dist/assets/eiffel-CnydiIhH.js +1 -0
  95. package/src/wechat-preview/assets/browser-dist/assets/elm-vLlmbW-K.js +1 -0
  96. package/src/wechat-preview/assets/browser-dist/assets/erlang-BNw1qcRV.js +1 -0
  97. package/src/wechat-preview/assets/browser-dist/assets/factor-kuTfRLto.js +1 -0
  98. package/src/wechat-preview/assets/browser-dist/assets/fcl-Kvtd6kyn.js +1 -0
  99. package/src/wechat-preview/assets/browser-dist/assets/forth-Ffai-XNe.js +1 -0
  100. package/src/wechat-preview/assets/browser-dist/assets/fortran-DYz_wnZ1.js +1 -0
  101. package/src/wechat-preview/assets/browser-dist/assets/gas-Bneqetm1.js +1 -0
  102. package/src/wechat-preview/assets/browser-dist/assets/gherkin-heZmZLOM.js +1 -0
  103. package/src/wechat-preview/assets/browser-dist/assets/groovy-D9Dt4D0W.js +1 -0
  104. package/src/wechat-preview/assets/browser-dist/assets/haskell-Cw1EW3IL.js +1 -0
  105. package/src/wechat-preview/assets/browser-dist/assets/haxe-H-WmDvRZ.js +1 -0
  106. package/src/wechat-preview/assets/browser-dist/assets/http-DBlCnlav.js +1 -0
  107. package/src/wechat-preview/assets/browser-dist/assets/idl-BEugSyMb.js +1 -0
  108. package/src/wechat-preview/assets/browser-dist/assets/index-B13lCSuc.js +1 -0
  109. package/src/wechat-preview/assets/browser-dist/assets/index-BDdU9pNh.js +1 -0
  110. package/src/wechat-preview/assets/browser-dist/assets/index-BFLGVgsp.js +1 -0
  111. package/src/wechat-preview/assets/browser-dist/assets/index-BHJY0B4E.js +8 -0
  112. package/src/wechat-preview/assets/browser-dist/assets/index-BOnKEJxh.js +7 -0
  113. package/src/wechat-preview/assets/browser-dist/assets/index-BPmBcGI-.js +1 -0
  114. package/src/wechat-preview/assets/browser-dist/assets/index-BTVIa90Y.js +1 -0
  115. package/src/wechat-preview/assets/browser-dist/assets/index-BYV6TA8f.js +1 -0
  116. package/src/wechat-preview/assets/browser-dist/assets/index-BlVpb0dF.js +1 -0
  117. package/src/wechat-preview/assets/browser-dist/assets/index-BqKARoyW.js +1 -0
  118. package/src/wechat-preview/assets/browser-dist/assets/index-BzHql5Rp.js +20 -0
  119. package/src/wechat-preview/assets/browser-dist/assets/index-CPFEJ9fX.js +1 -0
  120. package/src/wechat-preview/assets/browser-dist/assets/index-CdxKyTX6.js +1 -0
  121. package/src/wechat-preview/assets/browser-dist/assets/index-CyXDvcwY.js +1 -0
  122. package/src/wechat-preview/assets/browser-dist/assets/index-DA7Z4paG.js +13 -0
  123. package/src/wechat-preview/assets/browser-dist/assets/index-DDQGWU_D.js +3 -0
  124. package/src/wechat-preview/assets/browser-dist/assets/index-DENMoE5l.js +1 -0
  125. package/src/wechat-preview/assets/browser-dist/assets/index-D_EI5vFS.js +1 -0
  126. package/src/wechat-preview/assets/browser-dist/assets/index-DpuVrwze.js +1 -0
  127. package/src/wechat-preview/assets/browser-dist/assets/index-IBlhKHQr.js +8 -0
  128. package/src/wechat-preview/assets/browser-dist/assets/index-ifI5svkD.js +2 -0
  129. package/src/wechat-preview/assets/browser-dist/assets/index-vRiJxvj2.js +1 -0
  130. package/src/wechat-preview/assets/browser-dist/assets/javascript-iXu5QeM3.js +1 -0
  131. package/src/wechat-preview/assets/browser-dist/assets/julia-DuME0IfC.js +1 -0
  132. package/src/wechat-preview/assets/browser-dist/assets/livescript-BwQOo05w.js +1 -0
  133. package/src/wechat-preview/assets/browser-dist/assets/lua-VAEuO923.js +1 -0
  134. package/src/wechat-preview/assets/browser-dist/assets/mathematica-DTrFuWx2.js +1 -0
  135. package/src/wechat-preview/assets/browser-dist/assets/mbox-CNhZ1qSd.js +1 -0
  136. package/src/wechat-preview/assets/browser-dist/assets/mirc-CjQqDB4T.js +1 -0
  137. package/src/wechat-preview/assets/browser-dist/assets/mllike-CXdrOF99.js +1 -0
  138. package/src/wechat-preview/assets/browser-dist/assets/modelica-Dc1JOy9r.js +1 -0
  139. package/src/wechat-preview/assets/browser-dist/assets/mscgen-BA5vi2Kp.js +1 -0
  140. package/src/wechat-preview/assets/browser-dist/assets/mumps-BT43cFF4.js +1 -0
  141. package/src/wechat-preview/assets/browser-dist/assets/nginx-DdIZxoE0.js +1 -0
  142. package/src/wechat-preview/assets/browser-dist/assets/nsis-LY0VT_u5.js +1 -0
  143. package/src/wechat-preview/assets/browser-dist/assets/ntriples-BfvgReVJ.js +1 -0
  144. package/src/wechat-preview/assets/browser-dist/assets/octave-Ck1zUtKM.js +1 -0
  145. package/src/wechat-preview/assets/browser-dist/assets/oz-BzwKVEFT.js +1 -0
  146. package/src/wechat-preview/assets/browser-dist/assets/pascal--L3eBynH.js +1 -0
  147. package/src/wechat-preview/assets/browser-dist/assets/perl-CdXCOZ3F.js +1 -0
  148. package/src/wechat-preview/assets/browser-dist/assets/pig-CevX1Tat.js +1 -0
  149. package/src/wechat-preview/assets/browser-dist/assets/powershell-CFHJl5sT.js +1 -0
  150. package/src/wechat-preview/assets/browser-dist/assets/properties-C78fOPTZ.js +1 -0
  151. package/src/wechat-preview/assets/browser-dist/assets/protobuf-ChK-085T.js +1 -0
  152. package/src/wechat-preview/assets/browser-dist/assets/pug-DeIclll2.js +1 -0
  153. package/src/wechat-preview/assets/browser-dist/assets/puppet-DMA9R1ak.js +1 -0
  154. package/src/wechat-preview/assets/browser-dist/assets/python-BuPzkPfP.js +1 -0
  155. package/src/wechat-preview/assets/browser-dist/assets/q-pXgVlZs6.js +1 -0
  156. package/src/wechat-preview/assets/browser-dist/assets/r-B6wPVr8A.js +1 -0
  157. package/src/wechat-preview/assets/browser-dist/assets/rpm-CTu-6PCP.js +1 -0
  158. package/src/wechat-preview/assets/browser-dist/assets/ruby-BK5aLJev.js +1 -0
  159. package/src/wechat-preview/assets/browser-dist/assets/sas-B4kiWyti.js +1 -0
  160. package/src/wechat-preview/assets/browser-dist/assets/scheme-C41bIUwD.js +1 -0
  161. package/src/wechat-preview/assets/browser-dist/assets/shell-CjFT_Tl9.js +1 -0
  162. package/src/wechat-preview/assets/browser-dist/assets/sieve-C3Gn_uJK.js +1 -0
  163. package/src/wechat-preview/assets/browser-dist/assets/simple-mode-GW_nhZxv.js +1 -0
  164. package/src/wechat-preview/assets/browser-dist/assets/smalltalk-CnHTOXQT.js +1 -0
  165. package/src/wechat-preview/assets/browser-dist/assets/solr-DehyRSwq.js +1 -0
  166. package/src/wechat-preview/assets/browser-dist/assets/sparql-DkYu6x3z.js +1 -0
  167. package/src/wechat-preview/assets/browser-dist/assets/spreadsheet-BCZA_wO0.js +1 -0
  168. package/src/wechat-preview/assets/browser-dist/assets/sql-D0XecflT.js +1 -0
  169. package/src/wechat-preview/assets/browser-dist/assets/stex-C3f8Ysf7.js +1 -0
  170. package/src/wechat-preview/assets/browser-dist/assets/style-Cif_gYUW.css +1 -0
  171. package/src/wechat-preview/assets/browser-dist/assets/stylus-B533Al4x.js +1 -0
  172. package/src/wechat-preview/assets/browser-dist/assets/swift-BzpIVaGY.js +1 -0
  173. package/src/wechat-preview/assets/browser-dist/assets/tcl-DVfN8rqt.js +1 -0
  174. package/src/wechat-preview/assets/browser-dist/assets/textile-CnDTJFAw.js +1 -0
  175. package/src/wechat-preview/assets/browser-dist/assets/tiddlywiki-DO-Gjzrf.js +1 -0
  176. package/src/wechat-preview/assets/browser-dist/assets/tiki-DGYXhP31.js +1 -0
  177. package/src/wechat-preview/assets/browser-dist/assets/toml-Bm5Em-hy.js +1 -0
  178. package/src/wechat-preview/assets/browser-dist/assets/troff-wAsdV37c.js +1 -0
  179. package/src/wechat-preview/assets/browser-dist/assets/ttcn-CfJYG6tj.js +1 -0
  180. package/src/wechat-preview/assets/browser-dist/assets/ttcn-cfg-B9xdYoR4.js +1 -0
  181. package/src/wechat-preview/assets/browser-dist/assets/turtle-B1tBg_DP.js +1 -0
  182. package/src/wechat-preview/assets/browser-dist/assets/vb-CmGdzxic.js +1 -0
  183. package/src/wechat-preview/assets/browser-dist/assets/vbscript-BuJXcnF6.js +1 -0
  184. package/src/wechat-preview/assets/browser-dist/assets/velocity-D8B20fx6.js +1 -0
  185. package/src/wechat-preview/assets/browser-dist/assets/verilog-C6RDOZhf.js +1 -0
  186. package/src/wechat-preview/assets/browser-dist/assets/vhdl-lSbBsy5d.js +1 -0
  187. package/src/wechat-preview/assets/browser-dist/assets/webidl-ZXfAyPTL.js +1 -0
  188. package/src/wechat-preview/assets/browser-dist/assets/{wechat-renderer-GgNrlSLi.js → wechat-renderer-CcHuq7M-.js} +83 -61
  189. package/src/wechat-preview/assets/browser-dist/assets/xquery-DzFWVndE.js +1 -0
  190. package/src/wechat-preview/assets/browser-dist/assets/yacas-BJ4BC0dw.js +1 -0
  191. package/src/wechat-preview/assets/browser-dist/assets/z80-Hz9HOZM7.js +1 -0
  192. package/src/wechat-preview/assets/browser-dist/editor-export.js +1 -1
  193. package/src/wechat-preview/assets/browser-dist/src/wechat-preview/browser/studio/studio.html +215 -165
  194. package/src/wechat-preview/assets/browser-dist/studio.js +1148 -237
  195. package/src/wechat-preview/browser/studio/color-palettes.ts +28 -0
  196. package/src/wechat-preview/browser/studio/config-manager.ts +49 -0
  197. package/src/wechat-preview/browser/studio/milkdown-article-menu.ts +251 -0
  198. package/src/wechat-preview/browser/studio/myno-editor.ts +122 -0
  199. package/src/wechat-preview/browser/studio/studio.css +493 -250
  200. package/src/wechat-preview/browser/studio/studio.html +213 -163
  201. package/src/wechat-preview/browser/studio/studio.ts +684 -211
  202. package/src/wechat-preview/browser/studio/style-packs.ts +201 -0
  203. package/src/wechat-preview/browser/studio/syntax-presets.test.ts +10 -32
  204. package/src/wechat-preview/browser/studio/syntax-presets.ts +19 -357
  205. package/src/wechat-preview/fixtures/all-nodes.md +2 -11
  206. package/src/wechat-preview/index.ts +29 -13
  207. package/src/wechat-preview/server/http.ts +8 -7
  208. package/src/wechat-preview/server/studio.test.ts +25 -0
  209. package/src/wechat-preview/wechat-export.integration.test.ts +49 -8
  210. package/src/wechat-preview/wechat-renderer.ts +134 -11
  211. package/src/workflow.test.ts +2 -0
  212. package/src/wechat-preview/assets/browser-dist/assets/style-C9-YtTIm.css +0 -1
package/src/wechat-preview/browser/studio/studio.html CHANGED
@@ -3,39 +3,58 @@
3
3
  <head>
4
4
  <meta charset="utf-8">
5
5
  <meta name="viewport" content="width=device-width, initial-scale=1">
6
- <title>WeChat Article Visual Studio - 排版可视化工作台</title>
6
+ <title>myno — 微信公众号排版工作台</title>
7
7
  <link rel="stylesheet" href="./studio.css">
8
8
  </head>
9
9
  <body>
10
10
  <!-- Header -->
11
11
  <header class="studio-header">
12
12
  <div class="brand-section">
13
- <span class="brand-logo">🎨</span>
14
- <h1 class="brand-title">WeChat Visual Studio</h1>
15
- <span class="brand-badge">实时调优</span>
13
+ <div class="brand-icon">
14
+ <svg viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="2">
15
+ <path d="M4 19.5v-15A2.5 2.5 0 0 1 6.5 2H20v20H6.5a2.5 2.5 0 0 1-2.5-2.5Z"/>
16
+ <path d="M6 6h10M6 10h10M6 14h6"/>
17
+ </svg>
18
+ </div>
19
+ <div class="brand-text">
20
+ <span class="brand-title">myno</span>
21
+ <span class="brand-subtitle">WeChat Visual Studio</span>
22
+ </div>
23
+ <span id="config-mode-badge" class="badge badge-subtle">账号配置</span>
16
24
  </div>
17
25
 
18
- <div class="header-controls">
19
- <div class="account-select-wrap">
20
- <span>公众号账号:</span>
21
- <select id="account-select" class="account-select">
26
+ <!-- Center Config Selector -->
27
+ <div class="header-center">
28
+ <div class="config-selector-group">
29
+ <label for="account-select" class="selector-label">目标配置:</label>
30
+ <select id="account-select" class="select-control">
22
31
  <option value="default">默认账号 (default)</option>
23
32
  </select>
33
+ <button id="btn-import-config" class="btn btn-ghost btn-sm" title="导入已有 wechat-style.json 排版配置">
34
+ <span>📥 导入配置</span>
35
+ </button>
36
+ <input type="file" id="file-import-config" accept=".json" style="display: none;">
37
+ <button id="btn-export-config" class="btn btn-ghost btn-sm" title="导出独立 wechat-style.json，可在 CLI 使用 --article-theme 引用">
38
+ <span>📤 导出配置</span>
39
+ </button>
24
40
  </div>
41
+ </div>
25
42
 
26
- <button id="btn-reset" class="btn" title="恢复当前账号默认样式">
43
+ <!-- Right Actions -->
44
+ <div class="header-actions">
45
+ <button id="btn-reset" class="btn btn-secondary btn-sm" title="恢复当前账号默认样式">
27
46
  <span>🔄 重置</span>
28
47
  </button>
29
48
 
30
- <button id="btn-save" class="btn btn-primary" title="保存当前调整至本地 config.json">
31
- <span>💾 保存至配置</span>
49
+ <button id="btn-save" class="btn btn-primary btn-sm" title="保存当前调整至本地 config.json 的当前账号">
50
+ <span>💾 保存至账号</span>
32
51
  </button>
33
52
 
34
- <button id="btn-copy" class="btn btn-success" title="复制内联富文本，可直接粘贴到微信公众号后台">
53
+ <button id="btn-copy" class="btn btn-success btn-sm" title="复制包含内联样式的富文本，可直接粘贴到微信公众平台草稿箱">
35
54
  <span>📋 一键复制到公众号</span>
36
55
  </button>
37
56
 
38
- <a href="/" class="btn" title="返回导出历史">
57
+ <a href="/" class="btn btn-ghost btn-sm" title="查看最近渲染记录">
39
58
  <span>📜 历史记录</span>
40
59
  </a>
41
60
  </div>
@@ -43,228 +62,260 @@
43
62
 
44
63
  <!-- Body -->
45
64
  <main class="studio-body">
46
- <!-- Left: Tuning & Plugins -->
65
+ <!-- Left: Style & Tuning Panel -->
47
66
  <aside class="panel left-panel">
48
67
  <nav class="tab-nav">
49
- <button id="tab-btn-style" class="tab-btn active">🎨 样式调优</button>
50
- <button id="tab-btn-syntax" class="tab-btn">🧩 语法与组件</button>
68
+ <button id="tab-btn-style" class="tab-btn active">🎨 排版风格</button>
69
+ <button id="tab-btn-syntax" class="tab-btn">🧩 组件库与语法</button>
51
70
  </nav>
52
71
 
53
72
  <!-- Tab 1: Style Tuning -->
54
73
  <div id="tab-content-style" class="tab-content">
55
- <!-- Typography -->
56
- <div class="config-section">
57
- <div class="section-label">
58
- <span>📐 字号与排版</span>
74
+ <!-- 1. Curated Style Packs (Visual First for beginners) -->
75
+ <section class="config-section">
76
+ <div class="section-title">
77
+ <span>✨ 精选排版风格 (一键套用)</span>
59
78
  </div>
60
-
61
- <div class="form-group">
62
- <div class="form-label">
63
- <span>正文字号</span>
64
- <span id="val-font-size" class="form-val">16px</span>
65
- </div>
66
- <input type="range" id="input-font-size" class="slider-input" min="14" max="18" step="1" value="16">
79
+ <div id="style-packs-grid" class="style-packs-grid">
80
+ <!-- Populated dynamically by studio.ts -->
67
81
  </div>
82
+ </section>
68
83
 
69
- <div class="form-group">
70
- <div class="form-label">
71
- <span>行高倍数</span>
72
- <span id="val-line-height" class="form-val">1.84</span>
73
- </div>
74
- <input type="range" id="input-line-height" class="slider-input" min="1.5" max="2.2" step="0.02" value="1.84">
84
+ <!-- 2. Quick Typography Tuning (Segmented controls) -->
85
+ <section class="config-section">
86
+ <div class="section-title">
87
+ <span>📐 快速版心调节</span>
75
88
  </div>
76
89
 
77
- <div class="form-group">
78
- <div class="form-label">
79
- <span>字间距 (Letter Spacing)</span>
80
- <span id="val-letter-spacing" class="form-val">0.012em</span>
90
+ <!-- Font size segmented control -->
91
+ <div class="control-group">
92
+ <div class="control-label">
93
+ <span>正文字号</span>
94
+ <span id="val-font-size" class="control-val">16px</span>
81
95
  </div>
82
- <input type="range" id="input-letter-spacing" class="slider-input" min="0" max="0.05" step="0.002" value="0.012">
83
- </div>
84
-
85
- <div class="form-group">
86
- <div class="form-label">
87
- <span>段落间距 (Margin Bottom)</span>
88
- <span id="val-para-spacing" class="form-val">1.18em</span>
96
+ <div id="seg-font-size" class="segmented-control">
97
+ <button type="button" class="seg-btn" data-val="14">14 较小</button>
98
+ <button type="button" class="seg-btn" data-val="15">15 适中</button>
99
+ <button type="button" class="seg-btn active" data-val="16">16 标准</button>
100
+ <button type="button" class="seg-btn" data-val="17">17 较大</button>
101
+ <button type="button" class="seg-btn" data-val="18">18 大号</button>
89
102
  </div>
90
- <input type="range" id="input-para-spacing" class="slider-input" min="0.8" max="2.0" step="0.01" value="1.18">
91
- </div>
92
- </div>
93
-
94
- <!-- Colors -->
95
- <div class="config-section">
96
- <div class="section-label">
97
- <span>🎨 颜色系统</span>
103
+ <input type="range" id="input-font-size" class="slider-input hidden-slider" min="14" max="18" step="1" value="16">
98
104
  </div>
99
105
 
100
- <div class="form-group" style="margin-bottom: 16px;">
101
- <div class="form-label">
102
- <span>🌟 推荐高级配色方案 (杂志 / 服装 / App)</span>
106
+ <!-- Line height segmented control -->
107
+ <div class="control-group">
108
+ <div class="control-label">
109
+ <span>正文行距</span>
110
+ <span id="val-line-height" class="control-val">1.84</span>
111
+ </div>
112
+ <div id="seg-line-height" class="segmented-control">
113
+ <button type="button" class="seg-btn" data-val="1.65">紧凑 1.65</button>
114
+ <button type="button" class="seg-btn active" data-val="1.84">标准 1.84</button>
115
+ <button type="button" class="seg-btn" data-val="2.0">疏朗 2.0</button>
103
116
  </div>
104
- <select id="palette-select" class="preset-select">
105
- <option value="">-- 选择推荐调色盘 (一键应用) --</option>
106
- </select>
107
- <div id="palette-desc" class="preset-desc">可一键应用 Kinfolk 森林绿、Loro Piana 燕麦大地、纽约客石板蓝等</div>
117
+ <input type="range" id="input-line-height" class="slider-input hidden-slider" min="1.5" max="2.2" step="0.02" value="1.84">
108
118
  </div>
109
119
 
110
- <div class="form-group">
111
- <div class="form-label">
112
- <span>品牌主色 (Brand)</span>
120
+ <!-- Brand color swatches -->
121
+ <div class="control-group">
122
+ <div class="control-label">
123
+ <span>品牌主题色</span>
113
124
  </div>
114
- <div class="color-input-row">
125
+ <div id="color-swatches" class="color-swatches-row">
126
+ <button type="button" class="swatch-btn" style="background:#ca6093;" data-color="#ca6093" title="胭脂粉"></button>
127
+ <button type="button" class="swatch-btn" style="background:#18181b;" data-color="#18181b" title="纸墨黑"></button>
128
+ <button type="button" class="swatch-btn" style="background:#2563eb;" data-color="#2563eb" title="科技蓝"></button>
129
+ <button type="button" class="swatch-btn" style="background:#059669;" data-color="#059669" title="薄荷绿"></button>
130
+ <button type="button" class="swatch-btn" style="background:#7c3aed;" data-color="#7c3aed" title="极光紫"></button>
131
+ <button type="button" class="swatch-btn" style="background:#945938;" data-color="#945938" title="焦糖陶土"></button>
132
+ <button type="button" class="swatch-btn" style="background:#881337;" data-color="#881337" title="丝绒酒红"></button>
133
+ <button type="button" class="swatch-btn" style="background:#0284c7;" data-color="#0284c7" title="天蓝"></button>
134
+ </div>
135
+ <div class="color-picker-inline">
115
136
  <input type="color" id="picker-brand-color" class="color-picker" value="#ca6093">
116
137
  <input type="text" id="hex-brand-color" class="color-hex" value="#ca6093">
117
138
  </div>
118
139
  </div>
119
140
 
120
- <div class="form-group">
121
- <div class="form-label">
122
- <span>正文字色 (Body Text)</span>
141
+ <!-- H2 visual style pills -->
142
+ <div class="control-group">
143
+ <div class="control-label">
144
+ <span>二级标题 (H2) 风格</span>
123
145
  </div>
124
- <div class="color-input-row">
125
- <input type="color" id="picker-text-color" class="color-picker" value="#292526">
126
- <input type="text" id="hex-text-color" class="color-hex" value="#292526">
146
+ <div id="seg-h2-preset" class="pills-grid">
147
+ <button type="button" class="pill-btn active" data-preset="pillar">竖条呼吸柱</button>
148
+ <button type="button" class="pill-btn" data-preset="gradient-pill">渐变胶囊</button>
149
+ <button type="button" class="pill-btn" data-preset="bottom-line">底部细线</button>
150
+ <button type="button" class="pill-btn" data-preset="contrast-green">绿底反差</button>
151
+ <button type="button" class="pill-btn" data-preset="card-tag">上标卡片</button>
152
+ <button type="button" class="pill-btn" data-preset="plain">极简纯字</button>
127
153
  </div>
128
154
  </div>
129
-
130
- <div class="form-group">
131
- <div class="form-label">
132
- <span>二级标题颜色 (H2)</span>
133
- </div>
134
- <div class="color-input-row">
135
- <input type="color" id="picker-h2-color" class="color-picker" value="#1f1b1c">
136
- <input type="text" id="hex-h2-color" class="color-hex" value="#1f1b1c">
155
+ </section>
156
+
157
+ <!-- 3. Advanced Accordion (Collapsed by default for clarity) -->
158
+ <details class="accordion-section">
159
+ <summary class="accordion-summary">
160
+ <span>⚙️ 进阶颜色与排版微调</span>
161
+ <span class="accordion-arrow">›</span>
162
+ </summary>
163
+ <div class="accordion-body">
164
+ <!-- Palette Selector -->
165
+ <div class="control-group">
166
+ <div class="control-label">
167
+ <span>预设经典色盘</span>
168
+ </div>
169
+ <select id="palette-select" class="select-control full-width">
170
+ <option value="">-- 选择推荐调色盘 (一键应用) --</option>
171
+ </select>
172
+ <div id="palette-desc" class="form-hint"></div>
137
173
  </div>
138
- </div>
139
174
 
140
- <div class="form-group">
141
- <div class="form-label">
142
- <span>三级标题颜色 (H3)</span>
143
- </div>
144
- <div class="color-input-row">
145
- <input type="color" id="picker-h3-color" class="color-picker" value="#5c5658">
146
- <input type="text" id="hex-h3-color" class="color-hex" value="#5c5658">
175
+ <!-- Fine Colors -->
176
+ <div class="control-group">
177
+ <div class="control-label"><span>正文字色 (Body Text)</span></div>
178
+ <div class="color-picker-inline">
179
+ <input type="color" id="picker-text-color" class="color-picker" value="#292526">
180
+ <input type="text" id="hex-text-color" class="color-hex" value="#292526">
181
+ </div>
147
182
  </div>
148
- </div>
149
183
 
150
- <div class="form-group">
151
- <div class="form-label">
152
- <span>引用边框与重点色</span>
184
+ <div class="control-group">
185
+ <div class="control-label"><span>二级标题字色 (H2)</span></div>
186
+ <div class="color-picker-inline">
187
+ <input type="color" id="picker-h2-color" class="color-picker" value="#1f1b1c">
188
+ <input type="text" id="hex-h2-color" class="color-hex" value="#1f1b1c">
189
+ </div>
153
190
  </div>
154
- <div class="color-input-row">
155
- <input type="color" id="picker-quote-color" class="color-picker" value="#e8c9d7">
156
- <input type="text" id="hex-quote-color" class="color-hex" value="#e8c9d7">
191
+
192
+ <div class="control-group">
193
+ <div class="control-label"><span>三级标题字色 (H3)</span></div>
194
+ <div class="color-picker-inline">
195
+ <input type="color" id="picker-h3-color" class="color-picker" value="#5c5658">
196
+ <input type="text" id="hex-h3-color" class="color-hex" value="#5c5658">
197
+ </div>
157
198
  </div>
158
- </div>
159
199
 
160
- <div class="form-group">
161
- <div class="form-label">
162
- <span>分割线颜色 (Divider)</span>
200
+ <div class="control-group">
201
+ <div class="control-label"><span>引用边框与重点色</span></div>
202
+ <div class="color-picker-inline">
203
+ <input type="color" id="picker-quote-color" class="color-picker" value="#e8c9d7">
204
+ <input type="text" id="hex-quote-color" class="color-hex" value="#e8c9d7">
205
+ </div>
163
206
  </div>
164
- <div class="color-input-row">
165
- <input type="color" id="picker-divider-color" class="color-picker" value="#e2dcdf">
166
- <input type="text" id="hex-divider-color" class="color-hex" value="#e2dcdf">
207
+
208
+ <div class="control-group">
209
+ <div class="control-label"><span>分割线颜色 (Divider)</span></div>
210
+ <div class="color-picker-inline">
211
+ <input type="color" id="picker-divider-color" class="color-picker" value="#e2dcdf">
212
+ <input type="text" id="hex-divider-color" class="color-hex" value="#e2dcdf">
213
+ </div>
167
214
  </div>
168
- </div>
169
- </div>
170
215
 
171
- <!-- Syntax Presets -->
172
- <div class="config-section">
173
- <div class="section-label">
174
- <span>🧩 语法节点风格预设 (H2 / H3 / 引用 / 分割线)</span>
175
- </div>
176
- <div id="syntax-preset-container">
177
- <!-- Populated dynamically by studio.ts from SYNTAX_CATEGORIES -->
178
- </div>
179
- </div>
216
+ <!-- Fine Spacing -->
217
+ <div class="control-group">
218
+ <div class="control-label">
219
+ <span>字间距 (Letter Spacing)</span>
220
+ <span id="val-letter-spacing" class="control-val">0.012em</span>
221
+ </div>
222
+ <input type="range" id="input-letter-spacing" class="slider-input" min="0" max="0.05" step="0.002" value="0.012">
223
+ </div>
180
224
 
181
- <!-- Structure -->
182
- <div class="config-section">
183
- <div class="section-label">
184
- <span>🏛️ 装饰与结构</span>
185
- </div>
225
+ <div class="control-group">
226
+ <div class="control-label">
227
+ <span>段落间距 (Margin Bottom)</span>
228
+ <span id="val-para-spacing" class="control-val">1.18em</span>
229
+ </div>
230
+ <input type="range" id="input-para-spacing" class="slider-input" min="0.8" max="2.0" step="0.01" value="1.18">
231
+ </div>
186
232
 
187
- <div class="form-group">
188
- <label class="switch-label">
189
- <span>二级标题自动编号 (01, 02)</span>
190
- <span class="switch-toggle">
233
+ <!-- Structure -->
234
+ <div class="control-group">
235
+ <label class="switch-row">
236
+ <span>二级标题自动编号 (01, 02)</span>
191
237
  <input type="checkbox" id="switch-numbered-headings">
192
- <span class="slider-round"></span>
193
- </span>
194
- </label>
195
- </div>
238
+ </label>
239
+ </div>
196
240
 
197
- <div class="form-group">
198
- <div class="form-label">
199
- <span>标题前缀标签 (例: CHAPTER)</span>
241
+ <div class="control-group">
242
+ <div class="control-label"><span>标题前缀标签 (例: CHAPTER)</span></div>
243
+ <input type="text" id="input-heading-label" class="text-input" placeholder="如：CHAPTER">
200
244
  </div>
201
- <input type="text" id="input-heading-label" class="color-hex" style="width:100%" placeholder="如：CHAPTER">
202
- </div>
203
245
 
204
- <div class="form-group">
205
- <div class="form-label">
206
- <span>引言前缀标签 (例: 摘录)</span>
246
+ <div class="control-group">
247
+ <div class="control-label"><span>引言前缀标签 (例: 摘录)</span></div>
248
+ <input type="text" id="input-quote-label" class="text-input" placeholder="如：摘录">
207
249
  </div>
208
- <input type="text" id="input-quote-label" class="color-hex" style="width:100%" placeholder="如：摘录">
209
- </div>
210
- </div>
211
250
 
212
- <!-- Custom CSS -->
213
- <div class="config-section">
214
- <div class="section-label">
215
- <span>💻 自定义 CSS 覆盖</span>
251
+ <!-- Syntax Preset Categories -->
252
+ <div class="control-group">
253
+ <div class="control-label"><span>各语法节点风格预设</span></div>
254
+ <div id="syntax-preset-container">
255
+ <!-- Populated dynamically -->
256
+ </div>
257
+ </div>
258
+
259
+ <!-- Custom CSS -->
260
+ <div class="control-group">
261
+ <div class="control-label"><span>自定义 CSS 覆盖</span></div>
262
+ <textarea id="input-custom-css" class="code-textarea" placeholder="/* 在此处输入自定义 CSS 规则，实时生效 */&#10;.milkdown .editor p { text-align: justify; }"></textarea>
263
+ </div>
216
264
  </div>
217
- <textarea id="input-custom-css" class="css-editor" placeholder="/* 在此处输入自定义 CSS 规则，实时生效 */&#10;h2 { letter-spacing: 0.05em; }&#10;p { text-align: justify; }"></textarea>
218
- </div>
265
+ </details>
219
266
  </div>
220
267
 
221
- <!-- Tab 2: Syntax Cheatsheet -->
268
+ <!-- Tab 2: Syntax & Components Cheatsheet -->
222
269
  <div id="tab-content-syntax" class="tab-content" style="display: none;">
270
+ <div class="syntax-guide-intro">
271
+ <span>💡 提示：在中间编辑器中，输入 <code>/</code> 即可快速唤起微信专属组件菜单！</span>
272
+ </div>
223
273
  <div id="syntax-card-list">
224
274
  <!-- Populated dynamically by studio.ts -->
225
275
  </div>
226
276
  </div>
227
277
  </aside>
228
278
 
229
- <!-- Center: Markdown Input -->
279
+ <!-- Center: Editor Panel -->
230
280
  <section class="panel editor-panel">
231
281
  <div class="panel-header">
232
- <div class="panel-title">
233
- <span>📝</span>
234
- <span>Markdown 草稿编辑</span>
282
+ <div class="editor-mode-toggle">
283
+ <button id="btn-mode-visual" class="mode-btn active" title="Milkdown 所见即所得编辑">✨ 所见即所得</button>
284
+ <button id="btn-mode-source" class="mode-btn" title="查看并编辑 Markdown 源码">📝 源码模式</button>
235
285
  </div>
236
- <div class="editor-toolbar">
237
- <button id="btn-load-sample" class="btn" title="加载全语法验收用例">📄 官方测试稿</button>
238
- <button id="btn-clear-md" class="btn" title="清空编辑器内容">🗑️ 清空</button>
286
+ <div class="editor-header-actions">
287
+ <button id="btn-load-sample" class="btn btn-ghost btn-sm" title="加载全语法官方验收稿">📄 官方测试稿</button>
288
+ <button id="btn-clear-md" class="btn btn-ghost btn-sm" title="清空编辑器内容">🗑️ 清空</button>
239
289
  </div>
240
290
  </div>
241
291
 
242
- <textarea id="editor-markdown" class="editor-textarea" spellcheck="false" placeholder="在此粘贴或输入 Markdown 文章内容..."></textarea>
292
+ <!-- Interactive Crepe Editor Surface -->
293
+ <div id="editor-workspace" class="editor-workspace">
294
+ <div id="milkdown-editor-root" class="milkdown-editor-surface"></div>
295
+ <textarea id="editor-markdown" class="editor-textarea-source" spellcheck="false" placeholder="在此粘贴或输入 Markdown 文章内容..." style="display: none;"></textarea>
296
+ </div>
243
297
 
244
298
  <div class="editor-footer">
245
299
  <span id="editor-stats">字数: 0 字 | 预计阅读: 1 分钟</span>
246
- <span>实时渲染: 50ms 防抖</span>
300
+ <span class="editor-sync-indicator">⚡ 所见即所得实时排版</span>
247
301
  </div>
248
302
  </section>
249
303
 
250
- <!-- Right: Live WeChat Viewport -->
304
+ <!-- Right: Mobile Device Simulation (430px) -->
251
305
  <section class="panel preview-panel">
252
306
  <div class="panel-header">
253
307
  <div class="panel-title">
254
- <span>📱</span>
255
- <span>微信手机仿真视口 (430px)</span>
256
- </div>
257
- <div>
258
- <button id="btn-toggle-view" class="btn" style="font-size: 11px;">🔍 查看 HTML 源码</button>
308
+ <span>📱 手机仿真视口 (430px)</span>
259
309
  </div>
310
+ <button id="btn-toggle-view" class="btn btn-ghost btn-xs">🔍 HTML 源码</button>
260
311
  </div>
261
312
 
262
- <div class="preview-container">
313
+ <div class="preview-scroll-container">
263
314
  <!-- Phone Simulator Frame -->
264
315
  <div class="device-frame">
265
316
  <div class="device-notch-bar">
266
317
  <span>9:41</span>
267
- <span>WeChat Article</span>
318
+ <span class="device-app-title">公众号正文</span>
268
319
  <span>100% 🔋</span>
269
320
  </div>
270
321
  <div id="preview-screen" class="device-screen">
@@ -273,8 +324,8 @@
273
324
  </div>
274
325
 
275
326
  <!-- HTML Code Viewer (Hidden by default) -->
276
- <div id="html-source-container" style="display: none; width: 100%; margin-top: 16px;">
277
- <textarea id="html-source-code" class="css-editor" style="height: 380px; width: 100%;" readonly></textarea>
327
+ <div id="html-source-container" class="html-source-box" style="display: none;">
328
+ <textarea id="html-source-code" class="code-textarea" readonly></textarea>
278
329
  </div>
279
330
  </div>
280
331
  </section>
@@ -283,10 +334,9 @@
283
334
  <!-- Toast Notification -->
284
335
  <div id="toast-container" class="toast-container"></div>
285
336
 
286
- <!-- Hidden Milkdown Engine Mount Host -->
287
- <div id="studio-editor-host"></div>
337
+ <!-- Hidden Milkdown Engine Mount Host (if needed for background AST juice conversion) -->
338
+ <div id="studio-editor-host" style="display: none;"></div>
288
339
 
289
- <!-- Studio Script -->
290
340
  <script type="module" src="./studio.ts"></script>
291
341
  </body>
292
342
  </html>