From c0896d173d95332de2bba703f9c2ac16101c714d Mon Sep 17 00:00:00 2001 From: Ian Richardson Date: Thu, 28 Feb 2019 11:48:18 -0600 Subject: [PATCH] cleanup rows (#2863) --- .../entity-rows/hui-climate-entity-row.ts | 5 +- .../entity-rows/hui-cover-entity-row.ts | 5 +- .../entity-rows/hui-group-entity-row.ts | 12 ++- .../hui-input-number-entity-row.ts | 3 + .../hui-input-select-entity-row.ts | 5 +- .../entity-rows/hui-input-text-entity-row.ts | 12 ++- .../entity-rows/hui-lock-entity-row.ts | 5 +- .../hui-media-player-entity-row.ts | 5 +- .../entity-rows/hui-scene-entity-row.ts | 5 +- .../entity-rows/hui-script-entity-row.ts | 5 +- .../entity-rows/hui-sensor-entity-row.ts | 5 +- .../entity-rows/hui-text-entity-row.ts | 5 +- .../entity-rows/hui-timer-entity-row.ts | 7 +- .../entity-rows/hui-toggle-entity-row.ts | 17 ++-- .../special-rows/hui-call-service-row.ts | 78 +++++++++---------- .../lovelace/special-rows/hui-divider-row.ts | 19 ++--- .../lovelace/special-rows/hui-section-row.ts | 56 ++++++------- .../lovelace/special-rows/hui-weblink-row.ts | 58 +++++++------- 18 files changed, 165 insertions(+), 142 deletions(-) diff --git a/src/panels/lovelace/entity-rows/hui-climate-entity-row.ts b/src/panels/lovelace/entity-rows/hui-climate-entity-row.ts index 9487294b76..586a29615f 100644 --- a/src/panels/lovelace/entity-rows/hui-climate-entity-row.ts +++ b/src/panels/lovelace/entity-rows/hui-climate-entity-row.ts @@ -5,6 +5,7 @@ import { property, css, CSSResult, + customElement, } from "lit-element"; import "../../../components/ha-climate-state"; @@ -14,8 +15,10 @@ import "../components/hui-warning"; import { HomeAssistant } from "../../../types"; import { EntityRow, EntityConfig } from "./types"; +@customElement("hui-climate-entity-row") class HuiClimateEntityRow extends LitElement implements EntityRow { @property() public hass?: HomeAssistant; + @property() private _config?: EntityConfig; public setConfig(config: EntityConfig): void { @@ -69,5 +72,3 @@ declare global { "hui-climate-entity-row": HuiClimateEntityRow; } } - -customElements.define("hui-climate-entity-row", HuiClimateEntityRow); diff --git a/src/panels/lovelace/entity-rows/hui-cover-entity-row.ts b/src/panels/lovelace/entity-rows/hui-cover-entity-row.ts index 148c1614c2..160c4d6760 100644 --- a/src/panels/lovelace/entity-rows/hui-cover-entity-row.ts +++ b/src/panels/lovelace/entity-rows/hui-cover-entity-row.ts @@ -5,6 +5,7 @@ import { property, css, CSSResult, + customElement, } from "lit-element"; import "../components/hui-generic-entity-row"; @@ -16,8 +17,10 @@ import { isTiltOnly } from "../../../util/cover-model"; import { HomeAssistant } from "../../../types"; import { EntityRow, EntityConfig } from "./types"; +@customElement("hui-cover-entity-row") class HuiCoverEntityRow extends LitElement implements EntityRow { @property() public hass?: HomeAssistant; + @property() private _config?: EntityConfig; public setConfig(config: EntityConfig): void { @@ -80,5 +83,3 @@ declare global { "hui-cover-entity-row": HuiCoverEntityRow; } } - -customElements.define("hui-cover-entity-row", HuiCoverEntityRow); diff --git a/src/panels/lovelace/entity-rows/hui-group-entity-row.ts b/src/panels/lovelace/entity-rows/hui-group-entity-row.ts index e422037ca6..165f4eb027 100644 --- a/src/panels/lovelace/entity-rows/hui-group-entity-row.ts +++ b/src/panels/lovelace/entity-rows/hui-group-entity-row.ts @@ -1,4 +1,10 @@ -import { html, LitElement, TemplateResult, property } from "lit-element"; +import { + html, + LitElement, + TemplateResult, + property, + customElement, +} from "lit-element"; import "../components/hui-generic-entity-row"; import "../../../components/entity/ha-entity-toggle"; @@ -9,8 +15,10 @@ import { DOMAINS_TOGGLE } from "../../../common/const"; import { HomeAssistant } from "../../../types"; import { EntityRow, EntityConfig } from "./types"; +@customElement("hui-group-entity-row") class HuiGroupEntityRow extends LitElement implements EntityRow { @property() public hass?: HomeAssistant; + @property() private _config?: EntityConfig; public setConfig(config: EntityConfig): void { @@ -73,5 +81,3 @@ declare global { "hui-group-entity-row": HuiGroupEntityRow; } } - -customElements.define("hui-group-entity-row", HuiGroupEntityRow); diff --git a/src/panels/lovelace/entity-rows/hui-input-number-entity-row.ts b/src/panels/lovelace/entity-rows/hui-input-number-entity-row.ts index da44882a6a..12fd026996 100644 --- a/src/panels/lovelace/entity-rows/hui-input-number-entity-row.ts +++ b/src/panels/lovelace/entity-rows/hui-input-number-entity-row.ts @@ -20,8 +20,11 @@ import { setValue } from "../../../data/input_text"; @customElement("hui-input-number-entity-row") class HuiInputNumberEntityRow extends LitElement implements EntityRow { @property() public hass?: HomeAssistant; + @property() private _config?: EntityConfig; + private _loaded?: boolean; + private _updated?: boolean; public setConfig(config: EntityConfig): void { diff --git a/src/panels/lovelace/entity-rows/hui-input-select-entity-row.ts b/src/panels/lovelace/entity-rows/hui-input-select-entity-row.ts index 77c056524c..ddb96a54a8 100644 --- a/src/panels/lovelace/entity-rows/hui-input-select-entity-row.ts +++ b/src/panels/lovelace/entity-rows/hui-input-select-entity-row.ts @@ -5,6 +5,7 @@ import { property, css, CSSResult, + customElement, } from "lit-element"; import { repeat } from "lit-html/directives/repeat"; import "@polymer/paper-dropdown-menu/paper-dropdown-menu"; @@ -19,8 +20,10 @@ import { HomeAssistant } from "../../../types"; import { EntityRow, EntityConfig } from "./types"; import { setOption } from "../../../data/input-select"; +@customElement("hui-input-select-entity-row") class HuiInputSelectEntityRow extends LitElement implements EntityRow { @property() public hass?: HomeAssistant; + @property() private _config?: EntityConfig; public setConfig(config: EntityConfig): void { @@ -106,5 +109,3 @@ declare global { "hui-input-select-entity-row": HuiInputSelectEntityRow; } } - -customElements.define("hui-input-select-entity-row", HuiInputSelectEntityRow); diff --git a/src/panels/lovelace/entity-rows/hui-input-text-entity-row.ts b/src/panels/lovelace/entity-rows/hui-input-text-entity-row.ts index 1456bb9492..42376687cc 100644 --- a/src/panels/lovelace/entity-rows/hui-input-text-entity-row.ts +++ b/src/panels/lovelace/entity-rows/hui-input-text-entity-row.ts @@ -1,4 +1,10 @@ -import { html, LitElement, TemplateResult, property } from "lit-element"; +import { + html, + LitElement, + TemplateResult, + property, + customElement, +} from "lit-element"; import { PaperInputElement } from "@polymer/paper-input/paper-input"; import "../components/hui-generic-entity-row"; @@ -8,8 +14,10 @@ import { HomeAssistant } from "../../../types"; import { EntityRow, EntityConfig } from "./types"; import { setValue } from "../../../data/input_text"; +@customElement("hui-input-text-entity-row") class HuiInputTextEntityRow extends LitElement implements EntityRow { @property() public hass?: HomeAssistant; + @property() private _config?: EntityConfig; public setConfig(config: EntityConfig): void { @@ -76,5 +84,3 @@ declare global { "hui-input-text-entity-row": HuiInputTextEntityRow; } } - -customElements.define("hui-input-text-entity-row", HuiInputTextEntityRow); diff --git a/src/panels/lovelace/entity-rows/hui-lock-entity-row.ts b/src/panels/lovelace/entity-rows/hui-lock-entity-row.ts index 15c0acbf5c..22d6fe6028 100644 --- a/src/panels/lovelace/entity-rows/hui-lock-entity-row.ts +++ b/src/panels/lovelace/entity-rows/hui-lock-entity-row.ts @@ -5,6 +5,7 @@ import { property, css, CSSResult, + customElement, } from "lit-element"; import "../components/hui-generic-entity-row"; @@ -13,8 +14,10 @@ import "../components/hui-warning"; import { HomeAssistant } from "../../../types"; import { EntityRow, EntityConfig } from "./types"; +@customElement("hui-lock-entity-row") class HuiLockEntityRow extends LitElement implements EntityRow { @property() public hass?: HomeAssistant; + @property() private _config?: EntityConfig; public setConfig(config: EntityConfig): void { @@ -78,5 +81,3 @@ declare global { "hui-lock-entity-row": HuiLockEntityRow; } } - -customElements.define("hui-lock-entity-row", HuiLockEntityRow); diff --git a/src/panels/lovelace/entity-rows/hui-media-player-entity-row.ts b/src/panels/lovelace/entity-rows/hui-media-player-entity-row.ts index 3defa48446..28273dce7e 100644 --- a/src/panels/lovelace/entity-rows/hui-media-player-entity-row.ts +++ b/src/panels/lovelace/entity-rows/hui-media-player-entity-row.ts @@ -5,6 +5,7 @@ import { css, CSSResult, property, + customElement, } from "lit-element"; import "@polymer/paper-icon-button/paper-icon-button"; @@ -22,8 +23,10 @@ import { SUPPORT_PAUSE, } from "../../../data/media-player"; +@customElement("hui-media-player-entity-row") class HuiMediaPlayerEntityRow extends LitElement implements EntityRow { @property() public hass?: HomeAssistant; + @property() private _config?: EntityConfig; public setConfig(config: EntityConfig): void { @@ -156,5 +159,3 @@ declare global { "hui-media-player-entity-row": HuiMediaPlayerEntityRow; } } - -customElements.define("hui-media-player-entity-row", HuiMediaPlayerEntityRow); diff --git a/src/panels/lovelace/entity-rows/hui-scene-entity-row.ts b/src/panels/lovelace/entity-rows/hui-scene-entity-row.ts index 4a11a1f6a3..a690adfc5c 100644 --- a/src/panels/lovelace/entity-rows/hui-scene-entity-row.ts +++ b/src/panels/lovelace/entity-rows/hui-scene-entity-row.ts @@ -5,6 +5,7 @@ import { CSSResult, css, property, + customElement, } from "lit-element"; import "../components/hui-generic-entity-row"; @@ -14,8 +15,10 @@ import "../components/hui-warning"; import { HomeAssistant } from "../../../types"; import { EntityRow, EntityConfig } from "./types"; +@customElement("hui-scene-entity-row") class HuiSceneEntityRow extends LitElement implements EntityRow { @property() public hass?: HomeAssistant; + @property() private _config?: EntityConfig; public setConfig(config: EntityConfig): void { @@ -83,5 +86,3 @@ declare global { "hui-scene-entity-row": HuiSceneEntityRow; } } - -customElements.define("hui-scene-entity-row", HuiSceneEntityRow); diff --git a/src/panels/lovelace/entity-rows/hui-script-entity-row.ts b/src/panels/lovelace/entity-rows/hui-script-entity-row.ts index b0465abf11..5d6dfe82ef 100644 --- a/src/panels/lovelace/entity-rows/hui-script-entity-row.ts +++ b/src/panels/lovelace/entity-rows/hui-script-entity-row.ts @@ -5,6 +5,7 @@ import { property, CSSResult, css, + customElement, } from "lit-element"; import "../components/hui-generic-entity-row"; @@ -14,8 +15,10 @@ import "../components/hui-warning"; import { HomeAssistant } from "../../../types"; import { EntityRow, EntityConfig } from "./types"; +@customElement("hui-script-entity-row") class HuiScriptEntityRow extends LitElement implements EntityRow { @property() public hass?: HomeAssistant; + @property() private _config?: EntityConfig; public setConfig(config: EntityConfig): void { @@ -83,5 +86,3 @@ declare global { "hui-script-entity-row": HuiScriptEntityRow; } } - -customElements.define("hui-script-entity-row", HuiScriptEntityRow); diff --git a/src/panels/lovelace/entity-rows/hui-sensor-entity-row.ts b/src/panels/lovelace/entity-rows/hui-sensor-entity-row.ts index 4c65f99cf0..998ba9450c 100644 --- a/src/panels/lovelace/entity-rows/hui-sensor-entity-row.ts +++ b/src/panels/lovelace/entity-rows/hui-sensor-entity-row.ts @@ -5,6 +5,7 @@ import { property, CSSResult, css, + customElement, } from "lit-element"; import "../components/hui-generic-entity-row"; @@ -20,8 +21,10 @@ interface SensorEntityConfig extends EntityConfig { format?: "relative" | "date" | "time" | "datetime"; } +@customElement("hui-sensor-entity-row") class HuiSensorEntityRow extends LitElement implements EntityRow { @property() public hass?: HomeAssistant; + @property() private _config?: SensorEntityConfig; public setConfig(config: SensorEntityConfig): void { @@ -85,5 +88,3 @@ declare global { "hui-sensor-entity-row": HuiSensorEntityRow; } } - -customElements.define("hui-sensor-entity-row", HuiSensorEntityRow); diff --git a/src/panels/lovelace/entity-rows/hui-text-entity-row.ts b/src/panels/lovelace/entity-rows/hui-text-entity-row.ts index 5fd9f2f442..6c7e564262 100644 --- a/src/panels/lovelace/entity-rows/hui-text-entity-row.ts +++ b/src/panels/lovelace/entity-rows/hui-text-entity-row.ts @@ -5,6 +5,7 @@ import { property, CSSResult, css, + customElement, } from "lit-element"; import "../components/hui-generic-entity-row"; @@ -14,8 +15,10 @@ import computeStateDisplay from "../../../common/entity/compute_state_display"; import { HomeAssistant } from "../../../types"; import { EntityRow, EntityConfig } from "./types"; +@customElement("hui-text-entity-row") class HuiTextEntityRow extends LitElement implements EntityRow { @property() public hass?: HomeAssistant; + @property() private _config?: EntityConfig; public setConfig(config: EntityConfig): void { @@ -71,5 +74,3 @@ declare global { "hui-text-entity-row": HuiTextEntityRow; } } - -customElements.define("hui-text-entity-row", HuiTextEntityRow); diff --git a/src/panels/lovelace/entity-rows/hui-timer-entity-row.ts b/src/panels/lovelace/entity-rows/hui-timer-entity-row.ts index 7e7383961d..1bcd3e64ef 100644 --- a/src/panels/lovelace/entity-rows/hui-timer-entity-row.ts +++ b/src/panels/lovelace/entity-rows/hui-timer-entity-row.ts @@ -4,6 +4,7 @@ import { TemplateResult, property, PropertyValues, + customElement, } from "lit-element"; import "../components/hui-generic-entity-row"; @@ -15,10 +16,14 @@ import { HomeAssistant } from "../../../types"; import { EntityConfig } from "./types"; import { HassEntity } from "home-assistant-js-websocket"; +@customElement("hui-timer-entity-row") class HuiTimerEntityRow extends LitElement { @property() public hass?: HomeAssistant; + @property() private _config?: EntityConfig; + @property() private _timeRemaining?: number; + private _interval?: number; public setConfig(config: EntityConfig): void { @@ -124,5 +129,3 @@ declare global { "hui-timer-entity-row": HuiTimerEntityRow; } } - -customElements.define("hui-timer-entity-row", HuiTimerEntityRow); diff --git a/src/panels/lovelace/entity-rows/hui-toggle-entity-row.ts b/src/panels/lovelace/entity-rows/hui-toggle-entity-row.ts index e91a47e460..0ac6a57ecc 100644 --- a/src/panels/lovelace/entity-rows/hui-toggle-entity-row.ts +++ b/src/panels/lovelace/entity-rows/hui-toggle-entity-row.ts @@ -1,8 +1,9 @@ import { html, LitElement, - PropertyDeclarations, TemplateResult, + customElement, + property, } from "lit-element"; import "../components/hui-generic-entity-row"; @@ -10,19 +11,15 @@ import "../../../components/entity/ha-entity-toggle"; import "../components/hui-warning"; import computeStateDisplay from "../../../common/entity/compute_state_display"; + import { HomeAssistant } from "../../../types"; import { EntityRow, EntityConfig } from "./types"; +@customElement("hui-toggle-entity-row") class HuiToggleEntityRow extends LitElement implements EntityRow { - public hass?: HomeAssistant; - private _config?: EntityConfig; + @property() public hass?: HomeAssistant; - static get properties(): PropertyDeclarations { - return { - hass: {}, - _config: {}, - }; - } + @property() private _config?: EntityConfig; public setConfig(config: EntityConfig): void { if (!config) { @@ -78,5 +75,3 @@ declare global { "hui-toggle-entity-row": HuiToggleEntityRow; } } - -customElements.define("hui-toggle-entity-row", HuiToggleEntityRow); diff --git a/src/panels/lovelace/special-rows/hui-call-service-row.ts b/src/panels/lovelace/special-rows/hui-call-service-row.ts index 0d89a7c986..479f45d7e2 100644 --- a/src/panels/lovelace/special-rows/hui-call-service-row.ts +++ b/src/panels/lovelace/special-rows/hui-call-service-row.ts @@ -1,4 +1,12 @@ -import { html, LitElement, TemplateResult } from "lit-element"; +import { + html, + LitElement, + TemplateResult, + customElement, + property, + css, + CSSResult, +} from "lit-element"; import "@material/mwc-button"; import "../../../components/ha-icon"; @@ -7,16 +15,11 @@ import { callService } from "../common/call-service"; import { EntityRow, CallServiceConfig } from "../entity-rows/types"; import { HomeAssistant } from "../../../types"; +@customElement("hui-call-service-row") class HuiCallServiceRow extends LitElement implements EntityRow { - public hass?: HomeAssistant; - private _config?: CallServiceConfig; + @property() public hass?: HomeAssistant; - static get properties() { - return { - hass: {}, - _config: {}, - }; - } + @property() private _config?: CallServiceConfig; public setConfig(config: CallServiceConfig): void { if (!config || !config.name || !config.service) { @@ -32,7 +35,6 @@ class HuiCallServiceRow extends LitElement implements EntityRow { } return html` - ${this.renderStyle()}
${this._config.name}
@@ -43,34 +45,32 @@ class HuiCallServiceRow extends LitElement implements EntityRow { `; } - private renderStyle(): TemplateResult { - return html` - + static get styles(): CSSResult { + return css` + :host { + display: flex; + align-items: center; + } + ha-icon { + padding: 8px; + color: var(--paper-item-icon-color); + } + .flex { + flex: 1; + overflow: hidden; + margin-left: 16px; + display: flex; + justify-content: space-between; + align-items: center; + } + .flex div { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } + mwc-button { + margin-right: -0.57em; + } `; } @@ -84,5 +84,3 @@ declare global { "hui-call-service-row": HuiCallServiceRow; } } - -customElements.define("hui-call-service-row", HuiCallServiceRow); diff --git a/src/panels/lovelace/special-rows/hui-divider-row.ts b/src/panels/lovelace/special-rows/hui-divider-row.ts index 38cead769e..0f6df4cee1 100644 --- a/src/panels/lovelace/special-rows/hui-divider-row.ts +++ b/src/panels/lovelace/special-rows/hui-divider-row.ts @@ -1,16 +1,19 @@ -import { html, LitElement, TemplateResult } from "lit-element"; +import { + html, + LitElement, + TemplateResult, + customElement, + property, +} from "lit-element"; + import { EntityRow, DividerConfig } from "../entity-rows/types"; import { HomeAssistant } from "../../../types"; +@customElement("hui-divider-row") class HuiDividerRow extends LitElement implements EntityRow { public hass?: HomeAssistant; - private _config?: DividerConfig; - static get properties() { - return { - _config: {}, - }; - } + @property() private _config?: DividerConfig; public setConfig(config): void { if (!config) { @@ -48,5 +51,3 @@ declare global { "hui-divider-row": HuiDividerRow; } } - -customElements.define("hui-divider-row", HuiDividerRow); diff --git a/src/panels/lovelace/special-rows/hui-section-row.ts b/src/panels/lovelace/special-rows/hui-section-row.ts index 0a038e91c6..21f09f10bc 100644 --- a/src/panels/lovelace/special-rows/hui-section-row.ts +++ b/src/panels/lovelace/special-rows/hui-section-row.ts @@ -1,18 +1,23 @@ -import { html, LitElement, TemplateResult } from "lit-element"; +import { + html, + LitElement, + TemplateResult, + customElement, + property, + css, + CSSResult, +} from "lit-element"; + import { EntityRow, SectionConfig } from "../entity-rows/types"; import { HomeAssistant } from "../../../types"; import "../../../components/ha-icon"; +@customElement("hui-section-row") class HuiSectionRow extends LitElement implements EntityRow { public hass?: HomeAssistant; - private _config?: SectionConfig; - static get properties() { - return { - _config: {}, - }; - } + @property() private _config?: SectionConfig; public setConfig(config: SectionConfig): void { if (!config) { @@ -28,7 +33,6 @@ class HuiSectionRow extends LitElement implements EntityRow { } return html` - ${this.renderStyle()}
${this._config.label ? html` @@ -38,24 +42,22 @@ class HuiSectionRow extends LitElement implements EntityRow { `; } - private renderStyle(): TemplateResult { - return html` - + static get styles(): CSSResult { + return css` + .label { + color: var(--primary-color); + margin-left: 8px; + margin-bottom: 16px; + margin-top: 16px; + } + .divider { + height: 1px; + background-color: var(--secondary-text-color); + opacity: 0.25; + margin-left: -16px; + margin-right: -16px; + margin-top: 8px; + } `; } } @@ -65,5 +67,3 @@ declare global { "hui-section-row": HuiSectionRow; } } - -customElements.define("hui-section-row", HuiSectionRow); diff --git a/src/panels/lovelace/special-rows/hui-weblink-row.ts b/src/panels/lovelace/special-rows/hui-weblink-row.ts index d06e8470c9..90ce800ec0 100644 --- a/src/panels/lovelace/special-rows/hui-weblink-row.ts +++ b/src/panels/lovelace/special-rows/hui-weblink-row.ts @@ -1,18 +1,23 @@ -import { html, LitElement, TemplateResult } from "lit-element"; +import { + html, + LitElement, + TemplateResult, + customElement, + property, + css, + CSSResult, +} from "lit-element"; + import { EntityRow, WeblinkConfig } from "../entity-rows/types"; import { HomeAssistant } from "../../../types"; import "../../../components/ha-icon"; +@customElement("hui-webline-row") class HuiWeblinkRow extends LitElement implements EntityRow { public hass?: HomeAssistant; - private _config?: WeblinkConfig; - static get properties() { - return { - _config: {}, - }; - } + @property() private _config?: WeblinkConfig; public setConfig(config: WeblinkConfig): void { if (!config || !config.url) { @@ -32,7 +37,6 @@ class HuiWeblinkRow extends LitElement implements EntityRow { } return html` - ${this.renderStyle()}
${this._config.name}
@@ -40,26 +44,24 @@ class HuiWeblinkRow extends LitElement implements EntityRow { `; } - private renderStyle(): TemplateResult { - return html` - + static get styles(): CSSResult { + return css` + a { + display: flex; + align-items: center; + color: var(--primary-color); + } + ha-icon { + padding: 8px; + color: var(--paper-item-icon-color); + } + div { + flex: 1; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + margin-left: 16px; + } `; } }