From 2d264e32e06823233f441dde65c40de1ad5882f5 Mon Sep 17 00:00:00 2001
From: lajczi <lajczi@disroot.org>
Date: Sat, 9 May 2026 19:11:11 +0200
Subject: [PATCH] fix: use dynamic id for `aria-controls` in `PasswordToggle`

---
 src/runtime/components/input/PasswordToggle.vue | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/runtime/components/input/PasswordToggle.vue b/src/runtime/components/input/PasswordToggle.vue
index 5e4c7a1..b6f3e3f 100644
--- a/src/runtime/components/input/PasswordToggle.vue
+++ b/src/runtime/components/input/PasswordToggle.vue
@@ -1,14 +1,16 @@
 <script setup lang="ts">
 import UButton from '@nuxt/ui/components/Button.vue'
 import UInput from '@nuxt/ui/components/Input.vue'
-import { ref } from 'vue'
+import { ref, useId } from 'vue'
 
 const show = ref(false)
 const input = defineModel<string>({ default: '' })
+const inputId = useId()
 </script>
 
 <template>
   <UInput
+    :id="inputId"
     v-model="input"
     :type="show ? 'text' : 'password'"
     :ui="{ trailing: 'pe-1' }"
@@ -21,7 +23,7 @@ const input = defineModel<string>({ default: '' })
         :icon="show ? 'i-lucide-eye-off' : 'i-lucide-eye'"
         :aria-label="show ? 'Hide password' : 'Show password'"
         :aria-pressed="show"
-        aria-controls="password"
+        :aria-controls="inputId"
         @click="show = !show"
       />
     </template>