var __decorate=this&&this.__decorate||function(e,t,i,r){var o,d=arguments.length,s=d<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,i):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,i,r);else for(var a=e.length-1;a>=0;a--)(o=e[a])&&(s=(d<3?o(s):d>3?o(t,i,s):o(t,i))||s);return d>3&&s&&Object.defineProperty(t,i,s),s};import{html as e,LitElement as t}from"lit";import{customElement as i,property as r,query as o,state as d}from"lit/decorators.js";import{when as s}from"lit/directives/when.js";import{throttle as a}from"lodash";import{style as n}from"./style";import{WidgetService as l}from"./service/widget-service";import{Util as g}from"@openremote/core";let elemTagName="or-dashboard-widget-container",OrDashboardWidgetContainer=class extends t{constructor(){super(...arguments),this.loading=!1}static get styles(){return[n]}disconnectedCallback(){var e;super.disconnectedCallback(),null==(e=this.resizeObserver)||e.disconnect()}shouldUpdate(e){var t,i;if(this.widget){let e=l.getManifest(this.widget.widgetTypeId);e&&(this.editMode?this.widget.widgetConfig=l.correctToConfigSpec(e,this.widget.widgetConfig):this.widgetConfig=l.correctToConfigSpec(e,this.widget.widgetConfig))}if(e.has("widget")&&this.widget){let r=e.get("widget"),o=(null==r?void 0:r.id)!==(null==(t=this.widget)?void 0:t.id),d=(null==r?void 0:r.displayName)!==(null==(i=this.widget)?void 0:i.displayName),s=!g.objectsEqual(null==r?void 0:r.widgetConfig,this.getWidgetConfig());o||d||s||e.delete("widget")}return 0!==e.size&&super.shouldUpdate(e)}willUpdate(e){super.willUpdate(e),!this.manifest&&this.widget&&(this.manifest=l.getManifest(this.widget.widgetTypeId)),e.has("widget")&&this.widget&&this.initializeWidgetElem(this.manifest,this.getWidgetConfig())}firstUpdated(e){var t;if(super.firstUpdated(e),this.orWidget){let e=this.containerElem;e?(null==(t=this.resizeObserver)||t.disconnect(),this.resizeObserver=new ResizeObserver(a(()=>{let t=this.manifest.minPixelWidth||0,i=this.manifest.minPixelHeight||0,r=t<e.clientWidth&&i<e.clientHeight;this.error=r?void 0:"dashboard.widgetTooSmall"},200)),this.resizeObserver.observe(e)):console.error("gridItemElement could not be found!")}}initializeWidgetElem(e,t){console.debug(`Initialising ${e.displayName} widget..`),this.orWidget&&this.orWidget.remove(),this.orWidget=e.getContentHtml(t),this.orWidget.getDisplayName=()=>this.widget.displayName,this.orWidget.getEditMode=()=>this.editMode,this.orWidget.getWidgetLocation=()=>{var e,t,i,r;return{x:null==(e=this.widget.gridItem)?void 0:e.x,y:null==(t=this.widget.gridItem)?void 0:t.y,w:null==(i=this.widget.gridItem)?void 0:i.w,h:null==(r=this.widget.gridItem)?void 0:r.h}}}render(){let t=!!this.widget.displayName;return e`
            <div id="widget-container" style="height: calc(100% - 16px); padding: 8px 16px 8px 16px; display: flex; flex-direction: column;">

                <!-- Container title -->
                ${s(t,()=>{var t;return e`
                    <div style="flex: 0 0 36px; display: flex; justify-content: space-between; align-items: center;">
                        <span class="panel-title" style="width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">
                            ${null==(t=this.widget.displayName)?void 0:t.toUpperCase()}
                        </span>
                    </div>
                `})}

                <!-- Content -->
                <div style="flex: 1; max-height: ${t?"calc(100% - 36px)":"100%"};">
                    ${s(!this.error&&!this.loading,()=>e`
                        ${this.orWidget}
                    `,()=>e`<or-translate value="${this.error?this.error:"loading"}"></or-translate>`)}
                </div>
            </div>
        `}refreshContent(e){var t;null==(t=this.orWidget)||t.refreshContent(e)}getWidgetConfig(){var e;return this.widgetConfig||(null==(e=this.widget)?void 0:e.widgetConfig)}};OrDashboardWidgetContainer.tagName=elemTagName,__decorate([r()],OrDashboardWidgetContainer.prototype,"widget",void 0),__decorate([r()],OrDashboardWidgetContainer.prototype,"widgetConfig",void 0),__decorate([r()],OrDashboardWidgetContainer.prototype,"editMode",void 0),__decorate([r()],OrDashboardWidgetContainer.prototype,"loading",void 0),__decorate([d()],OrDashboardWidgetContainer.prototype,"orWidget",void 0),__decorate([d()],OrDashboardWidgetContainer.prototype,"error",void 0),__decorate([o("#widget-container")],OrDashboardWidgetContainer.prototype,"containerElem",void 0),OrDashboardWidgetContainer=__decorate([i(elemTagName)],OrDashboardWidgetContainer);export{OrDashboardWidgetContainer};