diff --git a/docs/src/demos/HandleExtensions/index.vue b/docs/src/demos/HandleExtensions/index.vue index f233722d..60534007 100644 --- a/docs/src/demos/HandleExtensions/index.vue +++ b/docs/src/demos/HandleExtensions/index.vue @@ -16,6 +16,12 @@ + + diff --git a/packages/core/src/Editor.ts b/packages/core/src/Editor.ts index 6c804217..bd27c186 100644 --- a/packages/core/src/Editor.ts +++ b/packages/core/src/Editor.ts @@ -71,6 +71,7 @@ export class Editor extends EventEmitter { this.registerCommand('setContent', require('./commands/setContent').default) this.registerCommand('clearContent', require('./commands/clearContent').default) this.registerCommand('removeMarks', require('./commands/removeMarks').default) + this.registerCommand('toggleBlockType', require('./commands/toggleBlockType').default) if (this.options.injectCSS) { require('./style.css') diff --git a/packages/core/src/commands/toggleBlockType.ts b/packages/core/src/commands/toggleBlockType.ts new file mode 100644 index 00000000..7181e2bc --- /dev/null +++ b/packages/core/src/commands/toggleBlockType.ts @@ -0,0 +1,30 @@ +import { NodeType } from 'prosemirror-model' +import { setBlockType } from 'prosemirror-commands' +import { Editor } from '../Editor' +import nodeIsActive from '../utils/nodeIsActive' + +declare module '../Editor' { + interface Editor { + toggleBlockType(type: NodeType, toggleType: NodeType, attrs?: {}): Editor, + } +} + +export default function toggleBlockType( + next: Function, + editor: Editor, + type: NodeType, + toggleType: NodeType, + attrs?: {}, +): void { + const { view, state } = editor + const isActive = nodeIsActive(state, type, attrs) + + if (isActive) { + setBlockType(toggleType)(view.state, view.dispatch) + next() + return + } + + setBlockType(type, attrs)(view.state, view.dispatch) + next() +} diff --git a/packages/extension-heading/index.ts b/packages/extension-heading/index.ts index ca5a663f..577af280 100644 --- a/packages/extension-heading/index.ts +++ b/packages/extension-heading/index.ts @@ -43,13 +43,13 @@ export default class Heading extends Node { } } - // commands(): CommandSpec { - // return { - // heading: (next, { view }) => { - // toggleBlockType(this.type)(view.state, view.dispatch) - // next() - // }, - // } - // } + commands(): CommandSpec { + return { + heading: (next, editor, attrs) => { + editor.toggleBlockType(this.type, editor.schema.nodes.paragraph, attrs) + next() + }, + } + } } \ No newline at end of file