1 files changed, 15 insertions, 4 deletions
diff --git a/src/components/PasswordInput.svelte b/src/components/PasswordInput.svelte
index bac00134..eb5b0d6c 100644
--- a/src/components/PasswordInput.svelte
+++ b/src/components/PasswordInput.svelte
@@ -1,7 +1,11 @@
 <script>
-  let { value = $bindable(), focus = () => {} } = $props();
+  let {
+    show = $bindable(),
+    value = $bindable(),
+    focus = () => {},
+    placeholder,
+  } = $props();
   let toggle = (e) => (show = !show);
-  let show = $state(false);
   let icon = $derived(show ? "ph:eye-bold" : "ph:eye-slash-bold");
 </script>
 
@@ -10,9 +14,16 @@
   class="input flex items-center justify-center gap-2 w-full"
 >
   {#if show}
-    <input name="password" type="text" bind:value class="clean" />
+    <input name="password" type="text" bind:value class="clean" {placeholder} />
   {:else}
-    <input name="password" type="password" bind:value class="clean" use:focus />
+    <input
+      name="password"
+      type="password"
+      bind:value
+      class="clean"
+      use:focus
+      {placeholder}
+    />
   {/if}
   <button type="button" aria-label="Toggle" onclick={toggle} class="contents">
     <iconify-icon {icon} width="32"></iconify-icon>