diff --git a/src/common/search/search-input.ts b/src/common/search/search-input.ts
index 65b29881e9..8bfcf399fd 100644
--- a/src/common/search/search-input.ts
+++ b/src/common/search/search-input.ts
@@ -16,6 +16,10 @@ import "@material/mwc-button";
class SearchInput extends LitElement {
@property() private filter?: string;
+ public focus() {
+ this.shadowRoot!.querySelector("paper-input")!.focus();
+ }
+
protected render(): TemplateResult | void {
return html`
diff --git a/src/dialogs/config-flow/step-flow-form.ts b/src/dialogs/config-flow/step-flow-form.ts
index 98d5ff33b7..c97c491df5 100644
--- a/src/dialogs/config-flow/step-flow-form.ts
+++ b/src/dialogs/config-flow/step-flow-form.ts
@@ -109,6 +109,7 @@ class StepFlowForm extends LitElement {
protected firstUpdated(changedProps: PropertyValues) {
super.firstUpdated(changedProps);
+ setTimeout(() => this.shadowRoot!.querySelector("ha-form")!.focus(), 0);
this.addEventListener("keypress", (ev) => {
if (ev.keyCode === 13) {
this._submitStep();
diff --git a/src/dialogs/config-flow/step-flow-pick-handler.ts b/src/dialogs/config-flow/step-flow-pick-handler.ts
index ef410f7529..19963854af 100644
--- a/src/dialogs/config-flow/step-flow-pick-handler.ts
+++ b/src/dialogs/config-flow/step-flow-pick-handler.ts
@@ -101,6 +101,14 @@ class StepFlowPickHandler extends LitElement {
`;
}
+ protected firstUpdated(changedProps) {
+ super.firstUpdated(changedProps);
+ setTimeout(
+ () => this.shadowRoot!.querySelector("search-input")!.focus(),
+ 0
+ );
+ }
+
protected updated(changedProps) {
super.updated(changedProps);
// Store the width so that when we search, box doesn't jump