docs(email) : exemples bouton + d'ajout (story + playground)

.playground/pages/composant/input/inputEmail.vue

@@ -14,6 +14,20 @@
       />
     </div>
 
+    <div class="rounded-lg border p-4">
+      <h2 class="mb-4 text-xl font-bold">Ajout dynamique (bouton +)</h2>
+      <div class="space-y-3">
+        <MalioInputEmail
+          v-for="(email, index) in emails"
+          :key="index"
+          v-model="emails[index]"
+          label="Adresse email"
+          addable
+          @add="emails.push('')"
+        />
+      </div>
+    </div>
+
     <div class="rounded-lg border p-4">
       <h2 class="mb-4 text-xl font-bold">Icône à gauche</h2>
       <MalioInputEmail
@@ -127,6 +141,7 @@ import { computed, ref } from 'vue'
 
 const readonlyFilledEmail = ref('contact@malio.fr')
 const emailValue = ref('')
+const emails = ref<string[]>([''])
 const dynamicEmail = ref('')
 const requiredEmail = ref('')
 const lowercaseEmail = ref('')

app/story/input/inputEmail.story.vue

@@ -18,6 +18,19 @@
         />
       </div>
 
+      <div class="rounded-lg border p-4">
+        <h2 class="mb-4 text-xl font-bold">Avec bouton « ajouter »</h2>
+        <MalioInputEmail
+          v-model="addableValue"
+          label="Adresse email"
+          addable
+          @add="onAdd"
+        />
+        <p v-if="addClicks > 0" class="mt-2 text-sm text-m-muted">
+          Bouton cliqué {{ addClicks }} fois
+        </p>
+      </div>
+
       <div class="rounded-lg border p-4">
         <h2 class="mb-4 text-xl font-bold">Sans icône</h2>
         <MalioInputEmail
@@ -251,6 +264,9 @@ import {ref} from 'vue'
 import MalioInputEmail from '../../components/malio/input/InputEmail.vue'
 
 const simpleValue = ref('')
+const addableValue = ref('')
+const addClicks = ref(0)
+const onAdd = () => { addClicks.value += 1 }
 const leftIconValue = ref('')
 const noIconValue = ref('')
 const hintValue = ref('')