Files
tiptap/packages/extension-horizontal-rule/src/horizontal-rule.ts
Philipp Kühn 8fc915cade fix: Improve behavior when using insertContent (#2147)
* check if we can replace the wrapping node by the newly inserted content
    /

* we dont need this anymore

* set selection to inserted content instead of below

* improve hr cursor behavior
2021-11-08 20:37:12 +01:00

87 lines
1.9 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import {
Node,
nodeInputRule,
mergeAttributes,
} from '@tiptap/core'
import { TextSelection } from 'prosemirror-state'
export interface HorizontalRuleOptions {
HTMLAttributes: Record<string, any>,
}
declare module '@tiptap/core' {
interface Commands<ReturnType> {
horizontalRule: {
/**
* Add a horizontal rule
*/
setHorizontalRule: () => ReturnType,
}
}
}
export const HorizontalRule = Node.create<HorizontalRuleOptions>({
name: 'horizontalRule',
addOptions() {
return {
HTMLAttributes: {},
}
},
group: 'block',
parseHTML() {
return [
{ tag: 'hr' },
]
},
renderHTML({ HTMLAttributes }) {
return ['hr', mergeAttributes(this.options.HTMLAttributes, HTMLAttributes)]
},
addCommands() {
return {
setHorizontalRule: () => ({ chain }) => {
return chain()
.insertContent({ type: this.name })
// set cursor after horizontal rule
.command(({ tr, dispatch }) => {
if (dispatch) {
const { parent, pos } = tr.selection.$from
const posAfter = pos + 1
const nodeAfter = tr.doc.nodeAt(posAfter)
if (nodeAfter) {
tr.setSelection(TextSelection.create(tr.doc, posAfter))
} else {
// add node after horizontal rule if its the end of the document
const node = parent.type.contentMatch.defaultType?.create()
if (node) {
tr.insert(posAfter, node)
tr.setSelection(TextSelection.create(tr.doc, posAfter))
}
}
tr.scrollIntoView()
}
return true
})
.run()
},
}
},
addInputRules() {
return [
nodeInputRule({
find: /^(?:---|—-|___\s|\*\*\*\s)$/,
type: this.type,
}),
]
},
})