thelounge/client/components/RevealPassword.vue

34 lines
606 B
Vue
Raw Normal View History

2019-02-18 10:18:32 +01:00
<template>
<div>
<slot :isVisible="isVisible" />
<span
ref="revealButton"
type="button"
:class="[
'reveal-password tooltipped tooltipped-n tooltipped-no-delay',
2019-08-03 21:03:45 +02:00
{'reveal-password-visible': isVisible},
2019-02-18 10:18:32 +01:00
]"
:aria-label="isVisible ? 'Hide password' : 'Show password'"
2019-03-01 15:18:16 +01:00
@click="onClick"
>
2019-08-03 21:03:45 +02:00
<span :aria-label="isVisible ? 'Hide password' : 'Show password'" />
2019-02-18 10:18:32 +01:00
</span>
</div>
</template>
<script>
export default {
name: "RevealPassword",
data() {
return {
isVisible: false,
};
},
methods: {
onClick() {
this.isVisible = !this.isVisible;
},
},
};
</script>