improve typing

Author: MindFreeze

src/panels/lovelace/cards/hui-picture-elements-card.ts

@@ -11,13 +11,12 @@ import { findEntities } from "../common/find-entities";
 import type { LovelaceElement, LovelaceElementConfig } from "../elements/types";
 import type { LovelaceCard, LovelaceCardEditor } from "../types";
 import { createStyledHuiElement } from "./picture-elements/create-styled-hui-element";
-import type { PictureElementsCardConfig } from "./types";
+import {
+  PREVIEW_CLICK_CALLBACK,
+  type PictureElementsCardConfig,
+} from "./types";
 import type { PersonEntity } from "../../../data/person";
 
-// Symbol for preview click callback - preserved through spreads, not serialized
-// This allows the editor to attach a callback that only exists on the edited card's config
-export const PREVIEW_CLICK_CALLBACK = Symbol("previewClickCallback");
-
 export type PreviewClickCallback = (x: number, y: number) => void;
 
 @customElement("hui-picture-elements-card")
@@ -230,23 +229,16 @@ class HuiPictureElementsCard extends LitElement implements LovelaceCard {
   }
 
   private _handleImageClick(ev: MouseEvent): void {
-    if (
-      !this.preview ||
-      !this._config ||
-      !(this._config as any)[PREVIEW_CLICK_CALLBACK]
-    ) {
+    if (!this.preview || !this._config?.[PREVIEW_CLICK_CALLBACK]) {
       return;
     }
 
     const rect = (ev.currentTarget as HTMLElement).getBoundingClientRect();
     const x = ((ev.clientX - rect.left) / rect.width) * 100;
     const y = ((ev.clientY - rect.top) / rect.height) * 100;
 
-    // Call the callback if present on config (only the edited card has this)
-    const callback = (this._config as any)[
-      PREVIEW_CLICK_CALLBACK
-    ] as PreviewClickCallback;
-    callback(x, y);
+    // only the edited card has this callback
+    this._config[PREVIEW_CLICK_CALLBACK](x, y);
   }
 }
 

src/panels/lovelace/cards/types.ts

@@ -483,6 +483,10 @@ export interface PictureCardConfig extends LovelaceCardConfig {
   alt_text?: string;
 }
 
+// Symbol for preview click callback - preserved through spreads, not serialized
+// This allows the editor to attach a callback that only exists on the edited card's config
+export const PREVIEW_CLICK_CALLBACK = Symbol("previewClickCallback");
+
 export interface PictureElementsCardConfig extends LovelaceCardConfig {
   title?: string;
   image?: string | MediaSelectorValue;
@@ -497,6 +501,7 @@ export interface PictureElementsCardConfig extends LovelaceCardConfig {
   theme?: string;
   dark_mode_image?: string | MediaSelectorValue;
   dark_mode_filter?: string;
+  [PREVIEW_CLICK_CALLBACK]?: (x: number, y: number) => void;
 }
 
 export interface PictureEntityCardConfig extends LovelaceCardConfig {

src/panels/lovelace/editor/config-elements/hui-picture-elements-card-editor.ts

@@ -21,13 +21,15 @@ import "../../../../components/ha-form/ha-form";
 import "../../../../components/ha-icon";
 import "../../../../components/ha-switch";
 import type { HomeAssistant } from "../../../../types";
-import type { PictureElementsCardConfig } from "../../cards/types";
+import {
+  PREVIEW_CLICK_CALLBACK,
+  type PictureElementsCardConfig,
+} from "../../cards/types";
 import type { LovelaceCardEditor } from "../../types";
 import "../hui-sub-element-editor";
 import { baseLovelaceCardConfig } from "../structs/base-card-struct";
 import type { EditDetailElementEvent, SubElementEditorConfig } from "../types";
 import { configElementStyle } from "./config-elements-style";
-import { PREVIEW_CLICK_CALLBACK } from "../../cards/hui-picture-elements-card";
 import "../hui-picture-elements-card-row-editor";
 import type { LovelaceElementConfig } from "../../elements/types";
 import type { LocalizeFunc } from "../../../../common/translations/localize";