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 ImageTag from './tag/ImageTag';
8import PreTag from './tag/PreTag';
9
10type Props = { markdown: string };
11const Content: React.FC<Props> = ({ markdown }: Props) => {
12 const processor = unified()
13 .use(parse)
14 .use(html)
15 .use(remark2react, {
16 remarkReactComponents: {
17 img: ImageTag,
18 pre: PreTag,
19 },
20 });
21
22 const contents: React.ReactNode = processor.processSync(markdown).contents;
23 return <>{contents}</>;
24};
25
26export default Content;