reiji-h 2 лет назад
Родитель
Сommit
e059cc41ba

+ 4 - 6
packages/presentation/src/components/GrowiSlides.tsx

@@ -2,21 +2,20 @@ import Head from 'next/head';
 import { ReactMarkdown } from 'react-markdown/lib/react-markdown';
 
 import type { PresentationOptions } from '../consts';
-import { MARP_CONTAINER_CLASS_NAME, presentationMarpit, slideMarpit } from '../services/growi-marpit';
+import { MARP_CONTAINER_CLASS_NAME, marpit } from '../services/growi-marpit';
 import * as extractSections from '../services/renderer/extract-sections';
 
-import { PresentationRichSlideSection, RichSlideSection } from './RichSlideSection';
+import { RichSlideSection } from './RichSlideSection';
 
 
 type Props = {
   options: PresentationOptions,
   children?: string,
-  presentation?: boolean,
 }
 
 export const GrowiSlides = (props: Props): JSX.Element => {
   const {
-    options, children, presentation,
+    options, children,
   } = props;
   const {
     rendererOptions, isDarkMode, disableSeparationByHeader,
@@ -33,9 +32,8 @@ export const GrowiSlides = (props: Props): JSX.Element => {
       disableSeparationByHeader,
     },
   ]);
-  rendererOptions.components.section = presentation ? PresentationRichSlideSection : RichSlideSection;
+  rendererOptions.components.section = RichSlideSection;
 
-  const marpit = presentation ? presentationMarpit : slideMarpit;
   const { css } = marpit.render('');
   return (
     <>

+ 2 - 4
packages/presentation/src/components/MarpSlides.tsx

@@ -1,16 +1,14 @@
 import Head from 'next/head';
 
-import { presentationMarpit, slideMarpit } from '../services/growi-marpit';
+import { marpit } from '../services/growi-marpit';
 
 type Props = {
   children?: string,
-  presentation?: boolean,
 }
 
 export const MarpSlides = (props: Props): JSX.Element => {
-  const { children, presentation } = props;
+  const { children } = props;
 
-  const marpit = presentation ? presentationMarpit : slideMarpit;
   const { html, css } = marpit.render(children ?? '');
   return (
     <>

+ 1 - 1
packages/presentation/src/components/Presentation.tsx

@@ -64,7 +64,7 @@ export const Presentation = (props: PresentationProps): JSX.Element => {
 
   return (
     <div className={`grw-presentation ${styles['grw-presentation']} reveal`}>
-      <Slides options={options} hasMarpFlag={hasMarpFlag} presentation>{children}</Slides>
+      <Slides options={options} hasMarpFlag={hasMarpFlag}>{children}</Slides>
     </div>
   );
 };

+ 3 - 25
packages/presentation/src/components/RichSlideSection.tsx

@@ -2,14 +2,13 @@ import React, { ReactNode } from 'react';
 
 type RichSlideSectionProps = {
   children: ReactNode,
-  presentation?: boolean,
 }
 
-const OriginalRichSlideSection = React.memo((props: RichSlideSectionProps): JSX.Element => {
-  const { children, presentation } = props;
+export const RichSlideSection = React.memo((props: RichSlideSectionProps): JSX.Element => {
+  const { children } = props;
 
   return (
-    <section className={presentation ? 'm-2' : 'shadow rounded m-2'}>
+    <section className="shadow rounded m-2">
       <svg data-marpit-svg="" viewBox="0 0 1280 720">
         <foreignObject width="1280" height="720">
           <section>
@@ -20,24 +19,3 @@ const OriginalRichSlideSection = React.memo((props: RichSlideSectionProps): JSX.
     </section>
   );
 });
-
-export const RichSlideSection = React.memo((props: RichSlideSectionProps): JSX.Element => {
-  const { children } = props;
-
-  return (
-    <OriginalRichSlideSection>
-      {children}
-    </OriginalRichSlideSection>
-  );
-});
-
-
-export const PresentationRichSlideSection = React.memo((props: RichSlideSectionProps): JSX.Element => {
-  const { children } = props;
-
-  return (
-    <OriginalRichSlideSection presentation>
-      {children}
-    </OriginalRichSlideSection>
-  );
-});

+ 3 - 4
packages/presentation/src/components/Slides.tsx

@@ -10,20 +10,19 @@ export type SlidesProps = {
   options: PresentationOptions,
   children?: string,
   hasMarpFlag?: boolean,
-  presentation?: boolean,
 }
 
 export const Slides = (props: SlidesProps): JSX.Element => {
   const {
-    options, children, hasMarpFlag, presentation,
+    options, children, hasMarpFlag,
   } = props;
 
   return (
     <div className={`${styles['slides-styles']}`}>
       {
         hasMarpFlag
-          ? <MarpSlides presentation={presentation}>{children}</MarpSlides>
-          : <GrowiSlides options={options} presentation={presentation}>{children}</GrowiSlides>
+          ? <MarpSlides>{children}</MarpSlides>
+          : <GrowiSlides options={options}>{children}</GrowiSlides>
       }
     </div>
   );

+ 15 - 24
packages/presentation/src/services/growi-marpit.ts

@@ -1,4 +1,4 @@
-import { Marp, MarpOptions } from '@marp-team/marp-core';
+import { Marp } from '@marp-team/marp-core';
 import { Element } from '@marp-team/marpit';
 
 export const MARP_CONTAINER_CLASS_NAME = 'marpit';
@@ -36,26 +36,17 @@ const lineNumber = (md) => {
   });
 };
 
-const marpitOption: MarpOptions = {
-  container: [
-    new Element('div', { class: `slides ${MARP_CONTAINER_CLASS_NAME}` }),
-  ],
-  inlineSVG: true,
-  emoji: undefined,
-  html: false,
-  math: false,
-};
-
-const slideMarpitOption = marpitOption;
-slideMarpitOption.slideContainer = (
-  [new Element('section', { class: 'shadow rounded m-2' })]
-);
-
-export const slideMarpit = new Marp(slideMarpitOption).use(lineNumber);
-
-const presentationMarpitOption = marpitOption;
-presentationMarpitOption.slideContainer = (
-  [new Element('section', { class: 'm-2' })]
-);
-
-export const presentationMarpit = new Marp(presentationMarpitOption);
+export const marpit = new Marp(
+  {
+    container: [
+      new Element('div', { class: `slides ${MARP_CONTAINER_CLASS_NAME}` }),
+    ],
+    slideContainer: [
+      new Element('section', { class: 'shadow rounded m-2' }),
+    ],
+    inlineSVG: true,
+    emoji: undefined,
+    html: false,
+    math: false,
+  },
+).use(lineNumber);