feat: add react wrapper

Author: pd4d10

packages/react/package.json

@@ -0,0 +1,23 @@
+{
+  "name": "@bytemd/react",
+  "version": "0.0.1",
+  "description": "Full-featured markdown editor and viewer",
+  "main": "dist/bytemd-react.cjs.js",
+  "module": "dist/bytemd-react.esm.js",
+  "keywords": [],
+  "files": [
+    "dist"
+  ],
+  "author": "Rongjian Zhang <pd4d10@gmail.com>",
+  "license": "MIT",
+  "dependencies": {
+    "@bytemd/core": "0.0.1"
+  },
+  "devDependencies": {
+    "@types/react": "^16.9.23",
+    "react": "^16.13.0"
+  },
+  "peerDependencies": {
+    "react": "^16.0.0"
+  }
+}

packages/react/src/index.js

@@ -0,0 +1,42 @@
+import { createElement, Component } from 'react';
+import * as bytemd from '@bytemd/core';
+
+export class Viewer extends Component {
+  constructor() {
+    this.container = null;
+    this.setContainer = e => {
+      this.container = e;
+    };
+  }
+  componentDidMount() {
+    new bytemd.Viewer({
+      target: this.container,
+      props: this.props
+    });
+  }
+  render() {
+    return createElement('div', {
+      ref: this.setContainer
+    });
+  }
+}
+
+export class Editor extends Component {
+  constructor() {
+    this.container = null;
+    this.setContainer = e => {
+      this.container = e;
+    };
+  }
+  componentDidMount() {
+    new bytemd.Editor({
+      target: this.container,
+      props: this.props
+    });
+  }
+  render() {
+    return createElement('div', {
+      ref: this.setContainer
+    });
+  }
+}

rollup.config.js

@@ -93,4 +93,24 @@ const core = {
   }
 };
 
-export default [core];
+const reactPkg = require('./packages/react/package.json');
+
+/** @type {import('rollup').RollupOptions} */
+const react = {
+  input: 'packages/react/src/index.js',
+  output: [
+    {
+      ...outputConfig,
+      format: 'es',
+      file: 'packages/react/' + reactPkg.module
+    },
+    {
+      ...outputConfig,
+      format: 'cjs',
+      file: 'packages/react/' + reactPkg.main
+    }
+  ],
+  plugins: [production && terser()]
+};
+
+export default [core, react];