@openremote/or-attribute-picker 1.4.0-snapshot.20250314091541 → 1.4.0-snapshot.20250317153938
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/umd/index.js +42 -42
- package/dist/umd/index.orbundle.js +43 -43
- package/package.json +6 -6
package/dist/umd/index.js
CHANGED
|
@@ -260,9 +260,9 @@
|
|
|
260
260
|
.mdc-list-item__graphic > or-icon {
|
|
261
261
|
pointer-events: none;
|
|
262
262
|
}
|
|
263
|
-
`;let Qi=class extends gt{constructor(){super(...arguments),this.readonly=!1,this.required=!1,this.checked=!1,this.indeterminate=!1,this.multiple=!1,this.searchLabel="search",this.compact=!1,this.comfortable=!1,this.raised=!1,this.action=!1,this.unElevated=!1,this.outlined=!1,this.rounded=!1,this.disableSliderNumberInput=!1,this.fullWidth=!1,this.helperPersistent=!1,this.autoValidate=!1,this.charCounter=!1,this.disabled=!1,this.continuous=!1,this.resizeVertical=!1,this._selectedIndex=-1,this.isUiValid=!0}static get styles(){return[h`${f(Di)}`,h`${f(Ri)}`,h`${f(Ni)}`,h`${f(zi)}`,h`${f(Mi)}`,h`${f(Pi)}`,h`${f(Fi)}`,h`${f($i)}`,h`${f(Hi)}`,h`${f(Bi)}`,h`${f(Vi)}`,h`${f(Ui)}`,h`${f(Xi)}`,h`${f(ji)}`,h`${f(Yi)}`,h`${f(Gi)}`,Ji]}get nativeValue(){if(this._mdcComponent)return this._mdcComponent.value}disconnectedCallback(){var t,e;super.disconnectedCallback(),this._mdcComponent&&(this._mdcComponent.destroy(),this._mdcComponent=void 0,null===(t=this._menuObserver)||void 0===t||t.disconnect()),this._mdcComponent2&&(this._mdcComponent2.destroy(),this._mdcComponent2=void 0,null===(e=this._menuObserver)||void 0===e||e.disconnect())}shouldUpdate(t){return t.has("indeterminate")&&this._mdcComponent&&this.type===Ki.CHECKBOX&&(this._mdcComponent.indeterminate=this.indeterminate),t.has("disabled")&&(this._mdcComponent&&(this._mdcComponent.disabled=this.disabled),this.type===Ki.RANGE&&this._mdcComponent2&&(this._mdcComponent2.disabled=this.disabled)),t.has("readonly")&&(this._mdcComponent&&(this._mdcComponent.readonly=this.readonly),this.type===Ki.RANGE&&this._mdcComponent2&&(this._mdcComponent2.readonly=this.readonly)),!this.type&&this.value&&(this.value instanceof Date?this.type=Ki.DATETIME:"boolean"==typeof this.value?this.type=Ki.CHECKBOX:"number"==typeof this.value?this.type=Ki.NUMBER:"string"==typeof this.value?this.type=Ki.TEXT:this.type=Ki.JSON),!0}focus(){this.type===Ki.RANGE&&this._mdcComponent2?this._mdcComponent2.focus():this._mdcComponent&&"function"==typeof this._mdcComponent.focus&&this._mdcComponent.focus()}render(){if(this.type){const
|
|
263
|
+
`;let Qi=class extends gt{constructor(){super(...arguments),this.readonly=!1,this.required=!1,this.checked=!1,this.indeterminate=!1,this.multiple=!1,this.searchLabel="search",this.compact=!1,this.comfortable=!1,this.raised=!1,this.action=!1,this.unElevated=!1,this.outlined=!1,this.rounded=!1,this.disableSliderNumberInput=!1,this.fullWidth=!1,this.helperPersistent=!1,this.autoValidate=!1,this.charCounter=!1,this.disabled=!1,this.continuous=!1,this.resizeVertical=!1,this._selectedIndex=-1,this.isUiValid=!0}static get styles(){return[h`${f(Di)}`,h`${f(Ri)}`,h`${f(Ni)}`,h`${f(zi)}`,h`${f(Mi)}`,h`${f(Pi)}`,h`${f(Fi)}`,h`${f($i)}`,h`${f(Hi)}`,h`${f(Bi)}`,h`${f(Vi)}`,h`${f(Ui)}`,h`${f(Xi)}`,h`${f(ji)}`,h`${f(Yi)}`,h`${f(Gi)}`,Ji]}get nativeValue(){if(this._mdcComponent)return this._mdcComponent.value}disconnectedCallback(){var t,e;super.disconnectedCallback(),this._mdcComponent&&(this._mdcComponent.destroy(),this._mdcComponent=void 0,null===(t=this._menuObserver)||void 0===t||t.disconnect()),this._mdcComponent2&&(this._mdcComponent2.destroy(),this._mdcComponent2=void 0,null===(e=this._menuObserver)||void 0===e||e.disconnect())}shouldUpdate(t){return t.has("indeterminate")&&this._mdcComponent&&this.type===Ki.CHECKBOX&&(this._mdcComponent.indeterminate=this.indeterminate),t.has("disabled")&&(this._mdcComponent&&(this._mdcComponent.disabled=this.disabled),this.type===Ki.RANGE&&this._mdcComponent2&&(this._mdcComponent2.disabled=this.disabled)),t.has("readonly")&&(this._mdcComponent&&(this._mdcComponent.readonly=this.readonly),this.type===Ki.RANGE&&this._mdcComponent2&&(this._mdcComponent2.readonly=this.readonly)),!this.type&&this.value&&(this.value instanceof Date?this.type=Ki.DATETIME:"boolean"==typeof this.value?this.type=Ki.CHECKBOX:"number"==typeof this.value?this.type=Ki.NUMBER:"string"==typeof this.value?this.type=Ki.TEXT:this.type=Ki.JSON),!0}focus(){this.type===Ki.RANGE&&this._mdcComponent2?this._mdcComponent2.focus():this._mdcComponent&&"function"==typeof this._mdcComponent.focus&&this._mdcComponent.focus()}render(){var t;if(this.type){const e=!this.fullWidth&&this.label;let n=!this.fullWidth&&this.outlined,i=!!this.helperText;const r=!(this.isUiValid||!this.errorMessage&&!this.validationMessage),o={"mdc-text-field-helper-text--persistent":!r&&this.helperPersistent,"mdc-text-field-helper-text--validation-msg":r},a=null!==this.value&&void 0!==this.value||!1===this.value;let l=e?K`<span class="mdc-floating-label ${a?"mdc-floating-label--float-above":""}" id="label">${this.label}</span>`:void 0;switch(this.type){case Ki.RADIO:const e=this.resolveOptions(this.options);return this._selectedIndex=-1,K`
|
|
264
264
|
<div class="mdc-radio-container">
|
|
265
|
-
${
|
|
265
|
+
${e?e.map((([t,e],n)=>(this.value===t&&(this._selectedIndex=n),K`
|
|
266
266
|
<div id="field" class="mdc-form-field">
|
|
267
267
|
<div class="mdc-radio">
|
|
268
268
|
<input type="radio"
|
|
@@ -285,10 +285,10 @@
|
|
|
285
285
|
|
|
286
286
|
`))):""}
|
|
287
287
|
</div>
|
|
288
|
-
`;case Ki.SWITCH:const
|
|
288
|
+
`;case Ki.SWITCH:const d={"mdc-switch--disabled":this.disabled||this.readonly,"mdc-switch--full-width":this.fullWidth,"mdc-switch--checked":this.value};return K`
|
|
289
289
|
<span id="wrapper">
|
|
290
290
|
${this.label?K`<label for="elem" class="${this.disabled?"mdc-switch--disabled":""}">${this.label}</label>`:""}
|
|
291
|
-
<div id="component" class="mdc-switch ${Ot(
|
|
291
|
+
<div id="component" class="mdc-switch ${Ot(d)}">
|
|
292
292
|
<div class="mdc-switch__track"></div>
|
|
293
293
|
<div class="mdc-switch__thumb-underlay">
|
|
294
294
|
<div class="mdc-switch__thumb">
|
|
@@ -302,23 +302,23 @@
|
|
|
302
302
|
</div>
|
|
303
303
|
</div>
|
|
304
304
|
</span>
|
|
305
|
-
`;case Ki.LIST:const
|
|
306
|
-
<div id="component" class="mdc-list mdc-select ${Ot(
|
|
305
|
+
`;case Ki.LIST:const c={"mdc-select--outlined":n,"mdc-select--disabled":this.disabled,"mdc-select--required":this.required,"mdc-select--dense":!1,"mdc-select--no-label":!this.label,"mdc-select--with-leading-icon":!!this.icon},s=this.resolveOptions(this.options);return this._selectedIndex=-1,K`
|
|
306
|
+
<div id="component" class="mdc-list mdc-select ${Ot(c)}" @MDCList:action="${t=>this.onValueChange(void 0,-1===t.detail.index?void 0:Array.isArray(this.options[t.detail.index])?this.options[t.detail.index][0]:this.options[t.detail.index])}">
|
|
307
307
|
<ul class="mdc-list">
|
|
308
|
-
${
|
|
308
|
+
${s?s.map((([t,e],n)=>(this.value===t&&(this._selectedIndex=n),K`<li class="${Ot({"mdc-list-item":!0,"mdc-list-item--selected":this.value===t})}" role="option" data-value="${t}"><or-translate value="${e}"></or-translate></li>`))):""}
|
|
309
309
|
</ul>
|
|
310
310
|
</div>
|
|
311
|
-
`;case Ki.SELECT:const
|
|
311
|
+
`;case Ki.SELECT:const m={"mdc-select--outlined":n,"mdc-select--filled":!n,"mdc-select--disabled":this.disabled||this.readonly,"mdc-select--required":this.required,"mdc-select--dense":!1,"dense-comfortable":this.comfortable,"mdc-select--no-label":!this.label,"mdc-select--with-leading-icon":!!this.icon,"or-mwc-input--rounded":this.rounded};let p;p=null!=this.searchProvider?this.searchProvider(this.searchableValue):this.resolveOptions(this.options);const u=(t,e)=>{var n;const i=e.value;if(this.multiple){t.stopPropagation();const e=null!==(n=this._tempValue)&&void 0!==n?n:Array.isArray(this.value)?[...this.value]:void 0!==this.value?[this.value]:[],r=e.findIndex((t=>t===i));r>=0?e.splice(r,1):e.push(i);const o=t.composedPath()[0].closest("li"),a=o.getElementsByTagName("or-icon")[0];o&&(r>=0?o.classList.remove("mdc-list-item--selected"):o.classList.add("mdc-list-item--selected")),a&&(a.icon=r>=0?"checkbox-blank-outline":"checkbox-marked"),this._tempValue=e}else null==this.searchProvider&&Array.isArray(p)||this.onValueChange(void 0,e.value)},f=()=>{var t;const e=null!==(t=this._tempValue)&&void 0!==t?t:this.value;if(window.setTimeout((()=>{this._mdcComponent&&this._mdcComponent.foundation.adapter.floatLabel(e&&(!Array.isArray(e)||e.length>0))})),!this._tempValue)return;const n=[...this._tempValue];this._tempValue=void 0,this.onValueChange(void 0,n)},h=t=>null==this.searchProvider||t&&0!=t.length?Ci(this.multiple?Ei.MULTI_TICK:Ei.SELECT,K`${null==t?void 0:t.map((([t,e],n)=>Ti({text:e,value:t},n,Array.isArray(this.value)?this.value:this.value?[this.value]:[],this.multiple?Ei.MULTI_TICK:Ei.SELECT,!1,u)))}`,!1,void 0):K`<span class="mdc-text-field-helper-line" style="margin: 8px 8px 8px 0;">${_t.i18next.t("noResults")}</span>`;return K`
|
|
312
312
|
<div id="component"
|
|
313
|
-
class="mdc-select ${Ot(
|
|
314
|
-
@MDCSelect:change="${t=>Li(this,void 0,void 0,(function*(){const e=Array.isArray(
|
|
313
|
+
class="mdc-select ${Ot(m)}"
|
|
314
|
+
@MDCSelect:change="${t=>Li(this,void 0,void 0,(function*(){const e=Array.isArray(p)?p:yield p;this.onValueChange(void 0,-1===t.detail.index?void 0:Array.isArray(e[t.detail.index])?e[t.detail.index][0]:e[t.detail.index])}))}">
|
|
315
315
|
<div class="mdc-select__anchor" role="button"
|
|
316
316
|
aria-haspopup="listbox"
|
|
317
317
|
aria-expanded="false"
|
|
318
318
|
aria-disabled="${""+(this.disabled||this.readonly)}"
|
|
319
319
|
aria-labelledby="label selected-text">
|
|
320
|
-
${
|
|
321
|
-
${
|
|
320
|
+
${n?void 0:K`<span class="mdc-select__ripple"></span>`}
|
|
321
|
+
${n?this.renderOutlined(l):l}
|
|
322
322
|
<span class="mdc-select__selected-text-container">
|
|
323
323
|
<span id="selected-text" class="mdc-select__selected-text"></span>
|
|
324
324
|
</span>
|
|
@@ -340,9 +340,9 @@
|
|
|
340
340
|
</polygon>
|
|
341
341
|
</svg>
|
|
342
342
|
</span>
|
|
343
|
-
${
|
|
343
|
+
${n?"":K`<div class="mdc-line-ripple"></div>`}
|
|
344
344
|
</div>
|
|
345
|
-
<div id="mdc-select-menu" class="mdc-select__menu mdc-menu mdc-menu-surface mdc-menu-surface--fixed ${null!=this.searchProvider?"mdc-menu__searchable":void 0}" @MDCMenuSurface:closed="${
|
|
345
|
+
<div id="mdc-select-menu" class="mdc-select__menu mdc-menu mdc-menu-surface mdc-menu-surface--fixed ${null!=this.searchProvider?"mdc-menu__searchable":void 0}" @MDCMenuSurface:closed="${f}">
|
|
346
346
|
${Rt(null!=this.searchProvider,(()=>K`
|
|
347
347
|
<label id="select-searchable" class="mdc-text-field mdc-text-field--filled">
|
|
348
348
|
<span class="mdc-floating-label" style="color: rgba(0, 0, 0, 0.6); text-transform: capitalize; visibility: ${this.searchableValue?"hidden":"visible"}" id="my-label-id">
|
|
@@ -353,11 +353,11 @@
|
|
|
353
353
|
/>
|
|
354
354
|
</label>
|
|
355
355
|
`))}
|
|
356
|
-
${Rt(Array.isArray(
|
|
356
|
+
${Rt(Array.isArray(p),(()=>h(p)),(()=>Pt(new Promise((t=>Li(this,void 0,void 0,(function*(){t(h(yield p))})))),K`<span class="mdc-text-field-helper-line" style="margin: 8px 8px 8px 0;">${_t.i18next.t("loading")}</span>`)))}
|
|
357
357
|
</div>
|
|
358
|
-
${
|
|
359
|
-
<p id="component-helper-text" class="mdc-select-helper-text ${Ot(
|
|
360
|
-
${
|
|
358
|
+
${i||r?K`
|
|
359
|
+
<p id="component-helper-text" class="mdc-select-helper-text ${Ot(o)}" aria-hidden="true">
|
|
360
|
+
${r?this.errorMessage||this.validationMessage:this.helperText}
|
|
361
361
|
</p>`:""}
|
|
362
362
|
</div>
|
|
363
363
|
`;case Ki.BUTTON_TOGGLE:return K`
|
|
@@ -379,9 +379,9 @@
|
|
|
379
379
|
${this.label?K`<span class="${this.action?"mdc-fab__label":"mdc-button__label"}"><or-translate .value="${this.label}"></or-translate></span>`:""}
|
|
380
380
|
${!r&&this.iconTrailing?K`<or-icon class="${this.action?"mdc-fab__icon":"mdc-button__icon"}" aria-hidden="true" icon="${this.iconTrailing}"></or-icon>`:""}
|
|
381
381
|
</button>
|
|
382
|
-
`}case Ki.CHECKBOX_LIST:Array.isArray(this.value)||(null===this.value||void 0===this.value?this.value=[]:this.value=[this.value]);const
|
|
382
|
+
`}case Ki.CHECKBOX_LIST:Array.isArray(this.value)||(null===this.value||void 0===this.value?this.value=[]:this.value=[this.value]);const g=this.resolveOptions(this.options);return this._selectedIndex=-1,K`
|
|
383
383
|
<div class="mdc-checkbox-list">
|
|
384
|
-
${
|
|
384
|
+
${g?g.map((([t,e],n)=>(this.value===t&&(this._selectedIndex=n),K`
|
|
385
385
|
<div id="field" class="mdc-form-field">
|
|
386
386
|
<div id="component" class="mdc-checkbox">
|
|
387
387
|
<input type="checkbox"
|
|
@@ -399,9 +399,9 @@
|
|
|
399
399
|
|
|
400
400
|
`))):""}
|
|
401
401
|
</div>
|
|
402
|
-
`;case Ki.CHECKBOX:let
|
|
402
|
+
`;case Ki.CHECKBOX:let b={"mdc-checkbox":!0,"mdc-checkbox--disabled":this.disabled||this.readonly};return K`
|
|
403
403
|
<div id="field" class="mdc-form-field">
|
|
404
|
-
<div id="component" class="${Ot(
|
|
404
|
+
<div id="component" class="${Ot(b)}">
|
|
405
405
|
<input type="checkbox"
|
|
406
406
|
id="elem"
|
|
407
407
|
data-indeterminate="${this.indeterminate}"
|
|
@@ -429,41 +429,41 @@
|
|
|
429
429
|
/>
|
|
430
430
|
<label style="margin-left: 10px; cursor: pointer" for="elem">${this.label}</label>
|
|
431
431
|
</div>
|
|
432
|
-
`;case Ki.NUMBER:case Ki.RANGE:case Ki.DATE:case Ki.DATETIME:case Ki.TIME:case Ki.MONTH:case Ki.WEEK:case Ki.EMAIL:case Ki.PASSWORD:case Ki.TELEPHONE:case Ki.URL:case Ki.TEXT:case Ki.TEXTAREA:case Ki.JSON:case Ki.JSON_OBJECT:{let
|
|
432
|
+
`;case Ki.NUMBER:case Ki.RANGE:case Ki.DATE:case Ki.DATETIME:case Ki.TIME:case Ki.MONTH:case Ki.WEEK:case Ki.EMAIL:case Ki.PASSWORD:case Ki.TELEPHONE:case Ki.URL:case Ki.TEXT:case Ki.TEXTAREA:case Ki.JSON:case Ki.JSON_OBJECT:{let e,d=[void 0===this.value||null===this.value?void 0:this.value,this.min,this.max];if(d.some((t=>"string"!=typeof t)))if(this.type===Ki.JSON||this.type===Ki.JSON_OBJECT)if(void 0!==d[0]){if("string"!=typeof d[0]||null===d[0])try{d[0]=JSON.stringify(d[0],null,2)}catch(t){console.warn("Failed to parse JSON expression for input control"),d[0]=""}}else d[0]="";else{const e=this.format?Object.assign({},this.format):{};switch(this.type){case Ki.TIME:e.asDate=!0,e.hour12=!1,e.timeStyle=this.step&&this.step<60?"medium":"short";break;case Ki.DATE:e.asDate=!0,e.momentJsFormat="YYYY-MM-DD";break;case Ki.WEEK:e.asDate=!0,e.momentJsFormat="YYYY-[W]WW";break;case Ki.MONTH:e.asDate=!0,e.momentJsFormat="YYYY-MM";break;case Ki.DATETIME:e.asDate=!0,e.momentJsFormat="YYYY-MM-DDTHH:mm";break;case Ki.NUMBER:null!==(t=e.maximumFractionDigits)&&void 0!==t||(e.maximumFractionDigits=20)}e.useGrouping=!1,d=d.map((t=>void 0!==t?hi.Util.getValueAsString(t,(()=>e),"en-GB"):void 0))}let c=this.label,s=this.type,m="component";if(this.type===Ki.RANGE&&(c=void 0,n=!1,i=!1,s=Ki.NUMBER,m="number"),this.type!==Ki.RANGE||!this.disableSliderNumberInput){const t={"mdc-text-field":!0,"mdc-text-field--invalid":!this.valid,"mdc-text-field--filled":!n,"mdc-text-field--outlined":n,"mdc-text-field--textarea":s===Ki.TEXTAREA||s===Ki.JSON||s===Ki.JSON_OBJECT,"mdc-text-field--disabled":this.disabled,"mdc-text-field--fullwidth":this.fullWidth&&!n,"dense-comfortable":this.comfortable&&!(s===Ki.TEXTAREA||s===Ki.JSON||s===Ki.JSON_OBJECT),"dense-compact":!this.comfortable&&this.compact,"mdc-text-field--label-floating":a,"mdc-text-field--no-label":!this.label,"mdc-text-field--with-leading-icon":!!this.icon,"mdc-text-field--with-trailing-icon":!!this.iconTrailing,"or-mwc-input--rounded":this.rounded};e=s===Ki.TEXTAREA||s===Ki.JSON||s===Ki.JSON_OBJECT?K`
|
|
433
433
|
<textarea id="elem" class="mdc-text-field__input ${this.resizeVertical?"resize-vertical":""}" ?required="${this.required}"
|
|
434
434
|
?readonly="${this.readonly}" ?disabled="${this.disabled}" minlength="${Lt(this.minLength)}"
|
|
435
435
|
maxlength="${Lt(this.maxLength)}" rows="${this.rows?this.rows:5}"
|
|
436
|
-
cols="${Lt(this.cols)}" aria-label="${Lt(
|
|
437
|
-
aria-labelledby="${Lt(
|
|
438
|
-
@change="${t=>this.onValueChange(t.target,t.target.value)}">${
|
|
439
|
-
<input type="${
|
|
436
|
+
cols="${Lt(this.cols)}" aria-label="${Lt(c)}"
|
|
437
|
+
aria-labelledby="${Lt(c?"label":void 0)}"
|
|
438
|
+
@change="${t=>this.onValueChange(t.target,t.target.value)}">${d[0]?d[0]:""}</textarea>`:K`
|
|
439
|
+
<input type="${s}" id="elem" aria-labelledby="${Lt(c?"label":void 0)}"
|
|
440
440
|
class="mdc-text-field__input" ?required="${this.required}" ?readonly="${this.readonly}"
|
|
441
|
-
?disabled="${this.disabled}" min="${Lt(
|
|
441
|
+
?disabled="${this.disabled}" min="${Lt(d[1])}" max="${Lt(d[2])}"
|
|
442
442
|
step="${this.step?this.step:"any"}" minlength="${Lt(this.minLength)}" pattern="${Lt(this.pattern)}"
|
|
443
443
|
maxlength="${Lt(this.maxLength)}" placeholder="${Lt(this.placeHolder)}"
|
|
444
|
-
.value="${null!==
|
|
444
|
+
.value="${null!==d[0]&&void 0!==d[0]?d[0]:""}"
|
|
445
445
|
@keydown="${t=>{"Enter"!==t.code&&"NumpadEnter"!==t.code||this.onValueChange(t.target,t.target.value,!0)}}"
|
|
446
446
|
@blur="${t=>{""===t.target.value&&this.reportValidity()}}"
|
|
447
|
-
@change="${t=>this.onValueChange(t.target,t.target.value)}" />`,
|
|
448
|
-
<label id="${
|
|
447
|
+
@change="${t=>this.onValueChange(t.target,t.target.value)}" />`,e=K`
|
|
448
|
+
<label id="${m}" class="${Ot(t)}">
|
|
449
449
|
${this.icon?K`<or-icon class="mdc-text-field__icon mdc-text-field__icon--leading" style="color: ${this.iconColor?"#"+this.iconColor:"unset"}" aria-hidden="true" icon="${this.icon}"></or-icon>`:""}
|
|
450
|
-
${
|
|
451
|
-
${
|
|
452
|
-
${
|
|
453
|
-
${
|
|
450
|
+
${n?"":K`<span class="mdc-text-field__ripple"></span>`}
|
|
451
|
+
${e}
|
|
452
|
+
${n?this.renderOutlined(l):l}
|
|
453
|
+
${n?"":K`<span class="mdc-line-ripple"></span>`}
|
|
454
454
|
${this.iconTrailing?K`<or-icon class="mdc-text-field__icon mdc-text-field__icon--trailing" aria-hidden="true" icon="${this.iconTrailing}"></or-icon>`:""}
|
|
455
455
|
</label>
|
|
456
|
-
${
|
|
456
|
+
${i||r?K`
|
|
457
457
|
<div class="mdc-text-field-helper-line">
|
|
458
|
-
<div class="mdc-text-field-helper-text ${Ot(
|
|
458
|
+
<div class="mdc-text-field-helper-text ${Ot(o)}">${r?this.errorMessage||this.validationMessage:this.helperText}</div>
|
|
459
459
|
${this.charCounter&&!this.readonly?K`<div class="mdc-text-field-character-counter"></div>`:""}
|
|
460
460
|
</div>
|
|
461
461
|
`:""}
|
|
462
|
-
`}if(this.type===Ki.RANGE){const
|
|
462
|
+
`}if(this.type===Ki.RANGE){const t={"mdc-slider":!0,"mdc-slider--range":this.continuous,"mdc-slider--discreet":!this.continuous,"mdc-slider--disabled":this.disabled||this.readonly};e=K`
|
|
463
463
|
<span id="wrapper">
|
|
464
464
|
${this.label?K`<label for="component" class="${this.disabled?"mdc-switch--disabled":""}">${this.label}</label>`:""}
|
|
465
|
-
<div id="component" class="${Ot(
|
|
466
|
-
<input id="elem" class="mdc-slider__input" type="range" min="${Lt(
|
|
465
|
+
<div id="component" class="${Ot(t)}" @MDCSlider:change="${t=>this.onValueChange(void 0,t.detail.value)}">
|
|
466
|
+
<input id="elem" class="mdc-slider__input" type="range" min="${Lt(d[1])}" max="${Lt(d[2])}" value="${d[0]||d[1]||0}" name="slider" step="${this.step||1}" ?readonly="${this.readonly}" ?disabled="${this.disabled}" aria-label="${Lt(this.label)}" />
|
|
467
467
|
<div class="mdc-slider__track">
|
|
468
468
|
<div class="mdc-slider__track--inactive"></div>
|
|
469
469
|
<div class="mdc-slider__track--active">
|
|
@@ -481,9 +481,9 @@
|
|
|
481
481
|
<div class="mdc-slider__thumb-knob"></div>
|
|
482
482
|
</div>
|
|
483
483
|
</div>
|
|
484
|
-
${
|
|
484
|
+
${e?K`<div style="min-width: 70px; width: 70px;">${e}</div>`:""}
|
|
485
485
|
</span>
|
|
486
|
-
`}return
|
|
486
|
+
`}return e}}}return K`<span>INPUT TYPE NOT IMPLEMENTED</span>`}_getFormat(){if(this.format)return this.format}update(t){if(t.has("autoValidate")&&this._mdcComponent){const t=this._mdcComponent;t.foundation&&t.foundation.setValidateOnValueChange&&t.foundation.setValidateOnValueChange(this.autoValidate)}super.update(t)}firstUpdated(t){super.firstUpdated(t),this.autoValidate&&this.reportValidity()}updated(t){var e,n;if(super.updated(t),t.has("type")){const t=this.shadowRoot.getElementById("component");if(this._mdcComponent&&(this._mdcComponent.destroy(),this._mdcComponent=void 0),this._mdcComponent2&&(this._mdcComponent2.destroy(),this._mdcComponent2=void 0),t&&this.type){switch(this.type){case Ki.LIST:const e=new $n(t);this._mdcComponent=e,e.selectedIndex=this._selectedIndex;break;case Ki.SELECT:const n=new oi(t);this._mdcComponent=n,null!==this.value&&void 0!==this.value||(n.selectedIndex=-1),this.multiple&&(this._mdcComponent.foundation.adapter.getSelectedIndex=()=>{if(!Array.isArray(this.value)||0===this.value.length)return-1;const t=this.value[0];return this._mdcComponent.foundation.adapter.getMenuItemValues().indexOf(t)}),n.useDefaultValidation=!this.multiple,n.valid=!this.required||!this.multiple&&n.valid||this.multiple&&Array.isArray(this.value)&&this.value.length>0;const i=this.getSelectedTextValue();this._mdcComponent.foundation.adapter.setSelectedText(i),this._mdcComponent.foundation.adapter.floatLabel(!!i),this._menuObserver||(this._menuObserver=new IntersectionObserver(((t,e)=>{var n,i;t[0].target.style.minWidth!=(null===(n=t[0].target.parentElement)||void 0===n?void 0:n.clientWidth)+"px"&&(t[0].target.style.minWidth=(null===(i=t[0].target.parentElement)||void 0===i?void 0:i.clientWidth)+"px")})),this._menuObserver.observe(this.shadowRoot.getElementById("mdc-select-menu")));const r=void 0!==this.searchProvider,o=this.multiple;n.menu.menuSurface_.foundation.handleBodyClick=function(t){const e=t.composedPath()[0];if(this.adapter.isElementInContainer(e)){if(!r)return;if(e instanceof Element&&!e.className.includes("mdc-list-item"))return;if(o)return}n.menu.menuSurface_.close()};break;case Ki.RADIO:case Ki.CHECKBOX_LIST:case Ki.COLOUR:break;case Ki.BUTTON:case Ki.BUTTON_MOMENTARY:const a=!this.action&&!this.label,l=new fe(t);a&&(l.unbounded=!0),this._mdcComponent=l;break;case Ki.BUTTON_TOGGLE:this._mdcComponent=new fi(t);break;case Ki.CHECKBOX:this._mdcComponent=new Ge(t);const d=this.shadowRoot.getElementById("field");if(d){const t=new ci(d);t.input=this._mdcComponent,this._mdcComponent2=t}break;case Ki.SWITCH:this._mdcComponent=new tn(t);break;case Ki.RANGE:this._mdcComponent=new _n(t);const c=this.shadowRoot.getElementById("number");if(c){const t=new Me(c);t.useNativeValidation=!1,this._mdcComponent2=t}break;default:const s=new Me(t);s.useNativeValidation=!1,this._mdcComponent=s}this._mdcComponent&&this.focused&&"function"==typeof this._mdcComponent.focus&&this._mdcComponent.focus()}}else{if(this.type===Ki.SELECT&&this._mdcComponent){t.has("options")&&this._mdcComponent.layoutOptions(),this._mdcComponent.disabled=!(!this.disabled&&!this.readonly),this._mdcComponent.useDefaultValidation=!this.multiple,this._mdcComponent.valid=!this.required||!this.multiple&&this._mdcComponent.valid||this.multiple&&Array.isArray(this.value)&&this.value.length>0;const e=this.getSelectedTextValue();this._mdcComponent.foundation.adapter.setSelectedText(e),this._mdcComponent.foundation.adapter.floatLabel(!!e)}else if(this.type===Ki.RANGE&&this._mdcComponent){const t=this._mdcComponent;t.setDisabled(this.disabled||this.readonly),t.setValue(this.value)}else if(this.type===Ki.SWITCH&&this._mdcComponent)this._mdcComponent.checked=this.value;else if(this.type===Ki.CHECKBOX&&this._mdcComponent){const t=this._mdcComponent;t.checked=!!this.value,t.disabled=!(!this.disabled&&!this.readonly)}this._mdcComponent&&(this._mdcComponent.required=!!this.required)}t.has("label")&&(null===(n=null===(e=this._mdcComponent)||void 0===e?void 0:e.layout)||void 0===n||n.call(e)),this.autoValidate&&this.reportValidity()}renderOutlined(t){return K`
|
|
487
487
|
<span class="mdc-notched-outline">
|
|
488
488
|
<span class="mdc-notched-outline__leading"></span>
|
|
489
489
|
${t?K`
|