mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-22 00:36:34 +00:00
Only focus search when not in fullscreen dialog (#19153)
This commit is contained in:
parent
71025eaf4d
commit
6911685bd0
@ -3,9 +3,10 @@ import { mdiClose, mdiContentPaste, mdiPlus } from "@mdi/js";
|
||||
import Fuse, { IFuseOptions } from "fuse.js";
|
||||
import { CSSResultGroup, LitElement, css, html, nothing } from "lit";
|
||||
import { customElement, property, query, state } from "lit/decorators";
|
||||
import { ifDefined } from "lit/directives/if-defined";
|
||||
import { repeat } from "lit/directives/repeat";
|
||||
import memoizeOne from "memoize-one";
|
||||
import { styleMap } from "lit/directives/style-map";
|
||||
import memoizeOne from "memoize-one";
|
||||
import { fireEvent } from "../../../common/dom/fire_event";
|
||||
import { domainIcon } from "../../../common/entity/domain_icon";
|
||||
import { shouldHandleRequestSelectedEvent } from "../../../common/mwc/handle-request-selected-event";
|
||||
@ -13,7 +14,7 @@ import { stringCompare } from "../../../common/string/compare";
|
||||
import { LocalizeFunc } from "../../../common/translations/localize";
|
||||
import "../../../components/ha-dialog";
|
||||
import type { HaDialog } from "../../../components/ha-dialog";
|
||||
import "../../../components/ha-header-bar";
|
||||
import "../../../components/ha-dialog-header";
|
||||
import "../../../components/ha-icon-button";
|
||||
import "../../../components/ha-icon-button-prev";
|
||||
import "../../../components/ha-icon-next";
|
||||
@ -94,6 +95,8 @@ class DialogAddAutomationElement extends LitElement implements HassDialog {
|
||||
|
||||
@query("ha-dialog") private _dialog?: HaDialog;
|
||||
|
||||
private _fullScreen = false;
|
||||
|
||||
private _width?: number;
|
||||
|
||||
private _height?: number;
|
||||
@ -105,6 +108,9 @@ class DialogAddAutomationElement extends LitElement implements HassDialog {
|
||||
this.hass.loadBackendTranslation("services");
|
||||
this._fetchManifests();
|
||||
}
|
||||
this._fullScreen = matchMedia(
|
||||
"all and (max-width: 450px), all and (max-height: 500px)"
|
||||
).matches;
|
||||
}
|
||||
|
||||
public closeDialog(): void {
|
||||
@ -406,7 +412,7 @@ class DialogAddAutomationElement extends LitElement implements HassDialog {
|
||||
.heading=${true}
|
||||
>
|
||||
<div slot="heading">
|
||||
<ha-header-bar>
|
||||
<ha-dialog-header>
|
||||
<span slot="title"
|
||||
>${this._group
|
||||
? groupName
|
||||
@ -424,10 +430,9 @@ class DialogAddAutomationElement extends LitElement implements HassDialog {
|
||||
slot="navigationIcon"
|
||||
dialogAction="cancel"
|
||||
></ha-icon-button>`}
|
||||
</ha-header-bar>
|
||||
</ha-dialog-header>
|
||||
<search-input
|
||||
autofocus
|
||||
dialogInitialFocus
|
||||
dialogInitialFocus=${ifDefined(this._fullScreen ? undefined : "")}
|
||||
.hass=${this.hass}
|
||||
.filter=${this._filter}
|
||||
@value-changed=${this._filterChanged}
|
||||
@ -442,6 +447,7 @@ class DialogAddAutomationElement extends LitElement implements HassDialog {
|
||||
></search-input>
|
||||
</div>
|
||||
<mwc-list
|
||||
dialogInitialFocus=${ifDefined(this._fullScreen ? "" : undefined)}
|
||||
innerRole="listbox"
|
||||
itemRoles="option"
|
||||
rootTabbable
|
||||
@ -554,12 +560,6 @@ class DialogAddAutomationElement extends LitElement implements HassDialog {
|
||||
--mdc-dialog-min-width: 500px;
|
||||
}
|
||||
}
|
||||
ha-header-bar {
|
||||
--mdc-theme-on-primary: var(--primary-text-color);
|
||||
--mdc-theme-primary: var(--mdc-theme-surface);
|
||||
margin-top: 8px;
|
||||
display: block;
|
||||
}
|
||||
ha-icon-next {
|
||||
width: 24px;
|
||||
}
|
||||
|
@ -3,21 +3,22 @@ import "@material/mwc-list/mwc-list";
|
||||
import Fuse, { IFuseOptions } from "fuse.js";
|
||||
import { HassConfig } from "home-assistant-js-websocket";
|
||||
import {
|
||||
css,
|
||||
html,
|
||||
LitElement,
|
||||
PropertyValues,
|
||||
TemplateResult,
|
||||
css,
|
||||
html,
|
||||
nothing,
|
||||
} from "lit";
|
||||
import { customElement, state } from "lit/decorators";
|
||||
import { ifDefined } from "lit/directives/if-defined";
|
||||
import { styleMap } from "lit/directives/style-map";
|
||||
import memoizeOne from "memoize-one";
|
||||
import { isComponentLoaded } from "../../../common/config/is_component_loaded";
|
||||
import { fireEvent } from "../../../common/dom/fire_event";
|
||||
import {
|
||||
protocolIntegrationPicked,
|
||||
PROTOCOL_INTEGRATIONS,
|
||||
protocolIntegrationPicked,
|
||||
} from "../../../common/integrations/protocolIntegrationPicked";
|
||||
import { navigate } from "../../../common/navigate";
|
||||
import { caseInsensitiveStringCompare } from "../../../common/string/compare";
|
||||
@ -34,10 +35,10 @@ import {
|
||||
import {
|
||||
Brand,
|
||||
Brands,
|
||||
findIntegration,
|
||||
getIntegrationDescriptions,
|
||||
Integration,
|
||||
Integrations,
|
||||
findIntegration,
|
||||
getIntegrationDescriptions,
|
||||
} from "../../../data/integrations";
|
||||
import { showConfigFlowDialog } from "../../../dialogs/config-flow/show-dialog-config-flow";
|
||||
import {
|
||||
@ -424,8 +425,7 @@ class AddIntegrationDialog extends LitElement {
|
||||
private _renderAll(integrations?: IntegrationListItem[]): TemplateResult {
|
||||
return html`<search-input
|
||||
.hass=${this.hass}
|
||||
autofocus
|
||||
dialogInitialFocus
|
||||
dialogInitialFocus=${ifDefined(this._narrow ? undefined : "")}
|
||||
.filter=${this._filter}
|
||||
@value-changed=${this._filterChanged}
|
||||
.label=${this.hass.localize(
|
||||
@ -434,7 +434,9 @@ class AddIntegrationDialog extends LitElement {
|
||||
@keypress=${this._maybeSubmit}
|
||||
></search-input>
|
||||
${integrations
|
||||
? html`<mwc-list>
|
||||
? html`<mwc-list
|
||||
dialogInitialFocus=${ifDefined(this._narrow ? "" : undefined)}
|
||||
>
|
||||
<lit-virtualizer
|
||||
scroller
|
||||
class="ha-scrollbar"
|
||||
|
Loading…
x
Reference in New Issue
Block a user