mirror of
https://github.com/ArthurDanjou/ui.git
synced 2026-01-14 20:19:34 +01:00
34 lines
698 B
Vue
34 lines
698 B
Vue
<script setup lang="ts">
|
|
const show = ref(false)
|
|
const password = ref('')
|
|
</script>
|
|
|
|
<template>
|
|
<UInput
|
|
v-model="password"
|
|
placeholder="Password"
|
|
:type="show ? 'text' : 'password'"
|
|
:ui="{ trailing: 'pe-1' }"
|
|
>
|
|
<template #trailing>
|
|
<UButton
|
|
color="neutral"
|
|
variant="link"
|
|
size="sm"
|
|
:icon="show ? 'i-lucide-eye-off' : 'i-lucide-eye'"
|
|
:aria-label="show ? 'Hide password' : 'Show password'"
|
|
:aria-pressed="show"
|
|
aria-controls="password"
|
|
@click="show = !show"
|
|
/>
|
|
</template>
|
|
</UInput>
|
|
</template>
|
|
|
|
<style>
|
|
/* Hide the password reveal button in Edge */
|
|
::-ms-reveal {
|
|
display: none;
|
|
}
|
|
</style>
|