diff --git a/src/data/lovelace.ts b/src/data/lovelace.ts
index 8b30d83ad1..103b1d147f 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 f3e77143f2..f2140227c3 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 001ceb6d50..d4ee03899a 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 472de0d87d..65d0ce16ea 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`