Files
hnh-map/frontend-nuxt/components/PasswordInput.vue
Nikolay Tatarinov 6529d7370e Add configuration files and update project documentation
- Introduced .editorconfig for consistent coding styles across the project.
- Added .golangci.yml for Go linting configuration.
- Updated AGENTS.md to clarify project structure and components.
- Enhanced CONTRIBUTING.md with Makefile usage for common tasks.
- Updated Dockerfiles to use Go 1.24 and improved build instructions.
- Refined README.md and deployment documentation for clarity.
- Added testing documentation in testing.md for backend and frontend tests.
- Introduced Makefile for streamlined development commands and tasks.
2026-03-01 01:51:47 +03:00

50 lines
1.5 KiB
Vue

<template>
<fieldset class="fieldset">
<label v-if="label" class="label" :for="inputId">
<span>{{ label }}</span>
</label>
<div class="relative flex">
<input
:id="inputId"
:value="modelValue"
:type="showPass ? 'text' : 'password'"
class="input flex-1 pr-10"
:placeholder="placeholder"
:required="required"
:autocomplete="autocomplete"
:readonly="readonly"
@input="emit('update:modelValue', ($event.target as HTMLInputElement).value)"
/>
<button
type="button"
class="absolute right-2 top-1/2 -translate-y-1/2 btn btn-ghost btn-sm btn-square min-h-0 h-8 w-8"
:aria-label="showPass ? 'Hide password' : 'Show password'"
@click="showPass = !showPass"
>
<icons-icon-eye-off v-if="showPass" />
<icons-icon-eye v-else />
</button>
</div>
</fieldset>
</template>
<script setup lang="ts">
const props = withDefaults(
defineProps<{
modelValue: string
label?: string
placeholder?: string
required?: boolean
autocomplete?: string
readonly?: boolean
inputId?: string
}>(),
{ required: false, autocomplete: 'off', inputId: undefined }
)
const emit = defineEmits<{ 'update:modelValue': [value: string] }>()
const showPass = ref(false)
const inputId = computed(() => props.inputId ?? `password-${Math.random().toString(36).slice(2, 9)}`)
</script>