UNPKG

@arcgis/core

Version:

ArcGIS Maps SDK for JavaScript: A complete 2D and 3D mapping and data visualization API

js.arcgis.com

3 lines (2 loc) • 36.8 kB
1
2
3
/* COPYRIGHT Esri - https://js.arcgis.com/5.0.19/LICENSE.txt */ import{__decorate as e}from"tslib";import{substitute as t}from"../intl.js";import i from"../core/Collection.js";import{deprecateWidget as n}from"../core/deprecate.js";import s from"../core/Logger.js";import{assertIsSome as o}from"../core/maybe.js";import{property as r,cast as a,subclass as l}from"../core/accessorSupport/decorators.js";import h from"./Widget.js";import{css as u}from"./Slider/css.js";import d from"./Slider/SliderViewModel.js";import{globalCss as c}from"./support/globalCss.js";import{messageBundle as m,tsx as _}from"./support/widget.js";import{onResize as p}from"./support/widgetUtils.js";const v={showInput:"Enter",hideInput1:"Enter",hideInput2:"Escape",hideInput3:"Tab",moveAnchorUp:"ArrowUp",moveAnchorDown:"ArrowDown",moveAnchorLeft:"ArrowLeft",moveAnchorRight:"ArrowRight",moveAnchorToMax:"End",moveAnchorToMin:"Home"},g={labels:!1,rangeLabels:!1};let f=class extends h{constructor(e,t){super(e,t),this._activeLabelInputIndex=null,this._anchorElements=[],this._dragged=!1,this._dragStartInfo=null,this._focusedAnchorIndex=null,this._isMinInputActive=!1,this._isMaxInputActive=!1,this._lastMovedHandleIndex=null,this._positionPrecision=5,this._segmentDragStartInfo=null,this._trackHeight=null,this._trackWidth=null,this._zIndices=[],this._zIndexOffset=3,this.disabled=!1,this.draggableSegmentsEnabled=!0,this.effectiveSegmentElements=new i,this.extraNodes=[],this.inputCreatedFunction=null,this.labelElements=new i,this.labelInputsEnabled=!1,this.maxLabelElement=null,this.messages=null,this.minLabelElement=null,this.rangeLabelInputsEnabled=!1,this.segmentElements=new i,this.snapOnClickEnabled=!0,this.steps=null,this.syncedSegmentsEnabled=!1,this.thumbCreatedFunction=null,this.thumbElements=new i,this.tickElements=new i,this.trackElement=null,this.viewModel=new d,this.visibleElements={...g},e?.suppressDeprecationWarning||n(s.getLogger(this),"Slider","arcgis-slider",{version:"5.0"}),this._onAnchorPointerDown=this._onAnchorPointerDown.bind(this),this._onAnchorPointerMove=this._onAnchorPointerMove.bind(this),this._onAnchorPointerUp=this._onAnchorPointerUp.bind(this),this._onLabelPointerDown=this._onLabelPointerDown.bind(this),this._onLabelPointerUp=this._onLabelPointerUp.bind(this),this._onSegmentPointerDown=this._onSegmentPointerDown.bind(this),this._onSegmentPointerMove=this._onSegmentPointerMove.bind(this),this._onSegmentPointerUp=this._onSegmentPointerUp.bind(this),this._onTrackPointerDown=this._onTrackPointerDown.bind(this),this._onTrackPointerMove=this._onTrackPointerMove.bind(this),this._onTrackPointerUp=this._onTrackPointerUp.bind(this)}normalizeCtorArgs(e={}){const{suppressDeprecationWarning:t,...i}=e;return i}destroy(){document.removeEventListener("pointerup",this._onLabelPointerUp),document.removeEventListener("pointermove",this._onLabelPointerMove),document.removeEventListener("pointerup",this._onAnchorPointerUp),document.removeEventListener("pointermove",this._onAnchorPointerMove),this.labelElements.removeAll(),this.labelElements.destroy(),this.segmentElements.removeAll(),this.segmentElements.destroy(),this.effectiveSegmentElements.removeAll(),this.effectiveSegmentElements.destroy(),this.thumbElements.removeAll(),this.thumbElements.destroy(),this.tickElements.removeAll(),this.tickElements.destroy()}get _isDisabled(){return this.disabled||"disabled"===this.state}get effectiveMax(){return this.viewModel.effectiveMax}set effectiveMax(e){this.viewModel.effectiveMax=e}get effectiveMin(){return this.viewModel.effectiveMin}set effectiveMin(e){this.viewModel.effectiveMin=e}get inputFormatFunction(){return this.viewModel.inputFormatFunction}set inputFormatFunction(e){this.viewModel.inputFormatFunction=e}get inputParseFunction(){return this.viewModel.inputParseFunction}set inputParseFunction(e){this.viewModel.inputParseFunction=e}get icon(){return"caret-double-horizontal"}set icon(e){this._overrideIfSome("icon",e)}get label(){return this.messages?.widgetLabel??""}set label(e){this._overrideIfSome("label",e)}get labelFormatFunction(){return this.viewModel.labelFormatFunction}set labelFormatFunction(e){this.viewModel.labelFormatFunction=e}get labels(){return this.viewModel.labels}set layout(e){["vertical","vertical-reversed","horizontal","horizontal-reversed"].includes(e)||(e="horizontal"),this._set("layout",e)}get max(){return this.viewModel.max}set max(e){this.viewModel.max=e}get min(){return this.viewModel.min}set min(e){this.viewModel.min=e}get precision(){return this.viewModel.precision}set precision(e){this.viewModel.precision=e}get state(){const{_activeLabelInputIndex:e,_isMaxInputActive:t,_isMinInputActive:i,_dragStartInfo:n,_segmentDragStartInfo:s,disabled:o,viewModel:r}=this;return o?"disabled":!(null===e&&!t&&!i)?"editing":null!=n||null!=s?"dragging":r.state}get thumbsConstrained(){return this.viewModel.thumbsConstrained}set thumbsConstrained(e){this.viewModel.thumbsConstrained=e}set tickConfigs(e){this._set("tickConfigs",e),this.scheduleRender()}get values(){return this.viewModel.values}set values(e){this.viewModel.values=e}castVisibleElements(e){return{...g,...e}}render(){const{label:e}=this,t=this.classes(u.base,c.widget,this._isHorizontalLayout()?u.horizontalLayout:u.verticalLayout,this._isReversedLayout()?u.reversed:null,this._isDisabled?c.disabled:null);return this._storeTrackDimensions(),_("div",{afterCreate:this._afterContainerCreate,"aria-label":e,bind:this,class:t,"touch-action":"none"},this._renderContent())}toNextStep(e){this._toStep(e,1)}toPreviousStep(e){this._toStep(e,-1)}getCurrentPosition(){return this._positionFromValue(this.values?.[0]??0)}_renderContent(){const{max:e,min:t}=this;if(!(null==t||null==e||t>=e))return[this._renderMin(),this._renderSliderContainer(),this._renderMax()]}_renderSliderContainer(){return _("div",{bind:this,class:u.contentElement,key:"slider-container"},this._renderTrackElement(),this._renderTicksContainer(),this._renderExtraContentElements())}_renderTrackElement(){return _("div",{afterCreate:this._afterTrackCreate,afterRemoved:this._afterTrackRemoved,bind:this,class:u.trackElement,"touch-action":"none"},this._renderEffectiveSegmentElements(),this._renderSegmentElements(),this._renderAnchorElements())}_renderEffectiveSegmentElements(){if(!this.trackElement||!this.values?.length)return;const e=null!=this.effectiveMax,t=null!=this.effectiveMin;if(!e&&!t)return;const{max:i,min:n,viewModel:s}=this,o=s.getBounds(),r=[];return t&&r.push(this._renderEffectiveSegmentElement(n,o.min,!0)),e&&r.push(this._renderEffectiveSegmentElement(o.max,i,!1)),r}_renderSegmentElements(){if(!this.trackElement||!this.values?.length)return;const e=this.values.length,t=[];for(let i=0;i<=e;i++)t.push(this._renderSegmentElement(i));return t}_renderSegmentElement(e){const{_trackHeight:t,_trackWidth:i,draggableSegmentsEnabled:n,id:s,state:o}=this,r=this.values,a=this._isHorizontalLayout(),l=a?i:t,h=this.viewModel.getBounds(),d=this._positionFromValue(h.max),c=this._positionFromValue(h.min),m=e===r?.length?null:e,p=0===e?null:e-1,v=null!=m,g=null!=p;let f,b;const E=[...r].sort((e,t)=>e-t);this._isReversedLayout()?(f=g?this._positionFromValue(E[p]):c,b=v?this._positionFromValue(E[m]):d):(f=v?this._positionFromValue(E[m]):d,b=g?this._positionFromValue(E[p]):c);const x=this._applyPrecisionToPosition(100*b/l),y=(f-b)/l,P=a?`transform: translate(${x}%, 0px) scale(${y}, 1);`:`transform: translate(0px, ${x}%) scale(1, ${y});`,k=this.classes(u.segmentElement,u.segmentElementIndexPrefix+e,n&&v&&g&&"disabled"!==o?u.segmentElementInteractive:null);return _("div",{afterCreate:this._afterSegmentCreate,afterRemoved:this._afterSegmentRemoved,bind:this,class:k,"data-max-thumb-index":m,"data-min-thumb-index":p,"data-segment-index":e,key:`${s}-segment-${e}`,style:P,"touch-action":"none"})}_renderEffectiveSegmentElement(e,t,i){const{_trackHeight:n,_trackWidth:s,layout:o}=this,r=this._positionFromValue(e),a=this._positionFromValue(t),l=this._isHorizontalLayout(),h=l?s:n,d=this._applyPrecisionToPosition(100*r/h);let c=null;if("horizontal"===o){const e=i?h-a:a,t=r===h?0:d;c=`clip-path: inset(0% ${a===h?0:this._applyPrecisionToPosition(e/h*100)}% 0% ${t}%);`}else{const e=(a-r)/h;c=l?`transform: translate(${d}%, 0px) scale(${e}, 1);`:`transform: translate(0px, ${d}%) scale(1, ${e});`}const m=i?u.effectiveMinSegmentElement:u.effectiveMaxSegmentElement,p=this.classes(u.segmentElement,u.effectiveSegmentElement,m);return _("div",{afterCreate:this._afterEffectiveSegmentCreate,afterRemoved:this._afterEffectiveSegmentRemoved,bind:this,class:p,style:c,"touch-action":"none"})}_renderAnchorElements(){const{trackElement:e,values:t}=this;if(t?.length)return this._zIndices=t.map((e,i)=>{const n=this._positionFromValue(e),s=this._positionToPercent(n),o=(this._isHorizontalLayout()?s>50:s<50)?-1:1;return this._zIndexOffset+(t.length+o*i)}),e&&t&&t.length?t.map((e,t)=>this._renderAnchorElement(e,t)):null}_renderAnchorElement(e,i){const n=this._positionFromValue(e),s=this._valueFromPosition(n);if(null==s||isNaN(s))return;const{_dragStartInfo:o,_lastMovedHandleIndex:r,id:a,layout:l,visibleElements:{labels:h}}=this,d=this.values,c=o?.index===i,m=r===i,p=this.classes(u.anchorElement,u.anchorElementIndexPrefix+i,c?u.movingAnchorElement:null,m?u.lastMovedAnchorElement:null),v=this.labels.values[i],g=this._getStyleForAnchor(e,i,c||m),{min:f,max:b}=this.viewModel.getBoundsForValueAtIndex(i),{disabled:E,messages:x}=this,y=2===d.length?t(0===i?x.rangeMinimum:x.rangeMaximum,{value:e}):v,P=1===d.length?null:0===i?`${a}-handle-${i+1}`:i===d.length-1?`${a}-handle-${i-1}`:`${a}-handle-${i-1} ${a}-handle-${i+1}`;return _("div",{afterCreate:this._afterAnchorCreate,afterRemoved:this._afterAnchorRemoved,afterUpdate:this._afterAnchorUpdate,"aria-controls":P,"aria-label":x.sliderValue,"aria-labelledby":h?`${a}-label-${i}`:null,"aria-orientation":l,"aria-valuemax":b?.toString(),"aria-valuemin":f?.toString(),"aria-valuenow":e.toString(),"aria-valuetext":y,bind:this,class:p,"data-thumb-index":i,"data-value":e,id:`${a}-handle-${i}`,key:`${a}-handle-${i}`,onkeydown:this._onAnchorKeyDown,role:"slider",style:g,tabIndex:E?-1:0,"touch-action":"none"},_("span",{afterCreate:this._afterThumbCreate,afterRemoved:this._afterThumbRemoved,bind:this,class:u.thumbElement,"data-thumb-index":i,"touch-action":"none"}),this.renderThumbLabel(i))}renderThumbLabel(e){const{id:t,labels:i,labelInputsEnabled:n,state:s}=this,o=this.visibleElements.labels,r=i.values[e],a=this.classes(u.labelElement,o?null:c.hidden,n&&"disabled"!==s?u.labelElementInteractive:null);return _("span",{afterCreate:this._afterLabelCreate,afterRemoved:this._afterLabelRemoved,"aria-hidden":(!o).toString(),bind:this,class:a,"data-thumb-index":e,id:`${t}-label-${e}`,key:`${t}-label-${e}`,role:n?"button":void 0,"touch-action":"none"},this._activeLabelInputIndex===e?this._renderValueInput(e):r)}_renderValueInput(e){const{disabled:t,values:i}=this;if(null==i)return;const n=i[e];return _("input",{afterCreate:this._afterInputCreate,"aria-label":this.messages.sliderValue,bind:this,class:u.labelInput,"data-input-index":e,"data-input-type":"thumb",key:`value-input-${e}`,onblur:this._onLabelInputBlur,onkeydown:this._onInputKeyDown,required:!0,tabIndex:t?-1:0,type:"text",value:this._formatInputValue(n,"value",e)})}_renderMax(){const{_isMaxInputActive:e,labels:t,rangeLabelInputsEnabled:i,state:n}=this,s=this.visibleElements.rangeLabels,o=this.classes(u.maxElement,{[c.hidden]:!s,[u.maxElementInteractive]:i&&"disabled"!==n,[u.rangeElementActive]:e});return _("div",{afterCreate:this._afterMaxLabelCreate,"aria-hidden":(!s).toString(),bind:this,class:o,onclick:this._onMaxLabelClick,onkeydown:this._onMaxLabelKeyDown,role:i?"button":void 0,tabIndex:!this.disabled&&i?0:-1},e?this._renderMaxInput():t.max)}_renderMin(){const{_isMinInputActive:e,labels:t,rangeLabelInputsEnabled:i,state:n}=this,s=this.visibleElements.rangeLabels,o=this.classes(u.minElement,{[c.hidden]:!s,[u.minElementInteractive]:i&&"disabled"!==n,[u.rangeElementActive]:e});return _("div",{afterCreate:this._afterMinLabelCreate,"aria-hidden":(!s).toString(),bind:this,class:o,onclick:this._onMinLabelClick,onkeydown:this._onMinLabelKeyDown,role:i?"button":void 0,tabIndex:!this.disabled&&i?0:-1},e?this._renderMinInput():t.min)}_renderMaxInput(){return _("input",{afterCreate:this._afterInputCreate,"aria-label":this.messages.maximumValue,bind:this,class:u.rangeInput,"data-input-type":"max",onblur:this._onMaxInputBlur,onkeydown:this._onInputKeyDown,required:!0,tabIndex:this.disabled?-1:0,type:"text",value:this._formatInputValue(this.max,"max")})}_renderMinInput(){return _("input",{afterCreate:this._afterInputCreate,"aria-label":this.messages.minimumValue,bind:this,class:u.rangeInput,"data-input-type":"min",onblur:this._onMinInputBlur,onkeydown:this._onInputKeyDown,required:!0,tabIndex:this.disabled?-1:0,type:"text",value:this._formatInputValue(this.min,"min")})}_renderExtraContentElements(){return _("div",{bind:this,class:u.extraContentElement},this.extraNodes)}_renderTicksContainer(){if(this.tickConfigs&&this.trackElement&&(0!==this._trackHeight||0!==this._trackWidth))return this.tickConfigs.map((e,t)=>_("div",{class:this.classes(u.ticksContainerElement),key:"ticks-container"},this._renderTicks(e,t)))}_renderTicks(e,t){const{mode:n,values:s}=e;if(this.tickElements.at(t)||this.tickElements.add(new i,t),"position"===n){const i=Array.isArray(s)?s:[s];return this._calculateTickPositions(i).map((i,n)=>this._renderTickGroup(e,n,t,i))}if("percent"===n&&Array.isArray(s)){const i=this.min??0,n=(this.max??0)-i,o=s.map(e=>this._applyPrecisionToPosition(e/100*n+i));return this._calculateTickPositions(o).map((i,n)=>this._renderTickGroup(e,n,t,i))}const o=Array.isArray(s)&&s.length?s[0]:isNaN(s)?null:s,r=this._getTickCounts(o,e);return this._calculateEquidistantTickPositions(r).map((i,n)=>this._renderTickGroup(e,n,t,i))}_renderTickGroup(e,t,i,n){const s="position"===e.mode?Array.isArray(e.values)?e.values[t]:e.values:this._valueFromPosition(n);if(null!=s&&!isNaN(s))return _("div",{afterCreate:this._afterTickGroupCreate,afterRemoved:this._afterTickGroupRemoved,bind:this,"data-config":e,"data-position":n,"data-tick-config-index":i,"data-tick-group-index":t,"data-value":s,key:`tick-group-${t}`,onclick:this._onTickGroupClick},this._renderTickLine(e,t,i,s),e.labelsVisible?this._renderTickLabel(e,t,i,s):null)}_renderTickLine(e,t,i,n){return _("div",{afterCreate:this._afterTickLineCreate,"aria-valuenow":n.toString(),bind:this,class:u.tickElement,"data-config":e,"data-tick-config-index":i,"data-tick-group-index":t,"data-value":n,key:`tick-label-${t}`,style:this._getPositionStyleForElement(n)})}_renderTickLabel(e,t,i,n){const s=e.labelFormatFunction?e.labelFormatFunction(n,"tick",t):this.viewModel.getLabelForValue(n,"tick",t);return _("div",{afterCreate:this._afterTickLabelCreate,"aria-label":s,"aria-valuenow":n.toString(),"aria-valuetext":s,bind:this,class:u.tickLabelElement,"data-config":e,"data-tick-config-index":i,"data-tick-group-index":t,"data-value":n,key:`tick-label-${t}`,style:`transform: translate(-50%); ${this._getPositionStyleForElement(n)}`},s)}_afterContainerCreate(e){this.addHandles(p(e,()=>this.scheduleRender()))}_afterTrackCreate(e){this._set("trackElement",e),e.addEventListener("pointerdown",this._onTrackPointerDown),this.scheduleRender()}_afterTrackRemoved(e){e.removeEventListener("pointerdown",this._onTrackPointerDown),document.removeEventListener("pointermove",this._onTrackPointerMove),document.removeEventListener("pointerup",this._onTrackPointerUp)}_afterSegmentCreate(e){this.segmentElements.add(e),e.addEventListener("pointerdown",this._onSegmentPointerDown)}_afterSegmentRemoved(e){this.segmentElements.remove(e),e.removeEventListener("pointerdown",this._onSegmentPointerDown)}_afterEffectiveSegmentCreate(e){this.effectiveSegmentElements.add(e)}_afterEffectiveSegmentRemoved(e){this.effectiveSegmentElements.remove(e)}_afterAnchorCreate(e){if(this._anchorElements.push(e),e.addEventListener("pointerdown",this._onAnchorPointerDown),this.thumbCreatedFunction){const t=b(e),i=k(e),n=this.thumbElements.at(t),s=this.labelElements.at(t)||null;this.thumbCreatedFunction(t,i,n,s)}}_afterAnchorUpdate(e){if(null!=this._focusedAnchorIndex){b(e)===this._focusedAnchorIndex&&(e.focus(),this._focusedAnchorIndex=null)}}_afterAnchorRemoved(e){const t=this._anchorElements.indexOf(e,0);t>-1&&this._anchorElements.splice(t,1),e.removeEventListener("pointerdown",this._onAnchorPointerDown)}_afterThumbCreate(e){this.thumbElements.add(e)}_afterThumbRemoved(e){this.thumbElements.remove(e)}_afterLabelCreate(e){this.labelElements.add(e),e.addEventListener("pointerdown",this._onLabelPointerDown),e.addEventListener("pointerup",this._onLabelPointerUp)}_afterLabelRemoved(e){this.labelElements.remove(e),e.removeEventListener("pointerdown",this._onLabelPointerDown),e.removeEventListener("pointerup",this._onLabelPointerUp)}_afterInputCreate(e){if(e.focus(),e.select(),this.inputCreatedFunction){const t=e.getAttribute("data-input-type"),i="thumb"===t?E(e):null;this.inputCreatedFunction(e,t,i)}}_afterTickLineCreate(e){const t=I(e),i=A(e),n=this.tickElements.at(t),s=n.at(i);s?s.tickElement=e:n.add({groupElement:null,tickElement:e,labelElement:null},i)}_afterTickLabelCreate(e){const t=I(e),i=A(e),n=this.tickElements.at(t),s=n.at(i);s?s.labelElement=e:n.add({groupElement:null,labelElement:e,tickElement:null},i)}_afterTickGroupRemoved(e){const t=I(e),i=this.tickElements.items[t],n=i?.find(t=>t.groupElement===e);n&&i.remove(n)}_afterTickGroupCreate(e){const t=L(e);if(t?.tickCreatedFunction){const i=I(e),n=A(e),s=k(e),o=this.tickElements?.at(i)?.at(n);if(o){o.groupElement=e;const i=o.tickElement||null,n=o.labelElement||null;t.tickCreatedFunction(s,i,n)}}}_afterMaxLabelCreate(e){this._set("maxLabelElement",e)}_afterMinLabelCreate(e){this._set("minLabelElement",e)}_onAnchorKeyDown(e){if(this._isDisabled||"editing"===this.state)return;const{key:t,target:i}=e,n=this.values,s=b(i),o=this._anchorElements[s],r=n[s],a=[v.moveAnchorUp,v.moveAnchorDown,v.moveAnchorLeft,v.moveAnchorRight];if(t===v.showInput&&this.labelInputsEnabled)this._activeLabelInputIndex=s;else if(a.includes(t)){e.preventDefault();const{steps:i}=this,n=t===v.moveAnchorUp||t===v.moveAnchorRight?1:-1;if(null!=i)this._toStep(s,this._isReversedLayout()?-1*n:n);else{const{precision:e}=this,t=this._getPositionOfElement(o),i=this._valueFromPosition(t),r=this._isHorizontalLayout()?n:-1*n;let a;a=0===e?this._positionFromValue(i+r):1===e?this._positionFromValue(i+.1*r):t+r,this._toPosition(s,a)}const a=this.values[s];r!==a&&this._emitThumbChangeEvent({index:s,oldValue:r,value:a})}else if(t===v.moveAnchorToMax||t===v.moveAnchorToMin){e.preventDefault();const{min:i,max:n}=this._getAnchorBoundsInPixels(s),o=this._isPositionInverted()?t===v.moveAnchorToMax?i:n:t===v.moveAnchorToMin?i:n;this._toPosition(s,o);const a=this.values[s];r!==a&&this._emitThumbChangeEvent({index:s,oldValue:r,value:a})}}_onAnchorPointerDown(e){if(this._isDisabled)return;const{target:t,clientX:i,clientY:n}=e,s=b(t);null!=s&&(e.preventDefault(),this._anchorElements[s]&&this._anchorElements[s].focus(),this._storeTrackDimensions(),this._dragStartInfo={clientX:i,clientY:n,index:s,position:this._getPositionOfElement(this._anchorElements[s])},document.addEventListener("pointerup",this._onAnchorPointerUp),document.addEventListener("pointermove",this._onAnchorPointerMove))}_onAnchorPointerMove(e){if("editing"===this.state||!this._dragStartInfo)return;e.preventDefault();const{values:t,_anchorElements:i,_dragged:n,_dragStartInfo:s,_dragStartInfo:{index:o,position:r}}=this,{clientX:a,clientY:l}=e,h=n?"drag":"start",u=i[o],d=this._getPositionOfElement(u),c=this._applyPrecisionToPosition(this._isHorizontalLayout()?r+a-s.clientX:r+l-s.clientY);if(d===c)return;const m=t[o];this._dragged=!0,this._toPosition(o,c);const _=this.values[o];n?m!==_&&this._emitThumbDragEvent({index:o,state:h,value:_}):this._emitThumbDragEvent({index:o,state:h,value:m})}_onAnchorPointerUp(e){if(document.removeEventListener("pointerup",this._onAnchorPointerUp),document.removeEventListener("pointermove",this._onAnchorPointerMove),!this._dragStartInfo)return;e.preventDefault();const{index:t}=this._dragStartInfo,i=this._dragged,n=this.values[t];this._dragged=!1,this._dragStartInfo=null,this._lastMovedHandleIndex=t,i?this._emitThumbDragEvent({index:t,state:"stop",value:n}):(this.scheduleRender(),"editing"!==this.state&&this._emitThumbClickEvent({index:t,value:n}))}_onTrackPointerDown(e){const{_dragStartInfo:t,snapOnClickEnabled:i,state:n,values:s}=this;if(this._isDisabled||"editing"===n||t)return;if(document.addEventListener("pointermove",this._onTrackPointerMove),document.addEventListener("pointerup",this._onTrackPointerUp),!i||!s?.length)return;const{steps:o}=this,{clientX:r,clientY:a}=e,l=this._getCursorPositionFromEvent(e),h=this._valueFromPosition(l),u=this._getIndexOfNearestValue(h),d=s[u],c=s.some((e,t)=>e===d&&t!==u)&&h>d?s.lastIndexOf(d):u;if(null==c)return;const m=s[c],_=null!=o?this._calculateNearestStepPosition(l):l;this._toPosition(c,_),this._dragged=!0,this._dragStartInfo={clientX:r,clientY:a,index:c,position:_},this._focusedAnchorIndex=c,this._emitThumbDragEvent({index:c,state:"start",value:m});const p=this.values[c];m!==p&&this._emitThumbDragEvent({index:c,state:"drag",value:p}),document.addEventListener("pointerup",this._onAnchorPointerUp),document.addEventListener("pointermove",this._onAnchorPointerMove)}_onTrackPointerMove(e){e.preventDefault(),this._dragged=!0}_onTrackPointerUp(e){if(e.preventDefault(),document.removeEventListener("pointermove",this._onTrackPointerMove),document.removeEventListener("pointerup",this._onTrackPointerUp),this.snapOnClickEnabled||(this._dragged=!1),!this._dragged){const t=this._getCursorPositionFromEvent(e),i=this._valueFromPosition(t);this._emitTrackClickEvent({value:i})}}_onSegmentPointerDown(e){e.preventDefault();const t=e.target,i=x(t),n=y(t),s=P(t);if(this._isDisabled||null==n||null==s)return;e.stopPropagation(),this._storeTrackDimensions(),document.addEventListener("pointerup",this._onSegmentPointerUp);const o=this._getAnchorDetails(n),r=this._getAnchorDetails(s);this.syncedSegmentsEnabled?(this.segmentElements.forEach(e=>e.classList.add(u.segmentElementActive)),this._anchorElements.forEach(e=>e.classList.add(u.anchorElementActive))):(this.segmentElements.at(i).classList.add(u.segmentElementActive),this._anchorElements[o.index]?.classList.add(u.anchorElementActive),this._anchorElements[r.index]?.classList.add(u.anchorElementActive)),this._segmentDragStartInfo={cursorPosition:this._getCursorPositionFromEvent(e),index:i,details:this._normalizeSegmentDetails({min:o,max:r})},this.draggableSegmentsEnabled&&(document.addEventListener("pointermove",this._onSegmentPointerMove),this._emitSegmentDragEvent({index:i,state:"start",thumbIndices:[n,s]}))}_onSegmentPointerMove(e){if(!this._segmentDragStartInfo)return;e.preventDefault();const{_trackHeight:t,_trackWidth:i,_segmentDragStartInfo:{index:n,cursorPosition:s,details:{min:o,max:r}}}=this,{index:a,position:l,value:h}=o,{index:u,position:d,value:c}=r;this._dragged=!0;const m=this._getCursorPositionFromEvent(e);if(m===s)return;const _=this._positionToPercent(s),p=this._positionToPercent(m)-_,v=this._positionToPercent(l)+p,g=this._positionToPercent(d)+p,{min:f}=this._getAnchorBoundsAsPercents(a),{max:b}=this._getAnchorBoundsAsPercents(u);let E=!1,x=!1;if(v<f?E=!0:g>b&&(x=!0),E){const{min:e,max:t}=this.viewModel.getBoundsForValueAtIndex(a),i=this._isPositionInverted()?t:e,n=i,s=c+(i-h),o=s-this.values[u];return void(this.syncedSegmentsEnabled?this._updateAnchorValuesByDifference(o):this._updateAnchorValues([a,u],[n,s]))}if(x){const{min:e,max:t}=this.viewModel.getBoundsForValueAtIndex(u),i=this._isPositionInverted()?e:t,n=i,s=h+(i-c),o=s-this.values[a];return void(this.syncedSegmentsEnabled?this._updateAnchorValuesByDifference(o):this._updateAnchorValues([a,u],[s,n]))}const y=this._isHorizontalLayout()?i:t,P=g/100*y,k=v/100*y,I=this.values,A=[I[a],I[u]],L=this._getValueForAnchorAtPosition(a,k),M=this._getValueForAnchorAtPosition(u,P);this.syncedSegmentsEnabled?this._updateAnchorValuesByDifference(L-A[0]):this._updateAnchorValues([a,u],[L,M]);[this.values[a],this.values[u]].every((e,t)=>e===A[t])||this._emitSegmentDragEvent({index:n,state:"drag",thumbIndices:[a,u]})}_onSegmentPointerUp(e){if(e.preventDefault(),document.removeEventListener("pointerup",this._onSegmentPointerUp),document.removeEventListener("pointermove",this._onSegmentPointerMove),!this._segmentDragStartInfo)return;const{_dragged:t}=this,i=this.min,n=this.max,s=this.values,{index:o,details:{min:{index:r},max:{index:a}}}=this._segmentDragStartInfo;if(this.segmentElements.forEach(e=>e.classList.remove(u.segmentElementActive)),this._anchorElements.forEach(e=>e.classList.remove(u.anchorElementActive)),this.draggableSegmentsEnabled){const e=n-i,t=s[r],l=s[a];this._lastMovedHandleIndex=t===l?t>e/2?r:a:null,this._dragged=!1,this._segmentDragStartInfo=null,this._emitSegmentDragEvent({index:o,state:"stop",thumbIndices:[r,a]})}if(!t){const t=this._getCursorPositionFromEvent(e),i=this._valueFromPosition(t);this._emitSegmentClickEvent({index:o,value:i,thumbIndices:[r,a]})}}_onTickGroupClick(e){const t=e.target;if(L(t)){const e=I(t),i=A(t),n=k(t);this._emitTickClickEvent({configIndex:e,groupIndex:i,value:n})}}_storeTrackDimensions(){if(this.trackElement){const e=this._getDimensions(this.trackElement);this._trackHeight=this._applyPrecisionToPosition(e.height),this._trackWidth=this._applyPrecisionToPosition(e.width)}}_onLabelPointerDown(){this._isDisabled||(this._dragged=!1,document.addEventListener("pointerup",this._onAnchorPointerUp),document.addEventListener("pointermove",this._onAnchorPointerMove))}_onLabelPointerMove(){this._isDisabled||(this._dragged=!0)}_onLabelPointerUp(e){if(this._isDisabled)return;const t=b(e.target);this.labelInputsEnabled&&!this._dragged&&null!=t&&(this._activeLabelInputIndex=t),this._dragged=!1,document.removeEventListener("pointerup",this._onLabelPointerUp),document.removeEventListener("pointermove",this._onLabelPointerMove)}_onLabelInputBlur(e){const{_activeLabelInputIndex:t,values:i,viewModel:n}=this,s=e.target.value;if(this._activeLabelInputIndex=null,!s||null==t||null==i)return;const o=this._parseInputValue(s,"value",t),r=i[t],{min:a,max:l}=this.viewModel.getBoundsForValueAtIndex(t);if(o<a||o>l)return;n.setValue(t,o);const h=this.values[t];r!==h&&this._emitThumbChangeEvent({index:t,oldValue:r,value:h})}_onInputKeyDown(e){if(this._isDisabled)return;const{key:t,target:i}=e,{hideInput1:n,hideInput2:s,hideInput3:o}=v,{_activeLabelInputIndex:r,_anchorElements:a}=this,l=i;if(t===n||t===s||t===o){e.stopPropagation();const t=r;l.blur(),null!=t?a[t].focus():l.parentElement?.focus()}}_onMaxLabelClick(){this._isDisabled||(this._emitMaxRangeLabelClickEvent({type:"max-click",value:this.max}),this.rangeLabelInputsEnabled&&(this._isMaxInputActive=!0))}_onMaxLabelKeyDown({key:e}){this._isDisabled||e!==v.showInput||(this._isMaxInputActive=!0)}_onMaxInputBlur(e){const t=e.target.value;if(this._isMaxInputActive=!1,!t)return;const i=this.max,n=this._parseInputValue(t,"max");n<=this.min||(this.viewModel.set("max",n),this.max!==i&&this._emitMaxChangeEvent({oldValue:i,value:this.max}))}_onMinLabelClick(){this._isDisabled||(this._emitMinRangeLabelClickEvent({type:"min-click",value:this.min}),this.rangeLabelInputsEnabled&&(this._isMinInputActive=!0))}_onMinLabelKeyDown({key:e}){this._isDisabled||e!==v.showInput||(this._isMinInputActive=!0)}_onMinInputBlur(e){const t=e.target.value;if(this._isMinInputActive=!1,!t)return;const i=this.min,n=this._parseInputValue(t,"min");n>=this.max||(this.viewModel.set("min",n),this.min!==i&&this._emitMinChangeEvent({oldValue:i,value:this.min}))}_positionFromValue(e){const{_trackHeight:t,_trackWidth:i}=this,n=this.min??0,s=this.max??0,o=s-n;if(0===o||null==e)return 0;const r=this._isHorizontalLayout();let a=r?this._applyPrecisionToPosition(i*(e-n)/o):this._applyPrecisionToPosition(t*(s-e)/o);return this._isReversedLayout()&&(a=r?i-a:t-a),a}_valueFromPosition(e){const{_trackHeight:t,_trackWidth:i,precision:n}=this,s=this.min??0,o=this.max??0,r=o-s;let a=this._isHorizontalLayout()?e*r/i+s:r*(1e3-e/t*1e3)/1e3+s;return this._isReversedLayout()&&(a=o+s-a),parseFloat(a.toFixed(n))}_positionToPercent(e){const{_trackHeight:t,_trackWidth:i}=this,n=100*e/(this._isHorizontalLayout()?i:t);return this._applyPrecisionToPosition(n)}_applyPrecisionToPosition(e){return parseFloat(e.toFixed(this._positionPrecision))}_isPositionInverted(){const{layout:e}=this;return"horizontal-reversed"===e||"vertical"===e}_isHorizontalLayout(){return this.layout.includes("horizontal")}_isReversedLayout(){return this.layout.includes("reversed")}_normalizeSegmentDetails(e){if(this._isPositionInverted()){const{min:t,max:i}=e;return{min:i,max:t}}return e}_parseInputValue(e,t,i){return this.inputParseFunction?this.inputParseFunction(e,t,i):this.viewModel.defaultInputParseFunction(e)}_formatInputValue(e,t,i){return this.inputFormatFunction?this.inputFormatFunction(e,t,i):this.viewModel.defaultInputFormatFunction(e)}_getAnchorDetails(e){const t=this.values,i=[...t].sort((e,t)=>e-t)[e],n=t.indexOf(i);return{index:n,position:this._getPositionOfElement(this._anchorElements[n]),value:i}}_updateAnchorStyle(e,t){const i=this._anchorElements[e];i&&(this._isHorizontalLayout()?i.style.left=`${t}`:i.style.top=`${t}`)}_getStyleForAnchor(e,t,i){const n=this._getPositionStyleForElement(e);if(1===this.values?.length)return`${n}`;const s=this._zIndices[t];return`${n}; z-index: ${i?this._zIndexOffset+s:s}`}_getPositionStyleForElement(e){const t=this._positionFromValue(e),i=this._positionToPercent(t);return`${this._isHorizontalLayout()?"left":"top"}: ${i}%`}_getPositionOfElement(e){const t=this._getDimensions(e.offsetParent),i=this._getDimensions(e);return this._isHorizontalLayout()?this._applyPrecisionToPosition(i.left-t.left):this._applyPrecisionToPosition(i.top-t.top)}_updateAnchorValues(e,t){e.forEach((e,i)=>this._toValue(e,t[i]))}_updateAnchorValuesByDifference(e){const{min:t,max:i,values:n}=this;n?.forEach((n,s)=>this._toValue(s,Math.max(Math.min(n+e,i),t)))}_toValue(e,t){if(null!=this.steps){t=this._getStepValues()[this._getIndexOfNearestStepValue(t)]}this._updateAnchorStyle(e,this._getPositionStyleForElement(t)),this.viewModel.setValue(e,t)}_toPosition(e,t){const i=null!=this.steps?this._getStepValueForAnchorAtPosition(e,t):this._getValueForAnchorAtPosition(e,t);this._updateAnchorStyle(e,this._getPositionStyleForElement(i)),this.viewModel.setValue(e,i)}_getValueForAnchorAtPosition(e,t){const{min:i,max:n}=this._getAnchorBoundsInPixels(e),{min:s,max:o}=this.viewModel.getBoundsForValueAtIndex(e);let r,a,l=null;return this._isPositionInverted()?(r=s,a=o):(r=o,a=s),l=t>n?r:t<i?a:this._valueFromPosition(t),l>o?l=o:l<s&&(l=s),l}_getStepValueForAnchorAtPosition(e,t){const i=this._getStepValues(),n=this._calculateNearestStepPosition(t),s=this._getValueForAnchorAtPosition(e,n);return i[this._getIndexOfNearestStepValue(s)]}_getAnchorBoundsAsPercents(e){const{min:t,max:i}=this._getAnchorBoundsInPixels(e);return{min:this._positionToPercent(t),max:this._positionToPercent(i)}}_getAnchorBoundsInPixels(e){const{_anchorElements:t,_trackHeight:i,_trackWidth:n,effectiveMax:s,effectiveMin:o,thumbsConstrained:r}=this,a=t[e-1],l=t[e+1],h=this._isHorizontalLayout()?n:i;let u,d;return this._isPositionInverted()?(u=null!=o?this._positionFromValue(o):h,d=null!=s?this._positionFromValue(s):0):(u=null!=s?this._positionFromValue(s):h,d=null!=o?this._positionFromValue(o):0),r?this._isPositionInverted()?{max:a?this._getPositionOfElement(a):u,min:l?this._getPositionOfElement(l):d}:{max:l?this._getPositionOfElement(l):u,min:a?this._getPositionOfElement(a):d}:{max:u,min:d}}_getIndexOfNearestValue(e){const t=this.values;return t.indexOf(t.reduce((t,i)=>Math.abs(i-e)<Math.abs(t-e)?i:t))}_getCursorPositionFromEvent(e){const t=this._getDimensions(this.trackElement);return this._isHorizontalLayout()?this._applyPrecisionToPosition(e.clientX-t.left):this._applyPrecisionToPosition(e.clientY-t.top)}_getStepValues(){const{steps:e}=this;if(Array.isArray(e))return e;const{max:t,min:i}=this;if(null==i||null==t||null==e)return[];const n=Math.ceil((t-i)/e),s=[];for(let o=0;o<=n;o++){const n=i+e*o;s.push(n>t?t:n)}return s}_toStep(e,t){const i=this.values[e],n=this._getStepValues(),s=n.indexOf(i);let o=null;if(s>-1){let i=n[s+t];isNaN(i)&&(i=n[s]);const r=this._positionFromValue(i);o=this._getStepValueForAnchorAtPosition(e,r)}else{o=n[this._getIndexOfNearestStepValue(i)+t]}this.viewModel.setValue(e,o)}_getIndexOfNearestStepValue(e){const{steps:t}=this;if(null==t)return null;const i=this._getStepValues(),n=i.reduce((t,i)=>Math.abs(i-e)<Math.abs(t-e)?i:t);return i.indexOf(n)}_calculateNearestStepPosition(e){const t=this._valueFromPosition(e),i=this._getIndexOfNearestStepValue(t),n=this._getStepValues();return this._positionFromValue(n[i])}_getTickCounts(e,t){const{mode:i}=t;return"count"===i||"position"===i?e||0:"percent"===i&&100/e||0}_calculateTickPositions(e){return e.map(e=>this._positionFromValue(e))}_calculateEquidistantTickPositions(e){const{_trackWidth:t,_trackHeight:i}=this,n=this._isHorizontalLayout()?t:i,s=n/(e-1),o=[];if(1===e)return[n/2];for(let r=0;r<e;r++){const e=r*s;e<=n&&o.push(e)}return o}_getDimensions(e){return o(e),e.getBoundingClientRect()}_emitTrackClickEvent(e){this.emit("track-click",{...e,type:"track-click"})}_emitTickClickEvent(e){this.emit("tick-click",{...e,type:"tick-click"})}_emitMaxChangeEvent(e){this.emit("max-change",{...e,type:"max-change"})}_emitMinChangeEvent(e){this.emit("min-change",{...e,type:"min-change"})}_emitThumbChangeEvent(e){this.emit("thumb-change",{...e,type:"thumb-change"})}_emitThumbClickEvent(e){this.emit("thumb-click",{...e,type:"thumb-click"})}_emitThumbDragEvent(e){this.emit("thumb-drag",{...e,type:"thumb-drag"})}_emitSegmentClickEvent(e){this.emit("segment-click",{...e,type:"segment-click"})}_emitSegmentDragEvent(e){this.emit("segment-drag",{...e,type:"segment-drag"})}_emitMinRangeLabelClickEvent(e){this.emit("min-click",e)}_emitMaxRangeLabelClickEvent(e){this.emit("max-click",e)}};function b(e){return e?.["data-thumb-index"]}function E(e){return e?.["data-input-index"]}function x(e){return e?.["data-segment-index"]}function y(e){return e?.["data-min-thumb-index"]}function P(e){return e?.["data-max-thumb-index"]}function k(e){return e?.["data-value"]}function I(e){return e?.["data-tick-config-index"]}function A(e){return e?.["data-tick-group-index"]}function L(e){return e?.["data-config"]}e([r()],f.prototype,"_activeLabelInputIndex",void 0),e([r()],f.prototype,"_dragStartInfo",void 0),e([r()],f.prototype,"_isMinInputActive",void 0),e([r()],f.prototype,"_isMaxInputActive",void 0),e([r()],f.prototype,"_segmentDragStartInfo",void 0),e([r({readOnly:!0})],f.prototype,"_isDisabled",null),e([r()],f.prototype,"disabled",void 0),e([r()],f.prototype,"draggableSegmentsEnabled",void 0),e([r()],f.prototype,"effectiveMax",null),e([r()],f.prototype,"effectiveMin",null),e([r({readOnly:!0})],f.prototype,"effectiveSegmentElements",void 0),e([r()],f.prototype,"extraNodes",void 0),e([r()],f.prototype,"inputCreatedFunction",void 0),e([r()],f.prototype,"inputFormatFunction",null),e([r()],f.prototype,"inputParseFunction",null),e([r()],f.prototype,"icon",null),e([r()],f.prototype,"label",null),e([r({readOnly:!0})],f.prototype,"labelElements",void 0),e([r()],f.prototype,"labelInputsEnabled",void 0),e([r()],f.prototype,"labelFormatFunction",null),e([r({readOnly:!0})],f.prototype,"labels",null),e([r({value:"horizontal"})],f.prototype,"layout",null),e([r()],f.prototype,"max",null),e([r({readOnly:!0})],f.prototype,"maxLabelElement",void 0),e([r(),m("esri/widgets/Slider/t9n/Slider")],f.prototype,"messages",void 0),e([r()],f.prototype,"min",null),e([r({readOnly:!0})],f.prototype,"minLabelElement",void 0),e([r()],f.prototype,"precision",null),e([r()],f.prototype,"rangeLabelInputsEnabled",void 0),e([r({readOnly:!0})],f.prototype,"segmentElements",void 0),e([r()],f.prototype,"snapOnClickEnabled",void 0),e([r({readOnly:!0})],f.prototype,"state",null),e([r()],f.prototype,"steps",void 0),e([r()],f.prototype,"syncedSegmentsEnabled",void 0),e([r()],f.prototype,"thumbsConstrained",null),e([r()],f.prototype,"thumbCreatedFunction",void 0),e([r({readOnly:!0})],f.prototype,"thumbElements",void 0),e([r()],f.prototype,"tickConfigs",null),e([r({readOnly:!0})],f.prototype,"tickElements",void 0),e([r({readOnly:!0})],f.prototype,"trackElement",void 0),e([r()],f.prototype,"values",null),e([r({type:d})],f.prototype,"viewModel",void 0),e([r()],f.prototype,"visibleElements",void 0),e([a("visibleElements")],f.prototype,"castVisibleElements",null),f=e([l("esri.widgets.Slider")],f);const M=f;export{M as default};