-
Notifications
You must be signed in to change notification settings - Fork 5
/
index.js
39 lines (37 loc) · 1007 Bytes
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
import React from "react";
import Embed from "react-runkit";
import scriptLoader from "react-async-script-loader";
const Code = scriptLoader("https://embed.runkit.com")(
({ isScriptLoaded, ...rest }) =>
isScriptLoaded ? (
<Embed style={{ width: "100vw" }} nodeVersion="10" {...rest} />
) : (
<h3>Loading</h3>
)
);
export default ({ children }) => {
const [pre, code] = React.Children.toArray(children);
let title;
let component;
if (code) {
const [preamble, source] = [pre, code].map(
c => c.props.children.props.children
);
title = code.props.children.props.metastring;
component = <Code source={source} preamble={preamble} title={title} />;
} else {
const source = pre.props.children.props.children;
title = pre.props.children.props.metastring;
component = <Code source={source} title={title} />;
}
return (
<div
style={{
width: "80vw"
}}
>
<h2>{title}</h2>
{component}
</div>
);
};