UNPKG

iobroker.lovelace

Version:

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

github.com/ioBroker/ioBroker.lovelace

ioBroker/ioBroker.lovelace

25 lines • 17.7 kB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
export const __rspack_esm_id=81382;export const __rspack_esm_ids=[81382];export const __webpack_modules__={2226(e,t,a){a(18111),a(61701);var i=a(62826),o=a(35211),s=a(5124),r=a(22441),l=a(6412),n=a(63672),d=a(89784),h=a(1087),c=a(15638),p=a(22792);a(64013),a(92677);class u extends s.WF{render(){const e=this.maxColumns??3,t=Math.min(e,this.options.length);return s.qy` <ha-radio-group class="list" style="${(0,d.W)({"--columns":t})}" .value="${this.value}" @change="${this._radioChanged}"> ${this.options.map(e=>this._renderOption(e))} </ha-radio-group> `}_renderOption(e){const t=1===this.maxColumns&&!this.stackedImage,a=1===this.maxColumns&&this.stackedImage,i=e.disabled||this.disabled||!1,o=e.value===this.value,r=this._ui?.themes.darkMode||!1,d=!!this._i18n&&(0,c.qC)(this._i18n.language,this._i18n.translationMetadata.translations),h="object"==typeof e.image?r&&e.image.src_dark||e.image.src:e.image,p="object"==typeof e.image&&(d&&e.image.flip_rtl);return s.qy` <label class="option ${(0,l.H)({horizontal:t,stacked:a,selected:o})}" ?disabled="${i}"> <div class="content"> <ha-radio-option aria-describedby="${(0,n.J)(e.description?`desc-${e.value}`:void 0)}" aria-labelledby="${`label-${e.value}`}" .value="${e.value}" .disabled="${i}"></ha-radio-option> <div class="text"> <span id="${`label-${e.value}`}" class="label">${e.label}</span> ${e.description?s.qy`<span class="description" id="desc-${e.value}">${e.description}</span>`:s.s6} </div> </div> ${h?s.qy` <img class="${p?"flipped":""}" alt="" src="${h}"> `:s.s6} </label> `}_radioChanged(e){e.stopPropagation();const t=e.currentTarget.value;this.disabled||void 0===t||t===(this.value??"")||(0,h.r)(this,"value-changed",{value:t})}constructor(...e){super(...e),this.options=[],this.stackedImage=!1}}u.styles=s.AH`.list::part(form-control-input){display:grid;grid-template-columns:repeat(var(--columns,1),minmax(0,1fr));gap:var(--ha-space-3)}.option{position:relative;display:block;border:1px solid var(--divider-color);border-radius:var(--ha-card-border-radius,var(--ha-border-radius-lg));display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:12px;gap:var(--ha-space-2);overflow:hidden;cursor:pointer}.option .content{position:relative;display:flex;flex-direction:row;gap:var(--ha-space-2);min-width:0;width:100%}.option .content ha-radio-option{--ha-radio-option-control-margin:0;margin:0;flex:none}.option .content .text{display:flex;flex-direction:column;gap:var(--ha-space-1);min-width:0;flex:1;justify-content:center}.option .content .text .label{color:var(--primary-text-color);font-size:var(--ha-font-size-m);font-weight:var(--ha-font-weight-normal);line-height:var(--ha-line-height-condensed);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.option .content .text .description{color:var(--secondary-text-color);font-size:var(--ha-font-size-s);font-weight:var(--ha-font-weight-normal);line-height:var(--ha-line-height-condensed)}img{position:relative;max-width:var(--ha-select-box-image-size,96px);max-height:var(--ha-select-box-image-size,96px);margin:auto}.flipped{transform:scaleX(-1)}.option.horizontal{flex-direction:row;align-items:flex-start}.option.horizontal img{margin:0}.option.stacked{align-items:stretch}.option.stacked img{max-width:100%;max-height:var(--ha-select-box-image-size,96px);margin:0}.option:before{content:"";display:block;inset:0;position:absolute;background-color:transparent;pointer-events:none;opacity:.2;transition:background-color 180ms ease-in-out,opacity 180ms ease-in-out}.option:hover:before{background-color:var(--divider-color)}.option.selected:before{background-color:var(--primary-color)}.option[disabled]{cursor:not-allowed}.option[disabled] .content,.option[disabled] img{opacity:.5}.option[disabled]:before{background-color:var(--disabled-color);opacity:.05}`,(0,i.Cg)([(0,r.MZ)({attribute:!1})],u.prototype,"options",void 0),(0,i.Cg)([(0,r.MZ)({attribute:!1})],u.prototype,"value",void 0),(0,i.Cg)([(0,r.MZ)({type:Boolean})],u.prototype,"disabled",void 0),(0,i.Cg)([(0,r.MZ)({type:Number,attribute:"max_columns"})],u.prototype,"maxColumns",void 0),(0,i.Cg)([(0,r.MZ)({type:Boolean,attribute:"stacked_image"})],u.prototype,"stackedImage",void 0),(0,i.Cg)([(0,r.wk)(),(0,o.Fg)({context:p.D5,subscribe:!0})],u.prototype,"_i18n",void 0),(0,i.Cg)([(0,r.wk)(),(0,o.Fg)({context:p.EK,subscribe:!0})],u.prototype,"_ui",void 0),u=(0,i.Cg)([(0,r.EM)("ha-select-box")],u)},856(e,t,a){a.a(e,async function(e,i){try{a.r(t),a.d(t,{HaSelectSelector:()=>m});a(74423),a(18111),a(22489),a(20116),a(7588),a(61701);var o=a(62826),s=a(5124),r=a(22441),l=a(75751),n=a(22786),d=a(44537),h=a(1087),c=a(52220),p=(a(5745),a(13467),a(9503),a(70947),a(6),a(38508)),u=(a(3449),a(606)),v=(a(2226),a(85938),a(64013),a(92677),e([p,u]));[p,u]=v.then?(await v)():v;const g="M21 11H3V9H21V11M21 13H3V15H21V13Z";class m extends s.WF{_itemMoved(e){e.stopPropagation();const{oldIndex:t,newIndex:a}=e.detail;this._move(t,a)}_move(e,t){const a=this.value.concat(),i=a.splice(e,1)[0];a.splice(t,0,i),this.value=a,(0,h.r)(this,"value-changed",{value:a})}render(){const e=this._getOptions(this.selector),t=this.selector.select?.translation_key;if(this.localizeValue&&t&&e.forEach(e=>{const a=this.localizeValue(`${t}.options.${e.value}`);a&&(e.label=a)}),this.selector.select?.sort&&e.sort((e,t)=>(0,c.SH)(e.label,t.label,this.hass.locale.language)),!this.selector.select?.multiple&&!this.selector.select?.reorder&&!this.selector.select?.custom_value&&"box"===this._mode)return s.qy` ${this.label?s.qy`<span class="label">${this.label}</span>`:s.s6} <ha-select-box .options="${e}" .value="${this.value}" @value-changed="${this._selectChanged}" .maxColumns="${this.selector.select?.box_max_columns}"></ha-select-box> ${this._renderHelper()} `;if(!this.selector.select?.custom_value&&!this.selector.select?.reorder&&"list"===this._mode){if(!this.selector.select?.multiple)return s.qy` <ha-radio-group .label="${this.label}" .disabled="${this.disabled}" .value="${this.value}" @change="${this._radioChanged}"> ${e.map(e=>s.qy` <ha-radio-option .value="${e.value}" .disabled="${!!e.disabled}"> ${e.label} </ha-radio-option> `)} </ha-radio-group> ${this._renderHelper()} `;const t=this.value&&""!==this.value?(0,d.e)(this.value):[];return s.qy` <div> ${this.label} ${e.map(e=>s.qy` <ha-checkbox .checked="${t.includes(e.value)}" .value="${e.value}" .disabled="${e.disabled||this.disabled}" @change="${this._checkboxChanged}"> ${e.label} </ha-checkbox> `)} </div> ${this._renderHelper()} `}if(this.selector.select?.multiple){const t=this.value&&""!==this.value?(0,d.e)(this.value):[];return s.qy` ${t?.length?s.qy` <ha-sortable no-style .disabled="${!this.selector.select.reorder}" @item-moved="${this._itemMoved}" handle-selector="button.primary.action"> <ha-chip-set> ${(0,l.u)(t,e=>e,(t,a)=>{const i=e.find(e=>e.value===t)?.label||t;return s.qy` <ha-input-chip .idx="${a}" @remove="${this._removeItem}" .label="${i}" selected="selected"> ${this.selector.select?.reorder?s.qy` <ha-svg-icon slot="icon" .path="${g}"></ha-svg-icon> `:s.s6} ${e.find(e=>e.value===t)?.label||t} </ha-input-chip> `})} </ha-chip-set> </ha-sortable> `:s.s6} <ha-generic-picker no-sort .hass="${this.hass}" .helper="${this.helper}" .disabled="${this.disabled}" .required="${this.required&&!t.length}" .value="${""}" .addButtonLabel="${this.label}" .getItems="${this._getItems(e,t,!0)}" .allowCustomValue="${this.selector.select.custom_value??!1}" @value-changed="${this._comboBoxValueChanged}"></ha-generic-picker> `}return this.selector.select?.custom_value?s.qy` <ha-generic-picker no-sort .hass="${this.hass}" .label="${this.label}" .helper="${this.helper}" .disabled="${this.disabled}" .required="${this.required}" .getItems="${this._getItems(e)}" .value="${"string"==typeof this.value?this.value:void 0}" @value-changed="${this._comboBoxValueChanged}" allow-custom-value></ha-generic-picker> `:s.qy` <ha-select .label="${this.label??""}" .value="${["string","number"].includes(typeof this.value)?this.value:""}" .helper="${this.helper??""}" .disabled="${this.disabled}" .required="${this.required}" clearable @selected="${this._selectChanged}" .options="${e}"> </ha-select> `}_renderHelper(){return this.helper?s.qy`<ha-input-helper-text .disabled="${this.disabled}">${this.helper}</ha-input-helper-text>`:""}get _mode(){return this.selector.select?.mode||((this.selector.select?.options?.length||0)<6?"list":"dropdown")}_radioChanged(e){e.stopPropagation(),this._valueChanged(e)}_selectChanged(e){e.stopPropagation(),void 0!==e.detail?.value||void 0===this.value?this._valueChanged(e):(0,h.r)(this,"value-changed",{value:void 0})}_valueChanged(e){const t=e.detail?.value??e.target.value;this.disabled||void 0===t||t===(this.value??"")||(0,h.r)(this,"value-changed",{value:t})}_checkboxChanged(e){if(e.stopPropagation(),this.disabled)return;let t;const a=e.target.value,i=e.target.checked,o=this.value&&""!==this.value?(0,d.e)(this.value):[];if(i){if(o.includes(a))return;t=[...o,a]}else{if(!o?.includes(a))return;t=o.filter(e=>e!==a)}(0,h.r)(this,"value-changed",{value:t})}async _removeItem(e){e.stopPropagation();const t=[...(0,d.e)(this.value)];t.splice(e.target.idx,1),(0,h.r)(this,"value-changed",{value:t})}_comboBoxValueChanged(e){e.stopPropagation();const t=e.detail.value;if(this.disabled||""===t)return;if(!this.selector.select?.multiple)return void(0,h.r)(this,"value-changed",{value:t});const a=this.value?(0,d.e)(this.value):[];void 0!==t&&a.includes(t)||(0,h.r)(this,"value-changed",{value:[...a,t]})}constructor(...e){super(...e),this.disabled=!1,this.required=!0,this._getOptions=(0,n.A)(e=>e.select?.options?.map(e=>"object"==typeof e?e:{value:String(e),label:e})||[]),this._getItems=(0,n.A)((e,t,a=!1)=>{const i=e.filter(e=>!e.disabled&&!a||!t?.includes(e.value));return()=>i.map(e=>({id:e.value,primary:e.label,sorting_label:e.label}))})}}m.styles=s.AH`:host{position:relative}ha-formfield,ha-select{display:block}ha-checkbox{display:flex;min-height:40px;justify-content:center}ha-dropdown-item[disabled]{--mdc-theme-text-primary-on-background:var(--disabled-text-color)}ha-chip-set{padding:8px 0}.label{display:block;margin:0 0 8px}ha-select-box+ha-input-helper-text{margin-top:4px}.sortable-fallback{display:none;opacity:0}.sortable-ghost{opacity:.4}.sortable-drag{cursor:grabbing}`,(0,o.Cg)([(0,r.MZ)({attribute:!1})],m.prototype,"hass",void 0),(0,o.Cg)([(0,r.MZ)({attribute:!1})],m.prototype,"selector",void 0),(0,o.Cg)([(0,r.MZ)()],m.prototype,"value",void 0),(0,o.Cg)([(0,r.MZ)()],m.prototype,"label",void 0),(0,o.Cg)([(0,r.MZ)()],m.prototype,"helper",void 0),(0,o.Cg)([(0,r.MZ)({attribute:!1})],m.prototype,"localizeValue",void 0),(0,o.Cg)([(0,r.MZ)({type:Boolean})],m.prototype,"disabled",void 0),(0,o.Cg)([(0,r.MZ)({type:Boolean})],m.prototype,"required",void 0),m=(0,o.Cg)([(0,r.EM)("ha-selector-select")],m),i()}catch(e){i(e)}})},64013(e,t,a){var i=a(62826),o=a(97086),s=a(5124),r=a(22441);class l extends o.A{static get styles(){return[o.A.styles,s.AH`:host{--wa-form-control-required-content:var( --ha-radio-group-required-marker, var(--ha-input-required-marker, "*") );--wa-form-control-required-content-offset:var( --ha-radio-group-required-marker-offset, 0.1rem )}`]}constructor(){super(),this.radioTag="ha-radio-option"}}l=(0,i.Cg)([(0,r.EM)("ha-radio-group")],l)},92677(e,t,a){var i=a(62826),o=a(17010),s=a(5124),r=a(22441);class l extends o.A{static get styles(){return[o.A.styles,s.AH`:host{--wa-form-control-activated-color:var( --ha-radio-option-active-color, var(--ha-color-fill-primary-loud-resting) );--wa-form-control-height:var(--ha-radio-option-height, 40px);--wa-form-control-toggle-size:var( --ha-radio-option-toggle-size, 20px );--wa-form-control-border-width:var( --ha-radio-option-border-width, var(--ha-border-width-md) );--wa-form-control-border-color:var( --ha-radio-option-border-color, var(--ha-color-border-neutral-normal) );--wa-form-control-background-color:var( --ha-radio-option-background-color, var(--wa-form-control-background-color) );--checked-icon-color:var( --ha-radio-option-checked-icon-color, var(--wa-form-control-activated-color) );--checked-icon-scale:var(--ha-radio-option-checked-icon-scale, 0.7)}:host([appearance=default]) .control{margin:var(--ha-radio-option-control-margin,var(--ha-space-3) var(--ha-space-2) var(--ha-space-3) var(--ha-space-3))}:host(:not([aria-checked=true],[aria-disabled=true]):hover) .control{border-color:var(--ha-radio-option-border-color-hover,var(--ha-radio-option-border-color,var(--ha-color-border-neutral-loud)));background-color:var(--ha-radio-option-background-color-hover,var(--ha-color-fill-neutral-quiet-hover))}:host([aria-checked=true]) .control{background-color:var(--ha-radio-option-checked-background-color,var(--ha-color-fill-primary-normal-resting));color:var(--checked-icon-color);border-color:var(--checked-icon-color)}[part~=label]{display:inline-flex;align-items:center;cursor:pointer}:host([disabled]) [part~=label]{cursor:not-allowed}`]}}l=(0,i.Cg)([(0,r.EM)("ha-radio-option")],l)},76901(e,t,a){a.a(e,async function(e,i){try{a.r(t);var o=a(62826),s=a(5124),r=a(22441),l=a(1087),n=a(64138),d=(a(64013),a(92677),a(856)),h=a(91485),c=a(70407),p=a(14503),u=e([n,d,h]);[n,d,h]=u.then?(await u)():u;const v={select:{mode:"dropdown",translation_key:"sensor_unit_of_measurement",custom_value:!0,sort:!0,options:c.e}};class g extends s.WF{set item(e){this._item=e,e?(this._name=e.name||"",this._icon=e.icon||"",this._max=e.max??100,this._min=e.min??0,this._mode=e.mode||"slider",this._step=e.step??1,this._unit_of_measurement=e.unit_of_measurement):(this._item={min:0,max:100},this._name="",this._icon="",this._max=100,this._min=0,this._mode="slider",this._step=1)}focus(){this.updateComplete.then(()=>this._focusElement?.focus())}render(){return this.hass?s.qy` <div class="form"> <ha-input .value="${this._name}" .configValue="${"name"}" @input="${this._valueChanged}" .label="${this.hass.localize("ui.dialogs.helper_settings.generic.name")}" auto-validate required .validationMessage="${this.hass.localize("ui.dialogs.helper_settings.required_error_msg")}" dialogInitialFocus .disabled="${this.disabled}"></ha-input> <ha-icon-picker .value="${this._icon}" .configValue="${"icon"}" @value-changed="${this._valueChanged}" .label="${this.hass.localize("ui.dialogs.helper_settings.generic.icon")}" .disabled="${this.disabled}"></ha-icon-picker> <ha-input .value="${void 0!==this._min?String(this._min):""}" .configValue="${"min"}" type="number" step="any" @input="${this._valueChanged}" .label="${this.hass.localize("ui.dialogs.helper_settings.input_number.min")}" .disabled="${this.disabled}"></ha-input> <ha-input .value="${void 0!==this._max?String(this._max):""}" .configValue="${"max"}" type="number" step="any" @input="${this._valueChanged}" .label="${this.hass.localize("ui.dialogs.helper_settings.input_number.max")}" .disabled="${this.disabled}"></ha-input> <ha-radio-group orientation="horizontal" class="mode" .label="${this.hass.localize("ui.dialogs.helper_settings.input_number.mode")}" .value="${this._mode}" .disabled="${this.disabled}" name="mode" @change="${this._modeChanged}"> <ha-radio-option value="slider"> ${this.hass.localize("ui.dialogs.helper_settings.input_number.slider")} </ha-radio-option> <ha-radio-option value="box"> ${this.hass.localize("ui.dialogs.helper_settings.input_number.box")} </ha-radio-option> </ha-radio-group> <ha-input .value="${void 0!==this._step?String(this._step):""}" .configValue="${"step"}" type="number" step="any" @input="${this._valueChanged}" .label="${this.hass.localize("ui.dialogs.helper_settings.input_number.step")}" .disabled="${this.disabled}"></ha-input> <ha-selector-select .hass="${this.hass}" .label="${this.hass.localize("ui.dialogs.helper_settings.input_number.unit_of_measurement")}" .selector="${v}" .disabled="${this.disabled}" .value="${this._unit_of_measurement||""}" .configValue="${"unit_of_measurement"}" @value-changed="${this._valueChanged}"> </ha-selector-select> </div> `:s.s6}_modeChanged(e){(0,l.r)(this,"value-changed",{value:{...this._item,mode:e.currentTarget.value}})}_valueChanged(e){if(!this.new&&!this._item)return;e.stopPropagation();const t=e.target,a=t.configValue,i="number"===t.type?Number(t.value):e.detail?.value||t.value;if(this[`_${a}`]===i)return;const o={...this._item};void 0===i||""===i?delete o[a]:o[a]=i,(0,l.r)(this,"value-changed",{value:o})}static get styles(){return[p.RF,s.AH`.form{color:var(--primary-text-color)}ha-input{--ha-input-padding-bottom:0}ha-icon-picker,ha-input:not([required]){display:block;margin-bottom:var(--ha-space-5);--ha-input-padding-bottom:0}.mode{margin-bottom:var(--ha-space-4)}`]}constructor(...e){super(...e),this.new=!1,this.disabled=!1}}(0,o.Cg)([(0,r.MZ)({attribute:!1})],g.prototype,"hass",void 0),(0,o.Cg)([(0,r.MZ)({type:Boolean})],g.prototype,"new",void 0),(0,o.Cg)([(0,r.MZ)({type:Boolean})],g.prototype,"disabled",void 0),(0,o.Cg)([(0,r.wk)()],g.prototype,"_name",void 0),(0,o.Cg)([(0,r.wk)()],g.prototype,"_icon",void 0),(0,o.Cg)([(0,r.wk)()],g.prototype,"_max",void 0),(0,o.Cg)([(0,r.wk)()],g.prototype,"_min",void 0),(0,o.Cg)([(0,r.wk)()],g.prototype,"_mode",void 0),(0,o.Cg)([(0,r.wk)()],g.prototype,"_step",void 0),(0,o.Cg)([(0,r.wk)()],g.prototype,"_unit_of_measurement",void 0),(0,o.Cg)([(0,r.P)("[dialogInitialFocus]")],g.prototype,"_focusElement",void 0),g=(0,o.Cg)([(0,r.EM)("ha-input_number-form")],g),i()}catch(e){i(e)}})}};