diff --git a/package.json b/package.json index 722ff3d4..2865ad87 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@matters/matters-editor", - "version": "0.2.0-alpha.50", + "version": "0.2.0-alpha.51", "description": "Editor for matters.news", "author": "https://github.com/thematters", "homepage": "https://github.com/thematters/matters-editor", diff --git a/src/editors/extensions/horizontalRule.ts b/src/editors/extensions/horizontalRule.ts new file mode 100644 index 00000000..2f923634 --- /dev/null +++ b/src/editors/extensions/horizontalRule.ts @@ -0,0 +1,63 @@ +import { mergeAttributes, Node, nodeInputRule } from '@tiptap/core' +import { TextSelection } from '@tiptap/pm/state' + +export interface HorizontalRuleOptions { + HTMLAttributes: Record +} + +declare module '@tiptap/core' { + interface Commands { + horizontalRule: { + /** + * Add a horizontal rule + */ + setHorizontalRule: () => ReturnType + } + } +} + +export const HorizontalRule = Node.create({ + 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 }, + { + type: 'paragraph', + }, + ]) + .run() + }, + } + }, + + addInputRules() { + return [ + nodeInputRule({ + find: /^(?:---|—-|___\s|\*\*\*\s)$/, + type: this.type, + }), + ] + }, +}) diff --git a/src/editors/extensions/index.ts b/src/editors/extensions/index.ts index 1eb693b9..01b21686 100644 --- a/src/editors/extensions/index.ts +++ b/src/editors/extensions/index.ts @@ -7,7 +7,6 @@ import Gapcursor from '@tiptap/extension-gapcursor' import HardBreak from '@tiptap/extension-hard-break' import Heading from '@tiptap/extension-heading' import History from '@tiptap/extension-history' -import HorizontalRule from '@tiptap/extension-horizontal-rule' import ListItem from '@tiptap/extension-list-item' import OrderedList from '@tiptap/extension-ordered-list' import Paragraph from '@tiptap/extension-paragraph' @@ -21,11 +20,13 @@ import { FigureImage } from './figureImage' import { Link } from './link' import { Mention, MentionSuggestion } from './mention' import { Bold } from './bold' +import { HorizontalRule } from './horizontalRule' export * from './figureAudio' export * from './figureEmbed' export * from './figureImage' export * from './link' +export * from './horizontalRule' export * from './mention' export * from './bold'