marko 5.37.6 → 6.0.0-3.11

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 (648) hide show
  1. package/dist/common/attr-tag.d.ts +8 -0
  2. package/dist/common/compat-meta.d.ts +2 -0
  3. package/dist/common/for.d.ts +5 -0
  4. package/dist/common/helpers.d.ts +7 -0
  5. package/dist/common/meta.d.ts +2 -0
  6. package/dist/common/types.d.ts +105 -0
  7. package/dist/debug/dom.js +2111 -0
  8. package/dist/debug/dom.mjs +2088 -0
  9. package/dist/debug/html.js +2740 -0
  10. package/dist/debug/html.mjs +2663 -0
  11. package/dist/dom/abort-signal.d.ts +3 -0
  12. package/dist/dom/compat.d.ts +20 -0
  13. package/dist/dom/control-flow.d.ts +14 -0
  14. package/dist/dom/controllable.d.ts +12 -0
  15. package/dist/dom/dom.d.ts +19 -0
  16. package/dist/dom/event.d.ts +4 -0
  17. package/dist/dom/parse-html.d.ts +5 -0
  18. package/dist/dom/queue.d.ts +10 -0
  19. package/dist/dom/reconcile.d.ts +2 -0
  20. package/dist/dom/renderer.d.ts +21 -0
  21. package/dist/dom/resolve-cursor-position.d.ts +1 -0
  22. package/dist/dom/resume.d.ts +9 -0
  23. package/dist/dom/schedule.d.ts +2 -0
  24. package/dist/dom/scope.d.ts +7 -0
  25. package/dist/dom/signals.d.ts +39 -0
  26. package/dist/dom/template.d.ts +3 -0
  27. package/dist/dom/walker.d.ts +4 -0
  28. package/dist/dom.d.ts +15 -0
  29. package/dist/dom.js +1370 -0
  30. package/dist/dom.mjs +1350 -0
  31. package/dist/html/attrs.d.ts +14 -0
  32. package/dist/html/compat.d.ts +14 -0
  33. package/dist/html/content.d.ts +5 -0
  34. package/dist/html/dynamic-tag.d.ts +12 -0
  35. package/dist/html/for.d.ts +4 -0
  36. package/dist/html/inlined-runtimes.d.ts +2 -0
  37. package/dist/html/serializer.d.ts +14 -0
  38. package/dist/html/template.d.ts +3 -0
  39. package/dist/html/writer.d.ts +114 -0
  40. package/dist/html.d.ts +9 -0
  41. package/dist/html.js +1818 -0
  42. package/dist/html.mjs +1744 -0
  43. package/dist/translator/core/attrs.d.ts +3 -0
  44. package/dist/translator/core/client.d.ts +14 -0
  45. package/dist/translator/core/const.d.ts +3 -0
  46. package/dist/translator/core/debug.d.ts +3 -0
  47. package/dist/translator/core/define.d.ts +3 -0
  48. package/dist/translator/core/effect.d.ts +3 -0
  49. package/dist/translator/core/export.d.ts +3 -0
  50. package/dist/translator/core/for.d.ts +67 -0
  51. package/dist/translator/core/html-comment.d.ts +12 -0
  52. package/dist/translator/core/html-script.d.ts +9 -0
  53. package/dist/translator/core/html-style.d.ts +9 -0
  54. package/dist/translator/core/id.d.ts +3 -0
  55. package/dist/translator/core/if.d.ts +53 -0
  56. package/dist/translator/core/import.d.ts +3 -0
  57. package/dist/translator/core/index.d.ts +152 -0
  58. package/dist/translator/core/let.d.ts +8 -0
  59. package/dist/translator/core/lifecycle.d.ts +10 -0
  60. package/dist/translator/core/log.d.ts +3 -0
  61. package/dist/translator/core/return.d.ts +6 -0
  62. package/dist/translator/core/script.d.ts +3 -0
  63. package/dist/translator/core/server.d.ts +14 -0
  64. package/dist/translator/core/static.d.ts +14 -0
  65. package/dist/translator/core/style.d.ts +3 -0
  66. package/dist/translator/index.d.ts +201 -0
  67. package/dist/translator/index.js +9134 -490
  68. package/dist/translator/util/assert.d.ts +3 -0
  69. package/dist/translator/util/binding-has-downstream-expressions.d.ts +2 -0
  70. package/dist/translator/util/entry-builder.d.ts +19 -0
  71. package/dist/translator/util/evaluate.d.ts +11 -0
  72. package/dist/translator/util/for-each-identifier.d.ts +2 -0
  73. package/dist/translator/util/get-defined-binding-expression.d.ts +3 -0
  74. package/dist/translator/util/get-known-attr-values.d.ts +2 -0
  75. package/dist/translator/util/get-parent-tag.d.ts +2 -0
  76. package/dist/translator/util/get-root.d.ts +7 -0
  77. package/dist/translator/util/get-tag-name.d.ts +2 -0
  78. package/dist/translator/util/is-core-tag.d.ts +10 -0
  79. package/dist/translator/util/is-stateful.d.ts +3 -0
  80. package/dist/translator/util/is-static.d.ts +2 -0
  81. package/dist/translator/util/marko-config.d.ts +4 -0
  82. package/dist/translator/util/nested-attribute-tags.d.ts +17 -0
  83. package/dist/translator/util/normalize-string-expression.d.ts +3 -0
  84. package/dist/translator/util/optional.d.ts +20 -0
  85. package/dist/translator/util/plugin-hooks.d.ts +4 -0
  86. package/dist/translator/util/references.d.ts +84 -0
  87. package/dist/translator/util/runtime-info.d.ts +5 -0
  88. package/dist/translator/util/runtime.d.ts +15 -0
  89. package/dist/translator/util/scope-read.d.ts +6 -0
  90. package/dist/translator/util/sections.d.ts +51 -0
  91. package/dist/translator/util/signals.d.ts +61 -0
  92. package/dist/translator/util/simplify-fn.d.ts +5 -0
  93. package/dist/translator/util/state.d.ts +3 -0
  94. package/dist/translator/util/tag-name-type.d.ts +16 -0
  95. package/dist/translator/util/to-first-expression-or-block.d.ts +3 -0
  96. package/dist/translator/util/to-first-statement-or-block.d.ts +2 -0
  97. package/dist/translator/util/to-property-name.d.ts +7 -0
  98. package/dist/translator/util/translate-attrs.d.ts +12 -0
  99. package/dist/translator/util/translate-var.d.ts +2 -0
  100. package/dist/translator/util/traverse.d.ts +9 -0
  101. package/dist/translator/util/visitors.d.ts +11 -0
  102. package/dist/translator/util/walks.d.ts +15 -0
  103. package/dist/translator/util/with-previous-location.d.ts +2 -0
  104. package/dist/translator/util/writer.d.ts +13 -0
  105. package/dist/translator/visitors/cdata.d.ts +7 -0
  106. package/dist/translator/visitors/comment.d.ts +7 -0
  107. package/dist/translator/visitors/declaration.d.ts +7 -0
  108. package/dist/translator/visitors/document-type.d.ts +7 -0
  109. package/dist/translator/visitors/function.d.ts +19 -0
  110. package/dist/translator/visitors/import-declaration.d.ts +8 -0
  111. package/dist/translator/visitors/placeholder.d.ts +22 -0
  112. package/dist/translator/visitors/program/dom.d.ts +7 -0
  113. package/dist/translator/visitors/program/html.d.ts +8 -0
  114. package/dist/translator/visitors/program/index.d.ts +39 -0
  115. package/dist/translator/visitors/referenced-identifier.d.ts +7 -0
  116. package/dist/translator/visitors/scriptlet.d.ts +8 -0
  117. package/dist/translator/visitors/tag/attribute-tag.d.ts +11 -0
  118. package/dist/translator/visitors/tag/custom-tag.d.ts +19 -0
  119. package/dist/translator/visitors/tag/dynamic-tag.d.ts +18 -0
  120. package/dist/translator/visitors/tag/index.d.ts +15 -0
  121. package/dist/translator/visitors/tag/native-tag.d.ts +25 -0
  122. package/dist/translator/visitors/text.d.ts +7 -0
  123. package/package.json +34 -70
  124. package/tag-types/const.d.marko +7 -0
  125. package/tag-types/debug.d.marko +5 -0
  126. package/tag-types/define.d.marko +5 -0
  127. package/tag-types/do.d.marko +5 -0
  128. package/tag-types/effect.d.marko +5 -0
  129. package/tag-types/id.d.marko +3 -0
  130. package/tag-types/let.d.marko +8 -0
  131. package/tag-types/lifecycle.d.marko +7 -0
  132. package/tag-types/log.d.marko +5 -0
  133. package/tag-types/script.d.marko +5 -0
  134. package/README.md +0 -161
  135. package/bin/markoc +0 -2
  136. package/bin/markoc.js +0 -441
  137. package/browser-refresh.js +0 -5
  138. package/compiler-browser.marko +0 -15
  139. package/compiler.js +0 -7
  140. package/components-browser.marko +0 -15
  141. package/components.js +0 -7
  142. package/dist/build.json +0 -3
  143. package/dist/compiler/config.js +0 -45
  144. package/dist/compiler/index.js +0 -164
  145. package/dist/compiler/modules.js +0 -5
  146. package/dist/core-tags/components/init-components-tag.js +0 -54
  147. package/dist/core-tags/components/preferred-script-location-tag.js +0 -25
  148. package/dist/core-tags/components/preserve-tag.js +0 -1
  149. package/dist/core-tags/core/__flush_here_and_after__.js +0 -44
  150. package/dist/core-tags/core/await/AsyncValue.js +0 -121
  151. package/dist/core-tags/core/await/client-reorder-runtime.js +0 -51
  152. package/dist/core-tags/core/await/index.d.marko +0 -10
  153. package/dist/core-tags/core/await/renderer.js +0 -249
  154. package/dist/core-tags/core/await/reorderer-renderer.js +0 -156
  155. package/dist/index.js +0 -4
  156. package/dist/node-require/browser-refresh.js +0 -1
  157. package/dist/node-require/hot-reload.js +0 -45
  158. package/dist/node-require/index.js +0 -103
  159. package/dist/node_modules/@internal/components-beginComponent/index-browser.js +0 -23
  160. package/dist/node_modules/@internal/components-beginComponent/index.js +0 -84
  161. package/dist/node_modules/@internal/components-beginComponent/package.json +0 -11
  162. package/dist/node_modules/@internal/components-define-widget-legacy/index-browser.js +0 -335
  163. package/dist/node_modules/@internal/components-define-widget-legacy/index.js +0 -18
  164. package/dist/node_modules/@internal/components-define-widget-legacy/package.json +0 -11
  165. package/dist/node_modules/@internal/components-endComponent/index-browser.js +0 -5
  166. package/dist/node_modules/@internal/components-endComponent/index.js +0 -11
  167. package/dist/node_modules/@internal/components-endComponent/package.json +0 -11
  168. package/dist/node_modules/@internal/components-entry/index-browser.js +0 -11
  169. package/dist/node_modules/@internal/components-entry/index.js +0 -301
  170. package/dist/node_modules/@internal/components-entry/package.json +0 -11
  171. package/dist/node_modules/@internal/components-entry-legacy/index-browser.js +0 -76
  172. package/dist/node_modules/@internal/components-entry-legacy/index.js +0 -16
  173. package/dist/node_modules/@internal/components-entry-legacy/package.json +0 -11
  174. package/dist/node_modules/@internal/components-registry/index-browser.js +0 -586
  175. package/dist/node_modules/@internal/components-registry/index.js +0 -44
  176. package/dist/node_modules/@internal/components-registry/package.json +0 -11
  177. package/dist/node_modules/@internal/components-util/index-browser.js +0 -152
  178. package/dist/node_modules/@internal/components-util/index.js +0 -71
  179. package/dist/node_modules/@internal/components-util/package.json +0 -11
  180. package/dist/node_modules/@internal/create-readable/index-browser.js +0 -30
  181. package/dist/node_modules/@internal/create-readable/index.js +0 -57
  182. package/dist/node_modules/@internal/create-readable/package.json +0 -11
  183. package/dist/node_modules/@internal/loader/fallback-node.js +0 -89
  184. package/dist/node_modules/@internal/loader/index-browser.js +0 -2
  185. package/dist/node_modules/@internal/loader/index.js +0 -23
  186. package/dist/node_modules/@internal/loader/package.json +0 -10
  187. package/dist/node_modules/@internal/preserve-tag/index-browser.js +0 -46
  188. package/dist/node_modules/@internal/preserve-tag/index.js +0 -34
  189. package/dist/node_modules/@internal/preserve-tag/package.json +0 -11
  190. package/dist/node_modules/@internal/require/index-browser.js +0 -15
  191. package/dist/node_modules/@internal/require/index-legacy-browser.js +0 -20
  192. package/dist/node_modules/@internal/require/index-webpack.js +0 -16
  193. package/dist/node_modules/@internal/require/index.js +0 -15
  194. package/dist/node_modules/@internal/require/package.json +0 -11
  195. package/dist/node_modules/@internal/set-immediate/index-browser.js +0 -19
  196. package/dist/node_modules/@internal/set-immediate/index-worker.js +0 -31
  197. package/dist/node_modules/@internal/set-immediate/index.js +0 -3
  198. package/dist/node_modules/@internal/set-immediate/package.json +0 -11
  199. package/dist/node_modules/@internal/set-immediate/queueMicrotask.js +0 -8
  200. package/dist/runtime/RenderResult.js +0 -112
  201. package/dist/runtime/components/Component.js +0 -663
  202. package/dist/runtime/components/ComponentDef.js +0 -169
  203. package/dist/runtime/components/ComponentsContext.js +0 -59
  204. package/dist/runtime/components/GlobalComponentsContext.js +0 -10
  205. package/dist/runtime/components/KeySequence.js +0 -16
  206. package/dist/runtime/components/ServerComponent.js +0 -73
  207. package/dist/runtime/components/State.js +0 -101
  208. package/dist/runtime/components/attach-detach.js +0 -60
  209. package/dist/runtime/components/defineComponent.js +0 -60
  210. package/dist/runtime/components/dom-data.js +0 -8
  211. package/dist/runtime/components/event-delegation.js +0 -144
  212. package/dist/runtime/components/index.js +0 -1
  213. package/dist/runtime/components/legacy/browser.json +0 -9
  214. package/dist/runtime/components/legacy/defineComponent-legacy.js +0 -27
  215. package/dist/runtime/components/legacy/defineRenderer-legacy.js +0 -171
  216. package/dist/runtime/components/legacy/defineWidget-legacy.js +0 -1
  217. package/dist/runtime/components/legacy/dependencies/html.js +0 -3
  218. package/dist/runtime/components/legacy/dependencies/index.js +0 -177
  219. package/dist/runtime/components/legacy/dependencies/vdom.js +0 -3
  220. package/dist/runtime/components/legacy/index.js +0 -1
  221. package/dist/runtime/components/legacy/jquery.js +0 -52
  222. package/dist/runtime/components/legacy/ready.js +0 -152
  223. package/dist/runtime/components/legacy/renderer-legacy.js +0 -231
  224. package/dist/runtime/components/registry.js +0 -1
  225. package/dist/runtime/components/renderer.js +0 -236
  226. package/dist/runtime/components/update-manager.js +0 -94
  227. package/dist/runtime/createOut.js +0 -13
  228. package/dist/runtime/dom-insert.js +0 -77
  229. package/dist/runtime/events.js +0 -2
  230. package/dist/runtime/helpers/_change-case.js +0 -45
  231. package/dist/runtime/helpers/assign.js +0 -21
  232. package/dist/runtime/helpers/attr-tag.js +0 -43
  233. package/dist/runtime/helpers/class-value.js +0 -30
  234. package/dist/runtime/helpers/dynamic-tag.js +0 -181
  235. package/dist/runtime/helpers/empty-component.js +0 -1
  236. package/dist/runtime/helpers/merge.js +0 -13
  237. package/dist/runtime/helpers/of-fallback.js +0 -4
  238. package/dist/runtime/helpers/render-tag.js +0 -20
  239. package/dist/runtime/helpers/serialize-noop.js +0 -5
  240. package/dist/runtime/helpers/style-value.js +0 -45
  241. package/dist/runtime/helpers/tags-compat/dom-debug.js +0 -1
  242. package/dist/runtime/helpers/tags-compat/dom-debug.mjs +0 -4
  243. package/dist/runtime/helpers/tags-compat/dom.js +0 -1
  244. package/dist/runtime/helpers/tags-compat/dom.mjs +0 -4
  245. package/dist/runtime/helpers/tags-compat/html-debug.js +0 -3
  246. package/dist/runtime/helpers/tags-compat/html-debug.mjs +0 -4
  247. package/dist/runtime/helpers/tags-compat/html.js +0 -3
  248. package/dist/runtime/helpers/tags-compat/html.mjs +0 -4
  249. package/dist/runtime/helpers/tags-compat/runtime-dom.js +0 -239
  250. package/dist/runtime/helpers/tags-compat/runtime-html.js +0 -136
  251. package/dist/runtime/helpers/to-string.js +0 -5
  252. package/dist/runtime/html/AsyncStream.js +0 -805
  253. package/dist/runtime/html/BufferedWriter.js +0 -52
  254. package/dist/runtime/html/StringWriter.js +0 -73
  255. package/dist/runtime/html/helpers/_dynamic-attr.js +0 -35
  256. package/dist/runtime/html/helpers/attr.js +0 -80
  257. package/dist/runtime/html/helpers/attrs.js +0 -26
  258. package/dist/runtime/html/helpers/class-attr.js +0 -8
  259. package/dist/runtime/html/helpers/data-marko.js +0 -36
  260. package/dist/runtime/html/helpers/escape-quotes.js +0 -35
  261. package/dist/runtime/html/helpers/escape-script-placeholder.js +0 -24
  262. package/dist/runtime/html/helpers/escape-style-placeholder.js +0 -22
  263. package/dist/runtime/html/helpers/escape-xml.js +0 -21
  264. package/dist/runtime/html/helpers/merge-attrs.js +0 -55
  265. package/dist/runtime/html/helpers/props-script.js +0 -32
  266. package/dist/runtime/html/helpers/style-attr.js +0 -8
  267. package/dist/runtime/html/hot-reload.js +0 -26
  268. package/dist/runtime/html/index.js +0 -33
  269. package/dist/runtime/html/marko-namespace.js +0 -3
  270. package/dist/runtime/renderable.js +0 -194
  271. package/dist/runtime/vdom/AsyncVDOMBuilder.js +0 -456
  272. package/dist/runtime/vdom/VComment.js +0 -24
  273. package/dist/runtime/vdom/VComponent.js +0 -17
  274. package/dist/runtime/vdom/VDocumentFragment.js +0 -34
  275. package/dist/runtime/vdom/VElement.js +0 -375
  276. package/dist/runtime/vdom/VFragment.js +0 -26
  277. package/dist/runtime/vdom/VNode.js +0 -100
  278. package/dist/runtime/vdom/VText.js +0 -25
  279. package/dist/runtime/vdom/helpers/attrs.js +0 -62
  280. package/dist/runtime/vdom/helpers/const-element.js +0 -25
  281. package/dist/runtime/vdom/helpers/merge-attrs.js +0 -16
  282. package/dist/runtime/vdom/hot-reload.js +0 -115
  283. package/dist/runtime/vdom/index.js +0 -30
  284. package/dist/runtime/vdom/is-text-only.js +0 -10
  285. package/dist/runtime/vdom/marko-namespace.js +0 -3
  286. package/dist/runtime/vdom/morphdom/fragment.js +0 -95
  287. package/dist/runtime/vdom/morphdom/helpers.js +0 -42
  288. package/dist/runtime/vdom/morphdom/index.js +0 -741
  289. package/dist/runtime/vdom/parse-html.js +0 -18
  290. package/dist/runtime/vdom/vdom.js +0 -88
  291. package/dist/taglib/index.js +0 -51
  292. package/dist/translator/cdata/index.js +0 -15
  293. package/dist/translator/cdata/index[html].js +0 -15
  294. package/dist/translator/cdata/index[vdom].js +0 -12
  295. package/dist/translator/class.js +0 -65
  296. package/dist/translator/comment/index.js +0 -15
  297. package/dist/translator/comment/index[html].js +0 -17
  298. package/dist/translator/comment/index[vdom].js +0 -3
  299. package/dist/translator/declaration/index.js +0 -15
  300. package/dist/translator/declaration/index[html].js +0 -12
  301. package/dist/translator/declaration/index[vdom].js +0 -3
  302. package/dist/translator/document-type/index.js +0 -15
  303. package/dist/translator/document-type/index[html].js +0 -12
  304. package/dist/translator/document-type/index[vdom].js +0 -3
  305. package/dist/translator/placeholder/index.js +0 -15
  306. package/dist/translator/placeholder/index[html].js +0 -93
  307. package/dist/translator/placeholder/index[vdom].js +0 -22
  308. package/dist/translator/scriptlet.js +0 -4
  309. package/dist/translator/tag/attribute/directives/class.js +0 -42
  310. package/dist/translator/tag/attribute/directives/index.js +0 -15
  311. package/dist/translator/tag/attribute/directives/no-update-body-if.js +0 -15
  312. package/dist/translator/tag/attribute/directives/no-update-body.js +0 -10
  313. package/dist/translator/tag/attribute/directives/no-update-if.js +0 -12
  314. package/dist/translator/tag/attribute/directives/no-update.js +0 -48
  315. package/dist/translator/tag/attribute/directives/style.js +0 -42
  316. package/dist/translator/tag/attribute/index.js +0 -150
  317. package/dist/translator/tag/attribute/modifiers/index.js +0 -7
  318. package/dist/translator/tag/attribute/modifiers/no-update.js +0 -14
  319. package/dist/translator/tag/attribute/modifiers/scoped.js +0 -23
  320. package/dist/translator/tag/attribute-tag.js +0 -149
  321. package/dist/translator/tag/custom-tag.js +0 -146
  322. package/dist/translator/tag/dynamic-tag.js +0 -74
  323. package/dist/translator/tag/index.js +0 -287
  324. package/dist/translator/tag/macro-tag.js +0 -7
  325. package/dist/translator/tag/native-tag.js +0 -27
  326. package/dist/translator/tag/native-tag[html]/attributes.js +0 -151
  327. package/dist/translator/tag/native-tag[html]/index.js +0 -221
  328. package/dist/translator/tag/native-tag[vdom]/attributes.js +0 -105
  329. package/dist/translator/tag/native-tag[vdom]/index.js +0 -189
  330. package/dist/translator/tag/util.js +0 -246
  331. package/dist/translator/taglib/core/conditional/translate-else-if.js +0 -20
  332. package/dist/translator/taglib/core/conditional/translate-else.js +0 -20
  333. package/dist/translator/taglib/core/conditional/translate-if.js +0 -8
  334. package/dist/translator/taglib/core/conditional/util.js +0 -41
  335. package/dist/translator/taglib/core/index.js +0 -474
  336. package/dist/translator/taglib/core/macro/parse.js +0 -17
  337. package/dist/translator/taglib/core/macro/translate.js +0 -48
  338. package/dist/translator/taglib/core/parse-class.js +0 -79
  339. package/dist/translator/taglib/core/parse-export.js +0 -14
  340. package/dist/translator/taglib/core/parse-import.js +0 -14
  341. package/dist/translator/taglib/core/parse-module-code.js +0 -18
  342. package/dist/translator/taglib/core/parse-static.js +0 -18
  343. package/dist/translator/taglib/core/transform-style.js +0 -66
  344. package/dist/translator/taglib/core/translate-await.js +0 -41
  345. package/dist/translator/taglib/core/translate-body.js +0 -17
  346. package/dist/translator/taglib/core/translate-for.js +0 -156
  347. package/dist/translator/taglib/core/translate-html-comment.js +0 -52
  348. package/dist/translator/taglib/core/translate-include-content.js +0 -53
  349. package/dist/translator/taglib/core/translate-server-only.js +0 -5
  350. package/dist/translator/taglib/core/translate-while.js +0 -32
  351. package/dist/translator/taglib/index.js +0 -6
  352. package/dist/translator/taglib/migrate/all-templates.js +0 -46
  353. package/dist/translator/taglib/migrate/index.js +0 -5
  354. package/dist/translator/text/index.js +0 -10
  355. package/dist/translator/text/index[html].js +0 -12
  356. package/dist/translator/text/index[vdom].js +0 -20
  357. package/dist/translator/util/add-dependencies.js +0 -329
  358. package/dist/translator/util/escape-regexp.js +0 -4
  359. package/dist/translator/util/get-component-files.js +0 -86
  360. package/dist/translator/util/html-out-write.js +0 -15
  361. package/dist/translator/util/key-manager.js +0 -176
  362. package/dist/translator/util/optimize-html-writes.js +0 -52
  363. package/dist/translator/util/optimize-vdom-create.js +0 -164
  364. package/dist/translator/util/plugin-hooks.js +0 -22
  365. package/dist/translator/util/runtime-flags.js +0 -3
  366. package/dist/translator/util/vdom-out-write.js +0 -10
  367. package/dist/translator/util/with-previous-location.js +0 -6
  368. package/docs/10-awesome-marko-features.md +0 -291
  369. package/docs/body-content.md +0 -355
  370. package/docs/class-components.md +0 -1001
  371. package/docs/cloudflare-workers.md +0 -32
  372. package/docs/compiler-hooks.png +0 -0
  373. package/docs/compiler.md +0 -473
  374. package/docs/component-diagram.afdesign +0 -0
  375. package/docs/component-diagram.svg +0 -87
  376. package/docs/concise.md +0 -141
  377. package/docs/conditionals-and-lists.md +0 -72
  378. package/docs/core-tags.md +0 -325
  379. package/docs/custom-tags.md +0 -201
  380. package/docs/editor-plugins.md +0 -45
  381. package/docs/events.md +0 -131
  382. package/docs/express.md +0 -66
  383. package/docs/fastify.md +0 -65
  384. package/docs/getting-started.md +0 -95
  385. package/docs/http.md +0 -34
  386. package/docs/icons/js.svg +0 -4
  387. package/docs/icons/marko.svg +0 -1
  388. package/docs/icons/ts.svg +0 -1
  389. package/docs/installing.md +0 -51
  390. package/docs/koa.md +0 -35
  391. package/docs/lasso.md +0 -196
  392. package/docs/marko-5-upgrade.md +0 -59
  393. package/docs/marko-json.md +0 -248
  394. package/docs/marko-vs-react.md +0 -854
  395. package/docs/redux.md +0 -61
  396. package/docs/rendering.md +0 -268
  397. package/docs/rollup.md +0 -352
  398. package/docs/state.md +0 -105
  399. package/docs/structure.json +0 -49
  400. package/docs/styles.md +0 -29
  401. package/docs/syntax.md +0 -601
  402. package/docs/troubleshooting-streaming.md +0 -68
  403. package/docs/typescript.md +0 -406
  404. package/docs/vite.md +0 -86
  405. package/docs/webpack.md +0 -205
  406. package/docs/why-is-marko-fast.md +0 -239
  407. package/env.js +0 -7
  408. package/helpers/README.md +0 -3
  409. package/helpers/empty.js +0 -4
  410. package/helpers/notEmpty.js +0 -11
  411. package/index-browser.marko +0 -15
  412. package/index.d.ts +0 -375
  413. package/index.js +0 -7
  414. package/legacy-components-browser.marko +0 -15
  415. package/legacy-components.js +0 -7
  416. package/node-require.js +0 -8
  417. package/src/build.json +0 -3
  418. package/src/compiler/config.js +0 -45
  419. package/src/compiler/index.js +0 -164
  420. package/src/compiler/modules.js +0 -5
  421. package/src/core-tags/.eslintrc +0 -5
  422. package/src/core-tags/components/init-components-tag.js +0 -54
  423. package/src/core-tags/components/preferred-script-location-tag.js +0 -25
  424. package/src/core-tags/components/preserve-tag.js +0 -1
  425. package/src/core-tags/core/__flush_here_and_after__.js +0 -44
  426. package/src/core-tags/core/await/AsyncValue.js +0 -121
  427. package/src/core-tags/core/await/client-reorder-runtime.js +0 -51
  428. package/src/core-tags/core/await/index.d.marko +0 -10
  429. package/src/core-tags/core/await/renderer.js +0 -249
  430. package/src/core-tags/core/await/reorderer-renderer.js +0 -156
  431. package/src/index.js +0 -4
  432. package/src/node-require/browser-refresh.js +0 -18
  433. package/src/node-require/hot-reload.js +0 -45
  434. package/src/node-require/index.js +0 -103
  435. package/src/node_modules/@internal/components-beginComponent/index-browser.js +0 -23
  436. package/src/node_modules/@internal/components-beginComponent/index.js +0 -84
  437. package/src/node_modules/@internal/components-beginComponent/package.json +0 -11
  438. package/src/node_modules/@internal/components-define-widget-legacy/index-browser.js +0 -335
  439. package/src/node_modules/@internal/components-define-widget-legacy/index.js +0 -18
  440. package/src/node_modules/@internal/components-define-widget-legacy/package.json +0 -11
  441. package/src/node_modules/@internal/components-endComponent/index-browser.js +0 -5
  442. package/src/node_modules/@internal/components-endComponent/index.js +0 -11
  443. package/src/node_modules/@internal/components-endComponent/package.json +0 -11
  444. package/src/node_modules/@internal/components-entry/index-browser.js +0 -11
  445. package/src/node_modules/@internal/components-entry/index.js +0 -301
  446. package/src/node_modules/@internal/components-entry/package.json +0 -11
  447. package/src/node_modules/@internal/components-entry-legacy/index-browser.js +0 -76
  448. package/src/node_modules/@internal/components-entry-legacy/index.js +0 -16
  449. package/src/node_modules/@internal/components-entry-legacy/package.json +0 -11
  450. package/src/node_modules/@internal/components-registry/index-browser.js +0 -586
  451. package/src/node_modules/@internal/components-registry/index.js +0 -44
  452. package/src/node_modules/@internal/components-registry/package.json +0 -11
  453. package/src/node_modules/@internal/components-util/index-browser.js +0 -152
  454. package/src/node_modules/@internal/components-util/index.js +0 -75
  455. package/src/node_modules/@internal/components-util/package.json +0 -11
  456. package/src/node_modules/@internal/create-readable/index-browser.js +0 -30
  457. package/src/node_modules/@internal/create-readable/index.js +0 -57
  458. package/src/node_modules/@internal/create-readable/package.json +0 -11
  459. package/src/node_modules/@internal/loader/fallback-node.js +0 -89
  460. package/src/node_modules/@internal/loader/index-browser.js +0 -2
  461. package/src/node_modules/@internal/loader/index.js +0 -23
  462. package/src/node_modules/@internal/loader/package.json +0 -10
  463. package/src/node_modules/@internal/preserve-tag/index-browser.js +0 -46
  464. package/src/node_modules/@internal/preserve-tag/index.js +0 -34
  465. package/src/node_modules/@internal/preserve-tag/package.json +0 -11
  466. package/src/node_modules/@internal/require/index-browser.js +0 -15
  467. package/src/node_modules/@internal/require/index-legacy-browser.js +0 -20
  468. package/src/node_modules/@internal/require/index-webpack.js +0 -16
  469. package/src/node_modules/@internal/require/index.js +0 -15
  470. package/src/node_modules/@internal/require/package.json +0 -11
  471. package/src/node_modules/@internal/set-immediate/index-browser.js +0 -19
  472. package/src/node_modules/@internal/set-immediate/index-worker.js +0 -31
  473. package/src/node_modules/@internal/set-immediate/index.js +0 -3
  474. package/src/node_modules/@internal/set-immediate/package.json +0 -11
  475. package/src/node_modules/@internal/set-immediate/queueMicrotask.js +0 -8
  476. package/src/runtime/.eslintrc +0 -5
  477. package/src/runtime/RenderResult.js +0 -112
  478. package/src/runtime/components/Component.js +0 -663
  479. package/src/runtime/components/ComponentDef.js +0 -169
  480. package/src/runtime/components/ComponentsContext.js +0 -59
  481. package/src/runtime/components/GlobalComponentsContext.js +0 -10
  482. package/src/runtime/components/KeySequence.js +0 -16
  483. package/src/runtime/components/ServerComponent.js +0 -73
  484. package/src/runtime/components/State.js +0 -101
  485. package/src/runtime/components/attach-detach.js +0 -60
  486. package/src/runtime/components/defineComponent.js +0 -60
  487. package/src/runtime/components/dom-data.js +0 -8
  488. package/src/runtime/components/event-delegation.js +0 -144
  489. package/src/runtime/components/index.js +0 -1
  490. package/src/runtime/components/legacy/browser.json +0 -9
  491. package/src/runtime/components/legacy/defineComponent-legacy.js +0 -27
  492. package/src/runtime/components/legacy/defineRenderer-legacy.js +0 -171
  493. package/src/runtime/components/legacy/defineWidget-legacy.js +0 -1
  494. package/src/runtime/components/legacy/dependencies/html.js +0 -3
  495. package/src/runtime/components/legacy/dependencies/index.js +0 -177
  496. package/src/runtime/components/legacy/dependencies/vdom.js +0 -3
  497. package/src/runtime/components/legacy/index.js +0 -1
  498. package/src/runtime/components/legacy/jquery.js +0 -52
  499. package/src/runtime/components/legacy/ready.js +0 -152
  500. package/src/runtime/components/legacy/renderer-legacy.js +0 -231
  501. package/src/runtime/components/registry.js +0 -1
  502. package/src/runtime/components/renderer.js +0 -236
  503. package/src/runtime/components/update-manager.js +0 -94
  504. package/src/runtime/createOut.js +0 -13
  505. package/src/runtime/dom-insert.js +0 -77
  506. package/src/runtime/events.js +0 -2
  507. package/src/runtime/helpers/_change-case.js +0 -45
  508. package/src/runtime/helpers/assign.js +0 -21
  509. package/src/runtime/helpers/attr-tag.js +0 -43
  510. package/src/runtime/helpers/class-value.js +0 -30
  511. package/src/runtime/helpers/dynamic-tag.js +0 -181
  512. package/src/runtime/helpers/empty-component.js +0 -1
  513. package/src/runtime/helpers/merge.js +0 -13
  514. package/src/runtime/helpers/of-fallback.js +0 -4
  515. package/src/runtime/helpers/render-tag.js +0 -20
  516. package/src/runtime/helpers/serialize-noop.js +0 -5
  517. package/src/runtime/helpers/style-value.js +0 -45
  518. package/src/runtime/helpers/tags-compat/dom-debug.js +0 -1
  519. package/src/runtime/helpers/tags-compat/dom-debug.mjs +0 -4
  520. package/src/runtime/helpers/tags-compat/dom.js +0 -1
  521. package/src/runtime/helpers/tags-compat/dom.mjs +0 -4
  522. package/src/runtime/helpers/tags-compat/html-debug.js +0 -3
  523. package/src/runtime/helpers/tags-compat/html-debug.mjs +0 -4
  524. package/src/runtime/helpers/tags-compat/html.js +0 -3
  525. package/src/runtime/helpers/tags-compat/html.mjs +0 -4
  526. package/src/runtime/helpers/tags-compat/runtime-dom.js +0 -239
  527. package/src/runtime/helpers/tags-compat/runtime-html.js +0 -136
  528. package/src/runtime/helpers/to-string.js +0 -5
  529. package/src/runtime/html/AsyncStream.js +0 -805
  530. package/src/runtime/html/BufferedWriter.js +0 -52
  531. package/src/runtime/html/StringWriter.js +0 -73
  532. package/src/runtime/html/helpers/_dynamic-attr.js +0 -35
  533. package/src/runtime/html/helpers/attr.js +0 -80
  534. package/src/runtime/html/helpers/attrs.js +0 -26
  535. package/src/runtime/html/helpers/class-attr.js +0 -8
  536. package/src/runtime/html/helpers/data-marko.js +0 -36
  537. package/src/runtime/html/helpers/escape-quotes.js +0 -35
  538. package/src/runtime/html/helpers/escape-script-placeholder.js +0 -24
  539. package/src/runtime/html/helpers/escape-style-placeholder.js +0 -22
  540. package/src/runtime/html/helpers/escape-xml.js +0 -21
  541. package/src/runtime/html/helpers/merge-attrs.js +0 -55
  542. package/src/runtime/html/helpers/props-script.js +0 -32
  543. package/src/runtime/html/helpers/style-attr.js +0 -8
  544. package/src/runtime/html/hot-reload.js +0 -26
  545. package/src/runtime/html/index.js +0 -33
  546. package/src/runtime/html/marko-namespace.js +0 -3
  547. package/src/runtime/renderable.js +0 -194
  548. package/src/runtime/vdom/AsyncVDOMBuilder.js +0 -456
  549. package/src/runtime/vdom/VComment.js +0 -24
  550. package/src/runtime/vdom/VComponent.js +0 -17
  551. package/src/runtime/vdom/VDocumentFragment.js +0 -34
  552. package/src/runtime/vdom/VElement.js +0 -375
  553. package/src/runtime/vdom/VFragment.js +0 -26
  554. package/src/runtime/vdom/VNode.js +0 -100
  555. package/src/runtime/vdom/VText.js +0 -25
  556. package/src/runtime/vdom/helpers/attrs.js +0 -62
  557. package/src/runtime/vdom/helpers/const-element.js +0 -25
  558. package/src/runtime/vdom/helpers/merge-attrs.js +0 -16
  559. package/src/runtime/vdom/hot-reload.js +0 -115
  560. package/src/runtime/vdom/index.js +0 -30
  561. package/src/runtime/vdom/is-text-only.js +0 -10
  562. package/src/runtime/vdom/marko-namespace.js +0 -3
  563. package/src/runtime/vdom/morphdom/fragment.js +0 -95
  564. package/src/runtime/vdom/morphdom/helpers.js +0 -42
  565. package/src/runtime/vdom/morphdom/index.js +0 -741
  566. package/src/runtime/vdom/parse-html.js +0 -18
  567. package/src/runtime/vdom/vdom.js +0 -88
  568. package/src/taglib/index.js +0 -51
  569. package/src/translator/cdata/index.js +0 -15
  570. package/src/translator/cdata/index[html].js +0 -15
  571. package/src/translator/cdata/index[vdom].js +0 -12
  572. package/src/translator/class.js +0 -65
  573. package/src/translator/comment/index.js +0 -15
  574. package/src/translator/comment/index[html].js +0 -17
  575. package/src/translator/comment/index[vdom].js +0 -3
  576. package/src/translator/declaration/index.js +0 -15
  577. package/src/translator/declaration/index[html].js +0 -12
  578. package/src/translator/declaration/index[vdom].js +0 -3
  579. package/src/translator/document-type/index.js +0 -15
  580. package/src/translator/document-type/index[html].js +0 -12
  581. package/src/translator/document-type/index[vdom].js +0 -3
  582. package/src/translator/index.js +0 -552
  583. package/src/translator/placeholder/index.js +0 -15
  584. package/src/translator/placeholder/index[html].js +0 -93
  585. package/src/translator/placeholder/index[vdom].js +0 -22
  586. package/src/translator/scriptlet.js +0 -4
  587. package/src/translator/tag/attribute/directives/class.js +0 -42
  588. package/src/translator/tag/attribute/directives/index.js +0 -15
  589. package/src/translator/tag/attribute/directives/no-update-body-if.js +0 -15
  590. package/src/translator/tag/attribute/directives/no-update-body.js +0 -10
  591. package/src/translator/tag/attribute/directives/no-update-if.js +0 -12
  592. package/src/translator/tag/attribute/directives/no-update.js +0 -48
  593. package/src/translator/tag/attribute/directives/style.js +0 -42
  594. package/src/translator/tag/attribute/index.js +0 -150
  595. package/src/translator/tag/attribute/modifiers/index.js +0 -7
  596. package/src/translator/tag/attribute/modifiers/no-update.js +0 -14
  597. package/src/translator/tag/attribute/modifiers/scoped.js +0 -23
  598. package/src/translator/tag/attribute-tag.js +0 -149
  599. package/src/translator/tag/custom-tag.js +0 -146
  600. package/src/translator/tag/dynamic-tag.js +0 -74
  601. package/src/translator/tag/index.js +0 -287
  602. package/src/translator/tag/macro-tag.js +0 -7
  603. package/src/translator/tag/native-tag.js +0 -27
  604. package/src/translator/tag/native-tag[html]/attributes.js +0 -151
  605. package/src/translator/tag/native-tag[html]/index.js +0 -221
  606. package/src/translator/tag/native-tag[vdom]/attributes.js +0 -105
  607. package/src/translator/tag/native-tag[vdom]/index.js +0 -189
  608. package/src/translator/tag/util.js +0 -246
  609. package/src/translator/taglib/core/conditional/translate-else-if.js +0 -20
  610. package/src/translator/taglib/core/conditional/translate-else.js +0 -20
  611. package/src/translator/taglib/core/conditional/translate-if.js +0 -8
  612. package/src/translator/taglib/core/conditional/util.js +0 -41
  613. package/src/translator/taglib/core/index.js +0 -474
  614. package/src/translator/taglib/core/macro/parse.js +0 -17
  615. package/src/translator/taglib/core/macro/translate.js +0 -48
  616. package/src/translator/taglib/core/parse-class.js +0 -79
  617. package/src/translator/taglib/core/parse-export.js +0 -14
  618. package/src/translator/taglib/core/parse-import.js +0 -14
  619. package/src/translator/taglib/core/parse-module-code.js +0 -18
  620. package/src/translator/taglib/core/parse-static.js +0 -18
  621. package/src/translator/taglib/core/transform-style.js +0 -66
  622. package/src/translator/taglib/core/translate-await.js +0 -41
  623. package/src/translator/taglib/core/translate-body.js +0 -17
  624. package/src/translator/taglib/core/translate-for.js +0 -156
  625. package/src/translator/taglib/core/translate-html-comment.js +0 -52
  626. package/src/translator/taglib/core/translate-include-content.js +0 -53
  627. package/src/translator/taglib/core/translate-server-only.js +0 -5
  628. package/src/translator/taglib/core/translate-while.js +0 -32
  629. package/src/translator/taglib/index.js +0 -7
  630. package/src/translator/taglib/migrate/all-templates.js +0 -46
  631. package/src/translator/taglib/migrate/index.js +0 -5
  632. package/src/translator/text/index.js +0 -10
  633. package/src/translator/text/index[html].js +0 -12
  634. package/src/translator/text/index[vdom].js +0 -20
  635. package/src/translator/util/add-dependencies.js +0 -329
  636. package/src/translator/util/escape-regexp.js +0 -4
  637. package/src/translator/util/get-component-files.js +0 -86
  638. package/src/translator/util/html-out-write.js +0 -15
  639. package/src/translator/util/key-manager.js +0 -176
  640. package/src/translator/util/optimize-html-writes.js +0 -52
  641. package/src/translator/util/optimize-vdom-create.js +0 -164
  642. package/src/translator/util/plugin-hooks.js +0 -22
  643. package/src/translator/util/runtime-flags.js +0 -3
  644. package/src/translator/util/vdom-out-write.js +0 -10
  645. package/src/translator/util/with-previous-location.js +0 -6
  646. package/tags-html.d.ts +0 -3855
  647. package/translator/index.d.ts +0 -7
  648. package/translator/package.json +0 -5
package/docs/body-content.md DELETED
@@ -1,355 +0,0 @@
1
- # Body content
2
-
3
- We're used to passing body content to HTML tags. When you do this, the tag has control over where and when this content is rendered. A good example of this is the [HTML `<details>` element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details):
4
-
5
- ```html
6
- <details>
7
- <summary>Hello <strong>World</strong></summary>
8
- This is some <em>content</em> that can be toggled.
9
- </details>
10
- ```
11
-
12
- This is what it renders (try clicking it):
13
-
14
- ---
15
-
16
- <details>
17
- <summary>Hello <strong>World</strong></summary>
18
- This is some <em>content</em> that can be toggled.
19
- </details>
20
-
21
- ---
22
-
23
- Custom tags can also receive content in the same way. This allows a component to give its user full control over _how_ some section of the content is rendered, but control _where_, _when_, and with _what_ data it is rendered. This feature is necessary to build composable components like overlays, layouts, dropdowns, etc. Imagine a `<table>` that didn't give you control over how its cells were rendered. That would be pretty limited!
24
-
25
- ## Rendering body content
26
-
27
- When a custom tag is passed body content, it is received as a special `renderBody` property on the component's `input`. You can include this content anywhere in your component by using the [`<${dynamic}>` syntax](./syntax.md#dynamic-tagname).
28
-
29
- _components/fancy-container.marko:_
30
-
31
- ```marko
32
- <div class="container fancy">
33
- <${input.renderBody}/>
34
- </div>
35
- ```
36
-
37
- If we were to use this tag like this:
38
-
39
- _Marko Source:_
40
-
41
- ```marko
42
- <fancy-container>
43
- <p>Content goes here...</p>
44
- </fancy-container>
45
- ```
46
-
47
- The rendered output would be:
48
-
49
- _HTML Output:_
50
-
51
- ```html
52
- <div class="container fancy"><p>Content goes here...</p></div>
53
- ```
54
-
55
- This is a pretty basic example, but you can imagine how this could be incorporated into a more advanced component to render passed content where/when needed.
56
-
57
- > **ProTip:**
58
- > Body content can be rendered multiple times. Or not at all.
59
-
60
- ## Passing attributes to body content
61
-
62
- When rendering body content with `<${dynamic}>`, attributes may also be passed:
63
-
64
- _components/random-value.marko:_
65
-
66
- ```marko
67
- <!-- heh, it's not actually random -->
68
- <${input.renderBody} number=1337 />
69
- ```
70
-
71
- These attribute values can be received as a [tag parameter](./syntax.md#parameters):
72
-
73
- ```marko
74
- <random-value|{ number }|>
75
- The number is ${number}
76
- </random-value>
77
- ```
78
-
79
- > **ProTip:**
80
- > Some tags (like the above tag) may not render anything except their body content with some data. This can be quite useful, just look at the `<for>` and `<await>` tags!
81
-
82
- ## Named body content
83
-
84
- You can also pass named content sections to a tag using [attribute tags](./syntax.md#attribute-tag) which are denoted by the `@` prefix.
85
-
86
- ```marko
87
- <layout>
88
- <@heading>
89
- <h1>Hello Marko</h1>
90
- </@heading>
91
- <@content>
92
- <p>...</p>
93
- </@content>
94
- </layout>
95
- ```
96
-
97
- Like attributes, these attribute tags are received as `input.heading` and `input.content`, but they each have a `renderBody` property which we can now use:
98
-
99
- _components/layout.marko_
100
-
101
- ```marko
102
- <!doctype html>
103
- <html>
104
- <body>
105
- <${input.heading.renderBody}/>
106
- <hr/>
107
- <${input.content.renderBody}/>
108
- </body>
109
- </html>
110
- ```
111
-
112
- > **ProTip:** The `renderBody` property can be omitted. You could use `<${input.heading}/>`, for example.
113
-
114
- ### Repeated body content
115
-
116
- When an attribute tag is repeated, the child component can consume all instances using the [iterable protocol](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols#the_iterable_protocol).
117
-
118
- This allows us to, for example, build a custom table component which allows its user to specify any number of columns, while still giving the user control over how each column is rendered.
119
-
120
- _Marko Source:_
121
-
122
- ```marko
123
- <fancy-table data=people>
124
- <@column|person|>
125
- Name: ${person.name}
126
- </@column>
127
- <@column|person|>
128
- Age: ${person.age}
129
- </@column>
130
- </fancy-table>
131
- ```
132
-
133
- > _Note_
134
- > For TypeScript the [`Marko.AttrTag` helper](./typescript.md#built-in-marko-types) should be used here.
135
-
136
- > _Protip_
137
- > Since attribute tags are iterable you could pass `input.column` to a `for of` loop, or `[...spread]` it into an array.
138
- > To `.map`, `.filter` or otherwise work with attribute tags as an array you can use the following pattern:
139
- >
140
- > ```marko
141
- > $ const columns = [...input.column || []];
142
- > ```
143
-
144
- We can then use the `<for>` tag to render the body content into table, passing the row data to each column's body.
145
-
146
- _components/fancy-table/index.marko:_
147
-
148
- ```marko {4-8}
149
- <table class="fancy">
150
- <for|row| of=input.data>
151
- <tr>
152
- <for|column| of=input.column>
153
- <td>
154
- <${column.renderBody} ...row/>
155
- </td>
156
- </for>
157
- </tr>
158
- </for>
159
- </table>
160
- ```
161
-
162
- We now have a working `<fancy-table>`. Let's see what it renders:
163
-
164
- _Example Data:_
165
-
166
- ```js
167
- [
168
- {
169
- name: "Patrick",
170
- age: 63,
171
- },
172
- {
173
- name: "Austin",
174
- age: 12,
175
- },
176
- ];
177
- ```
178
-
179
- _HTML Output:_
180
-
181
- ```html
182
- <table class="fancy">
183
- <tr>
184
- <td>Name: Patrick</td>
185
- <td>Age: 63</td>
186
- </tr>
187
- <tr>
188
- <td>Name: Austin</td>
189
- <td>Age: 12</td>
190
- </tr>
191
- </table>
192
- ```
193
-
194
- ### Attributes on attribute tags
195
-
196
- If you look at our previous example, we had to prefix each cell with the column label. It would be better if we could give a name to each column instead and only render that once.
197
-
198
- _Marko Source:_
199
-
200
- ```marko
201
- <fancy-table>
202
- <@column|person| heading="Name">
203
- ${person.name}
204
- </@column>
205
- <@column|person| heading="Age">
206
- ${person.age}
207
- </@column>
208
- </fancy-table>
209
- ```
210
-
211
- Now, each attribute tag in `input.column` will contain a `heading` property in addition to its `renderBody`. We can use another `<for>` and render the headings in `<th>` tags:
212
-
213
- _components/fancy-table/index.marko:_
214
-
215
- ```marko {3-5}
216
- <table class="fancy">
217
- <tr>
218
- <for|column| of=input.column>
219
- <th>${column.heading}</th>
220
- </for>
221
- </tr>
222
- <for|row| of=input.data>
223
- <tr>
224
- <for|column| of=input.column>
225
- <td>
226
- <${column.renderBody} ...row/>
227
- </td>
228
- </for>
229
- </tr>
230
- </for>
231
- </table>
232
- ```
233
-
234
- We'll now get a row of headings when we render our `<fancy-table>`
235
-
236
- _HTML Output:_
237
-
238
- ```html
239
- <table class="fancy">
240
- <tr>
241
- <th>Name</th>
242
- <th>Age</th>
243
- </tr>
244
- <tr>
245
- <td>Patrick</td>
246
- <td>63</td>
247
- </tr>
248
- <tr>
249
- <td>Austin</td>
250
- <td>12</td>
251
- </tr>
252
- </table>
253
- ```
254
-
255
- ### Nested attribute tags
256
-
257
- Continuing to build on our example, what if we want to add some custom content or even components into the column headings? In this case, we can extend our `<fancy-table>` to use nested attribute tags. We'll now have `<@heading>` and `<@cell>` tags nested under `<@column>`. This gives users of our tag full control over how to render both column headings and the cells within the column!
258
-
259
- _Marko Source:_
260
-
261
- ```marko {3-8}
262
- <fancy-table>
263
- <@column>
264
- <@heading>
265
- <app-icon type="profile"/> Name
266
- </@heading>
267
- <@cell|person|>
268
- ${person.name}
269
- </@cell>
270
- </@column>
271
- <@column>
272
- <@heading>
273
- <app-icon type="calendar"/> Age
274
- </@heading>
275
- <@cell|person|>
276
- ${person.age}
277
- </@cell>
278
- </@column>
279
- </fancy-table>
280
- ```
281
-
282
- Now instead of rendering the heading as text, we'll render the heading's body content.
283
-
284
- _components/fancy-table/index.marko:_
285
-
286
- ```marko {5}
287
- <table class="fancy">
288
- <tr>
289
- <for|column| of=input.column>
290
- <th>
291
- <${column.heading.renderBody}/>
292
- </th>
293
- </for>
294
- </tr>
295
- <for|row| of=input.data>
296
- <tr>
297
- <for|column| of=input.column>
298
- <td>
299
- <${column.cell.renderBody} ...row/>
300
- </td>
301
- </for>
302
- </tr>
303
- </for>
304
- </table>
305
- ```
306
-
307
- Our headings can now include icons (and anything else)!
308
-
309
- _HTML Output:_
310
-
311
- ```html
312
- <table class="fancy">
313
- <tr>
314
- <th><img class="icon" src="profile.svg" /> Name</th>
315
- <th><img class="icon" src="calendar.svg" /> Age</th>
316
- </tr>
317
- <tr>
318
- <td>Patrick</td>
319
- <td>63</td>
320
- </tr>
321
- <tr>
322
- <td>Austin</td>
323
- <td>12</td>
324
- </tr>
325
- </table>
326
- ```
327
-
328
- ### Dynamic attribute tags
329
-
330
- The flexibility of the `<fancy-table>` is great if you want to render columns differently or have columns that display the data in a special way (such as displaying an age derived from a date of birth). However, if all columns are basically the same, the user might feel they're repeating themselves. As you might expect, you can use `<for>` (and `<if>`) to dynamically render attribute tags.
331
-
332
- ```marko
333
- $ const columns = [{
334
- property: "name",
335
- title: "Name",
336
- icon: "profile"
337
- }, {
338
- property: "age",
339
- title: "Age",
340
- icon: "calendar"
341
- }]
342
-
343
- <fancy-table>
344
- <for|{ property, title, icon }|>
345
- <@column>
346
- <@heading>
347
- <app-icon type=icon/> ${title}
348
- </@heading>
349
- <@cell|person|>
350
- ${person[property]}
351
- </@cell>
352
- </@column>
353
- </for>
354
- </fancy-table>
355
- ```