@arcgis/map-components/dist/cdn/DO5SU7RQ.js

ArcGIS Map Components

/* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
import{a as w}from"./CFHNK7GX.js";import f from"./KA7BM2DQ.js";import{a as P}from"./HZFVK34O.js";import{a as u}from"./54VXNFQ4.js";import e from"./LKOVDQTE.js";import c from"./OAWV35F7.js";import{h as D}from"./AKBXFBDL.js";import"./LMBRORN7.js";import a from"./5E6WEUZS.js";import{d as g}from"./PBSJQPB2.js";import{M as y,N as x,O as _,P as p,Q as v,R as L,U as C,a as b,b as d,x as h}from"./WUJCCZQC.js";import"./3TTFCHAA.js";export default $arcgis.t(([A,,,,$])=>{var k=b`:host{position:absolute;margin:0;background:transparent!important;padding:0;width:100%;height:100%;overflow:hidden;user-select:none;--arcgis-internal-swipe-handle-color-background: var(--calcite-color-background);--arcgis-internal-swipe-divider-color-background: var(--calcite-color-background)}.root{width:100%;height:100%;overflow:hidden;user-select:none}.root,.arcgis-ui .root{pointer-events:none!important}.container{position:absolute;z-index:1;margin:0;outline:0;border:0;padding:0;overflow:hidden;pointer-events:auto;touch-action:none;outline-color:transparent}.horizontal .container{margin-left:calc(var(--calcite-spacing-xxxl) / 2 * -1);cursor:col-resize;height:100%}.vertical .container{margin-top:calc(var(--calcite-spacing-xxxl) / 2 * -1);cursor:row-resize;width:100%}.disabled .container{cursor:default;pointer-events:none}.divider{position:absolute;background-color:var(--arcgis-internal-swipe-divider-color-background)}.horizontal .divider{top:0;left:calc(var(--calcite-spacing-xxxl) / 2);margin-left:calc(var(--calcite-border-width-lg) * .5 * -1);border-right:var(--calcite-border-width-sm) solid var(--calcite-color-border-1);border-left:var(--calcite-border-width-sm) solid var(--calcite-color-border-1);width:var(--calcite-border-width-lg);height:100%}.vertical .divider{top:calc(var(--calcite-spacing-xxxl) / 2);left:0;margin-top:calc(var(--calcite-border-width-lg) * .5 * -1);border-top:var(--calcite-border-width-sm) solid var(--calcite-color-border-1);border-bottom:var(--calcite-border-width-sm) solid var(--calcite-color-border-1);width:100%;height:var(--calcite-border-width-lg)}.handle{display:flex;position:relative;align-items:center;justify-content:center;border:var(--calcite-border-width-sm) solid var(--calcite-color-border-1);border-radius:var(--calcite-corner-radius-round);background-color:var(--arcgis-internal-swipe-handle-color-background);width:var(--calcite-spacing-xxxl);height:var(--calcite-spacing-xxxl);color:var(--calcite-color-text-3)}.handle-hidden{visibility:hidden}.vertical .handle{rotate:90deg}.handle-icon{position:relative;z-index:2}.handle-icon:before{content:"|||";color:inherit}.horizontal .handle{top:calc(50% - calc(var(--calcite-spacing-xxxl) / 2))}.vertical .handle{left:calc(50% - calc(var(--calcite-spacing-xxxl) / 2))}.container:focus .handle,.container:focus .divider{outline:inset 2px var(--calcite-color-focus, var(--calcite-color-focus, var(--calcite-color-brand)))}.container:focus .handle{outline-offset:calc(-2px*(1 - (2*clamp(0,var(--calcite-offset-invert-focus),1))))}`,z=$(A),f=class extends _{constructor(){super(...arguments),this._container=null,this._containerRef=y(),this._swiping=!1,this._positionChanged=!1,this.messages=P({}),this._pointerOffset=0,this.viewModel=z(this),this._onContainerPointerDown=e=>{e.preventDefault();let{_container:i}=this;i&&document.activeElement!==this.el&&i.focus(),this._swiping=!0,this._calculatePointerOffset(e)},this.view=this.viewModel.view,this.autoDestroyDisabled=!1,this.direction=this.viewModel.direction,this.disabled=!1,this.hideDivider=!1,this.hideHandle=!1,this.icon="compare",this.label=this.messages.componentLabel,this.position=this.viewModel.position,this.state=this.viewModel.state,this.arcgisPropertyChange=D()("state"),this.arcgisReady=h(),this.arcgisSwipeChange=h(),this.arcgisSwipeInput=h()}static{this.properties={view:0,autoDestroyDisabled:5,direction:3,disabled:7,endLayers:0,hideDivider:7,hideHandle:7,icon:1,label:1,leadingLayers:0,messageOverrides:0,position:9,startLayers:0,swipePosition:9,referenceElement:1,state:32,trailingLayers:0}}static{this.styles=k}get endLayers(){return this.viewModel.trailingLayers}set endLayers(e){this.viewModel.trailingLayers=e}get leadingLayers(){return this.startLayers}set leadingLayers(e){this.startLayers=e}get startLayers(){return this.viewModel.leadingLayers}set startLayers(e){this.viewModel.leadingLayers=e}get swipePosition(){return this.position}set swipePosition(e){this.position=e}get trailingLayers(){return this.endLayers}set trailingLayers(e){this.endLayers=e}async destroy(){await this.manager.destroy()}loaded(){this.listenOn(document,"pointermove",this._onContainerPointerMove),this.listenOn(document,"pointerup",this._onContainerPointerUp)}_calculatePointerOffset(e){let{direction:i}=this,t=this._containerRef.value,r=(i==="vertical"?t.clientHeight:t.clientWidth)/2,o=t.getBoundingClientRect(),a=e.clientX-o.left,l=e.clientY-o.top;this._pointerOffset=i==="vertical"?l-r:a-r}_onContainerPointerUp(e){this._swiping&&(e.preventDefault(),this._positionChanged&&(this.arcgisSwipeChange.emit(),this._positionChanged=!1),this._swiping=!1)}_onContainerPointerMove(e){if(!this._swiping)return;e.preventDefault();let{_pointerOffset:i,el:t,direction:r}=this,{clientX:o,clientY:a}=e,{top:l,left:n,width:s,height:c}=t.getBoundingClientRect(),M=r==="vertical"?c:s,m=(r==="vertical"?a-l-i:o-n-i)/M*100;this.position!==m&&(this.position=m,this._positionChanged=!0,this.arcgisSwipeInput.emit())}_getKeyPosition(e){let{key:i}=e,{position:t}=this,{max:r,min:o,step:a,stepMultiplier:l,direction:n}=this.viewModel,s=a*l;if(["ArrowUp","ArrowDown","ArrowLeft","ArrowRight","Home","End","PageUp","PageDown"].includes(i)&&(e.preventDefault(),e.stopPropagation()),n==="vertical"?i==="ArrowDown"||i==="ArrowRight":i==="ArrowUp"||i==="ArrowRight"){let c=e.shiftKey?s:a;return t+c}if(n==="vertical"?i==="ArrowUp"||i==="ArrowLeft":i==="ArrowDown"||i==="ArrowLeft"){let c=e.shiftKey?s:a;return t-c}return i==="Home"?o:i==="End"?r:(n==="vertical"?i==="PageDown":i==="PageUp")?t+s:(n==="vertical"?i==="PageUp":i==="PageDown")?t-s:null}_onContainerKeyDown(e){let i=this._getKeyPosition(e);typeof i=="number"&&this.position!==i&&(this.position=i,this.arcgisSwipeInput.emit(),this.arcgisSwipeChange.emit())}render(){let{state:e,direction:i}=this.viewModel,t=e==="disabled"||this.disabled,r={[u.disabled]:t,disabled:t,vertical:i==="vertical",horizontal:i==="horizontal"};return d`<div class=${p(g("root",u.widget,r))}>${e==="disabled"?null:this._renderContainer()}</div>`}_renderHandle(){let{direction:e}=this.viewModel,{hideHandle:i}=this,t={[w.dragHorizontal]:e==="vertical",[w.dragVertical]:e==="horizontal"},r=g("handle",!!i&&"handle-hidden");return d`<div class=${p(r)} role=presentation><span aria-hidden=true class=${p(g("handle-icon",t))}></span></div>`}_renderDivider(){return this.hideDivider?null:d`<div class="divider" role=presentation></div>`}_renderContent(){return[this._renderDivider(),this._renderHandle()]}_renderContainer(){let{disabled:e,viewModel:i}=this,{max:t,min:r,direction:o,position:a}=i,l=this.label??this.messages.dragLabel??"",n=`${a}%`,s={top:o==="vertical"?n:void 0,left:o==="vertical"?void 0:n},c=this._renderContent();return e?d`<div class="container" role=presentation style=${v(s)}>${c}</div>`:d`<div @pointerdown=${this._onContainerPointerDown} .ariaLabel=${l} .ariaOrientation=${o} .ariaValueMax=${`${t}`} .ariaValueMin=${`${r}`} .ariaValueNow=${`${a}`} .ariaValueText=${n} class="container" @keydown=${this._onContainerKeyDown} role=slider style=${v(s)} tabindex=0 title=${l??L} touch-action=none ${x(this._containerRef)}>${c}</div>`}};C("arcgis-swipe",f);return f},"widgets/Swipe/SwipeViewModel",a,c,e,f)