svelte: how to use event modifiers in my own components

I want to developt my own Button component and be able to handle event modifiers, like this:

<MyButton on:click|preventDefault={handler}>Click me</MyButton>

But I get the following error:

Event modifiers other than 'once' can only be used on DOM elementssvelte(invalid-event-modifier)

In MyButton I can pass the on:click event like this:

<button on:click|preventDefault><slot /></button>

But then I won't be able to use MyButton without the preventDefault

So another option would be to optionally pass event modifiers, to do something like this:

<MyButton preventDefault on:click={handler}>Click me</MyButton>

And then in MyButton.svelte to something like this (I know this doesn't work) to optionally apply the event modifier.

<script>  export let prevenDefault=false</script><button on:click|{preventDefault ? 'preventDefault' : ''}={handler}>Click me</MyButton>

Any idea about how to deal with it?