Add shared editor for all more info hints, add lights (#51542)

* Add more info redirect editor for light favorites

* Merge all hint feature editors to one shared component

* Fix
This commit is contained in:
Aidan Timson
2026-04-13 10:07:55 +01:00
committed by GitHub
parent 4a0284455d
commit e2e114cb4e
10 changed files with 31 additions and 121 deletions

View File

@@ -0,0 +1,8 @@
import type { LovelaceCardFeatureEditor } from "../types";
export async function getMoreInfoHintCardFeatureEditor(): Promise<LovelaceCardFeatureEditor> {
await import("../editor/config-elements/hui-card-feature-more-info-hint-editor");
return document.createElement(
"hui-card-feature-more-info-hint-editor"
) as LovelaceCardFeatureEditor;
}

View File

@@ -6,7 +6,6 @@ import {
normalizeCoverFavoritePositions,
} from "../../../data/cover";
import type { HomeAssistant } from "../../../types";
import type { LovelaceCardFeatureEditor } from "../types";
import {
HuiNumericFavoriteCardFeatureBase,
type NumericFavoriteCardFeatureDefinition,
@@ -16,6 +15,7 @@ import type {
CoverPositionFavoriteCardFeatureConfig,
LovelaceCardFeatureContext,
} from "./types";
import { getMoreInfoHintCardFeatureEditor } from "./get-more-info-hint-card-feature-editor";
const coverPositionFavoriteCardFeatureDefinition: NumericFavoriteCardFeatureDefinition<CoverEntity> =
{
@@ -58,12 +58,7 @@ class HuiCoverPositionFavoriteCardFeature extends HuiNumericFavoriteCardFeatureB
};
}
public static async getConfigElement(): Promise<LovelaceCardFeatureEditor> {
await import("../editor/config-elements/hui-cover-position-favorite-card-feature-editor");
return document.createElement(
"hui-cover-position-favorite-card-feature-editor"
);
}
public static getConfigElement = getMoreInfoHintCardFeatureEditor;
}
declare global {

View File

@@ -6,7 +6,6 @@ import {
normalizeCoverFavoritePositions,
} from "../../../data/cover";
import type { HomeAssistant } from "../../../types";
import type { LovelaceCardFeatureEditor } from "../types";
import {
HuiNumericFavoriteCardFeatureBase,
type NumericFavoriteCardFeatureDefinition,
@@ -16,6 +15,7 @@ import type {
CoverTiltFavoriteCardFeatureConfig,
LovelaceCardFeatureContext,
} from "./types";
import { getMoreInfoHintCardFeatureEditor } from "./get-more-info-hint-card-feature-editor";
const coverTiltFavoriteCardFeatureDefinition: NumericFavoriteCardFeatureDefinition<CoverEntity> =
{
@@ -59,12 +59,7 @@ class HuiCoverTiltFavoriteCardFeature extends HuiNumericFavoriteCardFeatureBase<
};
}
public static async getConfigElement(): Promise<LovelaceCardFeatureEditor> {
await import("../editor/config-elements/hui-cover-tilt-favorite-card-feature-editor");
return document.createElement(
"hui-cover-tilt-favorite-card-feature-editor"
);
}
public static getConfigElement = getMoreInfoHintCardFeatureEditor;
}
declare global {

View File

@@ -24,6 +24,7 @@ import {
} from "../../../data/entity/entity_registry";
import "../../../dialogs/more-info/components/lights/ha-favorite-color-button";
import { actionHandler } from "../common/directives/action-handler-directive";
import { getMoreInfoHintCardFeatureEditor } from "./get-more-info-hint-card-feature-editor";
const PILL_GAP = 8;
const PILL_MIN_SIZE = 32;
@@ -137,6 +138,8 @@ class HuiLightColorFavoritesCardFeature
};
}
public static getConfigElement = getMoreInfoHintCardFeatureEditor;
public setConfig(config: LightColorFavoritesCardFeatureConfig): void {
if (!config) {
throw new Error("Invalid configuration");

View File

@@ -6,7 +6,6 @@ import {
normalizeValveFavoritePositions,
valveSupportsPosition,
} from "../../../data/valve";
import type { LovelaceCardFeatureEditor } from "../types";
import {
HuiNumericFavoriteCardFeatureBase,
type NumericFavoriteCardFeatureDefinition,
@@ -16,6 +15,7 @@ import type {
LovelaceCardFeatureContext,
ValvePositionFavoriteCardFeatureConfig,
} from "./types";
import { getMoreInfoHintCardFeatureEditor } from "./get-more-info-hint-card-feature-editor";
const valvePositionFavoriteCardFeatureDefinition: NumericFavoriteCardFeatureDefinition<ValveEntity> =
{
@@ -58,12 +58,7 @@ class HuiValvePositionFavoriteCardFeature extends HuiNumericFavoriteCardFeatureB
};
}
public static async getConfigElement(): Promise<LovelaceCardFeatureEditor> {
await import("../editor/config-elements/hui-valve-position-favorite-card-feature-editor");
return document.createElement(
"hui-valve-position-favorite-card-feature-editor"
);
}
public static getConfigElement = getMoreInfoHintCardFeatureEditor;
}
declare global {

View File

@@ -1,15 +1,16 @@
import { html, LitElement, nothing } from "lit";
import { customElement, property, state } from "lit/decorators";
import "../../../../components/ha-alert";
import type { LocalizeKeys } from "../../../../common/translations/localize";
import type { HomeAssistant } from "../../../../types";
import type {
CoverTiltFavoriteCardFeatureConfig,
LovelaceCardFeatureConfig,
LovelaceCardFeatureContext,
} from "../../card-features/types";
import type { LovelaceCardFeatureEditor } from "../../types";
@customElement("hui-cover-tilt-favorite-card-feature-editor")
export class HuiCoverTiltFavoriteCardFeatureEditor
@customElement("hui-card-feature-more-info-hint-editor")
export class HuiCardFeatureMoreInfoHintEditor
extends LitElement
implements LovelaceCardFeatureEditor
{
@@ -17,9 +18,9 @@ export class HuiCoverTiltFavoriteCardFeatureEditor
@property({ attribute: false }) public context?: LovelaceCardFeatureContext;
@state() private _config?: CoverTiltFavoriteCardFeatureConfig;
@state() private _config?: LovelaceCardFeatureConfig;
public setConfig(config: CoverTiltFavoriteCardFeatureConfig): void {
public setConfig(config: LovelaceCardFeatureConfig): void {
this._config = config;
}
@@ -28,11 +29,12 @@ export class HuiCoverTiltFavoriteCardFeatureEditor
return nothing;
}
const descriptionKey =
`ui.panel.lovelace.editor.features.types.${this._config.type}.description` satisfies LocalizeKeys;
return html`
<ha-alert alert-type="info">
${this.hass.localize(
"ui.panel.lovelace.editor.features.types.cover-tilt-favorite.description"
)}
${this.hass.localize(descriptionKey)}
</ha-alert>
`;
}
@@ -40,6 +42,6 @@ export class HuiCoverTiltFavoriteCardFeatureEditor
declare global {
interface HTMLElementTagNameMap {
"hui-cover-tilt-favorite-card-feature-editor": HuiCoverTiltFavoriteCardFeatureEditor;
"hui-card-feature-more-info-hint-editor": HuiCardFeatureMoreInfoHintEditor;
}
}

View File

@@ -150,6 +150,7 @@ const EDITABLES_FEATURE_TYPES = new Set<UiFeatureTypes>([
"fan-preset-modes",
"humidifier-modes",
"lawn-mower-commands",
"light-color-favorites",
"media-player-volume-buttons",
"numeric-input",
"select-options",

View File

@@ -1,45 +0,0 @@
import { html, LitElement, nothing } from "lit";
import { customElement, property, state } from "lit/decorators";
import "../../../../components/ha-alert";
import type { HomeAssistant } from "../../../../types";
import type {
CoverPositionFavoriteCardFeatureConfig,
LovelaceCardFeatureContext,
} from "../../card-features/types";
import type { LovelaceCardFeatureEditor } from "../../types";
@customElement("hui-cover-position-favorite-card-feature-editor")
export class HuiCoverPositionFavoriteCardFeatureEditor
extends LitElement
implements LovelaceCardFeatureEditor
{
@property({ attribute: false }) public hass?: HomeAssistant;
@property({ attribute: false }) public context?: LovelaceCardFeatureContext;
@state() private _config?: CoverPositionFavoriteCardFeatureConfig;
public setConfig(config: CoverPositionFavoriteCardFeatureConfig): void {
this._config = config;
}
protected render() {
if (!this.hass || !this._config) {
return nothing;
}
return html`
<ha-alert alert-type="info">
${this.hass.localize(
"ui.panel.lovelace.editor.features.types.cover-position-favorite.description"
)}
</ha-alert>
`;
}
}
declare global {
interface HTMLElementTagNameMap {
"hui-cover-position-favorite-card-feature-editor": HuiCoverPositionFavoriteCardFeatureEditor;
}
}

View File

@@ -1,45 +0,0 @@
import { html, LitElement, nothing } from "lit";
import { customElement, property, state } from "lit/decorators";
import "../../../../components/ha-alert";
import type { HomeAssistant } from "../../../../types";
import type {
LovelaceCardFeatureContext,
ValvePositionFavoriteCardFeatureConfig,
} from "../../card-features/types";
import type { LovelaceCardFeatureEditor } from "../../types";
@customElement("hui-valve-position-favorite-card-feature-editor")
export class HuiValvePositionFavoriteCardFeatureEditor
extends LitElement
implements LovelaceCardFeatureEditor
{
@property({ attribute: false }) public hass?: HomeAssistant;
@property({ attribute: false }) public context?: LovelaceCardFeatureContext;
@state() private _config?: ValvePositionFavoriteCardFeatureConfig;
public setConfig(config: ValvePositionFavoriteCardFeatureConfig): void {
this._config = config;
}
protected render() {
if (!this.hass || !this._config) {
return nothing;
}
return html`
<ha-alert alert-type="info">
${this.hass.localize(
"ui.panel.lovelace.editor.features.types.valve-position-favorite.description"
)}
</ha-alert>
`;
}
}
declare global {
interface HTMLElementTagNameMap {
"hui-valve-position-favorite-card-feature-editor": HuiValvePositionFavoriteCardFeatureEditor;
}
}

View File

@@ -9767,7 +9767,8 @@
"label": "Light brightness"
},
"light-color-favorites": {
"label": "Light color favorites"
"label": "Light color favorites",
"description": "This feature uses the light's favorite colors. To edit them, open the light's more info dialog and press and hold a favorite."
},
"light-color-temp": {
"label": "Light color temperature"