@openremote/or-dashboard-builder 1.5.0-snapshot.20250422083638 → 1.5.0-snapshot.20250422162853

package/dist/umd/index.js

@@ -733,7 +733,7 @@
         align-items: center;
         padding-left: 10px;
     }
-`;let Oa=class extends Lt{constructor(){super(...arguments),this.realm=Wn().displayRealm,this.readonly=!0,this.hasChanged=!1,this.showControls=!0}static get styles(){return[Sr,Ra,Sa.style]}shouldUpdate(t){return(1!==t.size||!t.has("hasChanged")||!this.hasChanged)&&super.shouldUpdate(t)}updated(t){this.dashboards||this.getAllDashboards(),t.has("dashboards")&&null!=t.get("dashboards")&&this.dispatchEvent(new CustomEvent("updated",{detail:this.dashboards})),t.has("selected")&&this.dispatchEvent(new CustomEvent("select",{detail:this.selected}))}getAllDashboards(){return function(t,e,i,n){return new(i||(i=Promise))((function(r,a){function o(t){try{l(n.next(t))}catch(t){a(t)}}function s(t){try{l(n.throw(t))}catch(t){a(t)}}function l(t){var e;t.done?r(t.value):(e=t.value,e instanceof i?e:new i((function(t){t(e)}))).then(o,s)}l((n=n.apply(t,e||[])).next())}))}(this,void 0,void 0,(function*(){return Wn().rest.api.DashboardResource.getAllRealmDashboards(this.realm).then((t=>{this.dashboards=t.data})).catch((t=>{console.error(t),Ma(void 0,"errorOccurred")}))}))}selectDashboard(t){var e;this.selected="string"==typeof t?null===(e=this.dashboards)||void 0===e?void 0:e.find((e=>e.id===t)):t}createDashboard(t){Aa.create(void 0,t,this.realm).then((t=>{this.dashboards?(this.dashboards.push(t),this.requestUpdate("dashboards")):this.dashboards=[t],this.dispatchEvent(new CustomEvent("created",{detail:{d:t}})),this.selectDashboard(t)})).catch((t=>{var e;console.error(t),(0,Da.isAxiosError)(t)&&404===(null===(e=t.response)||void 0===e?void 0:e.status)?Ma(void 0,"noDashboardFound"):Ma(void 0,"errorOccurred")}))}duplicateDashboard(t){null!==(null==t?void 0:t.id)?this.hasChanged?this.showDiscardChangesModal().then((e=>{e&&this._doDuplicateDashboard(t)})):this._doDuplicateDashboard(t):console.warn("Tried duplicating a NULL dashboard!")}_doDuplicateDashboard(t){const e=JSON.parse(JSON.stringify(t));e.displayName=e.displayName+" copy",e.template&&(e.template.id=Math.random().toString(36).slice(2,String(e.template.id).length+2)),Aa.create(e,void 0,this.realm).then((t=>{this.dashboards?(this.dashboards.push(t),this.requestUpdate("dashboards")):this.dashboards=[t],this.dispatchEvent(new CustomEvent("created",{detail:{d:t}})),this.selectDashboard(t.id)})).catch((t=>{var e;console.error(t),(0,Da.isAxiosError)(t)&&404===(null===(e=t.response)||void 0===e?void 0:e.status)?Ma(void 0,"noDashboardFound"):Ma(void 0,"errorOccurred")}))}deleteDashboard(t){null!=t.id&&Aa.delete(t.id,this.realm).then((()=>{this.getAllDashboards()})).catch((t=>{console.error(t),Ma(void 0,"errorOccurred")}))}onDashboardClick(t){var e;t!==(null===(e=this.selected)||void 0===e?void 0:e.id)&&(this.hasChanged?this.showDiscardChangesModal().then((e=>{e&&this.selectDashboard(t)})):this.selectDashboard(t))}showDiscardChangesModal(){return Kr(qn.i18next.t("areYouSure"),qn.i18next.t("confirmContinueDashboardModified"),qn.i18next.t("discard"))}render(){var t;const e=[];if(this.dashboards&&this.dashboards.length>0&&this.userId){const i=[],n=[];if(null===(t=this.dashboards)||void 0===t||t.forEach((t=>{t.ownerId===this.userId?i.push(t):n.push(t)})),i.length>0){const t=[];i.sort(((t,e)=>t.displayName?t.displayName.localeCompare(e.displayName):0)).forEach((e=>{t.push({icon:"view-dashboard",text:e.displayName,value:e.id})})),e.push(t)}if(n.length>0){const t=[];n.sort(((t,e)=>t.displayName?t.displayName.localeCompare(e.displayName):0)).forEach((e=>{t.push({icon:"view-dashboard",text:e.displayName,value:e.id})})),e.push(t)}}return F`
+`;let Oa=class extends Lt{constructor(){super(...arguments),this.realm=Wn().displayRealm,this.readonly=!0,this.hasChanged=!1,this.showControls=!0}static get styles(){return[Sr,Ra,Sa.style]}shouldUpdate(t){return(1!==t.size||!t.has("hasChanged")||!this.hasChanged)&&super.shouldUpdate(t)}updated(t){this.dashboards||this.getAllDashboards(),t.has("dashboards")&&null!=t.get("dashboards")&&this.dispatchEvent(new CustomEvent("updated",{detail:this.dashboards})),t.has("selected")&&this.dispatchEvent(new CustomEvent("select",{detail:this.selected}))}getAllDashboards(){return function(t,e,i,n){return new(i||(i=Promise))((function(r,a){function o(t){try{l(n.next(t))}catch(t){a(t)}}function s(t){try{l(n.throw(t))}catch(t){a(t)}}function l(t){var e;t.done?r(t.value):(e=t.value,e instanceof i?e:new i((function(t){t(e)}))).then(o,s)}l((n=n.apply(t,e||[])).next())}))}(this,void 0,void 0,(function*(){return Wn().rest.api.DashboardResource.getAllRealmDashboards(this.realm).then((t=>{this.dashboards=t.data})).catch((t=>{console.error(t),Ma(void 0,"errorOccurred")}))}))}selectDashboard(t){var e;this.selected="string"==typeof t?null===(e=this.dashboards)||void 0===e?void 0:e.find((e=>e.id===t)):t}createDashboard(t){Aa.create(void 0,t,this.realm).then((t=>{this.dashboards?(this.dashboards.push(t),this.requestUpdate("dashboards")):this.dashboards=[t],this.dispatchEvent(new CustomEvent("created",{detail:{d:t}})),this.selectDashboard(t)})).catch((t=>{var e;console.error(t),(0,Da.isAxiosError)(t)&&404===(null===(e=t.response)||void 0===e?void 0:e.status)?Ma(void 0,"noDashboardFound"):Ma(void 0,"errorOccurred")}))}duplicateDashboard(t){null!==(null==t?void 0:t.id)?this.hasChanged?this.showDiscardChangesModal().then((e=>{e&&this._doDuplicateDashboard(t)})):this._doDuplicateDashboard(t):console.warn("Tried duplicating a NULL dashboard!")}_doDuplicateDashboard(t){const e=JSON.parse(JSON.stringify(t));e.displayName=e.displayName+" copy",e.template&&(e.template.id=Math.random().toString(36).slice(2,String(e.template.id).length+2)),Aa.create(e,void 0,this.realm).then((t=>{this.dashboards?(this.dashboards.push(t),this.requestUpdate("dashboards")):this.dashboards=[t],this.dispatchEvent(new CustomEvent("created",{detail:{d:t}})),this.selectDashboard(t.id)})).catch((t=>{var e;console.error(t),(0,Da.isAxiosError)(t)&&404===(null===(e=t.response)||void 0===e?void 0:e.status)?Ma(void 0,"noDashboardFound"):Ma(void 0,"errorOccurred")}))}deleteDashboard(t){null!=t.id&&Aa.delete(t.id,this.realm).then((()=>{this.getAllDashboards()})).catch((t=>{console.error(t),Ma(void 0,"errorOccurred")}))}onDashboardClick(t){var e;t!==(null===(e=this.selected)||void 0===e?void 0:e.id)&&(this.hasChanged?this.showDiscardChangesModal().then((e=>{e&&this.selectDashboard(t)})):this.selectDashboard(t))}showDiscardChangesModal(){return Kr(qn.i18next.t("areYouSure"),qn.i18next.t("confirmContinueDashboardModified"),qn.i18next.t("discard"))}render(){var t;const e=(null===(t=this.dashboards)||void 0===t?void 0:t.sort(((t,e)=>t.displayName?t.displayName.localeCompare(e.displayName):0)).map((t=>({icon:"view-dashboard",text:t.displayName,value:t.id}))))||[];return F`
             <div id="menu-header">
                 <div id="title-container">
                     <span id="title"><or-translate value="insights"></or-translate></span>
@@ -762,25 +762,16 @@
             
             <!-- List of dashboards -->
             <div id="content">
-                <div style="padding-top: 8px;">
-                    ${e.map(((t,e)=>null!=t&&t.length>0?F`
-                            <div style="padding: 8px 0;">
-                                <span style="font-weight: 500; padding-left: 14px; color: #000000;">
-                                    <or-translate value="${0===e?"dashboard.myDashboards":"dashboard.createdByOthers"}"></or-translate>
-                                 </span>
-                                <div id="list-container" style="overflow: hidden;">
-                                    <ol id="list">
-                                        ${t.map((t=>{var e;return F`
-                                                <li ?data-selected="${t.value===(null===(e=this.selected)||void 0===e?void 0:e.id)}" @click="${e=>{this.onDashboardClick(t.value)}}">
-                                                    <div class="node-container">
-                                                        <span class="node-name">${t.text} </span>
-                                                    </div>
-                                                </li>
-                                            `}))}
-                                    </ol>
+                <div id="list-container" style="overflow: hidden;">
+                    <ol id="list">
+                        ${e.map((t=>{var e;return F`
+                            <li ?data-selected="${t.value===(null===(e=this.selected)||void 0===e?void 0:e.id)}" @click="${e=>this.onDashboardClick(t.value)}">
+                                <div class="node-container">
+                                    <span class="node-name">${t.text} </span>
                                 </div>
-                            </div>
-                        `:void 0))}
+                            </li>
+                        `}))}
+                    </ol>
                 </div>
             </div>
         `}};Ia([Dt()],Oa.prototype,"dashboards",void 0),Ia([Dt()],Oa.prototype,"selected",void 0),Ia([Dt()],Oa.prototype,"realm",void 0),Ia([Dt()],Oa.prototype,"userId",void 0),Ia([Dt()],Oa.prototype,"readonly",void 0),Ia([Dt()],Oa.prototype,"hasChanged",void 0),Ia([Dt()],Oa.prototype,"showControls",void 0),Oa=Ia([St("or-dashboard-tree")],Oa);var Pa=p(1240),za=function(t,e,i,n){var r,a=arguments.length,o=a<3?e:null===n?n=Object.getOwnPropertyDescriptor(e,i):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)o=Reflect.decorate(t,e,i,n);else for(var s=t.length-1;s>=0;s--)(r=t[s])&&(o=(a<3?r(o):a>3?r(e,i,o):r(e,i))||o);return a>3&&o&&Object.defineProperty(e,i,o),o};const Ya=p(6280),Na=p(3416),Ha=ht`
@@ -988,7 +979,7 @@
                 linear-gradient(#E0E0E0, transparent 1px),
                 linear-gradient(transparent calc(100% - 1px), #E0E0E0 100%);
     }
-`;let ao=class extends Lt{set template(t){const e=this._template;if(null!=e){const i={changedKeys:Object.keys(t).filter((i=>JSON.stringify(t[i])!==JSON.stringify(e[i]))),oldValue:e,newValue:t};this._template=JSON.parse(JSON.stringify(t)),this.latestChanges=i,this.requestUpdate("template",e)}else null!=t&&(console.debug("Creating a new Dashboard grid..."),this._template=t,this.setupGrid(!1,!1))}get template(){return this._template}constructor(){super(),this.editMode=!1,this.readonly=!0,this.previewZoom=1,this.fullscreen=!0,this.rerenderActive=!1,this.isLoading=!1,this.cachedGridstackCSS=new Map,this.resizeObserverCallback=t=>{var e;(null===(e=this.previousObserverEntry)||void 0===e?void 0:e.contentRect.width)+"px"!=t[0].contentRect.width+"px"&&this._onGridResize(),this.previousObserverEntry=t[0]},this.realm||(this.realm=Wn().displayRealm),this.availablePreviewSizes||(this.availablePreviewSizes=[{displayName:"4k Television",width:3840,height:2160},{displayName:"Desktop",width:1920,height:1080},{displayName:"Small desktop",width:1280,height:720},{displayName:"Phone",width:360,height:800},{displayName:"Custom"}]),this.previewSize||(this.previewSize=this.availablePreviewSizes[3]),Pa.GridStack.registerEngine(to)}static get styles(){return[ut(io),ut(no),ro,Sr]}shouldUpdate(t){var e,i,n;const r=t;return t.has("latestChanges")&&0==(null===(e=this.latestChanges)||void 0===e?void 0:e.changedKeys.length)&&JSON.stringify(null===(i=t.get("latestChanges"))||void 0===i?void 0:i.oldValue)==JSON.stringify(null===(n=t.get("latestChanges"))||void 0===n?void 0:n.newValue)&&r.delete("latestChanges"),this.fullscreen&&t.has("previewWidth")&&r.delete("previewWidth"),this.fullscreen&&t.has("previewHeight")&&r.delete("previewHeight"),0!==r.size&&super.shouldUpdate(t)}updated(t){var e,i,n,r,a,o;if(super.updated(t),null==this.realm&&(this.realm=Wn().displayRealm),!this.template&&this.dashboardId?Wn().rest.api.DashboardResource.get(this.realm,this.dashboardId).then((t=>{this.template=t.data.template})).catch((t=>{console.error(t),Ma(void 0,"errorOccurred")})):null==this.template&&null==this.dashboardId&&console.warn("Neither the template nor dashboardId attributes have been specified!"),t.has("latestChanges")&&this.latestChanges&&(this.processTemplateChanges(this.latestChanges),this.latestChanges=void 0),t.has("selectedWidget"))if(this.selectedWidget){if(null!=t.get("selectedWidget")&&this.dispatchEvent(new CustomEvent("deselected",{detail:t.get("selectedWidget")})),null!=(null===(e=this.grid)||void 0===e?void 0:e.el)){const t=null===(i=this.grid)||void 0===i?void 0:i.getGridItems().find((t=>{var e,i,n;return(null===(e=t.gridstackNode)||void 0===e?void 0:e.id)==(null===(n=null===(i=this.selectedWidget)||void 0===i?void 0:i.gridItem)||void 0===n?void 0:n.id)}));null!=t&&this.selectGridItem(t),this.dispatchEvent(new CustomEvent("selected",{detail:this.selectedWidget}))}}else null!=(null===(n=this.grid)||void 0===n?void 0:n.el)&&null!=(null===(r=this.grid)||void 0===r?void 0:r.getGridItems())&&this.deselectGridItems(this.grid.getGridItems()),this.dispatchEvent(new CustomEvent("deselected",{detail:t.get("selectedWidget")}));t.has("editMode")&&null!=t.get("editMode")&&(console.debug(`Edit mode is now ${this.editMode}. Force recreating grid...`),this.setupGrid(!0,!0)),(t.has("previewWidth")||t.has("previewHeight"))&&(null===(a=this.template)||void 0===a?void 0:a.screenPresets)&&(this.previewSize=null===(o=this.availablePreviewSizes)||void 0===o?void 0:o.find((t=>t.width+"px"==this.previewWidth&&t.height+"px"==this.previewHeight))),t.has("previewSize")&&this.previewSize&&(this.previewWidth=this.previewSize.width+"px",this.previewHeight=this.previewSize.height+"px"),t.has("rerenderActive")&&this.rerenderActive&&(this.rerenderActive=!1)}setupGrid(t,e=!1){var i,n,r,a,o,s,l,d,c,u,h,m;return function(t,e,i,n){return new(i||(i=Promise))((function(r,a){function o(t){try{l(n.next(t))}catch(t){a(t)}}function s(t){try{l(n.throw(t))}catch(t){a(t)}}function l(t){var e;t.done?r(t.value):(e=t.value,e instanceof i?e:new i((function(t){t(e)}))).then(o,s)}l((n=n.apply(t,e||[])).next())}))}(this,void 0,void 0,(function*(){this.isLoading=!0,yield this.updateComplete;let p=null===(i=this.shadowRoot)||void 0===i?void 0:i.getElementById("gridElement");if(null!=p){t&&null!=this.grid&&(this.grid.destroy(!1),e&&(this.rerenderActive=!0,yield this.updateComplete,yield this.waitUntil((t=>!this.rerenderActive)),p=null===(n=this.shadowRoot)||void 0===n?void 0:n.getElementById("gridElement"),this.grid=void 0));const i=this.fullscreen?this.clientWidth:+(null===(r=this.previewWidth)||void 0===r?void 0:r.replace(/\D/g,"")),f=Ad(i,this.template.screenPresets);if((null==f?void 0:f.scalingPreset)!=(null===(a=this.activePreset)||void 0===a?void 0:a.scalingPreset)&&(t&&e||(t||null===(o=this.grid)||void 0===o||o.destroy(!1),this.rerenderActive=!0,yield this.updateComplete,yield this.waitUntil((t=>!this.rerenderActive)),p=null===(s=this.shadowRoot)||void 0===s?void 0:s.getElementById("gridElement"),this.grid=void 0)),this.activePreset=f,null==this.grid){const t=null===(l=this.shadowRoot)||void 0===l?void 0:l.querySelector(".maingrid");this.setupResizeObserver(t)}p.style.maxWidth=this.template.maxScreenWidth+"px",this.grid=Pa.GridStack.init({acceptWidgets:this.editMode,animate:!0,cellHeight:"WRAP_TO_SINGLE_COLUMN"===(null===(d=this.activePreset)||void 0===d?void 0:d.scalingPreset)?i/((null===(c=this.template)||void 0===c?void 0:c.columns)?this.template.columns/4:2):"initial",column:null===(u=this.template)||void 0===u?void 0:u.columns,disableOneColumnMode:"WRAP_TO_SINGLE_COLUMN"!==(null===(h=this.activePreset)||void 0===h?void 0:h.scalingPreset),oneColumnModeDomSort:!0,draggable:{appendTo:"parent"},float:!0,margin:5,resizable:{handles:"all"},staticGrid:"WRAP_TO_SINGLE_COLUMN"===(null===(m=this.activePreset)||void 0===m?void 0:m.scalingPreset)||!this.editMode,styleInHead:!1},p),p.style.backgroundSize=this.grid.cellWidth()+"px "+this.grid.getCellHeight()+"px",p.style.height="100%",p.style.minHeight="100%",this.grid.on("dropped",((t,e,i)=>this.onWidgetDrop(t,e,i))),this.grid.on("change",((t,e)=>{null!=this.template&&null!=this.template.widgets&&(e.forEach((t=>{var e,i;const n=null===(i=null===(e=this.template)||void 0===e?void 0:e.widgets)||void 0===i?void 0:i.find((e=>{var i;return(null===(i=e.gridItem)||void 0===i?void 0:i.id)==t.id}));n.gridItem.x=t.x,n.gridItem.y=t.y,n.gridItem.w=t.w,n.gridItem.h=t.h})),this.dispatchEvent(new CustomEvent("changed",{detail:{template:this.template}})))})),this.grid.on("resizestart",(t=>{this.latestDragWidgetStart=new Date})),this.grid.on("resizestop",(t=>{setTimeout((()=>{this.latestDragWidgetStart=void 0}),200)}))}this.isLoading=!1}))}refreshPreview(){console.debug("Refreshing dashboard preview!"),this.setupGrid(!0,!0)}refreshWidgets(){var t;null===(t=this.grid)||void 0===t||t.getGridItems().forEach((t=>{const e=t.querySelector(Va.tagName);e&&e.refreshContent(!1)}))}selectGridItem(t){null!=this.grid&&(this.deselectGridItems(this.grid.getGridItems()),t.querySelectorAll(".grid-stack-item-content").forEach((t=>{t.classList.add("grid-stack-item-content__active")})))}deselectGridItem(t){t.querySelectorAll(".grid-stack-item-content").forEach((t=>{t.classList.remove("grid-stack-item-content__active")}))}deselectGridItems(t){t.forEach((t=>{this.deselectGridItem(t)}))}onGridItemClick(t){var e,i,n,r,a;this.latestDragWidgetStart||(null===(e=this.grid)||void 0===e?void 0:e.opts.staticGrid)||(t?(null===(n=null===(i=this.selectedWidget)||void 0===i?void 0:i.gridItem)||void 0===n?void 0:n.id)!=t.id&&(this.selectedWidget=null===(a=null===(r=this.template)||void 0===r?void 0:r.widgets)||void 0===a?void 0:a.find((e=>{var i;return(null===(i=e.gridItem)||void 0===i?void 0:i.id)==t.id}))):this.selectedWidget=void 0)}onFitToScreenClick(){var t;const e=null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector("#container");if(e){const t=+(.95*e.clientWidth/+this.previewWidth.replace("px","")).toFixed(2);this.previewZoom=t>1?1:t}}isPreviewVisible(){var t;return!this.isLoading&&"BLOCK_DEVICE"!=(null===(t=this.activePreset)||void 0===t?void 0:t.scalingPreset)}render(){var t,e,i,n,r,a,o,s;try{(null===(t=this.grid)||void 0===t?void 0:t.el)&&(null===(e=this.grid)||void 0===e?void 0:e.getGridItems())&&(null===(i=this.grid)||void 0===i||i.getGridItems().forEach((t=>{var e,i,n;null==(null===(i=null===(e=this.template)||void 0===e?void 0:e.widgets)||void 0===i?void 0:i.find((e=>e.id==t.id)))&&(null===(n=this.grid)||void 0===n||n.removeWidget(t))})))}catch(t){console.error(t)}const l="Custom";let d=null===(r=null===(n=this.template)||void 0===n?void 0:n.screenPresets)||void 0===r?void 0:r.map((t=>t.displayName));return null==d||d.push(l),F`
+`;let ao=class extends Lt{set template(t){const e=this._template;if(null!=e){const i={changedKeys:Object.keys(t).filter((i=>JSON.stringify(t[i])!==JSON.stringify(e[i]))),oldValue:e,newValue:t};this._template=JSON.parse(JSON.stringify(t)),this.latestChanges=i,this.requestUpdate("template",e)}else null!=t&&(console.debug("Creating a new Dashboard grid..."),this._template=t,this.setupGrid(!1,!1))}get template(){return this._template}constructor(){super(),this.editMode=!1,this.readonly=!0,this.previewZoom=1,this.fullscreen=!0,this.rerenderActive=!1,this.isLoading=!1,this.cachedGridstackCSS=new Map,this.resizeObserverCallback=t=>{requestAnimationFrame((()=>{var e;(null===(e=this.previousObserverEntry)||void 0===e?void 0:e.contentRect.width)+"px"!=t[0].contentRect.width+"px"&&this._onGridResize(),this.previousObserverEntry=t[0]}))},this.realm||(this.realm=Wn().displayRealm),this.availablePreviewSizes||(this.availablePreviewSizes=[{displayName:"4k Television",width:3840,height:2160},{displayName:"Desktop",width:1920,height:1080},{displayName:"Small desktop",width:1280,height:720},{displayName:"Phone",width:360,height:800},{displayName:"Custom"}]),this.previewSize||(this.previewSize=this.availablePreviewSizes[3]),Pa.GridStack.registerEngine(to)}static get styles(){return[ut(io),ut(no),ro,Sr]}shouldUpdate(t){var e,i,n;const r=t;return t.has("latestChanges")&&0==(null===(e=this.latestChanges)||void 0===e?void 0:e.changedKeys.length)&&JSON.stringify(null===(i=t.get("latestChanges"))||void 0===i?void 0:i.oldValue)==JSON.stringify(null===(n=t.get("latestChanges"))||void 0===n?void 0:n.newValue)&&r.delete("latestChanges"),this.fullscreen&&t.has("previewWidth")&&r.delete("previewWidth"),this.fullscreen&&t.has("previewHeight")&&r.delete("previewHeight"),0!==r.size&&super.shouldUpdate(t)}updated(t){var e,i,n,r,a,o;if(super.updated(t),null==this.realm&&(this.realm=Wn().displayRealm),!this.template&&this.dashboardId?Wn().rest.api.DashboardResource.get(this.realm,this.dashboardId).then((t=>{this.template=t.data.template})).catch((t=>{console.error(t),Ma(void 0,"errorOccurred")})):null==this.template&&null==this.dashboardId&&console.warn("Neither the template nor dashboardId attributes have been specified!"),t.has("latestChanges")&&this.latestChanges&&(this.processTemplateChanges(this.latestChanges),this.latestChanges=void 0),t.has("selectedWidget"))if(this.selectedWidget){if(null!=t.get("selectedWidget")&&this.dispatchEvent(new CustomEvent("deselected",{detail:t.get("selectedWidget")})),null!=(null===(e=this.grid)||void 0===e?void 0:e.el)){const t=null===(i=this.grid)||void 0===i?void 0:i.getGridItems().find((t=>{var e,i,n;return(null===(e=t.gridstackNode)||void 0===e?void 0:e.id)==(null===(n=null===(i=this.selectedWidget)||void 0===i?void 0:i.gridItem)||void 0===n?void 0:n.id)}));null!=t&&this.selectGridItem(t),this.dispatchEvent(new CustomEvent("selected",{detail:this.selectedWidget}))}}else null!=(null===(n=this.grid)||void 0===n?void 0:n.el)&&null!=(null===(r=this.grid)||void 0===r?void 0:r.getGridItems())&&this.deselectGridItems(this.grid.getGridItems()),this.dispatchEvent(new CustomEvent("deselected",{detail:t.get("selectedWidget")}));t.has("editMode")&&null!=t.get("editMode")&&(console.debug(`Edit mode is now ${this.editMode}. Force recreating grid...`),this.setupGrid(!0,!0)),(t.has("previewWidth")||t.has("previewHeight"))&&(null===(a=this.template)||void 0===a?void 0:a.screenPresets)&&(this.previewSize=null===(o=this.availablePreviewSizes)||void 0===o?void 0:o.find((t=>t.width+"px"==this.previewWidth&&t.height+"px"==this.previewHeight))),t.has("previewSize")&&this.previewSize&&(this.previewWidth=this.previewSize.width+"px",this.previewHeight=this.previewSize.height+"px"),t.has("rerenderActive")&&this.rerenderActive&&(this.rerenderActive=!1)}setupGrid(t,e=!1){var i,n,r,a,o,s,l,d,c,u,h,m;return function(t,e,i,n){return new(i||(i=Promise))((function(r,a){function o(t){try{l(n.next(t))}catch(t){a(t)}}function s(t){try{l(n.throw(t))}catch(t){a(t)}}function l(t){var e;t.done?r(t.value):(e=t.value,e instanceof i?e:new i((function(t){t(e)}))).then(o,s)}l((n=n.apply(t,e||[])).next())}))}(this,void 0,void 0,(function*(){this.isLoading=!0,yield this.updateComplete;let p=null===(i=this.shadowRoot)||void 0===i?void 0:i.getElementById("gridElement");if(null!=p){t&&null!=this.grid&&(this.grid.destroy(!1),e&&(this.rerenderActive=!0,yield this.updateComplete,yield this.waitUntil((t=>!this.rerenderActive)),p=null===(n=this.shadowRoot)||void 0===n?void 0:n.getElementById("gridElement"),this.grid=void 0));const i=this.fullscreen?this.clientWidth:+(null===(r=this.previewWidth)||void 0===r?void 0:r.replace(/\D/g,"")),f=Ad(i,this.template.screenPresets);if((null==f?void 0:f.scalingPreset)!=(null===(a=this.activePreset)||void 0===a?void 0:a.scalingPreset)&&(t&&e||(t||null===(o=this.grid)||void 0===o||o.destroy(!1),this.rerenderActive=!0,yield this.updateComplete,yield this.waitUntil((t=>!this.rerenderActive)),p=null===(s=this.shadowRoot)||void 0===s?void 0:s.getElementById("gridElement"),this.grid=void 0)),this.activePreset=f,null==this.grid){const t=null===(l=this.shadowRoot)||void 0===l?void 0:l.querySelector(".maingrid");this.setupResizeObserver(t)}p.style.maxWidth=this.template.maxScreenWidth+"px",this.grid=Pa.GridStack.init({acceptWidgets:this.editMode,animate:!0,cellHeight:"WRAP_TO_SINGLE_COLUMN"===(null===(d=this.activePreset)||void 0===d?void 0:d.scalingPreset)?i/((null===(c=this.template)||void 0===c?void 0:c.columns)?this.template.columns/4:2):"initial",column:null===(u=this.template)||void 0===u?void 0:u.columns,disableOneColumnMode:"WRAP_TO_SINGLE_COLUMN"!==(null===(h=this.activePreset)||void 0===h?void 0:h.scalingPreset),oneColumnModeDomSort:!0,draggable:{appendTo:"parent"},float:!0,margin:5,resizable:{handles:"all"},staticGrid:"WRAP_TO_SINGLE_COLUMN"===(null===(m=this.activePreset)||void 0===m?void 0:m.scalingPreset)||!this.editMode,styleInHead:!1},p),p.style.backgroundSize=this.grid.cellWidth()+"px "+this.grid.getCellHeight()+"px",p.style.height="100%",p.style.minHeight="100%",this.grid.on("dropped",((t,e,i)=>this.onWidgetDrop(t,e,i))),this.grid.on("change",((t,e)=>{null!=this.template&&null!=this.template.widgets&&(e.forEach((t=>{var e,i;const n=null===(i=null===(e=this.template)||void 0===e?void 0:e.widgets)||void 0===i?void 0:i.find((e=>{var i;return(null===(i=e.gridItem)||void 0===i?void 0:i.id)==t.id}));n.gridItem.x=t.x,n.gridItem.y=t.y,n.gridItem.w=t.w,n.gridItem.h=t.h})),this.dispatchEvent(new CustomEvent("changed",{detail:{template:this.template}})))})),this.grid.on("resizestart",(t=>{this.latestDragWidgetStart=new Date})),this.grid.on("resizestop",(t=>{setTimeout((()=>{this.latestDragWidgetStart=void 0}),200)}))}this.isLoading=!1}))}refreshPreview(){console.debug("Refreshing dashboard preview!"),this.setupGrid(!0,!0)}refreshWidgets(){var t;null===(t=this.grid)||void 0===t||t.getGridItems().forEach((t=>{const e=t.querySelector(Va.tagName);e&&e.refreshContent(!1)}))}selectGridItem(t){null!=this.grid&&(this.deselectGridItems(this.grid.getGridItems()),t.querySelectorAll(".grid-stack-item-content").forEach((t=>{t.classList.add("grid-stack-item-content__active")})))}deselectGridItem(t){t.querySelectorAll(".grid-stack-item-content").forEach((t=>{t.classList.remove("grid-stack-item-content__active")}))}deselectGridItems(t){t.forEach((t=>{this.deselectGridItem(t)}))}onGridItemClick(t){var e,i,n,r,a;this.latestDragWidgetStart||(null===(e=this.grid)||void 0===e?void 0:e.opts.staticGrid)||(t?(null===(n=null===(i=this.selectedWidget)||void 0===i?void 0:i.gridItem)||void 0===n?void 0:n.id)!=t.id&&(this.selectedWidget=null===(a=null===(r=this.template)||void 0===r?void 0:r.widgets)||void 0===a?void 0:a.find((e=>{var i;return(null===(i=e.gridItem)||void 0===i?void 0:i.id)==t.id}))):this.selectedWidget=void 0)}onFitToScreenClick(){var t;const e=null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector("#container");if(e){const t=+(.95*e.clientWidth/+this.previewWidth.replace("px","")).toFixed(2);this.previewZoom=t>1?1:t}}isPreviewVisible(){var t;return!this.isLoading&&"BLOCK_DEVICE"!=(null===(t=this.activePreset)||void 0===t?void 0:t.scalingPreset)}render(){var t,e,i,n,r,a,o,s;try{(null===(t=this.grid)||void 0===t?void 0:t.el)&&(null===(e=this.grid)||void 0===e?void 0:e.getGridItems())&&(null===(i=this.grid)||void 0===i||i.getGridItems().forEach((t=>{var e,i,n;null==(null===(i=null===(e=this.template)||void 0===e?void 0:e.widgets)||void 0===i?void 0:i.find((e=>e.id==t.id)))&&(null===(n=this.grid)||void 0===n||n.removeWidget(t))})))}catch(t){console.error(t)}const l="Custom";let d=null===(r=null===(n=this.template)||void 0===n?void 0:n.screenPresets)||void 0===r?void 0:r.map((t=>t.displayName));return null==d||d.push(l),F`
             <div id="buildingArea" style="display: flex; flex-direction: column; height: 100%; position: relative;" @click="${t=>{"buildingArea"===t.composedPath()[1].id&&this.onGridItemClick(void 0)}}">
                 ${this.editMode&&!this.fullscreen?F`
                     <div id="view-options">
@@ -1081,33 +1072,20 @@
     .label {
         margin-bottom: 4px;
     }
-`;let go=class extends Lt{static get styles(){return[fo,Sr]}forceParentUpdate(t=!1){this.dispatchEvent(new CustomEvent("update",{detail:{force:t}}))}setViewAccess(t){this.dashboard.viewAccess=t,"PRIVATE"===t&&(this.dashboard.editAccess="PRIVATE"),this.requestUpdate(),this.forceParentUpdate(!1)}setEditAccess(t){this.dashboard.editAccess=t,this.requestUpdate(),this.forceParentUpdate(!1)}setBreakpoint(t,e){this.dashboard.template.screenPresets[t].breakpoint=e,this.requestUpdate(),this.forceParentUpdate(!0)}setRefreshInterval(t){this.dashboard.template.refreshInterval=t,this.requestUpdate(),this.forceParentUpdate(!1)}render(){var t,e;if(null!=(null===(t=this.dashboard.template)||void 0===t?void 0:t.screenPresets)){const t=Cd(this.dashboard.template.screenPresets,!0),i=["PRIVATE","SHARED","PUBLIC"].map((t=>({key:t,value:Sd(t)}))),n=["PRIVATE","SHARED"].map((t=>({key:t,value:Sd(t)}))),r=["OFF","ONE_MIN","FIVE_MIN","QUARTER","ONE_HOUR"].map((t=>({key:t,value:`dashboard.interval.${t.toLowerCase()}`}))),a=[];return["KEEP_LAYOUT","WRAP_TO_SINGLE_COLUMN","BLOCK_DEVICE"].forEach((t=>{a.push({key:t,value:Ed(t)})})),F`
+`;let go=class extends Lt{static get styles(){return[fo,Sr]}forceParentUpdate(t=!1){this.dispatchEvent(new CustomEvent("update",{detail:{force:t}}))}setAccess(t){this.dashboard.access=t,this.requestUpdate(),this.forceParentUpdate(!1)}setBreakpoint(t,e){this.dashboard.template.screenPresets[t].breakpoint=e,this.requestUpdate(),this.forceParentUpdate(!0)}setRefreshInterval(t){this.dashboard.template.refreshInterval=t,this.requestUpdate(),this.forceParentUpdate(!1)}render(){var t,e;if(null!=(null===(t=this.dashboard.template)||void 0===t?void 0:t.screenPresets)){const t=Cd(this.dashboard.template.screenPresets,!0),i=["PRIVATE","SHARED","PUBLIC"].map((t=>({key:t,value:Sd(t)}))),n=["OFF","ONE_MIN","FIVE_MIN","QUARTER","ONE_HOUR"].map((t=>({key:t,value:`dashboard.interval.${t.toLowerCase()}`}))),r=[];return["KEEP_LAYOUT","WRAP_TO_SINGLE_COLUMN","BLOCK_DEVICE"].forEach((t=>{r.push({key:t,value:Ed(t)})})),F`
 
                 <!-- Permissions panel, to set who can view/edit the selected dashboard -->
                 ${zt(this.showPerms,(()=>F`
                     <settings-panel displayName="permissions" expanded="${!0}">
                         <div>
-                            <div style="margin-bottom: 24px;">
-                                <div class="label">
-                                    ${F`<span>${mo(qn.i18next.t("dashboard.whoCanView").toString())}</span>`}
-                                </div>
-                                <or-mwc-input class="permissionInput" comfortable type="${Tr.SELECT}" style="width: 100%;"
-                                              .options="${i.map((t=>t.value))}"
-                                              .value="${Sd(this.dashboard.viewAccess)}"
-                                              @or-mwc-input-changed="${t=>{var e;this.setViewAccess(null===(e=i.find((e=>e.value==t.detail.value)))||void 0===e?void 0:e.key)}}"
-                                ></or-mwc-input>
-                            </div>
-                            <div style="margin-bottom: 24px;">
-                                <div class="label">
-                                    ${F`<span>${mo(qn.i18next.t("dashboard.whoCanEdit").toString())}</span>`}
-                                </div>
-                                <or-mwc-input class="permissionInput" comfortable type="${Tr.SELECT}" style="width: 100%;"
-                                              .disabled="${"PRIVATE"==this.dashboard.viewAccess}"
-                                              .options="${n.map((t=>t.value))}"
-                                              .value="${Sd(this.dashboard.editAccess)}"
-                                              @or-mwc-input-changed="${t=>{var e;this.setEditAccess(null===(e=n.find((e=>e.value==t.detail.value)))||void 0===e?void 0:e.key)}}"
-                                ></or-mwc-input>
+                            <div class="label">
+                                ${F`<span>${mo(qn.i18next.t("dashboard.whoCanView").toString())}</span>`}
                             </div>
+                            <or-mwc-input class="permissionInput" comfortable type="${Tr.SELECT}" style="width: 100%;"
+                                          .options="${i.map((t=>t.value))}"
+                                          .value="${Sd(this.dashboard.access)}"
+                                          @or-mwc-input-changed="${t=>{var e;this.setAccess(null===(e=i.find((e=>e.value==t.detail.value)))||void 0===e?void 0:e.key)}}"
+                            ></or-mwc-input>
                         </div>
                     </settings-panel>
                 `))}
@@ -1124,7 +1102,7 @@
                         
                         <!-- Scaling preset -->
                         ${1===t.length?F`
-                            ${this.scalingPresetTemplate(t,a)}
+                            ${this.scalingPresetTemplate(t,r)}
                         `:void 0}
                         
                         <!-- Screen preset -->
@@ -1158,9 +1136,9 @@
                         <div class="label">
                             <span><or-translate value="dashboard.defaultRefreshInterval"></or-translate></span>
                         </div>
-                        <or-mwc-input type="${Tr.SELECT}" comfortable .options="${r.map((t=>t.value))}" style="width: 100%;"
+                        <or-mwc-input type="${Tr.SELECT}" comfortable .options="${n.map((t=>t.value))}" style="width: 100%;"
                                       .value="${`dashboard.interval.${(null===(e=this.dashboard.template.refreshInterval)||void 0===e?void 0:e.toLowerCase())||"off"}`}"
-                                      @or-mwc-input-changed="${t=>{const e=r.find((e=>e.value===t.detail.value));e&&this.setRefreshInterval(e.key)}}">
+                                      @or-mwc-input-changed="${t=>{const e=n.find((e=>e.value===t.detail.value));e&&this.setRefreshInterval(e.key)}}">
                         </or-mwc-input>
                     </div>
                 </settings-panel>
@@ -1197,7 +1175,7 @@
                         </div>
                     </div>
                 `))}
-        `}};po([Dt()],go.prototype,"dashboard",void 0),po([Dt()],go.prototype,"showPerms",void 0),go=po([St("or-dashboard-boardsettings")],go);var _o=function(t,e,i,n){var r,a=arguments.length,o=a<3?e:null===n?n=Object.getOwnPropertyDescriptor(e,i):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)o=Reflect.decorate(t,e,i,n);else for(var s=t.length-1;s>=0;s--)(r=t[s])&&(o=(a<3?r(o):a>3?r(e,i,o):r(e,i))||o);return a>3&&o&&Object.defineProperty(e,i,o),o};class yo extends CustomEvent{constructor(t){super(yo.NAME,{bubbles:!0,composed:!0,detail:t})}}yo.NAME="interval-select";let bo=class extends Lt{constructor(){super(...arguments),this.interval="OFF",this.readonly=!0,this.intervalOptions=["OFF","ONE_MIN","FIVE_MIN","QUARTER","ONE_HOUR"]}willUpdate(t){super.willUpdate(t),t.has("interval")&&void 0!==this.interval&&this.dispatchEvent(new yo(this.interval))}render(){const t=this.getRefreshOptions(),e=this.getIntervalString(this.interval);return F`
+        `}};po([Dt({type:Object})],go.prototype,"dashboard",void 0),po([Dt({type:Boolean})],go.prototype,"showPerms",void 0),go=po([St("or-dashboard-boardsettings")],go);var _o=function(t,e,i,n){var r,a=arguments.length,o=a<3?e:null===n?n=Object.getOwnPropertyDescriptor(e,i):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)o=Reflect.decorate(t,e,i,n);else for(var s=t.length-1;s>=0;s--)(r=t[s])&&(o=(a<3?r(o):a>3?r(e,i,o):r(e,i))||o);return a>3&&o&&Object.defineProperty(e,i,o),o};class yo extends CustomEvent{constructor(t){super(yo.NAME,{bubbles:!0,composed:!0,detail:t})}}yo.NAME="interval-select";let bo=class extends Lt{constructor(){super(...arguments),this.interval="OFF",this.readonly=!0,this.intervalOptions=["OFF","ONE_MIN","FIVE_MIN","QUARTER","ONE_HOUR"]}willUpdate(t){super.willUpdate(t),t.has("interval")&&void 0!==this.interval&&this.dispatchEvent(new yo(this.interval))}render(){const t=this.getRefreshOptions(),e=this.getIntervalString(this.interval);return F`
             <div style="height: 100%; display: flex; align-items: center;">
                 ${zt(this.readonly,(()=>F`
                     ${zt("OFF"===this.interval,(()=>F`
@@ -1400,7 +1378,6 @@
   }
   
   #panel-wrapper {
-    border-top: 1px solid #E0E0E0;
     border-bottom: 1px solid #E0E0E0;
   }
 
@@ -2713,7 +2690,7 @@
     .hidescroll::-webkit-scrollbar {
         display: none; /* for Chrome, Safari, and Opera */
     }
-`,Ld=1e6;function Ed(t){return null!=t?qn.i18next.t("dashboard.presets."+t.toLowerCase()):"undefined"}function Sd(t){return qn.i18next.t("dashboard.access."+t.toLowerCase())}function Cd(t,e=!1){return t.sort(((t,i)=>{if(null!=t.breakpoint&&null!=i.breakpoint){if(t.breakpoint>i.breakpoint)return e?1:-1;if(t.breakpoint<i.breakpoint)return e?1:-1}return 0}))}function Ad(t,e){let i;return Cd(e,!0).forEach((e=>{null!=e.breakpoint&&t<=e.breakpoint&&(i=e)})),i}const Dd=new Map;function Id(){Dd.set("linechart",Cs.getManifest()),Dd.set("gauge",Os.getManifest()),Dd.set("image",Hs.getManifest()),Dd.set("kpi",Us.getManifest()),Dd.set("map",ul.getManifest()),Dd.set("attributeinput",_l.getManifest()),Dd.set("table",Wl.getManifest()),Dd.set("gateway",kd.getManifest())}let Rd=class extends Lt{static get styles(){return[Md,Sr]}constructor(){super(),this.editMode=!1,this.fullscreen=!0,this.realm=Wn().displayRealm,this.readonly=!0,this.refreshInterval="OFF",this.keyEmitter=new es,this.sidebarMenuIndex=0,this.showDashboardTree=!0,this.menuItems=[{icon:"content-copy",text:qn.i18next.t("copy")+" URL",value:"copy"},{icon:"open-in-new",text:qn.i18next.t("dashboard.openInNewTab"),value:"tab"}],this.tabItems=[{name:qn.i18next.t("dashboard.widgets")},{name:qn.i18next.t("settings")}],this.isInitializing=!0,this.isLoading=!0,this.hasChanged=!1,Id(),this.updateComplete.then((()=>{this.loadAllDashboards(this.realm)}))}connectedCallback(){super.connectedCallback(),this.keyEmitter.addListener("delete",(t=>{var e,i,n;if(this.selectedWidgetId){const t=null===(n=null===(i=null===(e=this.selectedDashboard)||void 0===e?void 0:e.template)||void 0===i?void 0:i.widgets)||void 0===n?void 0:n.find((t=>t.id==this.selectedWidgetId));t&&Kr(qn.i18next.t("areYouSure"),qn.i18next.t("dashboard.deleteWidgetWarning"),qn.i18next.t("delete")).then((e=>{e&&this.deleteWidget(t)}))}})),this.keyEmitter.addListener("deselect",(t=>{this.deselectWidget()})),this.keyEmitter.addListener("save",(t=>{this.saveDashboard()}))}disconnectedCallback(){super.disconnectedCallback(),this.keyEmitter.removeAllListeners()}willUpdate(t){var e,i,n;if(super.willUpdate(t),this.isLoading=null==this.dashboards,this.isInitializing=null==this.dashboards,1!==t.size||!t.has("selectedWidget")){const t=this.initialDashboardJSON?JSON.parse(this.initialDashboardJSON):void 0,e=Vn.Util.difference(this.selectedDashboard,t);if(Object.keys(e).length>0)this.hasChanged=!0,console.debug("Dashboard has detected changes! Diff:",e);else{const t=this.initialTemplateJSON?JSON.parse(this.initialTemplateJSON):void 0,e=Vn.Util.difference(this.currentTemplate,t);Object.keys(e).length>0?(this.hasChanged=!0,console.debug("Template has detected changes! Diff:",e)):this.hasChanged=!1}}t.has("realm")&&void 0!==t.get("realm")&&this.realm&&this.loadAllDashboards(this.realm),t.has("selectedDashboard")&&(this.deselectWidget(),this.currentTemplate=null===(e=this.selectedDashboard)||void 0===e?void 0:e.template,this.editMode||(this.refreshInterval=(null===(i=this.currentTemplate)||void 0===i?void 0:i.refreshInterval)||"OFF",t.set("refreshInterval",this.refreshInterval)),this.dispatchEvent(new CustomEvent("selected",{detail:this.selectedDashboard}))),t.has("editMode")&&(this.deselectWidget(),this.refreshInterval="OFF",this.showDashboardTree=!0,this.editMode?this.refreshInterval="OFF":this.refreshInterval=(null===(n=this.currentTemplate)||void 0===n?void 0:n.refreshInterval)||"OFF",t.set("refreshInterval",this.refreshInterval)),t.has("refreshInterval")&&this.refreshInterval&&this.setRefreshTimer(function(t){switch(t){case"OFF":default:return;case"ONE_MIN":return 6e4;case"FIVE_MIN":return 3e5;case"QUARTER":return 9e5;case"ONE_HOUR":return 36e5}}(this.refreshInterval))}setRefreshTimer(t){this.clearRefreshTimer(),void 0!==t&&(this.refreshTimer=setInterval((()=>{var t;this.deselectWidget(),null===(t=this.dashboardPreview)||void 0===t||t.refreshWidgets()}),t))}clearRefreshTimer(){this.refreshTimer&&(clearInterval(this.refreshTimer),this.refreshTimer=void 0)}loadAllDashboards(t){var e;return function(t,e,i,n){return new(i||(i=Promise))((function(r,a){function o(t){try{l(n.next(t))}catch(t){a(t)}}function s(t){try{l(n.throw(t))}catch(t){a(t)}}function l(t){var e;t.done?r(t.value):(e=t.value,e instanceof i?e:new i((function(t){t(e)}))).then(o,s)}l((n=n.apply(t,e||[])).next())}))}(this,void 0,void 0,(function*(){yield Wn().rest.api.DashboardResource.getAllRealmDashboards(t).then((t=>{this.dashboards=t.data})).catch((t=>{Ma(void 0,"errorOccurred"),console.error(t)})),void 0!==this.selectedId&&(this.selectedDashboard=null===(e=this.dashboards)||void 0===e?void 0:e.find((t=>t.id==this.selectedId)))}))}updated(t){super.updated(t),t.has("currentTemplate")&&null!=this.selectedDashboard&&(this.selectedDashboard.template=this.currentTemplate)}onWidgetCreation(t){const e=JSON.parse(JSON.stringify(this.currentTemplate));e.widgets||(e.widgets=[]),e.widgets.push(t),this.currentTemplate=e}deleteWidget(t){var e;if(null!=this.currentTemplate&&null!=this.currentTemplate.widgets){const i=this.currentTemplate;i.widgets=null===(e=i.widgets)||void 0===e?void 0:e.filter((e=>e.id!=t.id)),this.currentTemplate=i}this.selectedWidgetId===t.id&&this.deselectWidget()}selectWidget(t){var e,i;const n=null===(i=null===(e=this.currentTemplate)||void 0===e?void 0:e.widgets)||void 0===i?void 0:i.find((e=>{var i,n;return(null===(i=e.gridItem)||void 0===i?void 0:i.id)==(null===(n=t.gridItem)||void 0===n?void 0:n.id)}));null!=n?this.selectedWidgetId=n.id:console.error("The selected widget does not exist!")}deselectWidget(){this.selectedWidgetId=void 0}selectDashboard(t){var e;if(null!=this.dashboards){if(this.selectedDashboard&&this.initialDashboardJSON){const t=this.dashboards.indexOf(this.selectedDashboard);t&&JSON.stringify(this.selectedDashboard)!==this.initialDashboardJSON&&(this.dashboards[t]=JSON.parse(this.initialDashboardJSON))}this.selectedDashboard=t?this.dashboards.find((e=>e.id==t.id)):void 0,this.initialDashboardJSON=JSON.stringify(this.selectedDashboard),this.initialTemplateJSON=JSON.stringify(null===(e=this.selectedDashboard)||void 0===e?void 0:e.template)}}changeDashboardName(t){null!=this.selectedDashboard&&(this.selectedDashboard.displayName=t,this.requestUpdate("selectedDashboard"))}openDashboardInInsights(){var t;if(null!=this.selectedDashboard){const e=window.location.origin+"/insights/?realm="+Wn().displayRealm+"#/view/"+this.selectedDashboard.id+"/true/";null===(t=window.open(e))||void 0===t||t.focus()}}shareUrl(t){var e;let i=window.location.href.replace("true","false");"copy"==t?navigator.clipboard.writeText(i):"tab"==t&&(null===(e=window.open(i,"_blank"))||void 0===e||e.focus())}saveDashboard(){null!=this.selectedDashboard&&!this._isReadonly()&&this._hasEditAccess()?(this.isLoading=!0,Wn().rest.api.DashboardResource.update(this.selectedDashboard).then((()=>{var t;null!=this.dashboards&&null!=this.selectedDashboard&&(this.initialDashboardJSON=JSON.stringify(this.selectedDashboard),this.initialTemplateJSON=JSON.stringify(this.selectedDashboard.template),this.dashboards[null===(t=this.dashboards)||void 0===t?void 0:t.indexOf(this.selectedDashboard)]=this.selectedDashboard,this.currentTemplate=Object.assign({},this.selectedDashboard.template),Ma(void 0,"dashboard.saveSuccessful"))})).catch((t=>{console.error(t),Ma(void 0,"errorOccurred")})).finally((()=>{this.isLoading=!1}))):(console.error("The selected dashboard could not be found.."),Ma(void 0,"errorOccurred"))}_isReadonly(){return this.readonly||!Wn().hasRole("write:insights")}_hasEditAccess(){var t,e;return null!=this.userId&&("PRIVATE"!=(null===(t=this.selectedDashboard)||void 0===t?void 0:t.editAccess)||(null===(e=this.selectedDashboard)||void 0===e?void 0:e.ownerId)==this.userId)}_hasViewAccess(){var t,e;return null!=this.userId&&("PRIVATE"!=(null===(t=this.selectedDashboard)||void 0===t?void 0:t.viewAccess)||(null===(e=this.selectedDashboard)||void 0===e?void 0:e.ownerId)==this.userId)}render(){var t,e,i,n;window.matchMedia("(max-width: 600px)").matches&&this.editMode&&(this.dispatchEvent(new CustomEvent("editToggle",{detail:!1})),this.showDashboardTree=!0);const r={display:!this.editMode||!this._isReadonly()&&this._hasEditAccess()?void 0:"none",maxHeight:this.editMode?"calc(100vh - 77px - 50px)":"inherit"};return!this.isInitializing||null!=this.dashboards&&0==this.dashboards.length?F`
+`,Ld=1e6;function Ed(t){return null!=t?qn.i18next.t("dashboard.presets."+t.toLowerCase()):"undefined"}function Sd(t){return qn.i18next.t("dashboard.access."+t.toLowerCase())}function Cd(t,e=!1){return t.sort(((t,i)=>{if(null!=t.breakpoint&&null!=i.breakpoint){if(t.breakpoint>i.breakpoint)return e?1:-1;if(t.breakpoint<i.breakpoint)return e?1:-1}return 0}))}function Ad(t,e){let i;return Cd(e,!0).forEach((e=>{null!=e.breakpoint&&t<=e.breakpoint&&(i=e)})),i}const Dd=new Map;function Id(){Dd.set("linechart",Cs.getManifest()),Dd.set("gauge",Os.getManifest()),Dd.set("image",Hs.getManifest()),Dd.set("kpi",Us.getManifest()),Dd.set("map",ul.getManifest()),Dd.set("attributeinput",_l.getManifest()),Dd.set("table",Wl.getManifest()),Dd.set("gateway",kd.getManifest())}let Rd=class extends Lt{static get styles(){return[Md,Sr]}constructor(){super(),this.editMode=!1,this.fullscreen=!0,this.realm=Wn().displayRealm,this.readonly=!0,this.refreshInterval="OFF",this.keyEmitter=new es,this.sidebarMenuIndex=0,this.showDashboardTree=!0,this.menuItems=[{icon:"content-copy",text:qn.i18next.t("copy")+" URL",value:"copy"},{icon:"open-in-new",text:qn.i18next.t("dashboard.openInNewTab"),value:"tab"}],this.tabItems=[{name:qn.i18next.t("dashboard.widgets")},{name:qn.i18next.t("settings")}],this.isInitializing=!0,this.isLoading=!0,this.hasChanged=!1,Id(),this.updateComplete.then((()=>{this.loadAllDashboards(this.realm)}))}connectedCallback(){super.connectedCallback(),this.keyEmitter.addListener("delete",(t=>{var e,i,n;if(this.selectedWidgetId){const t=null===(n=null===(i=null===(e=this.selectedDashboard)||void 0===e?void 0:e.template)||void 0===i?void 0:i.widgets)||void 0===n?void 0:n.find((t=>t.id==this.selectedWidgetId));t&&Kr(qn.i18next.t("areYouSure"),qn.i18next.t("dashboard.deleteWidgetWarning"),qn.i18next.t("delete")).then((e=>{e&&this.deleteWidget(t)}))}})),this.keyEmitter.addListener("deselect",(t=>{this.deselectWidget()})),this.keyEmitter.addListener("save",(t=>{this.saveDashboard()}))}disconnectedCallback(){super.disconnectedCallback(),this.keyEmitter.removeAllListeners()}willUpdate(t){var e,i,n;if(super.willUpdate(t),this.isLoading=null==this.dashboards,this.isInitializing=null==this.dashboards,1!==t.size||!t.has("selectedWidget")){const t=this.initialDashboardJSON?JSON.parse(this.initialDashboardJSON):void 0,e=Vn.Util.difference(this.selectedDashboard,t);if(Object.keys(e).length>0)this.hasChanged=!0,console.debug("Dashboard has detected changes! Diff:",e);else{const t=this.initialTemplateJSON?JSON.parse(this.initialTemplateJSON):void 0,e=Vn.Util.difference(this.currentTemplate,t);Object.keys(e).length>0?(this.hasChanged=!0,console.debug("Template has detected changes! Diff:",e)):this.hasChanged=!1}}t.has("realm")&&void 0!==t.get("realm")&&this.realm&&this.loadAllDashboards(this.realm),t.has("selectedDashboard")&&(this.deselectWidget(),this.currentTemplate=null===(e=this.selectedDashboard)||void 0===e?void 0:e.template,this.editMode||(this.refreshInterval=(null===(i=this.currentTemplate)||void 0===i?void 0:i.refreshInterval)||"OFF",t.set("refreshInterval",this.refreshInterval)),this.dispatchEvent(new CustomEvent("selected",{detail:this.selectedDashboard}))),t.has("editMode")&&(this.deselectWidget(),this.refreshInterval="OFF",this.showDashboardTree=!0,this.editMode?this.refreshInterval="OFF":this.refreshInterval=(null===(n=this.currentTemplate)||void 0===n?void 0:n.refreshInterval)||"OFF",t.set("refreshInterval",this.refreshInterval)),t.has("refreshInterval")&&this.refreshInterval&&this.setRefreshTimer(function(t){switch(t){case"OFF":default:return;case"ONE_MIN":return 6e4;case"FIVE_MIN":return 3e5;case"QUARTER":return 9e5;case"ONE_HOUR":return 36e5}}(this.refreshInterval))}setRefreshTimer(t){this.clearRefreshTimer(),void 0!==t&&(this.refreshTimer=setInterval((()=>{var t;this.deselectWidget(),null===(t=this.dashboardPreview)||void 0===t||t.refreshWidgets()}),t))}clearRefreshTimer(){this.refreshTimer&&(clearInterval(this.refreshTimer),this.refreshTimer=void 0)}loadAllDashboards(t){var e;return function(t,e,i,n){return new(i||(i=Promise))((function(r,a){function o(t){try{l(n.next(t))}catch(t){a(t)}}function s(t){try{l(n.throw(t))}catch(t){a(t)}}function l(t){var e;t.done?r(t.value):(e=t.value,e instanceof i?e:new i((function(t){t(e)}))).then(o,s)}l((n=n.apply(t,e||[])).next())}))}(this,void 0,void 0,(function*(){yield Wn().rest.api.DashboardResource.getAllRealmDashboards(t).then((t=>{this.dashboards=t.data})).catch((t=>{Ma(void 0,"errorOccurred"),console.error(t)})),void 0!==this.selectedId&&(this.selectedDashboard=null===(e=this.dashboards)||void 0===e?void 0:e.find((t=>t.id==this.selectedId)))}))}updated(t){super.updated(t),t.has("currentTemplate")&&null!=this.selectedDashboard&&(this.selectedDashboard.template=this.currentTemplate)}onWidgetCreation(t){const e=JSON.parse(JSON.stringify(this.currentTemplate));e.widgets||(e.widgets=[]),e.widgets.push(t),this.currentTemplate=e}deleteWidget(t){var e;if(null!=this.currentTemplate&&null!=this.currentTemplate.widgets){const i=this.currentTemplate;i.widgets=null===(e=i.widgets)||void 0===e?void 0:e.filter((e=>e.id!=t.id)),this.currentTemplate=i}this.selectedWidgetId===t.id&&this.deselectWidget()}selectWidget(t){var e,i;const n=null===(i=null===(e=this.currentTemplate)||void 0===e?void 0:e.widgets)||void 0===i?void 0:i.find((e=>{var i,n;return(null===(i=e.gridItem)||void 0===i?void 0:i.id)==(null===(n=t.gridItem)||void 0===n?void 0:n.id)}));null!=n?this.selectedWidgetId=n.id:console.error("The selected widget does not exist!")}deselectWidget(){this.selectedWidgetId=void 0}selectDashboard(t){var e;if(null!=this.dashboards){if(this.selectedDashboard&&this.initialDashboardJSON){const t=this.dashboards.indexOf(this.selectedDashboard);t&&JSON.stringify(this.selectedDashboard)!==this.initialDashboardJSON&&(this.dashboards[t]=JSON.parse(this.initialDashboardJSON))}this.selectedDashboard=t?this.dashboards.find((e=>e.id==t.id)):void 0,this.initialDashboardJSON=JSON.stringify(this.selectedDashboard),this.initialTemplateJSON=JSON.stringify(null===(e=this.selectedDashboard)||void 0===e?void 0:e.template)}}changeDashboardName(t){null!=this.selectedDashboard&&(this.selectedDashboard.displayName=t,this.requestUpdate("selectedDashboard"))}openDashboardInInsights(){var t;if(null!=this.selectedDashboard){const e=window.location.origin+"/insights/?realm="+Wn().displayRealm+"#/view/"+this.selectedDashboard.id+"/true/";null===(t=window.open(e))||void 0===t||t.focus()}}shareUrl(t){var e;let i=window.location.href.replace("true","false");"copy"==t?navigator.clipboard.writeText(i):"tab"==t&&(null===(e=window.open(i,"_blank"))||void 0===e||e.focus())}saveDashboard(){null!=this.selectedDashboard&&!this._isReadonly()&&this._hasEditAccess()?(this.isLoading=!0,Wn().rest.api.DashboardResource.update(this.selectedDashboard).then((()=>{var t;null!=this.dashboards&&null!=this.selectedDashboard&&(this.initialDashboardJSON=JSON.stringify(this.selectedDashboard),this.initialTemplateJSON=JSON.stringify(this.selectedDashboard.template),this.dashboards[null===(t=this.dashboards)||void 0===t?void 0:t.indexOf(this.selectedDashboard)]=this.selectedDashboard,this.currentTemplate=Object.assign({},this.selectedDashboard.template),Ma(void 0,"dashboard.saveSuccessful"))})).catch((t=>{console.error(t),Ma(void 0,"errorOccurred")})).finally((()=>{this.isLoading=!1}))):(console.error("The selected dashboard could not be found.."),Ma(void 0,"errorOccurred"))}_isReadonly(){return this.readonly}_hasEditAccess(){return Wn().hasRole("write:insights")}_hasViewAccess(){var t,e;return Wn().hasRole("read:insights")&&null!=this.userId&&("PRIVATE"!=(null===(t=this.selectedDashboard)||void 0===t?void 0:t.access)||(null===(e=this.selectedDashboard)||void 0===e?void 0:e.ownerId)==this.userId)}render(){var t,e,i,n;window.matchMedia("(max-width: 600px)").matches&&this.editMode&&(this.dispatchEvent(new CustomEvent("editToggle",{detail:!1})),this.showDashboardTree=!0);const r={display:!this.editMode||!this._isReadonly()&&this._hasEditAccess()?void 0:"none",maxHeight:this.editMode?"calc(100vh - 77px - 50px)":"inherit"};return!this.isInitializing||null!=this.dashboards&&0==this.dashboards.length?F`
             <div id="container">
                 ${this.showDashboardTree?F`
                     <or-dashboard-tree id="tree" class="${this.selectedDashboard?"hideMobile":void 0}"
@@ -2730,8 +2707,8 @@
                                 <div id="header-title">
                                     <or-icon icon="view-dashboard"></or-icon>
                                     ${null!=this.selectedDashboard?F`
-                                        <or-mwc-input .type="${Tr.TEXT}" min="1" max="1023" comfortable required outlined .label="${qn.i18next.t("name")+"* "}" 
-                                                      ?readonly="${this._isReadonly()}" .value="${this.selectedDashboard.displayName}" 
+                                        <or-mwc-input .type="${Tr.TEXT}" min="1" max="1023" comfortable required outlined .label="${qn.i18next.t("name")}" 
+                                                      ?readonly="${this._isReadonly()||!this._hasEditAccess()}" .value="${this.selectedDashboard.displayName}" 
                                                       .disabled="${this.isLoading}" style="width: 300px;" 
                                                       @or-mwc-input-changed="${t=>{this.changeDashboardName(t.detail.value)}}"
                                         ></or-mwc-input>
@@ -2801,7 +2778,7 @@
                                     <or-dashboard-preview class="editor" style="background: transparent;"
                                                           .realm="${this.realm}" .template="${this.currentTemplate}"
                                                           .selectedWidget="${null===(n=null===(i=null===(e=this.selectedDashboard)||void 0===e?void 0:e.template)||void 0===i?void 0:i.widgets)||void 0===n?void 0:n.find((t=>t.id==this.selectedWidgetId))}" .editMode="${this.editMode}"
-                                                          .fullscreen="${this.fullscreen}" .readonly="${this._isReadonly()}"
+                                                          .fullscreen="${this.fullscreen}" .readonly="${this._isReadonly()||!this._hasEditAccess()}"
                                                           @selected="${t=>{this.selectWidget(t.detail)}}"
                                                           @deselected="${()=>{this.deselectWidget()}}"
                                                           @created="${t=>{this.onWidgetCreation(t.detail)}}"
@@ -2813,22 +2790,22 @@
                                     </div>
                                 `}
                             </div>
-                            ${zt(null!=this.selectedDashboard&&this.editMode&&!this._isReadonly()&&this._hasEditAccess(),(()=>{var t,e,i,n;const r=null===(i=null===(e=null===(t=this.selectedDashboard)||void 0===t?void 0:t.template)||void 0===e?void 0:e.widgets)||void 0===i?void 0:i.find((t=>t.id==this.selectedWidgetId));return F`
+                            ${zt(null!=this.selectedDashboard&&this.editMode&&!this._isReadonly()&&this._hasEditAccess(),(()=>{var t,e,i;const n=null===(i=null===(e=null===(t=this.selectedDashboard)||void 0===t?void 0:t.template)||void 0===e?void 0:e.widgets)||void 0===i?void 0:i.find((t=>t.id==this.selectedWidgetId));return F`
                                     <div id="sidebar" class="hideMobile">
                                         ${null!=this.selectedWidgetId?F`
                                             <div class="settings-container">
                                                 <div id="menu-header">
                                                     <div id="title-container">
-                                                        <span id="title" title="${null==r?void 0:r.displayName}">${null==r?void 0:r.displayName}</span>
+                                                        <span id="title" title="${null==n?void 0:n.displayName}">${null==n?void 0:n.displayName}</span>
                                                     </div>
                                                     <div id="sidebar-widget-headeractions">
-                                                        <or-mwc-input type="${Tr.BUTTON}" icon="delete" @or-mwc-input-changed="${()=>{Kr(qn.i18next.t("areYouSure"),qn.i18next.t("dashboard.deleteWidgetWarning"),qn.i18next.t("delete")).then((t=>{t&&this.deleteWidget(r)}))}}"></or-mwc-input>
+                                                        <or-mwc-input type="${Tr.BUTTON}" icon="delete" @or-mwc-input-changed="${()=>{Kr(qn.i18next.t("areYouSure"),qn.i18next.t("dashboard.deleteWidgetWarning"),qn.i18next.t("delete")).then((t=>{t&&this.deleteWidget(n)}))}}"></or-mwc-input>
                                                         <or-mwc-input type="${Tr.BUTTON}" icon="close" @or-mwc-input-changed="${()=>{this.deselectWidget()}}"></or-mwc-input>
                                                     </div>
                                                 </div>
                                                 <div id="content" class="hidescroll" style="flex: 1; overflow: hidden auto;">
                                                     <div style="position: relative;">
-                                                        <or-dashboard-widgetsettings style="position: absolute;" .selectedWidget="${r}" .realm="${this.realm}"
+                                                        <or-dashboard-widgetsettings style="position: absolute;" .selectedWidget="${n}" .realm="${this.realm}"
                                                                                      @delete="${t=>{this.deleteWidget(t.detail)}}"
                                                                                      @update="${t=>{var e,i;this.currentTemplate=Object.assign({},null===(e=this.selectedDashboard)||void 0===e?void 0:e.template),t.detail.force&&(this.deselectWidget(),null===(i=this.dashboardPreview)||void 0===i||i.refreshPreview())}}"
                                                         ></or-dashboard-widgetsettings>
@@ -2844,7 +2821,7 @@
                                                 <div style="position: relative;">
                                                     <or-dashboard-browser id="browser" style="position: absolute; ${0!=this.sidebarMenuIndex?ht`display: none`:null}"></or-dashboard-browser>
                                                     <or-dashboard-boardsettings style="position: absolute; ${1!=this.sidebarMenuIndex?ht`display: none`:null}" 
-                                                                                .dashboard="${this.selectedDashboard}" .showPerms="${(null===(n=this.selectedDashboard)||void 0===n?void 0:n.ownerId)==this.userId}" 
+                                                                                .dashboard="${this.selectedDashboard}" showPerms 
                                                                                 @update="${t=>{var e,i;this.currentTemplate=Object.assign({},null===(e=this.selectedDashboard)||void 0===e?void 0:e.template),t.detail.force&&(this.deselectWidget(),null===(i=this.dashboardPreview)||void 0===i||i.refreshPreview())}}"
                                                     ></or-dashboard-boardsettings>
                                                 </div>