@arcgis/core 4.28.0-next.20230921 → 4.28.0-next.20230922

package/widgets/Slider.js

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

package/widgets/Swipe.js

@@ -2,4 +2,4 @@
 All material copyright ESRI, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.28/esri/copyright.txt for details.
 */
-import{_ as e}from"../chunks/tslib.es6.js";import{eventKey as t}from"../core/events.js";import{property as i}from"../core/accessorSupport/decorators/property.js";import"../core/accessorSupport/ensureType.js";import"../core/arrayUtils.js";import"../core/has.js";import{subclass as r}from"../core/accessorSupport/decorators/subclass.js";import n from"./Widget.js";import{globalCss as o}from"./support/globalCss.js";import{legacyIcon as s}from"./support/legacyIcon.js";import"./support/widgetUtils.js";import{messageBundle as a}from"./support/decorators/messageBundle.js";import{tsx as l}from"./support/jsxFactory.js";import d from"./Swipe/SwipeViewModel.js";const p="esri-swipe",c={base:p,widgetIcon:s.upDownArrows,baseDisabled:`${p}--disabled`,vertical:`${p}--vertical`,horizontal:`${p}--horizontal`,container:`${p}__container`,divider:`${p}__divider`,handle:`${p}__handle`,handleHidden:`${p}__handle--hidden`,handleIcon:`${p}__handle-icon`},h={handle:!0,divider:!0};let v=class extends n{constructor(e,t){super(e,t),this.disabled=!1,this.iconClass=c.widgetIcon,this.icon=null,this.messages=null,this.viewModel=new d,this._pointerOffset=0,this._container=null,this._onContainerPointerDown=this._onContainerPointerDown.bind(this),this._onContainerPointerMove=this._onContainerPointerMove.bind(this),this._onContainerPointerUp=this._onContainerPointerUp.bind(this)}get direction(){return this.viewModel.direction}set direction(e){this.viewModel.direction=e}get dragLabel(){return this.messages?.dragLabel??""}set dragLabel(e){this._overrideIfSome("dragLabel",e)}get label(){return this.messages?.widgetLabel??""}set label(e){this._overrideIfSome("label",e)}get leadingLayers(){return this.viewModel.leadingLayers}set leadingLayers(e){this.viewModel.leadingLayers=e}get position(){return this.viewModel.position}set position(e){this.viewModel.position=e}get trailingLayers(){return this.viewModel.trailingLayers}set trailingLayers(e){this.viewModel.trailingLayers=e}get view(){return this.viewModel.view}set view(e){this.viewModel.view=e}set visibleElements(e){this._set("visibleElements",{...h,...e})}get visibleElements(){return this._get("visibleElements")||h}render(){const{state:e,direction:t}=this.viewModel,i="disabled"===e||this.disabled,r={[o.disabled]:i,[c.baseDisabled]:i,[c.vertical]:"vertical"===t,[c.horizontal]:"horizontal"===t};return l("div",{class:this.classes(c.base,o.widget,r)},"disabled"===e?null:this._renderContainer())}_renderHandle(){const{direction:e}=this.viewModel,{visibleElements:t}=this,i={[s.dragHorizontal]:"vertical"===e,[s.dragVertical]:"horizontal"===e},r=this.classes(c.handle,!t.handle&&c.handleHidden);return l("div",{key:"handle",role:"presentation",class:r},l("span",{"aria-hidden":"true",class:this.classes(c.handleIcon,i)}))}_renderDivider(){const{visibleElements:e}=this;return e&&e.divider?l("div",{key:"divider",role:"presentation",class:c.divider}):null}_renderContent(){return[this._renderDivider(),this._renderHandle()]}_renderContainer(){const{disabled:e,dragLabel:t,viewModel:i}=this,{max:r,min:n,direction:o,position:s}=i,a=`${s}%`,d={top:"vertical"===o?a:void 0,left:"vertical"===o?void 0:a},p=this._renderContent();return l("div",e?{key:"container",role:"presentation",styles:d,class:c.container}:{tabIndex:0,key:"container",bind:this,afterCreate:this._afterContainerCreate,onkeydown:this._onContainerKeyDown,"touch-action":"none",role:"slider",title:t,"aria-label":t,"aria-orientation":o,"aria-valuemax":`${r}`,"aria-valuemin":`${n}`,"aria-valuenow":`${s}`,"aria-valuetext":a,styles:d,class:c.container},p)}_afterContainerCreate(e){this._container=e,e.addEventListener("pointerdown",this._onContainerPointerDown)}_calculatePointerOffset(e){const{direction:t}=this,i=e.target,r=("vertical"===t?i.clientHeight:i.clientWidth)/2,n=i.getBoundingClientRect(),o=e.clientX-n.left,s=e.clientY-n.top;this._pointerOffset="vertical"===t?s-r:o-r}_onContainerPointerDown(e){e.preventDefault(),this._container&&document.activeElement!==this.container&&this._container.focus(),this._calculatePointerOffset(e),document.addEventListener("pointerup",this._onContainerPointerUp),document.addEventListener("pointermove",this._onContainerPointerMove)}_onContainerPointerUp(e){e.preventDefault(),document.removeEventListener("pointerup",this._onContainerPointerUp),document.removeEventListener("pointermove",this._onContainerPointerMove)}_onContainerPointerMove(e){e.preventDefault();const{_pointerOffset:t,container:i,direction:r}=this,{clientX:n,clientY:o}=e,{top:s,left:a,width:l,height:d}=i.getBoundingClientRect(),p=("vertical"===r?o-s-t:n-a-t)/("vertical"===r?d:l)*100;this.position=p}_getKeyPosition(e){const i=t(e),{position:r}=this,{max:n,min:o,step:s,stepMultiplier:a,direction:l}=this.viewModel,d=s*a;["ArrowUp","ArrowDown","ArrowLeft","ArrowRight","Home","End","PageUp","PageDown"].includes(i)&&(e.preventDefault(),e.stopPropagation());if("vertical"===l?"ArrowDown"===i||"ArrowRight"===i:"ArrowUp"===i||"ArrowRight"===i){return r+(e.shiftKey?d:s)}if("vertical"===l?"ArrowUp"===i||"ArrowLeft"===i:"ArrowDown"===i||"ArrowLeft"===i){return r-(e.shiftKey?d:s)}if("Home"===i)return o;if("End"===i)return n;if("vertical"===l?"PageDown"===i:"PageUp"===i)return r+d;return("vertical"===l?"PageUp"===i:"PageDown"===i)?r-d:null}_onContainerKeyDown(e){const t=this._getKeyPosition(e);"number"==typeof t&&(this.position=t)}};e([i()],v.prototype,"direction",null),e([i()],v.prototype,"disabled",void 0),e([i()],v.prototype,"dragLabel",null),e([i()],v.prototype,"iconClass",void 0),e([i()],v.prototype,"icon",void 0),e([i()],v.prototype,"label",null),e([i()],v.prototype,"leadingLayers",null),e([i(),a("esri/widgets/Swipe/t9n/Swipe")],v.prototype,"messages",void 0),e([i()],v.prototype,"position",null),e([i()],v.prototype,"trailingLayers",null),e([i()],v.prototype,"view",null),e([i({type:d})],v.prototype,"viewModel",void 0),e([i()],v.prototype,"visibleElements",null),v=e([r("esri.widgets.Swipe")],v);const u=v;export{u as default};
+import{_ as e}from"../chunks/tslib.es6.js";import{eventKey as t}from"../core/events.js";import{property as i}from"../core/accessorSupport/decorators/property.js";import"../core/accessorSupport/ensureType.js";import"../core/arrayUtils.js";import"../core/has.js";import{subclass as r}from"../core/accessorSupport/decorators/subclass.js";import n from"./Widget.js";import{globalCss as o}from"./support/globalCss.js";import{legacyIcon as s}from"./support/legacyIcon.js";import"./support/widgetUtils.js";import{messageBundle as a}from"./support/decorators/messageBundle.js";import{tsx as l}from"./support/jsxFactory.js";import d from"./Swipe/SwipeViewModel.js";const p="esri-swipe",c={base:p,widgetIcon:s.upDownArrows,baseDisabled:`${p}--disabled`,vertical:`${p}--vertical`,horizontal:`${p}--horizontal`,container:`${p}__container`,divider:`${p}__divider`,handle:`${p}__handle`,handleHidden:`${p}__handle--hidden`,handleIcon:`${p}__handle-icon`},h={handle:!0,divider:!0};let v=class extends n{constructor(e,t){super(e,t),this.disabled=!1,this.iconClass=c.widgetIcon,this.icon=null,this.messages=null,this.viewModel=new d,this._pointerOffset=0,this._container=null,this._onContainerPointerDown=this._onContainerPointerDown.bind(this),this._onContainerPointerMove=this._onContainerPointerMove.bind(this),this._onContainerPointerUp=this._onContainerPointerUp.bind(this)}get direction(){return this.viewModel.direction}set direction(e){this.viewModel.direction=e}get dragLabel(){return this.messages?.dragLabel??""}set dragLabel(e){this._overrideIfSome("dragLabel",e)}get label(){return this.messages?.widgetLabel??""}set label(e){this._overrideIfSome("label",e)}get leadingLayers(){return this.viewModel.leadingLayers}set leadingLayers(e){this.viewModel.leadingLayers=e}get position(){return this.viewModel.position}set position(e){this.viewModel.position=e}get trailingLayers(){return this.viewModel.trailingLayers}set trailingLayers(e){this.viewModel.trailingLayers=e}get view(){return this.viewModel.view}set view(e){this.viewModel.view=e}set visibleElements(e){this._set("visibleElements",{...h,...e})}get visibleElements(){return this._get("visibleElements")||h}render(){const{state:e,direction:t}=this.viewModel,i="disabled"===e||this.disabled,r={[o.disabled]:i,[c.baseDisabled]:i,[c.vertical]:"vertical"===t,[c.horizontal]:"horizontal"===t};return l("div",{class:this.classes(c.base,o.widget,r)},"disabled"===e?null:this._renderContainer())}_renderHandle(){const{direction:e}=this.viewModel,{visibleElements:t}=this,i={[s.dragHorizontal]:"vertical"===e,[s.dragVertical]:"horizontal"===e},r=this.classes(c.handle,!t.handle&&c.handleHidden);return l("div",{class:r,key:"handle",role:"presentation"},l("span",{"aria-hidden":"true",class:this.classes(c.handleIcon,i)}))}_renderDivider(){const{visibleElements:e}=this;return e&&e.divider?l("div",{class:c.divider,key:"divider",role:"presentation"}):null}_renderContent(){return[this._renderDivider(),this._renderHandle()]}_renderContainer(){const{disabled:e,dragLabel:t,viewModel:i}=this,{max:r,min:n,direction:o,position:s}=i,a=`${s}%`,d={top:"vertical"===o?a:void 0,left:"vertical"===o?void 0:a},p=this._renderContent();return l("div",e?{class:c.container,key:"container",role:"presentation",styles:d}:{afterCreate:this._afterContainerCreate,"aria-label":t,"aria-orientation":o,"aria-valuemax":`${r}`,"aria-valuemin":`${n}`,"aria-valuenow":`${s}`,"aria-valuetext":a,bind:this,class:c.container,key:"container",onkeydown:this._onContainerKeyDown,role:"slider",styles:d,tabIndex:0,title:t,"touch-action":"none"},p)}_afterContainerCreate(e){this._container=e,e.addEventListener("pointerdown",this._onContainerPointerDown)}_calculatePointerOffset(e){const{direction:t}=this,i=e.target,r=("vertical"===t?i.clientHeight:i.clientWidth)/2,n=i.getBoundingClientRect(),o=e.clientX-n.left,s=e.clientY-n.top;this._pointerOffset="vertical"===t?s-r:o-r}_onContainerPointerDown(e){e.preventDefault(),this._container&&document.activeElement!==this.container&&this._container.focus(),this._calculatePointerOffset(e),document.addEventListener("pointerup",this._onContainerPointerUp),document.addEventListener("pointermove",this._onContainerPointerMove)}_onContainerPointerUp(e){e.preventDefault(),document.removeEventListener("pointerup",this._onContainerPointerUp),document.removeEventListener("pointermove",this._onContainerPointerMove)}_onContainerPointerMove(e){e.preventDefault();const{_pointerOffset:t,container:i,direction:r}=this,{clientX:n,clientY:o}=e,{top:s,left:a,width:l,height:d}=i.getBoundingClientRect(),p=("vertical"===r?o-s-t:n-a-t)/("vertical"===r?d:l)*100;this.position=p}_getKeyPosition(e){const i=t(e),{position:r}=this,{max:n,min:o,step:s,stepMultiplier:a,direction:l}=this.viewModel,d=s*a;["ArrowUp","ArrowDown","ArrowLeft","ArrowRight","Home","End","PageUp","PageDown"].includes(i)&&(e.preventDefault(),e.stopPropagation());if("vertical"===l?"ArrowDown"===i||"ArrowRight"===i:"ArrowUp"===i||"ArrowRight"===i){return r+(e.shiftKey?d:s)}if("vertical"===l?"ArrowUp"===i||"ArrowLeft"===i:"ArrowDown"===i||"ArrowLeft"===i){return r-(e.shiftKey?d:s)}if("Home"===i)return o;if("End"===i)return n;if("vertical"===l?"PageDown"===i:"PageUp"===i)return r+d;return("vertical"===l?"PageUp"===i:"PageDown"===i)?r-d:null}_onContainerKeyDown(e){const t=this._getKeyPosition(e);"number"==typeof t&&(this.position=t)}};e([i()],v.prototype,"direction",null),e([i()],v.prototype,"disabled",void 0),e([i()],v.prototype,"dragLabel",null),e([i()],v.prototype,"iconClass",void 0),e([i()],v.prototype,"icon",void 0),e([i()],v.prototype,"label",null),e([i()],v.prototype,"leadingLayers",null),e([i(),a("esri/widgets/Swipe/t9n/Swipe")],v.prototype,"messages",void 0),e([i()],v.prototype,"position",null),e([i()],v.prototype,"trailingLayers",null),e([i()],v.prototype,"view",null),e([i({type:d})],v.prototype,"viewModel",void 0),e([i()],v.prototype,"visibleElements",null),v=e([r("esri.widgets.Swipe")],v);const u=v;export{u as default};

package/widgets/TableList.js

@@ -2,4 +2,4 @@
 All material copyright ESRI, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.28/esri/copyright.txt for details.
 */
-import{_ as t}from"../chunks/tslib.es6.js";import e from"../core/Collection.js";import{eventKey as s}from"../core/events.js";import{watch as i,on as o,initial as n}from"../core/reactiveUtils.js";import{property as r}from"../core/accessorSupport/decorators/property.js";import{cast as a}from"../core/accessorSupport/decorators/cast.js";import"../core/arrayUtils.js";import"../core/has.js";import{subclass as l}from"../core/accessorSupport/decorators/subclass.js";import c from"./Widget.js";import{globalCss as d}from"./support/globalCss.js";import{legacyIcon as m}from"./support/legacyIcon.js";import{accessibleHandler as u}from"./support/decorators/accessibleHandler.js";import{messageBundle as h}from"./support/decorators/messageBundle.js";import{vmEvent as g}from"./support/decorators/vmEvent.js";import{tsx as p}from"./support/jsxFactory.js";import"./support/widgetUtils.js";import _ from"./TableList/ListItem.js";import b from"./TableList/TableListViewModel.js";import{findSelectedItem as y}from"./TableList/support/tableListUtils.js";import I from"sortablejs";function v(t,e,s){t.splice(s,0,t.splice(e,1)[0])}const f=e.ofType(_),A="root-tables",S="data-layer-uid",w="layerUid",C="esri-table-list",T={base:C,widgetIcon:m.table,noItems:`${C}__no-items`,list:`${C}__list`,listRoot:`${C}__list--root`,item:`${C}__item`,itemChosen:`${C}__item--chosen`,itemMessage:`${C}__item--has-message`,itemSelectable:`${C}__item--selectable`,itemContainer:`${C}__item-container`,actionsMenu:`${C}__item-actions-menu`,actionsMenuItem:`${C}__item-actions-menu-item`,actionsMenuItemActive:`${C}__item-actions-menu-item--active`,actions:`${C}__item-actions`,actionsList:`${C}__item-actions-list`,action:`${C}__item-action`,actionIcon:`${C}__item-action-icon`,actionImage:`${C}__item-action-image`,actionTitle:`${C}__item-action-title`,actionToggle:`${C}__action-toggle`,actionToggleOn:`${C}__action-toggle--on`,message:`${C}__item-message`,title:`${C}__item-title`,publishing:`${C}__publishing`},$={actions:"actions",actionSection:"action-section",items:"items"};function M(t){const{actionsOpen:e}=t;e&&(t.actionsOpen=!1)}const k={statusIndicators:!0,errors:!1};let E=class extends c{constructor(t,e){super(t,e),this._sortable=null,this._sortableNode=null,this._focusSortUid=null,this.visibleItems=null,this.iconClass=T.widgetIcon,this.icon=null,this.messages=null,this.messagesCommon=null,this.multipleSelectionEnabled=!1,this.selectionEnabled=!1,this.selectedItems=new f,this.viewModel=new b,this.visibleElements={...k}}initialize(){this._setVisibleItems(this.tableItems),this.addHandles([i((()=>this.visibleElements),(()=>this._itemsChanged())),o((()=>this.viewModel.tableItems),"change",(()=>this._itemsChanged())),i((()=>this.selectionEnabled),(()=>this._toggleSorting()),n)])}destroy(){this._destroySortable()}get label(){return this.messages?.widgetLabel??""}set label(t){this._overrideIfSome("label",t)}get listItemCreatedFunction(){return this.viewModel.listItemCreatedFunction}set listItemCreatedFunction(t){this.viewModel.listItemCreatedFunction=t}get map(){return this.viewModel.map}set map(t){this.viewModel.map=t}get tableItems(){return this.viewModel.tableItems}castVisibleElements(t){return{...k,...t}}triggerAction(t,e){return this.viewModel.triggerAction(t,e)}render(){const{visibleItems:t}=this,e=this.viewModel?.state,s={[d.hidden]:"loading"===e,[d.disabled]:"disabled"===e};return p("div",{class:this.classes(T.base,d.widget,d.panel,s)},t?.length?this._renderList():this._renderNoItems())}_renderNoItems(){return p("div",{class:T.noItems},this.messages.noItemsToDisplay)}_renderList(){const{visibleItems:t,messages:e,selectionEnabled:s}=this;return p("ul",{"aria-label":e.widgetLabel,role:s?"listbox":void 0,afterCreate:this._sortNodeCreated,afterRemoved:this._destroySortable,"data-node-ref":"_sortableNode",bind:this,class:this.classes(T.list,T.listRoot)},t?.map((t=>this._renderItem(t))).toArray())}_renderItem(t){const{id:e,selectionEnabled:s,selectedItems:i}=this,o=`${`${e}_${t.uid}`}__title`,n=this._hasMessage(t),r={[T.itemMessage]:!!n,[T.itemSelectable]:s};if(s){const e={[S]:t.layer?.uid};return p("li",{key:`item-with-selection-${t.uid}`,bind:this,afterCreate:this._focusListItem,afterUpdate:this._focusListItem,class:this.classes(T.item,r),"aria-labelledby":o,onclick:this._toggleSelection,onkeydown:this._selectionKeydown,"data-item":t,tabIndex:0,"aria-selected":y(t,i)?"true":"false",role:"option",...e},this._renderItemContent(t,o))}return p("li",{key:`item-no-selection-${t.uid}`,bind:this,afterCreate:this._focusListItem,afterUpdate:this._focusListItem,class:this.classes(T.item,r),"aria-labelledby":o},this._renderItemContent(t,o))}_renderActionsMenuIcon(t,e){const{messagesCommon:s}=this,i={[T.actionsMenuItemActive]:t.actionsOpen};return p("div",{key:"actions-menu-toggle","data-item":t,bind:this,onclick:this._toggleActionsOpen,onkeydown:this._toggleActionsOpen,class:this.classes(T.actionsMenuItem,i),tabIndex:0,role:"button","aria-controls":e,"aria-label":s.options,title:s.options},p("span",{"aria-hidden":"true",class:m.handleHorizontal}))}_renderActionsMenu(t,e,s,i){const o=1===s&&this._getSingleActionButton(e),n=o?this._renderAction({item:t,action:o,singleAction:!0}):null,r=!o&&s?this._renderActionsMenuIcon(t,i):null;return r||o?p("div",{key:"actions-menu",class:T.actionsMenu},n,r):null}_renderItemMessage(t){return t.error?p("div",{key:"esri-table-list__error",class:T.message,role:"alert"},p("span",{"aria-hidden":"true",class:m.noticeTriangle}),this.messages.tableError):null}_renderItemStatus(t){const{visibleElements:e}=this;if(!e.statusIndicators)return null;const{publishing:s}=t;return p("span",{class:this.classes({[T.publishing]:s}),key:"layer-item-status"})}_renderItemContent(t,e){const{id:s}=this,i=`${`${s}_${t.uid}`}_actions`,o=this._filterActions(t.actionsSections),n=this._countActions(o);return[p("div",{key:"list-item-container",class:T.itemContainer},this._renderTitle(t,e),this._renderItemStatus(t),this._renderActionsMenu(t,o,n,i)),this._renderItemMessage(t),n?this._renderActionsSections(t,o,i):null]}_renderTitle(t,e){const{messages:s}=this,i=t.title||s.untitledTable;return p("span",{key:"layer-title-container",id:e,class:T.title},i)}_renderActionsSections(t,e,s){const i=e.toArray().map(((e,s)=>p("ul",{key:`${t}-action-section-${s}`,class:T.actionsList},this._renderActionSection(t,e))));return p("div",{role:"group","aria-expanded":t.actionsOpen?"true":"false",key:"actions-section",id:s,class:T.actions,hidden:!t.actionsOpen||null},i)}_renderActionSection(t,e){return(e&&e.toArray()).map((e=>this._renderAction({item:t,action:e})))}_renderActionIcon(t){const{active:e,className:s}=t,i=this._getIconImageStyles(t),o="button"!==t.type||t.image||s?s:m.defaultAction,n={[T.actionImage]:!e&&!!i["background-image"],[m.loadingIndicator]:e,[d.rotating]:e};return o&&!e&&(n[o]=!0),p("span",{key:"action-icon","aria-hidden":"true",class:this.classes(T.actionIcon,n),styles:i})}_renderActionTitle(t,e){return e?null:p("span",{key:"action-title",class:T.actionTitle},t)}_renderAction(t){const{item:e,action:s,singleAction:i}=t,{active:o,disabled:n,title:r}=s,a={[T.actionsMenuItem]:i&&"button"===s.type,[T.action]:o||!i&&"toggle"!==s.type,[T.actionToggle]:!o&&"toggle"===s.type,[T.actionToggleOn]:!o&&"toggle"===s.type&&s.value,[d.disabledElement]:n},l=[this._renderActionIcon(s),this._renderActionTitle(r,i)];return i?p("div",{bind:this,"data-item":e,"data-action":s,role:"button",key:`single-action-${s.uid}`,onclick:this._triggerAction,onkeydown:this._triggerAction,classes:a,tabIndex:0,title:r??void 0,"aria-label":r},l):p("li",{bind:this,"data-item":e,"data-action":s,key:`action-${s.uid}`,onclick:this._triggerAction,onkeydown:this._triggerAction,classes:a,tabIndex:0,role:"button",title:r??void 0,"aria-label":r},l)}_hasMessage(t){return!!t.error}_filterActions(t){return t.map((t=>t.filter((t=>t.visible))))}_setVisibleItems(t){this.visibleItems=t?.filter((t=>!t.hidden&&(this.visibleElements.errors||!t.error)))}_destroySortable(){const{_sortable:t}=this;t&&t.destroy(),this._sortable=null}_toggleSorting(){const{_sortable:t,_sortableNode:e,selectionEnabled:s}=this;if(e)if(t)t.option("disabled",!s);else{const t=I.create(e,{dataIdAttr:S,group:A,fallbackTolerance:4,disabled:!s,onSort:()=>this._sortTablesToItems(t.toArray()),chosenClass:T.itemChosen});this._sortable=t}}_sortNodeCreated(t){this._sortableNode=t,this._toggleSorting()}_sortTablesToItems(t){const e=this.map?.tables;e&&e.sort(((e,s)=>{const i=t.indexOf(e.uid),o=t.indexOf(s.uid);return i>o?-1:i<o?1:0}))}_getSingleActionButton(t){return t.reduce((t=>t)).filter((t=>t&&"button"===t.type)).at(0)}_focusListItem(t){const{_focusSortUid:e}=this;if(!t||!e)return;const s=O(t);s.layer?.uid===e&&(t.focus(),this._focusSortUid=null)}_watchActionSectionChanges(t){const e=()=>this.scheduleRender();this.addHandles(t.on("change",e),$.actionSection),t.forEach((t=>this._renderOnActionChanges(t)))}_renderOnActionChanges(t){const e=()=>this.scheduleRender();"toggle"!==t.type?"slider"!==t.type?this.addHandles(i((()=>[t.className,t.image,t.id,t.title,t.visible]),e,n),$.actions):this.addHandles(i((()=>[t.className,t.id,t.title,t.visible,t.value,t.displayValueEnabled,t.max,t.min,t.step]),e,n),$.actions):this.addHandles(i((()=>[t.className,t.image,t.id,t.title,t.visible,t.value]),e,n),$.actions)}_renderOnItemChanges(t){const e=()=>this.scheduleRender();this.addHandles([i((()=>[t.actionsOpen,t.title,t.error,t.publishing]),e,n),i((()=>[t.hidden,t.error]),(()=>this._setVisibleItems(this.tableItems))),t.actionsSections.on("change",e)],$.items),t.actionsSections.forEach((t=>this._watchActionSectionChanges(t)))}_itemsChanged(){const{tableItems:t}=this.viewModel;this._setVisibleItems(t),this.removeHandles($.actionSection),this.removeHandles($.actions),this.removeHandles($.items),t.forEach((t=>this._renderOnItemChanges(t))),this.scheduleRender()}_countActions(t){return t.reduce(((t,e)=>t+e.length),0)}_getIconImageStyles(t){const e="esri.support.Action.ActionButton"===t.declaredClass||"esri.support.Action.ActionToggle"===t.declaredClass?t.image:null;return{"background-image":e?`url("${e}")`:void 0}}_selectionKeydown(t){const e=["ArrowDown","ArrowUp"],i=s(t);if(!e.includes(i))return void this._toggleSelection(t);t.stopPropagation();const o=t.currentTarget["data-item"],{_sortable:n,selectedItems:r}=this;if(!n)return;const a=y(o,r),l=n.toArray(),c=t.target,d=l.indexOf(c.dataset[w]);if(-1!==d){if("ArrowDown"===i){const t=d+1;if(t>=l.length)return;a?(v(l,d,t),n.sort(l),this._sortTablesToItems(n.toArray()),this._focusSortUid=o.layer?.uid):(this._focusSortUid=o.layer?.uid,this.scheduleRender())}if("ArrowUp"===i){const t=d-1;if(t<=-1)return;a?(v(l,d,t),n.sort(l),this._sortTablesToItems(n.toArray()),this._focusSortUid=o.layer?.uid):(this._focusSortUid=o.layer?.uid,this.scheduleRender())}}}_toggleActionsOpen(t){const e=O(t.currentTarget),{actionsOpen:s}=e,i=!s;i&&this.tableItems.forEach((t=>M(t))),e.actionsOpen=i,t.stopPropagation()}_triggerAction(t){const e=t.currentTarget,s=j(e),i=O(e);"toggle"===s.type&&(s.value=!s.value),this.triggerAction(s,i),t.stopPropagation()}_toggleSelection(t){t.stopPropagation();const{multipleSelectionEnabled:e,selectedItems:s}=this,i=e&&(t.metaKey||t.ctrlKey),o=O(t.currentTarget),n=y(o,s),{length:r}=s;if(!i)return r&&!(n&&1===r)?(s.removeAll(),void s.add(o)):void(n?s.remove(n):s.add(o));n?s.remove(n):s.add(o)}get test(){return{visibleItems:this.visibleItems}}};function j(t){return t["data-action"]}function O(t){return t["data-item"]}t([r()],E.prototype,"visibleItems",void 0),t([r()],E.prototype,"iconClass",void 0),t([r()],E.prototype,"icon",void 0),t([r()],E.prototype,"label",null),t([r()],E.prototype,"listItemCreatedFunction",null),t([r()],E.prototype,"map",null),t([r(),h("esri/widgets/TableList/t9n/TableList")],E.prototype,"messages",void 0),t([r(),h("esri/t9n/common")],E.prototype,"messagesCommon",void 0),t([r()],E.prototype,"multipleSelectionEnabled",void 0),t([r()],E.prototype,"selectionEnabled",void 0),t([r()],E.prototype,"selectedItems",void 0),t([r({readOnly:!0})],E.prototype,"tableItems",null),t([g("trigger-action"),r({type:b})],E.prototype,"viewModel",void 0),t([r()],E.prototype,"visibleElements",void 0),t([a("visibleElements")],E.prototype,"castVisibleElements",null),t([u()],E.prototype,"_toggleActionsOpen",null),t([u()],E.prototype,"_triggerAction",null),t([u()],E.prototype,"_toggleSelection",null),E=t([l("esri.widgets.TableList")],E);const L=E;export{L as default};
+import{_ as t}from"../chunks/tslib.es6.js";import e from"../core/Collection.js";import{eventKey as s}from"../core/events.js";import{watch as i,on as o,initial as n}from"../core/reactiveUtils.js";import{property as r}from"../core/accessorSupport/decorators/property.js";import{cast as a}from"../core/accessorSupport/decorators/cast.js";import"../core/arrayUtils.js";import"../core/has.js";import{subclass as l}from"../core/accessorSupport/decorators/subclass.js";import c from"./Widget.js";import{globalCss as d}from"./support/globalCss.js";import{legacyIcon as m}from"./support/legacyIcon.js";import{accessibleHandler as u}from"./support/decorators/accessibleHandler.js";import{messageBundle as h}from"./support/decorators/messageBundle.js";import{vmEvent as g}from"./support/decorators/vmEvent.js";import{tsx as p}from"./support/jsxFactory.js";import"./support/widgetUtils.js";import _ from"./TableList/ListItem.js";import b from"./TableList/TableListViewModel.js";import{findSelectedItem as y}from"./TableList/support/tableListUtils.js";import I from"sortablejs";function v(t,e,s){t.splice(s,0,t.splice(e,1)[0])}const f=e.ofType(_),A="root-tables",S="data-layer-uid",w="layerUid",C="esri-table-list",T={base:C,widgetIcon:m.table,noItems:`${C}__no-items`,list:`${C}__list`,listRoot:`${C}__list--root`,item:`${C}__item`,itemChosen:`${C}__item--chosen`,itemMessage:`${C}__item--has-message`,itemSelectable:`${C}__item--selectable`,itemContainer:`${C}__item-container`,actionsMenu:`${C}__item-actions-menu`,actionsMenuItem:`${C}__item-actions-menu-item`,actionsMenuItemActive:`${C}__item-actions-menu-item--active`,actions:`${C}__item-actions`,actionsList:`${C}__item-actions-list`,action:`${C}__item-action`,actionIcon:`${C}__item-action-icon`,actionImage:`${C}__item-action-image`,actionTitle:`${C}__item-action-title`,actionToggle:`${C}__action-toggle`,actionToggleOn:`${C}__action-toggle--on`,message:`${C}__item-message`,title:`${C}__item-title`,publishing:`${C}__publishing`},$={actions:"actions",actionSection:"action-section",items:"items"};function M(t){const{actionsOpen:e}=t;e&&(t.actionsOpen=!1)}const k={statusIndicators:!0,errors:!1};let E=class extends c{constructor(t,e){super(t,e),this._sortable=null,this._sortableNode=null,this._focusSortUid=null,this.visibleItems=null,this.iconClass=T.widgetIcon,this.icon=null,this.messages=null,this.messagesCommon=null,this.multipleSelectionEnabled=!1,this.selectionEnabled=!1,this.selectedItems=new f,this.viewModel=new b,this.visibleElements={...k}}initialize(){this._setVisibleItems(this.tableItems),this.addHandles([i((()=>this.visibleElements),(()=>this._itemsChanged())),o((()=>this.viewModel.tableItems),"change",(()=>this._itemsChanged())),i((()=>this.selectionEnabled),(()=>this._toggleSorting()),n)])}destroy(){this._destroySortable()}get label(){return this.messages?.widgetLabel??""}set label(t){this._overrideIfSome("label",t)}get listItemCreatedFunction(){return this.viewModel.listItemCreatedFunction}set listItemCreatedFunction(t){this.viewModel.listItemCreatedFunction=t}get map(){return this.viewModel.map}set map(t){this.viewModel.map=t}get tableItems(){return this.viewModel.tableItems}castVisibleElements(t){return{...k,...t}}triggerAction(t,e){return this.viewModel.triggerAction(t,e)}render(){const{visibleItems:t}=this,e=this.viewModel?.state,s={[d.hidden]:"loading"===e,[d.disabled]:"disabled"===e};return p("div",{class:this.classes(T.base,d.widget,d.panel,s)},t?.length?this._renderList():this._renderNoItems())}_renderNoItems(){return p("div",{class:T.noItems},this.messages.noItemsToDisplay)}_renderList(){const{visibleItems:t,messages:e,selectionEnabled:s}=this;return p("ul",{afterCreate:this._sortNodeCreated,afterRemoved:this._destroySortable,"aria-label":e.widgetLabel,bind:this,class:this.classes(T.list,T.listRoot),"data-node-ref":"_sortableNode",role:s?"listbox":void 0},t?.map((t=>this._renderItem(t))).toArray())}_renderItem(t){const{id:e,selectionEnabled:s,selectedItems:i}=this,o=`${`${e}_${t.uid}`}__title`,n=this._hasMessage(t),r={[T.itemMessage]:!!n,[T.itemSelectable]:s};if(s){const e={[S]:t.layer?.uid};return p("li",{afterCreate:this._focusListItem,afterUpdate:this._focusListItem,"aria-labelledby":o,"aria-selected":y(t,i)?"true":"false",bind:this,class:this.classes(T.item,r),"data-item":t,key:`item-with-selection-${t.uid}`,onclick:this._toggleSelection,onkeydown:this._selectionKeydown,role:"option",tabIndex:0,...e},this._renderItemContent(t,o))}return p("li",{afterCreate:this._focusListItem,afterUpdate:this._focusListItem,"aria-labelledby":o,bind:this,class:this.classes(T.item,r),key:`item-no-selection-${t.uid}`},this._renderItemContent(t,o))}_renderActionsMenuIcon(t,e){const{messagesCommon:s}=this,i={[T.actionsMenuItemActive]:t.actionsOpen};return p("div",{"aria-controls":e,"aria-label":s.options,bind:this,class:this.classes(T.actionsMenuItem,i),"data-item":t,key:"actions-menu-toggle",onclick:this._toggleActionsOpen,onkeydown:this._toggleActionsOpen,role:"button",tabIndex:0,title:s.options},p("span",{"aria-hidden":"true",class:m.handleHorizontal}))}_renderActionsMenu(t,e,s,i){const o=1===s&&this._getSingleActionButton(e),n=o?this._renderAction({item:t,action:o,singleAction:!0}):null,r=!o&&s?this._renderActionsMenuIcon(t,i):null;return r||o?p("div",{class:T.actionsMenu,key:"actions-menu"},n,r):null}_renderItemMessage(t){return t.error?p("div",{class:T.message,key:"esri-table-list__error",role:"alert"},p("span",{"aria-hidden":"true",class:m.noticeTriangle}),this.messages.tableError):null}_renderItemStatus(t){const{visibleElements:e}=this;if(!e.statusIndicators)return null;const{publishing:s}=t;return p("span",{class:this.classes({[T.publishing]:s}),key:"layer-item-status"})}_renderItemContent(t,e){const{id:s}=this,i=`${`${s}_${t.uid}`}_actions`,o=this._filterActions(t.actionsSections),n=this._countActions(o);return[p("div",{class:T.itemContainer,key:"list-item-container"},this._renderTitle(t,e),this._renderItemStatus(t),this._renderActionsMenu(t,o,n,i)),this._renderItemMessage(t),n?this._renderActionsSections(t,o,i):null]}_renderTitle(t,e){const{messages:s}=this,i=t.title||s.untitledTable;return p("span",{class:T.title,id:e,key:"layer-title-container"},i)}_renderActionsSections(t,e,s){const i=e.toArray().map(((e,s)=>p("ul",{class:T.actionsList,key:`${t}-action-section-${s}`},this._renderActionSection(t,e))));return p("div",{"aria-expanded":t.actionsOpen?"true":"false",class:T.actions,hidden:!t.actionsOpen||null,id:s,key:"actions-section",role:"group"},i)}_renderActionSection(t,e){return(e&&e.toArray()).map((e=>this._renderAction({item:t,action:e})))}_renderActionIcon(t){const{active:e,className:s}=t,i=this._getIconImageStyles(t),o="button"!==t.type||t.image||s?s:m.defaultAction,n={[T.actionImage]:!e&&!!i["background-image"],[m.loadingIndicator]:e,[d.rotating]:e};return o&&!e&&(n[o]=!0),p("span",{"aria-hidden":"true",class:this.classes(T.actionIcon,n),key:"action-icon",styles:i})}_renderActionTitle(t,e){return e?null:p("span",{class:T.actionTitle,key:"action-title"},t)}_renderAction(t){const{item:e,action:s,singleAction:i}=t,{active:o,disabled:n,title:r}=s,a={[T.actionsMenuItem]:i&&"button"===s.type,[T.action]:o||!i&&"toggle"!==s.type,[T.actionToggle]:!o&&"toggle"===s.type,[T.actionToggleOn]:!o&&"toggle"===s.type&&s.value,[d.disabledElement]:n},l=[this._renderActionIcon(s),this._renderActionTitle(r,i)];return i?p("div",{"aria-label":r,bind:this,classes:a,"data-action":s,"data-item":e,key:`single-action-${s.uid}`,onclick:this._triggerAction,onkeydown:this._triggerAction,role:"button",tabIndex:0,title:r??void 0},l):p("li",{"aria-label":r,bind:this,classes:a,"data-action":s,"data-item":e,key:`action-${s.uid}`,onclick:this._triggerAction,onkeydown:this._triggerAction,role:"button",tabIndex:0,title:r??void 0},l)}_hasMessage(t){return!!t.error}_filterActions(t){return t.map((t=>t.filter((t=>t.visible))))}_setVisibleItems(t){this.visibleItems=t?.filter((t=>!t.hidden&&(this.visibleElements.errors||!t.error)))}_destroySortable(){const{_sortable:t}=this;t&&t.destroy(),this._sortable=null}_toggleSorting(){const{_sortable:t,_sortableNode:e,selectionEnabled:s}=this;if(e)if(t)t.option("disabled",!s);else{const t=I.create(e,{dataIdAttr:S,group:A,fallbackTolerance:4,disabled:!s,onSort:()=>this._sortTablesToItems(t.toArray()),chosenClass:T.itemChosen});this._sortable=t}}_sortNodeCreated(t){this._sortableNode=t,this._toggleSorting()}_sortTablesToItems(t){const e=this.map?.tables;e&&e.sort(((e,s)=>{const i=t.indexOf(e.uid),o=t.indexOf(s.uid);return i>o?-1:i<o?1:0}))}_getSingleActionButton(t){return t.reduce((t=>t)).filter((t=>t&&"button"===t.type)).at(0)}_focusListItem(t){const{_focusSortUid:e}=this;if(!t||!e)return;const s=O(t);s.layer?.uid===e&&(t.focus(),this._focusSortUid=null)}_watchActionSectionChanges(t){const e=()=>this.scheduleRender();this.addHandles(t.on("change",e),$.actionSection),t.forEach((t=>this._renderOnActionChanges(t)))}_renderOnActionChanges(t){const e=()=>this.scheduleRender();"toggle"!==t.type?"slider"!==t.type?this.addHandles(i((()=>[t.className,t.image,t.id,t.title,t.visible]),e,n),$.actions):this.addHandles(i((()=>[t.className,t.id,t.title,t.visible,t.value,t.displayValueEnabled,t.max,t.min,t.step]),e,n),$.actions):this.addHandles(i((()=>[t.className,t.image,t.id,t.title,t.visible,t.value]),e,n),$.actions)}_renderOnItemChanges(t){const e=()=>this.scheduleRender();this.addHandles([i((()=>[t.actionsOpen,t.title,t.error,t.publishing]),e,n),i((()=>[t.hidden,t.error]),(()=>this._setVisibleItems(this.tableItems))),t.actionsSections.on("change",e)],$.items),t.actionsSections.forEach((t=>this._watchActionSectionChanges(t)))}_itemsChanged(){const{tableItems:t}=this.viewModel;this._setVisibleItems(t),this.removeHandles($.actionSection),this.removeHandles($.actions),this.removeHandles($.items),t.forEach((t=>this._renderOnItemChanges(t))),this.scheduleRender()}_countActions(t){return t.reduce(((t,e)=>t+e.length),0)}_getIconImageStyles(t){const e="esri.support.Action.ActionButton"===t.declaredClass||"esri.support.Action.ActionToggle"===t.declaredClass?t.image:null;return{"background-image":e?`url("${e}")`:void 0}}_selectionKeydown(t){const e=["ArrowDown","ArrowUp"],i=s(t);if(!e.includes(i))return void this._toggleSelection(t);t.stopPropagation();const o=t.currentTarget["data-item"],{_sortable:n,selectedItems:r}=this;if(!n)return;const a=y(o,r),l=n.toArray(),c=t.target,d=l.indexOf(c.dataset[w]);if(-1!==d){if("ArrowDown"===i){const t=d+1;if(t>=l.length)return;a?(v(l,d,t),n.sort(l),this._sortTablesToItems(n.toArray()),this._focusSortUid=o.layer?.uid):(this._focusSortUid=o.layer?.uid,this.scheduleRender())}if("ArrowUp"===i){const t=d-1;if(t<=-1)return;a?(v(l,d,t),n.sort(l),this._sortTablesToItems(n.toArray()),this._focusSortUid=o.layer?.uid):(this._focusSortUid=o.layer?.uid,this.scheduleRender())}}}_toggleActionsOpen(t){const e=O(t.currentTarget),{actionsOpen:s}=e,i=!s;i&&this.tableItems.forEach((t=>M(t))),e.actionsOpen=i,t.stopPropagation()}_triggerAction(t){const e=t.currentTarget,s=j(e),i=O(e);"toggle"===s.type&&(s.value=!s.value),this.triggerAction(s,i),t.stopPropagation()}_toggleSelection(t){t.stopPropagation();const{multipleSelectionEnabled:e,selectedItems:s}=this,i=e&&(t.metaKey||t.ctrlKey),o=O(t.currentTarget),n=y(o,s),{length:r}=s;if(!i)return r&&!(n&&1===r)?(s.removeAll(),void s.add(o)):void(n?s.remove(n):s.add(o));n?s.remove(n):s.add(o)}get test(){return{visibleItems:this.visibleItems}}};function j(t){return t["data-action"]}function O(t){return t["data-item"]}t([r()],E.prototype,"visibleItems",void 0),t([r()],E.prototype,"iconClass",void 0),t([r()],E.prototype,"icon",void 0),t([r()],E.prototype,"label",null),t([r()],E.prototype,"listItemCreatedFunction",null),t([r()],E.prototype,"map",null),t([r(),h("esri/widgets/TableList/t9n/TableList")],E.prototype,"messages",void 0),t([r(),h("esri/t9n/common")],E.prototype,"messagesCommon",void 0),t([r()],E.prototype,"multipleSelectionEnabled",void 0),t([r()],E.prototype,"selectionEnabled",void 0),t([r()],E.prototype,"selectedItems",void 0),t([r({readOnly:!0})],E.prototype,"tableItems",null),t([g("trigger-action"),r({type:b})],E.prototype,"viewModel",void 0),t([r()],E.prototype,"visibleElements",void 0),t([a("visibleElements")],E.prototype,"castVisibleElements",null),t([u()],E.prototype,"_toggleActionsOpen",null),t([u()],E.prototype,"_triggerAction",null),t([u()],E.prototype,"_toggleSelection",null),E=t([l("esri.widgets.TableList")],E);const L=E;export{L as default};

package/widgets/TimeSlider.js

@@ -2,4 +2,4 @@
 All material copyright ESRI, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.28/esri/copyright.txt for details.
 */
-import{_ as t}from"../chunks/tslib.es6.js";import e from"../TimeInterval.js";import{equals as i}from"../core/arrayUtils.js";import{neverReached as s}from"../core/compilerUtils.js";import{watch as o,initial as a}from"../core/reactiveUtils.js";import{truncateDate as n,offsetDate as r}from"../core/timeUtils.js";import{property as l}from"../core/accessorSupport/decorators/property.js";import"../core/accessorSupport/ensureType.js";import{subclass as m}from"../core/accessorSupport/decorators/subclass.js";import{formatDate as u,convertDateFormatToIntlOptions as d}from"../intl/date.js";import c from"./Slider.js";import p from"./Widget.js";import{loadCalciteComponents as h}from"./support/componentsUtils.js";import{globalCss as v}from"./support/globalCss.js";import{legacyIcon as f}from"./support/legacyIcon.js";import{accessibleHandler as y}from"./support/decorators/accessibleHandler.js";import{messageBundle as g}from"./support/decorators/messageBundle.js";import{vmEvent as b}from"./support/decorators/vmEvent.js";import{tsx as x}from"./support/jsxFactory.js";import{onResize as w}from"./support/widgetUtils.js";import{getCalciteThemeClass as k}from"../support/themeUtils.js";import{css as j}from"./TimeSlider/css.js";import T from"./TimeSlider/TimeSliderViewModel.js";const _=3,E=858,M=[{minor:{value:100,unit:"milliseconds"},major:{value:1,unit:"seconds"},format:{second:"numeric"}},{minor:{value:500,unit:"milliseconds"},major:{value:5,unit:"seconds"},format:{second:"numeric"}},{minor:{value:1,unit:"seconds"},major:{value:20,unit:"seconds"},format:{minute:"numeric",second:"numeric"}},{minor:{value:2,unit:"seconds"},major:{value:30,unit:"seconds"},format:{minute:"numeric",second:"numeric"}},{minor:{value:10,unit:"seconds"},major:{value:1,unit:"minutes"},format:{minute:"numeric"}},{minor:{value:15,unit:"seconds"},major:{value:5,unit:"minutes"},format:{hour:"numeric",minute:"numeric"}},{minor:{value:1,unit:"minutes"},major:{value:20,unit:"minutes"},format:{hour:"numeric",minute:"numeric"}},{minor:{value:5,unit:"minutes"},major:{value:2,unit:"hours"},format:{hour:"numeric",minute:"numeric"}},{minor:{value:15,unit:"minutes"},major:{value:6,unit:"hours"},format:{hour:"numeric",minute:"numeric"}},{minor:{value:1,unit:"hours"},major:{value:1,unit:"days"},format:{day:"numeric",month:"short"}},{minor:{value:6,unit:"hours"},major:{value:1,unit:"weeks"},format:{day:"numeric",month:"short"}},{minor:{value:1,unit:"days"},major:{value:1,unit:"months"},format:{month:"long"}},{minor:{value:2,unit:"days"},major:{value:1,unit:"months"},format:{month:"short"}},{minor:{value:3,unit:"days"},major:{value:1,unit:"months"},format:{month:"short"}},{minor:{value:4,unit:"days"},major:{value:3,unit:"months"},format:{month:"short",year:"numeric"}},{minor:{value:1,unit:"weeks"},major:{value:1,unit:"years"},format:{year:"numeric"}},{minor:{value:1,unit:"months"},major:{value:1,unit:"years"},format:{year:"numeric"}},{minor:{value:2,unit:"months"},major:{value:2,unit:"years"},format:{year:"numeric"}},{minor:{value:1,unit:"years"},major:{value:1,unit:"decades"},format:{year:"numeric"}},{minor:{value:2,unit:"years"},major:{value:5,unit:"decades"},format:{year:"numeric"}},{minor:{value:5,unit:"decades"},major:{value:10,unit:"centuries"},format:{era:"short",year:"numeric"}},{minor:{value:1,unit:"centuries"},major:{value:10,unit:"centuries"},format:{era:"short",year:"numeric"}},{minor:{value:2,unit:"centuries"},major:{value:20,unit:"centuries"},format:{era:"short",year:"numeric"}},{minor:{value:5,unit:"centuries"},major:{value:50,unit:"centuries"},format:{era:"short",year:"numeric"}},{minor:{value:10,unit:"centuries"},major:{value:100,unit:"centuries"},format:{era:"short",year:"numeric"}},{minor:{value:20,unit:"centuries"},major:{value:200,unit:"centuries"},format:{era:"short",year:"numeric"}},{minor:{value:50,unit:"centuries"},major:{value:500,unit:"centuries"},format:{era:"short",year:"numeric"}},{minor:{value:100,unit:"centuries"},major:{value:1e3,unit:"centuries"},format:{era:"short",year:"numeric"}},{minor:{value:200,unit:"centuries"},major:{value:1e3,unit:"centuries"},format:{era:"short",year:"numeric"}},{minor:{value:500,unit:"centuries"},major:{value:5e3,unit:"centuries"},format:{era:"short",year:"numeric"}},{minor:{value:1e3,unit:"centuries"},major:{value:1e4,unit:"centuries"},format:{era:"short",year:"numeric"}}];let S=class extends p{constructor(t,e){super(t,e),this._ignoreNextSliderUpdate=!1,this._slider=new c({precision:0,visibleElements:{rangeLabels:!1},rangeLabelInputsEnabled:!1,thumbsConstrained:!1}),this._tickFormat=null,this.disabled=!1,this.iconClass=j.widgetIcon,this.icon=null,this.labelFormatFunction=null,this.messages=null,this.messagesCommon=null,this.tickConfigs=null,this.timeVisible=!1,this.viewModel=new T}initialize(){this.addHandles([o((()=>this._slider.values),(t=>{if(this._ignoreNextSliderUpdate)return void(this._ignoreNextSliderUpdate=!1);const e=this.viewModel.valuesToTimeExtent(t);null!=this.timeExtent?null!=e?this.timeExtent.equals(e)||(this.timeExtent=e):this.timeExtent=null:null!=e&&(this.timeExtent=e)})),o((()=>this.effectiveStops),(()=>this._updateSliderSteps()),a)])}loadDependencies(){return h({action:()=>import("@esri/calcite-components/dist/components/calcite-action.js"),"action-menu":()=>import("@esri/calcite-components/dist/components/calcite-action-menu.js")})}destroy(){this._slider.destroy(),this._tickFormat=null}get _dateFormat(){return this._getIntlOptions("short-date")}get _timeFormat(){return this._getIntlOptions("long-time")}get actions(){return this.viewModel.actions}set actions(t){this.viewModel.actions=t}get effectiveStops(){return this.viewModel.effectiveStops}get fullTimeExtent(){return this.viewModel.fullTimeExtent}set fullTimeExtent(t){this.viewModel.fullTimeExtent=t}get interactive(){return!this.disabled&&"disabled"!==this.viewModel?.state}get label(){return this.messages?.widgetLabel??""}set label(t){this._overrideIfSome("label",t)}set layout(t){["auto","compact","wide"].includes(t)||(t="auto"),this._set("layout",t)}get loop(){return this.viewModel.loop}set loop(t){this.viewModel.loop=t}get mode(){return this.viewModel.mode}set mode(t){this.viewModel.mode=t}get playRate(){return this.viewModel.playRate}set playRate(t){this.viewModel.playRate=t}get stops(){return this.viewModel.stops}set stops(t){this.viewModel.stops=t}get tickFormats(){const{timeZone:t}=this;return M.map((({minor:i,major:s,format:o})=>({minor:new e(i),major:new e(s),format:{...o,timeZone:t}})))}get timeExtent(){return this.viewModel.timeExtent}set timeExtent(t){this.viewModel.timeExtent=t}get timeZone(){return this.viewModel.view?.timeZone??"system"}set timeZone(t){this._overrideIfSome("timeZone",t)}get view(){return this.viewModel.view}set view(t){this.viewModel.view=t}static async getPropertiesFromWebMap(t,e){return T.getPropertiesFromWebMap(t,e)}next(){return this.viewModel.next()}play(){return this.viewModel.play()}previous(){return this.viewModel.previous()}stop(){return this.viewModel.stop()}render(){const{_slider:t,actions:e,domNode:s,effectiveStops:o,fullTimeExtent:a,interactive:n,messages:r,messagesCommon:l,mode:m,tickConfigs:d,timeExtent:c,timeVisible:p,viewModel:{state:h,timeExtentValues:y}}=this;if(null!=a){const{start:e,end:i}=a;if(null!=e&&null!=i){const s=e.getTime(),o=i.getTime(),a=t.min!==s||t.max!==o;if(a&&(t.min=s,t.max=o),null!=d)t.tickConfigs!==d&&(t.tickConfigs=d);else{const e=(o-s)/(t.trackElement?.offsetWidth||400),i=this.tickFormats.find((t=>t.minor.toMilliseconds()>_*e))??this.tickFormats.at(-1),n=this._tickFormat!==i&&null!=i;if(n&&(this._tickFormat=i),a||n){const e={mode:"position",values:this._getTickPositions(i.minor),labelsVisible:!1,tickCreatedFunction:(t,e)=>{e?.classList.add(j.sliderMinorTick)}},s={mode:"position",values:this._getTickPositions(i.major),labelsVisible:!0,tickCreatedFunction:(t,e)=>{e?.classList.add(j.sliderMajorTick)},labelFormatFunction:t=>u(t,i.format)};t.tickConfigs=[e,s]}}}}const g=null==this.fullTimeExtent||null==this.fullTimeExtent.start||null==this.fullTimeExtent.end||null==this.timeExtent||this.timeExtent.isAllTime||this.timeExtent.isEmpty||null!=this.timeExtent.start&&(this.timeExtent.start<this.fullTimeExtent.start||this.timeExtent.start>this.fullTimeExtent.end)||null!=this.timeExtent.end&&(this.timeExtent.end>this.fullTimeExtent.end||this.timeExtent.end<this.fullTimeExtent.start);if(g)switch(this._ignoreNextSliderUpdate=!0,m){case"time-window":t.values=[t.min,t.max];break;case"instant":case"cumulative-from-end":t.values=[t.min];break;case"cumulative-from-start":t.values=[t.max]}else null!=y?i(t.values,y)||(t.values=y):t.values=null;t.disabled=!n;const b="ready"===h,T="playing"===h,M=g||!n||null==o||0===o.length,S="auto"===this.layout?s.clientWidth<E?"compact":"wide":this.layout,F=x("div",{class:j.animation},x("button",{"aria-disabled":M?"true":"false","aria-label":T?l.control.stop:l.control.play,bind:this,class:this.classes(v.widgetButton,j.animationButton,M&&v.buttonDisabled),disabled:M,title:T?l.control.stop:l.control.play,onclick:this._playOrStopClick,type:"button"},x("div",{class:this.classes((b||M)&&f.play,T&&f.pause)}))),C=null!=this.labelFormatFunction?x("div",{key:"extent",bind:this,class:j.timeExtentDate,"data-type":"extent","data-layout":S,"data-date":c?[c.start,c.end]:null,afterCreate:this._createLabel,afterUpdate:this._createLabel}):null==c||null!=c&&c.isAllTime?[x("div",{class:this.classes(j.warning,f.noticeTriangle)}),x("div",{key:"warning-text",class:j.warningText},r.noTimeExtent)]:c.isEmpty?[x("div",{class:this.classes(j.warning,f.noticeTriangle)}),x("div",{key:"warning-text",class:j.warningText},r.emptyTimeExtent)]:[null!=c.start&&x("div",{key:"start-date-group",class:j.timeExtentGroup},x("div",{key:"start-date",class:j.timeExtentDate},this._formatDate(c.start)),p&&x("div",{key:"start-time",class:j.timeExtentTime},this._formatTime(c.start))),null!=c.start&&null!=c.end&&c.start.getTime()!==c.end.getTime()&&x("div",{key:"separator",class:j.timeExtentSeparator},"–"),null!=c.end&&(null==c.start||c.start.getTime()!==c.end.getTime())&&x("div",{key:"end-date-group",class:j.timeExtentGroup},x("div",{key:"end-date",class:j.timeExtentDate},this._formatDate(c.end)),p&&x("div",{key:"end-time",class:j.timeExtentTime},this._formatTime(c.end)))],D=x("div",{class:this.classes(j.timeExtent,!n&&v.buttonDisabled)},[C]),L=null!=this.labelFormatFunction?x("div",{key:"min-date",bind:this,class:j.minDate,"data-date":a?.start,"data-type":"min","data-layout":S,afterCreate:this._createLabel,afterUpdate:this._createLabel}):null!=a&&null!=a.start&&[x("div",{key:"min-date",class:j.minDate},this._formatDate(a.start)),p&&x("div",{key:"min-time",class:j.minTime},this._formatTime(a.start))],U=x("div",{class:this.classes(j.min,!n&&v.buttonDisabled)},[L]),Z=x("div",{class:j.slider},t.render()),R=null!=this.labelFormatFunction?x("div",{key:"max-date",bind:this,class:j.maxDate,"data-date":a?.end,"data-type":"max","data-layout":S,afterCreate:this._createLabel,afterUpdate:this._createLabel}):null!=a&&null!=a.end&&[x("div",{key:"max-date",class:j.maxDate},this._formatDate(a.end)),p&&x("div",{key:"max-time",class:j.maxTime},this._formatTime(a.end))],B=x("div",{class:this.classes(j.max,!n&&v.buttonDisabled)},[R]),I=x("div",{class:j.previous},x("button",{"aria-disabled":M?"true":"false","aria-label":l.pagination.previous,bind:this,class:this.classes(v.widgetButton,j.previousButton,(T||M)&&v.buttonDisabled),disabled:M,title:l.pagination.previous,onclick:this._previousClick,type:"button"},x("div",{class:f.reverse}))),O=x("div",{class:j.next},x("button",{"aria-disabled":M?"true":"false","aria-label":l.pagination.next,bind:this,class:this.classes(v.widgetButton,j.nextButton,(T||M)&&v.buttonDisabled),disabled:M,title:l.pagination.next,onclick:this._nextClick,type:"button"},x("div",{class:f.forward}))),A=e?.length>0,V=A&&x("div",{class:j.actions,title:l.options},x("calcite-action-menu",{label:l.options,class:j.actionsButton},e.toArray().map((t=>x("calcite-action",{bind:this,icon:t.icon,id:t.id,onclick:()=>this.viewModel.triggerAction(t),text:t.title,textEnabled:!0})))));return x("div",{class:this.classes(j.timeSlider,v.widget,`${j.timeSliderMode}${m}`,`${j.timeSliderLayout}${S}`,!n&&v.disabled,g&&j.timeSliderOutOfBounds,A&&j.hasActions,k()),afterCreate:t=>{this.addHandles(w(t,(()=>this.scheduleRender())))},"aria-label":r.widgetLabel},"wide"===S&&x("div",{class:j.timeSliderRow},x("div",{class:j.playbackControls},[F,D,U,Z,B,I,O]),V),"compact"===S&&[x("div",{key:"time-slider-row-1",class:j.timeSliderRow},[D,V]),x("div",{key:"time-slider-row-2",class:j.timeSliderRow},[Z]),x("div",{key:"time-slider-row-3",class:j.timeSliderRow},[U,I,F,O,B])])}updateWebDocument(t){this.viewModel?.updateWebDocument(t)}_createLabel(t){if(null==this.labelFormatFunction)return;const e=t.getAttribute("data-type"),i=t.getAttribute("data-layout"),s=t["data-date"];this.labelFormatFunction(s,e,t,i)}_formatDate(t){return u(t,this._dateFormat)}_formatTime(t){return u(t,this._timeFormat)}_getIntlOptions(t){const{timeZone:e}=this;return{...d(t),timeZone:e}}_getTickPositions(t){const{fullTimeExtent:e}=this;if(null==e||null==e.start||null==e.end)return[];const{start:i,end:s}=e,o=[],{value:a,unit:l}=t;let m=n(i,l,this.timeZone);for(;m.getTime()<=s.getTime();)m.getTime()>=i.getTime()&&o.push(m.getTime()),m=r(m,a,l,this.timeZone);return o}_updateSliderSteps(){this._slider.steps=null!=this.effectiveStops&&this.effectiveStops.length>0?this.effectiveStops.map((t=>t.getTime())):null}_playOrStopClick(){switch(this.viewModel.state){case"ready":this.viewModel.play();break;case"playing":this.viewModel.stop();break;case"disabled":break;default:s(this.viewModel.state)}}_previousClick(){this.viewModel.previous()}_nextClick(){this.viewModel.next()}};t([l()],S.prototype,"_dateFormat",null),t([l()],S.prototype,"_timeFormat",null),t([l()],S.prototype,"actions",null),t([l()],S.prototype,"disabled",void 0),t([l()],S.prototype,"effectiveStops",null),t([l()],S.prototype,"fullTimeExtent",null),t([l()],S.prototype,"iconClass",void 0),t([l()],S.prototype,"icon",void 0),t([l({readOnly:!0})],S.prototype,"interactive",null),t([l()],S.prototype,"label",null),t([l()],S.prototype,"labelFormatFunction",void 0),t([l({value:"auto"})],S.prototype,"layout",null),t([l()],S.prototype,"loop",null),t([l(),g("esri/widgets/TimeSlider/t9n/TimeSlider")],S.prototype,"messages",void 0),t([l(),g("esri/t9n/common")],S.prototype,"messagesCommon",void 0),t([l()],S.prototype,"mode",null),t([l()],S.prototype,"playRate",null),t([l()],S.prototype,"stops",null),t([l()],S.prototype,"tickConfigs",void 0),t([l()],S.prototype,"tickFormats",null),t([l()],S.prototype,"timeExtent",null),t([l({nonNullable:!0})],S.prototype,"timeVisible",void 0),t([l()],S.prototype,"timeZone",null),t([l()],S.prototype,"view",null),t([l({type:T}),b("trigger-action")],S.prototype,"viewModel",void 0),t([y()],S.prototype,"_playOrStopClick",null),t([y()],S.prototype,"_previousClick",null),t([y()],S.prototype,"_nextClick",null),S=t([m("esri.widgets.TimeSlider")],S);const F=S;export{F as default};
+import{_ as t}from"../chunks/tslib.es6.js";import e from"../TimeInterval.js";import{equals as i}from"../core/arrayUtils.js";import{neverReached as s}from"../core/compilerUtils.js";import{watch as o,initial as a}from"../core/reactiveUtils.js";import{truncateDate as n,offsetDate as r}from"../core/timeUtils.js";import{property as l}from"../core/accessorSupport/decorators/property.js";import"../core/accessorSupport/ensureType.js";import{subclass as m}from"../core/accessorSupport/decorators/subclass.js";import{formatDate as u,convertDateFormatToIntlOptions as d}from"../intl/date.js";import c from"./Slider.js";import p from"./Widget.js";import{loadCalciteComponents as h}from"./support/componentsUtils.js";import{globalCss as v}from"./support/globalCss.js";import{legacyIcon as f}from"./support/legacyIcon.js";import{accessibleHandler as y}from"./support/decorators/accessibleHandler.js";import{messageBundle as g}from"./support/decorators/messageBundle.js";import{vmEvent as b}from"./support/decorators/vmEvent.js";import{tsx as x}from"./support/jsxFactory.js";import{onResize as w}from"./support/widgetUtils.js";import{getCalciteThemeClass as k}from"../support/themeUtils.js";import{css as j}from"./TimeSlider/css.js";import T from"./TimeSlider/TimeSliderViewModel.js";const _=3,E=858,M=[{minor:{value:100,unit:"milliseconds"},major:{value:1,unit:"seconds"},format:{second:"numeric"}},{minor:{value:500,unit:"milliseconds"},major:{value:5,unit:"seconds"},format:{second:"numeric"}},{minor:{value:1,unit:"seconds"},major:{value:20,unit:"seconds"},format:{minute:"numeric",second:"numeric"}},{minor:{value:2,unit:"seconds"},major:{value:30,unit:"seconds"},format:{minute:"numeric",second:"numeric"}},{minor:{value:10,unit:"seconds"},major:{value:1,unit:"minutes"},format:{minute:"numeric"}},{minor:{value:15,unit:"seconds"},major:{value:5,unit:"minutes"},format:{hour:"numeric",minute:"numeric"}},{minor:{value:1,unit:"minutes"},major:{value:20,unit:"minutes"},format:{hour:"numeric",minute:"numeric"}},{minor:{value:5,unit:"minutes"},major:{value:2,unit:"hours"},format:{hour:"numeric",minute:"numeric"}},{minor:{value:15,unit:"minutes"},major:{value:6,unit:"hours"},format:{hour:"numeric",minute:"numeric"}},{minor:{value:1,unit:"hours"},major:{value:1,unit:"days"},format:{day:"numeric",month:"short"}},{minor:{value:6,unit:"hours"},major:{value:1,unit:"weeks"},format:{day:"numeric",month:"short"}},{minor:{value:1,unit:"days"},major:{value:1,unit:"months"},format:{month:"long"}},{minor:{value:2,unit:"days"},major:{value:1,unit:"months"},format:{month:"short"}},{minor:{value:3,unit:"days"},major:{value:1,unit:"months"},format:{month:"short"}},{minor:{value:4,unit:"days"},major:{value:3,unit:"months"},format:{month:"short",year:"numeric"}},{minor:{value:1,unit:"weeks"},major:{value:1,unit:"years"},format:{year:"numeric"}},{minor:{value:1,unit:"months"},major:{value:1,unit:"years"},format:{year:"numeric"}},{minor:{value:2,unit:"months"},major:{value:2,unit:"years"},format:{year:"numeric"}},{minor:{value:1,unit:"years"},major:{value:1,unit:"decades"},format:{year:"numeric"}},{minor:{value:2,unit:"years"},major:{value:5,unit:"decades"},format:{year:"numeric"}},{minor:{value:5,unit:"decades"},major:{value:10,unit:"centuries"},format:{era:"short",year:"numeric"}},{minor:{value:1,unit:"centuries"},major:{value:10,unit:"centuries"},format:{era:"short",year:"numeric"}},{minor:{value:2,unit:"centuries"},major:{value:20,unit:"centuries"},format:{era:"short",year:"numeric"}},{minor:{value:5,unit:"centuries"},major:{value:50,unit:"centuries"},format:{era:"short",year:"numeric"}},{minor:{value:10,unit:"centuries"},major:{value:100,unit:"centuries"},format:{era:"short",year:"numeric"}},{minor:{value:20,unit:"centuries"},major:{value:200,unit:"centuries"},format:{era:"short",year:"numeric"}},{minor:{value:50,unit:"centuries"},major:{value:500,unit:"centuries"},format:{era:"short",year:"numeric"}},{minor:{value:100,unit:"centuries"},major:{value:1e3,unit:"centuries"},format:{era:"short",year:"numeric"}},{minor:{value:200,unit:"centuries"},major:{value:1e3,unit:"centuries"},format:{era:"short",year:"numeric"}},{minor:{value:500,unit:"centuries"},major:{value:5e3,unit:"centuries"},format:{era:"short",year:"numeric"}},{minor:{value:1e3,unit:"centuries"},major:{value:1e4,unit:"centuries"},format:{era:"short",year:"numeric"}}];let S=class extends p{constructor(t,e){super(t,e),this._ignoreNextSliderUpdate=!1,this._slider=new c({precision:0,visibleElements:{rangeLabels:!1},rangeLabelInputsEnabled:!1,thumbsConstrained:!1}),this._tickFormat=null,this.disabled=!1,this.iconClass=j.widgetIcon,this.icon=null,this.labelFormatFunction=null,this.messages=null,this.messagesCommon=null,this.tickConfigs=null,this.timeVisible=!1,this.viewModel=new T}initialize(){this.addHandles([o((()=>this._slider.values),(t=>{if(this._ignoreNextSliderUpdate)return void(this._ignoreNextSliderUpdate=!1);const e=this.viewModel.valuesToTimeExtent(t);null!=this.timeExtent?null!=e?this.timeExtent.equals(e)||(this.timeExtent=e):this.timeExtent=null:null!=e&&(this.timeExtent=e)})),o((()=>this.effectiveStops),(()=>this._updateSliderSteps()),a)])}loadDependencies(){return h({action:()=>import("@esri/calcite-components/dist/components/calcite-action.js"),"action-menu":()=>import("@esri/calcite-components/dist/components/calcite-action-menu.js")})}destroy(){this._slider.destroy(),this._tickFormat=null}get _dateFormat(){return this._getIntlOptions("short-date")}get _timeFormat(){return this._getIntlOptions("long-time")}get actions(){return this.viewModel.actions}set actions(t){this.viewModel.actions=t}get effectiveStops(){return this.viewModel.effectiveStops}get fullTimeExtent(){return this.viewModel.fullTimeExtent}set fullTimeExtent(t){this.viewModel.fullTimeExtent=t}get interactive(){return!this.disabled&&"disabled"!==this.viewModel?.state}get label(){return this.messages?.widgetLabel??""}set label(t){this._overrideIfSome("label",t)}set layout(t){["auto","compact","wide"].includes(t)||(t="auto"),this._set("layout",t)}get loop(){return this.viewModel.loop}set loop(t){this.viewModel.loop=t}get mode(){return this.viewModel.mode}set mode(t){this.viewModel.mode=t}get playRate(){return this.viewModel.playRate}set playRate(t){this.viewModel.playRate=t}get stops(){return this.viewModel.stops}set stops(t){this.viewModel.stops=t}get tickFormats(){const{timeZone:t}=this;return M.map((({minor:i,major:s,format:o})=>({minor:new e(i),major:new e(s),format:{...o,timeZone:t}})))}get timeExtent(){return this.viewModel.timeExtent}set timeExtent(t){this.viewModel.timeExtent=t}get timeZone(){return this.viewModel.view?.timeZone??"system"}set timeZone(t){this._overrideIfSome("timeZone",t)}get view(){return this.viewModel.view}set view(t){this.viewModel.view=t}static async getPropertiesFromWebMap(t,e){return T.getPropertiesFromWebMap(t,e)}next(){return this.viewModel.next()}play(){return this.viewModel.play()}previous(){return this.viewModel.previous()}stop(){return this.viewModel.stop()}render(){const{_slider:t,actions:e,domNode:s,effectiveStops:o,fullTimeExtent:a,interactive:n,messages:r,messagesCommon:l,mode:m,tickConfigs:d,timeExtent:c,timeVisible:p,viewModel:{state:h,timeExtentValues:y}}=this;if(null!=a){const{start:e,end:i}=a;if(null!=e&&null!=i){const s=e.getTime(),o=i.getTime(),a=t.min!==s||t.max!==o;if(a&&(t.min=s,t.max=o),null!=d)t.tickConfigs!==d&&(t.tickConfigs=d);else{const e=(o-s)/(t.trackElement?.offsetWidth||400),i=this.tickFormats.find((t=>t.minor.toMilliseconds()>_*e))??this.tickFormats.at(-1),n=this._tickFormat!==i&&null!=i;if(n&&(this._tickFormat=i),a||n){const e={mode:"position",values:this._getTickPositions(i.minor),labelsVisible:!1,tickCreatedFunction:(t,e)=>{e?.classList.add(j.sliderMinorTick)}},s={mode:"position",values:this._getTickPositions(i.major),labelsVisible:!0,tickCreatedFunction:(t,e)=>{e?.classList.add(j.sliderMajorTick)},labelFormatFunction:t=>u(t,i.format)};t.tickConfigs=[e,s]}}}}const g=null==this.fullTimeExtent||null==this.fullTimeExtent.start||null==this.fullTimeExtent.end||null==this.timeExtent||this.timeExtent.isAllTime||this.timeExtent.isEmpty||null!=this.timeExtent.start&&(this.timeExtent.start<this.fullTimeExtent.start||this.timeExtent.start>this.fullTimeExtent.end)||null!=this.timeExtent.end&&(this.timeExtent.end>this.fullTimeExtent.end||this.timeExtent.end<this.fullTimeExtent.start);if(g)switch(this._ignoreNextSliderUpdate=!0,m){case"time-window":t.values=[t.min,t.max];break;case"instant":case"cumulative-from-end":t.values=[t.min];break;case"cumulative-from-start":t.values=[t.max]}else null!=y?i(t.values,y)||(t.values=y):t.values=null;t.disabled=!n;const b="ready"===h,T="playing"===h,M=g||!n||null==o||0===o.length,S="auto"===this.layout?s.clientWidth<E?"compact":"wide":this.layout,F=x("div",{class:j.animation},x("button",{"aria-disabled":M?"true":"false","aria-label":T?l.control.stop:l.control.play,bind:this,class:this.classes(v.widgetButton,j.animationButton,M&&v.buttonDisabled),disabled:M,onclick:this._playOrStopClick,title:T?l.control.stop:l.control.play,type:"button"},x("div",{class:this.classes((b||M)&&f.play,T&&f.pause)}))),C=null!=this.labelFormatFunction?x("div",{afterCreate:this._createLabel,afterUpdate:this._createLabel,bind:this,class:j.timeExtentDate,"data-date":c?[c.start,c.end]:null,"data-layout":S,"data-type":"extent",key:"extent"}):null==c||null!=c&&c.isAllTime?[x("div",{class:this.classes(j.warning,f.noticeTriangle)}),x("div",{class:j.warningText,key:"warning-text"},r.noTimeExtent)]:c.isEmpty?[x("div",{class:this.classes(j.warning,f.noticeTriangle)}),x("div",{class:j.warningText,key:"warning-text"},r.emptyTimeExtent)]:[null!=c.start&&x("div",{class:j.timeExtentGroup,key:"start-date-group"},x("div",{class:j.timeExtentDate,key:"start-date"},this._formatDate(c.start)),p?x("div",{class:j.timeExtentTime,key:"start-time"},this._formatTime(c.start)):null),null!=c.start&&null!=c.end&&c.start.getTime()!==c.end.getTime()&&x("div",{class:j.timeExtentSeparator,key:"separator"},"–"),null!=c.end&&(null==c.start||c.start.getTime()!==c.end.getTime())&&x("div",{class:j.timeExtentGroup,key:"end-date-group"},x("div",{class:j.timeExtentDate,key:"end-date"},this._formatDate(c.end)),p?x("div",{class:j.timeExtentTime,key:"end-time"},this._formatTime(c.end)):null)],D=x("div",{class:this.classes(j.timeExtent,!n&&v.buttonDisabled)},[C]),L=null!=this.labelFormatFunction?x("div",{afterCreate:this._createLabel,afterUpdate:this._createLabel,bind:this,class:j.minDate,"data-date":a?.start,"data-layout":S,"data-type":"min",key:"min-date"}):null!=a&&null!=a.start&&[x("div",{class:j.minDate,key:"min-date"},this._formatDate(a.start)),p&&x("div",{class:j.minTime,key:"min-time"},this._formatTime(a.start))],U=x("div",{class:this.classes(j.min,!n&&v.buttonDisabled)},[L]),Z=x("div",{class:j.slider},t.render()),R=null!=this.labelFormatFunction?x("div",{afterCreate:this._createLabel,afterUpdate:this._createLabel,bind:this,class:j.maxDate,"data-date":a?.end,"data-layout":S,"data-type":"max",key:"max-date"}):null!=a&&null!=a.end&&[x("div",{class:j.maxDate,key:"max-date"},this._formatDate(a.end)),p&&x("div",{class:j.maxTime,key:"max-time"},this._formatTime(a.end))],B=x("div",{class:this.classes(j.max,!n&&v.buttonDisabled)},[R]),I=x("div",{class:j.previous},x("button",{"aria-disabled":M?"true":"false","aria-label":l.pagination.previous,bind:this,class:this.classes(v.widgetButton,j.previousButton,(T||M)&&v.buttonDisabled),disabled:M,onclick:this._previousClick,title:l.pagination.previous,type:"button"},x("div",{class:f.reverse}))),O=x("div",{class:j.next},x("button",{"aria-disabled":M?"true":"false","aria-label":l.pagination.next,bind:this,class:this.classes(v.widgetButton,j.nextButton,(T||M)&&v.buttonDisabled),disabled:M,onclick:this._nextClick,title:l.pagination.next,type:"button"},x("div",{class:f.forward}))),A=e?.length>0,V=A&&x("div",{class:j.actions,title:l.options},x("calcite-action-menu",{class:j.actionsButton,label:l.options},e.toArray().map((t=>x("calcite-action",{bind:this,icon:t.icon,id:t.id,onclick:()=>this.viewModel.triggerAction(t),text:t.title,textEnabled:!0})))));return x("div",{afterCreate:t=>{this.addHandles(w(t,(()=>this.scheduleRender())))},"aria-label":r.widgetLabel,class:this.classes(j.timeSlider,v.widget,`${j.timeSliderMode}${m}`,`${j.timeSliderLayout}${S}`,!n&&v.disabled,g&&j.timeSliderOutOfBounds,A&&j.hasActions,k())},"wide"===S&&x("div",{class:j.timeSliderRow},x("div",{class:j.playbackControls},[F,D,U,Z,B,I,O]),V),"compact"===S&&[x("div",{class:j.timeSliderRow,key:"time-slider-row-1"},[D,V]),x("div",{class:j.timeSliderRow,key:"time-slider-row-2"},[Z]),x("div",{class:j.timeSliderRow,key:"time-slider-row-3"},[U,I,F,O,B])])}updateWebDocument(t){this.viewModel?.updateWebDocument(t)}_createLabel(t){if(null==this.labelFormatFunction)return;const e=t.getAttribute("data-type"),i=t.getAttribute("data-layout"),s=t["data-date"];this.labelFormatFunction(s,e,t,i)}_formatDate(t){return u(t,this._dateFormat)}_formatTime(t){return u(t,this._timeFormat)}_getIntlOptions(t){const{timeZone:e}=this;return{...d(t),timeZone:e}}_getTickPositions(t){const{fullTimeExtent:e}=this;if(null==e||null==e.start||null==e.end)return[];const{start:i,end:s}=e,o=[],{value:a,unit:l}=t;let m=n(i,l,this.timeZone);for(;m.getTime()<=s.getTime();)m.getTime()>=i.getTime()&&o.push(m.getTime()),m=r(m,a,l,this.timeZone);return o}_updateSliderSteps(){this._slider.steps=null!=this.effectiveStops&&this.effectiveStops.length>0?this.effectiveStops.map((t=>t.getTime())):null}_playOrStopClick(){switch(this.viewModel.state){case"ready":this.viewModel.play();break;case"playing":this.viewModel.stop();break;case"disabled":break;default:s(this.viewModel.state)}}_previousClick(){this.viewModel.previous()}_nextClick(){this.viewModel.next()}};t([l()],S.prototype,"_dateFormat",null),t([l()],S.prototype,"_timeFormat",null),t([l()],S.prototype,"actions",null),t([l()],S.prototype,"disabled",void 0),t([l()],S.prototype,"effectiveStops",null),t([l()],S.prototype,"fullTimeExtent",null),t([l()],S.prototype,"iconClass",void 0),t([l()],S.prototype,"icon",void 0),t([l({readOnly:!0})],S.prototype,"interactive",null),t([l()],S.prototype,"label",null),t([l()],S.prototype,"labelFormatFunction",void 0),t([l({value:"auto"})],S.prototype,"layout",null),t([l()],S.prototype,"loop",null),t([l(),g("esri/widgets/TimeSlider/t9n/TimeSlider")],S.prototype,"messages",void 0),t([l(),g("esri/t9n/common")],S.prototype,"messagesCommon",void 0),t([l()],S.prototype,"mode",null),t([l()],S.prototype,"playRate",null),t([l()],S.prototype,"stops",null),t([l()],S.prototype,"tickConfigs",void 0),t([l()],S.prototype,"tickFormats",null),t([l()],S.prototype,"timeExtent",null),t([l({nonNullable:!0})],S.prototype,"timeVisible",void 0),t([l()],S.prototype,"timeZone",null),t([l()],S.prototype,"view",null),t([l({type:T}),b("trigger-action")],S.prototype,"viewModel",void 0),t([y()],S.prototype,"_playOrStopClick",null),t([y()],S.prototype,"_previousClick",null),t([y()],S.prototype,"_nextClick",null),S=t([m("esri.widgets.TimeSlider")],S);const F=S;export{F as default};

package/widgets/Track.js

@@ -2,4 +2,4 @@
 All material copyright ESRI, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.28/esri/copyright.txt for details.
 */
-import{_ as e}from"../chunks/tslib.es6.js";import{deprecatedProperty as t}from"../core/deprecate.js";import o from"../core/Logger.js";import{property as r}from"../core/accessorSupport/decorators/property.js";import"../core/accessorSupport/ensureType.js";import"../core/arrayUtils.js";import"../core/has.js";import{subclass as i}from"../core/accessorSupport/decorators/subclass.js";import s from"./Widget.js";import{loadCalciteComponents as n}from"./support/componentsUtils.js";import{globalCss as a}from"./support/globalCss.js";import{legacyIcon as l}from"./support/legacyIcon.js";import{accessibleHandler as c}from"./support/decorators/accessibleHandler.js";import{messageBundle as d}from"./support/decorators/messageBundle.js";import{vmEvent as p}from"./support/decorators/vmEvent.js";import{tsx as g}from"./support/jsxFactory.js";import"./support/widgetUtils.js";import u from"./Track/TrackViewModel.js";const h={base:"esri-track",widgetIcon:l.tracking},m="compass-north-circle",w="esri.widgets.Track",v=o.getLogger(w);let b=class extends s{constructor(e,t){super(e,t),this.iconClass=h.widgetIcon,this.icon=null,this.messages=null,this.viewModel=new u}loadDependencies(){return n({icon:()=>import("@esri/calcite-components/dist/components/calcite-icon.js"),loader:()=>import("@esri/calcite-components/dist/components/calcite-loader.js")})}get geolocationOptions(){return this.viewModel.geolocationOptions}set geolocationOptions(e){this.viewModel.geolocationOptions=e}get goToLocationEnabled(){return this.viewModel.goToLocationEnabled}set goToLocationEnabled(e){this.viewModel.goToLocationEnabled=e}get goToOverride(){return this.viewModel.goToOverride}set goToOverride(e){this.viewModel.goToOverride=e}get graphic(){return this.viewModel.graphic}set graphic(e){this.viewModel.graphic=e}get label(){return this.messages?.widgetLabel??""}set label(e){this._overrideIfSome("label",e)}get rotationEnabled(){return this.viewModel.rotationEnabled}set rotationEnabled(e){this.viewModel.rotationEnabled=e}get scale(){return this.viewModel.scale}set scale(e){this.viewModel.scale=e}get tracking(){return this.viewModel.tracking}get useHeadingEnabled(){return t(v,"useHeadingEnabled",{replacement:"rotationEnabled",version:"4.27",warnOnce:!0}),this.viewModel.rotationEnabled}set useHeadingEnabled(e){t(v,"useHeadingEnabled",{replacement:"rotationEnabled",version:"4.27",warnOnce:!0}),this.viewModel.rotationEnabled=e}get view(){return this.viewModel.view}set view(e){this.viewModel.view=e}start(){this.viewModel.start()}stop(){this.viewModel.stop()}render(){const e=this.viewModel?.state,t={[a.disabled]:"disabled"===e,[a.hidden]:"feature-unsupported"===e},o="tracking"===e,{messages:r}=this,i=(o?r?.stopTracking:r?.startTracking)??"";return g("div",{bind:this,class:this.classes(h.base,a.widget,a.widgetButton,t),hidden:"feature-unsupported"===e,onclick:this._toggleTracking,onkeydown:this._toggleTracking,role:"button",tabIndex:0,"aria-label":i,title:i},this._renderIcon(),g("span",{class:l.fontFallbackText},i))}_renderIcon(){const{icon:e,iconClass:t,viewModel:o}=this;switch(o?.state){case"waiting":return g("calcite-loader",{key:"loader",type:"indeterminate",inline:!0,scale:"s",label:""});case"tracking":return this._renderCalciteIcon("pause");default:return e?this._renderCalciteIcon(e):t&&t!==h.widgetIcon?this._renderLegacyIcon(t):this._renderCalciteIcon(m)}}_renderCalciteIcon(e){return g("calcite-icon",{key:"icon",icon:e,scale:"s"})}_renderLegacyIcon(e){return g("span",{key:"legacy-icon","aria-hidden":"true",class:e})}_toggleTracking(){const e=this.viewModel;e&&"feature-unsupported"!==e.state&&"disabled"!==e.state&&("tracking"!==e.state&&"waiting"!==e.state?this.viewModel.start():this.viewModel.stop())}};e([r()],b.prototype,"geolocationOptions",null),e([r()],b.prototype,"goToLocationEnabled",null),e([r()],b.prototype,"goToOverride",null),e([r()],b.prototype,"graphic",null),e([r()],b.prototype,"iconClass",void 0),e([r()],b.prototype,"icon",void 0),e([r()],b.prototype,"label",null),e([r(),d("esri/widgets/Track/t9n/Track")],b.prototype,"messages",void 0),e([r()],b.prototype,"rotationEnabled",null),e([r()],b.prototype,"scale",null),e([r({readOnly:!0})],b.prototype,"tracking",null),e([r()],b.prototype,"useHeadingEnabled",null),e([r()],b.prototype,"view",null),e([r({type:u}),p(["track","track-error"])],b.prototype,"viewModel",void 0),e([c()],b.prototype,"_toggleTracking",null),b=e([i(w)],b);const y=b;export{y as default};
+import{_ as e}from"../chunks/tslib.es6.js";import{deprecatedProperty as t}from"../core/deprecate.js";import o from"../core/Logger.js";import{property as r}from"../core/accessorSupport/decorators/property.js";import"../core/accessorSupport/ensureType.js";import"../core/arrayUtils.js";import"../core/has.js";import{subclass as i}from"../core/accessorSupport/decorators/subclass.js";import s from"./Widget.js";import{loadCalciteComponents as n}from"./support/componentsUtils.js";import{globalCss as a}from"./support/globalCss.js";import{legacyIcon as l}from"./support/legacyIcon.js";import{accessibleHandler as c}from"./support/decorators/accessibleHandler.js";import{messageBundle as d}from"./support/decorators/messageBundle.js";import{vmEvent as p}from"./support/decorators/vmEvent.js";import{tsx as g}from"./support/jsxFactory.js";import"./support/widgetUtils.js";import u from"./Track/TrackViewModel.js";const h={base:"esri-track",widgetIcon:l.tracking},m="compass-north-circle",w="esri.widgets.Track",v=o.getLogger(w);let b=class extends s{constructor(e,t){super(e,t),this.iconClass=h.widgetIcon,this.icon=null,this.messages=null,this.viewModel=new u}loadDependencies(){return n({icon:()=>import("@esri/calcite-components/dist/components/calcite-icon.js"),loader:()=>import("@esri/calcite-components/dist/components/calcite-loader.js")})}get geolocationOptions(){return this.viewModel.geolocationOptions}set geolocationOptions(e){this.viewModel.geolocationOptions=e}get goToLocationEnabled(){return this.viewModel.goToLocationEnabled}set goToLocationEnabled(e){this.viewModel.goToLocationEnabled=e}get goToOverride(){return this.viewModel.goToOverride}set goToOverride(e){this.viewModel.goToOverride=e}get graphic(){return this.viewModel.graphic}set graphic(e){this.viewModel.graphic=e}get label(){return this.messages?.widgetLabel??""}set label(e){this._overrideIfSome("label",e)}get rotationEnabled(){return this.viewModel.rotationEnabled}set rotationEnabled(e){this.viewModel.rotationEnabled=e}get scale(){return this.viewModel.scale}set scale(e){this.viewModel.scale=e}get tracking(){return this.viewModel.tracking}get useHeadingEnabled(){return t(v,"useHeadingEnabled",{replacement:"rotationEnabled",version:"4.27",warnOnce:!0}),this.viewModel.rotationEnabled}set useHeadingEnabled(e){t(v,"useHeadingEnabled",{replacement:"rotationEnabled",version:"4.27",warnOnce:!0}),this.viewModel.rotationEnabled=e}get view(){return this.viewModel.view}set view(e){this.viewModel.view=e}start(){this.viewModel.start()}stop(){this.viewModel.stop()}render(){const e=this.viewModel?.state,t={[a.disabled]:"disabled"===e,[a.hidden]:"feature-unsupported"===e},o="tracking"===e,{messages:r}=this,i=(o?r?.stopTracking:r?.startTracking)??"";return g("div",{"aria-label":i,bind:this,class:this.classes(h.base,a.widget,a.widgetButton,t),hidden:"feature-unsupported"===e,onclick:this._toggleTracking,onkeydown:this._toggleTracking,role:"button",tabIndex:0,title:i},this._renderIcon(),g("span",{class:l.fontFallbackText},i))}_renderIcon(){const{icon:e,iconClass:t,viewModel:o}=this;switch(o?.state){case"waiting":return g("calcite-loader",{inline:!0,key:"loader",label:"",scale:"s",type:"indeterminate"});case"tracking":return this._renderCalciteIcon("pause");default:return e?this._renderCalciteIcon(e):t&&t!==h.widgetIcon?this._renderLegacyIcon(t):this._renderCalciteIcon(m)}}_renderCalciteIcon(e){return g("calcite-icon",{icon:e,key:"icon",scale:"s"})}_renderLegacyIcon(e){return g("span",{"aria-hidden":"true",class:e,key:"legacy-icon"})}_toggleTracking(){const e=this.viewModel;e&&"feature-unsupported"!==e.state&&"disabled"!==e.state&&("tracking"!==e.state&&"waiting"!==e.state?this.viewModel.start():this.viewModel.stop())}};e([r()],b.prototype,"geolocationOptions",null),e([r()],b.prototype,"goToLocationEnabled",null),e([r()],b.prototype,"goToOverride",null),e([r()],b.prototype,"graphic",null),e([r()],b.prototype,"iconClass",void 0),e([r()],b.prototype,"icon",void 0),e([r()],b.prototype,"label",null),e([r(),d("esri/widgets/Track/t9n/Track")],b.prototype,"messages",void 0),e([r()],b.prototype,"rotationEnabled",null),e([r()],b.prototype,"scale",null),e([r({readOnly:!0})],b.prototype,"tracking",null),e([r()],b.prototype,"useHeadingEnabled",null),e([r()],b.prototype,"view",null),e([r({type:u}),p(["track","track-error"])],b.prototype,"viewModel",void 0),e([c()],b.prototype,"_toggleTracking",null),b=e([i(w)],b);const y=b;export{y as default};

package/widgets/UtilityNetworkAssociations/UtilityNetworkAssociationsLineSymbolPicker.js

@@ -2,4 +2,4 @@
 All material copyright ESRI, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.28/esri/copyright.txt for details.
 */
-import{_ as e}from"../../chunks/tslib.es6.js";import{getAssetUrl as t}from"../../assets.js";import o from"../../Color.js";import{property as s}from"../../core/accessorSupport/decorators/property.js";import"../../core/accessorSupport/ensureType.js";import"../../core/arrayUtils.js";import"../../core/has.js";import{subclass as r}from"../../core/accessorSupport/decorators/subclass.js";import i from"../../symbols/LineSymbolMarker.js";import n from"../../symbols/SimpleLineSymbol.js";import l from"../Widget.js";import{loadCalciteComponents as c}from"../support/componentsUtils.js";import"../support/widgetUtils.js";import{messageBundle as a}from"../support/decorators/messageBundle.js";import{tsx as p}from"../support/jsxFactory.js";import d from"./VisibleElementsSettingsPane.js";const m="esri-un-associations",u={divControlsSymbolPicker:`${m}__div-controls-symbol-picker`,dropdown:`${m}__dropdown`,dropdownItemLineCap:`${m}__dropdown-item-line-cap`,dropdownItemLinePattern:`${m}__dropdown-item-line-pattern`,dropdownSelectedItemLineCap:`${m}__dropdown-selected-item-line-cap`,dropdownSelectedItemLinePattern:`${m}__dropdown-selected-item-line-pattern`,dropdownTrigger:`${m}__dropdown-trigger`,labelAndToggle:`${m}__label-and-toggle`};let w=class extends l{constructor(e,t){super(e,t),this._lineCapTypes=["butt","round","square"],this._lineStyleTypes=["solid","dash","dash-dot","dot","long-dash","long-dash-dot","long-dash-dot-dot","short-dash","short-dash-dot","short-dash-dot-dot","short-dot"],this.lineSymbol=new n,this.messages=null,this.showArrows=!1,this.visibleElements=new d,this._afterComponentCreate=this._afterComponentCreate.bind(this)}render(){const{messages:{input:{lineCap:e,lineColor:t,lineStyle:o,lineWidth:s,showArrows:r}},visibleElements:i}=this,n=this.lineSymbol;return p("div",{class:u.divControlsSymbolPicker},i.arrowsToggle?this._renderToggle(r,this.showArrows,n,"marker"):void 0,i.capSelect?this._renderLineStylePicker(e,this._lineCapTypes,n,"cap"):void 0,i.colorPicker&&n.color?this._renderColorPicker(t,n.color.toHex(),n,"color"):void 0,i.stylePicker?this._renderLineStylePicker(o,this._lineStyleTypes,n,"style"):void 0,i.widthInput?this._renderNumberInput(s,n.width.toString(),n,"width"):void 0)}loadDependencies(){return c({dropdown:()=>import("@esri/calcite-components/dist/components/calcite-dropdown.js"),"dropdown-group":()=>import("@esri/calcite-components/dist/components/calcite-dropdown-group.js"),"dropdown-item":()=>import("@esri/calcite-components/dist/components/calcite-dropdown-item.js"),input:()=>import("@esri/calcite-components/dist/components/calcite-input.js"),"input-number":()=>import("@esri/calcite-components/dist/components/calcite-input-number.js"),label:()=>import("@esri/calcite-components/dist/components/calcite-label.js"),switch:()=>import("@esri/calcite-components/dist/components/calcite-switch.js")})}_afterComponentCreate(e){"value"in e&&null!=e.value&&"setNumberValue"in e&&e.setNumberValue({committing:!1,value:e.value,origin:"direct"})}_renderColorPicker(e,t,s,r){return p("calcite-label",{scale:"s"},e,p("calcite-input",{scale:"s",type:"color",value:t,onCalciteInputInput:e=>{const t=e.target;s.set(r,new o(t.value))}}))}_renderLineStylePicker(e,o,s,r){const i="style"===r,n="esri/widgets/UtilityNetworkAssociations/assets/img";function l(e,o){return p("calcite-dropdown-item",{selected:s[o]===e,label:e},p("div",{class:i?u.dropdownItemLinePattern:u.dropdownItemLineCap,style:`background-image:url(${t(`${n}/line-${i?"patterns":"caps"}/${e}.png`)})`}))}return p("calcite-label",{scale:"s"},e,p("calcite-dropdown",{onCalciteDropdownSelect:e=>{const t=e.target;s.set(r,t.selectedItems[0].label)},class:u.dropdown},p("div",{role:"button",slot:"trigger",class:u.dropdownTrigger},p("div",{class:i?u.dropdownSelectedItemLinePattern:u.dropdownSelectedItemLineCap,style:`background-image:url(${t(`${n}/line-${i?"patterns":"caps"}/${s[r]}.png`)})`})),p("calcite-dropdown-group",null,o.map((e=>l(e,r))))))}_renderNumberInput(e,t,o,s){return p("calcite-label",{scale:"s"},e,p("calcite-input-number",{afterCreate:this._afterComponentCreate,scale:"s",type:"number",step:1,value:t,min:1,max:10,onCalciteInputNumberChange:e=>{const t=e.target;o.set(s,t.value)}}))}_renderToggle(e,t,o,s){return p("div",{class:u.labelAndToggle},p("calcite-label",{scale:"s"},e),p("calcite-switch",{bind:this,scale:"m",checked:t,onCalciteSwitchChange:e=>{e.target.checked?o.set(s,new i({style:"arrow"})):o.set(s,null)}}))}};e([s()],w.prototype,"lineSymbol",void 0),e([s(),a("esri/widgets/UtilityNetworkAssociations/t9n/UtilityNetworkAssociations")],w.prototype,"messages",void 0),e([s()],w.prototype,"showArrows",void 0),e([s({type:d,nonNullable:!0})],w.prototype,"visibleElements",void 0),w=e([r("esri.widgets.UtilityNetworkAssociations.UtilityNetworkAssociationsLineSymbolPicker")],w);const g=w;export{g as default};
+import{_ as e}from"../../chunks/tslib.es6.js";import{getAssetUrl as t}from"../../assets.js";import o from"../../Color.js";import{property as s}from"../../core/accessorSupport/decorators/property.js";import"../../core/accessorSupport/ensureType.js";import"../../core/arrayUtils.js";import"../../core/has.js";import{subclass as r}from"../../core/accessorSupport/decorators/subclass.js";import i from"../../symbols/LineSymbolMarker.js";import n from"../../symbols/SimpleLineSymbol.js";import l from"../Widget.js";import{loadCalciteComponents as c}from"../support/componentsUtils.js";import"../support/widgetUtils.js";import{messageBundle as a}from"../support/decorators/messageBundle.js";import{tsx as p}from"../support/jsxFactory.js";import d from"./VisibleElementsSettingsPane.js";const m="esri-un-associations",u={divControlsSymbolPicker:`${m}__div-controls-symbol-picker`,dropdown:`${m}__dropdown`,dropdownItemLineCap:`${m}__dropdown-item-line-cap`,dropdownItemLinePattern:`${m}__dropdown-item-line-pattern`,dropdownSelectedItemLineCap:`${m}__dropdown-selected-item-line-cap`,dropdownSelectedItemLinePattern:`${m}__dropdown-selected-item-line-pattern`,dropdownTrigger:`${m}__dropdown-trigger`,labelAndToggle:`${m}__label-and-toggle`};let w=class extends l{constructor(e,t){super(e,t),this._lineCapTypes=["butt","round","square"],this._lineStyleTypes=["solid","dash","dash-dot","dot","long-dash","long-dash-dot","long-dash-dot-dot","short-dash","short-dash-dot","short-dash-dot-dot","short-dot"],this.lineSymbol=new n,this.messages=null,this.showArrows=!1,this.visibleElements=new d,this._afterComponentCreate=this._afterComponentCreate.bind(this)}render(){const{messages:{input:{lineCap:e,lineColor:t,lineStyle:o,lineWidth:s,showArrows:r}},visibleElements:i}=this,n=this.lineSymbol;return p("div",{class:u.divControlsSymbolPicker},i.arrowsToggle?this._renderToggle(r,this.showArrows,n,"marker"):void 0,i.capSelect?this._renderLineStylePicker(e,this._lineCapTypes,n,"cap"):void 0,i.colorPicker&&n.color?this._renderColorPicker(t,n.color.toHex(),n,"color"):void 0,i.stylePicker?this._renderLineStylePicker(o,this._lineStyleTypes,n,"style"):void 0,i.widthInput?this._renderNumberInput(s,n.width.toString(),n,"width"):void 0)}loadDependencies(){return c({dropdown:()=>import("@esri/calcite-components/dist/components/calcite-dropdown.js"),"dropdown-group":()=>import("@esri/calcite-components/dist/components/calcite-dropdown-group.js"),"dropdown-item":()=>import("@esri/calcite-components/dist/components/calcite-dropdown-item.js"),input:()=>import("@esri/calcite-components/dist/components/calcite-input.js"),"input-number":()=>import("@esri/calcite-components/dist/components/calcite-input-number.js"),label:()=>import("@esri/calcite-components/dist/components/calcite-label.js"),switch:()=>import("@esri/calcite-components/dist/components/calcite-switch.js")})}_afterComponentCreate(e){"value"in e&&null!=e.value&&"setNumberValue"in e&&e.setNumberValue({committing:!1,value:e.value,origin:"direct"})}_renderColorPicker(e,t,s,r){return p("calcite-label",{scale:"s"},e,p("calcite-input",{scale:"s",type:"color",value:t,onCalciteInputInput:e=>{const t=e.target;s.set(r,new o(t.value))}}))}_renderLineStylePicker(e,o,s,r){const i="style"===r,n="esri/widgets/UtilityNetworkAssociations/assets/img";function l(e,o){return p("calcite-dropdown-item",{label:e,selected:s[o]===e},p("div",{class:i?u.dropdownItemLinePattern:u.dropdownItemLineCap,style:`background-image:url(${t(`${n}/line-${i?"patterns":"caps"}/${e}.png`)})`}))}return p("calcite-label",{scale:"s"},e,p("calcite-dropdown",{class:u.dropdown,onCalciteDropdownSelect:e=>{const t=e.target;s.set(r,t.selectedItems[0].label)}},p("div",{class:u.dropdownTrigger,role:"button",slot:"trigger"},p("div",{class:i?u.dropdownSelectedItemLinePattern:u.dropdownSelectedItemLineCap,style:`background-image:url(${t(`${n}/line-${i?"patterns":"caps"}/${s[r]}.png`)})`})),p("calcite-dropdown-group",null,o.map((e=>l(e,r))))))}_renderNumberInput(e,t,o,s){return p("calcite-label",{scale:"s"},e,p("calcite-input-number",{afterCreate:this._afterComponentCreate,max:10,min:1,scale:"s",step:1,type:"number",value:t,onCalciteInputNumberChange:e=>{const t=e.target;o.set(s,t.value)}}))}_renderToggle(e,t,o,s){return p("div",{class:u.labelAndToggle},p("calcite-label",{scale:"s"},e),p("calcite-switch",{bind:this,checked:t,scale:"m",onCalciteSwitchChange:e=>{e.target.checked?o.set(s,new i({style:"arrow"})):o.set(s,null)}}))}};e([s()],w.prototype,"lineSymbol",void 0),e([s(),a("esri/widgets/UtilityNetworkAssociations/t9n/UtilityNetworkAssociations")],w.prototype,"messages",void 0),e([s()],w.prototype,"showArrows",void 0),e([s({type:d,nonNullable:!0})],w.prototype,"visibleElements",void 0),w=e([r("esri.widgets.UtilityNetworkAssociations.UtilityNetworkAssociationsLineSymbolPicker")],w);const g=w;export{g as default};

package/widgets/UtilityNetworkAssociations.js

@@ -2,4 +2,4 @@
 All material copyright ESRI, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.28/esri/copyright.txt for details.
 */
-import{_ as t}from"../chunks/tslib.es6.js";import{watch as s}from"../core/reactiveUtils.js";import{property as i}from"../core/accessorSupport/decorators/property.js";import"../core/accessorSupport/ensureType.js";import"../core/arrayUtils.js";import"../core/has.js";import{subclass as e}from"../core/accessorSupport/decorators/subclass.js";import o from"./Widget.js";import{loadCalciteComponents as n}from"./support/componentsUtils.js";import"./support/widgetUtils.js";import{messageBundle as a}from"./support/decorators/messageBundle.js";import{tsx as l}from"./support/jsxFactory.js";import c from"./UtilityNetworkAssociations/UtilityNetworkAssociationsLineSymbolPicker.js";import r from"./UtilityNetworkAssociations/UtilityNetworkAssociationsViewModel.js";import d from"./UtilityNetworkAssociations/VisibleElements.js";const h="esri-un-associations",A={action:`${h}__action`,actionRefresh:`${h}__action-refresh`,blockContent:`${h}__block-content`,blockSectionSettings:`${h}__block-section-settings`,divControlsMain:`${h}__div-controls-main`,label:`${h}__label`,labelAndSlider:`${h}__label-and-slider`,labelAndToggle:`${h}__label-and-toggle`,slider:`${h}__slider`,statusIconContainer:`${h}__status-icon-container`,statusIconWarning:`${h}__status-icon-warning`,switch:`${h}__switch`,switchContainer:`${h}__switch-container`,widgetContainer:`${h}__widget-container`};let m=class extends o{constructor(t,s){super(t,s),this._autoRefreshAssociations=!0,this._associationsOptionsEnabled=!1,this._maxAllowableAssociationsSliderMax=1e3,this._maxAllowableAssociationsSliderMin=250,this._maxAllowableAssociationsSliderStep=250,this.messages=null,this.messagesCommon=null,this.viewModel=new r,this.visibleElements=new d}initialize(){this.addHandles([s((()=>[this.view?.stationary,this.showAssociationsEnabled,this.includeConnectivityAssociations,this.includeStructuralAttachmentAssociations,this.maxAllowableAssociations]),(()=>{!0===this.autoRefreshAssociations&&(!0===this.showAssociationsEnabled?this.viewModel.showAssociations():this.viewModel.removeAssociations())}))])}get autoRefreshAssociations(){return this._autoRefreshAssociations}set autoRefreshAssociations(t){this._autoRefreshAssociations=t}get connectivityAssociationsLineSymbol(){return this.viewModel.connectivityAssociationsLineSymbol}set connectivityAssociationsLineSymbol(t){this.viewModel.connectivityAssociationsLineSymbol=t}get includeConnectivityAssociations(){return this.viewModel.includeConnectivityAssociations}set includeConnectivityAssociations(t){this.viewModel.includeConnectivityAssociations=t}get includeStructuralAttachmentAssociations(){return this.viewModel.includeStructuralAttachmentAssociations}set includeStructuralAttachmentAssociations(t){this.viewModel.includeStructuralAttachmentAssociations=t}get label(){return this.messages?.widgetLabel??""}set label(t){this._overrideIfSome("label",t)}get maxAllowableAssociations(){return this.viewModel.maxAllowableAssociations}set maxAllowableAssociations(t){this.viewModel.maxAllowableAssociations=t}get maxAllowableAssociationsSliderMax(){return this._maxAllowableAssociationsSliderMax}set maxAllowableAssociationsSliderMax(t){t<=this.maxAllowableAssociationsSliderMin||(this._maxAllowableAssociationsSliderMax=t)}get maxAllowableAssociationsSliderMin(){return this._maxAllowableAssociationsSliderMin}set maxAllowableAssociationsSliderMin(t){t<0||t>=this.maxAllowableAssociationsSliderMax||(this._maxAllowableAssociationsSliderMin=t)}get maxAllowableAssociationsSliderStep(){return this._maxAllowableAssociationsSliderStep}set maxAllowableAssociationsSliderStep(t){this._maxAllowableAssociationsSliderStep=t}get showArrowsConnectivity(){return this.viewModel.showArrowsConnectivity}set showArrowsConnectivity(t){this.viewModel.showArrowsConnectivity=t}get showArrowsStructuralAttachment(){return this.viewModel.showArrowsStructuralAttachment}set showArrowsStructuralAttachment(t){this.viewModel.showArrowsStructuralAttachment=t}get showAssociationsEnabled(){return this.viewModel.showAssociationsEnabled}set showAssociationsEnabled(t){this.viewModel.showAssociationsEnabled=t}get structuralAttachmentAssociationsLineSymbol(){return this.viewModel.structuralAttachmentAssociationsLineSymbol}set structuralAttachmentAssociationsLineSymbol(t){this.viewModel.structuralAttachmentAssociationsLineSymbol=t}get utilityNetwork(){return this.viewModel.utilityNetwork}set utilityNetwork(t){this.viewModel.utilityNetwork=t}get view(){return this.viewModel.view}set view(t){this.viewModel.view=t}render(){const{label:t}=this;return l("div",{class:A.widgetContainer},l("calcite-block",{heading:t,class:A.blockContent,collapsible:!0},this._renderStatusIcon(),this.autoRefreshAssociations?this._renderShowAssociationsSwitch():this._renderRefreshAssociationsAction(),this._renderContent()))}loadDependencies(){return n({action:()=>import("@esri/calcite-components/dist/components/calcite-action.js"),block:()=>import("@esri/calcite-components/dist/components/calcite-block.js"),"block-section":()=>import("@esri/calcite-components/dist/components/calcite-block-section.js"),icon:()=>import("@esri/calcite-components/dist/components/calcite-icon.js"),label:()=>import("@esri/calcite-components/dist/components/calcite-label.js"),notice:()=>import("@esri/calcite-components/dist/components/calcite-notice.js"),panel:()=>import("@esri/calcite-components/dist/components/calcite-panel.js"),slider:()=>import("@esri/calcite-components/dist/components/calcite-slider.js"),switch:()=>import("@esri/calcite-components/dist/components/calcite-switch.js"),tooltip:()=>import("@esri/calcite-components/dist/components/calcite-tooltip.js")})}_connectivityAssociationsSwitchChange(t){this.includeConnectivityAssociations=t.target.checked}_getLoadErrorMessagesAsNotices(t,s){return l("calcite-notice",{key:`error-notice-${s}`,open:!0,closable:!1,kind:"warning",scale:"s"},l("div",{slot:"message"},t))}_maxAllowableAssociationsSliderChange(t){this.maxAllowableAssociations=Number(t.target.value)}_refreshAssociations(){const{viewModel:t,viewModel:{state:s}}=this;"ready"!==s&&"warning"!==s||t.showAssociations()}_renderConnectivityAsssociationsSettings(){const{messages:{input:{enableConnectivity:t}},visibleElements:{connectivityAssociationsSettings:s}}=this;if(s)return l("calcite-block-section",{class:A.blockSectionSettings,text:t},l(c,{id:`${this.id}-symbol-picker-connectivity`,lineSymbol:this.connectivityAssociationsLineSymbol,showArrows:this.showArrowsConnectivity,visibleElements:s}))}_renderConnectivityAssociationsToggle(){const{messages:{input:{enableConnectivity:t}}}=this;return l("div",{key:"connectivityAssociationsToggleDiv",class:A.labelAndToggle},l("calcite-label",{class:A.label},t),l("calcite-switch",{bind:this,disabled:!this._associationsOptionsEnabled&&this.autoRefreshAssociations,checked:this.includeConnectivityAssociations,onCalciteSwitchChange:this._connectivityAssociationsSwitchChange}))}_renderContent(){const{viewModel:{loadErrors:t,state:s}}=this;return"disabled"===s?l("div",{key:"loadErrorsDiv",class:A.divControlsMain},t.items.map(this._getLoadErrorMessagesAsNotices)):l("calcite-panel",{disabled:"loading"===s},l("div",{class:A.divControlsMain},this._renderConnectivityAssociationsToggle(),this._renderStructuralAttachmentAssociationsToggle(),this._renderSettingsPane()))}_renderLoadingAction(t,s,i){return l("div",{key:t,slot:"control"},l("calcite-action",{id:s,text:i,loading:!0}),l("calcite-tooltip",{referenceElement:s},l("span",null,i)))}_renderMaxAllowableAssociationsSlider(){const{messages:{input:{maxAllowableAssociations:t}},visibleElements:{maxAllowableAssociationsSlider:s}}=this;if(s)return l("div",{class:A.labelAndSlider},l("calcite-label",{class:A.label},t),l("calcite-slider",{bind:this,class:A.slider,min:this.maxAllowableAssociationsSliderMin,max:this.maxAllowableAssociationsSliderMax,step:this.maxAllowableAssociationsSliderStep,ticks:this.maxAllowableAssociationsSliderStep,value:this.maxAllowableAssociations,labelTicks:!0,snap:!0,scale:"s",onCalciteSliderChange:this._maxAllowableAssociationsSliderChange}))}_renderRefreshAssociationsAction(){const{messages:{input:{refreshAssociations:t}},messagesCommon:{loading:s},viewModel:{state:i}}=this,e=`${this.id}-refresh-action`;if("disabled"!==i)return l("div",{slot:"control",class:A.actionRefresh},l("calcite-action",{id:e,bind:this,class:A.action,icon:"refresh-",text:t,loading:"loading"===i,onclick:this._refreshAssociations}),l("calcite-tooltip",{referenceElement:e},l("span",null,"loading"===i?s:t)))}_renderSettingsPane(){const{messagesCommon:{settings:t},visibleElements:{maxAllowableAssociationsSlider:s,connectivityAssociationsSettings:i,structuralAttachmentAssociationsSettings:e}}=this;if(s||i||e)return l("calcite-block",{heading:t,class:A.blockContent,collapsible:!0},this._renderMaxAllowableAssociationsSlider(),this._renderConnectivityAsssociationsSettings(),this._renderStructuralAttachmentAsssociationsSettings())}_renderShowAssociationsSwitch(){const{messages:{input:{enableAssociations:t}},messagesCommon:{loading:s},viewModel:{state:i}}=this,e=`${this.id}-show-associations-switch`;if("disabled"!==i)return"loading"===i?this._renderLoadingAction("loadingActionDiv",`${this.id}-loading-action`,s):l("div",{key:"switchDiv",slot:"control",class:A.switchContainer},l("calcite-switch",{id:e,bind:this,class:A.switch,checked:this.showAssociationsEnabled,onCalciteSwitchChange:this._showAssociationsSwitchChange}),l("calcite-tooltip",{referenceElement:e},l("span",null,t)))}_renderStatusIcon(){const{messagesCommon:{executing:t},viewModel:{executionError:s,state:i}}=this;switch(i){case"disabled":return this._renderWarningIcon("statusDiv",`${this.id}-disabled-icon`,null);case"warning":return this._renderWarningIcon("statusDiv",`${this.id}-warning-icon`,s);case"executing":return this._renderLoadingAction("executingActionDiv",`${this.id}-executing-action`,t);default:return}}_renderStructuralAttachmentAsssociationsSettings(){const{messages:{input:{enableStructuralAttachment:t}},visibleElements:{structuralAttachmentAssociationsSettings:s}}=this;if(s)return l("calcite-block-section",{class:A.blockSectionSettings,text:t},l(c,{id:`${this.id}-symbol-picker-structural-attachment`,lineSymbol:this.structuralAttachmentAssociationsLineSymbol,showArrows:this.showArrowsStructuralAttachment,visibleElements:s}))}_renderStructuralAttachmentAssociationsToggle(){const{messages:{input:{enableStructuralAttachment:t}}}=this;return l("div",{key:"structuralAttachmentAssociationsToggleDiv",class:A.labelAndToggle},l("calcite-label",{class:A.label},t),l("calcite-switch",{bind:this,disabled:!this._associationsOptionsEnabled&&this.autoRefreshAssociations,checked:this.includeStructuralAttachmentAssociations,onCalciteSwitchChange:this._structuralAttAssociationsSwitchChange}))}_showAssociationsSwitchChange(t){const{viewModel:s}=this;this.showAssociationsEnabled=t.target.checked,this._associationsOptionsEnabled=t.target.checked,this.showAssociationsEnabled||s.removeAssociations()}_structuralAttAssociationsSwitchChange(t){this.includeStructuralAttachmentAssociations=t.target.checked}_renderWarningIcon(t,s,i){return i?l("div",{key:t,slot:"control",class:A.statusIconContainer},l("calcite-icon",{id:s,icon:"exclamation-mark-triangle",scale:"s",class:A.statusIconWarning}),l("calcite-tooltip",{referenceElement:s},l("span",null,i))):l("div",{key:t,slot:"control",class:A.statusIconContainer},l("calcite-icon",{id:s,icon:"exclamation-mark-triangle",scale:"s",class:A.statusIconWarning}))}};t([i()],m.prototype,"autoRefreshAssociations",null),t([i()],m.prototype,"connectivityAssociationsLineSymbol",null),t([i()],m.prototype,"includeConnectivityAssociations",null),t([i()],m.prototype,"includeStructuralAttachmentAssociations",null),t([i()],m.prototype,"label",null),t([i()],m.prototype,"maxAllowableAssociations",null),t([i()],m.prototype,"maxAllowableAssociationsSliderMax",null),t([i()],m.prototype,"maxAllowableAssociationsSliderMin",null),t([i()],m.prototype,"maxAllowableAssociationsSliderStep",null),t([i(),a("esri/widgets/UtilityNetworkAssociations/t9n/UtilityNetworkAssociations")],m.prototype,"messages",void 0),t([i(),a("esri/t9n/common")],m.prototype,"messagesCommon",void 0),t([i()],m.prototype,"showArrowsConnectivity",null),t([i()],m.prototype,"showArrowsStructuralAttachment",null),t([i()],m.prototype,"showAssociationsEnabled",null),t([i()],m.prototype,"structuralAttachmentAssociationsLineSymbol",null),t([i()],m.prototype,"utilityNetwork",null),t([i()],m.prototype,"view",null),t([i({type:r})],m.prototype,"viewModel",void 0),t([i({type:d,nonNullable:!0})],m.prototype,"visibleElements",void 0),m=t([e("esri.widgets.UtilityNetworkAssociations")],m);const u=m;export{u as default};
+import{_ as t}from"../chunks/tslib.es6.js";import{watch as s}from"../core/reactiveUtils.js";import{property as i}from"../core/accessorSupport/decorators/property.js";import"../core/accessorSupport/ensureType.js";import"../core/arrayUtils.js";import"../core/has.js";import{subclass as e}from"../core/accessorSupport/decorators/subclass.js";import o from"./Widget.js";import{loadCalciteComponents as n}from"./support/componentsUtils.js";import"./support/widgetUtils.js";import{messageBundle as a}from"./support/decorators/messageBundle.js";import{tsx as l}from"./support/jsxFactory.js";import c from"./UtilityNetworkAssociations/UtilityNetworkAssociationsLineSymbolPicker.js";import r from"./UtilityNetworkAssociations/UtilityNetworkAssociationsViewModel.js";import d from"./UtilityNetworkAssociations/VisibleElements.js";const h="esri-un-associations",A={action:`${h}__action`,actionRefresh:`${h}__action-refresh`,blockContent:`${h}__block-content`,blockSectionSettings:`${h}__block-section-settings`,divControlsMain:`${h}__div-controls-main`,label:`${h}__label`,labelAndSlider:`${h}__label-and-slider`,labelAndToggle:`${h}__label-and-toggle`,slider:`${h}__slider`,statusIconContainer:`${h}__status-icon-container`,statusIconWarning:`${h}__status-icon-warning`,switch:`${h}__switch`,switchContainer:`${h}__switch-container`,widgetContainer:`${h}__widget-container`};let m=class extends o{constructor(t,s){super(t,s),this._autoRefreshAssociations=!0,this._associationsOptionsEnabled=!1,this._maxAllowableAssociationsSliderMax=1e3,this._maxAllowableAssociationsSliderMin=250,this._maxAllowableAssociationsSliderStep=250,this.messages=null,this.messagesCommon=null,this.viewModel=new r,this.visibleElements=new d}initialize(){this.addHandles([s((()=>[this.view?.stationary,this.showAssociationsEnabled,this.includeConnectivityAssociations,this.includeStructuralAttachmentAssociations,this.maxAllowableAssociations]),(()=>{!0===this.autoRefreshAssociations&&(!0===this.showAssociationsEnabled?this.viewModel.showAssociations():this.viewModel.removeAssociations())}))])}get autoRefreshAssociations(){return this._autoRefreshAssociations}set autoRefreshAssociations(t){this._autoRefreshAssociations=t}get connectivityAssociationsLineSymbol(){return this.viewModel.connectivityAssociationsLineSymbol}set connectivityAssociationsLineSymbol(t){this.viewModel.connectivityAssociationsLineSymbol=t}get includeConnectivityAssociations(){return this.viewModel.includeConnectivityAssociations}set includeConnectivityAssociations(t){this.viewModel.includeConnectivityAssociations=t}get includeStructuralAttachmentAssociations(){return this.viewModel.includeStructuralAttachmentAssociations}set includeStructuralAttachmentAssociations(t){this.viewModel.includeStructuralAttachmentAssociations=t}get label(){return this.messages?.widgetLabel??""}set label(t){this._overrideIfSome("label",t)}get maxAllowableAssociations(){return this.viewModel.maxAllowableAssociations}set maxAllowableAssociations(t){this.viewModel.maxAllowableAssociations=t}get maxAllowableAssociationsSliderMax(){return this._maxAllowableAssociationsSliderMax}set maxAllowableAssociationsSliderMax(t){t<=this.maxAllowableAssociationsSliderMin||(this._maxAllowableAssociationsSliderMax=t)}get maxAllowableAssociationsSliderMin(){return this._maxAllowableAssociationsSliderMin}set maxAllowableAssociationsSliderMin(t){t<0||t>=this.maxAllowableAssociationsSliderMax||(this._maxAllowableAssociationsSliderMin=t)}get maxAllowableAssociationsSliderStep(){return this._maxAllowableAssociationsSliderStep}set maxAllowableAssociationsSliderStep(t){this._maxAllowableAssociationsSliderStep=t}get showArrowsConnectivity(){return this.viewModel.showArrowsConnectivity}set showArrowsConnectivity(t){this.viewModel.showArrowsConnectivity=t}get showArrowsStructuralAttachment(){return this.viewModel.showArrowsStructuralAttachment}set showArrowsStructuralAttachment(t){this.viewModel.showArrowsStructuralAttachment=t}get showAssociationsEnabled(){return this.viewModel.showAssociationsEnabled}set showAssociationsEnabled(t){this.viewModel.showAssociationsEnabled=t}get structuralAttachmentAssociationsLineSymbol(){return this.viewModel.structuralAttachmentAssociationsLineSymbol}set structuralAttachmentAssociationsLineSymbol(t){this.viewModel.structuralAttachmentAssociationsLineSymbol=t}get utilityNetwork(){return this.viewModel.utilityNetwork}set utilityNetwork(t){this.viewModel.utilityNetwork=t}get view(){return this.viewModel.view}set view(t){this.viewModel.view=t}render(){const{label:t}=this;return l("div",{class:A.widgetContainer},l("calcite-block",{class:A.blockContent,collapsible:!0,heading:t},this._renderStatusIcon(),this.autoRefreshAssociations?this._renderShowAssociationsSwitch():this._renderRefreshAssociationsAction(),this._renderContent()))}loadDependencies(){return n({action:()=>import("@esri/calcite-components/dist/components/calcite-action.js"),block:()=>import("@esri/calcite-components/dist/components/calcite-block.js"),"block-section":()=>import("@esri/calcite-components/dist/components/calcite-block-section.js"),icon:()=>import("@esri/calcite-components/dist/components/calcite-icon.js"),label:()=>import("@esri/calcite-components/dist/components/calcite-label.js"),notice:()=>import("@esri/calcite-components/dist/components/calcite-notice.js"),panel:()=>import("@esri/calcite-components/dist/components/calcite-panel.js"),slider:()=>import("@esri/calcite-components/dist/components/calcite-slider.js"),switch:()=>import("@esri/calcite-components/dist/components/calcite-switch.js"),tooltip:()=>import("@esri/calcite-components/dist/components/calcite-tooltip.js")})}_connectivityAssociationsSwitchChange(t){this.includeConnectivityAssociations=t.target.checked}_getLoadErrorMessagesAsNotices(t,s){return l("calcite-notice",{closable:!1,key:`error-notice-${s}`,kind:"warning",open:!0,scale:"s"},l("div",{slot:"message"},t))}_maxAllowableAssociationsSliderChange(t){this.maxAllowableAssociations=Number(t.target.value)}_refreshAssociations(){const{viewModel:t,viewModel:{state:s}}=this;"ready"!==s&&"warning"!==s||t.showAssociations()}_renderConnectivityAsssociationsSettings(){const{messages:{input:{enableConnectivity:t}},visibleElements:{connectivityAssociationsSettings:s}}=this;if(s)return l("calcite-block-section",{class:A.blockSectionSettings,text:t},l(c,{id:`${this.id}-symbol-picker-connectivity`,lineSymbol:this.connectivityAssociationsLineSymbol,showArrows:this.showArrowsConnectivity,visibleElements:s}))}_renderConnectivityAssociationsToggle(){const{messages:{input:{enableConnectivity:t}}}=this;return l("div",{class:A.labelAndToggle,key:"connectivityAssociationsToggleDiv"},l("calcite-label",{class:A.label},t),l("calcite-switch",{bind:this,checked:this.includeConnectivityAssociations,disabled:!this._associationsOptionsEnabled&&this.autoRefreshAssociations,onCalciteSwitchChange:this._connectivityAssociationsSwitchChange}))}_renderContent(){const{viewModel:{loadErrors:t,state:s}}=this;return"disabled"===s?l("div",{class:A.divControlsMain,key:"loadErrorsDiv"},t.items.map(this._getLoadErrorMessagesAsNotices)):l("calcite-panel",{disabled:"loading"===s},l("div",{class:A.divControlsMain},this._renderConnectivityAssociationsToggle(),this._renderStructuralAttachmentAssociationsToggle(),this._renderSettingsPane()))}_renderLoadingAction(t,s,i){return l("div",{key:t,slot:"control"},l("calcite-action",{id:s,loading:!0,text:i}),l("calcite-tooltip",{referenceElement:s},l("span",null,i)))}_renderMaxAllowableAssociationsSlider(){const{messages:{input:{maxAllowableAssociations:t}},visibleElements:{maxAllowableAssociationsSlider:s}}=this;if(s)return l("div",{class:A.labelAndSlider},l("calcite-label",{class:A.label},t),l("calcite-slider",{bind:this,class:A.slider,labelTicks:!0,max:this.maxAllowableAssociationsSliderMax,min:this.maxAllowableAssociationsSliderMin,scale:"s",snap:!0,step:this.maxAllowableAssociationsSliderStep,ticks:this.maxAllowableAssociationsSliderStep,value:this.maxAllowableAssociations,onCalciteSliderChange:this._maxAllowableAssociationsSliderChange}))}_renderRefreshAssociationsAction(){const{messages:{input:{refreshAssociations:t}},messagesCommon:{loading:s},viewModel:{state:i}}=this,e=`${this.id}-refresh-action`;if("disabled"!==i)return l("div",{class:A.actionRefresh,slot:"control"},l("calcite-action",{bind:this,class:A.action,icon:"refresh-",id:e,loading:"loading"===i,onclick:this._refreshAssociations,text:t}),l("calcite-tooltip",{referenceElement:e},l("span",null,"loading"===i?s:t)))}_renderSettingsPane(){const{messagesCommon:{settings:t},visibleElements:{maxAllowableAssociationsSlider:s,connectivityAssociationsSettings:i,structuralAttachmentAssociationsSettings:e}}=this;if(s||i||e)return l("calcite-block",{class:A.blockContent,collapsible:!0,heading:t},this._renderMaxAllowableAssociationsSlider(),this._renderConnectivityAsssociationsSettings(),this._renderStructuralAttachmentAsssociationsSettings())}_renderShowAssociationsSwitch(){const{messages:{input:{enableAssociations:t}},messagesCommon:{loading:s},viewModel:{state:i}}=this,e=`${this.id}-show-associations-switch`;if("disabled"!==i)return"loading"===i?this._renderLoadingAction("loadingActionDiv",`${this.id}-loading-action`,s):l("div",{class:A.switchContainer,key:"switchDiv",slot:"control"},l("calcite-switch",{bind:this,checked:this.showAssociationsEnabled,class:A.switch,id:e,onCalciteSwitchChange:this._showAssociationsSwitchChange}),l("calcite-tooltip",{referenceElement:e},l("span",null,t)))}_renderStatusIcon(){const{messagesCommon:{executing:t},viewModel:{executionError:s,state:i}}=this;switch(i){case"disabled":return this._renderWarningIcon("statusDiv",`${this.id}-disabled-icon`,null);case"warning":return this._renderWarningIcon("statusDiv",`${this.id}-warning-icon`,s);case"executing":return this._renderLoadingAction("executingActionDiv",`${this.id}-executing-action`,t);default:return}}_renderStructuralAttachmentAsssociationsSettings(){const{messages:{input:{enableStructuralAttachment:t}},visibleElements:{structuralAttachmentAssociationsSettings:s}}=this;if(s)return l("calcite-block-section",{class:A.blockSectionSettings,text:t},l(c,{id:`${this.id}-symbol-picker-structural-attachment`,lineSymbol:this.structuralAttachmentAssociationsLineSymbol,showArrows:this.showArrowsStructuralAttachment,visibleElements:s}))}_renderStructuralAttachmentAssociationsToggle(){const{messages:{input:{enableStructuralAttachment:t}}}=this;return l("div",{class:A.labelAndToggle,key:"structuralAttachmentAssociationsToggleDiv"},l("calcite-label",{class:A.label},t),l("calcite-switch",{bind:this,checked:this.includeStructuralAttachmentAssociations,disabled:!this._associationsOptionsEnabled&&this.autoRefreshAssociations,onCalciteSwitchChange:this._structuralAttAssociationsSwitchChange}))}_showAssociationsSwitchChange(t){const{viewModel:s}=this;this.showAssociationsEnabled=t.target.checked,this._associationsOptionsEnabled=t.target.checked,this.showAssociationsEnabled||s.removeAssociations()}_structuralAttAssociationsSwitchChange(t){this.includeStructuralAttachmentAssociations=t.target.checked}_renderWarningIcon(t,s,i){return i?l("div",{class:A.statusIconContainer,key:t,slot:"control"},l("calcite-icon",{class:A.statusIconWarning,icon:"exclamation-mark-triangle",id:s,scale:"s"}),l("calcite-tooltip",{referenceElement:s},l("span",null,i))):l("div",{class:A.statusIconContainer,key:t,slot:"control"},l("calcite-icon",{class:A.statusIconWarning,icon:"exclamation-mark-triangle",id:s,scale:"s"}))}};t([i()],m.prototype,"autoRefreshAssociations",null),t([i()],m.prototype,"connectivityAssociationsLineSymbol",null),t([i()],m.prototype,"includeConnectivityAssociations",null),t([i()],m.prototype,"includeStructuralAttachmentAssociations",null),t([i()],m.prototype,"label",null),t([i()],m.prototype,"maxAllowableAssociations",null),t([i()],m.prototype,"maxAllowableAssociationsSliderMax",null),t([i()],m.prototype,"maxAllowableAssociationsSliderMin",null),t([i()],m.prototype,"maxAllowableAssociationsSliderStep",null),t([i(),a("esri/widgets/UtilityNetworkAssociations/t9n/UtilityNetworkAssociations")],m.prototype,"messages",void 0),t([i(),a("esri/t9n/common")],m.prototype,"messagesCommon",void 0),t([i()],m.prototype,"showArrowsConnectivity",null),t([i()],m.prototype,"showArrowsStructuralAttachment",null),t([i()],m.prototype,"showAssociationsEnabled",null),t([i()],m.prototype,"structuralAttachmentAssociationsLineSymbol",null),t([i()],m.prototype,"utilityNetwork",null),t([i()],m.prototype,"view",null),t([i({type:r})],m.prototype,"viewModel",void 0),t([i({type:d,nonNullable:!0})],m.prototype,"visibleElements",void 0),m=t([e("esri.widgets.UtilityNetworkAssociations")],m);const u=m;export{u as default};