diff --git a/examples/Components/Routes/DragHandle/DragItem.js b/examples/Components/Routes/DragHandle/DragItem.js new file mode 100644 index 00000000..66ed3c00 --- /dev/null +++ b/examples/Components/Routes/DragHandle/DragItem.js @@ -0,0 +1,32 @@ +import { Node } from 'tiptap' + +export default class DragItem extends Node { + + get name() { + return 'drag_item' + } + + get schema() { + return { + group: 'block', + draggable: true, + content: 'paragraph+', + toDOM: () => ['div', { 'data-type': this.name }, 0], + parseDOM: [{ + tag: `[data-type="${this.name}"]`, + }], + } + } + + get view() { + return { + template: ` +
+
+
+
+ `, + } + } + +} diff --git a/examples/Components/Routes/DragHandle/index.vue b/examples/Components/Routes/DragHandle/index.vue new file mode 100644 index 00000000..dbcaec96 --- /dev/null +++ b/examples/Components/Routes/DragHandle/index.vue @@ -0,0 +1,70 @@ + + + + + diff --git a/examples/Components/Subnavigation/index.vue b/examples/Components/Subnavigation/index.vue index f1a05f92..a4a77345 100644 --- a/examples/Components/Subnavigation/index.vue +++ b/examples/Components/Subnavigation/index.vue @@ -60,6 +60,9 @@ Trailing Paragraph + + Drag Handle + Export HTML or JSON diff --git a/examples/main.js b/examples/main.js index 8ee8e3e7..e873023f 100644 --- a/examples/main.js +++ b/examples/main.js @@ -151,6 +151,13 @@ const routes = [ githubUrl: 'https://github.com/scrumpy/tiptap/tree/master/examples/Components/Routes/TrailingParagraph', }, }, + { + path: '/drag-handle', + component: () => import('Components/Routes/DragHandle'), + meta: { + githubUrl: 'https://github.com/scrumpy/tiptap/tree/master/examples/Components/Routes/DragHandle', + }, + }, { path: '/export', component: () => import('Components/Routes/Export'), diff --git a/packages/tiptap-extensions/package.json b/packages/tiptap-extensions/package.json index 50182e68..a0e59a3f 100644 --- a/packages/tiptap-extensions/package.json +++ b/packages/tiptap-extensions/package.json @@ -1,6 +1,6 @@ { "name": "tiptap-extensions", - "version": "1.28.0", + "version": "1.28.1", "description": "Extensions for tiptap", "homepage": "https://tiptap.scrumpy.io", "license": "MIT", @@ -30,7 +30,7 @@ "prosemirror-transform": "^1.1.4", "prosemirror-utils": "^0.9.6", "prosemirror-view": "^1.11.4", - "tiptap": "^1.26.0", + "tiptap": "^1.26.1", "tiptap-commands": "^1.12.0" }, "peerDependencies": { diff --git a/packages/tiptap-extensions/src/nodes/Table.js b/packages/tiptap-extensions/src/nodes/Table.js index 90540757..fcc8d803 100644 --- a/packages/tiptap-extensions/src/nodes/Table.js +++ b/packages/tiptap-extensions/src/nodes/Table.js @@ -19,6 +19,7 @@ import { fixTables, } from 'prosemirror-tables' import { createTable } from 'prosemirror-utils' +import { TextSelection } from 'prosemirror-state' import TableNodes from './TableNodes' export default class Table extends Node { @@ -43,6 +44,11 @@ export default class Table extends Node { (state, dispatch) => { const nodes = createTable(schema, rowsCount, colsCount, withHeaderRow) const tr = state.tr.replaceSelectionWith(nodes).scrollIntoView() + + // get selection for first cell + const resolvedPos = tr.doc.resolve(tr.selection.anchor - nodes.content.size) + tr.setSelection(TextSelection.near(resolvedPos)) + dispatch(tr) } ), diff --git a/packages/tiptap/package.json b/packages/tiptap/package.json index b207978e..ab88ad7e 100644 --- a/packages/tiptap/package.json +++ b/packages/tiptap/package.json @@ -1,6 +1,6 @@ { "name": "tiptap", - "version": "1.26.0", + "version": "1.26.1", "description": "A rich-text editor for Vue.js", "homepage": "https://tiptap.scrumpy.io", "license": "MIT", diff --git a/packages/tiptap/src/Plugins/FloatingMenu.js b/packages/tiptap/src/Plugins/FloatingMenu.js index de3a04ed..0775b921 100644 --- a/packages/tiptap/src/Plugins/FloatingMenu.js +++ b/packages/tiptap/src/Plugins/FloatingMenu.js @@ -91,7 +91,10 @@ class Menu { } hide(event) { - if (event && event.relatedTarget) { + if (event + && event.relatedTarget + && this.options.element.parentNode.contains(event.relatedTarget) + ) { return } diff --git a/packages/tiptap/src/Plugins/MenuBubble.js b/packages/tiptap/src/Plugins/MenuBubble.js index 1e2f9e70..21f510f1 100644 --- a/packages/tiptap/src/Plugins/MenuBubble.js +++ b/packages/tiptap/src/Plugins/MenuBubble.js @@ -66,6 +66,7 @@ class Menu { this.isActive = false this.left = 0 this.bottom = 0 + this.top = 0 // the mousedown event is fired before blur so we can prevent it this.options.element.addEventListener('mousedown', this.handleClick) @@ -129,6 +130,7 @@ class Menu { this.left = Math.round(this.options.keepInBounds ? Math.min(box.width - (el.width / 2), Math.max(left, el.width / 2)) : left) this.bottom = Math.round(box.bottom - start.top) + this.top = Math.round(end.bottom - box.top) this.isActive = true this.sendUpdate() @@ -139,11 +141,15 @@ class Menu { isActive: this.isActive, left: this.left, bottom: this.bottom, + top: this.top, }) } hide(event) { - if (event && event.relatedTarget) { + if (event + && event.relatedTarget + && this.options.element.parentNode.contains(event.relatedTarget) + ) { return }