diff --git a/custom_components/browser_mod/browser_mod.js b/custom_components/browser_mod/browser_mod.js index f133b7f..d72dc7b 100644 --- a/custom_components/browser_mod/browser_mod.js +++ b/custom_components/browser_mod/browser_mod.js @@ -1131,7 +1131,7 @@ class BrowserModPopup extends s { }, 10); } } - async setupDialog(title, content, { right_button = undefined, right_button_action = undefined, left_button = undefined, left_button_action = undefined, dismissable = true, dismiss_action = undefined, timeout = undefined, timeout_action = undefined, size = undefined, } = {}) { + async setupDialog(title, content, { right_button = undefined, right_button_action = undefined, left_button = undefined, left_button_action = undefined, dismissable = true, dismiss_action = undefined, timeout = undefined, timeout_action = undefined, size = undefined, style = undefined, } = {}) { this.title = title; if (content && typeof content === "object") { // Create a card from config in content @@ -1160,6 +1160,7 @@ class BrowserModPopup extends s { }; this.wide = size === "wide" ? "" : undefined; this.fullscreen = size === "fullscreen" ? "" : undefined; + this._style = style; } _primary() { var _a, _b, _c; @@ -1237,6 +1238,9 @@ class BrowserModPopup extends s { > ` : ""} + `; } @@ -1367,6 +1371,9 @@ __decorate([ __decorate([ e$2({ reflect: true }) ], BrowserModPopup.prototype, "fullscreen", void 0); +__decorate([ + e$2() +], BrowserModPopup.prototype, "_style", void 0); customElements.define("browser-mod-popup", BrowserModPopup); const PopupMixin = (SuperClass) => { return class PopupMixinClass extends SuperClass { @@ -1408,8 +1415,7 @@ const PopupMixin = (SuperClass) => { // }, // "" // ); - this._popupEl.setupDialog(...args); - this._popupEl.openDialog(); + this._popupEl.setupDialog(...args).then(() => this._popupEl.openDialog()); } closePopup(...args) { this._popupEl.closeDialog(); @@ -1989,7 +1995,7 @@ const BrowserIDMixin = (SuperClass) => { x Device -> Browser - Popups X Basic popups - - Card-mod integration + x Styling X Timeout X Fullscreen x Popup-card diff --git a/custom_components/browser_mod/services.yaml b/custom_components/browser_mod/services.yaml index 2981c2a..8f2c644 100644 --- a/custom_components/browser_mod/services.yaml +++ b/custom_components/browser_mod/services.yaml @@ -112,6 +112,11 @@ popup: description: Action to perform when popup is closed by timeout selector: object: + style: + name: Styles + description: CSS code to apply to the popup window + selector: + object: more_info: description: "Show more-info dialog" diff --git a/js/plugin/main.ts b/js/plugin/main.ts index 9a76216..ed1414e 100644 --- a/js/plugin/main.ts +++ b/js/plugin/main.ts @@ -24,7 +24,7 @@ import { BrowserIDMixin } from "./browserID"; x Device -> Browser - Popups X Basic popups - - Card-mod integration + x Styling X Timeout X Fullscreen x Popup-card diff --git a/js/plugin/popups.ts b/js/plugin/popups.ts index 294f7fd..5f7d36c 100644 --- a/js/plugin/popups.ts +++ b/js/plugin/popups.ts @@ -18,6 +18,7 @@ class BrowserModPopup extends LitElement { timeout; _timeoutStart; _timeoutTimer; + @property() _style; closeDialog() { this.open = false; @@ -50,6 +51,7 @@ class BrowserModPopup extends LitElement { timeout = undefined, timeout_action = undefined, size = undefined, + style = undefined, } = {} ) { this.title = title; @@ -81,6 +83,7 @@ class BrowserModPopup extends LitElement { }; this.wide = size === "wide" ? "" : undefined; this.fullscreen = size === "fullscreen" ? "" : undefined; + this._style = style; } _primary() { @@ -153,6 +156,9 @@ class BrowserModPopup extends LitElement { > ` : ""} + `; } @@ -303,8 +309,7 @@ export const PopupMixin = (SuperClass) => { // }, // "" // ); - this._popupEl.setupDialog(...args); - this._popupEl.openDialog(); + this._popupEl.setupDialog(...args).then(() => this._popupEl.openDialog()); } closePopup(...args) {