iobroker.lovelace
Version:
With this adapter you can build visualization for ioBroker with Home Assistant Lovelace UI
1 lines • 9.64 kB
JavaScript
export const __rspack_esm_id=39636;export const __rspack_esm_ids=[39636];export const __webpack_modules__={45291(a,e,t){t.d(e,{IP:()=>i,Iu:()=>h,J_:()=>o,O9:()=>d,b$:()=>n,bH:()=>r,c8:()=>l,wi:()=>c});t(18111),t(20116);const i="custom:",s=window;"customCards"in s||(s.customCards=[]),"customCardFeatures"in s||(s.customCardFeatures=[]),"customBadges"in s||(s.customBadges=[]),"customTileFeatures"in s||(s.customTileFeatures=[]);const o=s.customCards,r=()=>[...s.customCardFeatures,...s.customTileFeatures],d=s.customBadges,c=a=>o.find(e=>e.type===a),n=a=>d.find(e=>e.type===a),l=a=>a.startsWith(i),h=a=>a.slice(i.length)},48519(a,e,t){t.d(e,{ew:()=>o});t(18111),t(22489),t(20116);const i=window;"customStrategies"in i||(i.customStrategies=[]);const s=i.customStrategies,o=a=>s.filter(e=>e.strategyType===a)},1628(a,e,t){var i=t(62826),s=t(5124),o=t(22441);t(54276);class r extends s.WF{render(){return s.qy` <div class="card" tabindex="0" role="button" aria-label="${this.name}" ="${this._onKeyDown}"> <div class="card-header"> <div> <h2>${this.name}</h2> <p>${this.description}</p> </div> </div> ${this.img?s.qy` <div class="preview"> <img alt="${this.alt||this.name}" loading="lazy" src="${this.img}"> </div> `:s.s6} <ha-ripple></ha-ripple> </div> `}_onKeyDown(a){"Enter"!==a.key&&" "!==a.key||(a.preventDefault(),this.click())}constructor(...a){super(...a),this.name="",this.description="",this.img="",this.alt=""}}r.styles=s.AH`.card{height:100%;display:flex;flex-direction:row;justify-content:space-between;border-radius:var(--ha-border-radius-lg);background:var(--primary-background-color,#fafafa);cursor:pointer;position:relative;overflow:hidden;border:1px solid var(--divider-color)}.card-header{padding:var(--ha-space-3);display:block;text-align:var(--float-start);gap:var(--ha-space-2)}.preview{padding:var(--ha-space-4)}.preview img{max-height:160px}h2{margin:0 0 var(--ha-space-2) 0;font-size:1.2rem;color:var(--primary-text-color)}p{margin:0;color:var(--secondary-text-color);font-size:.9rem}`,(0,i.Cg)([(0,o.MZ)({type:String})],r.prototype,"name",void 0),(0,i.Cg)([(0,o.MZ)({type:String})],r.prototype,"description",void 0),(0,i.Cg)([(0,o.MZ)({type:String})],r.prototype,"img",void 0),(0,i.Cg)([(0,o.MZ)({type:String})],r.prototype,"alt",void 0),r=(0,i.Cg)([(0,o.EM)("dashboard-card")],r)},65631(a,e,t){t.a(a,async function(a,i){try{t.r(e);t(18111),t(61701);var s=t(62826),o=t(78648),r=t(5124),d=t(22441),c=t(22786),n=t(1087),l=t(72554),h=t(36866),g=t(45291),p=t(48519),m=t(25612),v=t(14503),u=t(35697),y=t(693),_=(t(1628),a([l,h]));[l,h]=_.then?(await _)():_;const f=[{type:"original-states",images:{light:"/static/images/dashboard-options/light/icon-dashboard-overview-legacy.svg",dark:"/static/images/dashboard-options/dark/icon-dashboard-overview-legacy.svg"},name:"ui.panel.config.lovelace.dashboards.dialog_new.strategy.overview-legacy.title",description:"ui.panel.config.lovelace.dashboards.dialog_new.strategy.overview-legacy.description"},{type:"map",images:{light:"/static/images/dashboard-options/light/icon-dashboard-map.svg",dark:"/static/images/dashboard-options/dark/icon-dashboard-map.svg"},name:"ui.panel.config.lovelace.dashboards.dialog_new.strategy.map.title",description:"ui.panel.config.lovelace.dashboards.dialog_new.strategy.map.description"},{type:"iframe",images:{light:"/static/images/dashboard-options/light/icon-dashboard-webpage.svg",dark:"/static/images/dashboard-options/dark/icon-dashboard-webpage.svg"},name:"ui.panel.config.lovelace.dashboards.dialog_new.strategy.iframe.title",description:"ui.panel.config.lovelace.dashboards.dialog_new.strategy.iframe.description"}];class b extends r.WF{showDialog(a){this._open=!0,this._params=a,this._localizedStrategies=f.map(a=>({...a,localizedName:this.hass.localize(a.name),localizedDescription:this.hass.localize(a.description)})),this._customStrategies=(0,p.ew)("dashboard"),this._loadCustomStrategies()}closeDialog(){return this._open=!1,!0}_dialogClosed(){this._params=void 0,(0,n.r)(this,"dialog-closed",{dialog:this.localName})}render(){if(!this._params)return r.s6;const a=this._generateDefaultConfig(this.hass.localize);return r.qy` <ha-dialog .open="${this._open}" flexcontent width="large" header-title="${this.hass.localize("ui.panel.config.lovelace.dashboards.dialog_new.header")}" ="${this._dialogClosed}"> <div class="content-wrapper"> <ha-input-search appearance="outlined" autofocus .placeholder="${this.hass.localize("ui.panel.config.lovelace.dashboards.dialog_new.search_dashboards")}" .value="${this._filter}" ="${this._handleSearchChange}"></ha-input-search> <div class="content ha-scrollbar"> ${this._filter?r.qy` <div class="cards-container"> ${this._filterStrategies(this._localizedStrategies,this._filter).map(a=>r.qy` <dashboard-card .name="${a.localizedName}" .description="${a.localizedDescription}" .img="${this.hass.themes.darkMode?a.images.dark:a.images.light}" .alt="${a.localizedName}" ="${this._selected}" .strategy="${a.type}"></dashboard-card> `)} ${this._filterCustomStrategies(this._customStrategies,this._filter).map(a=>r.qy` <dashboard-card .name="${a.name||a.type}" .description="${a.description||""}" ="${this._selected}" .strategy="${g.IP+a.type}"></dashboard-card> `)} </div> `:r.qy` <div class="cards-container"> <dashboard-card .name="${this.hass.localize("ui.panel.config.lovelace.dashboards.dialog_new.create_empty")}" .description="${this.hass.localize("ui.panel.config.lovelace.dashboards.dialog_new.create_empty_description")}" .img="${this.hass.themes.darkMode?"/static/images/dashboard-options/dark/icon-dashboard-new.svg":"/static/images/dashboard-options/light/icon-dashboard-new.svg"}" .alt="${this.hass.localize("ui.panel.config.lovelace.dashboards.dialog_new.create_empty")}" ="${this._selected}" .config="${a}"></dashboard-card> </div> <div class="cards-container"> <div class="cards-container-header"> ${this.hass.localize("ui.panel.config.lovelace.dashboards.dialog_new.heading.default")} </div> ${this._localizedStrategies.map(a=>r.qy` <dashboard-card .name="${a.localizedName}" .description="${a.localizedDescription}" .img="${this.hass.themes.darkMode?a.images.dark:a.images.light}" .alt="${a.localizedName}" ="${this._selected}" .strategy="${a.type}"></dashboard-card> `)} </div> ${this._customStrategies.length>0?r.qy` <div class="cards-container"> <div class="cards-container-header"> ${this.hass.localize("ui.panel.config.lovelace.dashboards.dialog_new.heading.custom")} </div> ${this._customStrategies.map(a=>r.qy` <dashboard-card .name="${a.name||a.type}" .description="${a.description||""}" ="${this._selected}" .strategy="${g.IP+a.type}"></dashboard-card> `)} </div> `:r.s6} `} </div> </div> </ha-dialog> `}_handleSearchChange(a){this._filter=a.target.value??""}_generateStrategyConfig(a){return{strategy:{type:a}}}async _loadCustomStrategies(){const a=window;a.llResProm||(a.llResProm=(0,m.kZ)(this.hass.connection));try{const e=await a.llResProm;await(0,u.$)(e,this.hass)}catch(e){return a.llResProm=void 0,void(this._customStrategies=(0,p.ew)("dashboard"))}this._customStrategies=(0,p.ew)("dashboard")}async _selected(a){const e=a.currentTarget;let t,i;e&&(e.config?t=e.config:e.strategy&&(i=e.strategy,t=this._generateStrategyConfig(e.strategy)),await(this._params?.selectConfig({config:t,strategyType:i})),this.closeDialog())}static get styles(){return[v.dp,r.AH`ha-dialog{--dialog-content-padding:0;--dialog-z-index:6;--ha-dialog-min-height:60svh}ha-dialog::part(body){overflow:hidden;min-height:0}.cards-container-header{font-size:var(--ha-font-size-l);font-weight:var(--ha-font-weight-medium);padding:var(--ha-space-3) var(--ha-space-2);margin:0;grid-column:1/-1;position:sticky;top:56px;z-index:1;background:linear-gradient(90deg,var(--ha-dialog-surface-background,var(--mdc-theme-surface,#fff)) 0%,#ffffff00 80%)}ha-input-search{padding:0 var(--ha-space-6);position:sticky;top:0;z-index:10}.cards-container{display:grid;grid-gap:var(--ha-space-2) var(--ha-space-2);grid-template-columns:repeat(auto-fill,minmax(300px,1fr));margin-top:var(--ha-space-5)}.content-wrapper{flex:1;min-height:0;display:flex;flex-direction:column}.content{padding:0 var(--ha-space-6) var(--ha-space-6) var(--ha-space-6);flex:1;min-height:0;overflow:auto}`]}constructor(...a){super(...a),this._open=!1,this._filter="",this._localizedStrategies=[],this._customStrategies=[],this._generateDefaultConfig=(0,c.A)(a=>({views:[(0,y.c)(a,!0)]})),this._filterStrategies=(0,c.A)((a,e)=>{if(!e)return a;const t={keys:["type","localizedName","localizedDescription"],isCaseSensitive:!1,threshold:.3,ignoreLocation:!0,minMatchCharLength:Math.min(e.length,2)};return new o.A(a,t).search(e).map(a=>a.item)}),this._filterCustomStrategies=(0,c.A)((a,e)=>{if(!e)return a;const t={keys:["type","name","description"],isCaseSensitive:!1,minMatchCharLength:Math.min(e.length,2),threshold:.3,ignoreDiacritics:!0,ignoreLocation:!0};return new o.A(a,t).search(e).map(a=>a.item)})}}(0,s.Cg)([(0,d.MZ)({attribute:!1})],b.prototype,"hass",void 0),(0,s.Cg)([(0,d.wk)()],b.prototype,"_open",void 0),(0,s.Cg)([(0,d.wk)()],b.prototype,"_params",void 0),(0,s.Cg)([(0,d.wk)()],b.prototype,"_filter",void 0),(0,s.Cg)([(0,d.wk)()],b.prototype,"_localizedStrategies",void 0),(0,s.Cg)([(0,d.wk)()],b.prototype,"_customStrategies",void 0),b=(0,s.Cg)([(0,d.EM)("ha-dialog-new-dashboard")],b),i()}catch(a){i(a)}})},31481(a,e,t){t.d(e,{Y:()=>i});const i=(a,e)=>({type:"grid",cards:e?[{type:"heading",heading:a("ui.panel.lovelace.editor.section.default_section_title")}]:[]})},693(a,e,t){t.d(e,{c:()=>s});var i=t(31481);const s=(a,e)=>({type:"sections",sections:[(0,i.Y)(a,e)]})}};