iobroker.lovelace/hass_frontend/frontend_latest/58679.e17b9463450d7280.js

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

export const __rspack_esm_id=58679;export const __rspack_esm_ids=[58679];export const __webpack_modules__={11244(e,i,s){s.d(i,{c:()=>o,q:()=>t});const t=(e,i,s,t)=>e.connection.subscribeMessage(s,{type:"mqtt/subscribe",topic:i,qos:t}),o=(e,i)=>e.callWS({type:"mqtt/device/debug_info",device_id:i})},3338(e,i,s){s.a(e,async function(e,t){try{s.r(i);s(18111),s(61701);var o=s(62826),a=s(5124),d=s(22441),r=s(37981),l=s(28978),n=s(1087),p=(s(93444),s(6),s(59646)),h=s(72554),c=s(18350),g=s(11244),m=s(14503),_=(s(60415),s(86428)),y=e([p,h,c,_]);[p,h,c,_]=y.then?(await y)():y;class u extends a.WF{async showDialog(e){this._params=e,this._open=!0,(0,g.c)(this.hass,e.device.id).then(e=>{this._debugInfo=e})}render(){return this._params&&this._debugInfo?a.qy` <ha-dialog .open="${this._open}" width="large" header-title="${this.hass.localize("ui.dialogs.mqtt_device_debug_info.title",{device:(0,r.T)(this._params.device,this.hass.localize,this.hass.states)})}" @closed="${this._dialogClosed}"> <h4> ${this.hass.localize("ui.dialogs.mqtt_device_debug_info.payload_display")} </h4> <div> <ha-formfield .label="${this.hass.localize("ui.dialogs.mqtt_device_debug_info.deserialize")}"> <ha-switch .checked="${this._showDeserialized}" @change="${this._showDeserializedChanged}" autofocus> </ha-switch> </ha-formfield> </div> <div> <ha-formfield .label="${this.hass.localize("ui.dialogs.mqtt_device_debug_info.show_as_yaml")}"> <ha-switch .checked="${this._showAsYaml}" @change="${this._showAsYamlChanged}"> </ha-switch> </ha-formfield> </div> <h4> ${this.hass.localize("ui.dialogs.mqtt_device_debug_info.entities")} </h4> <ul class="entitylist"> ${this._debugInfo.entities.length?this._renderEntities():a.qy` ${this.hass.localize("ui.dialogs.mqtt_device_debug_info.no_entity_debug_info")} `} </ul> <h4> ${this.hass.localize("ui.dialogs.mqtt_device_debug_info.triggers")} </h4> <ul class="triggerlist"> ${this._debugInfo.triggers.length?this._renderTriggers():a.qy` ${this.hass.localize("ui.dialogs.mqtt_device_debug_info.no_trigger_debug_info")} `} </ul> <ha-dialog-footer slot="footer"> <ha-button slot="primaryAction" @click="${this._close}"> ${this.hass.localize("ui.common.close")} </ha-button> </ha-dialog-footer> </ha-dialog> `:a.s6}_close(){this._open=!1}_dialogClosed(){this._params=void 0,this._debugInfo=void 0,(0,n.r)(this,"dialog-closed",{dialog:this.localName})}_showAsYamlChanged(e){this._showAsYaml=e.target.checked}_showDeserializedChanged(e){this._showDeserialized=e.target.checked}_renderEntities(){return a.qy` ${this._debugInfo.entities.map(e=>a.qy` <li class="entitylistitem"> ${(0,l.u)(this.hass.states[e.entity_id])} (<code>${e.entity_id}</code>) <br>MQTT discovery data: <ul class="discoverydata"> <li> Topic: <code>${e.discovery_data.topic}</code> </li> <li> <mqtt-discovery-payload .hass="${this.hass}" .payload="${e.discovery_data.payload}" .showAsYaml="${this._showAsYaml}" .summary="${"Payload"}"> </mqtt-discovery-payload> </li> </ul> Subscribed topics: <ul> ${e.subscriptions.map(e=>a.qy` <li> <code>${e.topic}</code> <mqtt-messages .hass="${this.hass}" direction="Received" .messages="${e.messages}" .showDeserialized="${this._showDeserialized}" .showAsYaml="${this._showAsYaml}" .subscribedTopic="${e.topic}" .summary="${this.hass.localize("ui.dialogs.mqtt_device_debug_info.recent_messages",{n:e.messages.length})}"> </mqtt-messages> </li> `)} </ul> Transmitted messages: <ul> ${e.transmitted.map(e=>a.qy` <li> <code>${e.topic}</code> <mqtt-messages .hass="${this.hass}" direction="Transmitted" .messages="${e.messages}" .showDeserialized="${this._showDeserialized}" .showAsYaml="${this._showAsYaml}" .subscribedTopic="${e.topic}" .summary="${this.hass.localize("ui.dialogs.mqtt_device_debug_info.recent_tx_messages",{n:e.messages.length})}"> </mqtt-messages> </li> `)} </ul> </li> `)} `}_renderTriggers(){return a.qy` ${this._debugInfo.triggers.map(e=>a.qy` <li class="triggerlistitem"> MQTT discovery data: <ul class="discoverydata"> <li> Topic: <code>${e.discovery_data.topic}</code> </li> <li> <mqtt-discovery-payload .hass="${this.hass}" .payload="${e.discovery_data.payload}" .showAsYaml="${this._showAsYaml}" .summary="${"Payload"}"> </mqtt-discovery-payload> </li> </ul> </li> `)} `}static get styles(){return[m.nA,a.AH`ha-switch{margin:16px}.discoverydata{list-style-type:none;margin:4px;padding-left:16px;padding-inline-start:16px;padding-inline-end:initial}.entitylistitem{margin-bottom:12px}.triggerlistitem{margin-bottom:12px}`]}constructor(...e){super(...e),this._open=!1,this._showAsYaml=!0,this._showDeserialized=!0}}(0,o.Cg)([(0,d.wk)()],u.prototype,"_params",void 0),(0,o.Cg)([(0,d.wk)()],u.prototype,"_debugInfo",void 0),(0,o.Cg)([(0,d.wk)()],u.prototype,"_open",void 0),(0,o.Cg)([(0,d.wk)()],u.prototype,"_showAsYaml",void 0),(0,o.Cg)([(0,d.wk)()],u.prototype,"_showDeserialized",void 0),u=(0,o.Cg)([(0,d.EM)("dialog-mqtt-device-debug-info")],u),t()}catch(e){t(e)}})},60415(e,i,s){s(33110);var t=s(62826),o=s(53289),a=s(5124),d=s(22441),r=s(6412);class l extends a.WF{render(){return a.qy` <div class="expander ${(0,r.H)({open:this._open})}" @click="${this._handleToggle}"> ${this.summary} </div> ${this._open?a.qy` <div class="payload">${this._renderPayload()}</div>`:""} `}_renderPayload(){const e=this.payload;return a.qy` ${this.showAsYaml?a.qy` <pre>${(0,o.dump)(e)}</pre> `:a.qy` <pre>${JSON.stringify(e,null,2)}</pre> `} `}_handleToggle(){this._open=!this._open}constructor(...e){super(...e),this.showAsYaml=!1,this._open=!1}}l.styles=a.AH`.expander{cursor:pointer;position:relative;padding:8px;padding-left:29px;padding-inline-start:29px;padding-inline-end:initial;border:1px solid var(--divider-color)}.expander:before{content:"";position:absolute;border-right:2px solid var(--primary-text-color);border-bottom:2px solid var(--primary-text-color);width:5px;height:5px;top:50%;left:12px;transform:translateY(-50%) rotate(-45deg)}.expander.open:before{transform:translateY(-50%) rotate(45deg)}.payload{border:1px solid var(--divider-color);border-top:0;padding-left:16px;padding-inline-start:16px;padding-inline-end:initial}pre{display:inline-block;font-size:.9em;padding-left:4px;padding-right:4px;padding-inline-start:4px;padding-inline-end:4px;font-family:var(--ha-font-family-code)}`,(0,t.Cg)([(0,d.MZ)({attribute:!1})],l.prototype,"payload",void 0),(0,t.Cg)([(0,d.MZ)({attribute:"show-as-yaml",type:Boolean})],l.prototype,"showAsYaml",void 0),(0,t.Cg)([(0,d.MZ)()],l.prototype,"summary",void 0),(0,t.Cg)([(0,d.wk)()],l.prototype,"_open",void 0),l=(0,t.Cg)([(0,d.EM)("mqtt-discovery-payload")],l)},86428(e,i,s){s.a(e,async function(e,i){try{s(18111),s(7588),s(61701),s(69112),s(33110),s(88454),s(29452);var t=s(62826),o=s(53289),a=s(5124),d=s(22441),r=s(6412),l=s(30162),n=e([l]);l=(n.then?(await n)():n)[0];class p extends a.WF{firstUpdated(){this.messages.forEach(e=>{this.subscribedTopic!==e.topic&&(this._showTopic=!0)})}render(){return a.qy` <div class="expander ${(0,r.H)({open:this._open})}" @click="${this._handleToggle}"> ${this.summary} </div> ${this._open?a.qy` <ul class="message-list"> ${this.messages.map(e=>a.qy` <li class="message"> <div class="time"> ${this.direction} ${(0,l.ie)(new Date(e.time),this.hass.locale,this.hass.config)} </div> ${this._renderSingleMessage(e)} </li> `)} </ul> `:""} `}_renderSingleMessage(e){const i=e.topic;return a.qy` <ul class="message-with-topic"> ${this._showTopic?a.qy` <li>Topic: <code>${i}</code></li> `:""} <li>QoS: ${e.qos}${e.retain?", Retained":""}</li> <li>Payload: ${this._renderSinglePayload(e)}</li> </ul> `}_renderSinglePayload(e){let i;return this.showDeserialized&&(this._payloadsJson.has(e)?i=this._payloadsJson.get(e):(i=this._tryParseJson(e.payload),this._payloadsJson.set(e,i))),i?a.qy` ${this.showAsYaml?a.qy` <pre>${(0,o.dump)(i)}</pre> `:a.qy` <pre>${JSON.stringify(i,null,2)}</pre> `} `:a.qy` <code>${e.payload}</code> `}_tryParseJson(e){let i=null,s=e;if("string"==typeof e)try{s=JSON.parse(e)}catch(e){s=null}return s&&"object"==typeof s&&(i=s),i}_handleToggle(){this._open=!this._open}constructor(...e){super(...e),this.showAsYaml=!1,this.showDeserialized=!1,this._open=!1,this._payloadsJson=new WeakMap,this._showTopic=!1}}p.styles=a.AH`.expander{cursor:pointer;position:relative;padding:8px;padding-left:29px;padding-inline-start:29px padding-inline-end: initial;border:1px solid var(--divider-color)}.expander:before{content:"";position:absolute;border-right:2px solid var(--primary-text-color);border-bottom:2px solid var(--primary-text-color);width:5px;height:5px;top:50%;left:12px;transform:translateY(-50%) rotate(-45deg)}.expander.open:before{transform:translateY(-50%) rotate(45deg)}.message{font-size:.9em;margin-bottom:12px}.message-list{border:1px solid var(--divider-color);border-top:0;padding-left:28px;padding-inline-start:28px;padding-inline-end:initial;margin:0}pre{display:inline-block;font-size:.9em;margin:0;padding-left:4px;padding-right:4px;padding-inline-start:4px;padding-inline-end:4px;font-family:var(--ha-font-family-code)}`,(0,t.Cg)([(0,d.MZ)({attribute:!1})],p.prototype,"messages",void 0),(0,t.Cg)([(0,d.MZ)()],p.prototype,"direction",void 0),(0,t.Cg)([(0,d.MZ)({attribute:"show-as-yaml",type:Boolean})],p.prototype,"showAsYaml",void 0),(0,t.Cg)([(0,d.MZ)({attribute:"show-deserialized",type:Boolean})],p.prototype,"showDeserialized",void 0),(0,t.Cg)([(0,d.MZ)({attribute:!1})],p.prototype,"subscribedTopic",void 0),(0,t.Cg)([(0,d.MZ)()],p.prototype,"summary",void 0),(0,t.Cg)([(0,d.wk)()],p.prototype,"_open",void 0),(0,t.Cg)([(0,d.wk)()],p.prototype,"_payloadsJson",void 0),(0,t.Cg)([(0,d.wk)()],p.prototype,"_showTopic",void 0),p=(0,t.Cg)([(0,d.EM)("mqtt-messages")],p),i()}catch(e){i(e)}})}};