Slatejs reset element type after line-break

Question

I'm working with slatejs ,and I want to know :

If my current Element.type is title , looks like <h1></h1> ,
but when I click enter, it will create a new <h1> tag.

If I want the line-break after title type and the new element type will become default, what shoud I do ?

score 0 · Answer 1 · answered Feb 01 '22 at 07:01

Assuming your node looks something like: {children : [{text: ''}], type: 'title'} or something on the lines of this.

When you press enter, it adds an empty node like {children : [{text: ''}], type: 'title'}

You should be able to modify the insertBreak behaviour this way to modify the kind of node that it adds:

const { insertBreak } = editor

  editor.insertBreak = () => {
    const { selection } = editor

    if (selection) {
      const [title] = Editor.nodes(editor, {
        match: n =>
          !Editor.isEditor(n) &&
          Element.isElement(n) &&
          (n.type === 'title')
      })

      if(title){
        Transforms.insertNodes(editor, {
          children: [{text: ""}],
          type: 'default'
        })
        return
      }
    }
    insertBreak()
  }

Slatejs reset element type after line-break

1 Answers1