Merge pull request #317 from Chrissi2812/issue-4

toggle between unordered_list and ordered_list

packages/tiptap-commands/package.json

@@ -25,6 +25,7 @@
     "prosemirror-model": "^1.7.0",
     "prosemirror-schema-list": "^1.0.3",
     "prosemirror-state": "^1.2.3",
+    "prosemirror-utils": "^0.8.1",
     "tiptap-utils": "^1.5.2"
   }
 }

packages/tiptap-commands/src/commands/toggleList.js

@@ -1,49 +1,36 @@
-import { nodeIsActive } from 'tiptap-utils'
 import { wrapInList, liftListItem } from 'prosemirror-schema-list'
+import { findParentNode } from 'prosemirror-utils'
 
-export default function toggleList(type, itemType) {
+function isList(node, schema) {
+  return (node.type === schema.nodes.bullet_list
+      || node.type === schema.nodes.ordered_list
+      || node.type === schema.nodes.todo_list)
+}
+
+export default function toggleList(listType, itemType) {
   return (state, dispatch, view) => {
-    const isActive = nodeIsActive(state, type)
+    const { schema, selection } = state
+    const { $from, $to } = selection
+    const range = $from.blockRange($to)
+    if (!range) {
+      return false
+		}
 
-    if (isActive) {
+    const parentList = findParentNode(node => isList(node, schema))(selection)
+
+    if (range.depth >= 1 && parentList && range.depth - parentList.depth <= 1) {
+      if (parentList.node.type === listType) {
         return liftListItem(itemType)(state, dispatch, view)
       }
 
-    return wrapInList(type)(state, dispatch, view)
+      if (isList(parentList.node, schema) && listType.validContent(parentList.node.content)) {
+        const { tr } = state
+        tr.setNodeMarkup(parentList.pos, listType)
+        if (dispatch) dispatch(tr)
+        return false
       }
     }
 
-// https://discuss.prosemirror.net/t/list-type-toggle/948
-
-// import { wrapInList, liftListItem } from 'prosemirror-schema-list'
-
-// function isList(node, schema) {
-//   return (node.type === schema.nodes.bullet_list || node.type === schema.nodes.ordered_list)
-// }
-
-// export default function toggleList(listType, schema) {
-//   const lift = liftListItem(schema.nodes.list_item)
-// 	const wrap = wrapInList(listType)
-
-//   return (state, dispatch) => {
-//     const { $from, $to } = state.selection
-//     const range = $from.blockRange($to)
-//     if (!range) {
-//       return false
-// 		}
-
-//     if (range.depth >= 2 && $from.node(range.depth - 1).type === listType) {
-//       return lift(state, dispatch)
-//     } else if (range.depth >= 2 && isList($from.node(range.depth - 1), schema)) {
-//       const tr = state.tr
-// 			const node = $from.before(range.depth - 1)
-// 			console.log({node})
-//       // TODO: how do I pass the node above to `setNodeType`?
-//       // tr.setNodeType(range.start, listType);
-//       if (dispatch) dispatch(tr)
-//       return false
-//     } else {
-//       return wrap(state, dispatch)
-//     }
-//   }
-// }
+    return wrapInList(listType)(state, dispatch, view)
+  }
+}