TinyMCE : p tags within divs with customized style formats

I’m using TinyMCE Editor and I’m trying to edit the style_formats. I added my own headings :

//...
{ title: 'Headings', items: [
                { title: 'Titre principal', block: 'div', classes: ['title'], wrapper: true },
                { title: 'Titre alternatif', block: 'div', classes: ['title-alt'], wrapper: true },
                { title: 'Titre alternatif (gris)', block: 'div', classes: ['title-alt', 'grey'], wrapper: true },
                { title: 'Titre informatif', block: 'div', classes: ['title-alt', 'infos'], wrapper: true },
                { title: 'Sous-titre', block: 'div', classes: 'subtitle', wrapper: true },
                { title: 'Petit titre', block: 'div', styles: { color: 'var(--violet)', fontFamily: 'var(--playfair)', fontWeight: 'bold' }, wrapper: true }
]},
//...

But it’s not working like intended. When I click on them, it does this :

<div class="title">
<p>
Text goes here
</p>
</div>

Which isn’t what I’m expecting. I’m expecting this output :

<div class="title">
Text goes here
</div>

Without the p tags.

It worked well before, with the headings that comes with tinyMCE, which are h1, h2, h3,… Is there an additional option I’m missing in my items ?

Also, I tried things like :

valid_children : '-div[p]'

But it just doesn’t work at all : when I click on one of the headings, it just does nothing. I can’t add any div with this filter.

I also tried to specify a custom format for those titles, but when I click on them, they just replace every div before them. Like, if I have this :

<div class="cadre-admin">
<p>
Text goes here
</p>
</div>

It becomes this when I select a title :

<div class="title">
Text goes here
</div>

Can someone help, please ?
Thank you so much.