From ca5a60b7a28001106f0e7b52dca15fa17cdf384d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Mon, 2 Nov 2020 11:16:18 +0100
Subject: [PATCH] improve toggleList

---
 packages/core/src/extensions/index.ts      |  1 +
 packages/core/src/extensions/toggleList.ts | 16 ++++++++++++++-
 packages/core/src/extensions/wrapInList.ts | 23 ++++++++++++++++++++++
 3 files changed, 39 insertions(+), 1 deletion(-)
 create mode 100644 packages/core/src/extensions/wrapInList.ts

diff --git a/packages/core/src/extensions/index.ts b/packages/core/src/extensions/index.ts
index caaade84..453aa847 100644
--- a/packages/core/src/extensions/index.ts
+++ b/packages/core/src/extensions/index.ts
@@ -21,3 +21,4 @@ export { ToggleList } from './toggleList'
 export { ToggleMark } from './toggleMark'
 export { UpdateMark } from './updateMark'
 export { ToggleWrap } from './toggleWrap'
+export { WrapInList } from './wrapInList'
diff --git a/packages/core/src/extensions/toggleList.ts b/packages/core/src/extensions/toggleList.ts
index a0bc3288..b9ed6f1a 100644
--- a/packages/core/src/extensions/toggleList.ts
+++ b/packages/core/src/extensions/toggleList.ts
@@ -9,7 +9,9 @@ import isList from '../utils/isList'
 export const ToggleList = createExtension({
   addCommands() {
     return {
-      toggleList: (listTypeOrName: string | NodeType, itemTypeOrName: string | NodeType): Command => ({ tr, state, dispatch }) => {
+      toggleList: (listTypeOrName: string | NodeType, itemTypeOrName: string | NodeType): Command => ({
+        tr, state, dispatch, chain,
+      }) => {
         const { extensions } = this.editor.options
         const listType = getNodeType(listTypeOrName, state.schema)
         const itemType = getNodeType(itemTypeOrName, state.schema)
@@ -24,10 +26,12 @@ export const ToggleList = createExtension({
         const parentList = findParentNode(node => isList(node.type.name, extensions))(selection)
 
         if (range.depth >= 1 && parentList && range.depth - parentList.depth <= 1) {
+          // remove list
           if (parentList.node.type === listType) {
             return liftListItem(itemType)(state, dispatch)
           }
 
+          // change list type
           if (isList(parentList.node.type.name, extensions) && listType.validContent(parentList.node.content)) {
             tr.setNodeMarkup(parentList.pos, listType)
 
@@ -35,6 +39,16 @@ export const ToggleList = createExtension({
           }
         }
 
+        const canWrapInList = wrapInList(listType)(state)
+
+        // try to convert node to paragraph if needed
+        if (!canWrapInList) {
+          return chain()
+            .setBlockType('paragraph')
+            .wrapInList(listType)
+            .run()
+        }
+
         return wrapInList(listType)(state, dispatch)
       },
     }
diff --git a/packages/core/src/extensions/wrapInList.ts b/packages/core/src/extensions/wrapInList.ts
new file mode 100644
index 00000000..6cd8efbf
--- /dev/null
+++ b/packages/core/src/extensions/wrapInList.ts
@@ -0,0 +1,23 @@
+import { wrapInList } from 'prosemirror-schema-list'
+import { NodeType } from 'prosemirror-model'
+import { Command } from '../Editor'
+import { createExtension } from '../Extension'
+import getNodeType from '../utils/getNodeType'
+
+export const WrapInList = createExtension({
+  addCommands() {
+    return {
+      wrapInList: (typeOrName: string | NodeType, attrs?: {}): Command => ({ state, dispatch }) => {
+        const type = getNodeType(typeOrName, state.schema)
+
+        return wrapInList(type, attrs)(state, dispatch)
+      },
+    }
+  },
+})
+
+declare module '../Editor' {
+  interface AllExtensions {
+    WrapInList: typeof WrapInList,
+  }
+}