iobroker.lovelace
Version:
With this adapter you can build visualization for ioBroker with Home Assistant Lovelace UI
1 lines • 7.17 kB
JavaScript
export const __rspack_esm_id=45001;export const __rspack_esm_ids=[45001];export const __webpack_modules__={12587(e,t,o){o.d(t,{E:()=>i,m:()=>a});const a=e=>{requestAnimationFrame(()=>setTimeout(e,0))},i=()=>new Promise(e=>{a(e)})},11382(e,t,o){var a=o(62826),i=o(5124),n=o(22441),s=o(6412),r=o(1087),d=o(12587);o(67094);class l extends i.WF{render(){const e=this.noCollapse?i.s6:i.qy` <ha-svg-icon .path="${"M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z"}" class="summary-icon ${(0,s.H)({expanded:this.expanded})}"></ha-svg-icon> `;return i.qy` <div class="top ${(0,s.H)({expanded:this.expanded})}"> <div id="summary" class="${(0,s.H)({noCollapse:this.noCollapse})}" ="${this._toggleContainer}" ="${this._toggleContainer}" ="${this._focusChanged}" ="${this._focusChanged}" role="button" tabindex="${this.noCollapse?-1:0}" aria-expanded="${this.expanded}" aria-controls="sect1" part="summary"> ${this.leftChevron?e:i.s6} <slot name="leading-icon"></slot> <slot name="header"> <div class="header"> ${this.header} <slot class="secondary" name="secondary">${this.secondary}</slot> </div> </slot> <slot name="event"></slot> ${this.leftChevron?i.s6:e} <slot name="icons"></slot> </div> </div> <div class="container ${(0,s.H)({expanded:this.expanded})}" ="${this._handleTransitionEnd}" role="region" aria-labelledby="summary" aria-hidden="${!this.expanded}" tabindex="-1"> ${this._showContent?i.qy`<slot></slot>`:""} </div> `}willUpdate(e){super.willUpdate(e),e.has("expanded")&&(this._showContent=this.expanded,setTimeout(()=>{this._container.style.overflow=this.expanded?"initial":"hidden"},300))}_handleTransitionEnd(){this._container.style.removeProperty("height"),this._container.style.overflow=this.expanded?"initial":"hidden",this._showContent=this.expanded}async _toggleContainer(e){if(e.defaultPrevented)return;if("keydown"===e.type&&"Enter"!==e.key&&" "!==e.key)return;if(e.preventDefault(),this.noCollapse)return;const t=!this.expanded;(0,r.r)(this,"expanded-will-change",{expanded:t}),this._container.style.overflow="hidden",t&&(this._showContent=!0,await(0,d.E)());const o=this._container.scrollHeight;this._container.style.height=`${o}px`,t||setTimeout(()=>{this._container.style.height="0px"},0),this.expanded=t,(0,r.r)(this,"expanded-changed",{expanded:this.expanded})}_focusChanged(e){this.noCollapse||this.shadowRoot.querySelector(".top").classList.toggle("focused","focus"===e.type)}constructor(...e){super(...e),this.expanded=!1,this.outlined=!1,this.leftChevron=!1,this.noCollapse=!1,this._showContent=this.expanded}}l.styles=i.AH`:host{display:block}.top{display:flex;align-items:center;border-radius:var(--ha-card-border-radius,var(--ha-border-radius-lg))}.top.expanded{border-bottom-left-radius:0px;border-bottom-right-radius:0px}.top.focused{background:var(--input-fill-color)}:host([outlined]){box-shadow:none;border-width:1px;border-style:solid;border-color:var(--outline-color);border-radius:var(--ha-card-border-radius,var(--ha-border-radius-lg))}.summary-icon{transition:transform 150ms cubic-bezier(.4, 0, .2, 1);direction:var(--direction);margin-left:8px;margin-inline-start:8px;margin-inline-end:initial;border-radius:var(--ha-border-radius-circle)}#summary:focus-visible ha-svg-icon.summary-icon{background-color:var(--ha-color-fill-neutral-normal-active)}::slotted([slot=leading-icon]),:host([left-chevron]) .summary-icon{margin-left:0;margin-right:8px;margin-inline-start:0;margin-inline-end:8px}#summary{flex:1;display:flex;padding:var(--expansion-panel-summary-padding,0 8px);min-height:48px;align-items:center;cursor:pointer;overflow:hidden;font-weight:var(--ha-font-weight-medium);outline:0}#summary.noCollapse{cursor:default}.summary-icon.expanded{transform:rotate(180deg)}.header,::slotted([slot=header]){flex:1;overflow-wrap:anywhere;color:var(--primary-text-color)}.container{padding:var(--expansion-panel-content-padding,0 8px);overflow:hidden;transition:height .3s cubic-bezier(.4, 0, .2, 1);height:0px}.container.expanded{height:auto}.secondary{display:block;color:var(--secondary-text-color);font-size:var(--ha-font-size-s)}`,(0,a.Cg)([(0,n.MZ)({type:Boolean,reflect:!0})],l.prototype,"expanded",void 0),(0,a.Cg)([(0,n.MZ)({type:Boolean,reflect:!0})],l.prototype,"outlined",void 0),(0,a.Cg)([(0,n.MZ)({attribute:"left-chevron",type:Boolean,reflect:!0})],l.prototype,"leftChevron",void 0),(0,a.Cg)([(0,n.MZ)({attribute:"no-collapse",type:Boolean,reflect:!0})],l.prototype,"noCollapse",void 0),(0,a.Cg)([(0,n.MZ)()],l.prototype,"header",void 0),(0,a.Cg)([(0,n.MZ)()],l.prototype,"secondary",void 0),(0,a.Cg)([(0,n.wk)()],l.prototype,"_showContent",void 0),(0,a.Cg)([(0,n.P)(".container")],l.prototype,"_container",void 0),l=(0,a.Cg)([(0,n.EM)("ha-expansion-panel")],l)},40003(e,t,o){o.a(e,async function(e,a){try{o.r(t),o.d(t,{HaFormExpandable:()=>l});var i=o(62826),n=o(5124),s=o(22441),r=(o(11382),o(52763)),d=e([r]);r=(d.then?(await d)():d)[0];class l extends n.WF{reportValidity(){return this._form?.reportValidity()??!0}_renderDescription(){const e=this.computeHelper?.(this.schema);return e?n.qy`<p>${e}</p>`:n.s6}render(){return n.qy` <ha-expansion-panel outlined .expanded="${Boolean(this.schema.expanded)}"> ${this.schema.icon?n.qy` <ha-icon slot="leading-icon" .icon="${this.schema.icon}"></ha-icon> `:this.schema.iconPath?n.qy` <ha-svg-icon slot="leading-icon" .path="${this.schema.iconPath}"></ha-svg-icon> `:n.s6} <div slot="header" role="heading" aria-level="${this.schema.headingLevel?.toString()??"3"}"> ${this.schema.title||this.computeLabel?.(this.schema)} </div> <div class="content"> ${this._renderDescription()} <ha-form .hass="${this.hass}" .data="${this.data}" .schema="${this.schema.schema}" .disabled="${this.disabled}" .computeLabel="${this._computeLabel}" .computeHelper="${this._computeHelper}" .localizeValue="${this.localizeValue}"></ha-form> </div> </ha-expansion-panel> `}constructor(...e){super(...e),this.disabled=!1,this._computeLabel=(e,t,o)=>this.computeLabel?this.computeLabel(e,t,{...o,path:[...o?.path||[],this.schema.name]}):this.computeLabel,this._computeHelper=(e,t)=>this.computeHelper?this.computeHelper(e,{...t,path:[...t?.path||[],this.schema.name]}):this.computeHelper}}l.styles=n.AH`:host{display:flex!important;flex-direction:column}:host ha-form{display:block}.content{padding:12px}.content p{margin:0 0 24px}ha-expansion-panel{display:block;--expansion-panel-content-padding:0;border-radius:var(--ha-border-radius-md);--ha-card-border-radius:var(--ha-border-radius-md)}ha-icon,ha-svg-icon{color:var(--secondary-text-color)}`,(0,i.Cg)([(0,s.MZ)({attribute:!1})],l.prototype,"hass",void 0),(0,i.Cg)([(0,s.MZ)({attribute:!1})],l.prototype,"data",void 0),(0,i.Cg)([(0,s.MZ)({attribute:!1})],l.prototype,"schema",void 0),(0,i.Cg)([(0,s.MZ)({type:Boolean})],l.prototype,"disabled",void 0),(0,i.Cg)([(0,s.MZ)({attribute:!1})],l.prototype,"computeLabel",void 0),(0,i.Cg)([(0,s.MZ)({attribute:!1})],l.prototype,"computeHelper",void 0),(0,i.Cg)([(0,s.MZ)({attribute:!1})],l.prototype,"localizeValue",void 0),(0,i.Cg)([(0,s.P)("ha-form",!0)],l.prototype,"_form",void 0),l=(0,i.Cg)([(0,s.EM)("ha-form-expandable")],l),a()}catch(e){a(e)}})}};