fix/clipboard: use docsSoap to prepare html from google doc

fix #365 [Editor] - Texts become bold when copy and paste from Google doc

References:
- facebookarchive/draft-js#393 (comment)
- [Superdesk CMS is using DraftJS](https://github.com/superdesk/superdesk-client-core/blob/develop/scripts/core/editor3/html/from-html/index.ts#L60) and internally calling docsSoap to resolve this
- slab/quill#2462 has some dirty fix with side effects
- ProseMirror/prosemirror#459 (comment) this fix mentioned ProseMirror/prosemirror-schema-basic@cbbdc1a691 in ProseMirror looks much cleaner

package.json

@@ -38,6 +38,7 @@
   "dependencies": {
     "autosize": "^4.0.2",
     "classnames": "^2.2.6",
+    "docs-soap": "^1.2.1",
     "react-quill": "^1.3.3"
   },
   "devDependencies": {

src/modules/clipboard.ts

@@ -1,5 +1,7 @@
 import { Quill } from 'react-quill'
 
+import { docsSoap } from 'docs-soap'
+
 import createImageMatcher from '../matchers/createImage'
 import { isSafari } from '../utils/browser'
 import { dom } from '../utils/dom'
@@ -46,7 +48,8 @@ class RemadeClipboard extends Clipboard {
     event.stopPropagation()
 
     const formats = this.quill.getFormat(this.quill.selection.savedRange.index)
-    const html = event.clipboardData.getData('text/html')
+    const htmlRaw = event.clipboardData.getData('text/html')
+    const html = docsSoap(htmlRaw) // Needed for Google docs
     const text = event.clipboardData.getData('text/plain')
 
     let delta = new Delta().retain(range.index)