@openremote/or-rules 1.8.0-snapshot.20250725120002 → 1.8.0-snapshot.20250728102340

package/lib/flow-viewer/components/confirmation-dialog.js

@@ -1,61 +1,24 @@
-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 { LitElement, html, css } from "lit";
-import { customElement, property } from "lit/decorators.js";
-import { i18next, translate } from "@openremote/or-translate";
-import { InputType } from "@openremote/or-mwc-components/or-mwc-input";
-let ConfirmationDialog = class ConfirmationDialog extends translate(i18next)(LitElement) {
-    constructor() {
-        super(...arguments);
-        this.agreeText = i18next.t("ok");
-        this.disagreeText = i18next.t("cancel");
-        this.question = i18next.t("areYouSure", "Are you sure?");
-    }
-    static get styles() {
-        return css `
-        .question{
-            width: 100%;
-            padding: 15px 5px 25px 5px;
-            text-align: center;
-        }
-        .container{
-            display: flex;
-            flex-direction: row;
-            justify-content: space-between;
-            justify-content: space-evenly;
-            justify-content: space-around;
-        }`;
-    }
-    render() {
-        return html `
-        <div class="question">${this.question}</div>
-        <div class="container">
-            <or-mwc-input type="${InputType.BUTTON}" unElevated label="${this.agreeText}"
-                @or-mwc-input-changed="${() => { this.dispatchEvent(new CustomEvent("agreed")); }}">
-            </or-mwc-input>
-
-            <or-mwc-input type="button" label="${this.disagreeText}"
-                @or-mwc-input-changed="${() => { this.dispatchEvent(new CustomEvent("disagreed")); }}">
-            </or-mwc-input>
-        </div>
-        `;
-    }
-};
-__decorate([
-    property({ type: String })
-], ConfirmationDialog.prototype, "agreeText", void 0);
-__decorate([
-    property({ type: String })
-], ConfirmationDialog.prototype, "disagreeText", void 0);
-__decorate([
-    property({ type: String })
-], ConfirmationDialog.prototype, "question", void 0);
-ConfirmationDialog = __decorate([
-    customElement("confirmation-dialog")
-], ConfirmationDialog);
-export { ConfirmationDialog };
-//# sourceMappingURL=confirmation-dialog.js.map
+var __decorate=this&&this.__decorate||function(e,t,o,i){var r,n=arguments.length,a=n<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,o):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,o,i);else for(var c=e.length-1;c>=0;c--)(r=e[c])&&(a=(n<3?r(a):n>3?r(t,o,a):r(t,o))||a);return n>3&&a&&Object.defineProperty(t,o,a),a};import{LitElement as e,html as t,css as o}from"lit";import{customElement as i,property as r}from"lit/decorators.js";import{i18next as n,translate as a}from"@openremote/or-translate";import{InputType as c}from"@openremote/or-mwc-components/or-mwc-input";let ConfirmationDialog=class extends a(n)(e){constructor(){super(...arguments),this.agreeText=n.t("ok"),this.disagreeText=n.t("cancel"),this.question=n.t("areYouSure","Are you sure?")}static get styles(){return o`
+        .question{
+            width: 100%;
+            padding: 15px 5px 25px 5px;
+            text-align: center;
+        }
+        .container{
+            display: flex;
+            flex-direction: row;
+            justify-content: space-between;
+            justify-content: space-evenly;
+            justify-content: space-around;
+        }`}render(){return t`
+        <div class="question">${this.question}</div>
+        <div class="container">
+            <or-mwc-input type="${c.BUTTON}" unElevated label="${this.agreeText}"
+                @or-mwc-input-changed="${()=>{this.dispatchEvent(new CustomEvent("agreed"))}}">
+            </or-mwc-input>
+
+            <or-mwc-input type="button" label="${this.disagreeText}"
+                @or-mwc-input-changed="${()=>{this.dispatchEvent(new CustomEvent("disagreed"))}}">
+            </or-mwc-input>
+        </div>
+        `}};__decorate([r({type:String})],ConfirmationDialog.prototype,"agreeText",void 0),__decorate([r({type:String})],ConfirmationDialog.prototype,"disagreeText",void 0),__decorate([r({type:String})],ConfirmationDialog.prototype,"question",void 0),ConfirmationDialog=__decorate([i("confirmation-dialog")],ConfirmationDialog);export{ConfirmationDialog};

package/lib/flow-viewer/components/connection-container.js

@@ -1,35 +1 @@
-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 { LitElement, html } from "lit";
-import { customElement, property } from "lit/decorators.js";
-import { repeat } from "lit/directives/repeat.js";
-import { project } from "./flow-editor";
-let ConnectionContainer = class ConnectionContainer extends LitElement {
-    constructor() {
-        super();
-        project.addListener("connectioncreated", () => {
-            this.requestUpdate();
-        });
-        project.addListener("connectionremoved", () => {
-            this.requestUpdate();
-        });
-        project.addListener("cleared", () => {
-            this.requestUpdate();
-        });
-    }
-    render() {
-        return html `${repeat(project.connections, (c) => c.from + c.to, (c) => html `<connection-line .workspace="${this.workspace}" .connection="${c}"></connection-line>`)}`;
-    }
-};
-__decorate([
-    property({ attribute: false })
-], ConnectionContainer.prototype, "workspace", void 0);
-ConnectionContainer = __decorate([
-    customElement("connection-container")
-], ConnectionContainer);
-export { ConnectionContainer };
-//# sourceMappingURL=connection-container.js.map
+var __decorate=this&&this.__decorate||function(e,t,o,n){var r,i=arguments.length,c=i<3?t:null===n?n=Object.getOwnPropertyDescriptor(t,o):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)c=Reflect.decorate(e,t,o,n);else for(var a=e.length-1;a>=0;a--)(r=e[a])&&(c=(i<3?r(c):i>3?r(t,o,c):r(t,o))||c);return i>3&&c&&Object.defineProperty(t,o,c),c};import{LitElement as e,html as t}from"lit";import{customElement as o,property as n}from"lit/decorators.js";import{repeat as r}from"lit/directives/repeat.js";import{project as i}from"./flow-editor";let ConnectionContainer=class extends e{constructor(){super(),i.addListener("connectioncreated",()=>{this.requestUpdate()}),i.addListener("connectionremoved",()=>{this.requestUpdate()}),i.addListener("cleared",()=>{this.requestUpdate()})}render(){return t`${r(i.connections,e=>e.from+e.to,e=>t`<connection-line .workspace="${this.workspace}" .connection="${e}"></connection-line>`)}`}};__decorate([n({attribute:!1})],ConnectionContainer.prototype,"workspace",void 0),ConnectionContainer=__decorate([o("connection-container")],ConnectionContainer);export{ConnectionContainer};

package/lib/flow-viewer/components/connection-line.js

@@ -1,119 +1,30 @@
-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 { html, css } from "lit";
-import { customElement, property } from "lit/decorators.js";
-import { IdentityDomLink, IdentityAssigner, NodeUtilities } from "../node-structure";
-import { ResizeObserver } from "resize-observer";
-import { SelectableElement } from "./selectable-element";
-import { project } from "./flow-editor";
-let ConnectionLine = class ConnectionLine extends SelectableElement {
-    constructor() {
-        super();
-        this.fancyLine = true;
-        this.curveIntensity = 1;
-        this.nodeChanged = () => { this.requestUpdate(); };
-        this.polylineId = IdentityAssigner.generateIdentity();
-    }
-    disconnectedCallback() {
-        super.disconnectedCallback();
-        this.resizeObserver.disconnect();
-        project.removeListener("connectionremoved", this.nodeChanged);
-    }
-    firstUpdated() {
-        super.firstUpdated();
-        const elem = this.shadowRoot.getElementById(this.polylineId);
-        if (elem)
-            this.setHandle(elem);
-    }
-    render() {
-        if (this.isInvalid) {
-            const fromSocket = NodeUtilities.getSocketFromID(this.connection.from, project.nodes);
-            const toSocket = NodeUtilities.getSocketFromID(this.connection.to, project.nodes);
-            this.fromNodeElement = IdentityDomLink.map[fromSocket.nodeId];
-            this.toNodeElement = IdentityDomLink.map[toSocket.nodeId];
-            this.fromElement = IdentityDomLink.map[fromSocket.id];
-            this.toElement = IdentityDomLink.map[toSocket.id];
-            if (this.isInvalid) {
-                console.warn(this.fromNodeElement);
-                console.warn(this.toNodeElement);
-                console.warn(this.fromElement);
-                console.warn(this.toElement);
-                console.warn("Attempt to render invalid connection");
-                return html ``;
+var __decorate=this&&this.__decorate||function(e,t,o,n){var i,s=arguments.length,r=s<3?t:null===n?n=Object.getOwnPropertyDescriptor(t,o):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(e,t,o,n);else for(var l=e.length-1;l>=0;l--)(i=e[l])&&(r=(s<3?i(r):s>3?i(t,o,r):i(t,o))||r);return s>3&&r&&Object.defineProperty(t,o,r),r};import{html as e,css as t}from"lit";import{customElement as o,property as n}from"lit/decorators.js";import{IdentityDomLink as i,IdentityAssigner as s,NodeUtilities as r}from"../node-structure";import{ResizeObserver as l}from"resize-observer";import{SelectableElement as d}from"./selectable-element";import{project as c}from"./flow-editor";let ConnectionLine=class extends d{constructor(){super(),this.fancyLine=!0,this.curveIntensity=1,this.nodeChanged=()=>{this.requestUpdate()},this.polylineId=s.generateIdentity()}disconnectedCallback(){super.disconnectedCallback(),this.resizeObserver.disconnect(),c.removeListener("connectionremoved",this.nodeChanged)}firstUpdated(){super.firstUpdated();let e=this.shadowRoot.getElementById(this.polylineId);e&&this.setHandle(e)}render(){if(this.isInvalid){let t=r.getSocketFromID(this.connection.from,c.nodes),o=r.getSocketFromID(this.connection.to,c.nodes);if(this.fromNodeElement=i.map[t.nodeId],this.toNodeElement=i.map[o.nodeId],this.fromElement=i.map[t.id],this.toElement=i.map[o.id],this.isInvalid)return console.warn(this.fromNodeElement),console.warn(this.toNodeElement),console.warn(this.fromElement),console.warn(this.toElement),console.warn("Attempt to render invalid connection"),e``;this.fromNodeElement.addEventListener("updated",this.nodeChanged),this.toNodeElement.addEventListener("updated",this.nodeChanged),this.resizeObserver=new l(this.nodeChanged),this.resizeObserver.observe(this.fromNodeElement),this.resizeObserver.observe(this.toNodeElement)}let t=this.workspace.clientRect,o=this.fromElement.connectionPosition,n=this.toElement.connectionPosition;if(this.fancyLine){let i=o.x-t.left,s=o.y-t.top,r=n.x-t.left,l=n.y-t.top,d=this.curveIntensity*(Math.abs(i-r)/2);return e`<svg style="stroke-width: ${this.workspace.camera.zoom*(this.selected?5:3)}px;">
+                <path id="${this.polylineId}" 
+                d="M ${i} ${s} C ${i+d} ${s}, ${r-d} ${l}, ${r} ${l}"
+                selected="${this.selected}"
+                />
+            </svg>`}return e`<svg style="stroke-width: ${this.workspace.camera.zoom*(this.selected?5:3)}px;"><polyline id="${this.polylineId}"
+        selected="${this.selected}"
+        points="
+        ${o.x-t.left}, ${o.y-t.top} 
+        ${n.x-t.left}, ${n.y-t.top}"
+        ></polyline>
+        </svg>`}static get styles(){return t`
+            svg{
+                fill: none;  
+                overflow: visible;
+                position: absolute;
+                pointer-events: none;
+                stroke-linejoin: round;
             }
-            else {
-                this.fromNodeElement.addEventListener("updated", this.nodeChanged);
-                this.toNodeElement.addEventListener("updated", this.nodeChanged);
-                this.resizeObserver = new ResizeObserver(this.nodeChanged);
-                this.resizeObserver.observe(this.fromNodeElement);
-                this.resizeObserver.observe(this.toNodeElement);
+            path, line{
+                position: absolute;
+                pointer-events: all;
             }
-        }
-        const parentSize = this.workspace.clientRect;
-        const from = this.fromElement.connectionPosition;
-        const to = this.toElement.connectionPosition;
-        if (this.fancyLine) {
-            const x1 = from.x - parentSize.left;
-            const y1 = from.y - parentSize.top;
-            const x2 = to.x - parentSize.left;
-            const y2 = to.y - parentSize.top;
-            const intensity = this.curveIntensity * (Math.abs(x1 - x2) / 2);
-            // const intensity = 100 * this.workspace.camera.zoom;
-            return html `<svg style="stroke-width: ${this.workspace.camera.zoom * (this.selected ? 5 : 3)}px;">
-                <path id="${this.polylineId}" 
-                d="M ${x1} ${y1} C ${x1 + intensity} ${y1}, ${x2 - intensity} ${y2}, ${x2} ${y2}"
-                selected="${this.selected}"
-                />
-            </svg>`;
-        }
-        return html `<svg style="stroke-width: ${this.workspace.camera.zoom * (this.selected ? 5 : 3)}px;"><polyline id="${this.polylineId}"
-        selected="${this.selected}"
-        points="
-        ${from.x - parentSize.left}, ${from.y - parentSize.top} 
-        ${to.x - parentSize.left}, ${to.y - parentSize.top}"
-        ></polyline>
-        </svg>`;
-    }
-    static get styles() {
-        return css `
-            svg{
-                fill: none;  
-                overflow: visible;
-                position: absolute;
-                pointer-events: none;
-                stroke-linejoin: round;
-            }
-            path, line{
-                position: absolute;
-                pointer-events: all;
-            }
-            path:hover, line:hover, path[selected = true], line[selected = true]{
-                stroke: var(--highlight);
-            }
-            text{
-                fill: red;
-                stroke: none;
-            }`;
-    }
-    get isInvalid() {
-        return (!this.fromNodeElement || !this.toNodeElement || !this.fromElement || !this.toElement);
-    }
-};
-__decorate([
-    property({ attribute: false })
-], ConnectionLine.prototype, "connection", void 0);
-__decorate([
-    property({ attribute: false })
-], ConnectionLine.prototype, "workspace", void 0);
-__decorate([
-    property({ type: String })
-], ConnectionLine.prototype, "polylineId", void 0);
-ConnectionLine = __decorate([
-    customElement("connection-line")
-], ConnectionLine);
-export { ConnectionLine };
-//# sourceMappingURL=connection-line.js.map
+            path:hover, line:hover, path[selected = true], line[selected = true]{
+                stroke: var(--highlight);
+            }
+            text{
+                fill: red;
+                stroke: none;
+            }`}get isInvalid(){return!this.fromNodeElement||!this.toNodeElement||!this.fromElement||!this.toElement}};__decorate([n({attribute:!1})],ConnectionLine.prototype,"connection",void 0),__decorate([n({attribute:!1})],ConnectionLine.prototype,"workspace",void 0),__decorate([n({type:String})],ConnectionLine.prototype,"polylineId",void 0),ConnectionLine=__decorate([o("connection-line")],ConnectionLine);export{ConnectionLine};

package/lib/flow-viewer/components/context-menu.js

@@ -1,144 +1,49 @@
-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 ContextMenu_1;
-import { LitElement, html, css } from "lit";
-import { customElement, property } from "lit/decorators.js";
-import { translate, i18next } from "@openremote/or-translate";
-let ContextMenu = ContextMenu_1 = class ContextMenu extends translate(i18next)(LitElement) {
-    constructor() {
-        super(...arguments);
-        this.entries = [];
-        this.isOpen = false;
-        this.closeCallback = () => {
-            ContextMenu_1.close();
-        };
-    }
-    static get opened() { return ContextMenu_1.main.isOpen; }
-    static get styles() {
-        return css `
-        :host{
-            display: inline-block;
-            position: fixed;
-            background: white;
-            outline: 1px solid rgb(200,200,200);
-            box-shadow: rgba(0, 0, 0, 0.05) 0 2px 4px;
-            font-size: 13px;
-            z-index: 1000000;
-        }
-        .context-menu-button{
-            color: rgb(0,0,0);
-            display: grid;
-            align-items: center;
-            justify-items: start;
-            grid-template-rows: 32px;
-            grid-template-columns: 32px 220px;
-            grid-template-areas:
-                "icon label";
-        }
-        .context-menu-button:hover{
-            background: whitesmoke;
-        }
-        .label
-        {
-            grid-area: label;
-        }
-        or-icon{
-            justify-self: center;
-            grid-area: icon;
-            height: 16px;
-            width: 16px;
-        }
-        .muted{
-            pointer-events: none;
-            color: rgb(150,150,150);
-        }
-        .context-menu-separator{
-            --thickness: 1px;
-            border: 0;
-            height: var(--thickness);
-            border-bottom: solid var(--thickness);
-            border-color: rgb(234,234,234);
-            padding: 0;
-            margin: 5px 10px calc(5px - var(--thickness)) 10px;
-        }`;
-    }
-    static open(x, y, container, buttons) {
-        ContextMenu_1.main.container = container;
-        ContextMenu_1.main.style.top = y + "px";
-        ContextMenu_1.main.style.left = x + "px";
-        window.addEventListener("mousedown", ContextMenu_1.main.closeCallback);
-        window.addEventListener("blur", ContextMenu_1.main.closeCallback);
-        window.addEventListener("wheel", ContextMenu_1.main.closeCallback);
-        ContextMenu_1.main.entries = buttons;
-        ContextMenu_1.main.isOpen = true;
-    }
-    static close() {
-        window.removeEventListener("mousedown", ContextMenu_1.main.closeCallback);
-        window.removeEventListener("blur", ContextMenu_1.main.closeCallback);
-        window.removeEventListener("wheel", ContextMenu_1.main.closeCallback);
-        ContextMenu_1.main.isOpen = false;
-    }
-    firstUpdated() {
-        ContextMenu_1.main = this;
-    }
-    updated() {
-        if (!this.container) {
-            return;
+var ContextMenu_1,__decorate=this&&this.__decorate||function(e,t,n,o){var i,r=arguments.length,s=r<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,n):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,n,o);else for(var a=e.length-1;a>=0;a--)(i=e[a])&&(s=(r<3?i(s):r>3?i(t,n,s):i(t,n))||s);return r>3&&s&&Object.defineProperty(t,n,s),s};import{LitElement as e,html as t,css as n}from"lit";import{customElement as o,property as i}from"lit/decorators.js";import{translate as r,i18next as s}from"@openremote/or-translate";let ContextMenu=ContextMenu_1=class extends r(s)(e){constructor(){super(...arguments),this.entries=[],this.isOpen=!1,this.closeCallback=()=>{ContextMenu_1.close()}}static get opened(){return ContextMenu_1.main.isOpen}static get styles(){return n`
+        :host{
+            display: inline-block;
+            position: fixed;
+            background: white;
+            outline: 1px solid rgb(200,200,200);
+            box-shadow: rgba(0, 0, 0, 0.05) 0 2px 4px;
+            font-size: 13px;
+            z-index: 1000000;
         }
-        const bounds = this.container.getBoundingClientRect();
-        const box = this.getBoundingClientRect();
-        if (box.top + box.height > bounds.bottom) {
-            this.style.top = box.top - box.height + "px";
+        .context-menu-button{
+            color: rgb(0,0,0);
+            display: grid;
+            align-items: center;
+            justify-items: start;
+            grid-template-rows: 32px;
+            grid-template-columns: 32px 220px;
+            grid-template-areas:
+                "icon label";
         }
-        if (box.left + box.width > bounds.right) {
-            this.style.left = bounds.right - box.width + "px";
+        .context-menu-button:hover{
+            background: whitesmoke;
         }
-    }
-    render() {
-        this.style.display = this.isOpen ? "unset" : "none";
-        if (!this.isOpen) {
-            return html ``;
+        .label
+        {
+            grid-area: label;
         }
-        const elements = this.entries.map((e) => {
-            switch (e.type) {
-                case "button":
-                    return this.buttonTemplate(e);
-                case "separator":
-                    return this.separatorTemplate();
-            }
-        });
-        return html `${elements.length > 0 ? elements : html `<div class="context-menu-button muted">...</div>`}`;
-    }
-    buttonTemplate(button) {
-        const action = (e) => {
-            if (e.buttons !== 1) {
-                return;
-            }
-            ContextMenu_1.close();
-            if (button.action) {
-                button.action();
-            }
-            e.stopImmediatePropagation();
-            e.stopPropagation();
-        };
-        return html `
-        <div class="context-menu-button ${(button.disabled || false) ? `muted` : ``}" @mousedown="${action}">
-        ${button.icon ? html `<or-icon icon="${button.icon}"></or-icon>` : null}
-        <span class="label">${button.label}</span></div>`;
-    }
-    separatorTemplate() {
-        return html `<div class="context-menu-separator"></div>`;
-    }
-};
-__decorate([
-    property({ attribute: false })
-], ContextMenu.prototype, "isOpen", void 0);
-ContextMenu = ContextMenu_1 = __decorate([
-    customElement("context-menu")
-], ContextMenu);
-export { ContextMenu };
-//# sourceMappingURL=context-menu.js.map
+        or-icon{
+            justify-self: center;
+            grid-area: icon;
+            height: 16px;
+            width: 16px;
+        }
+        .muted{
+            pointer-events: none;
+            color: rgb(150,150,150);
+        }
+        .context-menu-separator{
+            --thickness: 1px;
+            border: 0;
+            height: var(--thickness);
+            border-bottom: solid var(--thickness);
+            border-color: rgb(234,234,234);
+            padding: 0;
+            margin: 5px 10px calc(5px - var(--thickness)) 10px;
+        }`}static open(e,t,n,o){ContextMenu_1.main.container=n,ContextMenu_1.main.style.top=t+"px",ContextMenu_1.main.style.left=e+"px",window.addEventListener("mousedown",ContextMenu_1.main.closeCallback),window.addEventListener("blur",ContextMenu_1.main.closeCallback),window.addEventListener("wheel",ContextMenu_1.main.closeCallback),ContextMenu_1.main.entries=o,ContextMenu_1.main.isOpen=!0}static close(){window.removeEventListener("mousedown",ContextMenu_1.main.closeCallback),window.removeEventListener("blur",ContextMenu_1.main.closeCallback),window.removeEventListener("wheel",ContextMenu_1.main.closeCallback),ContextMenu_1.main.isOpen=!1}firstUpdated(){ContextMenu_1.main=this}updated(){if(!this.container)return;let e=this.container.getBoundingClientRect(),t=this.getBoundingClientRect();t.top+t.height>e.bottom&&(this.style.top=t.top-t.height+"px"),t.left+t.width>e.right&&(this.style.left=e.right-t.width+"px")}render(){if(this.style.display=this.isOpen?"unset":"none",!this.isOpen)return t``;let e=this.entries.map(e=>{switch(e.type){case"button":return this.buttonTemplate(e);case"separator":return this.separatorTemplate()}});return t`${e.length>0?e:t`<div class="context-menu-button muted">...</div>`}`}buttonTemplate(e){return t`
+        <div class="context-menu-button ${e.disabled||0?"muted":""}" @mousedown="${t=>{1===t.buttons&&(ContextMenu_1.close(),e.action&&e.action(),t.stopImmediatePropagation(),t.stopPropagation())}}">
+        ${e.icon?t`<or-icon icon="${e.icon}"></or-icon>`:null}
+        <span class="label">${e.label}</span></div>`}separatorTemplate(){return t`<div class="context-menu-separator"></div>`}};__decorate([i({attribute:!1})],ContextMenu.prototype,"isOpen",void 0),ContextMenu=ContextMenu_1=__decorate([o("context-menu")],ContextMenu);export{ContextMenu};