Decorations not accepts to be at any place inside the node else the hole

1

Like i say if there a block includes multiple child nodes that defines in a schema definition, the widget decoration can’t be at any place inside this block node else the hole.

For Example:

the code block here defines as a pre tag, inside it a code element

const codeSpec: NodeSpec = {
  content: 'text*',
  group: 'block',

  parseDOM: [{ tag: 'pre' }],

  toDOM: node => {
    return ['pre', { ...someAttrs }, ['code', 0]];
  },
};

The decoration can’t be at any position inside the code block else inside the hole, on this example the hole here inside the code element.

So the question is how to create a widget decoration inside the code block as a direct child like:

<pre>
    <code>Some code</code>

    <!-- Widget decoration -->
    <div class="codeBlockMenu-button"></div>
</pre>

but outside the hole

2

Yes, decorations can only appear at document positions, not between markup that belongs to a single node. That’s not something that’s going to change.

3

So to make it happen i must create a custom block definition for the code element on the schema, to make it a pre node content, so the decoration can add as a direct child of the pre element

4

Another thing @marijn please, is there a way here to make heading level 3 not accepts any marks, but level 4 accepts just link mark:

heading: {
  content: 'inline*',
  group: 'block',
  defining: true,
  attrs: { level: { default: 3, validate: value => [3, 4].includes(value) } },
  parseDOM: [
    { tag: 'h3', attrs: { level: 3 } },
    { tag: 'h4', attrs: { level: 4 } },
  ],
  toDOM: ({ attrs }) => ['h' + attrs.level, 0],
},
5

You’d have to make them different node types.

6

Thanks @marijn :+1: