@arcgis/map-components
Version:
ArcGIS Map Components
3 lines (2 loc) • 4.21 kB
JavaScript
/* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
import{h as n}from"./AKBXFBDL.js";import"./LMBRORN7.js";import"./PBSJQPB2.js";import{O as c,U as l,a as r,b as s}from"./WUJCCZQC.js";import"./3TTFCHAA.js";var h=r`:host{display:flex;flex:auto;padding-inline:var(--calcite-space-sm)}arcgis-slider{flex:auto}arcgis-ticks{--arcgis-ticks-font-size: var(--calcite-font-size--3);--arcgis-ticks-gap: var(--calcite-space-base)}.content-end-stack{display:flex;flex-direction:column;flex:1}.ticks-stack{height:var(--calcite-space-sm);position:relative}.ticks-stack arcgis-ticks{inset:var(--calcite-space-none);position:absolute}.label-ticks{--arcgis-ticks-tick-length: var(--calcite-space-2xs);--arcgis-ticks-tick-color: transparent}.minor-ticks{--arcgis-ticks-tick-length: var(--calcite-space-2xs)}.major-ticks{--arcgis-ticks-tick-length: var(--calcite-space-sm)}:host([layout="vertical"]){padding-inline:var(--calcite-space-none);width:var(--calcite-size-xl);arcgis-ticks{--arcgis-ticks-gap: var(--calcite-space-sm)}.content-end-stack{position:relative}.ticks-stack{height:100%}.label-ticks{inset:var(--calcite-space-none);position:absolute}}`,a=class extends c{constructor(){super(...arguments),this.autoDestroyDisabled=!1,this.canNext=!1,this.canPlay=!1,this.canPrevious=!1,this.disabled=!1,this.layout="horizontal",this.mirrored=!1,this.arcgisPropertyChange=n()("canNext","canPlay","canPrevious","currentValue")}static{this.properties={autoDestroyDisabled:5,canNext:5,canPlay:5,canPrevious:5,currentValue:9,disabled:5,labelFormatter:0,labels:0,layout:3,max:9,min:9,mirrored:5,steps:0,majorTicks:0,minorTicks:0}}static{this.styles=h}get _ascending(){return this.layout==="horizontal"&&!this.mirrored||this.layout==="vertical"&&this.mirrored}async destroy(){await this.manager.destroy()}reset(){this.currentValue=this._ascending?this.steps?.at(0):this.steps?.at(-1)}step(t){if(!this.steps||this.currentValue===void 0)return;let e=t==="next"===this._ascending?1:-1,i=this.steps.indexOf(this.currentValue)+e;i>=this.steps.length||i<0||(this.currentValue=this.steps[i],this._checkState())}connectedCallback(){super.connectedCallback(),this.el.hidden=!0}willUpdate(t){t.has("steps")&&this.steps?.length&&(this.min??=this.steps[0],this.max??=this.steps.at(-1)),(t.has("currentValue")||t.has("max"))&&this.max!==void 0&&(this.currentValue??=this.max),this.el.hidden=this.min===void 0||this.max===void 0||this.currentValue===void 0,this._checkState()}_checkState(){if(!this.steps?.length){this.canPlay=!1,this.canNext=!1,this.canPrevious=!1;return}this.canPlay=!0;let t=this.steps.findIndex(i=>i===this.currentValue),e=this.steps.length-1;this.canNext=this._ascending?t<e:t>0,this.canPrevious=this._ascending?t>0:t<e}_handleSliderChange(t){this.currentValue=t.currentTarget.values[0],this._checkState()}_handleSliderInput(t){this.currentValue=t.currentTarget.values[0],this._checkState()}render(){return this.currentValue===void 0?null:s`<arcgis-slider .disabled=${this.disabled} .layout=${this.layout} .min=${this.min} .max=${this.max} .steps=${this.steps} .mirrored=${this.mirrored} .values=${[this.currentValue]} =${t=>this._handleSliderInput(t)} =${t=>this._handleSliderChange(t)}>${(this.majorTicks?.length||this.minorTicks?.length||this.labels?.length)&&s`<div slot=content-end class="content-end-stack">${(this.majorTicks?.length||this.minorTicks?.length)&&s`<div class="ticks-stack">${this.majorTicks?.length&&s`<arcgis-ticks .layout=${this.layout} class="major-ticks" .min=${this.min} .max=${this.max} .mirrored=${this.mirrored} .values=${this.majorTicks} mode=value></arcgis-ticks>`||""}${this.minorTicks?.length&&s`<arcgis-ticks .layout=${this.layout} class="minor-ticks" .min=${this.min} .max=${this.max} .mirrored=${this.mirrored} .values=${this.minorTicks} mode=value></arcgis-ticks>`||""}</div>`||""}${this.labels?.length&&s`<arcgis-ticks .layout=${this.layout} class="label-ticks" .min=${this.min} .max=${this.max} .mirrored=${this.mirrored} .values=${this.labels} mode=value show-labels label-placement=end .labelFormatter=${this.labelFormatter}></arcgis-ticks>`||""}</div>`||""}</arcgis-slider>`}};l("arcgis-value-picker-slider",a);export{a as ArcgisValuePickerSlider};