diff --git a/src/components/ha-chip.ts b/src/components/ha-chip.ts index d9fa23971f..fc427fd93d 100644 --- a/src/components/ha-chip.ts +++ b/src/components/ha-chip.ts @@ -1,13 +1,6 @@ // @ts-ignore import chipStyles from "@material/chips/dist/mdc.chips.min.css"; -import { - css, - CSSResultGroup, - html, - LitElement, - TemplateResult, - unsafeCSS, -} from "lit"; +import { css, CSSResultGroup, html, LitElement, nothing, unsafeCSS } from "lit"; import { customElement, property } from "lit/decorators"; @customElement("ha-chip") @@ -18,14 +11,14 @@ export class HaChip extends LitElement { @property({ type: Boolean }) public noText = false; - protected render(): TemplateResult { + protected render() { return html`
${this.hasIcon ? html`
` - : null} + : nothing}
@@ -36,7 +29,7 @@ export class HaChip extends LitElement { ? html`
` - : null} + : nothing}
`; } diff --git a/src/components/ha-form/ha-form-expandable.ts b/src/components/ha-form/ha-form-expandable.ts index 0c0c7bad64..86c108caac 100644 --- a/src/components/ha-form/ha-form-expandable.ts +++ b/src/components/ha-form/ha-form-expandable.ts @@ -1,4 +1,4 @@ -import { css, CSSResultGroup, html, LitElement, TemplateResult } from "lit"; +import { css, CSSResultGroup, html, LitElement, nothing } from "lit"; import { customElement, property } from "lit/decorators"; import type { HomeAssistant } from "../../types"; import "./ha-form"; @@ -26,7 +26,7 @@ export class HaFormExpendable extends LitElement implements HaFormElement { @property() public computeHelper?: (schema: HaFormSchema) => string; - protected render(): TemplateResult { + protected render() { return html`
` : this.schema.iconPath ? html` ` - : null} + : nothing} ${this.schema.title}
diff --git a/src/components/tile/ha-tile-image.ts b/src/components/tile/ha-tile-image.ts index 783b22583b..7ecb5af008 100644 --- a/src/components/tile/ha-tile-image.ts +++ b/src/components/tile/ha-tile-image.ts @@ -1,4 +1,4 @@ -import { CSSResultGroup, html, css, LitElement, TemplateResult } from "lit"; +import { CSSResultGroup, html, css, LitElement, nothing } from "lit"; import { customElement, property } from "lit/decorators"; import { ifDefined } from "lit/directives/if-defined"; @@ -8,12 +8,12 @@ export class HaTileImage extends LitElement { @property() public imageAlt?: string; - protected render(): TemplateResult { + protected render() { return html`
${this.imageUrl ? html`${ifDefined(this.imageAlt)}` - : null} + : nothing}
`; } diff --git a/src/components/tile/ha-tile-info.ts b/src/components/tile/ha-tile-info.ts index 5aa224884a..b28e373077 100644 --- a/src/components/tile/ha-tile-info.ts +++ b/src/components/tile/ha-tile-info.ts @@ -1,4 +1,11 @@ -import { CSSResultGroup, html, css, LitElement, TemplateResult } from "lit"; +import { + CSSResultGroup, + html, + css, + LitElement, + TemplateResult, + nothing, +} from "lit"; import { customElement, property } from "lit/decorators"; @customElement("ha-tile-info") @@ -7,13 +14,13 @@ export class HaTileInfo extends LitElement { @property() public secondary?: string | TemplateResult<1>; - protected render(): TemplateResult { + protected render() { return html`
${this.primary} ${this.secondary ? html`${this.secondary}` - : null} + : nothing}
`; } diff --git a/src/dialogs/more-info/controls/more-info-fan.ts b/src/dialogs/more-info/controls/more-info-fan.ts index b094d723bd..701dff67a2 100644 --- a/src/dialogs/more-info/controls/more-info-fan.ts +++ b/src/dialogs/more-info/controls/more-info-fan.ts @@ -15,7 +15,6 @@ import { LitElement, nothing, PropertyValues, - TemplateResult, } from "lit"; import { customElement, property, state } from "lit/decorators"; import { stopPropagation } from "../../../common/dom/stop_propagation"; @@ -114,9 +113,9 @@ class MoreInfoFan extends LitElement { } } - protected render(): TemplateResult | null { + protected render() { if (!this.hass || !this.stateObj) { - return null; + return nothing; } const supportsSpeed = supportsFeature( @@ -185,7 +184,7 @@ class MoreInfoFan extends LitElement { ` - : null} + : nothing} ${supportsDirection ? html` ` - : null} + : nothing} ${supportsColorTemp || supportsColor ? html` ` - : null} + : nothing} ${supportsWhite ? html` ` - : null} + : nothing} ${supportsEffects && this.stateObj.attributes.effect_list ? html` ` - : null} + : nothing}
` - : null} + : nothing} ${item.altText} ` - : null} + : nothing} `; } diff --git a/src/dialogs/restart/dialog-restart.ts b/src/dialogs/restart/dialog-restart.ts index 506b961823..880c909619 100644 --- a/src/dialogs/restart/dialog-restart.ts +++ b/src/dialogs/restart/dialog-restart.ts @@ -126,7 +126,7 @@ class DialogRestart extends LitElement { ` - : null} + : nothing}
` - : null} + : nothing} `} `; diff --git a/src/panels/config/hardware/ha-config-hardware.ts b/src/panels/config/hardware/ha-config-hardware.ts index 9e0cbea2a1..ee910d622e 100644 --- a/src/panels/config/hardware/ha-config-hardware.ts +++ b/src/panels/config/hardware/ha-config-hardware.ts @@ -3,7 +3,7 @@ import "@material/mwc-list/mwc-list-item"; import { mdiPower } from "@mdi/js"; import type { ChartOptions } from "chart.js"; import { UnsubscribeFunc } from "home-assistant-js-websocket"; -import { css, html, LitElement, PropertyValues, TemplateResult } from "lit"; +import { css, html, LitElement, nothing, PropertyValues } from "lit"; import { customElement, property, state } from "lit/decorators"; import { ifDefined } from "lit/directives/if-defined"; import { isComponentLoaded } from "../../../common/config/is_component_loaded"; @@ -209,7 +209,7 @@ class HaConfigHardware extends SubscribeMixin(LitElement) { } } - protected render(): TemplateResult { + protected render() { let boardId: string | undefined; let boardName: string | undefined; let imageURL: string | undefined; @@ -343,7 +343,7 @@ class HaConfigHardware extends SubscribeMixin(LitElement) { )} ` - : null} + : nothing} ${isComponentLoaded(this.hass, "hassio") ? html` @@ -352,7 +352,7 @@ class HaConfigHardware extends SubscribeMixin(LitElement) { )} ` - : null} + : nothing} ` : ""} diff --git a/src/panels/config/integrations/ha-config-integrations.ts b/src/panels/config/integrations/ha-config-integrations.ts index ef751029a0..797c7db8a4 100644 --- a/src/panels/config/integrations/ha-config-integrations.ts +++ b/src/panels/config/integrations/ha-config-integrations.ts @@ -7,8 +7,8 @@ import { CSSResultGroup, html, LitElement, + nothing, PropertyValues, - TemplateResult, } from "lit"; import { customElement, property, state } from "lit/decorators"; import { ifDefined } from "lit/directives/if-defined"; @@ -357,7 +357,7 @@ class HaConfigIntegrations extends SubscribeMixin(LitElement) { } } - protected render(): TemplateResult { + protected render() { if (!this._configEntries) { return html`` ) : this._filter && diff --git a/src/panels/lovelace/cards/hui-tile-card.ts b/src/panels/lovelace/cards/hui-tile-card.ts index a389d196ae..95339dcac5 100644 --- a/src/panels/lovelace/cards/hui-tile-card.ts +++ b/src/panels/lovelace/cards/hui-tile-card.ts @@ -320,7 +320,7 @@ export class HuiTileCard extends LitElement implements LovelaceCard { return html` - ${this._shouldRenderRipple ? html`` : null} + ${this._shouldRenderRipple ? html`` : nothing}
` - : null} + : nothing}
` - : null} + : nothing} ${this.hass.localize( `ui.panel.lovelace.editor.color-picker.default_color` diff --git a/src/panels/lovelace/editor/config-elements/hui-tile-card-features-editor.ts b/src/panels/lovelace/editor/config-elements/hui-tile-card-features-editor.ts index 0b4563b4a1..c162d8a1b7 100644 --- a/src/panels/lovelace/editor/config-elements/hui-tile-card-features-editor.ts +++ b/src/panels/lovelace/editor/config-elements/hui-tile-card-features-editor.ts @@ -1,6 +1,6 @@ import { mdiDelete, mdiDrag, mdiListBox, mdiPencil, mdiPlus } from "@mdi/js"; import { HassEntity } from "home-assistant-js-websocket"; -import { css, CSSResultGroup, html, LitElement, TemplateResult } from "lit"; +import { css, CSSResultGroup, html, LitElement, nothing } from "lit"; import { customElement, property } from "lit/decorators"; import { repeat } from "lit/directives/repeat"; import type { SortableEvent } from "sortablejs"; @@ -150,9 +150,9 @@ export class HuiTileCardFeaturesEditor extends LitElement { .filter((type) => this._supportsFeatureType(type)); } - protected render(): TemplateResult | null { + protected render() { if (!this.features || !this.hass) { - return null; + return nothing; } const supportedFeaturesType = this._getSupportedFeaturesType(); @@ -179,7 +179,7 @@ export class HuiTileCardFeaturesEditor extends LitElement { )} ` - : null} + : nothing}
${repeat( this.features, @@ -204,7 +204,7 @@ export class HuiTileCardFeaturesEditor extends LitElement { )} ` - : null} + : nothing}
${editable @@ -220,7 +220,7 @@ export class HuiTileCardFeaturesEditor extends LitElement { .disabled=${!supported} > ` - : null} + : nothing} 0 && customTypes.length > 0 ? html`
  • ` - : null} + : nothing} ${customTypes.map( (type) => html` @@ -270,7 +270,7 @@ export class HuiTileCardFeaturesEditor extends LitElement { )} ` - : null} + : nothing} `; diff --git a/src/panels/lovelace/editor/select-view/hui-dialog-select-view.ts b/src/panels/lovelace/editor/select-view/hui-dialog-select-view.ts index c4828be5d3..24c8412883 100644 --- a/src/panels/lovelace/editor/select-view/hui-dialog-select-view.ts +++ b/src/panels/lovelace/editor/select-view/hui-dialog-select-view.ts @@ -111,7 +111,7 @@ export class HuiDialogSelectView extends LitElement { icon) ? "icon" - : null} + : nothing} @click=${this._viewChanged} .value=${idx.toString()} .selected=${this._selectedViewIdx === idx} diff --git a/src/panels/lovelace/tile-features/hui-cover-open-close-tile-feature.ts b/src/panels/lovelace/tile-features/hui-cover-open-close-tile-feature.ts index 8a4fe2c7cb..675407eb6d 100644 --- a/src/panels/lovelace/tile-features/hui-cover-open-close-tile-feature.ts +++ b/src/panels/lovelace/tile-features/hui-cover-open-close-tile-feature.ts @@ -1,6 +1,6 @@ import { mdiStop } from "@mdi/js"; import { HassEntity } from "home-assistant-js-websocket"; -import { css, html, LitElement, TemplateResult } from "lit"; +import { css, html, LitElement, nothing } from "lit"; import { customElement, property, state } from "lit/decorators"; import { computeDomain } from "../../../common/entity/compute_domain"; import { @@ -74,14 +74,14 @@ class HuiCoverOpenCloseTileFeature }); } - protected render(): TemplateResult | null { + protected render() { if ( !this._config || !this.hass || !this.stateObj || !supportsCoverOpenCloseTileFeature(this.stateObj) ) { - return null; + return nothing; } return html` @@ -100,7 +100,7 @@ class HuiCoverOpenCloseTileFeature > ` - : null} + : nothing} ${supportsFeature(this.stateObj, CoverEntityFeature.STOP) ? html` ` - : null} + : nothing} ${supportsFeature(this.stateObj, CoverEntityFeature.CLOSE) ? html` ` - : undefined} + : nothing} `; } diff --git a/src/panels/lovelace/tile-features/hui-cover-tilt-tile-feature.ts b/src/panels/lovelace/tile-features/hui-cover-tilt-tile-feature.ts index e2545048e7..3356440123 100644 --- a/src/panels/lovelace/tile-features/hui-cover-tilt-tile-feature.ts +++ b/src/panels/lovelace/tile-features/hui-cover-tilt-tile-feature.ts @@ -1,6 +1,6 @@ import { mdiArrowBottomLeft, mdiArrowTopRight, mdiStop } from "@mdi/js"; import { HassEntity } from "home-assistant-js-websocket"; -import { css, html, LitElement, TemplateResult } from "lit"; +import { css, html, LitElement, nothing } from "lit"; import { customElement, property, state } from "lit/decorators"; import { computeDomain } from "../../../common/entity/compute_domain"; import { supportsFeature } from "../../../common/entity/supports-feature"; @@ -70,14 +70,14 @@ class HuiCoverTiltTileFeature }); } - protected render(): TemplateResult | null { + protected render() { if ( !this._config || !this.hass || !this.stateObj || !supportsCoverTiltTileFeature ) { - return null; + return nothing; } return html` @@ -94,7 +94,7 @@ class HuiCoverTiltTileFeature ` - : null} + : nothing} ${supportsFeature(this.stateObj, CoverEntityFeature.STOP_TILT) ? html` ` - : null} + : nothing} ${supportsFeature(this.stateObj, CoverEntityFeature.CLOSE_TILT) ? html` ` - : undefined} + : nothing} `; } diff --git a/src/panels/lovelace/tile-features/hui-fan-speed-tile-feature.ts b/src/panels/lovelace/tile-features/hui-fan-speed-tile-feature.ts index 464d3cba22..5a67ea5bf1 100644 --- a/src/panels/lovelace/tile-features/hui-fan-speed-tile-feature.ts +++ b/src/panels/lovelace/tile-features/hui-fan-speed-tile-feature.ts @@ -1,5 +1,5 @@ import { HassEntity } from "home-assistant-js-websocket"; -import { css, html, LitElement, TemplateResult } from "lit"; +import { css, html, LitElement, nothing } from "lit"; import { customElement, property, state } from "lit/decorators"; import { computeAttributeNameDisplay } from "../../../common/entity/compute_attribute_display"; import { computeDomain } from "../../../common/entity/compute_domain"; @@ -67,14 +67,14 @@ class HuiFanSpeedTileFeature extends LitElement implements LovelaceTileFeature { ); } - protected render(): TemplateResult | null { + protected render() { if ( !this._config || !this.hass || !this.stateObj || !supportsFanSpeedTileFeature(this.stateObj) ) { - return null; + return nothing; } const speedCount = computeFanSpeedCount(this.stateObj); diff --git a/src/panels/lovelace/tile-features/hui-light-brightness-tile-feature.ts b/src/panels/lovelace/tile-features/hui-light-brightness-tile-feature.ts index 3476cece85..01d1e763cf 100644 --- a/src/panels/lovelace/tile-features/hui-light-brightness-tile-feature.ts +++ b/src/panels/lovelace/tile-features/hui-light-brightness-tile-feature.ts @@ -1,5 +1,5 @@ import { HassEntity } from "home-assistant-js-websocket"; -import { css, html, LitElement, TemplateResult } from "lit"; +import { css, html, LitElement, nothing } from "lit"; import { customElement, property, state } from "lit/decorators"; import { computeDomain } from "../../../common/entity/compute_domain"; import { stateActive } from "../../../common/entity/state_active"; @@ -39,14 +39,14 @@ class HuiLightBrightnessTileFeature this._config = config; } - protected render(): TemplateResult | null { + protected render() { if ( !this._config || !this.hass || !this.stateObj || !supportsLightBrightnessTileFeature(this.stateObj) ) { - return null; + return nothing; } const position = diff --git a/src/panels/lovelace/tile-features/hui-vacuum-commands-tile-feature.ts b/src/panels/lovelace/tile-features/hui-vacuum-commands-tile-feature.ts index 4b1993fa2f..3c4119511c 100644 --- a/src/panels/lovelace/tile-features/hui-vacuum-commands-tile-feature.ts +++ b/src/panels/lovelace/tile-features/hui-vacuum-commands-tile-feature.ts @@ -8,7 +8,7 @@ import { mdiTargetVariant, } from "@mdi/js"; import { HassEntity } from "home-assistant-js-websocket"; -import { css, html, LitElement, TemplateResult } from "lit"; +import { css, html, LitElement, nothing } from "lit"; import { customElement, property, state } from "lit/decorators"; import { computeDomain } from "../../../common/entity/compute_domain"; import { supportsFeature } from "../../../common/entity/supports-feature"; @@ -169,14 +169,14 @@ class HuiVacuumCommandTileFeature }); } - protected render(): TemplateResult | null { + protected render() { if ( !this._config || !this.hass || !this.stateObj || !supportsVacuumCommandTileFeature(this.stateObj) ) { - return null; + return nothing; } const stateObj = this.stateObj as VacuumEntity;