Lovelace: Datetime and text to match look select (#11836)

This commit is contained in:
Paulus Schoutsen 2022-02-24 10:16:42 -08:00 committed by GitHub
parent 4e57fb1ec1
commit 02d058561b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 38 additions and 22 deletions

View File

@ -16,6 +16,7 @@ import "../components/hui-generic-entity-row";
import { createEntityNotFoundWarning } from "../components/hui-warning";
import type { EntityConfig, LovelaceRow } from "./types";
import "../../../components/ha-time-input";
import { computeStateName } from "../../../common/entity/compute_state_name";
@customElement("hui-input-datetime-entity-row")
class HuiInputDatetimeEntityRow extends LitElement implements LovelaceRow {
@ -49,11 +50,19 @@ class HuiInputDatetimeEntityRow extends LitElement implements LovelaceRow {
`;
}
const name = this._config.name || computeStateName(stateObj);
return html`
<hui-generic-entity-row .hass=${this.hass} .config=${this._config}>
<hui-generic-entity-row
.hass=${this.hass}
.config=${this._config}
.hideName=${stateObj.attributes.has_date &&
stateObj.attributes.has_time}
>
${stateObj.attributes.has_date
? html`
<ha-date-input
.label=${stateObj.attributes.has_time ? name : undefined}
.locale=${this.hass.locale}
.disabled=${UNAVAILABLE_STATES.includes(stateObj.state)}
.value=${`${stateObj.attributes.year}-${stateObj.attributes.month}-${stateObj.attributes.day}`}

View File

@ -1,12 +1,5 @@
import "@material/mwc-list/mwc-list-item";
import {
css,
CSSResultGroup,
html,
LitElement,
PropertyValues,
TemplateResult,
} from "lit";
import { css, html, LitElement, PropertyValues, TemplateResult } from "lit";
import { customElement, property, state } from "lit/decorators";
import { stopPropagation } from "../../../common/dom/stop_propagation";
import { computeStateName } from "../../../common/entity/compute_state_name";
@ -87,17 +80,15 @@ class HuiInputSelectEntityRow extends LitElement implements LovelaceRow {
`;
}
static get styles(): CSSResultGroup {
return css`
hui-generic-entity-row {
display: flex;
align-items: center;
}
ha-select {
width: 100%;
}
`;
}
static styles = css`
hui-generic-entity-row {
display: flex;
align-items: center;
}
ha-select {
width: 100%;
}
`;
private _selectedChanged(ev): void {
const stateObj = this.hass!.states[this._config!.entity];

View File

@ -1,4 +1,4 @@
import { html, LitElement, PropertyValues, TemplateResult } from "lit";
import { css, html, LitElement, PropertyValues, TemplateResult } from "lit";
import { customElement, property, state } from "lit/decorators";
import { UNAVAILABLE, UNAVAILABLE_STATES } from "../../../data/entity";
import { setValue } from "../../../data/input_text";
@ -8,6 +8,7 @@ import "../components/hui-generic-entity-row";
import { createEntityNotFoundWarning } from "../components/hui-warning";
import { EntityConfig, LovelaceRow } from "./types";
import "../../../components/ha-textfield";
import { computeStateName } from "../../../common/entity/compute_state_name";
@customElement("hui-input-text-entity-row")
class HuiInputTextEntityRow extends LitElement implements LovelaceRow {
@ -42,8 +43,13 @@ class HuiInputTextEntityRow extends LitElement implements LovelaceRow {
}
return html`
<hui-generic-entity-row .hass=${this.hass} .config=${this._config}>
<hui-generic-entity-row
.hass=${this.hass}
.config=${this._config}
hideName
>
<ha-textfield
.label=${this._config.name || computeStateName(stateObj)}
.disabled=${stateObj.state === UNAVAILABLE}
.value=${stateObj.state}
.minlength=${stateObj.attributes.min}
@ -75,6 +81,16 @@ class HuiInputTextEntityRow extends LitElement implements LovelaceRow {
ev.target.blur();
}
static styles = css`
hui-generic-entity-row {
display: flex;
align-items: center;
}
ha-textfield {
width: 100%;
}
`;
}
declare global {