improve rte pasting

src/components/Widgets/Markdown/MarkdownControl/RawEditor/index.js

@@ -83,7 +83,12 @@ export default class RawEditor extends React.Component {
     super(props);
     const plugins = registry.getEditorComponents();
     this.state = {
-      value: this.props.value,
+      value: unified()
+        .use(htmlToRehype, rehypeParseConfig)
+        .use(rehypeToRemark)
+        .use(remarkToMarkdown, remarkStringifyConfig)
+        .processSync(this.props.value)
+        .contents,
       plugins,
     };
     this.shortcuts = {
@@ -97,13 +102,6 @@ export default class RawEditor extends React.Component {
   componentDidMount() {
     this.updateHeight();
     this.element.addEventListener('paste', this.handlePaste, false);
-    const markdown = unified()
-      .use(htmlToRehype, rehypeParseConfig)
-      .use(rehypeToRemark)
-      .use(remarkToMarkdown, remarkStringifyConfig)
-      .processSync(this.state.value)
-      .contents;
-    this.setState({ value: markdown });
   }
 
   componentDidUpdate() {

src/components/Widgets/Markdown/MarkdownControl/VisualEditor/index.js

@@ -247,6 +247,14 @@ export default class Editor extends Component {
     };
   }
 
+  handlePaste = (e, data, state) => {
+    if (data.type !== 'html' || data.isShift) {
+      return;
+    }
+    const fragment = serializer.deserialize(data.html).document;
+    return state.transform().insertFragment(fragment).apply();
+  }
+
   handleDocumentChange = (doc, editorState) => {
     const html = serializer.serialize(editorState);
     this.props.onChange(html);
@@ -445,6 +453,7 @@ export default class Editor extends Component {
         onChange={editorState => this.setState({ editorState })}
         onDocumentChange={this.handleDocumentChange}
         onKeyDown={this.onKeyDown}
+        onPaste={this.handlePaste}
         ref={ref => this.ref = ref}
         spellCheck
       />

src/components/Widgets/Markdown/unifiedConfig.js

@@ -1,4 +1,4 @@
-export const remarkParseConfig = { pedantic: true, footnotes: true, fences: true };
-export const remarkStringifyConfig = { pedantic: true, fences: true };
+export const remarkParseConfig = { fences: true };
+export const remarkStringifyConfig = { fences: true };
 export const rehypeParseConfig = { fragment: true };
 export const rehypeStringifyConfig = {};