Merge 45e2919 into b946351

package.json

@@ -64,9 +64,12 @@
     "cookie-parser": "^1.4.3",
     "express": "^4.16.4",
     "express-session": "^1.15.6",
+    "mdast-util-to-hast": "^3.0.2",
     "portfinder": "^1.0.17",
     "react": "^16.5.2",
     "react-dom": "^16.5.2",
+    "remark": "^9.0.0",
+    "remark-react": "^4.0.3",
     "styled-components": "^3.4.10"
   }
 }

src/remark-react/__tests__/oneshot.test.tsx

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import * as OneShot from '../oneshot';
+
+
+test('React.MyComponent', () => {
+  const comp = React.createElement(OneShot.App);
+  expect(comp).toEqual(<OneShot.App />);
+});
+

src/remark-react/oneshot.tsx

@@ -0,0 +1,37 @@
+import * as React from "react";
+import * as remark from "remark";
+import reactRenderer from "remark-react";
+
+export interface AppState {
+  text: string;
+}
+
+export class App extends React.Component<{}, AppState> {
+  constructor(props: {}) {
+    super(props);
+    this.state = {
+      text: "# hello world"
+    };
+  }
+
+  onChange(e: React.ChangeEvent<HTMLTextAreaElement>): void {
+    this.setState({ text: e.target.value });
+  }
+
+  render() {
+    return (
+      <div>
+        <textarea value={this.state.text} onChange={this.onChange} />
+        <div id="preview">
+          {
+            // @ts-ignore
+            remark()
+              .use(reactRenderer)
+              .processSync(this.state.text).contents
+          }
+        </div>
+      </div>
+    );
+  }
+}
+

tsconfig.json

@@ -39,6 +39,12 @@
       "section-matter": [
         "./typings/section-matter/index.d.ts"
       ],
+      "remark": [
+        "./typings/remark/index.d.ts"
+      ],
+      "remark-react": [
+        "./typings/remark-react/index.d.ts"
+      ],
       "section-matter*": [
         "./typings/section-matter*"
       ]

typings/mdast-util-to-hast/index.d.ts

@@ -0,0 +1,5 @@
+export interface Options {
+  allowDangerousHTML: boolean
+  commonmark: boolean
+  handlers: Object
+}

typings/remark-react/index.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+
+export interface Options {
+  createElement?: Function
+  sanitize?: boolean
+  toHast?: {}
+  remarkReactComponents?: {}
+}
+
+declare function remarkReact(options: Options): any;
+
+export default remarkReact;

typings/remark/index.d.ts

@@ -0,0 +1,7 @@
+interface Parser {}
+interface Options {}
+
+
+declare function parse(options: Options): Parser;
+
+export default parse;