1import React from 'react';
2import html from 'remark-html';
3import parse from 'remark-parse';
4import remark2react from 'remark-react';
5import unified from 'unified';
6
7import BlockQuoteTag from './BlockQuoteTag';
8import ImageTag from './ImageTag';
9import PreTag from './PreTag';
10
11type Props = { markdown: string };
12const Content: React.FC<Props> = ({ markdown }: Props) => {
13 const content = unified()
14 .use(parse)
15 .use(html)
16 .use(remark2react, {
17 remarkReactComponents: {
18 img: ImageTag,
19 pre: PreTag,
20 blockquote: BlockQuoteTag,
21 },
22 })
23 .processSync(markdown).result;
24
25 return <>{content}</>;
26};
27
28export default Content;