var __decorate=this&&this.__decorate||function(e,t,i,s){var r,d=arguments.length,a=d<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,i):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,s);else for(var o=e.length-1;o>=0;o--)(r=e[o])&&(a=(d<3?r(a):d>3?r(t,i,a):r(t,i))||a);return d>3&&a&&Object.defineProperty(t,i,a),a},__awaiter=this&&this.__awaiter||function(e,t,i,s){return new(i||(i=Promise))(function(r,d){function a(e){try{l(s.next(e))}catch(e){d(e)}}function o(e){try{l(s.throw(e))}catch(e){d(e)}}function l(e){var t;e.done?r(e.value):((t=e.value)instanceof i?t:new i(function(e){e(t)})).then(a,o)}l((s=s.apply(e,t||[])).next())})};import{css as e,html as t,LitElement as i,unsafeCSS as s}from"lit";import{customElement as r,property as d,query as a,state as o}from"lit/decorators.js";import{when as l}from"lit/directives/when.js";import{styleMap as n}from"lit/directives/style-map.js";import"./or-dashboard-tree";import"./or-dashboard-browser";import"./or-dashboard-preview";import"./or-dashboard-widgetsettings";import"./or-dashboard-boardsettings";import"./controls/dashboard-refresh-controls";import{InputType as h}from"@openremote/or-mwc-components/or-mwc-input";import"@openremote/or-icon";import{style as c}from"./style";import p,{DefaultColor1 as b,DefaultColor3 as u,DefaultColor5 as g,Util as m}from"@openremote/core";import"@openremote/or-mwc-components/or-mwc-tabs";import{showSnackbar as v}from"@openremote/or-mwc-components/or-mwc-snackbar";import{i18next as f}from"@openremote/or-translate";import{showOkCancelDialog as w}from"@openremote/or-mwc-components/or-mwc-dialog";import{DashboardKeyEmitter as y}from"./or-dashboard-keyhandler";import{ChartWidget as D}from"./widgets/chart-widget";import{GaugeWidget as $}from"./widgets/gauge-widget";import{intervalToMillis as x}from"./controls/dashboard-refresh-controls";import{ImageWidget as T}from"./widgets/image-widget";import{KpiWidget as O}from"./widgets/kpi-widget";import{MapWidget as _}from"./widgets/map-widget";import{AttributeInputWidget as I}from"./widgets/attribute-input-widget";import{TableWidget as N}from"./widgets/table-widget";import{GatewayWidget as W}from"./widgets/gateway-widget";import{BarChartWidget as S}from"./widgets/barchart-widget";let styling=e`
    
    @media only screen and (min-width: 641px){
        #tree {
            min-width: 300px !important;
        }
    }
    @media only screen and (max-width: 641px) {
        #tree {
            flex: 1 !important;
        }
        #builder {
            max-height: inherit !important;
        }
    }
    
    #tree {
        flex: 0;
        align-items: stretch;
        z-index: 1;
        box-shadow: rgb(0 0 0 / 21%) 0px 1px 3px 0px;
    }
    
    /* Header related styling */
    #header {
        background: var(--or-app-color1, ${s(b)});
    }
    #header-wrapper {
        padding: 14px 30px;
        display: flex;
        flex-direction: row;
        align-items: center;
        border-bottom: 1px solid ${s(g)};
    }
    #header-title {
        font-size: 18px;
    }
    #header-title > or-icon {
        margin-right: 10px;
    }
    #header-actions {
        flex: 1 1 auto;
        text-align: right;
    }
    #header-actions-content {
        display: flex;
        flex-direction: row;
        align-items: center;
        float: right;
    }

    /* Header related styling */
    @media screen and (max-width: 700px) {
        #fullscreen-header-wrapper {
            padding: 11px !important;
        }
    }
    #fullscreen-header-wrapper {
        min-height: 36px;
        padding: 20px 30px 15px;
        display: flex;
        flex-direction: row;
        align-items: center;
    }
    #fullscreen-header-title {
        font-size: 18px;
        font-weight: bold;
        color: var(--or-app-color3, ${s(u)});
    }
    #fullscreen-header-title > or-mwc-input {
        margin-right: 4px;
        --or-icon-fill: ${s(u)};
    }
    #fullscreen-header-actions {
        flex: 1 1 auto;
        text-align: right;
    }
    #fullscreen-header-actions-content {
        display: flex;
        flex-direction: row;
        align-items: center;
        float: right;
    }
    
    /* ----------------------------- */
    /* Editor/builder related styling */
    #builder {
        flex: 1 0 auto;
        height: 100%;
    }
    
    /* ----------------------------- */
    /* Sidebar related styling (drag and drop widgets / configuration) */
    #sidebar {
        vertical-align: top;
        position: relative;
        width: 300px;
        background: white;
        border-left: 1px solid ${s(g)};
    }
    #sidebar-widget-headeractions {
        flex: 0;
        display: flex;
        flex-direction: row;
        padding-right: 5px;
    }
    .settings-container {
        display: flex;
        flex-direction: column;
        height: 100%;
    }
    #browser {
        flex-grow: 1;
        align-items: stretch;
        z-index: 1;
        max-width: 300px;
    }
    
    #save-btn { margin-left: 15px; }
    #view-btn { margin-left: 18px; }
    
    .small-btn {
        height: 36px;
        margin-top: -12px;
    }
    
    .hidescroll {
        -ms-overflow-style: none; /* for Internet Explorer, Edge */
        scrollbar-width: none; /* for Firefox */
    }
    .hidescroll::-webkit-scrollbar {
        display: none; /* for Chrome, Safari, and Opera */
    }
`;export const MAX_BREAKPOINT=1e6;export function scalingPresetToString(e){return null!=e?f.t("dashboard.presets."+e.toLowerCase()):"undefined"}export function dashboardAccessToString(e){return f.t("dashboard.access."+e.toLowerCase())}export function sortScreenPresets(e,t=!1){return e.sort((e,i)=>null!=e.breakpoint&&null!=i.breakpoint&&(e.breakpoint>i.breakpoint||e.breakpoint<i.breakpoint)?t?1:-1:0)}export function getActivePreset(e,t){let i;return sortScreenPresets(t,!0).forEach(t=>{null!=t.breakpoint&&e<=t.breakpoint&&(i=t)}),i}export const widgetTypes=new Map;export function registerWidgetTypes(){widgetTypes.set("linechart",D.getManifest()),widgetTypes.set("gauge",$.getManifest()),widgetTypes.set("image",T.getManifest()),widgetTypes.set("kpi",O.getManifest()),widgetTypes.set("map",_.getManifest()),widgetTypes.set("attributeinput",I.getManifest()),widgetTypes.set("table",N.getManifest()),widgetTypes.set("gateway",W.getManifest()),widgetTypes.set("barchart",S.getManifest())}let OrDashboardBuilder=class extends i{static get styles(){return[styling,c]}constructor(){super(),this.editMode=!1,this.fullscreen=!0,this.realm=p.displayRealm,this.readonly=!0,this.refreshInterval="OFF",this.keyEmitter=new y,this.sidebarMenuIndex=0,this.showDashboardTree=!0,this.menuItems=[{icon:"content-copy",text:f.t("copy")+" URL",value:"copy"},{icon:"open-in-new",text:f.t("dashboard.openInNewTab"),value:"tab"}],this.tabItems=[{name:f.t("dashboard.widgets")},{name:f.t("settings")}],this.isInitializing=!0,this.isLoading=!0,this.hasChanged=!1,registerWidgetTypes(),this.updateComplete.then(()=>{this.loadAllDashboards(this.realm)})}connectedCallback(){super.connectedCallback(),this.keyEmitter.addListener("delete",e=>{var t,i,s;if(this.selectedWidgetId){let e=null==(s=null==(i=null==(t=this.selectedDashboard)?void 0:t.template)?void 0:i.widgets)?void 0:s.find(e=>e.id==this.selectedWidgetId);e&&w(f.t("areYouSure"),f.t("dashboard.deleteWidgetWarning"),f.t("delete")).then(t=>{t&&this.deleteWidget(e)})}}),this.keyEmitter.addListener("deselect",e=>{this.deselectWidget()}),this.keyEmitter.addListener("save",e=>{this.saveDashboard()})}disconnectedCallback(){super.disconnectedCallback(),this.keyEmitter.removeAllListeners()}willUpdate(e){var t,i,s;if(super.willUpdate(e),this.isLoading=void 0==this.dashboards,this.isInitializing=void 0==this.dashboards,!(1===e.size&&e.has("selectedWidget"))){let e=this.initialDashboardJSON?JSON.parse(this.initialDashboardJSON):void 0,t=m.difference(this.selectedDashboard,e);if(Object.keys(t).length>0)this.hasChanged=!0,console.debug("Dashboard has detected changes! Diff:",t);else{let e=this.initialTemplateJSON?JSON.parse(this.initialTemplateJSON):void 0,t=m.difference(this.currentTemplate,e);Object.keys(t).length>0?(this.hasChanged=!0,console.debug("Template has detected changes! Diff:",t)):this.hasChanged=!1}}e.has("realm")&&void 0!==e.get("realm")&&this.realm&&this.loadAllDashboards(this.realm),e.has("selectedDashboard")&&(this.deselectWidget(),this.currentTemplate=null==(t=this.selectedDashboard)?void 0:t.template,this.editMode||(this.refreshInterval=(null==(i=this.currentTemplate)?void 0:i.refreshInterval)||"OFF",e.set("refreshInterval",this.refreshInterval)),this.dispatchEvent(new CustomEvent("selected",{detail:this.selectedDashboard}))),e.has("editMode")&&(this.deselectWidget(),this.refreshInterval="OFF",this.showDashboardTree=!0,this.editMode?this.refreshInterval="OFF":this.refreshInterval=(null==(s=this.currentTemplate)?void 0:s.refreshInterval)||"OFF",e.set("refreshInterval",this.refreshInterval)),e.has("refreshInterval")&&this.refreshInterval&&this.setRefreshTimer(x(this.refreshInterval))}setRefreshTimer(e){this.clearRefreshTimer(),void 0!==e&&(this.refreshTimer=setInterval(()=>{var e;this.deselectWidget(),null==(e=this.dashboardPreview)||e.refreshWidgets()},e))}clearRefreshTimer(){this.refreshTimer&&(clearInterval(this.refreshTimer),this.refreshTimer=void 0)}loadAllDashboards(e){return __awaiter(this,void 0,void 0,function*(){var t;yield p.rest.api.DashboardResource.getAllRealmDashboards(e).then(e=>{this.dashboards=e.data}).catch(e=>{v(void 0,"errorOccurred"),console.error(e)}),void 0!==this.selectedId&&(this.selectedDashboard=null==(t=this.dashboards)?void 0:t.find(e=>e.id==this.selectedId))})}updated(e){super.updated(e),e.has("currentTemplate")&&null!=this.selectedDashboard&&(this.selectedDashboard.template=this.currentTemplate)}onWidgetCreation(e){let t=JSON.parse(JSON.stringify(this.currentTemplate));t.widgets||(t.widgets=[]),t.widgets.push(e),this.currentTemplate=t}deleteWidget(e){var t;if(null!=this.currentTemplate&&null!=this.currentTemplate.widgets){let i=this.currentTemplate;i.widgets=null==(t=i.widgets)?void 0:t.filter(t=>t.id!=e.id),this.currentTemplate=i}this.selectedWidgetId===e.id&&this.deselectWidget()}selectWidget(e){var t,i;let s=null==(i=null==(t=this.currentTemplate)?void 0:t.widgets)?void 0:i.find(t=>{var i,s;return(null==(i=t.gridItem)?void 0:i.id)==(null==(s=e.gridItem)?void 0:s.id)});null!=s?this.selectedWidgetId=s.id:console.error("The selected widget does not exist!")}deselectWidget(){this.selectedWidgetId=void 0}selectDashboard(e){var t;if(null!=this.dashboards){if(this.selectedDashboard&&this.initialDashboardJSON){let e=this.dashboards.indexOf(this.selectedDashboard);e&&JSON.stringify(this.selectedDashboard)!==this.initialDashboardJSON&&(this.dashboards[e]=JSON.parse(this.initialDashboardJSON))}this.selectedDashboard=e?this.dashboards.find(t=>t.id==e.id):void 0,this.initialDashboardJSON=JSON.stringify(this.selectedDashboard),this.initialTemplateJSON=JSON.stringify(null==(t=this.selectedDashboard)?void 0:t.template)}}changeDashboardName(e){null!=this.selectedDashboard&&(this.selectedDashboard.displayName=e,this.requestUpdate("selectedDashboard"))}openDashboardInInsights(){var e;if(null!=this.selectedDashboard){let t=window.location.origin+"/insights/?realm="+p.displayRealm+"#/view/"+this.selectedDashboard.id+"/true/";null==(e=window.open(t))||e.focus()}}shareUrl(e){var t;let i=window.location.href.replace("true","false");"copy"==e?navigator.clipboard.writeText(i):"tab"==e&&(null==(t=window.open(i,"_blank"))||t.focus())}saveDashboard(){null!=this.selectedDashboard&&!this._isReadonly()&&this._hasEditAccess()?(this.isLoading=!0,p.rest.api.DashboardResource.update(this.selectedDashboard).then(e=>{var t,i;this.selectedDashboard=e.data,this.dashboards=[this.selectedDashboard,...null==(t=this.dashboards)?void 0:t.filter(e=>e.id!==this.selectedDashboard.id)],this.initialDashboardJSON=JSON.stringify(this.selectedDashboard),this.initialTemplateJSON=JSON.stringify(this.selectedDashboard.template),this.dashboards[null==(i=this.dashboards)?void 0:i.indexOf(this.selectedDashboard)]=this.selectedDashboard,this.currentTemplate=Object.assign({},this.selectedDashboard.template),v(void 0,"dashboard.saveSuccessful")}).catch(e=>{console.error(e),v(void 0,"errorOccurred")}).finally(()=>{this.isLoading=!1})):(console.error("The selected dashboard could not be found.."),v(void 0,"errorOccurred"))}_isReadonly(){return this.readonly}_hasEditAccess(){return p.hasRole("write:insights")}_hasViewAccess(){var e,t;return p.hasRole("read:insights")&&null!=this.userId&&((null==(e=this.selectedDashboard)?void 0:e.access)!="PRIVATE"||(null==(t=this.selectedDashboard)?void 0:t.ownerId)==this.userId)}render(){var i,r,d,a;window.matchMedia("(max-width: 600px)").matches&&this.editMode&&(this.dispatchEvent(new CustomEvent("editToggle",{detail:!1})),this.showDashboardTree=!0);let o={display:this.editMode&&(this._isReadonly()||!this._hasEditAccess())?"none":void 0,maxHeight:this.editMode?"calc(100vh - 77px - 50px)":"inherit"};return this.isInitializing&&(null==this.dashboards||0!=this.dashboards.length)?t`
            <div id="container" style="justify-content: center; align-items: center;">
                ${this.isInitializing?t`
                    <span>${f.t("loading")}.</span>
                `:t`
                    <span>${f.t("errorOccurred")}.</span>
                `}
            </div>
        `:t`
            <div id="container">
                ${this.showDashboardTree?t`
                    <or-dashboard-tree id="tree" class="${this.selectedDashboard?"hideMobile":void 0}"
                                       .realm="${this.realm}" .hasChanged="${this.hasChanged}" .selected="${this.selectedDashboard}" .dashboards="${this.dashboards}" .showControls="${!0}" .userId="${this.userId}" .readonly="${this._isReadonly()}"
                                       @created="${e=>{this.dispatchEvent(new CustomEvent("editToggle",{detail:!0}))}}"
                                       @updated="${e=>{this.dashboards=e.detail,this.selectedDashboard=void 0}}"
                                       @select="${e=>{this.selectDashboard(e.detail)}}"
                    ></or-dashboard-tree>
                `:void 0}
                <div class="${null==this.selectedDashboard?"hideMobile":void 0}" style="flex: 1; display: flex; flex-direction: column;">
                    ${this.editMode?t`
                        <div id="header" class="hideMobile">
                            <div id="header-wrapper">
                                <div id="header-title">
                                    <or-icon icon="view-dashboard"></or-icon>
                                    ${null!=this.selectedDashboard?t`
                                        <or-mwc-input .type="${h.TEXT}" min="1" max="1023" comfortable required outlined .label="${f.t("name")}" 
                                                      ?readonly="${this._isReadonly()||!this._hasEditAccess()}" .value="${this.selectedDashboard.displayName}" 
                                                      .disabled="${this.isLoading}" style="width: 300px;" 
                                                      @or-mwc-input-changed="${e=>{this.changeDashboardName(e.detail.value)}}"
                                        ></or-mwc-input>
                                    `:void 0}
                                </div>
                                <div id="header-actions">
                                    <div id="header-actions-content">
                                        ${l(this.selectedDashboard,()=>t`
                                            <or-mwc-input id="refresh-btn" class="small-btn" .disabled="${this.isLoading}" type="${h.BUTTON}" icon="refresh" title="${f.t("dashboard.refresh")}"
                                                          @or-mwc-input-changed="${()=>{var e;this.deselectWidget(),null==(e=this.dashboardPreview)||e.refreshPreview()}}">
                                            </or-mwc-input>
                                            <or-mwc-input id="responsive-btn" class="small-btn" .disabled="${this.isLoading}" type="${h.BUTTON}" icon="responsive" title="${f.t("dashboard.previewScreenSizes")}"
                                                          @or-mwc-input-changed="${()=>{this.dispatchEvent(new CustomEvent("fullscreenToggle",{detail:!this.fullscreen}))}}">
                                            </or-mwc-input>
                                            <or-mwc-input id="share-btn" class="small-btn" .disabled="${this.isLoading}" type="${h.BUTTON}" icon="open-in-new" title="${f.t("dashboard.openInNewTab")}"
                                                          @or-mwc-input-changed="${()=>{this.openDashboardInInsights()}}">
                                            </or-mwc-input>
                                            <or-mwc-input id="save-btn" ?hidden="${this._isReadonly()||!this._hasEditAccess()}" .disabled="${this.isLoading||!this.hasChanged}" type="${h.BUTTON}" raised label="save"
                                                          @or-mwc-input-changed="${()=>{this.saveDashboard()}}">
                                            </or-mwc-input>
                                            <or-mwc-input id="view-btn" ?hidden="${this._isReadonly()||!this._hasViewAccess()}" type="${h.BUTTON}" outlined icon="eye" label="viewAsset"
                                                          @or-mwc-input-changed="${()=>{this.dispatchEvent(new CustomEvent("editToggle",{detail:!1}))}}">
                                            </or-mwc-input>
                                        `)}
                                    </div>
                                </div>
                            </div>
                        </div>
                    `:t`
                        <div id="fullscreen-header">
                            <div id="fullscreen-header-wrapper">
                                <div id="fullscreen-header-title" style="display: flex; align-items: center;">
                                    <or-icon class="showMobile" style="margin-right: 10px; cursor: pointer;" icon="chevron-left" @click="${()=>{this.selectedDashboard=void 0}}"></or-icon>
                                    <or-icon class="hideMobile" style="margin-right: 10px; cursor: pointer;" icon="menu" title="${f.t(this.showDashboardTree?"closeList":"openList")}" @click="${()=>{this.showDashboardTree=!this.showDashboardTree}}"></or-icon>
                                    <span>${null==(i=this.selectedDashboard)?void 0:i.displayName}</span>
                                </div>
                                <div id="fullscreen-header-actions">
                                    <div id="fullscreen-header-actions-content">
                                        ${l(this.selectedDashboard,()=>t`
                                            <or-mwc-input id="refresh-btn" class="small-btn" .disabled="${null==this.selectedDashboard}" type="${h.BUTTON}" icon="refresh" title="${f.t("dashboard.refresh")}"
                                                      @or-mwc-input-changed="${()=>{var e;this.deselectWidget(),null==(e=this.dashboardPreview)||e.refreshPreview()}}"
                                            ></or-mwc-input>
                                            <dashboard-refresh-controls .interval="${this.refreshInterval}" .readonly="${!1}"
                                                                        @interval-select="${e=>this.onIntervalSelect(e)}"
                                            ></dashboard-refresh-controls>
                                            <or-mwc-input id="share-btn" class="small-btn" .disabled="${null==this.selectedDashboard}" type="${h.BUTTON}" icon="open-in-new" title="${f.t("dashboard.openInNewTab")}"
                                                          @or-mwc-input-changed="${()=>{this.openDashboardInInsights()}}"
                                            ></or-mwc-input>
                                            <or-mwc-input id="view-btn" class="hideMobile" ?hidden="${null==this.selectedDashboard||this._isReadonly()||!this._hasEditAccess()}" type="${h.BUTTON}" outlined icon="pencil" label="editAsset"
                                                          @or-mwc-input-changed="${()=>{this.dispatchEvent(new CustomEvent("editToggle",{detail:!0}))}}">
                                            </or-mwc-input>
                                        `)}
                                    </div>
                                </div>
                            </div>
                        </div>
                    `}
                    <div id="content" style="flex: 1;">
                        <div id="container">
                            ${this.editMode&&(this._isReadonly()||!this._hasEditAccess())?t`
                                <div style="display: flex; justify-content: center; align-items: center; height: 100%;">
                                    <span>${!this._hasEditAccess()?f.t("noDashboardWriteAccess"):f.t("errorOccurred")}.</span>
                                </div>
                            `:void 0}
                            <div id="builder" style="${n(o)}">
                                ${null!=this.selectedDashboard?t`
                                    <or-dashboard-preview class="editor" style="background: transparent;"
                                                          .realm="${this.realm}" .template="${this.currentTemplate}"
                                                          .selectedWidget="${null==(a=null==(d=null==(r=this.selectedDashboard)?void 0:r.template)?void 0:d.widgets)?void 0:a.find(e=>e.id==this.selectedWidgetId)}" .editMode="${this.editMode}"
                                                          .fullscreen="${this.fullscreen}" .readonly="${this._isReadonly()||!this._hasEditAccess()}"
                                                          @selected="${e=>{this.selectWidget(e.detail)}}"
                                                          @deselected="${()=>{this.deselectWidget()}}"
                                                          @created="${e=>{this.onWidgetCreation(e.detail)}}"
                                                          @changed="${e=>{this.currentTemplate=e.detail.template}}"
                                    ></or-dashboard-preview>
                                `:t`
                                    <div style="display: flex; justify-content: center; align-items: center; height: 100%;">
                                        <span>${f.t("noDashboardSelected")}</span>
                                    </div>
                                `}
                            </div>
                            ${l(null!=this.selectedDashboard&&this.editMode&&!this._isReadonly()&&this._hasEditAccess(),()=>{var i,r,d;let a=null==(d=null==(r=null==(i=this.selectedDashboard)?void 0:i.template)?void 0:r.widgets)?void 0:d.find(e=>e.id==this.selectedWidgetId);return t`
                                    <div id="sidebar" class="hideMobile">
                                        ${null!=this.selectedWidgetId?t`
                                            <div class="settings-container">
                                                <div id="menu-header">
                                                    <div id="title-container">
                                                        <span id="title" title="${null==a?void 0:a.displayName}">${null==a?void 0:a.displayName}</span>
                                                    </div>
                                                    <div id="sidebar-widget-headeractions">
                                                        <or-mwc-input type="${h.BUTTON}" icon="delete" @or-mwc-input-changed="${()=>{w(f.t("areYouSure"),f.t("dashboard.deleteWidgetWarning"),f.t("delete")).then(e=>{e&&this.deleteWidget(a)})}}"></or-mwc-input>
                                                        <or-mwc-input type="${h.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="${a}" .realm="${this.realm}"
                                                                                     @delete="${e=>{this.deleteWidget(e.detail)}}"
                                                                                     @update="${e=>{var t,i;this.currentTemplate=Object.assign({},null==(t=this.selectedDashboard)?void 0:t.template),e.detail.force&&(this.deselectWidget(),null==(i=this.dashboardPreview)||i.refreshPreview())}}"
                                                        ></or-dashboard-widgetsettings>
                                                    </div>
                                                </div>
                                            </div>
                                        `:void 0}
                                        <div class="settings-container" style="${null!=this.selectedWidgetId?e`display: none`:null}">
                                            <div style="border-bottom: 1px solid ${s(g)};">
                                                <or-mwc-tabs .items="${this.tabItems}" noScroll @activated="${e=>{this.sidebarMenuIndex=e.detail.index}}" style="pointer-events: ${this.selectedDashboard?void 0:"none"}"></or-mwc-tabs>
                                            </div>
                                            <div id="content" style="flex: 1; overflow: auto;">
                                                <div style="position: relative;">
                                                    <or-dashboard-browser id="browser" style="position: absolute; ${0!=this.sidebarMenuIndex?e`display: none`:null}"></or-dashboard-browser>
                                                    <or-dashboard-boardsettings style="position: absolute; ${1!=this.sidebarMenuIndex?e`display: none`:null}" 
                                                                                .dashboard="${this.selectedDashboard}" showPerms 
                                                                                @update="${e=>{var t,i;this.currentTemplate=Object.assign({},null==(t=this.selectedDashboard)?void 0:t.template),e.detail.force&&(this.deselectWidget(),null==(i=this.dashboardPreview)||i.refreshPreview())}}"
                                                    ></or-dashboard-boardsettings>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                `})}
                        </div>
                    </div>
                </div>
            </div>
        `}onIntervalSelect(e){this.refreshInterval=e.detail}};__decorate([d()],OrDashboardBuilder.prototype,"config",void 0),__decorate([d()],OrDashboardBuilder.prototype,"editMode",void 0),__decorate([d()],OrDashboardBuilder.prototype,"fullscreen",void 0),__decorate([d()],OrDashboardBuilder.prototype,"selectedId",void 0),__decorate([d()],OrDashboardBuilder.prototype,"realm",void 0),__decorate([d()],OrDashboardBuilder.prototype,"userId",void 0),__decorate([d()],OrDashboardBuilder.prototype,"readonly",void 0),__decorate([o()],OrDashboardBuilder.prototype,"dashboards",void 0),__decorate([o()],OrDashboardBuilder.prototype,"currentTemplate",void 0),__decorate([o()],OrDashboardBuilder.prototype,"selectedDashboard",void 0),__decorate([o()],OrDashboardBuilder.prototype,"selectedWidgetId",void 0),__decorate([o()],OrDashboardBuilder.prototype,"initialDashboardJSON",void 0),__decorate([o()],OrDashboardBuilder.prototype,"initialTemplateJSON",void 0),__decorate([o()],OrDashboardBuilder.prototype,"refreshInterval",void 0),__decorate([o()],OrDashboardBuilder.prototype,"isInitializing",void 0),__decorate([o()],OrDashboardBuilder.prototype,"isLoading",void 0),__decorate([o()],OrDashboardBuilder.prototype,"hasChanged",void 0),__decorate([a("or-dashboard-preview")],OrDashboardBuilder.prototype,"dashboardPreview",void 0),__decorate([o()],OrDashboardBuilder.prototype,"sidebarMenuIndex",void 0),__decorate([o()],OrDashboardBuilder.prototype,"showDashboardTree",void 0),OrDashboardBuilder=__decorate([r("or-dashboard-builder")],OrDashboardBuilder);export{OrDashboardBuilder};