iobroker.lovelace/hass_frontend/frontend_latest/75246.9ecba8644ad6555d.js

With this adapter you can build visualization for ioBroker with Home Assistant Lovelace UI

export const __rspack_esm_id=75246;export const __rspack_esm_ids=[75246];export const __webpack_modules__={54706(e,r,a){a.d(r,{E:()=>o});a(74423),a(18111),a(13579);var t=a(62826),i=a(22441);const o=e=>{class r extends e{connectedCallback(){super.connectedCallback(),this._checkSubscribed()}disconnectedCallback(){if(super.disconnectedCallback(),this.__unsubs){for(;this.__unsubs.length;){const e=this.__unsubs.pop();e instanceof Promise?e.then(e=>e()):e()}this.__unsubs=void 0}}updated(e){if(super.updated(e),e.has("hass"))this._checkSubscribed();else if(this.hassSubscribeRequiredHostProps)for(const r of e.keys())if(this.hassSubscribeRequiredHostProps.includes(r))return void this._checkSubscribed()}hassSubscribe(){return[]}_checkSubscribed(){void 0===this.__unsubs&&this.isConnected&&void 0!==this.hass&&!this.hassSubscribeRequiredHostProps?.some(e=>void 0===this[e])&&(this.__unsubs=this.hassSubscribe())}}return(0,t.Cg)([(0,i.MZ)({attribute:!1})],r.prototype,"hass",void 0),r}},76331(e,r,a){a.a(e,async function(e,t){try{a.r(r);var i=a(62826),o=a(5124),s=a(22441),n=a(20058),l=(a(76776),a(67094),a(34127)),c=(a(80933),a(32248),a(38114)),d=a(54706),h=a(784),p=e([l,c,n]);[l,c,n]=p.then?(await p)():p;const u="M8.28,5.45L6.5,4.55L7.76,2H16.23L17.5,4.55L15.72,5.44L15,4H9L8.28,5.45M18.62,8H14.09L13.3,5H10.7L9.91,8H5.38L4.1,10.55L5.89,11.44L6.62,10H17.38L18.1,11.45L19.89,10.56L18.62,8M17.77,22H15.7L15.46,21.1L12,15.9L8.53,21.1L8.3,22H6.23L9.12,11H11.19L10.83,12.35L12,14.1L13.16,12.35L12.81,11H14.88L17.77,22M11.4,15L10.5,13.65L9.32,18.13L11.4,15M14.68,18.12L13.5,13.64L12.6,15L14.68,18.12Z";class b extends((0,d.E)(o.WF)){static async getConfigElement(){return await a.e(79062).then(a.bind(a,54197)),document.createElement("hui-energy-graph-card-editor")}static getStubConfig(e,r,a){return{type:"energy-grid-balance"}}hassSubscribe(){return[(0,c.tb)(this.hass,{key:this._config?.collection_key}).subscribe(e=>{this._data=e})]}getCardSize(){return 1}setConfig(e){e.collection_key&&(0,c.s8)(e.collection_key),this._config=e}shouldUpdate(e){return(0,h.xP)(this,e)||e.size>1||!e.has("hass")}render(){if(!this._config||!this.hass)return o.s6;if(!this._data)return o.qy`${this.hass.localize("ui.panel.lovelace.cards.energy.loading")}`;const{summedData:e}=(0,c.gv)(this._data),r=e.total.from_grid??0,a=e.total.to_grid??0,t=r-a,i=e=>(0,n.ZV)(e,this.hass.locale,Math.abs(e)<.01?{maximumSignificantDigits:2}:{maximumFractionDigits:2}),s=t>=0,l=Math.max(r,a),d=l>0?a/l*100:0,h=l>0?r/l*100:0,p=l>0?Math.abs(t)/l*100:0;return o.qy` <ha-card> <div class="content"> <ha-tile-icon> <ha-svg-icon slot="icon" .path="${u}"></ha-svg-icon> </ha-tile-icon> <ha-tile-info> <span slot="primary"> ${this._config.title||this.hass.localize("ui.panel.lovelace.cards.energy.grid_balance.title")} </span> <span slot="secondary" class="equation"> <span class="imported" id="eq-imported"> ${i(r)} kWh </span> <ha-tooltip for="eq-imported" placement="top"> ${this.hass.localize("ui.panel.lovelace.cards.energy.grid_balance.imported",{value:i(r)})} </ha-tooltip> <span class="operator"> - </span> <span class="exported" id="eq-exported"> ${i(a)} kWh </span> <ha-tooltip for="eq-exported" placement="top"> ${this.hass.localize("ui.panel.lovelace.cards.energy.grid_balance.exported",{value:i(a)})} </ha-tooltip> <span class="operator"> = </span> <span class="net ${s?"consumption":"return"}" id="eq-net"> ${i(t)} kWh </span> <ha-tooltip for="eq-net" placement="top"> ${this.hass.localize("ui.panel.lovelace.cards.energy.grid_balance.net_"+(s?"import":"export"),{value:i(Math.abs(t))})} </ha-tooltip> </span> </ha-tile-info> </div> <div class="bar"> <div class="bar-half bar-left"> <div id="bar-exported" class="bar-fill return" style="width:${d}%"></div> <ha-tooltip for="bar-exported" placement="top"> ${this.hass.localize("ui.panel.lovelace.cards.energy.grid_balance.exported",{value:i(a)})} </ha-tooltip> ${s?o.s6:o.qy`<div id="bar-net-left" class="bar-net return" style="width:${p}%"></div> <ha-tooltip for="bar-net-left" placement="top"> ${this.hass.localize("ui.panel.lovelace.cards.energy.grid_balance.net_export",{value:i(Math.abs(t))})} </ha-tooltip>`} </div> <div class="bar-center"></div> <div class="bar-half bar-right"> <div id="bar-imported" class="bar-fill consumption" style="width:${h}%"></div> <ha-tooltip for="bar-imported" placement="top"> ${this.hass.localize("ui.panel.lovelace.cards.energy.grid_balance.imported",{value:i(r)})} </ha-tooltip> ${s?o.qy`<div id="bar-net-right" class="bar-net consumption" style="width:${p}%"></div> <ha-tooltip for="bar-net-right" placement="top"> ${this.hass.localize("ui.panel.lovelace.cards.energy.grid_balance.net_import",{value:i(Math.abs(t))})} </ha-tooltip>`:o.s6} </div> </div> </ha-card> `}constructor(...e){super(...e),this.hassSubscribeRequiredHostProps=["_config"]}}b.styles=o.AH`ha-card{height:100%;display:flex;flex-direction:column}.content{display:flex;align-items:center;padding:var(--ha-space-3);gap:var(--ha-space-3);flex:1;min-width:0}ha-tile-icon{--tile-icon-color:var(--state-inactive-color)}.equation{display:flex;flex-wrap:wrap}.operator{color:var(--secondary-text-color);white-space:pre}.imported{color:var(--energy-grid-consumption-color)}.exported{color:var(--energy-grid-return-color)}.net.consumption{color:var(--energy-grid-consumption-color)}.net.return{color:var(--energy-grid-return-color)}.bar{position:relative;display:flex;height:42px;margin:0 var(--ha-space-3) var(--ha-space-4);overflow:visible}.bar-half{position:relative;display:flex;flex:1;height:100%;overflow:hidden;border:var(--ha-border-width-sm) solid}.bar-left{flex-direction:row-reverse;border-radius:var(--ha-border-radius-lg) 0 0 var(--ha-border-radius-lg);border-color:var(--ha-color-border-neutral-quiet);border-color:color-mix(in srgb,var(--energy-grid-return-color) 30%,transparent);border-right:none}.bar-right{border-radius:0 var(--ha-border-radius-lg) var(--ha-border-radius-lg) 0;border-color:var(--ha-color-border-neutral-quiet);border-color:color-mix(in srgb,var(--energy-grid-consumption-color) 30%,transparent);border-left:none}.bar-fill{position:absolute;top:0;height:100%;opacity:.3;transition:width var(--ha-animation-duration-fast) ease-in-out}.bar-left .bar-fill{right:0}.bar-right .bar-fill{left:0}.bar-fill.consumption{background-color:var(--energy-grid-consumption-color)}.bar-fill.return{background-color:var(--energy-grid-return-color)}.bar-net{position:absolute;top:0;height:100%;transition:width var(--ha-animation-duration-fast) ease-in-out}.bar-left .bar-net{right:0}.bar-right .bar-net{left:0}.bar-net.consumption{background-color:var(--energy-grid-consumption-color)}.bar-net.return{background-color:var(--energy-grid-return-color)}.bar-center{position:absolute;left:50%;top:-6px;transform:translateX(-50%);width:2px;height:calc(100% + 12px);background:var(--primary-text-color);z-index:1}`,(0,i.Cg)([(0,s.MZ)({attribute:!1})],b.prototype,"hass",void 0),(0,i.Cg)([(0,s.wk)()],b.prototype,"_config",void 0),(0,i.Cg)([(0,s.wk)()],b.prototype,"_data",void 0),b=(0,i.Cg)([(0,s.EM)("hui-energy-grid-balance-card")],b),t()}catch(e){t(e)}})},56434(e,r,a){a.d(r,{e:()=>i});var t=a(81977);function i(e,r,a){return(0,t.P)(e,12*r,a)}}};