Add default hold actions (#6952)

Fixes #6942

src/panels/lovelace/cards/hui-button-card.ts

@@ -21,6 +21,7 @@ import { DOMAINS_TOGGLE } from "../../../common/const";
 import { applyThemesOnElement } from "../../../common/dom/apply_themes_on_element";
 import { computeActiveState } from "../../../common/entity/compute_active_state";
 import { computeDomain } from "../../../common/entity/compute_domain";
+import { computeStateDisplay } from "../../../common/entity/compute_state_display";
 import { computeStateDomain } from "../../../common/entity/compute_state_domain";
 import { computeStateName } from "../../../common/entity/compute_state_name";
 import { stateIcon } from "../../../common/entity/state_icon";
@@ -36,7 +37,6 @@ import { hasAction } from "../common/has-action";
 import { createEntityNotFoundWarning } from "../components/hui-warning";
 import { LovelaceCard, LovelaceCardEditor } from "../types";
 import { ButtonCardConfig } from "./types";
-import { computeStateDisplay } from "../../../common/entity/compute_state_display";
 
 @customElement("hui-button-card")
 export class HuiButtonCard extends LitElement implements LovelaceCard {
@@ -63,11 +63,6 @@ export class HuiButtonCard extends LitElement implements LovelaceCard {
 
     return {
       type: "button",
-      tap_action: { action: "toggle" },
-      hold_action: { action: "more-info" },
-      show_icon: true,
-      show_name: true,
-      show_state: false,
       entity: foundEntities[0] || "",
     };
   }
@@ -92,29 +87,18 @@ export class HuiButtonCard extends LitElement implements LovelaceCard {
     }
 
     this._config = {
+      tap_action: {
+        action:
+          config.entity && DOMAINS_TOGGLE.has(computeDomain(config.entity))
+            ? "toggle"
+            : "more-info",
+      },
       hold_action: { action: "more-info" },
-      double_tap_action: { action: "none" },
       show_icon: true,
       show_name: true,
       state_color: true,
       ...config,
     };
-
-    if (config.entity && DOMAINS_TOGGLE.has(computeDomain(config.entity))) {
-      this._config = {
-        tap_action: {
-          action: "toggle",
-        },
-        ...this._config,
-      };
-    } else {
-      this._config = {
-        tap_action: {
-          action: "more-info",
-        },
-        ...this._config,
-      };
-    }
   }
 
   protected shouldUpdate(changedProps: PropertyValues): boolean {

src/panels/lovelace/cards/hui-glance-card.ts

@@ -3,9 +3,9 @@ import {
   CSSResult,
   customElement,
   html,
+  internalProperty,
   LitElement,
   property,
-  internalProperty,
   PropertyValues,
   TemplateResult,
 } from "lit-element";
@@ -20,18 +20,22 @@ import "../../../components/entity/state-badge";
 import "../../../components/ha-card";
 import "../../../components/ha-icon";
 import { UNAVAILABLE_STATES } from "../../../data/entity";
-import { ActionHandlerEvent } from "../../../data/lovelace";
+import {
+  ActionHandlerEvent,
+  CallServiceActionConfig,
+  MoreInfoActionConfig,
+} from "../../../data/lovelace";
 import { HomeAssistant } from "../../../types";
 import { actionHandler } from "../common/directives/action-handler-directive";
 import { findEntities } from "../common/find-entites";
 import { handleAction } from "../common/handle-action";
 import { hasAction } from "../common/has-action";
 import { processConfigEntities } from "../common/process-config-entities";
+import "../components/hui-timestamp-display";
+import { createEntityNotFoundWarning } from "../components/hui-warning";
 import "../components/hui-warning-element";
 import { LovelaceCard, LovelaceCardEditor } from "../types";
-import "../components/hui-timestamp-display";
 import { GlanceCardConfig, GlanceConfigEntity } from "./types";
-import { createEntityNotFoundWarning } from "../components/hui-warning";
 
 @customElement("hui-glance-card")
 export class HuiGlanceCard extends LitElement implements LovelaceCard {
@@ -86,7 +90,14 @@ export class HuiGlanceCard extends LitElement implements LovelaceCard {
       state_color: true,
       ...config,
     };
-    const entities = processConfigEntities<GlanceConfigEntity>(config.entities);
+    const entities = processConfigEntities<GlanceConfigEntity>(
+      config.entities
+    ).map((entityConf) => {
+      return {
+        hold_action: { action: "more-info" } as MoreInfoActionConfig,
+        ...entityConf,
+      };
+    });
 
     for (const entity of entities) {
       if (
@@ -95,7 +106,7 @@ export class HuiGlanceCard extends LitElement implements LovelaceCard {
           !entity.tap_action.service) ||
         (entity.hold_action &&
           entity.hold_action.action === "call-service" &&
-          !entity.hold_action.service)
+          !(entity.hold_action as CallServiceActionConfig).service)
       ) {
         throw new Error(
           'Missing required property "service" when tap_action or hold_action is call-service'

src/panels/lovelace/cards/hui-light-card.ts

@@ -1,13 +1,13 @@
-import "../../../components/ha-icon-button";
+import { mdiDotsVertical } from "@mdi/js";
 import "@thomasloven/round-slider";
 import {
   css,
   CSSResult,
   customElement,
   html,
+  internalProperty,
   LitElement,
   property,
-  internalProperty,
   PropertyValues,
   TemplateResult,
 } from "lit-element";
@@ -20,7 +20,8 @@ import { computeStateName } from "../../../common/entity/compute_state_name";
 import { stateIcon } from "../../../common/entity/state_icon";
 import { supportsFeature } from "../../../common/entity/supports-feature";
 import "../../../components/ha-card";
-import { UNAVAILABLE_STATES, UNAVAILABLE } from "../../../data/entity";
+import "../../../components/ha-icon-button";
+import { UNAVAILABLE, UNAVAILABLE_STATES } from "../../../data/entity";
 import { SUPPORT_BRIGHTNESS } from "../../../data/light";
 import { ActionHandlerEvent } from "../../../data/lovelace";
 import { HomeAssistant, LightEntity } from "../../../types";
@@ -32,7 +33,6 @@ import { hasConfigOrEntityChanged } from "../common/has-changed";
 import { createEntityNotFoundWarning } from "../components/hui-warning";
 import { LovelaceCard, LovelaceCardEditor } from "../types";
 import { LightCardConfig } from "./types";
-import { mdiDotsVertical } from "@mdi/js";
 
 @customElement("hui-light-card")
 export class HuiLightCard extends LitElement implements LovelaceCard {
@@ -77,8 +77,9 @@ export class HuiLightCard extends LitElement implements LovelaceCard {
     }
 
     this._config = {
-      ...config,
       tap_action: { action: "toggle" },
+      hold_action: { action: "more-info" },
+      ...config,
     };
   }
 

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

@@ -3,9 +3,9 @@ import {
   CSSResult,
   customElement,
   html,
+  internalProperty,
   LitElement,
   property,
-  internalProperty,
   PropertyValues,
   TemplateResult,
 } from "lit-element";
@@ -28,10 +28,10 @@ import { hasAction } from "../common/has-action";
 import { hasConfigOrEntityChanged } from "../common/has-changed";
 import { processConfigEntities } from "../common/process-config-entities";
 import "../components/hui-image";
+import { createEntityNotFoundWarning } from "../components/hui-warning";
 import "../components/hui-warning-element";
 import { LovelaceCard, LovelaceCardEditor } from "../types";
 import { PictureGlanceCardConfig, PictureGlanceEntityConfig } from "./types";
-import { createEntityNotFoundWarning } from "../components/hui-warning";
 
 const STATES_OFF = new Set(["closed", "locked", "not_home", "off"]);
 
@@ -104,7 +104,10 @@ class HuiPictureGlanceCard extends LitElement implements LovelaceCard {
       }
     });
 
-    this._config = config;
+    this._config = {
+      hold_action: { action: "more-info" },
+      ...config,
+    };
   }
 
   protected shouldUpdate(changedProps: PropertyValues): boolean {
@@ -225,6 +228,7 @@ class HuiPictureGlanceCard extends LitElement implements LovelaceCard {
 
     entityConf = {
       tap_action: { action: dialog ? "more-info" : "toggle" },
+      hold_action: { action: "more-info" },
       ...entityConf,
     };
 

src/panels/lovelace/cards/hui-thermostat-card.ts

@@ -1,4 +1,4 @@
-import "../../../components/ha-icon-button";
+import { mdiDotsVertical } from "@mdi/js";
 import "@thomasloven/round-slider";
 import { HassEntity } from "home-assistant-js-websocket";
 import {
@@ -6,13 +6,13 @@ import {
   CSSResult,
   customElement,
   html,
+  internalProperty,
   LitElement,
   property,
-  internalProperty,
   PropertyValues,
+  query,
   svg,
   TemplateResult,
-  query,
 } from "lit-element";
 import { classMap } from "lit-html/directives/class-map";
 import { UNIT_F } from "../../../common/const";
@@ -20,6 +20,8 @@ import { applyThemesOnElement } from "../../../common/dom/apply_themes_on_elemen
 import { fireEvent } from "../../../common/dom/fire_event";
 import { computeStateName } from "../../../common/entity/compute_state_name";
 import "../../../components/ha-card";
+import type { HaCard } from "../../../components/ha-card";
+import "../../../components/ha-icon-button";
 import {
   ClimateEntity,
   CLIMATE_PRESET_NONE,
@@ -28,14 +30,11 @@ import {
 } from "../../../data/climate";
 import { UNAVAILABLE } from "../../../data/entity";
 import { HomeAssistant } from "../../../types";
-import { actionHandler } from "../common/directives/action-handler-directive";
 import { findEntities } from "../common/find-entites";
 import { hasConfigOrEntityChanged } from "../common/has-changed";
 import { createEntityNotFoundWarning } from "../components/hui-warning";
 import { LovelaceCard, LovelaceCardEditor } from "../types";
 import { ThermostatCardConfig } from "./types";
-import type { HaCard } from "../../../components/ha-card";
-import { mdiDotsVertical } from "@mdi/js";
 
 const modeIcons: { [mode in HvacMode]: string } = {
   auto: "hass:calendar-sync",
@@ -385,8 +384,7 @@ export class HuiThermostatCard extends LitElement implements LovelaceCard {
         class="${classMap({ "selected-icon": currentMode === mode })}"
         .mode="${mode}"
         .icon="${modeIcons[mode]}"
-        @action=${this._handleAction}
+        @click=${this._handleAction}
-        .actionHandler=${actionHandler()}
         tabindex="0"
       ></ha-icon-button>
     `;

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

@@ -62,11 +62,11 @@ export class HuiLightCardEditor extends LitElement
   }
 
   get _hold_action(): ActionConfig {
-    return this._config!.hold_action || { action: "none" };
+    return this._config!.hold_action || { action: "more-info" };
   }
 
-  get _double_tap_action(): ActionConfig {
+  get _double_tap_action(): ActionConfig | undefined {
-    return this._config!.double_tap_action || { action: "none" };
+    return this._config!.double_tap_action;
   }
 
   protected render(): TemplateResult {

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

@@ -90,12 +90,12 @@ export class HuiPictureGlanceCardEditor extends LitElement
     return this._config!.aspect_ratio || "";
   }
 
-  get _tap_action(): ActionConfig | undefined {
+  get _tap_action(): ActionConfig {
-    return this._config!.tap_action;
+    return this._config!.tap_action || { action: "toggle" };
   }
 
-  get _hold_action(): ActionConfig | undefined {
+  get _hold_action(): ActionConfig {
-    return this._config!.hold_action;
+    return this._config!.hold_action || { action: "more-info" };
   }
 
   get _theme(): string {

src/panels/lovelace/elements/hui-icon-element.ts

@@ -3,8 +3,8 @@ import {
   CSSResult,
   customElement,
   html,
-  LitElement,
   internalProperty,
+  LitElement,
   TemplateResult,
 } from "lit-element";
 import { ifDefined } from "lit-html/directives/if-defined";
@@ -28,7 +28,7 @@ export class HuiIconElement extends LitElement implements LovelaceElement {
       throw Error("Invalid Configuration: 'icon' required");
     }
 
-    this._config = config;
+    this._config = { hold_action: { action: "more-info" }, ...config };
   }
 
   protected render(): TemplateResult {

src/panels/lovelace/elements/hui-image-element.ts

@@ -3,9 +3,9 @@ import {
   CSSResult,
   customElement,
   html,
+  internalProperty,
   LitElement,
   property,
-  internalProperty,
   TemplateResult,
 } from "lit-element";
 import { ifDefined } from "lit-html/directives/if-defined";
@@ -29,12 +29,13 @@ export class HuiImageElement extends LitElement implements LovelaceElement {
       throw Error("Error in element configuration");
     }
 
+    this._config = { hold_action: { action: "more-info" }, ...config };
+
     // eslint-disable-next-line wc/no-self-class
     this.classList.toggle(
       "clickable",
-      config.tap_action && config.tap_action.action !== "none"
+      this._config.tap_action && this._config.tap_action.action !== "none"
     );
-    this._config = config;
   }
 
   protected render(): TemplateResult {

src/panels/lovelace/elements/hui-state-badge-element.ts

@@ -1,9 +1,9 @@
 import {
   customElement,
   html,
+  internalProperty,
   LitElement,
   property,
-  internalProperty,
   PropertyValues,
   TemplateResult,
 } from "lit-element";
@@ -16,9 +16,9 @@ import { actionHandler } from "../common/directives/action-handler-directive";
 import { handleAction } from "../common/handle-action";
 import { hasAction } from "../common/has-action";
 import { hasConfigOrEntityChanged } from "../common/has-changed";
+import { createEntityNotFoundWarning } from "../components/hui-warning";
 import "../components/hui-warning-element";
 import { LovelaceElement, StateBadgeElementConfig } from "./types";
-import { createEntityNotFoundWarning } from "../components/hui-warning";
 
 @customElement("hui-state-badge-element")
 export class HuiStateBadgeElement extends LitElement
@@ -32,7 +32,7 @@ export class HuiStateBadgeElement extends LitElement
       throw Error("Invalid Configuration: 'entity' required");
     }
 
-    this._config = config;
+    this._config = { hold_action: { action: "more-info" }, ...config };
   }
 
   protected shouldUpdate(changedProps: PropertyValues): boolean {

src/panels/lovelace/elements/hui-state-icon-element.ts

@@ -3,9 +3,9 @@ import {
   CSSResult,
   customElement,
   html,
+  internalProperty,
   LitElement,
   property,
-  internalProperty,
   PropertyValues,
   TemplateResult,
 } from "lit-element";
@@ -18,9 +18,9 @@ import { actionHandler } from "../common/directives/action-handler-directive";
 import { handleAction } from "../common/handle-action";
 import { hasAction } from "../common/has-action";
 import { hasConfigOrEntityChanged } from "../common/has-changed";
+import { createEntityNotFoundWarning } from "../components/hui-warning";
 import "../components/hui-warning-element";
 import { LovelaceElement, StateIconElementConfig } from "./types";
-import { createEntityNotFoundWarning } from "../components/hui-warning";
 
 @customElement("hui-state-icon-element")
 export class HuiStateIconElement extends LitElement implements LovelaceElement {
@@ -33,7 +33,11 @@ export class HuiStateIconElement extends LitElement implements LovelaceElement {
       throw Error("Invalid Configuration: 'entity' required");
     }
 
-    this._config = { state_color: true, ...config };
+    this._config = {
+      state_color: true,
+      hold_action: { action: "more-info" },
+      ...config,
+    };
   }
 
   protected shouldUpdate(changedProps: PropertyValues): boolean {

src/panels/lovelace/elements/hui-state-label-element.ts

@@ -3,9 +3,9 @@ import {
   CSSResult,
   customElement,
   html,
+  internalProperty,
   LitElement,
   property,
-  internalProperty,
   PropertyValues,
   TemplateResult,
 } from "lit-element";
@@ -18,9 +18,9 @@ import { actionHandler } from "../common/directives/action-handler-directive";
 import { handleAction } from "../common/handle-action";
 import { hasAction } from "../common/has-action";
 import { hasConfigOrEntityChanged } from "../common/has-changed";
+import { createEntityNotFoundWarning } from "../components/hui-warning";
 import "../components/hui-warning-element";
 import { LovelaceElement, StateLabelElementConfig } from "./types";
-import { createEntityNotFoundWarning } from "../components/hui-warning";
 
 @customElement("hui-state-label-element")
 class HuiStateLabelElement extends LitElement implements LovelaceElement {
@@ -33,7 +33,7 @@ class HuiStateLabelElement extends LitElement implements LovelaceElement {
       throw Error("Invalid Configuration: 'entity' required");
     }
 
-    this._config = config;
+    this._config = { hold_action: { action: "more-info" }, ...config };
   }
 
   protected shouldUpdate(changedProps: PropertyValues): boolean {