🎨 Add collapsible UI component

src/components/ui/collapsible/collapsible-content.svelte

@@ -0,0 +1,14 @@
+<script lang="ts">
+  import { Collapsible as CollapsiblePrimitive } from "bits-ui";
+
+  let {
+    ref = $bindable(null),
+    ...restProps
+  }: CollapsiblePrimitive.ContentProps = $props();
+</script>
+
+<CollapsiblePrimitive.Content
+  bind:ref
+  data-slot="collapsible-content"
+  {...restProps}
+/>

src/components/ui/collapsible/collapsible-trigger.svelte

@@ -0,0 +1,14 @@
+<script lang="ts">
+  import { Collapsible as CollapsiblePrimitive } from "bits-ui";
+
+  let {
+    ref = $bindable(null),
+    ...restProps
+  }: CollapsiblePrimitive.TriggerProps = $props();
+</script>
+
+<CollapsiblePrimitive.Trigger
+  bind:ref
+  data-slot="collapsible-trigger"
+  {...restProps}
+/>

src/components/ui/collapsible/collapsible.svelte

@@ -0,0 +1,16 @@
+<script lang="ts">
+  import { Collapsible as CollapsiblePrimitive } from "bits-ui";
+
+  let {
+    ref = $bindable(null),
+    open = $bindable(false),
+    ...restProps
+  }: CollapsiblePrimitive.RootProps = $props();
+</script>
+
+<CollapsiblePrimitive.Root
+  bind:ref
+  bind:open
+  data-slot="collapsible"
+  {...restProps}
+/>

src/components/ui/collapsible/index.ts

@@ -0,0 +1,13 @@
+import Root from "./collapsible.svelte";
+import Trigger from "./collapsible-trigger.svelte";
+import Content from "./collapsible-content.svelte";
+
+export {
+  Root,
+  Content,
+  Trigger,
+  //
+  Root as Collapsible,
+  Content as CollapsibleContent,
+  Trigger as CollapsibleTrigger,
+};