Subscript + Superscript extensions for Tiptap 2 (ported from Hans Pagel's extensions for v1)

Subscript.ts

import { Command, Mark, mergeAttributes } from '@tiptap/core'

export interface SubscriptExtensionOptions {
    HTMLAttributes: Object,
}

declare module '@tiptap/core' {
    interface Commands {
        subscript: {
            setSubscript: () => Command,
            toggleSubscript: () => Command,
            unsetSubscript: () => Command,
        }
    }
}

export const Subscript = Mark.create<SubscriptExtensionOptions>({
    name: 'subscript',

    defaultOptions: {
        HTMLAttributes: {},
    },

    parseHTML() {
        return [
            {
                tag: 'sub',
            },
            {
                style: 'vertical-align',
                getAttrs(value) {
                    // Don't match this rule if the vertical align isn't sub.
                    if (value !== 'sub') {
                        return false;
                    }

                    // If it falls through we'll match, and this mark will be applied.
                },
            },
        ]
    },

    renderHTML({ HTMLAttributes }) {
        return ['sub', mergeAttributes(this.options.HTMLAttributes, HTMLAttributes), 0]
    },

    addCommands() {
        return {
            setSubscript: () => ({ commands }) => {
                return commands.setMark('subscript')
            },
            toggleSubscript: () => ({ commands }) => {
                return commands.toggleMark('subscript')
            },
            unsetSubscript: () => ({ commands }) => {
                return commands.unsetMark('subscript')
            },
        }
    },
})

Superscript.ts

import { Command, Mark, mergeAttributes } from '@tiptap/core'

export interface SuperscriptExtensionOptions {
    HTMLAttributes: Object,
}

declare module '@tiptap/core' {
    interface Commands {
        superscript: {
            setSuperscript: () => Command,
            toggleSuperscript: () => Command,
            unsetSuperscript: () => Command,
        }
    }
}

export const Superscript = Mark.create<SuperscriptExtensionOptions>({
    name: 'superscript',

    defaultOptions: {
        HTMLAttributes: {},
    },

    parseHTML() {
        return [
            {
                tag: 'sup',
            },
            {
                style: 'vertical-align',
                getAttrs(value) {
                    // Don't match this rule if the vertical align isn't super.
                    if (value !== 'super') {
                        return false;
                    }

                    // If it falls through we'll match, and this mark will be applied.
                },
            },
        ]
    },

    renderHTML({ HTMLAttributes }) {
        return ['sup', mergeAttributes(this.options.HTMLAttributes, HTMLAttributes), 0]
    },

    addCommands() {
        return {
            setSuperscript: () => ({ commands }) => {
                return commands.setMark('superscript')
            },
            toggleSuperscript: () => ({ commands }) => {
                return commands.toggleMark('superscript')
            },
            unsetSuperscript: () => ({ commands }) => {
                return commands.unsetMark('superscript')
            },
        }
    },
})