Copy and paste HTML as Markdown

list-editor/index.js

@@ -6,7 +6,8 @@ import textareaAutosizeInit from "./textarea.autosize"
 import createCursor from './cursor'
 import Store from './store'
 import Keymap from './keymap'
-import getCaretCoordinates from "../editor/src/caret-position";
+import getCaretCoordinates from "../editor/src/caret-position"
+import TurndownService from "turndown"
 
 textareaAutosizeInit($)
 
@@ -508,6 +509,34 @@ function editor(root, inputData, options) {
             return true
         }
 
+        if (event.originalEvent.clipboardData.types.includes("text/html")) {
+            let pastedData = event.originalEvent.clipboardData.getData('text/html')
+            const turndownService = new TurndownService({
+                headingStyle: 'atx',
+                codeBlockStyle: 'fenced',
+            })
+            const markdown = turndownService.turndown(pastedData)
+            let items = markdown.split(/\n+/);
+            console.log(items)
+            let item = $(this).parents('.list-item')
+            let id = item.attr('data-id')
+            const firstItem = store.value(id)
+            items = _.map(items, text => {
+                const m = text.match(/^(\s*)\*\s*(.*)$/)
+                if (m) {
+                    const item = newListItem(firstItem.indented+1+Math.trunc(m[1].length/4))
+                    item.text = m[2]
+                    return item
+                }
+                const item = newListItem(firstItem.indented)
+                item.text = text
+                return item
+            })
+            store.insertAfter(id, ...items)
+            trigger('change')
+            return false
+        }
+
         let pastedData = event.originalEvent.clipboardData.getData('text/plain')
         try {
             let items = JSON.parse(pastedData.toString());

list-editor/package-lock.json

@@ -53,6 +53,11 @@
       "resolved": "https://registry.npmjs.org/custom-event/-/custom-event-1.0.0.tgz",
       "integrity": "sha1-LkYovhncSyFLXAJjDFlx6BFhgGI="
     },
+    "domino": {
+      "version": "2.1.6",
+      "resolved": "https://registry.npmjs.org/domino/-/domino-2.1.6.tgz",
+      "integrity": "sha512-3VdM/SXBZX2omc9JF9nOPCtDaYQ67BGp5CoLpIQlO2KCAPETs8TcDHacF26jXadGbvUteZzRTeos2fhID5+ucQ=="
+    },
     "dragula": {
       "version": "3.7.2",
       "resolved": "https://registry.npmjs.org/dragula/-/dragula-3.7.2.tgz",
@@ -164,6 +169,14 @@
       "resolved": "https://registry.npmjs.org/ticky/-/ticky-1.0.1.tgz",
       "integrity": "sha1-t8+nHnaPHJAAxJe5FRswlHxQ5G0="
     },
+    "turndown": {
+      "version": "7.1.1",
+      "resolved": "https://registry.npmjs.org/turndown/-/turndown-7.1.1.tgz",
+      "integrity": "sha512-BEkXaWH7Wh7e9bd2QumhfAXk5g34+6QUmmWx+0q6ThaVOLuLUqsnkq35HQ5SBHSaxjSfSM7US5o4lhJNH7B9MA==",
+      "requires": {
+        "domino": "^2.1.6"
+      }
+    },
     "wrappy": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",

list-editor/package.json

@@ -4,7 +4,9 @@
   "description": "Simple editor of lists",
   "author": "Peter Stuifzand <peter@p83.nl>",
   "main": "index.js",
-  "sideEffects": ["**"],
+  "sideEffects": [
+    "**"
+  ],
   "scripts": {
     "test": "jasmine --require=esm"
   },
@@ -14,7 +16,8 @@
     "dragula": "^3.7.2",
     "he": "^1.2.0",
     "jquery": "^3.5.1",
-    "lodash": "^4.17.19"
+    "lodash": "^4.17.19",
+    "turndown": "^7.1.1"
   },
   "devDependencies": {
     "esm": "^3.2.25",