[@svelteui/core]: add Chip and ChipGroup components

[mrbrianevans]

Stubbed first draft of components. Not ready yet. Mostly copied from other components like Checkbox and also Mantine. Not tested.

[mrbrianevans]

Closes #206

[BeeMargarida]

Thank you so much for this contribution!!
The code looks good, just some comments regarding the style of the components. All the things I mentioned we do not have documented, so most is just nitpicking about the standards we use

[mrbrianevans]

Thanks very much for the guidance and feedback on the PR @BeeMargarida . I will have a look at it.

[mrbrianevans]

Okay @BeeMargarida , I have implemented your feedback. I think all the colors and themes use the functions instead of hard coding, but let me know if I missed any.

I've also added a storybook story, so you can test them. Let me know what you think, and any improvements that need to be made.

Thanks, Brian

[BeeMargarida]

Sorry for the delay, I'll take a look today, thank you!

[mrbrianevans]

Okay thanks. The ChipGroup is not ready yet, so just review the Chip itself.

[BeeMargarida]

Thank you so much for your effort 🙌, this is a big contribution. I only added some small notes. Also pinging @Brisklemonade to later merge this

[BeeMargarida]

To remove, or missing feature?

[mrbrianevans]

There is an issue with having a dynamic type of input while binding to the value of the input. Need to check how this is done else where (if its done elsewhere). Are you aware of any other components that have a dynamic input type?

What this is supposed to allow is to be able to choose between only allowing a single chip in a group to be selected (type radio buttons), or allowing multiple to be selected (type checkboxes).

[BeeMargarida]

Hum, we currently don't have that behaviour. Can you please tell me what issue are you having?

[mrbrianevans]

Minimal reproducable example:

<script>
let type = 'checkbox'
let checked = false
</script>

<input bind:type bind:value />

Gives this error:

'checked' binding can only be used with <input type="checkbox">

So I don't think the input type can be dynamically changed between checkbox and radio. I think it should always be of type checkbox and then we just implement logic to allow or deny selecting multiple at the same time in a ChipGroup. Does that sound reasonable to you?

[BeeMargarida]

We can go with that, another possibility is having two inputs with a conditional logic, since its only two, so it does not get out of hand. Would that also work?

{#if type === 'radio'}
 <input type="radio" bind:value />
{:else if type === 'checkbox'}
  <input type="checkbox" bind:value />
{/if}

[mrbrianevans]

Okay @BeeMargarida , I've made the changes you requested. Please re-review. The darkmode is looking correct now. Still need help with a few of the points, see comments on your review. Thanks.

[mrbrianevans]

Okay I've made a Story for testing the ChipGroup and it seems good to me. Please can you review it.

[BeeMargarida]

Just a small thing, the rest is 👌 and the stories are really complete, thank you!

[BeeMargarida]

Thank you @mrbrianevans for your contribution 🙌