I’m making a custom block to insert video. I’ve added some styling options with the BorderControl component.

Options selected with the component are applied by default to the block in the editor without applying useBlockProps:

return (
    <></>
);

See video capture:

That is, I haven’t needed to use …useBlockProps. Gutenberg seems to apply those attributes automatically to the root element.

If I try to apply useBlockProps to an element of my choice, I get a duplicate of the attributes. One on the element it is applied on by default and one on the chosen element. I am applying useBlockProps like this.

return (
    <div {...useBlockProps()}></div>
);

See video capture:

Default attributes are always rendered and I can’t customize their location. Is it possible to remove the default rendering of BlockProps and use my own customization?