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