this repo has no description
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

feat(parse): support mermaid diagrams

they're not pretty, but they're there and working

+55 -28
+3 -1
commands/dev.ts
··· 49 49 return response; 50 50 } 51 51 52 + const { body, scripts } = await renderBody(path); 53 + 52 54 return new Response( 53 - eta.render("live-reload", { body: await renderBody(path) }), 55 + eta.render("live-reload", { body, scripts }), 54 56 { 55 57 status: 200, 56 58 headers: {
+3
deno.lock
··· 146 146 "undici-types" 147 147 ] 148 148 }, 149 + "@types/trusted-types@2.0.7": { 150 + "integrity": "sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw==" 151 + }, 149 152 "@types/unist@3.0.3": { 150 153 "integrity": "sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q==" 151 154 },
+46 -27
parse/render.ts
··· 1 1 import Markdoc, { 2 2 Config, 3 3 Node, 4 + nodes, 4 5 RenderableTreeNode, 5 6 Tag, 6 7 } from "@markdoc/markdoc"; ··· 29 30 ); 30 31 } 31 32 32 - console.log(tag); 33 - 34 33 return tag; 35 34 } 36 35 37 - const config: Config = { 38 - tags: { 39 - slide: { 40 - render: "section", 36 + function createConfig() { 37 + const scripts = new Set<string>(); 38 + const config: Config = { 39 + tags: { 40 + slide: { 41 + render: "section", 42 + }, 43 + content: { 44 + render: "div", 45 + }, 41 46 }, 42 - content: { 43 - render: "div", 44 - }, 45 - }, 46 - nodes: { 47 - fence: { 48 - render: "pre", 49 - attributes: { 50 - content: { type: "String", render: false }, 51 - language: { type: "String", render: false }, 52 - }, 53 - async transform(node) { 54 - const { content, language = "text" } = node.attributes; 47 + nodes: { 48 + fence: { 49 + render: "pre", 50 + attributes: { 51 + content: { type: "String", render: false }, 52 + language: { type: "String", render: false }, 53 + }, 54 + async transform(node, config) { 55 + const { content, language = "text" } = node.attributes; 56 + 57 + if (language === "mermaid") { 58 + scripts.add( 59 + "https://cdn.jsdelivr.net/npm/mermaid@11.9.0/dist/mermaid.min.js", 60 + ); 61 + 62 + // Bail out for Mermaid to handle later 63 + const base = (nodes.fence.transform!)(node, config); 64 + (base as Tag).attributes.class = "mermaid"; 65 + return base; 66 + } 55 67 56 - const hast = await codeToHast(content, { 57 - lang: language, 58 - theme: "rose-pine", 59 - }); 68 + const hast = await codeToHast(content, { 69 + lang: language, 70 + theme: "rose-pine", 71 + }); 60 72 61 - return hastToRenderNode(hast); 73 + return hastToRenderNode(hast); 74 + }, 62 75 }, 63 76 }, 64 - }, 65 - }; 77 + }; 78 + 79 + return { scripts, config }; 80 + } 66 81 67 82 export async function renderBody(path: string) { 68 83 const file = await Deno.readTextFile(path); ··· 88 103 ], "slide") 89 104 ); 90 105 106 + const { config, scripts } = createConfig(); 91 107 const tree = Markdoc.transform(ast, config); 92 108 93 - return Markdoc.renderers.html(await Promise.resolve(tree)); 109 + return { 110 + scripts, 111 + body: Markdoc.renderers.html(await Promise.resolve(tree)), 112 + }; 94 113 }
+3
templates/live-reload.eta
··· 126 126 console.log("live reload connected") 127 127 }) 128 128 </script> 129 + <% it.scripts.forEach(src => { %> 130 + <script src="<%= src %>"></script> 131 + <% }) %> 129 132 </body> 130 133 </html>