iobroker.lovelace/hass_frontend/frontend_latest/24404.4448c5d0530de735.js

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

export const __rspack_esm_id=24404;export const __rspack_esm_ids=[24404];export const __webpack_modules__={90433(t,e,s){s.d(e,{Vy:()=>o,fI:()=>n,ux:()=>r});var i=s(22786),a=s(79468);function o(t,e){const s=t%54+1;return e.getPropertyValue(`--color-${s}`)}function n(t,e){const s=e.getPropertyValue(`--graph-color-${t+1}`)||o(t,e);return(0,a.RQ)(s)}const r=(0,i.A)(t=>Array.from({length:54},(e,s)=>n(s,t)),(t,e)=>t[0].getPropertyValue("--graph-color-1")===e[0].getPropertyValue("--graph-color-1")&&t[0].getPropertyValue("--color-1")===e[0].getPropertyValue("--color-1"))},29961(t,e,s){s.a(t,async function(t,i){try{s.d(e,{d:()=>r,n:()=>c});var a=s(72487),o=s(30162),n=t([a,o]);function r(t,e,s){return"month"===t?{formatter:t=>{const i=new Date(t);return 0===i.getMonth()?`{bold|${(0,a.fr)(i,e,s)}}`:(0,a.Wq)(i,e,s)}}:"year"===t?{formatter:t=>(0,a.Pm)(new Date(t),e,s)}:void 0}function c(t,e,s,i){const n=i/60/24,r=new Date(t);if(n>88)return 0===r.getMonth()?`{bold|${(0,a.fr)(r,e,s)}}`:(0,a.Wq)(r,e,s);if(n>35)return 1===r.getDate()?`{bold|${(0,a.sl)(r,e,s)}}`:(0,a.sl)(r,e,s);if(n>7){const t=(0,a.sl)(r,e,s);return 1===r.getDate()?`{bold|${t}}`:t}return n>2?(0,a.gu)(r,e,s):i&&i<5?(0,o.ie)(r,e,s):0===r.getHours()&&0===r.getMinutes()&&0===r.getSeconds()?`{bold|${(0,a.sl)(r,e,s)}}`:(0,o.fU)(r,e,s)}[a,o]=n.then?(await n)():n,i()}catch(h){i(h)}})},33062(t,e,s){var i=s(62826),a=s(5124),o=s(22441);class n extends a.WF{willUpdate(t){t.has("color")&&(this.style.backgroundColor=this.color)}render(){return a.s6}constructor(...t){super(...t),this.color="",this.rtl=!1}}n.styles=a.AH`:host{display:inline-block;margin-inline-end:4px;margin-inline-start:initial;border-radius:10px;width:10px;height:10px;vertical-align:middle}:host([rtl]){direction:rtl}`,(0,i.Cg)([(0,o.MZ)()],n.prototype,"color",void 0),(0,i.Cg)([(0,o.MZ)({type:Boolean,reflect:!0})],n.prototype,"rtl",void 0),n=(0,i.Cg)([(0,o.EM)("ha-chart-tooltip-marker")],n)},54706(t,e,s){s.d(e,{E:()=>o});s(74423),s(18111),s(13579);var i=s(62826),a=s(22441);const o=t=>{class e extends t{connectedCallback(){super.connectedCallback(),this._checkSubscribed()}disconnectedCallback(){if(super.disconnectedCallback(),this.__unsubs){for(;this.__unsubs.length;){const t=this.__unsubs.pop();t instanceof Promise?t.then(t=>t()):t()}this.__unsubs=void 0}}updated(t){if(super.updated(t),t.has("hass"))this._checkSubscribed();else if(this.hassSubscribeRequiredHostProps)for(const e of t.keys())if(this.hassSubscribeRequiredHostProps.includes(e))return void this._checkSubscribed()}hassSubscribe(){return[]}_checkSubscribed(){void 0===this.__unsubs&&this.isConnected&&void 0!==this.hass&&!this.hassSubscribeRequiredHostProps?.some(t=>void 0===this[t])&&(this.__unsubs=this.hassSubscribe())}}return(0,i.Cg)([(0,a.MZ)({attribute:!1})],e.prototype,"hass",void 0),e}},18427(t,e,s){s.d(e,{g:()=>o});var i=s(79468),a=s(39274);function o(t,e,s,o,n,r){const c=t.getPropertyValue(n+"-"+r).trim(),h=c.length>0?c:t.getPropertyValue(n).trim();let d=(0,i.RQ)(h);return 0===c.length&&r&&(d=(0,i.v2)((0,i.BE)(e?(0,a.T)((0,i.Nc)((0,i.xp)(d)),r):(0,a.d)((0,i.Nc)((0,i.xp)(d)),r)))),o?d+=s?"32":"7F":s&&(d+="7F"),d}},78231(t,e,s){s.a(t,async function(t,i){try{s.r(e),s.d(e,{HuiEnergyDevicesGraphCard:()=>$});s(74423),s(44114),s(18111),s(22489),s(20116),s(7588),s(61701),s(18237);var a=s(62826),o=s(5124),n=s(22441),r=s(6412),c=s(22786),h=s(94913),d=s(90433),l=s(20058),u=s(44439),p=(s(33062),s(38114)),_=s(23528),g=s(54706),m=s(784),y=(s(76776),s(1087)),f=s(3461),b=s(26300),v=s(93905),k=s(71769),C=s(18427),x=t([u,b,p,l]);[u,b,p,l]=x.then?(await x)():x;const S="M13,2.05V5.08C16.39,5.57 19,8.47 19,12C19,12.9 18.82,13.75 18.5,14.54L21.12,16.07C21.68,14.83 22,13.45 22,12C22,6.82 18.05,2.55 13,2.05M12,19A7,7 0 0,1 5,12C5,8.47 7.61,5.57 11,5.08V2.05C5.94,2.55 2,6.81 2,12A10,10 0 0,0 12,22C15.3,22 18.23,20.39 20.05,17.91L17.45,16.38C16.17,18 14.21,19 12,19Z",w="M22,21H2V3H4V19H6V10H10V19H12V6H16V19H18V14H22V21Z";class $ extends((0,g.E)(o.WF)){static async getConfigElement(){return await s.e(88899).then(s.bind(s,2670)),document.createElement("hui-energy-devices-card-editor")}static getStubConfig(t,e,s){return{type:"energy-devices-graph"}}hassSubscribe(){return[(0,p.tb)(this.hass,{key:this._config?.collection_key}).subscribe(t=>{this._data=t,this._getStatistics(t)}),(0,k.m)("all and (max-width: 450px), all and (max-height: 500px)",t=>{this._isMobile=t})]}getCardSize(){return 3}setConfig(t){t.collection_key&&(0,p.s8)(t.collection_key),this._config=t}_getAllowedModes(){return this._config?.modes&&0!==this._config.modes.length?this._config.modes:["bar","pie"]}shouldUpdate(t){return(0,m.xP)(this,t)||t.size>1||!t.has("hass")}willUpdate(t){if(super.willUpdate(t),t.has("_config")&&this._config){const t=this._getAllowedModes();this._chartType&&t.includes(this._chartType)||(this._chartType=t[0])}}render(){if(!this.hass||!this._config||!this._chartType)return o.s6;const t=this._getAllowedModes();return o.qy` <ha-card> <div class="card-header"> <span>${this._config.title?this._config.title:o.s6}</span> ${t.length>1?o.qy` <ha-icon-button .path="${"pie"===this._chartType?w:S}" .label="${this.hass.localize("ui.panel.lovelace.cards.energy.energy_devices_graph.change_chart_type")}" @click="${this._handleChartTypeChange}"></ha-icon-button> `:o.s6} </div> <div class="content ${(0,r.H)({"has-header":!!this._config.title})}"> <ha-chart-base .hass="${this.hass}" .data="${this._chartData}" .options="${this._createOptions(this._chartData,this._chartType,this._legendData)}" .height="${`${Math.max(t.includes("pie")?300:100,28*(this._legendData?.length||0)+50)}px`}" .extraComponents="${[h.a]}" click-label-for-more-info @chart-click="${this._handleChartClick}" @dataset-hidden="${this._datasetHidden}" @dataset-unhidden="${this._datasetUnhidden}" @legend-label-click="${this._handleLegendLabelClick}"></ha-chart-base> </div> </ha-card> `}_getDeviceName(t){const e=this._compoundStats.includes(t)?` (${this.hass.localize("ui.panel.lovelace.cards.energy.energy_devices_graph.untracked")})`:"";return(this._data?.prefs.device_consumption.find(e=>e.stat_consumption===t)?.name||(0,_.$O)(this.hass,t,this._data?.statsMetadata[t]))+e}async _getStatistics(t){const e=t.stats,s=t.statsCompare,i=[],a=[],o=[{type:this._chartType,radius:[s?"50%":"40%","70%"],universalTransition:!0,name:this.hass.localize("ui.panel.lovelace.cards.energy.energy_devices_graph.energy_usage"),itemStyle:{borderRadius:"bar"===this._chartType?[0,4,4,0]:4},data:i,barWidth:s?10:20,cursor:"default",minShowLabelAngle:15,label:"pie"===this._chartType?{formatter:({name:t})=>this._getDeviceName(t),overflow:"break",alignTo:this._isMobile?"edge":"none",edgeDistance:1}:void 0,labelLine:{length2:10}}];s&&o.push({type:this._chartType,radius:["30%","50%"],universalTransition:!0,name:this.hass.localize("ui.panel.lovelace.cards.energy.energy_devices_graph.previous_energy_usage"),itemStyle:{borderRadius:"bar"===this._chartType?[0,4,4,0]:4},data:a,barWidth:10,cursor:"default",label:"pie"===this._chartType?{show:!1}:void 0,emphasis:"pie"===this._chartType?{focus:"series",blurScope:"global"}:void 0});const n=getComputedStyle(this);this._compoundStats=t.prefs.device_consumption.map(t=>t.included_in_stat).filter(Boolean);const r=t.prefs.device_consumption,c={};r.forEach(t=>{c[t.stat_consumption]=t.stat_consumption in e&&(0,_.$j)(e[t.stat_consumption])||0});const h={};if(s&&r.forEach(t=>{h[t.stat_consumption]=t.stat_consumption in s&&(0,_.$j)(s[t.stat_consumption])||0}),r.forEach((t,e)=>{let o=c[t.stat_consumption];if(this._config?.hide_compound_stats){if(this._compoundStats.includes(t.stat_consumption))return}else{const e=r.reduce((e,s)=>s.included_in_stat===t.stat_consumption?e+c[s.stat_consumption]:e,0);o-=Math.min(o,e)}const l=(0,d.fI)(e,n);if(i.push({id:t.stat_consumption,value:[o,t.stat_consumption],name:t.stat_consumption,itemStyle:{color:l+"7F",borderColor:l}}),s){let e=t.stat_consumption in s&&(0,_.$j)(s[t.stat_consumption])||0;const i=r.reduce((e,s)=>s.included_in_stat===t.stat_consumption?e+h[s.stat_consumption]:e,0);e-=Math.min(e,i),a.push({id:t.stat_consumption,value:[e,t.stat_consumption],name:t.stat_consumption,itemStyle:{color:l+"32",borderColor:l+"7F"}})}}),"pie"===this._chartType){const e=i,{summedData:r,compareSummedData:c}=(0,p.gv)(t),{consumption:h,compareConsumption:d}=(0,p.DR)(r,c),u=h.total.used_total,_="from_grid"in r||"solar"in r||"from_battery"in r?u-e.reduce((t,e)=>t+e.value[0],0):0;if(_>0){const t=(0,C.g)(n,this.hass.themes.darkMode,!1,!1,"--history-unknown-color");if(e.push({id:"untracked",value:[_,"untracked"],name:this.hass.localize("ui.panel.lovelace.cards.energy.energy_devices_graph.untracked_consumption"),itemStyle:{color:t+"7F",borderColor:t}}),s){const e=d.total.used_total-a.reduce((t,e)=>t+e.value[0],0);e>0&&a.push({id:"untracked",value:[e,"untracked"],name:this.hass.localize("ui.panel.lovelace.cards.energy.energy_devices_graph.untracked_consumption"),itemStyle:{color:t+"32",borderColor:t+"7F"}})}}const g=e.reduce((t,e)=>this._hiddenStats.includes(e.id)?t:t+e.value[0],0);o.push({type:"pie",radius:["0%",s?"30%":"40%"],name:this.hass.localize("ui.panel.lovelace.cards.energy.energy_devices_graph.total_energy_usage"),data:[g],label:{show:!0,position:"center",color:n.getPropertyValue("--secondary-text-color"),fontSize:n.getPropertyValue("--ha-font-size-m"),lineHeight:24,fontWeight:"bold",formatter:`{a}\n${(0,l.ZV)(g,this.hass.locale)} kWh`},cursor:"default",itemStyle:{color:"rgba(0, 0, 0, 0)"},tooltip:{show:!1}})}i.sort((t,e)=>e.value[0]-t.value[0]),this._config?.max_devices&&i.length>this._config.max_devices&&i.splice(this._config.max_devices),this._legendData=i.map(t=>{const e=t.id;return{...t,name:this._getDeviceName(t.name),value:`${(0,l.ZV)(t.value[0],this.hass.locale)} kWh`,noLabelClick:"untracked"===e||(0,_.OQ)(e)||!(e in this.hass.states)}});for(let t=i.length-1;t>=0;t--)this._hiddenStats.includes(i[t].id)&&i.splice(t,1);s&&(o[1].data=i.map(t=>a.find(e=>e.id===t.id))),this._chartData=o,await this.updateComplete}_handleChartClick(t){if("axisLabel"===t.detail.targetType&&t.detail.value&&!(0,_.OQ)(t.detail.value))(0,y.r)(this,"hass-more-info",{entityId:t.detail.value});else if("pie"===t.detail.seriesType&&"tspan"===t.detail.event?.target?.type){const e=t.detail.data.id;"untracked"!==e&&!(0,_.OQ)(e)&&this.hass.states[e]&&(0,y.r)(this,"hass-more-info",{entityId:e})}}_handleLegendLabelClick(t){const e=t.detail.id;!(0,_.OQ)(e)&&this.hass.states[e]&&(0,y.r)(this,"hass-more-info",{entityId:e})}_handleChartTypeChange(){if(!this._chartType)return;const t=this._getAllowedModes(),e=(t.indexOf(this._chartType)+1)%t.length;this._chartType=t[e],this._getStatistics(this._data)}_datasetHidden(t){this._hiddenStats=[...this._hiddenStats,t.detail.id],this._getStatistics(this._data)}_datasetUnhidden(t){this._hiddenStats=this._hiddenStats.filter(e=>e!==t.detail.id),this._getStatistics(this._data)}constructor(...t){super(...t),this._chartData=[],this._legendData=[],this._hiddenStats=[],this._isMobile=!1,this._compoundStats=[],this.hassSubscribeRequiredHostProps=["_config"],this._renderTooltip=t=>{const e=this._getDeviceName(t.name),s=`${(0,l.ZV)(t.value[0],this.hass.locale,t.value<.1?{maximumFractionDigits:3}:void 0)} kWh ${t.percent?`(${t.percent} %)`:""}`;return o.qy`<h4 style="text-align:center;margin:0">${e}</h4> <ha-chart-tooltip-marker .color="${String(t.color??"")}"></ha-chart-tooltip-marker> ${t.seriesName}: <div style="direction:ltr;display:inline">${s}</div>`},this._createOptions=(0,c.A)((t,e,s)=>{const i={grid:{top:5,left:5,right:40,bottom:0,containLabel:!0},tooltip:{show:!0,formatter:this._renderTooltip},xAxis:{show:!1},yAxis:{show:!1},legend:{type:"custom",show:!1}};return"bar"===e?(i.xAxis={show:!0,type:"value",name:"kWh",axisPointer:{show:!1}},i.yAxis={show:!0,type:"category",inverse:!0,triggerEvent:!0,data:t[0]?.data?.map(t=>t.name),axisLabel:{formatter:this._getDeviceName.bind(this),overflow:"truncate",fontSize:12,margin:5,width:Math.min(this._isMobile?100:200,Math.max(...t[0]?.data?.map(t=>(0,f.W)(this._getDeviceName(t.name),12)+5)||[]))}}):i.legend={type:"custom",show:!0,data:s,selected:s.filter(t=>t.id&&this._hiddenStats.includes(t.id)).reduce((t,e)=>(t[e.id]=!1,t),{})},i})}}$.styles=o.AH`.card-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:0}.content{padding:16px}.has-header{padding-top:0}ha-chart-base{--chart-max-height:none}ha-icon-button{transform:rotate(90deg);color:var(--secondary-text-color);cursor:pointer}`,(0,a.Cg)([(0,n.MZ)({attribute:!1})],$.prototype,"hass",void 0),(0,a.Cg)([(0,n.wk)()],$.prototype,"_config",void 0),(0,a.Cg)([(0,n.wk)()],$.prototype,"_chartData",void 0),(0,a.Cg)([(0,n.wk)()],$.prototype,"_data",void 0),(0,a.Cg)([(0,n.wk)()],$.prototype,"_legendData",void 0),(0,a.Cg)([(0,n.wk)(),(0,v.I)({key:"energy-devices-graph-chart-type",state:!0,subscribe:!1})],$.prototype,"_chartType",void 0),(0,a.Cg)([(0,n.wk)(),(0,v.I)({key:"energy-devices-pie-hidden-stats",state:!0,subscribe:!1})],$.prototype,"_hiddenStats",void 0),(0,a.Cg)([(0,n.wk)()],$.prototype,"_isMobile",void 0),$=(0,a.Cg)([(0,n.EM)("hui-energy-devices-graph-card")],$),i()}catch(t){i(t)}})},3461(t,e,s){let i;function a(t,e,s="Roboto, Noto, sans-serif"){i||(i=document.createElement("canvas"));const a=i.getContext("2d");if(!a)return 0;a.font=`${e}px ${s}`;const o=a.measureText(t);return Math.ceil(Math.max(o.actualBoundingBoxRight+o.actualBoundingBoxLeft,o.width))}s.d(e,{W:()=>a})}};