iobroker.lovelace
Version:
With this adapter you can build visualization for ioBroker with Home Assistant Lovelace UI
4 lines • 4.15 kB
JavaScript
export const __rspack_esm_id=18344;export const __rspack_esm_ids=[18344];export const __webpack_modules__={38043(o,t,e){e.a(o,async function(o,i){try{e.r(t);e(44114),e(18111),e(61701);var s=e(62826),a=e(5124),l=e(22441),r=e(6412),h=e(1087),c=e(18350),d=(e(93444),e(62501)),n=e(72554),_=e(57264),g=e(14503),p=e(43612),m=e(68737),u=o([c,d,n,p,m]);[c,d,n,p,m]=u.then?(await u)():u;class b extends a.WF{async showDialog(o){this._entry=o.entry,this._dialogParams=o,this._color=o.initialColor??this._computeCurrentColor(),this._updateModes(),this._open=!0}closeDialog(){this._open=!1}_updateModes(){const o=(0,_.ti)(this.stateObj,_.NC.COLOR_TEMP),t=[];(0,_.Aw)(this.stateObj)&&t.push("color"),o&&t.push("color_temp"),this._modes=t,this._color?this._mode="color_temp_kelvin"in this._color?"color_temp":"color":this._mode=this._modes[0]}_computeCurrentColor(){const o=this.stateObj.attributes,t=o.color_mode;let e;return t===_.NC.XY?o.hs_color?e={hs_color:o.hs_color}:o.rgb_color&&(e={rgb_color:o.rgb_color}):t===_.NC.COLOR_TEMP&&o.color_temp_kelvin?e={color_temp_kelvin:o.color_temp_kelvin}:o[t+"_color"]&&(e={[t+"_color"]:o[t+"_color"]}),e}_colorChanged(o){this._color=o.detail}get stateObj(){return this._entry&&this.hass.states[this._entry.entity_id]}_dialogClosed(){this._open=!1,this._dialogParams=void 0,this._entry=void 0,this._color=void 0,(0,h.r)(this,"dialog-closed",{dialog:this.localName})}async _save(){this._color?(this._dialogParams?.submit?.(this._color),this.closeDialog()):this.closeDialog()}_modeChanged(o){const t=o.currentTarget.mode;t!==this._mode&&(this._mode=t)}render(){return this._entry&&this.stateObj?a.qy` <ha-dialog .open="${this._open}" .headerTitle="${this._dialogParams?.title}" ="${this._dialogClosed}"> <div class="header"> ${this._modes.length>1?a.qy` <div class="modes"> ${this._modes.map(o=>a.qy` <ha-icon-button-toggle border-only .selected="${o===this._mode}" .label="${this.hass.localize(`ui.dialogs.more_info_control.light.color_picker.mode.${o}`)}" .mode="${o}" ="${this._modeChanged}"> <span class="wheel ${(0,r.H)({[o]:!0})}"></span> </ha-icon-button-toggle> `)} </div> `:a.s6} </div> <div class="content"> ${"color_temp"===this._mode?a.qy` <light-color-temp-picker .hass="${this.hass}" .stateObj="${this.stateObj}" -changed="${this._colorChanged}"> </light-color-temp-picker> `:a.s6} ${"color"===this._mode?a.qy` <light-color-rgb-picker .hass="${this.hass}" .stateObj="${this.stateObj}" -changed="${this._colorChanged}"> </light-color-rgb-picker> `:a.s6} </div> <ha-dialog-footer slot="footer"> <ha-button slot="secondaryAction" appearance="plain" ="${this.closeDialog}"> ${this.hass.localize("ui.common.cancel")} </ha-button> <ha-button slot="primaryAction" ="${this._save}" .disabled="${!this._color}"> ${this.hass.localize("ui.common.save")} </ha-button> </ha-dialog-footer> </ha-dialog> `:a.s6}static get styles(){return[g.nA,a.AH`ha-dialog{--ha-dialog-width-md:420px;--ha-dialog-max-height:min(
600px,
100% - 48px
)} all and (max-width:450px),all and (max-height:500px){ha-dialog{--ha-dialog-width-md:100vw;--ha-dialog-max-height:calc(100% - 100px)}}.content{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--ha-space-6);flex:1}.modes{display:flex;flex-direction:row;justify-content:flex-end;padding:0 var(--ha-space-6)}.wheel{width:30px;height:30px;flex:none;border-radius:var(--ha-border-radius-xl)}.wheel.color{background-image:url("/static/images/color_wheel.png");background-size:cover}.wheel.color_temp{background:linear-gradient(0,#a6d1ff 0%,#fff 50%,#ffa000 100%)}`]}constructor(...o){super(...o),this._modes=[],this._open=!1}}(0,s.Cg)([(0,l.MZ)({attribute:!1})],b.prototype,"hass",void 0),(0,s.Cg)([(0,l.wk)()],b.prototype,"_dialogParams",void 0),(0,s.Cg)([(0,l.wk)()],b.prototype,"_entry",void 0),(0,s.Cg)([(0,l.wk)()],b.prototype,"_color",void 0),(0,s.Cg)([(0,l.wk)()],b.prototype,"_mode",void 0),(0,s.Cg)([(0,l.wk)()],b.prototype,"_modes",void 0),(0,s.Cg)([(0,l.wk)()],b.prototype,"_open",void 0),b=(0,s.Cg)([(0,l.EM)("dialog-light-color-favorite")],b),i()}catch(o){i(o)}})}};