Sections.tsx 920 B

123456789101112131415161718192021222324252627282930313233
  1. import React from 'react';
  2. // import { Marp } from '@marp-team/marp-core';
  3. import Head from 'next/head';
  4. import { ReactMarkdown } from 'react-markdown/lib/react-markdown';
  5. import type { ReactMarkdownOptions } from 'react-markdown/lib/react-markdown';
  6. import * as hrSplitter from '../services/renderer/hr-splitter';
  7. type SectionsProps = {
  8. rendererOptions: ReactMarkdownOptions,
  9. children?: string,
  10. }
  11. export const Sections = (props: SectionsProps): JSX.Element => {
  12. const { rendererOptions, children } = props;
  13. rendererOptions.remarkPlugins?.push(hrSplitter.remarkPlugin);
  14. // const marp = new Marp();
  15. // const { css } = marp.render('', { htmlAsArray: true });
  16. return (
  17. <>
  18. <Head>
  19. {/* <style>{css}</style> */}
  20. </Head>
  21. { children == null
  22. ? <section>No contents</section>
  23. : <ReactMarkdown {...rendererOptions}>{children}</ReactMarkdown>
  24. }
  25. </>
  26. );
  27. };