tiptapify/src/extensions/slash-commands.ts

Tiptap3 editor with Vuetify3 menu implementation

import { Extension } from '@tiptap/core'
import Suggestion from '@tiptap/suggestion'

export default Extension.create(
  {
    name: 'slash-commands',

    addOptions() {
      return {
        suggestion: {
          char: '/',
          command: ({editor, range, props}) => {
            props.command({editor, range})
          },
        },
      }
    },

    addProseMirrorPlugins() {
      return [
        Suggestion(
          {
            editor: this.editor,
            ...this.options.suggestion,
          }),
      ]
    },
  })