Mike Phares
127634f5ab
Back to .net8.0 api/v4/InfinityQS ApiExplorerSettings Wafer Counter Color Sorting
2 lines
3.2 KiB
JavaScript
2 lines
3.2 KiB
JavaScript
import{r as i,c as t,h as e}from"./p-5308bbce.js";const s=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{display:inline-block}.left-icon,.right-icon,.left-text,.right-text,.percentage-display{font-size:0.875rem;color:#575352;margin-left:8px}.left-icon.disabled,.right-icon.disabled,.left-text.disabled,.right-text.disabled,.percentage-display.disabled{color:#BFBBBB}.left-icon,.left-text{margin-right:8px}.right-icon,.right-text,.percentage-display{margin-left:8px}.ifx-slider{display:flex;align-items:center;padding:2px 16px;border-radius:9999px}.ifx-slider input[type=range]{-webkit-appearance:none;width:100%;height:4px;background:linear-gradient(to right, #0A8276 0%, #0A8276 var(--value-percent, 0%), #EEEDED var(--value-percent, 0%), #EEEDED 100%);outline:none;cursor:pointer;transition:0.2s}.ifx-slider input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#0A8276;cursor:pointer;box-shadow:0px 1px 2px rgba(0, 0, 0, 0.2)}.ifx-slider input[type=range]:not(:disabled)::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;background:#0A8276;border-radius:50%;cursor:pointer;transition:box-shadow 0.2s}.ifx-slider input[type=range]:not(:disabled)::-webkit-slider-thumb:hover{background:#08665C}.ifx-slider input[type=range]:not(:disabled)::-webkit-slider-thumb:active{background:#06534B}.ifx-slider input[type=range]:disabled{background:#BFBBBB;cursor:default}.ifx-slider input[type=range]:disabled::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;background:#BFBBBB;border-radius:50%;cursor:default}';const a=class{constructor(e){i(this,e);this.ifxChange=t(this,"ifxChange",7);this.min=0;this.max=100;this.value=0;this.disabled=false;this.showPercentage=false;this.leftIcon=undefined;this.rightIcon=undefined;this.leftText=undefined;this.rightText=undefined;this.internalValue=0}valueChanged(i){this.internalValue=i;this.updateValuePercent()}handleInputChange(i){const t=i.target;this.internalValue=parseInt(t.value);this.ifxChange.emit(this.internalValue);this.updateValuePercent()}updateValuePercent(){if(this.inputRef){const i=(this.internalValue-this.min)/(this.max-this.min)*100;this.inputRef.style.setProperty("--value-percent",`${i}%`)}}componentWillLoad(){this.internalValue=this.value}componentDidLoad(){this.updateValuePercent()}render(){return e("div",{class:"ifx-slider"},this.leftText&&e("span",{class:`left-text`},this.leftText),this.leftIcon&&e("ifx-icon",{icon:this.leftIcon,class:`left-icon${this.disabled?" disabled":""}`}),e("input",{type:"range",min:this.min,max:this.max,disabled:this.disabled,value:this.internalValue,ref:i=>this.inputRef=i,onInput:i=>this.handleInputChange(i),"aria-label":"a slider","aria-value":this.value,"aria-disabled":this.disabled}),this.rightIcon&&e("ifx-icon",{icon:this.rightIcon,class:`right-icon${this.disabled?" disabled":""}`}),this.rightText&&e("span",{class:`right-text${this.disabled?" disabled":""}`},this.rightText),this.showPercentage&&e("span",{class:`percentage-display${this.disabled?" disabled":""}`},this.internalValue,"%"))}static get watchers(){return{value:["valueChanged"]}}};a.style=s;export{a as ifx_slider};
|
|
//# sourceMappingURL=p-fbb504f5.entry.js.map
|