Do not wrap custom block in an additional DIV but instead use only the JSX I provide

When registering new blocks, on front-end I get only the markup that I specify inside of save method. Cool! That’s what I need.
But when using the edit method I get my markup wrapped in a div. That’s not what I need, because it limits my possibilities of styling.

How can I get rid of that div and have it similar to what the current core/paragraph block does, for example, with the p tag?

Here is how I have it now:

and that’s how it should become:

For reference the code is simple like this:

edit: () => {
    return (
        <span className="sample-block">
            <mark>Sample</mark>
        </span>
    );
},
save: () => {
    return (
        <span className="sample-block">
            <mark>Sample</mark>
        </span>
    );
},