diff --git a/docs/src/data/posts/commands.md b/docs/src/data/posts/commands.md index e6d808c9..38b48276 100644 --- a/docs/src/data/posts/commands.md +++ b/docs/src/data/posts/commands.md @@ -16,6 +16,10 @@ Insert a string of HTML at the currently selected position. Insert a string of text at the currently selected position. +## .removeMark() + +Remove a mark in the current selection. + ## .removeMarks() Remove all marks in the current selection. diff --git a/packages/core/src/Editor.ts b/packages/core/src/Editor.ts index 6ea4fe49..79b0373e 100644 --- a/packages/core/src/Editor.ts +++ b/packages/core/src/Editor.ts @@ -69,6 +69,7 @@ export class Editor extends EventEmitter { this.registerCommand('focus', require('./commands/focus').default) this.registerCommand('insertHTML', require('./commands/insertHTML').default) this.registerCommand('insertText', require('./commands/insertText').default) + this.registerCommand('removeMark', require('./commands/removeMark').default) this.registerCommand('removeMarks', require('./commands/removeMarks').default) this.registerCommand('selectAll', require('./commands/selectAll').default) this.registerCommand('selectParentNode', require('./commands/selectParentNode').default) diff --git a/packages/core/src/commands/removeMark.ts b/packages/core/src/commands/removeMark.ts new file mode 100644 index 00000000..d9a8a47a --- /dev/null +++ b/packages/core/src/commands/removeMark.ts @@ -0,0 +1,32 @@ +import { Editor } from '../Editor' +import { MarkType } from 'prosemirror-model' +import getMarkType from '../utils/getMarkType' +import getMarkRange from '../utils/getMarkRange' + +type RemoveMark = (type: string | MarkType) => any + +declare module '../Editor' { + interface Editor { + toggleMark: RemoveMark, + } +} + +export default (next: Function, editor: Editor): RemoveMark => typeOrName => { + const { view, state, schema } = editor + const { tr, selection } = state + const type = getMarkType(typeOrName, schema) + let { from, to, $from, empty } = selection + + if (empty) { + const range = getMarkRange($from, type) + + if (range) { + from = range.from + to = range.to + } + } + + tr.removeMark(from, to, type) + view.dispatch(tr) + next() +} diff --git a/packages/core/src/utils/getMarkRange.ts b/packages/core/src/utils/getMarkRange.ts new file mode 100644 index 00000000..8498a2de --- /dev/null +++ b/packages/core/src/utils/getMarkRange.ts @@ -0,0 +1,40 @@ +import { MarkType, ResolvedPos } from 'prosemirror-model' + +interface Range { + from: number, + to: number, +} + +export default function getMarkRange($pos: ResolvedPos, type: MarkType): Range | void { + if (!$pos || !type) { + return + } + + const start = $pos.parent.childAfter($pos.parentOffset) + + if (!start.node) { + return + } + + const link = start.node.marks.find(mark => mark.type === type) + if (!link) { + return + } + + let startIndex = $pos.index() + let startPos = $pos.start() + start.offset + let endIndex = startIndex + 1 + let endPos = startPos + start.node.nodeSize + + while (startIndex > 0 && link.isInSet($pos.parent.child(startIndex - 1).marks)) { + startIndex -= 1 + startPos -= $pos.parent.child(startIndex).nodeSize + } + + while (endIndex < $pos.parent.childCount && link.isInSet($pos.parent.child(endIndex).marks)) { + endPos += $pos.parent.child(endIndex).nodeSize + endIndex += 1 + } + + return { from: startPos, to: endPos } +}