From 9af05ff44913d66ceab28370561879262643ec43 Mon Sep 17 00:00:00 2001
From: tristan <tristan@yuno.malio.fr>
Date: Mon, 4 May 2026 11:32:41 +0200
Subject: [PATCH] =?UTF-8?q?feat(front)=20:=20composant=20UiAccordion=20r?=
 =?UTF-8?q?=C3=A9utilisable?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 frontend/components/ui/UiAccordion.vue | 34 ++++++++++++++++++++++++++
 1 file changed, 34 insertions(+)
 create mode 100644 frontend/components/ui/UiAccordion.vue

diff --git a/frontend/components/ui/UiAccordion.vue b/frontend/components/ui/UiAccordion.vue
new file mode 100644
index 0000000..1a118bb
--- /dev/null
+++ b/frontend/components/ui/UiAccordion.vue
@@ -0,0 +1,34 @@
+<template>
+    <div class="overflow-hidden">
+        <button
+            type="button"
+            class="flex w-full items-center justify-between gap-4 bg-slate-100 px-4 py-3 text-sm font-semibold uppercase tracking-wide text-left"
+            @click="toggle"
+        >
+            <span class="flex-1">
+                <slot name="header" />
+            </span>
+            <Icon
+                name="mdi:chevron-down"
+                size="24"
+                class="shrink-0 transition-transform"
+                :class="{ 'rotate-180': modelValue }"
+            />
+        </button>
+        <div v-if="modelValue" class="border border-t-0 border-slate-200 px-6 py-6">
+            <slot />
+        </div>
+    </div>
+</template>
+
+<script setup lang="ts">
+const props = defineProps<{
+    modelValue: boolean
+}>()
+
+const emit = defineEmits<{
+    'update:modelValue': [value: boolean]
+}>()
+
+const toggle = () => emit('update:modelValue', !props.modelValue)
+</script>