on dc9fcd4 help sign in
urbit.org/components/Markdown.js
47 lines 1.1 kB history raw
1import remark from "remark";
2import gfm from "remark-gfm";
3import slug from "remark-slug";
4import heading from "remark-heading-id";
5import html from "remark-html";
6import remarkprism from "remark-prism";
7import normalize from "mdurl/encode";
9// img is wrapped in figure so that images can be extra wide in the blog posts
10function Img(h, node) {
11 var props = { src: normalize(node.url), alt: node.alt };
12 if (node.title !== null && node.title !== undefined) {
13 props.title = node.title;
14 }
15 return {
16 type: "element",
17 tagName: "figure",
18 properties: {},
19 children: [
20 {
21 type: "element",
22 tagName: "img",
23 properties: props,
24 },
25 ],
26 };
29const options = {
30 handlers: {
31 image: Img,
32 },
33 entities: "numbers",
34};
36// Converts markdown strings into markdown HTML/React components
37export default async function Markdown({ post }) {
38 const result = await remark()
39 .use(html, options)
40 .use(gfm)
41 .use(remarkprism)
42 .use(slug)
43 .use(heading)
44 .process(post.content);
46 return result.toString();