ui: refactor chips into ChipGroup component

src/lib/components/ui/chip-group/chip-group.svelte

@@ -0,0 +1,45 @@
+<script lang="ts" generics="T">
+    import { cn } from "$lib/utils";
+
+    type Item = {
+        label: string;
+        value: T;
+    };
+
+    let {
+        label,
+        items,
+        value = $bindable(),
+        type = "checkbox",
+        class: className,
+        ...rest
+    }: {
+        label?: string;
+        items: Item[];
+        value: any;
+        type?: "checkbox" | "radio";
+        class?: string;
+    } = $props();
+</script>
+
+<div class={cn("flex flex-col gap-2", className)}>
+    {#if label}
+        <span class="scn-label">{label}</span>
+    {/if}
+    <div class="chip-group" {...rest}>
+        {#each items as item}
+            <label class="chip">
+                {#if type === "checkbox"}
+                    <input
+                        type="checkbox"
+                        bind:group={value}
+                        value={item.value}
+                    />
+                {:else}
+                    <input type="radio" bind:group={value} value={item.value} />
+                {/if}
+                <span>{item.label}</span>
+            </label>
+        {/each}
+    </div>
+</div>