From ac21aaf5587e462b0dcfc994b370402fdeb0d10e Mon Sep 17 00:00:00 2001 From: tristan Date: Tue, 9 Jun 2026 13:01:53 +0200 Subject: [PATCH] docs(email) : documente le bouton + d'ajout de MalioInputEmail --- CHANGELOG.md | 1 + COMPONENTS.md | 8 +++++++- 2 files changed, 8 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 4f63e1b..aa7d963 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -42,6 +42,7 @@ Liste des évolutions de la librairie Malio layer UI * [#MUI-41] Prop `required` cohérente + astérisque rouge dans le label sur la famille formulaire (Select, SelectCheckbox, InputUpload, InputRichText gagnent la prop) * [#MUI-41] InputEmail : sanitisation à la saisie (suppression des espaces, option `lowercase`) * [#MUI-42] MalioDate : saisie clavier `JJ/MM/AAAA` optionnelle (prop `editable`, masque maska, validation au blur, message `invalidMessage`) +* InputEmail : bouton `+` d'ajout optionnel (prop `addable`, event `add`), calqué sur InputPhone ; l'icône email passe à gauche quand le bouton est actif ### Changed * MalioButton : dimensions par défaut `w-[180px]` / `h-[38px]` (étaient `w-[200px]` / `h-[40px]`). diff --git a/COMPONENTS.md b/COMPONENTS.md index 447784a..22bb547 100644 --- a/COMPONENTS.md +++ b/COMPONENTS.md @@ -94,19 +94,25 @@ Champ email (`type="email"` + `inputmode="email"`) avec icône `mdi:email-outlin | `iconPosition` | `'left' \| 'right'` | `'right'` | Position de l'icône | | `iconSize` | `string \| number` | `24` | Taille icône | | `iconColor` | `string` | `'text-m-muted'` | Classe couleur icône | +| `addable` | `boolean` | `false` | Affiche un bouton `+` à droite qui émet l'event `add` (l'icône email passe à gauche) | +| `addIconName` | `string` | `'mdi:plus'` | Icône Iconify du bouton d'ajout | +| `addButtonLabel` | `string` | `'Ajouter une adresse email'` | aria-label du bouton d'ajout | | `inputClass` | `string` | `''` | Classes CSS input | | `labelClass` | `string` | `''` | Classes CSS label | | `groupClass` | `string` | `''` | Classes CSS conteneur | > **Sanitisation à la saisie :** tous les espaces sont supprimés automatiquement au fil de la frappe (sans masque). Avec `lowercase=true`, la valeur est également convertie en minuscules à la frappe. La validation du format (ex. présence d'un `@`) reste à la charge du parent via la prop `error` ou la couche de validation. -**Events :** `update:modelValue(value: string)` +**Events :** +- `update:modelValue(value: string)` +- `add()` — émis au clic du bouton `+` (uniquement si `addable`, non `disabled`, non `readonly`) ```vue + ``` ---