Load selector elements dynamic (#14084)

Co-authored-by: Paul Bottein <paul.bottein@gmail.com>
This commit is contained in:
Bram Kragten
2022-10-13 14:28:49 +02:00
committed by GitHub
parent 9b19b6f203
commit fe9967550b
2 changed files with 42 additions and 53 deletions

View File

@@ -1,35 +1,38 @@
import { html, LitElement } from "lit";
import { html, LitElement, PropertyValues } from "lit";
import { customElement, property } from "lit/decorators";
import { dynamicElement } from "../../common/dom/dynamic-element-directive";
import type { Selector } from "../../data/selector";
import type { HomeAssistant } from "../../types";
import "./ha-selector-action";
import "./ha-selector-addon";
import "./ha-selector-area";
import "./ha-selector-attribute";
import "./ha-selector-boolean";
import "./ha-selector-color-rgb";
import "./ha-selector-config-entry";
import "./ha-selector-date";
import "./ha-selector-datetime";
import "./ha-selector-device";
import "./ha-selector-duration";
import "./ha-selector-entity";
import "./ha-selector-file";
import "./ha-selector-navigation";
import "./ha-selector-number";
import "./ha-selector-object";
import "./ha-selector-select";
import "./ha-selector-state";
import "./ha-selector-target";
import "./ha-selector-template";
import "./ha-selector-text";
import "./ha-selector-time";
import "./ha-selector-icon";
import "./ha-selector-media";
import "./ha-selector-theme";
import "./ha-selector-location";
import "./ha-selector-color-temp";
const LOAD_ELEMENTS = {
action: () => import("./ha-selector-action"),
addon: () => import("./ha-selector-addon"),
area: () => import("./ha-selector-area"),
attribute: () => import("./ha-selector-attribute"),
boolean: () => import("./ha-selector-boolean"),
"color-rgb": () => import("./ha-selector-color-rgb"),
"config-entry": () => import("./ha-selector-config-entry"),
date: () => import("./ha-selector-date"),
datetime: () => import("./ha-selector-datetime"),
device: () => import("./ha-selector-device"),
duration: () => import("./ha-selector-duration"),
entity: () => import("./ha-selector-entity"),
file: () => import("./ha-selector-file"),
navigation: () => import("./ha-selector-navigation"),
number: () => import("./ha-selector-number"),
object: () => import("./ha-selector-object"),
select: () => import("./ha-selector-select"),
state: () => import("./ha-selector-state"),
target: () => import("./ha-selector-target"),
template: () => import("./ha-selector-template"),
text: () => import("./ha-selector-text"),
time: () => import("./ha-selector-time"),
icon: () => import("./ha-selector-icon"),
media: () => import("./ha-selector-media"),
theme: () => import("./ha-selector-theme"),
location: () => import("./ha-selector-location"),
"color-temp": () => import("./ha-selector-color-temp"),
};
@customElement("ha-selector")
export class HaSelector extends LitElement {
@@ -59,6 +62,12 @@ export class HaSelector extends LitElement {
return Object.keys(this.selector)[0];
}
protected willUpdate(changedProps: PropertyValues) {
if (changedProps.has("selector") && this.selector) {
LOAD_ELEMENTS[this._type]?.();
}
}
protected render() {
return html`
${dynamicElement(`ha-selector-${this._type}`, {