From fabb6124cf6c21287ec6012d57bf884df4b26bb3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= Date: Tue, 13 Aug 2019 15:07:36 +0200 Subject: [PATCH] add setSelection method --- examples/Components/Routes/Links/index.vue | 1 - packages/tiptap/src/Editor.js | 56 +++++++++++++++------- packages/tiptap/src/Utils/index.js | 1 + packages/tiptap/src/Utils/minMax.js | 3 ++ 4 files changed, 43 insertions(+), 18 deletions(-) create mode 100644 packages/tiptap/src/Utils/minMax.js diff --git a/examples/Components/Routes/Links/index.vue b/examples/Components/Routes/Links/index.vue index 2f5d342d..bcd43d1b 100644 --- a/examples/Components/Routes/Links/index.vue +++ b/examples/Components/Routes/Links/index.vue @@ -105,7 +105,6 @@ export default { setLinkUrl(command, url) { command({ href: url }) this.hideLinkMenu() - this.editor.focus() }, }, } diff --git a/packages/tiptap/src/Editor.js b/packages/tiptap/src/Editor.js index dfcf28f2..33c22be5 100644 --- a/packages/tiptap/src/Editor.js +++ b/packages/tiptap/src/Editor.js @@ -18,6 +18,7 @@ import { Emitter, ExtensionManager, ComponentView, + minMax, } from './Utils' import { Doc, Paragraph, Text } from './Nodes' import css from './style.css' @@ -358,32 +359,53 @@ export default class Editor extends Emitter { }) } + resolveSelection(position = null) { + if (this.selection && position === null) { + return this.selection + } + + if (position === 'start') { + return { + from: 0, + to: 0, + } + } + + if (position === 'end') { + const { doc } = this.state + return { + from: doc.content.size, + to: doc.content.size, + } + } + + return { + from: position, + to: position, + } + } + focus(position = null) { if ((this.view.focused && position === null) || position === false) { return } - let pos = position - - if (this.selection && position === null) { - pos = this.selection.from - } else if (position === 'start') { - pos = 0 - } else if (position === 'end') { - pos = this.state.doc.nodeSize - 2 - } - - // selection should be inside of the document range - pos = Math.max(0, pos) - pos = Math.min(this.state.doc.content.size, pos) - - const selection = TextSelection.near(this.state.doc.resolve(pos)) - const transaction = this.state.tr.setSelection(selection) - this.view.dispatch(transaction) + const { from, to } = this.resolveSelection(position) + this.setSelection(from, to) setTimeout(() => this.view.focus(), 10) } + setSelection(from = 0, to = 0) { + const { doc, tr } = this.state + const resolvedFrom = minMax(from, 0, doc.content.size) + const resolvedEnd = minMax(to, 0, doc.content.size) + const selection = TextSelection.create(doc, resolvedFrom, resolvedEnd) + const transaction = tr.setSelection(selection) + + this.view.dispatch(transaction) + } + blur() { this.view.dom.blur() } diff --git a/packages/tiptap/src/Utils/index.js b/packages/tiptap/src/Utils/index.js index 56e2c697..8fef8f6f 100644 --- a/packages/tiptap/src/Utils/index.js +++ b/packages/tiptap/src/Utils/index.js @@ -5,4 +5,5 @@ export { default as Extension } from './Extension' export { default as ExtensionManager } from './ExtensionManager' export { default as injectCSS } from './injectCSS' export { default as Mark } from './Mark' +export { default as minMax } from './minMax' export { default as Node } from './Node' diff --git a/packages/tiptap/src/Utils/minMax.js b/packages/tiptap/src/Utils/minMax.js new file mode 100644 index 00000000..be94a12f --- /dev/null +++ b/packages/tiptap/src/Utils/minMax.js @@ -0,0 +1,3 @@ +export default function minMax(value = 0, min = 0, max = 0) { + return Math.min(Math.max(parseInt(value, 10), min), max) +}