From cae36b393b3822ed8c5ee322d0fe5b6114f52aeb Mon Sep 17 00:00:00 2001
From: Jan-Philipp Benecke <jan-philipp@bnck.me>
Date: Thu, 20 Feb 2025 14:20:28 +0100
Subject: [PATCH] Focus alarm control panel PIN input on wider screens (#24324)

* Focus alarm control panel PIN input on wider screens

* Also apply on textfield
---
 src/dialogs/enter-code/dialog-enter-code.ts | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/dialogs/enter-code/dialog-enter-code.ts b/src/dialogs/enter-code/dialog-enter-code.ts
index 5a76df3e64..933567705e 100644
--- a/src/dialogs/enter-code/dialog-enter-code.ts
+++ b/src/dialogs/enter-code/dialog-enter-code.ts
@@ -40,8 +40,13 @@ export class DialogEnterCode
 
   @state() private _showClearButton = false;
 
+  @state() private _narrow = false;
+
   public async showDialog(dialogParams: EnterCodeDialogParams): Promise<void> {
     this._dialogParams = dialogParams;
+    this._narrow = matchMedia(
+      "all and (max-width: 450px), all and (max-height: 500px)"
+    ).matches;
     await this.updateComplete;
   }
 
@@ -96,7 +101,7 @@ export class DialogEnterCode
         >
           <ha-textfield
             class="input"
-            dialogInitialFocus
+            ?dialogInitialFocus=${!this._narrow}
             id="code"
             .label=${this.hass.localize("ui.dialogs.enter_code.input_label")}
             type="password"
@@ -134,6 +139,7 @@ export class DialogEnterCode
             .label=${this.hass.localize("ui.dialogs.enter_code.input_label")}
             type="password"
             inputmode="numeric"
+            ?dialogInitialFocus=${!this._narrow}
           ></ha-textfield>
           <div class="keypad">
             ${BUTTONS.map((value) =>