@openremote/or-rules 1.8.0-snapshot.20250723203453 → 1.8.0-snapshot.20250725120000

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

@@ -1,102 +1,297 @@
-var __decorate=this&&this.__decorate||function(e,t,o,i){var n,r=arguments.length,s=r<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,o):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,o,i);else for(var a=e.length-1;a>=0;a--)(n=e[a])&&(s=(r<3?n(s):r>3?n(t,o,s):n(t,o))||s);return r>3&&s&&Object.defineProperty(t,o,s),s};import{InputType}from"@openremote/or-mwc-components/or-mwc-input";import{i18next}from"@openremote/or-translate";import{css,html,LitElement}from"lit";import{customElement,property,state}from"lit/decorators.js";import{when}from"lit/directives/when.js";import{OrRulesJsonRuleChangedEvent}from"../or-rule-json-viewer";const styling=css`
-    .divider {
-        border-bottom: 1px solid rgba(0, 0, 0, 12%);
+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;
+};
+import { InputType } from "@openremote/or-mwc-components/or-mwc-input";
+import { i18next } from "@openremote/or-translate";
+import { css, html, LitElement } from "lit";
+import { customElement, property, state } from "lit/decorators.js";
+import { when } from 'lit/directives/when.js';
+import { OrRulesJsonRuleChangedEvent } from "../or-rule-json-viewer";
+//language=css
+const styling = css `
+    .divider {
+        border-bottom: 1px solid rgba(0, 0, 0, 12%);
+    }
+`;
+let OrRuleFormWebhook = class OrRuleFormWebhook extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.loading = false;
+        this.httpMethodOptions = ["GET" /* HTTPMethod.GET */, "POST" /* HTTPMethod.POST */, "PUT" /* HTTPMethod.PUT */, "DELETE" /* HTTPMethod.DELETE */];
+        this.authMethodOptions = new Map([
+            ["username_password", (i18next.t('username') + " & " + i18next.t('password'))],
+            ["client_credentials", "oauth Client Credentials Grant"],
+            ["password", "oauth Password Grant"]
+        ]);
     }
-`;let OrRuleFormWebhook=class extends LitElement{constructor(){super(...arguments),this.loading=!1,this.httpMethodOptions=["GET","POST","PUT","DELETE"],this.authMethodOptions=new Map([["username_password",i18next.t("username")+" & "+i18next.t("password")],["client_credentials","oauth Client Credentials Grant"],["password","oauth Password Grant"]])}static get styles(){return[styling]}shouldUpdate(e){return e.has("webhook")&&null==this.webhook.headers&&(this.webhook.headers={}),super.shouldUpdate(e)}getAuthMethod(e){return null!=e.oAuthGrant?this.authMethodOptions.get(e.oAuthGrant.grant_type):this.authMethodOptions.get("username_password")}getOAuthGrant(e){return"client_credentials"==e||"password"==e?{grant_type:e}:void 0}reloadHeaders(){this.loading=!0,this.updateComplete.then((()=>this.loading=!1)),this.notifyWebhookUpdate(!1)}notifyWebhookUpdate(e=!0){e&&this.requestUpdate("webhook"),this.dispatchEvent(new OrRulesJsonRuleChangedEvent)}render(){return when(!this.webhook,(()=>html`
-            ${i18next.t("errorOccurred")}
-        `),(()=>html`
-            <form style="display: flex; flex-direction: column; min-width: 520px;">
-                <!-- HTTP Method & URL -->
-                <div style="display: flex; flex-direction: row; align-items: center; gap: 5px; margin-bottom: 28px;">
-                    <or-mwc-input style="flex: 0;" type="${InputType.SELECT}" .value="${this.webhook.httpMethod}"
-                                  .options="${this.httpMethodOptions}"
-                                  @or-mwc-input-changed="${e=>{this.webhook.httpMethod=e.detail.value,this.notifyWebhookUpdate()}}"
-                    ></or-mwc-input>
-                    <or-mwc-input style="flex: 1;" type="${InputType.URL}" required label="${i18next.t("webUrl")}"
-                                  .value="${this.webhook.url}" helperPersistent
-                                  @or-mwc-input-changed="${e=>{this.webhook.url=e.detail.value,this.notifyWebhookUpdate()}}"></or-mwc-input>
-                </div>
-                <!-- Headers -->
-                <div style="display: flex; flex-direction: column; gap: 5px; margin-bottom: 28px;">
-                    <span>Headers</span>
-                    ${when(this.loading,(()=>html`
-                        ${this.getHeadersTemplate(this.webhook.headers,!0)}
-                    `),(()=>html`
-                        ${this.getHeadersTemplate(this.webhook.headers,!1)}
-                    `))}
-                    <or-mwc-input type="${InputType.BUTTON}" icon="plus" label="addRequestHeader"
-                                  @or-mwc-input-changed="${e=>{null!=(this.webhook.headers?this.webhook.headers[""]:void 0)?this.webhook.headers[""].push(""):this.webhook.headers[""]=[""],this.reloadHeaders()}}"></or-mwc-input>
-                </div>
-                <!-- Authorization -->
-                <div style="display: flex; flex-direction: column; gap: 10px; margin-bottom: ${this.webhook.oAuthGrant||this.webhook.usernamePassword?"28px":"0"};">
-                    <or-mwc-input type="${InputType.SWITCH}" fullwidth label="${i18next.t("requiresAuthorization")}"
-                                  .value="${this.webhook.oAuthGrant||this.webhook.usernamePassword}"
-                                  @or-mwc-input-changed="${e=>{this.webhook.usernamePassword=e.detail.value?{username:"admin",password:"secret"}:void 0,this.notifyWebhookUpdate()}}"></or-mwc-input>
-                    ${when(this.webhook.oAuthGrant||this.webhook.usernamePassword,(()=>{const e=Array.from(this.authMethodOptions.values());return html`
-                            <or-mwc-input type="${InputType.SELECT}" label="${i18next.t("method")}"
-                                          .value="${this.getAuthMethod(this.webhook)}"
-                                          .options="${e}"
-                                          @or-mwc-input-changed="${e=>{const t=[...this.authMethodOptions.entries()].find((t=>t[1]==e.detail.value));this.webhook.oAuthGrant=this.getOAuthGrant(t[0]),this.notifyWebhookUpdate()}}"></or-mwc-input>
-                            ${this.getAuthSettingsTemplate(this.webhook)}
-                        `}))}
-                </div>
-                <!-- Payload -->
-                <div style="display: flex; flex-direction: column; gap: 5px;">
-                    ${when("GET"!=this.webhook.httpMethod&&"DELETE"!=this.webhook.httpMethod,(()=>html`
-                        <or-mwc-input type="${InputType.SWITCH}" fullwidth label="${i18next.t("includeBodyInRequest")}"
-                                      .value="${null!=this.webhook.payload}"
-                                      @or-mwc-input-changed="${e=>{this.webhook.payload=e.detail.value?JSON.stringify({rule:"%RULESET_NAME%",assets:"%TRIGGER_ASSETS%"},null,4):void 0,this.notifyWebhookUpdate()}}"
-                        ></or-mwc-input>
-                        ${when(null!=this.webhook.payload,(()=>html`
-                                <or-mwc-input type="${InputType.TEXTAREA}" .value="${this.webhook.payload}"
-                                              @or-mwc-input-changed="${e=>{this.webhook.payload=e.detail.value,this.notifyWebhookUpdate()}}"></or-mwc-input>
-                            `))}
-                    `))}
-                </div>
-            </form>
-        `))}getHeadersTemplate(e,t){return Object.keys(this.webhook.headers).sort(((e,t)=>-e.localeCompare(t))).map(((e,o,i)=>{const n=this.webhook.headers[e];return n.map(((o,i)=>html`
-                    <div style="display: flex; gap: 5px;">
-                        <or-mwc-input type="${InputType.TEXT}" label="${i18next.t("header")}" value="${e}"
-                                      style="flex: 1;" .disabled="${t}"
-                                      @or-mwc-input-changed="${t=>{n.length>0?n.splice(i,1):delete this.webhook.headers[e];const r=this.webhook.headers[t.detail.value];r&&r.length>0?r.push(o):this.webhook.headers[t.detail.value]=[o],this.reloadHeaders()}}"
-                        ></or-mwc-input>
-                        <or-mwc-input type="${InputType.TEXT}" label="${i18next.t("value")}" value="${o}"
-                                      style="flex: 1;" .disabled="${t}"
-                                      @or-mwc-input-changed="${t=>{this.webhook.headers[e][i]=t.detail.value,this.notifyWebhookUpdate()}}"
-                        ></or-mwc-input>
-                        <or-mwc-input type="${InputType.BUTTON}" icon="delete" .disabled="${t}"
-                                      @or-mwc-input-changed="${()=>{n.splice(i,1),this.reloadHeaders()}}"></or-mwc-input>
-                    </div>
-                `))}))}getAuthSettingsTemplate(e){var t,o;const i=e.oAuthGrant;return null==i?html`
-                <div style="display: flex; flex-direction: column; gap: 10px;">
-                    <or-mwc-input type="${InputType.TEXT}" label="${i18next.t("username")}"
-                                  .value="${null===(t=e.usernamePassword)||void 0===t?void 0:t.username}"
-                                  @or-mwc-input-changed="${e=>{this.webhook.usernamePassword||(this.webhook.usernamePassword={}),this.webhook.usernamePassword.username=e.detail.value,this.notifyWebhookUpdate()}}"></or-mwc-input>
-                    <or-mwc-input type="${InputType.TEXT}" label="${i18next.t("password")}"
-                                  .value="${null===(o=this.webhook.usernamePassword)||void 0===o?void 0:o.password}"
-                                  @or-mwc-input-changed="${e=>{this.webhook.usernamePassword||(this.webhook.usernamePassword={}),this.webhook.usernamePassword.password=e.detail.value,this.notifyWebhookUpdate()}}"></or-mwc-input>
-                </div>
-            `:html`
-                <div style="display: flex; flex-direction: column; gap: 10px;">
-                    <div style="display: flex; flex-direction: row; align-items: center; gap: 5px;">
-                        <or-mwc-input style="flex: 1;" type="${InputType.URL}" required
-                                      label="${i18next.t("tokenUrl")}" .value="${i.tokenEndpointUri}"
-                                      @or-mwc-input-changed="${e=>{i.tokenEndpointUri=e.detail.value,this.notifyWebhookUpdate()}}"></or-mwc-input>
-                    </div>
-                    ${when(null!=i.grant_type,(()=>{switch(i.grant_type){case"client_credentials":{const e=i;return html`
-                                    <or-mwc-input type="${InputType.TEXT}" label="${i18next.t("clientId")}"
-                                                  .value="${e.client_id}"
-                                                  @or-mwc-input-changed="${t=>{e.client_id=t.detail.value,this.notifyWebhookUpdate()}}"></or-mwc-input>
-                                    <or-mwc-input type="${InputType.PASSWORD}" label="${i18next.t("clientSecret")}"
-                                                  .value="${e.client_secret}"
-                                                  @or-mwc-input-changed="${t=>{e.client_secret=t.detail.value,this.notifyWebhookUpdate()}}"></or-mwc-input>
-                                `}case"password":{const e=i;return html`
-                                    <or-mwc-input type="${InputType.TEXT}" label="${i18next.t("username")}"
-                                                  .value="${e.username}"
-                                                  @or-mwc-input-changed="${t=>{e.username=t.detail.value,this.notifyWebhookUpdate()}}"></or-mwc-input>
-                                    <or-mwc-input type="${InputType.TEXT}" label="${i18next.t("password")}"
-                                                  .value="${e.password}"
-                                                  @or-mwc-input-changed="${t=>{e.password=t.detail.value,this.notifyWebhookUpdate()}}"></or-mwc-input>
-                                `}default:return html`${i18next.t("errorOccurred")}`}}))}
-                </div>
-            `}};__decorate([property({type:Object})],OrRuleFormWebhook.prototype,"webhook",void 0),__decorate([state()],OrRuleFormWebhook.prototype,"loading",void 0),OrRuleFormWebhook=__decorate([customElement("or-rule-form-webhook")],OrRuleFormWebhook);export{OrRuleFormWebhook};
+    static get styles() {
+        return [styling];
+    }
+    /* --------------------------- */
+    // Lifecycle methods
+    shouldUpdate(changedProperties) {
+        if (changedProperties.has('webhook')) {
+            if (this.webhook.headers == undefined) {
+                this.webhook.headers = {};
+            }
+        }
+        return super.shouldUpdate(changedProperties);
+    }
+    /* --------------- */
+    // Util
+    getAuthMethod(webhook) {
+        if (webhook.oAuthGrant != undefined) {
+            return this.authMethodOptions.get(webhook.oAuthGrant.grant_type);
+        }
+        else {
+            return this.authMethodOptions.get("username_password");
+        }
+    }
+    getOAuthGrant(authMethodKey) {
+        if (authMethodKey == 'client_credentials' || authMethodKey == 'password') {
+            return { grant_type: authMethodKey };
+        }
+        else {
+            return undefined;
+        }
+    }
+    reloadHeaders() {
+        this.loading = true;
+        this.updateComplete.then(() => this.loading = false);
+        this.notifyWebhookUpdate(false);
+    }
+    notifyWebhookUpdate(requestUpdate = true) {
+        if (requestUpdate) {
+            this.requestUpdate("webhook");
+        }
+        this.dispatchEvent(new OrRulesJsonRuleChangedEvent());
+    }
+    /* ---------------- */
+    // Template rendering
+    render() {
+        return when(!this.webhook, () => html `
+            ${i18next.t('errorOccurred')}
+        `, () => html `
+            <form style="display: flex; flex-direction: column; min-width: 520px;">
+                <!-- HTTP Method & URL -->
+                <div style="display: flex; flex-direction: row; align-items: center; gap: 5px; margin-bottom: 28px;">
+                    <or-mwc-input style="flex: 0;" type="${InputType.SELECT}" .value="${this.webhook.httpMethod}"
+                                  .options="${this.httpMethodOptions}"
+                                  @or-mwc-input-changed="${(ev) => {
+            this.webhook.httpMethod = ev.detail.value;
+            this.notifyWebhookUpdate();
+        }}"
+                    ></or-mwc-input>
+                    <or-mwc-input style="flex: 1;" type="${InputType.URL}" required label="${i18next.t('webUrl')}"
+                                  .value="${this.webhook.url}" helperPersistent
+                                  @or-mwc-input-changed="${(e) => {
+            this.webhook.url = e.detail.value;
+            this.notifyWebhookUpdate();
+        }}"></or-mwc-input>
+                </div>
+                <!-- Headers -->
+                <div style="display: flex; flex-direction: column; gap: 5px; margin-bottom: 28px;">
+                    <span>Headers</span>
+                    ${when(this.loading, () => html `
+                        ${this.getHeadersTemplate(this.webhook.headers, true)}
+                    `, () => html `
+                        ${this.getHeadersTemplate(this.webhook.headers, false)}
+                    `)}
+                    <or-mwc-input type="${InputType.BUTTON}" icon="plus" label="addRequestHeader"
+                                  @or-mwc-input-changed="${(ev) => {
+            if ((this.webhook.headers ? this.webhook.headers[''] : undefined) != undefined) {
+                this.webhook.headers[''].push('');
+            }
+            else {
+                this.webhook.headers[''] = [''];
+            }
+            this.reloadHeaders();
+        }}"></or-mwc-input>
+                </div>
+                <!-- Authorization -->
+                <div style="display: flex; flex-direction: column; gap: 10px; margin-bottom: ${this.webhook.oAuthGrant || this.webhook.usernamePassword ? '28px' : '0'};">
+                    <or-mwc-input type="${InputType.SWITCH}" fullwidth label="${i18next.t('requiresAuthorization')}"
+                                  .value="${this.webhook.oAuthGrant || this.webhook.usernamePassword}"
+                                  @or-mwc-input-changed="${(ev) => {
+            this.webhook.usernamePassword = ev.detail.value ? {
+                username: 'admin',
+                password: 'secret'
+            } : undefined;
+            this.notifyWebhookUpdate();
+        }}"></or-mwc-input>
+                    ${when(this.webhook.oAuthGrant || this.webhook.usernamePassword, () => {
+            const values = Array.from(this.authMethodOptions.values());
+            return html `
+                            <or-mwc-input type="${InputType.SELECT}" label="${i18next.t('method')}"
+                                          .value="${this.getAuthMethod(this.webhook)}"
+                                          .options="${values}"
+                                          @or-mwc-input-changed="${(ev) => {
+                const entry = [...this.authMethodOptions.entries()].find((entry) => entry[1] == ev.detail.value);
+                this.webhook.oAuthGrant = this.getOAuthGrant(entry[0]);
+                this.notifyWebhookUpdate();
+            }}"></or-mwc-input>
+                            ${this.getAuthSettingsTemplate(this.webhook)}
+                        `;
+        })}
+                </div>
+                <!-- Payload -->
+                <div style="display: flex; flex-direction: column; gap: 5px;">
+                    ${when(this.webhook.httpMethod != "GET" /* HTTPMethod.GET */ && this.webhook.httpMethod != "DELETE" /* HTTPMethod.DELETE */, () => html `
+                        <or-mwc-input type="${InputType.SWITCH}" fullwidth label="${i18next.t('includeBodyInRequest')}"
+                                      .value="${this.webhook.payload != undefined}"
+                                      @or-mwc-input-changed="${(ev) => {
+            this.webhook.payload = ev.detail.value ? JSON.stringify({
+                rule: "%RULESET_NAME%",
+                assets: "%TRIGGER_ASSETS%"
+            }, null, 4) : undefined;
+            this.notifyWebhookUpdate();
+        }}"
+                        ></or-mwc-input>
+                        ${when(this.webhook.payload != undefined, () => {
+            return html `
+                                <or-mwc-input type="${InputType.TEXTAREA}" .value="${this.webhook.payload}"
+                                              @or-mwc-input-changed="${(ev) => {
+                this.webhook.payload = ev.detail.value;
+                this.notifyWebhookUpdate();
+            }}"></or-mwc-input>
+                            `;
+        })}
+                    `)}
+                </div>
+            </form>
+        `);
+    }
+    getHeadersTemplate(headers, loading) {
+        return Object.keys(this.webhook.headers)
+            .sort((a, b) => -(a.localeCompare(b)))
+            .map((key, keyIndex, keys) => {
+            const values = this.webhook.headers[key];
+            return values.map((value, valueIndex) => html `
+                    <div style="display: flex; gap: 5px;">
+                        <or-mwc-input type="${InputType.TEXT}" label="${i18next.t('header')}" value="${key}"
+                                      style="flex: 1;" .disabled="${loading}"
+                                      @or-mwc-input-changed="${(ev) => {
+                values.length > 0 ? values.splice(valueIndex, 1) : delete this.webhook.headers[key];
+                const newValues = this.webhook.headers[ev.detail.value];
+                if (newValues && newValues.length > 0) {
+                    newValues.push(value);
+                }
+                else {
+                    this.webhook.headers[ev.detail.value] = [value];
+                }
+                this.reloadHeaders();
+            }}"
+                        ></or-mwc-input>
+                        <or-mwc-input type="${InputType.TEXT}" label="${i18next.t('value')}" value="${value}"
+                                      style="flex: 1;" .disabled="${loading}"
+                                      @or-mwc-input-changed="${(ev) => {
+                this.webhook.headers[key][valueIndex] = ev.detail.value;
+                this.notifyWebhookUpdate();
+            }}"
+                        ></or-mwc-input>
+                        <or-mwc-input type="${InputType.BUTTON}" icon="delete" .disabled="${loading}"
+                                      @or-mwc-input-changed="${() => {
+                values.splice(valueIndex, 1);
+                this.reloadHeaders();
+            }}"></or-mwc-input>
+                    </div>
+                `);
+        });
+    }
+    getAuthSettingsTemplate(webhook) {
+        var _a, _b;
+        const authGrant = webhook.oAuthGrant;
+        if (authGrant == undefined) {
+            return html `
+                <div style="display: flex; flex-direction: column; gap: 10px;">
+                    <or-mwc-input type="${InputType.TEXT}" label="${i18next.t('username')}"
+                                  .value="${(_a = webhook.usernamePassword) === null || _a === void 0 ? void 0 : _a.username}"
+                                  @or-mwc-input-changed="${(ev) => {
+                if (!this.webhook.usernamePassword) {
+                    this.webhook.usernamePassword = {};
+                }
+                this.webhook.usernamePassword.username = ev.detail.value;
+                this.notifyWebhookUpdate();
+            }}"></or-mwc-input>
+                    <or-mwc-input type="${InputType.TEXT}" label="${i18next.t('password')}"
+                                  .value="${(_b = this.webhook.usernamePassword) === null || _b === void 0 ? void 0 : _b.password}"
+                                  @or-mwc-input-changed="${(ev) => {
+                if (!this.webhook.usernamePassword) {
+                    this.webhook.usernamePassword = {};
+                }
+                this.webhook.usernamePassword.password = ev.detail.value;
+                this.notifyWebhookUpdate();
+            }}"></or-mwc-input>
+                </div>
+            `;
+        }
+        else {
+            return html `
+                <div style="display: flex; flex-direction: column; gap: 10px;">
+                    <div style="display: flex; flex-direction: row; align-items: center; gap: 5px;">
+                        <or-mwc-input style="flex: 1;" type="${InputType.URL}" required
+                                      label="${i18next.t('tokenUrl')}" .value="${authGrant.tokenEndpointUri}"
+                                      @or-mwc-input-changed="${(ev) => {
+                authGrant.tokenEndpointUri = ev.detail.value;
+                this.notifyWebhookUpdate();
+            }}"></or-mwc-input>
+                    </div>
+                    ${when(authGrant.grant_type != undefined, () => {
+                switch (authGrant.grant_type) {
+                    case "client_credentials": {
+                        const grant = authGrant;
+                        return html `
+                                    <or-mwc-input type="${InputType.TEXT}" label="${i18next.t('clientId')}"
+                                                  .value="${grant.client_id}"
+                                                  @or-mwc-input-changed="${(ev) => {
+                            grant.client_id = ev.detail.value;
+                            this.notifyWebhookUpdate();
+                        }}"></or-mwc-input>
+                                    <or-mwc-input type="${InputType.PASSWORD}" label="${i18next.t('clientSecret')}"
+                                                  .value="${grant.client_secret}"
+                                                  @or-mwc-input-changed="${(ev) => {
+                            grant.client_secret = ev.detail.value;
+                            this.notifyWebhookUpdate();
+                        }}"></or-mwc-input>
+                                `;
+                    }
+                    case "password": {
+                        const grant = authGrant;
+                        return html `
+                                    <or-mwc-input type="${InputType.TEXT}" label="${i18next.t('username')}"
+                                                  .value="${grant.username}"
+                                                  @or-mwc-input-changed="${(ev) => {
+                            grant.username = ev.detail.value;
+                            this.notifyWebhookUpdate();
+                        }}"></or-mwc-input>
+                                    <or-mwc-input type="${InputType.TEXT}" label="${i18next.t('password')}"
+                                                  .value="${grant.password}"
+                                                  @or-mwc-input-changed="${(ev) => {
+                            grant.password = ev.detail.value;
+                            this.notifyWebhookUpdate();
+                        }}"></or-mwc-input>
+                                `;
+                    }
+                    default:
+                        return html `${i18next.t('errorOccurred')}`;
+                }
+            })}
+                </div>
+            `;
+        }
+    }
+};
+__decorate([
+    property({ type: Object })
+], OrRuleFormWebhook.prototype, "webhook", void 0);
+__decorate([
+    state()
+], OrRuleFormWebhook.prototype, "loading", void 0);
+OrRuleFormWebhook = __decorate([
+    customElement("or-rule-form-webhook")
+], OrRuleFormWebhook);
+export { OrRuleFormWebhook };
+//# sourceMappingURL=or-rule-form-webhook.js.map

package/lib/json-viewer/modals/or-rule-alarm-modal.d.ts

@@ -5,7 +5,7 @@ declare const OrRuleAlarmModal_base: (new (...args: any[]) => {
     _i18nextJustInitialized: boolean;
     connectedCallback(): void;
     disconnectedCallback(): void;
-    shouldUpdate(changedProps: import("lit").PropertyValueMap<any> | Map<PropertyKey, unknown>): any;
+    shouldUpdate(changedProps: PropertyValues): any;
     initCallback: (options: import("i18next").InitOptions) => void;
     langChangedCallback: () => void;
     readonly isConnected: boolean;
@@ -20,7 +20,7 @@ export declare class OrRuleAlarmModal extends OrRuleAlarmModal_base {
     renderDialogHTML(action: RuleActionAlarm): void;
     firstUpdated(changedProperties: PropertyValues): void;
     checkForm(): void;
-    protected render(): import("lit-html").TemplateResult<1>;
+    protected render(): import("lit").TemplateResult<1>;
     protected setActionAlarmSeverity(value: string | undefined): void;
 }
 export {};

package/lib/json-viewer/modals/or-rule-alarm-modal.js

@@ -1,17 +1,173 @@
-var __decorate=this&&this.__decorate||function(t,e,o,r){var i,n=arguments.length,a=n<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,o):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(t,e,o,r);else for(var l=t.length-1;l>=0;l--)(i=t[l])&&(a=(n<3?i(a):n>3?i(e,o,a):i(e,o))||a);return n>3&&a&&Object.defineProperty(e,o,a),a};import{css,html,LitElement}from"lit";import{customElement,property}from"lit/decorators.js";import"@openremote/or-mwc-components/or-mwc-input";import{InputType}from"@openremote/or-mwc-components/or-mwc-input";import i18next from"i18next";import{translate}from"@openremote/or-translate";import{OrMwcDialogOpenedEvent}from"@openremote/or-mwc-components/or-mwc-dialog";import{OrRulesJsonRuleChangedEvent}from"../or-rule-json-viewer";const checkValidity=(t,e)=>{if(t){const o=t.querySelectorAll("or-mwc-input");Array.prototype.slice.call(o).every((t=>{if(t.shadowRoot){const e=t.shadowRoot.querySelector("input, textarea");return t.type===InputType.SELECT||!(!e||!e.checkValidity())||(t._mdcComponent.valid=!1,t._mdcComponent.helperTextContent="required",!1)}return!1}))&&e.close()}},style=css`
-    :host {
-        display: flex;
-        align-items: center;
-    }
-    :host > * {
-        margin: 0 3px 6px;
-    }
-    .min-width {
-        min-width: 200px;
-    }
-`;let OrRuleAlarmModal=class extends(translate(i18next)(LitElement)){static get styles(){return style}constructor(){super(),this.title="settings",this.addEventListener(OrMwcDialogOpenedEvent.NAME,this.initDialog)}initDialog(){this.shadowRoot.getElementById("alarm-modal")}renderDialogHTML(t){const e=this.shadowRoot.getElementById("alarm-modal");if(!this.shadowRoot)return;const o=this.shadowRoot.querySelector(".alarm-form-slot");if(e&&o){let t=document.createElement("div");o.assignedNodes({flatten:!0}).forEach((e=>{e instanceof HTMLElement&&t.appendChild(e)})),e.content=html`${t}`,e.dismissAction=null,this.requestUpdate()}}firstUpdated(t){t.has("action")&&this.renderDialogHTML(this.action)}checkForm(){const t=this.shadowRoot.host;if(this.shadowRoot){const e=this.shadowRoot.querySelector("or-rule-form-alarm");if(e&&e.shadowRoot){const o=e.shadowRoot.querySelector("form");return checkValidity(o,t)}}}render(){var t;if(!this.action)return html``;const e=[{actionName:"cancel",content:html`<or-mwc-input class="button" .type="${InputType.BUTTON}" .label="${i18next.t("cancel")}"></or-mwc-input>`,action:t=>{}},{actionName:"",content:html`<or-mwc-input class="button" .type="${InputType.BUTTON}" .label="${i18next.t("ok")}" @or-mwc-input-changed="${this.checkForm}"></or-mwc-input>`}];return html`
-            <or-mwc-input style="width: 200px" .type="${InputType.SELECT}" .value="${null===(t=this.action.alarm)||void 0===t?void 0:t.severity}" .label="${i18next.t("alarm.severity")}" .options="${[["LOW",i18next.t("alarm.severity_LOW")],["MEDIUM",i18next.t("alarm.severity_MEDIUM")],["HIGH",i18next.t("alarm.severity_HIGH")]]}" @or-mwc-input-changed="${t=>this.setActionAlarmSeverity(t.detail.value)}"></or-mwc-input>
-            <or-mwc-input .type="${InputType.BUTTON}" .label="${i18next.t("settings")}" @or-mwc-input-changed="${()=>{const t=this.shadowRoot.getElementById("alarm-modal");t&&t.open()}}"></or-mwc-input>
-            <or-mwc-dialog id="alarm-modal" heading="${this.title}" .actions="${e}"></or-mwc-dialog>
-            <slot class="alarm-form-slot"></slot>
-        `}setActionAlarmSeverity(t){if(t&&this.action.alarm){const e=this.action.alarm;e.severity=t,this.action.alarm=Object.assign({},e)}this.dispatchEvent(new OrRulesJsonRuleChangedEvent),this.requestUpdate()}};__decorate([property({type:Object,attribute:!1})],OrRuleAlarmModal.prototype,"action",void 0),__decorate([property({type:String})],OrRuleAlarmModal.prototype,"title",void 0),__decorate([property({type:Object})],OrRuleAlarmModal.prototype,"query",void 0),OrRuleAlarmModal=__decorate([customElement("or-rule-alarm-modal")],OrRuleAlarmModal);export{OrRuleAlarmModal};
+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;
+};
+/*
+ * Copyright 2024, OpenRemote Inc.
+ *
+ * See the CONTRIBUTORS.txt file in the distribution for a
+ * full listing of individual contributors.
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
+ */
+import { css, html, LitElement } from "lit";
+import { customElement, property } from "lit/decorators.js";
+import "@openremote/or-mwc-components/or-mwc-input";
+import { InputType } from "@openremote/or-mwc-components/or-mwc-input";
+import i18next from "i18next";
+import { translate } from "@openremote/or-translate";
+import { OrMwcDialogOpenedEvent } from "@openremote/or-mwc-components/or-mwc-dialog";
+import { OrRulesJsonRuleChangedEvent } from "../or-rule-json-viewer";
+const checkValidity = (form, dialog) => {
+    if (form) {
+        const inputs = form.querySelectorAll('or-mwc-input');
+        const elements = Array.prototype.slice.call(inputs);
+        const valid = elements.every((element) => {
+            if (element.shadowRoot) {
+                const input = element.shadowRoot.querySelector('input, textarea');
+                if (element.type === InputType.SELECT) {
+                    return true;
+                }
+                if (input && input.checkValidity()) {
+                    return true;
+                }
+                else {
+                    element._mdcComponent.valid = false;
+                    element._mdcComponent.helperTextContent = 'required';
+                    return false;
+                }
+            }
+            else {
+                return false;
+            }
+        });
+        if (valid) {
+            dialog.close();
+        }
+    }
+};
+// language=CSS
+const style = css `
+    :host {
+        display: flex;
+        align-items: center;
+    }
+    :host > * {
+        margin: 0 3px 6px;
+    }
+    .min-width {
+        min-width: 200px;
+    }
+`;
+let OrRuleAlarmModal = class OrRuleAlarmModal extends translate(i18next)(LitElement) {
+    static get styles() {
+        return style;
+    }
+    constructor() {
+        super();
+        this.title = "settings";
+        this.addEventListener(OrMwcDialogOpenedEvent.NAME, this.initDialog);
+    }
+    initDialog() {
+        const modal = this.shadowRoot.getElementById('alarm-modal');
+        if (!modal)
+            return;
+    }
+    renderDialogHTML(action) {
+        const dialog = this.shadowRoot.getElementById("alarm-modal");
+        if (!this.shadowRoot)
+            return;
+        const slot = this.shadowRoot.querySelector('.alarm-form-slot');
+        if (dialog && slot) {
+            let container = document.createElement("div");
+            slot.assignedNodes({ flatten: true }).forEach((child) => {
+                if (child instanceof HTMLElement) {
+                    container.appendChild(child);
+                }
+            });
+            dialog.content = html `${container}`;
+            dialog.dismissAction = null;
+            this.requestUpdate();
+        }
+    }
+    firstUpdated(changedProperties) {
+        if (changedProperties.has("action")) {
+            this.renderDialogHTML(this.action);
+        }
+    }
+    checkForm() {
+        const dialog = this.shadowRoot.host;
+        if (this.shadowRoot) {
+            const alarmConfig = this.shadowRoot.querySelector('or-rule-form-alarm');
+            if (alarmConfig && alarmConfig.shadowRoot) {
+                const form = alarmConfig.shadowRoot.querySelector('form');
+                return checkValidity(form, dialog);
+            }
+        }
+    }
+    render() {
+        var _a;
+        if (!this.action)
+            return html ``;
+        const alarmPickerModalActions = [
+            {
+                actionName: "cancel",
+                content: html `<or-mwc-input class="button" .type="${InputType.BUTTON}" .label="${i18next.t("cancel")}"></or-mwc-input>`,
+                action: (dialog) => {
+                }
+            },
+            {
+                actionName: "",
+                content: html `<or-mwc-input class="button" .type="${InputType.BUTTON}" .label="${i18next.t("ok")}" @or-mwc-input-changed="${this.checkForm}"></or-mwc-input>`
+            }
+        ];
+        const alarmPickerModalOpen = () => {
+            const dialog = this.shadowRoot.getElementById("alarm-modal");
+            if (dialog) {
+                dialog.open();
+            }
+        };
+        return html `
+            <or-mwc-input style="width: 200px" .type="${InputType.SELECT}" .value="${(_a = this.action.alarm) === null || _a === void 0 ? void 0 : _a.severity}" .label="${i18next.t("alarm.severity")}" .options="${[["LOW" /* AlarmSeverity.LOW */, i18next.t("alarm.severity_LOW")], ["MEDIUM" /* AlarmSeverity.MEDIUM */, i18next.t("alarm.severity_MEDIUM")], ["HIGH" /* AlarmSeverity.HIGH */, i18next.t("alarm.severity_HIGH")]]}" @or-mwc-input-changed="${(e) => this.setActionAlarmSeverity(e.detail.value)}"></or-mwc-input>
+            <or-mwc-input .type="${InputType.BUTTON}" .label="${i18next.t("settings")}" @or-mwc-input-changed="${alarmPickerModalOpen}"></or-mwc-input>
+            <or-mwc-dialog id="alarm-modal" heading="${this.title}" .actions="${alarmPickerModalActions}"></or-mwc-dialog>
+            <slot class="alarm-form-slot"></slot>
+        `;
+    }
+    setActionAlarmSeverity(value) {
+        if (value && this.action.alarm) {
+            const alarm = this.action.alarm;
+            alarm.severity = value;
+            this.action.alarm = Object.assign({}, alarm);
+        }
+        this.dispatchEvent(new OrRulesJsonRuleChangedEvent());
+        this.requestUpdate();
+    }
+};
+__decorate([
+    property({ type: Object, attribute: false })
+], OrRuleAlarmModal.prototype, "action", void 0);
+__decorate([
+    property({ type: String })
+], OrRuleAlarmModal.prototype, "title", void 0);
+__decorate([
+    property({ type: Object })
+], OrRuleAlarmModal.prototype, "query", void 0);
+OrRuleAlarmModal = __decorate([
+    customElement("or-rule-alarm-modal")
+], OrRuleAlarmModal);
+export { OrRuleAlarmModal };
+//# sourceMappingURL=or-rule-alarm-modal.js.map