jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-04-25 13:57:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

Allow pressing enter to pick item at the top of the list (#11139)

Browse Source
This commit is contained in:
Paulus Schoutsen 2022-01-12 17:52:29 -08:00 committed by GitHub
parent 5e388b1f02
commit 74a05929be
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 25 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
src/dialogs/config-flow/step-flow-pick-handler.ts
View File

@ -51,7 +51,7 @@ class StepFlowPickHandler extends LitElement {
private _height?: number;
private _getHandlers = memoizeOne(
private _filterHandlers = memoizeOne(
(h: string[], filter?: string, _localize?: LocalizeFunc) => {
const handlers: HandlerObj[] = h.map((handler) => ({
name: domainToName(this.hass.localize, handler),
@ -75,11 +75,7 @@ class StepFlowPickHandler extends LitElement {
);
protected render(): TemplateResult {
const handlers = this._getHandlers(
this.handlers,
this._filter,
this.hass.localize
);
const handlers = this._getHandlers();
return html`
<h2>${this.hass.localize("ui.panel.config.integrations.new")}</h2>
@ -89,6 +85,7 @@ class StepFlowPickHandler extends LitElement {
.filter=${this._filter}
@value-changed=${this._filterChanged}
.label=${this.hass.localize("ui.panel.config.integrations.search")}
@keypress=${this._maybeSubmit}
></search-input>
<div
style=${styleMap({
@ -180,6 +177,14 @@ class StepFlowPickHandler extends LitElement {
}
}
private _getHandlers() {
return this._filterHandlers(
this.handlers,
this._filter,
this.hass.localize
);
}
private async _filterChanged(e) {
this._filter = e.detail.value;
}
@ -190,6 +195,20 @@ class StepFlowPickHandler extends LitElement {
});
}
private _maybeSubmit(ev: KeyboardEvent) {
if (ev.key !== "Enter") {
return;
}
const handlers = this._getHandlers();
if (handlers.length > 0) {
fireEvent(this, "handler-picked", {
handler: handlers[0].slug,
});
}
}
static get styles(): CSSResultGroup {
return [
configFlowContentStyles,