jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-08 18:06:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

Simplify enter handling

Browse Source
This commit is contained in:
Bram Kragten 2020-05-09 21:17:55 +02:00
parent 1a0bf861ee
commit a27428ebcd
2 changed files with 3 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/components/ha-tab.ts
View File

@ -18,13 +18,6 @@ import "./ha-svg-icon";
import { ifDefined } from "lit-html/directives/if-defined"; import { ifDefined } from "lit-html/directives/if-defined";
import { fireEvent } from "../common/dom/fire_event"; import { fireEvent } from "../common/dom/fire_event";
declare global {
// for fire event
interface HASSDomEvents {
activated: undefined;
}
}
@customElement("ha-tab") @customElement("ha-tab")
export class HaTab extends LitElement { export class HaTab extends LitElement {
@property({ type: Boolean, reflect: true }) public active = false; @property({ type: Boolean, reflect: true }) public active = false;
@ -54,11 +47,10 @@ export class HaTab extends LitElement {
@touchend=${this.handleRippleDeactivate} @touchend=${this.handleRippleDeactivate}
@touchcancel=${this.handleRippleDeactivate} @touchcancel=${this.handleRippleDeactivate}
@keydown=${this._handleKeyDown} @keydown=${this._handleKeyDown}
@click=${this._handleClick}
> >
${this.narrow ? html`<slot name="icon"></slot>` : ""} ${this.narrow ? html`<slot name="icon"></slot>` : ""}
${!this.narrow || this.active ${!this.narrow || this.active
? html` <span class="name">${this.name}</span> ` ? html`<span class="name">${this.name}</span>`
: ""} : ""}
${this._shouldRenderRipple ? html`<mwc-ripple></mwc-ripple>` : ""} ${this._shouldRenderRipple ? html`<mwc-ripple></mwc-ripple>` : ""}
</div> </div>
@ -72,14 +64,10 @@ export class HaTab extends LitElement {
private _handleKeyDown(ev: KeyboardEvent): void { private _handleKeyDown(ev: KeyboardEvent): void {
if (ev.keyCode === 13) { if (ev.keyCode === 13) {
fireEvent(this, "activated"); (ev.target as HTMLElement).click();
} }
} }
private _handleClick(): void {
fireEvent(this, "activated");
}
@eventOptions({ passive: true }) @eventOptions({ passive: true })
private handleRippleActivate(evt?: Event) { private handleRippleActivate(evt?: Event) {
this._rippleHandlers.startPress(evt); this._rippleHandlers.startPress(evt);

2
src/layouts/hass-tabs-subpage.ts
View File

@ -74,7 +74,7 @@ class HassTabsSubpage extends LitElement {
html` html`
<ha-tab <ha-tab
.hass=${this.hass} .hass=${this.hass}
@activated=${this._tabTapped} @click=${this._tabTapped}
.path=${page.path} .path=${page.path}
.active=${page === activeTab} .active=${page === activeTab}
.narrow=${this.narrow} .narrow=${this.narrow}