From 3b3d30cd0cc0366cdb7ff64a008773be55d71b2c Mon Sep 17 00:00:00 2001
From: pheralb <pablohdez4340@gmail.com>
Date: Tue, 16 Sep 2025 13:20:59 +0100
Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=A8=20Add=20collapsible=20UI=20compone?=
 =?UTF-8?q?nt?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ui/collapsible/collapsible-content.svelte    | 14 ++++++++++++++
 .../ui/collapsible/collapsible-trigger.svelte    | 14 ++++++++++++++
 src/components/ui/collapsible/collapsible.svelte | 16 ++++++++++++++++
 src/components/ui/collapsible/index.ts           | 13 +++++++++++++
 4 files changed, 57 insertions(+)
 create mode 100644 src/components/ui/collapsible/collapsible-content.svelte
 create mode 100644 src/components/ui/collapsible/collapsible-trigger.svelte
 create mode 100644 src/components/ui/collapsible/collapsible.svelte
 create mode 100644 src/components/ui/collapsible/index.ts

diff --git a/src/components/ui/collapsible/collapsible-content.svelte b/src/components/ui/collapsible/collapsible-content.svelte
new file mode 100644
index 0000000..6c9f34e
--- /dev/null
+++ b/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}
+/>
diff --git a/src/components/ui/collapsible/collapsible-trigger.svelte b/src/components/ui/collapsible/collapsible-trigger.svelte
new file mode 100644
index 0000000..ab2ce1f
--- /dev/null
+++ b/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}
+/>
diff --git a/src/components/ui/collapsible/collapsible.svelte b/src/components/ui/collapsible/collapsible.svelte
new file mode 100644
index 0000000..ac14155
--- /dev/null
+++ b/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}
+/>
diff --git a/src/components/ui/collapsible/index.ts b/src/components/ui/collapsible/index.ts
new file mode 100644
index 0000000..296a91b
--- /dev/null
+++ b/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,
+};