From e768dc24c811a43c67a7939e10653361bb65edff Mon Sep 17 00:00:00 2001 From: Chrissi2812 Date: Fri, 3 May 2019 10:31:27 +0200 Subject: [PATCH 1/6] fixes #232: Clicking toolbar TodoItem lifts TodoItem --- packages/tiptap-extensions/src/nodes/TodoList.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/tiptap-extensions/src/nodes/TodoList.js b/packages/tiptap-extensions/src/nodes/TodoList.js index 73c8c1545..d36543a7c 100644 --- a/packages/tiptap-extensions/src/nodes/TodoList.js +++ b/packages/tiptap-extensions/src/nodes/TodoList.js @@ -1,5 +1,5 @@ import { Node } from 'tiptap' -import { wrapInList, wrappingInputRule } from 'tiptap-commands' +import { toggleList, wrappingInputRule } from 'tiptap-commands' export default class TodoList extends Node { @@ -19,8 +19,8 @@ export default class TodoList extends Node { } } - commands({ type }) { - return () => wrapInList(type) + commands({ type, schema }) { + return () => toggleList(type, schema.nodes.todo_item) } inputRules({ type }) { From 16963175c75d0928e9af1f6af29092fe5a7558fa Mon Sep 17 00:00:00 2001 From: Chrissi2812 Date: Tue, 7 May 2019 13:14:00 +0200 Subject: [PATCH 2/6] fix TransformError: Inconsistent open depths on TodoItems --- packages/tiptap-extensions/src/nodes/TodoItem.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/tiptap-extensions/src/nodes/TodoItem.js b/packages/tiptap-extensions/src/nodes/TodoItem.js index fdbf6bdd9..3968bb72c 100644 --- a/packages/tiptap-extensions/src/nodes/TodoItem.js +++ b/packages/tiptap-extensions/src/nodes/TodoItem.js @@ -34,7 +34,7 @@ export default class TodoItem extends Node { }, }, draggable: true, - content: 'paragraph', + content: 'paragraph block*', toDOM: node => { const { done } = node.attrs From ff445f13aafe3946e1b8aedc1bf216f147b5cb98 Mon Sep 17 00:00:00 2001 From: Chrissi2812 Date: Tue, 7 May 2019 15:08:28 +0200 Subject: [PATCH 3/6] no nested blocks in TodoItem --- packages/tiptap-extensions/src/nodes/TodoItem.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/tiptap-extensions/src/nodes/TodoItem.js b/packages/tiptap-extensions/src/nodes/TodoItem.js index 3968bb72c..79be78c8b 100644 --- a/packages/tiptap-extensions/src/nodes/TodoItem.js +++ b/packages/tiptap-extensions/src/nodes/TodoItem.js @@ -34,7 +34,7 @@ export default class TodoItem extends Node { }, }, draggable: true, - content: 'paragraph block*', + content: 'paragraph*', toDOM: node => { const { done } = node.attrs From fc41ff36de38c20b838d08e300e6c4b8e108e7c2 Mon Sep 17 00:00:00 2001 From: Chrissi2812 Date: Wed, 8 May 2019 12:26:13 +0200 Subject: [PATCH 4/6] allow nested todo_lists via options on todo_item --- examples/Components/Routes/TodoList/index.vue | 23 ++++++++++++++----- .../tiptap-extensions/src/nodes/TodoItem.js | 13 ++++++++--- 2 files changed, 27 insertions(+), 9 deletions(-) diff --git a/examples/Components/Routes/TodoList/index.vue b/examples/Components/Routes/TodoList/index.vue index 0e92d41d4..360f2fb0d 100644 --- a/examples/Components/Routes/TodoList/index.vue +++ b/examples/Components/Routes/TodoList/index.vue @@ -69,7 +69,9 @@ export default { new CodeBlock(), new HardBreak(), new Heading({ levels: [1, 2, 3] }), - new TodoItem(), + new TodoItem({ + nested: true, + }), new TodoList(), new Bold(), new Code(), @@ -135,14 +137,23 @@ li[data-type="todo_item"] { .todo-content { flex: 1; + > p:last-of-type { + margin-bottom: 0; + } + > ul[data-type="todo_list"] { + margin: .5rem 0; + } } li[data-done="true"] { - text-decoration: line-through; -} - -li[data-done="true"] .todo-checkbox { - background-color: $color-black; + > .todo-content { + > p { + text-decoration: line-through; + } + } + > .todo-checkbox { + background-color: $color-black; + } } li[data-done="false"] { diff --git a/packages/tiptap-extensions/src/nodes/TodoItem.js b/packages/tiptap-extensions/src/nodes/TodoItem.js index 79be78c8b..2213d2a11 100644 --- a/packages/tiptap-extensions/src/nodes/TodoItem.js +++ b/packages/tiptap-extensions/src/nodes/TodoItem.js @@ -1,5 +1,5 @@ import { Node } from 'tiptap' -import { splitToDefaultListItem, liftListItem } from 'tiptap-commands' +import { sinkListItem, splitListItem, liftListItem } from 'tiptap-commands' export default class TodoItem extends Node { @@ -7,6 +7,12 @@ export default class TodoItem extends Node { return 'todo_item' } + get defaultOptions() { + return { + nested: false, + } + } + get view() { return { props: ['node', 'updateAttrs', 'editable'], @@ -34,7 +40,7 @@ export default class TodoItem extends Node { }, }, draggable: true, - content: 'paragraph*', + content: this.options.nested ? '(paragraph|todo_list)+' : 'paragraph+', toDOM: node => { const { done } = node.attrs @@ -60,7 +66,8 @@ export default class TodoItem extends Node { keys({ type }) { return { - Enter: splitToDefaultListItem(type), + Enter: splitListItem(type), + Tab: this.options.nested ? sinkListItem(type) : () => {}, 'Shift-Tab': liftListItem(type), } } From f81f07ad653118acd4d941dcca6bbebb25bf05cd Mon Sep 17 00:00:00 2001 From: Chrissi2812 Date: Wed, 8 May 2019 13:24:56 +0200 Subject: [PATCH 5/6] add missing import statements to splitToDefaultListItem --- packages/tiptap-commands/package.json | 1 + packages/tiptap-commands/src/commands/splitToDefaultListItem.js | 2 ++ 2 files changed, 3 insertions(+) diff --git a/packages/tiptap-commands/package.json b/packages/tiptap-commands/package.json index f0450a087..9fdf7488b 100644 --- a/packages/tiptap-commands/package.json +++ b/packages/tiptap-commands/package.json @@ -24,6 +24,7 @@ "prosemirror-inputrules": "^1.0.1", "prosemirror-schema-list": "^1.0.2", "prosemirror-state": "^1.2.2", + "prosemirror-model": "^1.7.0", "tiptap-utils": "^1.3.0" } } diff --git a/packages/tiptap-commands/src/commands/splitToDefaultListItem.js b/packages/tiptap-commands/src/commands/splitToDefaultListItem.js index 70cc6f641..b52d5b871 100644 --- a/packages/tiptap-commands/src/commands/splitToDefaultListItem.js +++ b/packages/tiptap-commands/src/commands/splitToDefaultListItem.js @@ -1,3 +1,5 @@ +import { Fragment, Slice } from 'prosemirror-model' + // this is a copy of canSplit // see https://github.com/ProseMirror/prosemirror-transform/blob/master/src/structure.js From 1332a24ad6db454b76650bdca6e1e6163ea96624 Mon Sep 17 00:00:00 2001 From: Chrissi2812 Date: Wed, 8 May 2019 13:27:08 +0200 Subject: [PATCH 6/6] use splitToDefaultListItem again in todo_item splitToDefaultListItem didn't worked before with nested todos because of a missing import statement --- packages/tiptap-extensions/src/nodes/TodoItem.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/tiptap-extensions/src/nodes/TodoItem.js b/packages/tiptap-extensions/src/nodes/TodoItem.js index 2213d2a11..cde441167 100644 --- a/packages/tiptap-extensions/src/nodes/TodoItem.js +++ b/packages/tiptap-extensions/src/nodes/TodoItem.js @@ -1,5 +1,5 @@ import { Node } from 'tiptap' -import { sinkListItem, splitListItem, liftListItem } from 'tiptap-commands' +import { sinkListItem, splitToDefaultListItem, liftListItem } from 'tiptap-commands' export default class TodoItem extends Node { @@ -66,7 +66,7 @@ export default class TodoItem extends Node { keys({ type }) { return { - Enter: splitListItem(type), + Enter: splitToDefaultListItem(type), Tab: this.options.nested ? sinkListItem(type) : () => {}, 'Shift-Tab': liftListItem(type), }