When using class props built in classes has higher priority

[stepanorda]

When I am styling something with the tailwind, a lot of built-in CSS has higher priority and I am not being able to tweak it properly.
I see 2 solutions:

1. When you select custom classes default ones are not applied
2. Add a prop to remove default classes

I can create a PR if you agree that this is a future you want to have.

[stepanorda]

Or at the very least, default classes should come first, that will also partially solve the problem.

[janosh]

@stepanorda This has come up multiple times already. If you take a look at the code, default classes already come first. E.g.

svelte-multiselect/src/lib/MultiSelect.svelte

Line 467 in a24075f

class="multiselect {outerDivClass}"

Have a look at #140 for why this is not enough. Not sure if the situation changed in Svelte v4. If not, it might in Svelte v5. If you'd like to investigate that, please do!

I see no problem with a prop to remove default classes. Happy to take a PR.

[janosh]

Also related: #44

[stepanorda]

@janosh How about changing it to something like:

export let outerDivClass = "multiselect" 
class={outerDivClass} 

that way if you set it, it will not apply the default class.

[janosh]

That might result in unexpected behavior. Some might want to keep the default styles and only make slight changes. This will drop all default styles as soon as you make a tweak.

[stepanorda]

So one global switch headlessMode that disables all default classes are fine by you? I can make PR for that.

[janosh]

Please do! Make sure we have test coverage for it and it doesn't affect current behavior if headlessMode={false}.