iobroker.lovelace
Version:
With this adapter you can build visualization for ioBroker with Home Assistant Lovelace UI
1 lines • 5.11 kB
JavaScript
"use strict";(self.rspackChunkhome_assistant_frontend=self.rspackChunkhome_assistant_frontend||[]).push([[94332],{55287:function(e,i,t){t.a(e,async function(e,a){try{t.r(i),t.d(i,{SideBarView:function(){return x}});t(18111),t(7588),t(3362),t(62953);var o=t(40445),d=t(5124),n=t(67576),s=t(1087),l=t(18350),r=t(52667),c=t(82360),h=e([l,r]);[l,r]=h.then?(await h)():h;let v,p,u,g=e=>e;const m="M20,11V13H8L13.5,18.5L12.08,19.92L4.16,12L12.08,4.08L13.5,5.5L8,11H20Z",b="M4,11V13H16L10.5,18.5L11.92,19.92L19.84,12L11.92,4.08L10.5,5.5L16,11H4Z",f="M19,13H13V19H11V13H5V11H11V5H13V11H19V13Z";class x extends d.WF{connectedCallback(){super.connectedCallback(),this._mql=window.matchMedia("(min-width: 760px)"),this._mqlListenerRef=this._createCards.bind(this),this._mql.addListener(this._mqlListenerRef)}disconnectedCallback(){var e;super.disconnectedCallback(),null===(e=this._mql)||void 0===e||e.removeListener(this._mqlListenerRef),this._mqlListenerRef=void 0,this._mql=void 0}setConfig(e){this._config=e}willUpdate(e){var i,a,o;if(super.willUpdate(e),null!==(i=this.lovelace)&&void 0!==i&&i.editMode&&t.e(59127).then(t.bind(t,70410)),e.has("cards")&&this._createCards(),!e.has("lovelace")&&!e.has("_config"))return;const d=e.get("lovelace");(!e.has("cards")&&(null==d?void 0:d.config)!==(null===(a=this.lovelace)||void 0===a?void 0:a.config)||d&&(null==d?void 0:d.editMode)!==(null===(o=this.lovelace)||void 0===o?void 0:o.editMode))&&this._createCards()}render(){var e,i;return(0,d.qy)(v||(v=g` <hui-view-badges .hass="${0}" .badges="${0}" .lovelace="${0}" .viewIndex="${0}" show-add-label></hui-view-badges> <div class="container ${0}"></div> ${0} `),this.hass,this.badges,this.lovelace,this.index,null!==(e=this.lovelace)&&void 0!==e&&e.editMode?"edit-mode":"",null!==(i=this.lovelace)&&void 0!==i&&i.editMode?(0,d.qy)(p||(p=g` <ha-button size="large" ="${0}"> <ha-svg-icon slot="start" .path="${0}"></ha-svg-icon> ${0} </ha-button> `),this._addCard,f,this.hass.localize("ui.panel.lovelace.editor.edit_card.add")):"")}_addCard(){(0,s.r)(this,"ll-create-card")}_createCards(){var e;const i=document.createElement("div");let t;if(i.id="main",null!==(e=this._mql)&&void 0!==e&&e.matches?(t=document.createElement("div"),t.id="sidebar"):t=i,this.hasUpdated){const e=this._container;this._oldMain&&e.removeChild(this._oldMain),this._oldSidebar&&e.removeChild(this._oldSidebar),e.appendChild(i),e.appendChild(t)}else this.updateComplete.then(()=>{const e=this._container;e.appendChild(i),e.appendChild(t)});this.cards.forEach((e,a)=>{var o,d,n;const s=null===(o=this._config)||void 0===o||null===(o=o.cards)||void 0===o?void 0:o[a];let l;if(this.isStrategy||null===(d=this.lovelace)||void 0===d||!d.editMode)e.preview=!1,l=e;else{var r;l=document.createElement("hui-card-options"),l.hass=this.hass,l.lovelace=this.lovelace,l.path=[this.index,a],e.preview=!0;const i=document.createElement("ha-icon-button");i.slot="buttons";const t=document.createElement("ha-svg-icon");t.path="sidebar"!==(null==s||null===(r=s.view_layout)||void 0===r?void 0:r.position)?b:m,i.appendChild(t),i.addEventListener("click",()=>{var e;this.lovelace.saveConfig((0,c.bn)(this.lovelace.config,[this.index,a],Object.assign(Object.assign({},s),{},{view_layout:{position:"sidebar"!==(null==s||null===(e=s.view_layout)||void 0===e?void 0:e.position)?"sidebar":"main"}})))}),l.appendChild(i),l.appendChild(e)}"sidebar"!==(null==s||null===(n=s.view_layout)||void 0===n?void 0:n.position)?i.appendChild(l):t.appendChild(l)})}constructor(...e){super(...e),this.isStrategy=!1,this.cards=[],this.badges=[]}}x.styles=(0,d.AH)(u||(u=g`:host{display:block;padding-top:4px}hui-view-badges{display:block;margin:4px 8px 4px 8px;font-size:var(--ha-font-size-s)}.container{display:flex;justify-content:center;margin-left:4px;margin-right:4px}.container.edit-mode{margin-bottom:72px}#main{max-width:1620px;flex-grow:2}#sidebar{flex-grow:1;flex-shrink:0;max-width:380px}.container>div{min-width:0;box-sizing:border-box}.container>div>:not([hidden]){display:block;margin:var(--masonry-view-card-margin,4px 4px 8px)} (max-width:500px){.container>div>*{margin-left:0;margin-right:0}}ha-button{position:fixed;right:calc(16px + var(--safe-area-inset-right));bottom:calc(16px + var(--safe-area-inset-bottom));inset-inline-end:calc(16px + var(--safe-area-inset-right));inset-inline-start:initial;z-index:1;--ha-button-box-shadow:var(--ha-box-shadow-l)}`)),(0,o.Cg)([(0,n.MZ)({attribute:!1})],x.prototype,"hass",void 0),(0,o.Cg)([(0,n.MZ)({attribute:!1})],x.prototype,"lovelace",void 0),(0,o.Cg)([(0,n.MZ)({type:Number})],x.prototype,"index",void 0),(0,o.Cg)([(0,n.MZ)({attribute:!1})],x.prototype,"isStrategy",void 0),(0,o.Cg)([(0,n.MZ)({attribute:!1})],x.prototype,"cards",void 0),(0,o.Cg)([(0,n.MZ)({attribute:!1})],x.prototype,"badges",void 0),(0,o.Cg)([(0,n.wk)()],x.prototype,"_config",void 0),(0,o.Cg)([(0,n.P)("#main")],x.prototype,"_oldMain",void 0),(0,o.Cg)([(0,n.P)("#sidebar")],x.prototype,"_oldSidebar",void 0),(0,o.Cg)([(0,n.P)(".container")],x.prototype,"_container",void 0),x=(0,o.Cg)([(0,n.EM)("hui-sidebar-view")],x),a()}catch(v){a(v)}})}}]);