<template>
    <InputText
        :defaultValue="d_value"
        :type="inputType"
        :name="$formName"
        :variant="variant"
        :size="size"
        :fluid="fluid"
        :invalid="invalid"
        :disabled="disabled"
        :class="cx('root')"
        :pt="ptm('pcInputText')"
        :unstyled="unstyled"
        v-bind="{ ...$attrs, ...ptmi('root') }"
        @input="onInput"
    />
</template>

<script>
import InputText from 'primevue/inputtext';
import BaseInputPassword from './BaseInputPassword.vue';

export default {
    name: 'InputPassword',
    extends: BaseInputPassword,
    inheritAttrs: false,
    emits: ['update:mask'],
    expose: ['toggleMask'],
    methods: {
        onInput(event) {
            this.writeValue(event.target.value, event);
        },
        toggleMask() {
            this.$emit('update:mask', !this.mask);
        }
    },
    computed: {
        inputType() {
            return this.mask ? 'password' : 'text';
        }
    },
    components: {
        InputText
    }
};
</script>
