From 3ec8ac5308b8f6731fb05d3e3f57075e1c81a21c Mon Sep 17 00:00:00 2001
From: Jeff Emmett <jeffemmett@gmail.com>
Date: Wed, 15 Apr 2026 21:29:40 -0400
Subject: [PATCH] fix(auth): auto-focus passkey input for mobile autofill

Remove readonly and auto-focus the username webauthn input so mobile
browsers show passkey suggestions immediately when the sign-in modal
opens, matching the desktop experience.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 lib/rspace-header.ts | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/lib/rspace-header.ts b/lib/rspace-header.ts
index 27866069..eb0c40bf 100644
--- a/lib/rspace-header.ts
+++ b/lib/rspace-header.ts
@@ -550,7 +550,11 @@ export function showAuthModal(callbacks?: Partial<AuthModalCallbacks>): void {
     abortConditional();
     overlay.innerHTML = mode === 'signin' ? renderSignIn() : renderRegister();
     attachModalListeners();
-    if (mode === 'signin') startConditional();
+    if (mode === 'signin') {
+      startConditional();
+      // Auto-focus the passkey input so mobile shows autofill suggestions
+      setTimeout(() => (overlay.querySelector('#auth-signin-username') as HTMLInputElement)?.focus(), 100);
+    }
   }
 
   function abortConditional() {
@@ -628,9 +632,8 @@ export function showAuthModal(callbacks?: Partial<AuthModalCallbacks>): void {
           class="rspace-auth-modal__input"
           id="auth-signin-username"
           type="text"
-          placeholder="Select a saved passkey..."
+          placeholder="Tap to see saved passkeys..."
           autocomplete="username webauthn"
-          readonly
         />
         <div class="rspace-auth-modal__divider">or</div>
         <div class="rspace-auth-modal__actions">