How to avoid deleting a list item if it will be the last item in the list?

[CharlieBrownCharacter]

Hello everyone 👋

I have an app that has several blocks and one of these blocks is a list type. The list type can only contain list items inside it. I'm trying to check if when Backspace is pressed the list will be empty and deleting such block.

The pseudo-code that I'm looking for is:

• Detect Backspace was pressed
• Is the list empty (i.e. there's only one item in the list and this list item is empty)?
• If yes, then we delete the block

I was able to do such thing using extension's addKeyboardShortcuts:

// This editor can only contain ListItems and nothing more
Extension.create({
    addKeyboardShortcuts() {
        return {
            Backspace: ({ editor }) => {
                if (editor.isEmpty) {
                    deleteBlock({ block: props.block })
                    return true
                }

                return false
            },
        }
    },
}),

The problem is that the user can CTRL+A and then press Backspace, deleting everything. How can I detect this situation and ALWAYS leave at least one list item?

[guanriyue]

Using appendTransaction sounds like a viable solution. We shouldn't block the user's delete action, but when the user deletes the last list item, we can use appendTransaction to automatically reinsert a list with an empty list item. This way, it will appear as though the user only deleted the content of the last list item while keeping an empty list item in place.

https://prosemirror.net/docs/ref/#state.PluginSpec.appendTransaction

[DhaniAM]

You should set the parent content to have the node as a required. For example:

ParentNode.extend({
    content: "bullet_list other_not_required_node*"
})

notice you should use _ instead - because tiptap node content can't read -

[nperez0111]

What are you even talking about?