How to always keep a codeBlock even if the user selects everything and then deletes?

[CharlieBrownCharacter]

Hello everyone 👋 I'm working on something cool that allows users to add different blocks to their workspace. The idea here is to allow people to add a code block and edit it.

I have the following two scenarios:

When the user presses Backspace I would like to delete the block

I managed to achieve this by checking editor.isEmpty and invoking a callback.

When teh user selects everything and presses backspace, it should erase all the content of the <pre><code> ... </code> </pre> but still not delete the block itself.

This is a bit trickier than I initially thought and I managed to keep the <pre><code> ... </code> </pre> but unfortunately a paragraph is being added:

import { Extension } from '@tiptap/core'
import { Plugin } from 'prosemirror-state'

export const ensureCodeBlockPresent = Extension.create({
    name: 'ensureCodeBlockPresent',

    priority: 2000,

    addProseMirrorPlugins() {
        return [
            new Plugin({
                appendTransaction: (transactions, oldState, newState) => {
                    // Check if any transaction caused the document to change
                    const docChanged = transactions.some((tr) => tr.docChanged)

                    if (!docChanged) {
                        return null
                    }

                    const { doc, tr } = newState
                    const { schema } = newState

                    // Check if the document is empty or doesn't have a code block
                    if (
                        doc.childCount === 0 ||
                        !doc.firstChild ||
                        doc.firstChild.type.name !== 'codeBlock'
                    ) {
                        // Append a new code block with a valid text node
                        const transaction = tr.insert(
                            0,
                            schema.nodes.codeBlock.create(
                                { language: 'javascript' },
                                schema.text('\n')
                            )
                        )

                        return transaction
                    }

                    return null // No need for additional changes
                },
            }),
        ]
    },
})

I think the issue is as follow:

1. User selects everything
2. Presses Backspace
3. An empty state is added to Prosemirror
4. Tiptap kicks in and adds a Paragraph to maintain validity of the document

Here are two screenshots to demonstrate the issue:

Before selecting everything and pressing Backspace

After selecting everything and pressing Backspace - notice the paragraph added

Is there any way I can allow the user to select everything, delete it and still keep the code block so that the user can write again the code block he wishes?

[CharlieBrownCharacter]

First of all, Merry Christmas 🎅

The idea here was to simply remove the support to Paragraph and the editor does not default to creating an empty paragraph anymore. Such an easy solution that I completely missed.