diff --git a/src/data/lovelace.ts b/src/data/lovelace.ts index 8b30d83ad12d..103b1d147fb6 100644 --- a/src/data/lovelace.ts +++ b/src/data/lovelace.ts @@ -45,6 +45,11 @@ export interface NavigateActionConfig { navigation_path: string; } +export interface UrlActionConfig { + action: "url"; + url_path: string; +} + export interface MoreInfoActionConfig { action: "more-info"; } @@ -57,6 +62,7 @@ export type ActionConfig = | ToggleActionConfig | CallServiceActionConfig | NavigateActionConfig + | UrlActionConfig | MoreInfoActionConfig | NoActionConfig; diff --git a/src/panels/lovelace/common/compute-tooltip.ts b/src/panels/lovelace/common/compute-tooltip.ts index f3e77143f20c..f2140227c3d2 100644 --- a/src/panels/lovelace/common/compute-tooltip.ts +++ b/src/panels/lovelace/common/compute-tooltip.ts @@ -66,6 +66,13 @@ function computeActionTooltip( config.navigation_path )}`; break; + case "url": + tooltip += `${hass.localize( + "ui.panel.lovelace.cards.picture-elements.url", + "url_path", + config.url_path + )}`; + break; case "toggle": tooltip += `${hass.localize( "ui.panel.lovelace.cards.picture-elements.toggle", diff --git a/src/panels/lovelace/common/handle-click.ts b/src/panels/lovelace/common/handle-click.ts index 001ceb6d5025..d4ee03899a13 100644 --- a/src/panels/lovelace/common/handle-click.ts +++ b/src/panels/lovelace/common/handle-click.ts @@ -43,6 +43,11 @@ export const handleClick = ( navigate(node, actionConfig.navigation_path); } break; + case "url": + if (actionConfig.url_path) { + window.open(actionConfig.url_path); + } + break; case "toggle": if (config.entity) { toggleEntity(hass, config.entity!); diff --git a/src/panels/lovelace/components/hui-action-editor.ts b/src/panels/lovelace/components/hui-action-editor.ts index 472de0d87dbb..65d0ce16ea3a 100644 --- a/src/panels/lovelace/components/hui-action-editor.ts +++ b/src/panels/lovelace/components/hui-action-editor.ts @@ -19,6 +19,7 @@ import { ActionConfig, NavigateActionConfig, CallServiceActionConfig, + UrlActionConfig, } from "../../../data/lovelace"; declare global { @@ -51,6 +52,11 @@ export class HuiActionEditor extends LitElement { return config.navigation_path || ""; } + get _url_path(): string { + const config = this.config! as UrlActionConfig; + return config.url_path || ""; + } + get _service(): string { const config = this.config! as CallServiceActionConfig; return config.service || ""; @@ -87,6 +93,16 @@ export class HuiActionEditor extends LitElement { > ` : ""} + ${this._action === "url" + ? html` + + ` + : ""} ${this.config && this.config.action === "call-service" ? html`