DND with custom elements

[thiagoterleski]

Hello everyone 👋🏼

I am trying to replicate the example using dnd , but I can't get it working with custom elements; for example, I created a plugin to replace the current heading element (I want to have just one block type called heading with the level attr adjustable).

 {
    type: 'heading',
    attr: { level: 2 },
    children: [
      { text: 'Latest Report is ' },
      { text: 'from Spring 2022.', bold: true },
    ],
    id: 'BGQqn5AUZ23bIH8ZlEyyi',
  },

I tried also adding the new element key heading to withStyledDraggables function but it didn't solve the issue.

Is there anything I am missing? I will have to create other custom elements using react components to render different UI blocks in the application (Maps, Charts, etc...); I thought I only needed to add the new block keys to the withDraggables function, but apparently I am missing some steps.

Thanks for any help,