docs(accordion): mise à jour CHANGELOG et COMPONENTS [#MUI-37]
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -34,6 +34,7 @@ Liste des évolutions de la librairie Malio layer UI
|
|||||||
* [#MUI-33] Développer le composant Datepicker
|
* [#MUI-33] Développer le composant Datepicker
|
||||||
* [#MUI-33] Création du composant DateTime (date + heure, sélecteur d'heure natif intérimaire)
|
* [#MUI-33] Création du composant DateTime (date + heure, sélecteur d'heure natif intérimaire)
|
||||||
* [#MUI-36] Création d'un composant modal (dialogue centré, focus-trap, scroll-lock, footer fixe)
|
* [#MUI-36] Création d'un composant modal (dialogue centré, focus-trap, scroll-lock, footer fixe)
|
||||||
|
* [#MUI-37] Création d'un composant accordéon
|
||||||
|
|
||||||
### Changed
|
### Changed
|
||||||
* [#MUI-35] Refonte du composant drawer : slots `#header`/`#footer`, prop `side` (droite/gauche), `dismissable`, `closeOnEscape`, classes d'override, focus-trap, scroll-lock et fermeture au clavier. **Breaking** : la prop `title` est remplacée par le slot `#header`.
|
* [#MUI-35] Refonte du composant drawer : slots `#header`/`#footer`, prop `side` (droite/gauche), `dismissable`, `closeOnEscape`, classes d'override, focus-trap, scroll-lock et fermeture au clavier. **Breaking** : la prop `title` est remplacée par le slot `#header`.
|
||||||
|
|||||||
@@ -694,6 +694,54 @@ const tabs = computed(() => [
|
|||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
|
## MalioAccordion
|
||||||
|
|
||||||
|
Accordéon compositionnel : `<MalioAccordion>` enveloppe des `<MalioAccordionItem>`. Plusieurs panneaux ouverts (`multiple`, défaut) ou un seul (`single`). Pensé pour les filtres en drawer et les FAQ.
|
||||||
|
|
||||||
|
### MalioAccordion
|
||||||
|
|
||||||
|
| Prop | Type | Défaut | Description |
|
||||||
|
|------|------|--------|-------------|
|
||||||
|
| `mode` | `'single' \| 'multiple'` | `'multiple'` | Un seul ou plusieurs panneaux ouverts |
|
||||||
|
| `modelValue` | `string \| string[]` | `undefined` | Clés ouvertes (v-model). `string[]` en `multiple`, `string` en `single` |
|
||||||
|
| `id` | `string` | auto | Préfixe des IDs d'accessibilité |
|
||||||
|
| `groupClass` | `string` | `''` | Classes du conteneur (twMerge) |
|
||||||
|
|
||||||
|
**Events :** `update:modelValue(value: string | string[])`
|
||||||
|
|
||||||
|
### MalioAccordionItem
|
||||||
|
|
||||||
|
| Prop | Type | Défaut | Description |
|
||||||
|
|------|------|--------|-------------|
|
||||||
|
| `title` | `string` | — | Texte de l'en-tête |
|
||||||
|
| `value` | `string` | auto | Clé unique de la section |
|
||||||
|
| `defaultOpen` | `boolean` | `false` | Ouvert au montage (mode non contrôlé) |
|
||||||
|
| `disabled` | `boolean` | `false` | En-tête non cliquable |
|
||||||
|
| `headerClass` | `string` | `''` | Override classes en-tête (twMerge) |
|
||||||
|
| `panelClass` | `string` | `''` | Override classes panneau (twMerge) |
|
||||||
|
|
||||||
|
**Slot :** par défaut = contenu du panneau.
|
||||||
|
|
||||||
|
```vue
|
||||||
|
<!-- Filtres : plusieurs sections ouvertes -->
|
||||||
|
<MalioAccordion v-model="ouverts">
|
||||||
|
<MalioAccordionItem title="Prix" value="prix">
|
||||||
|
<MalioInputAmount v-model="prix" />
|
||||||
|
</MalioAccordionItem>
|
||||||
|
<MalioAccordionItem title="Catégorie" value="cat">
|
||||||
|
<MalioCheckbox v-model="cats" />
|
||||||
|
</MalioAccordionItem>
|
||||||
|
</MalioAccordion>
|
||||||
|
|
||||||
|
<!-- FAQ : une seule section ouverte -->
|
||||||
|
<MalioAccordion mode="single">
|
||||||
|
<MalioAccordionItem title="Question 1" value="q1">Réponse 1</MalioAccordionItem>
|
||||||
|
<MalioAccordionItem title="Question 2" value="q2">Réponse 2</MalioAccordionItem>
|
||||||
|
</MalioAccordion>
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
## MalioSidebar
|
## MalioSidebar
|
||||||
|
|
||||||
Barre latérale de navigation rétractable.
|
Barre latérale de navigation rétractable.
|
||||||
|
|||||||
Reference in New Issue
Block a user