aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--src/lib/Markdown/Markdown.tsx30
1 files changed, 28 insertions, 2 deletions
diff --git a/src/lib/Markdown/Markdown.tsx b/src/lib/Markdown/Markdown.tsx
index 332d08c..8d93437 100644
--- a/src/lib/Markdown/Markdown.tsx
+++ b/src/lib/Markdown/Markdown.tsx
@@ -18,9 +18,35 @@ const header = (level: number): string => {
return `^#{${level}} .*$`;
}
+const CodeBlock: React.FC<{ rawLines: String[]}> = ({ rawLines }) => {
+ return (
+ <p style={{background: '#444444'}}>
+ {rawLines.map(line => <> {line} <br/> </>)}
+ </p>
+ );
+}
+
+
const Content: React.FC<RawLinesPropType> = ({ rawLines }) => {
- const plainText = rawLines.map(line => <p> {line} </p>);
- return <p> {plainText} </p>;
+ if (!rawLines.length) return <></>;
+ const line = rawLines[0];
+ const otherLines = rawLines.slice(1);
+ if (line.slice(0, 3) === '```') {
+ const closeIndex = otherLines.findIndex(line => line.slice(0, 3) === '```');
+ console.log({ line, otherLines, closeIndex });
+ return (
+ <>
+ <CodeBlock rawLines={otherLines.slice(0, closeIndex)} />
+ <Content rawLines={otherLines.slice(closeIndex + 1)} />
+ </>
+ )
+ }
+ return (
+ <>
+ <p> {line} </p>
+ <Content rawLines={rawLines.slice(1)} />
+ </>
+ )
}
const Level: React.FC<RawLinesPropType> = ({ rawLines, level = 0 }) => {