Files
ui/docs/components/content/examples/FormGroupErrorSlotExample.vue
Levy 2fc938575d feat(FormGroup): add slots (#714)
Co-authored-by: Romain Hamel <rom.hml@gmail.com>
Co-authored-by: Benjamin Canac <canacb1@gmail.com>
Co-authored-by: saveliy <savelii.moshkota@ext.jumingo.com>
2023-09-28 18:30:41 +02:00

17 lines
669 B
Vue

<template>
<UFormGroup label="Email" :error="!email && 'You must enter an email'" help="This is a nice email!">
<template #default="{ error }">
<UInput v-model="email" type="email" placeholder="Enter email" :trailing-icon="error ? 'i-heroicons-exclamation-triangle-20-solid' : undefined" />
</template>
<template #error="{ error }">
<UAlert v-if="error" icon="i-heroicons-exclamation-triangle-20-solid" :title="error" color="red" />
<UAlert v-else icon="i-heroicons-check-circle-20-solid" title="Your email is valid" color="green" />
</template>
</UFormGroup>
</template>
<script setup lang="ts">
const email = ref('')
</script>