@openremote/or-rules 1.8.0-snapshot.20250725074716 → 1.8.0-snapshot.20250725120001

package/lib/json-viewer/forms/or-rule-form-push-notification.js

@@ -1,63 +1,152 @@
-var __decorate=this&&this.__decorate||function(t,e,o,n){var i,r=arguments.length,a=r<3?e:null===n?n=Object.getOwnPropertyDescriptor(e,o):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(t,e,o,n);else for(var l=t.length-1;l>=0;l--)(i=t[l])&&(a=(r<3?i(a):r>3?i(e,o,a):i(e,o))||a);return r>3&&a&&Object.defineProperty(e,o,a),a},__awaiter=this&&this.__awaiter||function(t,e,o,n){return new(o||(o=Promise))(function(i,r){function a(t){try{c(n.next(t))}catch(t){r(t)}}function l(t){try{c(n.throw(t))}catch(t){r(t)}}function c(t){var e;t.done?i(t.value):((e=t.value)instanceof o?e:new o(function(t){t(e)})).then(a,l)}c((n=n.apply(t,e||[])).next())})};import{html as t,LitElement as e,css as o}from"lit";import{customElement as n,property as i}from"lit/decorators.js";import"@openremote/or-mwc-components/or-mwc-input";import r from"i18next";import{translate as a}from"@openremote/or-translate";import{InputType as l}from"@openremote/or-mwc-components/or-mwc-input";import{OrRulesJsonRuleChangedEvent as c}from"../or-rule-json-viewer";import{until as u}from"lit/directives/until.js";import{when as s}from"lit/directives/when.js";let OrRuleFormPushNotification=class extends a(r)(e){static get styles(){return o`
-            .input-small {
-                min-width: auto;
-            }
-
-            or-mwc-input {
-                margin-bottom: 20px;
-                min-width: 420px;
-                width: 100%;
-            }
-
-            .divider {
-                margin-bottom: 20px;
-                border-top: 1px solid rgba(0, 0, 0, 12%);
-            }
-        `}render(){return t`
-            ${s(this.message,()=>u(this._getPushNotificationForm(this.message),t`Loading...`),()=>t`<or-translate value="errorOccurred"></or-translate>`)}
-        `}_getPushNotificationForm(e){return __awaiter(this,arguments,void 0,function*(e,o=(t,e)=>__awaiter(this,void 0,void 0,function*(){return e})){var n,i,a,c,u,s;return t`
-            <form style="display:grid">
-                <or-mwc-input .value="${e.title}"
-                              @or-mwc-input-changed="${t=>o(t,e).then(e=>this._onTitleChange(t,e))}"
-                              .label="${r.t("subject")}"
-                              type="${l.TEXT}"
-                              required
-                              placeholder=" "></or-mwc-input>
-
-                <or-mwc-input .value="${e.body}"
-                              @or-mwc-input-changed="${t=>o(t,e).then(e=>this._onBodyChange(t,e))}"
-                              .label="${r.t("message")}"
-                              type="${l.TEXTAREA}"
-                              required
-                              placeholder=" "></or-mwc-input>
-                <or-mwc-input .value="${null==(n=e.action)?void 0:n.url}"
-                              @or-mwc-input-changed="${t=>o(t,e).then(e=>this._onActionUrlChange(t,e))}"
-                              .label="${r.t("openWebsiteUrl")}"
-                              type="${l.TEXT}"
-                              placeholder=" "></or-mwc-input>
-
-                <!-- Open in browser switch -->
-                <or-mwc-input .value="${null==(i=e.action)?void 0:i.openInBrowser}"
-                              @or-mwc-input-changed="${t=>o(t,e).then(e=>this._onOpenInBrowserChange(t,e))}"
-                              .label="${r.t("openInBrowser")}"
-                              type="${l.SWITCH}"
-                              fullWidth
-                              placeholder=" "></or-mwc-input>
-
-                <!-- Button controls -->
-                <div style="display: flex; gap: 20px;">
-                    <or-mwc-input .value="${null==(c=null==(a=e.buttons)?void 0:a[0])?void 0:c.title}"
-                                  @or-mwc-input-changed="${t=>o(t,e).then(e=>this._onButtonTitleChange(t,0,e))}"
-                                  .label="${r.t("buttonTextConfirm")}"
-                                  type="${l.TEXT}"
-                                  class="input-small"
-                                  placeholder=" "></or-mwc-input>
-                    <or-mwc-input .value="${null==(s=null==(u=e.buttons)?void 0:u[1])?void 0:s.title}"
-                                  @or-mwc-input-changed="${t=>o(t,e).then(e=>this._onButtonTitleChange(t,1,e))}"
-                                  .label="${r.t("buttonTextDecline")}"
-                                  type="${l.TEXT}"
-                                  class="input-small"
-                                  placeholder=" "></or-mwc-input>
-                </div>
-            </form>
-        `})}_onTitleChange(t,e){e.title=t.detail.value,this.dispatchEvent(new c)}_onBodyChange(t,e){e.body=t.detail.value,this.dispatchEvent(new c)}_onActionUrlChange(t,e){e.action=e.action||{},e.action.url=t.detail.value,this.dispatchEvent(new c)}_onOpenInBrowserChange(t,e){e.action=e.action||{},e.action.openInBrowser=t.detail.value,this.dispatchEvent(new c)}_onButtonTitleChange(t,e,o){o.buttons=o.buttons||[],o.buttons[e]={title:t.detail.value},this.dispatchEvent(new c)}};__decorate([i({type:Object})],OrRuleFormPushNotification.prototype,"message",void 0),OrRuleFormPushNotification=__decorate([n("or-rule-form-push-notification")],OrRuleFormPushNotification);export{OrRuleFormPushNotification};
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { html, LitElement, css } from "lit";
+import { customElement, property } from "lit/decorators.js";
+import "@openremote/or-mwc-components/or-mwc-input";
+import i18next from "i18next";
+import { translate } from "@openremote/or-translate";
+import { InputType } from "@openremote/or-mwc-components/or-mwc-input";
+import { OrRulesJsonRuleChangedEvent } from "../or-rule-json-viewer";
+import { until } from "lit/directives/until.js";
+import { when } from "lit/directives/when.js";
+let OrRuleFormPushNotification = class OrRuleFormPushNotification extends translate(i18next)(LitElement) {
+    static get styles() {
+        return css `
+            .input-small {
+                min-width: auto;
+            }
+
+            or-mwc-input {
+                margin-bottom: 20px;
+                min-width: 420px;
+                width: 100%;
+            }
+
+            .divider {
+                margin-bottom: 20px;
+                border-top: 1px solid rgba(0, 0, 0, 12%);
+            }
+        `;
+    }
+    render() {
+        return html `
+            ${when(this.message, () => until(this._getPushNotificationForm(this.message), html `Loading...`), () => html `<or-translate value="errorOccurred"></or-translate>`)}
+        `;
+    }
+    /**
+     * Internal function that returns a form for configuring a {@link PushNotificationMessage}.
+     * {@link onchange} is a callback function can be used to process changes before they are applied.
+     */
+    _getPushNotificationForm(message_1) {
+        return __awaiter(this, arguments, void 0, function* (message, onchange = (_ev, msg) => __awaiter(this, void 0, void 0, function* () { return msg; })) {
+            var _a, _b, _c, _d, _e, _f;
+            return html `
+            <form style="display:grid">
+                <or-mwc-input .value="${message.title}"
+                              @or-mwc-input-changed="${(ev) => onchange(ev, message).then(msg => this._onTitleChange(ev, msg))}"
+                              .label="${i18next.t("subject")}"
+                              type="${InputType.TEXT}"
+                              required
+                              placeholder=" "></or-mwc-input>
+
+                <or-mwc-input .value="${message.body}"
+                              @or-mwc-input-changed="${(ev) => onchange(ev, message).then(msg => this._onBodyChange(ev, msg))}"
+                              .label="${i18next.t("message")}"
+                              type="${InputType.TEXTAREA}"
+                              required
+                              placeholder=" "></or-mwc-input>
+                <or-mwc-input .value="${(_a = message.action) === null || _a === void 0 ? void 0 : _a.url}"
+                              @or-mwc-input-changed="${(ev) => onchange(ev, message).then(msg => this._onActionUrlChange(ev, msg))}"
+                              .label="${i18next.t("openWebsiteUrl")}"
+                              type="${InputType.TEXT}"
+                              placeholder=" "></or-mwc-input>
+
+                <!-- Open in browser switch -->
+                <or-mwc-input .value="${(_b = message.action) === null || _b === void 0 ? void 0 : _b.openInBrowser}"
+                              @or-mwc-input-changed="${(ev) => onchange(ev, message).then(msg => this._onOpenInBrowserChange(ev, msg))}"
+                              .label="${i18next.t("openInBrowser")}"
+                              type="${InputType.SWITCH}"
+                              fullWidth
+                              placeholder=" "></or-mwc-input>
+
+                <!-- Button controls -->
+                <div style="display: flex; gap: 20px;">
+                    <or-mwc-input .value="${(_d = (_c = message.buttons) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.title}"
+                                  @or-mwc-input-changed="${(ev) => onchange(ev, message).then(msg => this._onButtonTitleChange(ev, 0, msg))}"
+                                  .label="${i18next.t("buttonTextConfirm")}"
+                                  type="${InputType.TEXT}"
+                                  class="input-small"
+                                  placeholder=" "></or-mwc-input>
+                    <or-mwc-input .value="${(_f = (_e = message.buttons) === null || _e === void 0 ? void 0 : _e[1]) === null || _f === void 0 ? void 0 : _f.title}"
+                                  @or-mwc-input-changed="${(ev) => onchange(ev, message).then(msg => this._onButtonTitleChange(ev, 1, msg))}"
+                                  .label="${i18next.t("buttonTextDecline")}"
+                                  type="${InputType.TEXT}"
+                                  class="input-small"
+                                  placeholder=" "></or-mwc-input>
+                </div>
+            </form>
+        `;
+        });
+    }
+    /**
+     * HTML callback function when the subject of a notification message has changed.
+     */
+    _onTitleChange(ev, message) {
+        message.title = ev.detail.value;
+        this.dispatchEvent(new OrRulesJsonRuleChangedEvent());
+    }
+    /**
+     * HTML callback function when the body of a notification message has changed.
+     */
+    _onBodyChange(ev, message) {
+        message.body = ev.detail.value;
+        this.dispatchEvent(new OrRulesJsonRuleChangedEvent());
+    }
+    /**
+     * HTML callback function when the "click here to open URL" of a notification has changed.
+     */
+    _onActionUrlChange(ev, message) {
+        message.action = message.action || {};
+        message.action.url = ev.detail.value;
+        this.dispatchEvent(new OrRulesJsonRuleChangedEvent());
+    }
+    /**
+     * HTML callback function when the "open in browser switch" of a notification has changed.
+     */
+    _onOpenInBrowserChange(ev, message) {
+        message.action = message.action || {};
+        message.action.openInBrowser = ev.detail.value;
+        this.dispatchEvent(new OrRulesJsonRuleChangedEvent());
+    }
+    /**
+     * HTML callback function when any button text of the notification has changed.
+     */
+    _onButtonTitleChange(ev, key, message) {
+        message.buttons = message.buttons || [];
+        message.buttons[key] = {
+            title: ev.detail.value
+        };
+        this.dispatchEvent(new OrRulesJsonRuleChangedEvent());
+    }
+};
+__decorate([
+    property({ type: Object })
+], OrRuleFormPushNotification.prototype, "message", void 0);
+OrRuleFormPushNotification = __decorate([
+    customElement("or-rule-form-push-notification")
+], OrRuleFormPushNotification);
+export { OrRuleFormPushNotification };
+//# sourceMappingURL=or-rule-form-push-notification.js.map