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