<template>
  <DefaultInput
    v-model="password"
    v-bind="$attrs"
    :type="!seePassword ? 'password' : 'text'"
  >
    <template #append>
      <q-icon
        :name="seePassword ? 'mdi-lock-open-outline' : 'mdi-lock-outline'"
        class="cursor-pointer q-ml-md"
        color="secondary"
        @click="seePassword = !seePassword"
      />
    </template>
  </DefaultInput>
</template>
<script setup>
import DefaultInput from "./DefaultInput.vue";

const password = defineModel({ type: String });
const seePassword = defineModel("seePassword", {
  default: false,
  type: Boolean,
});
</script>
