@arcgis/core 5.1.0-next.25 → 5.1.0-next.26

package/views/3d/webgl-engine/lib/ShadowAccumulator.js

@@ -1,2 +1,2 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
-import{__decorate as t}from"tslib";import e from"../../../../core/Accessor.js";import{sliceEquals as i}from"../../../../core/arrayUtils.js";import"../../../../core/has.js";import{smoothstep as r}from"../../../../core/mathUtils.js";import{disposeMaybe as s}from"../../../../core/maybe.js";import{watch as o,sync as a}from"../../../../core/reactiveUtils.js";import{signal as n}from"../../../../core/signal.js";import{property as h,subclass as c}from"../../../../core/accessorSupport/decorators.js";import{copy as u,equals as l}from"../../../../core/libs/gl-matrix-2/math/vec3.js";import{create as m}from"../../../../core/libs/gl-matrix-2/factories/vec3f64.js";import{ReadShadowMapPassParameters as _}from"../core/shaderLibrary/shading/ReadShadowMap.glsl.js";import{BindParameters as p}from"./BindParameters.js";import{DepthRange as d}from"./DepthRange.js";import{createQuadVAO as f}from"./glUtil3D.js";import{ShadowCastRenderer as g,shadowCastDisabledElevationThreshold as b,shadowCastDisableElevationMax as v,shadowCastDisableElevationMin as S}from"./ShadowCastRenderer.js";import{ShadowMap as w}from"./ShadowMap.js";import{S as y}from"../../../../chunks/ShadowCastAccumulate.glsl.js";import{ShadowCastAccumulateTechnique as F}from"../shaders/ShadowCastAccumulateTechnique.js";import{ShadowCastAccumulateTechniqueConfiguration as A}from"../shaders/ShadowCastAccumulateTechniqueConfiguration.js";import{ShadowCastClearTechnique as x}from"../shaders/ShadowCastClearTechnique.js";import{TaskPriority as R}from"../../../support/Scheduler.js";import{SizedPixelFormat as C,PixelType as j}from"../../../webgl/enums.js";import{FramebufferObject as q}from"../../../webgl/FramebufferObject.js";import{TextureDescriptor as P}from"../../../webgl/TextureDescriptor.js";let T=class extends e{updateDepthRange(t){this._depthRange.equals(t)||(this._depthRange=t)}constructor(t,e,i,r,s,n){super({}),this.fbos=t,this._techniques=e,this._stage=i,this._prepareForShadowMapPass=r,this._renderToShadowMap=s,this._requestRender=n,this._primarySet=new M(new A(0),()=>this._requestRenderIfEnabled()),this._contextSet=new M(new A(1),()=>this._requestRenderIfEnabled()),this._passParameters=new _,this._depthRange=d.Zero,this._previewing=!1,this._shadowAccumulatorKey=Symbol("shadowAccumulator"),this._rctx=t.rctx,this._bindParameters=new p(this._rctx.emptyTexture,new w(t,i.viewingMode)),this._bindParameters.shadowMap.enabled=!0,this._vao=f(this._rctx),this._accumulationRenderer=new g(e,this._rctx,this,n);const h=this._stage.view.resourceController.scheduler;this.addHandles([h.registerTask(R.SHADOW_ACCUMULATOR,this),o(()=>this._previewing,t=>{t?this._invalidateAccumulationSets():this._requestRenderIfEnabled()},a),o(()=>2===this._numActive,()=>this._numActiveChanged(),a),o(()=>this._depthRange,()=>this._invalidateAccumulationSets(),a),o(()=>this.accumulating&&this.canAccumulate,()=>this._precompile(),{sync:!0,once:!0})],this._shadowAccumulatorKey)}normalizeCtorArgs(){return{}}destroy(){this._disable(),this.removeHandles(this._shadowAccumulatorKey),this._accumulationRenderer=s(this._accumulationRenderer),this._bindParameters.shadowMap.dispose(),this._fbo=s(this._fbo),this._vao=s(this._vao);for(const t of this._accumulationSets())t.destroy();this._contextSet=null,this._primarySet=null,this._bindParameters.destroy()}*_accumulationSets(){yield this._primarySet,yield this._contextSet}get computedSamples(){return[this._primarySet.progress,this._contextSet.progress]}get shadowCastTexture(){return this._fbo?.colorTexture}get accumulating(){return this.active&&this._previewing||this._refining}get _refining(){return this.active&&!this._doneAccumulating&&!this._previewing}get active(){return null!=this._fbo&&[...this._accumulationSets()].some(t=>t.active)}get canAccumulate(){return null!=this._bindParameters.depth&&this._depthRange!==d.Zero&&this._opacityFromElevation>b}get _doneAccumulating(){return[...this._accumulationSets()].every(t=>t.doneAccumulating)}get _opacityFromElevation(){return this._accumulationRenderer.opacityFromElevation}set _opacityFromElevation(t){this._accumulationRenderer.opacityFromElevation=t}get _numActive(){return[...this._accumulationSets()].reduce((t,e)=>t+(e.active?1:0),0)}get _pixelFormat(){return 2===this._numActive?{pixelFormat:33319,internalFormat:C.RG8}:{pixelFormat:6403,internalFormat:C.R8}}get readyToRun(){return this._refining&&this.canAccumulate&&[...this._accumulationSets()].some(t=>t.running)}_precompile(){for(const t of this._accumulationSets())this._techniques.precompile(F,t.configuration),this._techniques.precompile(x,t.configuration)}runTask(t){this._clearBuffersOnAccumulationStart(),this._prepareForShadowMapPass(this._bindParameters);let e=!1;for(const i of this._accumulationSets())this._runTaskForSet(i,t)&&(e=!0);e&&this._requestRender()}_runTaskForSet(t,e){let i=!1;for(;!e.done&&!t.doneAccumulating;)this._accumulateShadow(t),e.madeProgress(),i=!0;return i}renderAccumulation(t,e,i,r){return this._updateCamera(e),this._bindParameters.contentCamera=i,this._bindParameters.depth=t,this._passParameters.origin=this._bindParameters.camera.center,this.notifyChange("canAccumulate"),!(!this.accumulating||!this.canAccumulate)&&(this._previewing||r?(this._clearFramebuffer(),this._reset()):this._clearBuffersOnAccumulationStart(),this._accumulateSetsForRenderFrame(r))}_clearBuffersOnAccumulationStart(){if([...this._accumulationSets()].every(t=>0===t.progress))this._clearFramebuffer();else for(const t of this._accumulationSets())0===t.progress&&this._clearFramebufferForSet(this._fbo,t)}_accumulateSetsForRenderFrame(t){let e=!1;for(const i of this._accumulationSets())this._accumulateSetForRenderFrame(i,t)&&(e=!0);return e&&this._requestRender(),e}_accumulateSetForRenderFrame(t,e){let i=e?t.sampleCount:Math.min(D,t.sampleCount);i-=t.progress;for(let r=0;r<i;++r)this._accumulateShadow(t);return i>0}precompile(){this._accumulationRenderer.precompile()}render(t){this._accumulationRenderer.render(t)}setOptions(t){void 0!==t.previewing&&(this._previewing=t.previewing),void 0!==t.lightDirections&&(this._primarySet.lightDirections=t.lightDirections),void 0!==t.lightDirectionsContext&&(this._contextSet.lightDirections=t.lightDirectionsContext),!0===t.enabled?this._enable():!1===t.enabled&&this._disable(),this._accumulationRenderer.setOptions(t)}readAccumulatedShadow(t,e){const i=this._primarySet.progress;return!this.active||!this._fbo||i<1||t<0||t>=this._fbo.width||e<0||e>=this._fbo.height?0:(this._fbo.readPixels(t,e,1,1,6408,j.UNSIGNED_BYTE,E),E[0]/i)}_numActiveChanged(){if(!this._fbo)return;const t=2===this._numActive,e=this._createFBO();e.resize(this._fbo.width,this._fbo.height),t&&(this._clearFramebuffer(e),this._contextSet.reset()),this._fbo.width&&this._fbo.height&&this._rctx.blitFramebuffer(this._fbo,e),this._fbo.dispose(),this._fbo=e,this._requestRender()}_enable(){this._fbo||(this._fbo=this._createFBO(),this._invalidateAccumulationSets())}_createFBO(){const{pixelFormat:t,internalFormat:e}=this._pixelFormat,i=new P;return i.pixelFormat=t,i.internalFormat=e,i.wrapMode=33071,new q(this._rctx,i)}_invalidateAccumulationSets(){for(const t of this._accumulationSets())t.reset();this._requestRenderIfEnabled()}_disable(){this._fbo&&(this._fbo=s(this._fbo),this._requestRender())}_reset(){for(const t of this._accumulationSets())t.reset()}_clearFramebuffer(t=this._fbo){t&&t.width&&t.height&&(this._rctx.bindFramebuffer(t),this._rctx.setClearColor(0,0,0,0),this._rctx.clear(16384))}_clearFramebufferForSet(t,e){if(!t)return;const i=this._techniques.get(x,e.configuration);this._rctx.bindFramebuffer(t),this._rctx.bindTechnique(i,this._bindParameters,this._passParameters),this._rctx.bindVAO(this._vao),this._rctx.drawArrays(i.primitiveType,0,this._vao.vertexCount("geometry"))}_accumulateShadow(t){this._renderToShadowMap(this._bindParameters,t.lightDirections[t.progress++],this._depthRange);const e=this._techniques.get(F,t.configuration);this._rctx.bindFramebuffer(this._fbo),this._rctx.bindTechnique(e,this._bindParameters,this._passParameters),this._rctx.bindVAO(this._vao),this._rctx.drawArrays(e.primitiveType,0,this._vao.vertexCount("geometry"))}_updateCamera(t){const e=this._fbo;if(null==e)return;const i=this._bindParameters.camera;t.equals(i)||i.copyFrom(t),e.resize(t.fullWidth,t.fullHeight),this._opacityFromElevation=1-r(S,v,t.relativeElevation)}_requestRenderIfEnabled(){this._fbo&&this._requestRender()}get test(){}};t([h()],T.prototype,"_fbo",void 0),t([h()],T.prototype,"_depthRange",void 0),t([h()],T.prototype,"_previewing",void 0),t([h()],T.prototype,"_accumulationRenderer",void 0),t([h()],T.prototype,"_refining",null),t([h()],T.prototype,"active",null),t([h()],T.prototype,"canAccumulate",null),t([h()],T.prototype,"_doneAccumulating",null),t([h()],T.prototype,"_opacityFromElevation",null),t([h()],T.prototype,"_numActive",null),t([h()],T.prototype,"_pixelFormat",null),t([h()],T.prototype,"readyToRun",null),T=t([c("esri.views.3d.webgl-engine.lib.ShadowAccumulator")],T);const D=6,E=new Uint8Array(4);class M{constructor(t,e){this.configuration=t,this._notifyChange=e,this._cachedLightDirections=[],this._progress=n(0),this._sampleCount=n(0)}get progress(){return this._progress.value}set progress(t){this._progress.value=t}get sampleCount(){return this._sampleCount.value}get doneAccumulating(){return this.progress>=this.sampleCount}get running(){return this.progress>0}get active(){return this.sampleCount>0}get lightDirections(){return this._cachedLightDirections}set lightDirections(t){const e=this._cachedLightDirections,r=Math.min(y,t.length);if(!i(e,0,e.length,t,0,r,l)){e.length=r,this._sampleCount.value=r;for(let i=0;i<r;++i)e[i]=u(e[i]??m(),t[i]);this.reset(),this._notifyChange()}}destroy(){this._cachedLightDirections.length=0,this._sampleCount.value=0}reset(){this.progress=0}precompile(t){t.precompile(F,this.configuration),t.precompile(x,this.configuration)}}export{T as ShadowAccumulator};
+import{__decorate as e}from"tslib";import t from"../../../../core/Accessor.js";import{sliceEquals as i}from"../../../../core/arrayUtils.js";import"../../../../core/has.js";import{smoothstep as r}from"../../../../core/mathUtils.js";import{disposeMaybe as s}from"../../../../core/maybe.js";import{watch as a,sync as o}from"../../../../core/reactiveUtils.js";import{signal as n}from"../../../../core/signal.js";import{property as h,subclass as c}from"../../../../core/accessorSupport/decorators.js";import{copy as u,equals as l}from"../../../../core/libs/gl-matrix-2/math/vec3.js";import{create as _}from"../../../../core/libs/gl-matrix-2/factories/vec3f64.js";import{ReadShadowMapPassParameters as m}from"../core/shaderLibrary/shading/ReadShadowMap.glsl.js";import{BindParameters as d}from"./BindParameters.js";import{DepthRange as p}from"./DepthRange.js";import{createQuadVAO as f}from"./glUtil3D.js";import{ShadowCastRenderer as g,shadowCastDisabledElevationThreshold as b,shadowCastDisableElevationMax as v,shadowCastDisableElevationMin as S}from"./ShadowCastRenderer.js";import{ShadowMap as y}from"./ShadowMap.js";import{S as w}from"../../../../chunks/ShadowCastAccumulate.glsl.js";import{ShadowCastAccumulateTechnique as A}from"../shaders/ShadowCastAccumulateTechnique.js";import{ShadowCastAccumulateTechniqueConfiguration as F}from"../shaders/ShadowCastAccumulateTechniqueConfiguration.js";import{ShadowCastClearTechnique as R}from"../shaders/ShadowCastClearTechnique.js";import{TaskPriority as x}from"../../../support/Scheduler.js";import{PixelType as C}from"../../../webgl/enums.js";let H=class extends t{constructor(e,t,i,r,s,n){super({}),this._fbos=e,this._techniques=t,this._stage=i,this._prepareForShadowMapPass=r,this._renderToShadowMap=s,this._requestRender=n,this._primarySet=new j(new F(0),()=>this._requestRenderIfEnabled()),this._contextSet=new j(new F(1),()=>this._requestRenderIfEnabled()),this._passParameters=new m,this._depthRange=p.Zero,this._enabled=!1,this._previewing=!1,this._shadowAccumulatorKey=Symbol("shadowAccumulator"),this._bindParameters=new d(e.rctx.emptyTexture,new y(e,i.viewingMode)),this._bindParameters.shadowMap.enabled=!0,this._vao=f(e.rctx),this._accumulationRenderer=new g(t,e.rctx,this,n);const h=this._stage.view.resourceController.scheduler;this.addHandles([h.registerTask(x.SHADOW_ACCUMULATOR,this),a(()=>this._previewing,e=>{e?this._invalidateAccumulationSets():this._requestRenderIfEnabled()},o),a(()=>this._numActive,()=>this._numActiveChanged(),o),a(()=>this._depthRange,()=>this._invalidateAccumulationSets(),o),a(()=>this.accumulating&&this.canAccumulate,()=>this._precompile(),{sync:!0,once:!0})],this._shadowAccumulatorKey)}destroy(){this._disable(),this.removeHandles(this._shadowAccumulatorKey),this._accumulationRenderer=s(this._accumulationRenderer),this._bindParameters.shadowMap.dispose(),this._fboHandle=s(this._fboHandle),this._vao=s(this._vao);for(const e of this._accumulationSets())e.destroy();this._contextSet=null,this._primarySet=null,this._bindParameters.destroy()}*_accumulationSets(){yield this._primarySet,yield this._contextSet}get computedSamples(){return[this._primarySet.progress,this._contextSet.progress]}get shadowCastTexture(){return this._fboHandle?.getTexture()}get accumulating(){return this.active&&this._previewing||this._refining}get _refining(){return this.active&&!this._doneAccumulating&&!this._previewing}get active(){return this._enabled&&[...this._accumulationSets()].some(e=>e.active)}get canAccumulate(){return null!=this._bindParameters.depth&&this._depthRange!==p.Zero&&this._opacityFromElevation>b}get _doneAccumulating(){return[...this._accumulationSets()].every(e=>e.doneAccumulating)}get _opacityFromElevation(){return this._accumulationRenderer.opacityFromElevation}set _opacityFromElevation(e){this._accumulationRenderer.opacityFromElevation=e}get _numActive(){return[...this._accumulationSets()].reduce((e,t)=>e+(t.active?1:0),0)}get _colorFormat(){return 2===this._numActive?2:0}get readyToRun(){return this._refining&&this.canAccumulate&&[...this._accumulationSets()].some(e=>e.running)}_precompile(){for(const e of this._accumulationSets())this._techniques.precompile(A,e.configuration),this._techniques.precompile(R,e.configuration)}runTask(e){this._clearBuffersOnAccumulationStart(),this._prepareForShadowMapPass(this._bindParameters);let t=!1;for(const i of this._accumulationSets())this._runTaskForSet(i,e)&&(t=!0);t&&this._requestRender()}_runTaskForSet(e,t){let i=!1;for(;!t.done&&!e.doneAccumulating;)this._accumulateShadow(e),t.madeProgress(),i=!0;return i}renderAccumulation(e,t,i,r){return this._updateCamera(t),this._bindParameters.contentCamera=i,this._bindParameters.depth=e,this._passParameters.origin=this._bindParameters.camera.center,this.notifyChange("canAccumulate"),!(!this.accumulating||!this.canAccumulate)&&(this._previewing||r?(this._clearFramebuffer(),this._reset()):this._clearBuffersOnAccumulationStart(),this._accumulateSetsForRenderFrame(r))}_clearBuffersOnAccumulationStart(){if([...this._accumulationSets()].every(e=>0===e.progress))this._clearFramebuffer();else for(const e of this._accumulationSets())0===e.progress&&this._clearFramebufferForSet(this._fboHandle,e)}_accumulateSetsForRenderFrame(e){let t=!1;for(const i of this._accumulationSets())this._accumulateSetForRenderFrame(i,e)&&(t=!0);return t&&this._requestRender(),t}_accumulateSetForRenderFrame(e,t){let i=t?e.sampleCount:Math.min(q,e.sampleCount);i-=e.progress;for(let r=0;r<i;++r)this._accumulateShadow(e);return i>0}precompile(){this._accumulationRenderer.precompile()}render(e){this._accumulationRenderer.render(e)}setParameters(e){void 0!==e.previewing&&(this._previewing=e.previewing),void 0!==e.lightDirections&&(this._primarySet.lightDirections=e.lightDirections),void 0!==e.lightDirectionsContext&&(this._contextSet.lightDirections=e.lightDirectionsContext),!0===e.enabled?this._enable():!1===e.enabled&&this._disable(),this._accumulationRenderer.setOptions(e)}readAccumulatedShadow(e,t){const i=this._primarySet.progress;return!this.active||!this._fboHandle||i<1||e<0||e>=this._fboHandle.fbo.width||t<0||t>=this._fboHandle.fbo.height?0:(this._fboHandle.fbo.readPixels(e,t,1,1,6408,C.UNSIGNED_BYTE,P),P[0]/i)}_numActiveChanged(){if(!this._enabled||!this._fboHandle)return;const e=2===this._numActive,{width:t,height:i}=this._fboHandle.fbo,r=this._createFBO(t,i);e&&(this._clearFramebuffer(r),this._contextSet.reset()),this._rctx.blitFramebuffer(this._fboHandle.fbo,r.fbo),this._fboHandle.dispose(),this._fboHandle=r,this._requestRender()}_enable(){this._enabled||(this._enabled=!0,this._invalidateAccumulationSets())}_disable(){this._enabled&&(this._fboHandle=s(this._fboHandle),this._enabled=!1,this._requestRender())}_createFBO(e,t){return this._fbos.acquire(e,t,"shadow accumulation",this._colorFormat)}_invalidateAccumulationSets(){for(const e of this._accumulationSets())e.reset();this._requestRenderIfEnabled()}_reset(){for(const e of this._accumulationSets())e.reset()}_clearFramebuffer(e=this._fboHandle){e&&(this._rctx.bindFramebuffer(e.fbo),this._rctx.setClearColor(0,0,0,0),this._rctx.clear(16384))}_clearFramebufferForSet(e,t){if(!e)return;const i=this._techniques.get(R,t.configuration);this._rctx.bindFramebuffer(e.fbo),this._rctx.bindTechnique(i,this._bindParameters,this._passParameters),this._rctx.bindVAO(this._vao),this._rctx.drawArrays(i.primitiveType,0,this._vao.vertexCount("geometry"))}_accumulateShadow(e){this._renderToShadowMap(this._bindParameters,e.lightDirections[e.progress++],this._depthRange);const t=this._techniques.get(A,e.configuration);this._rctx.bindFramebuffer(this._fboHandle?.fbo),this._rctx.bindTechnique(t,this._bindParameters,this._passParameters),this._rctx.bindVAO(this._vao),this._rctx.drawArrays(t.primitiveType,0,this._vao.vertexCount("geometry"))}_updateCamera(e){if(!this._enabled)return;const t=this._bindParameters.camera;e.equals(t)||t.copyFrom(e),this._fboHandle?.fbo.width===e.fullWidth&&this._fboHandle?.fbo.height===e.fullHeight||(this._fboHandle?.release(),this._fboHandle=this._createFBO(e.fullWidth,e.fullHeight)),this._opacityFromElevation=1-r(S,v,e.relativeElevation)}_requestRenderIfEnabled(){this._enabled&&this._requestRender()}get _rctx(){return this._fbos.rctx}updateDepthRange(e){this._depthRange.equals(e)||(this._depthRange=e)}get test(){}};e([h()],H.prototype,"_refining",null),e([h()],H.prototype,"active",null),e([h()],H.prototype,"canAccumulate",null),e([h()],H.prototype,"_doneAccumulating",null),e([h()],H.prototype,"_opacityFromElevation",null),e([h()],H.prototype,"_numActive",null),e([h()],H.prototype,"_colorFormat",null),e([h()],H.prototype,"readyToRun",null),e([h()],H.prototype,"_depthRange",void 0),e([h()],H.prototype,"_enabled",void 0),e([h()],H.prototype,"_previewing",void 0),e([h()],H.prototype,"_accumulationRenderer",void 0),H=e([c("esri.views.3d.webgl-engine.lib.ShadowAccumulator")],H);const q=6,P=new Uint8Array(4);class j{constructor(e,t){this.configuration=e,this._notifyChange=t,this._cachedLightDirections=[],this._progress=n(0),this._sampleCount=n(0)}get progress(){return this._progress.value}set progress(e){this._progress.value=e}get sampleCount(){return this._sampleCount.value}get doneAccumulating(){return this.progress>=this.sampleCount}get running(){return this.progress>0}get active(){return this.sampleCount>0}get lightDirections(){return this._cachedLightDirections}set lightDirections(e){const t=this._cachedLightDirections,r=Math.min(w,e.length);if(!i(t,0,t.length,e,0,r,l)){t.length=r,this._sampleCount.value=r;for(let i=0;i<r;++i)t[i]=u(t[i]??_(),e[i]);this.reset(),this._notifyChange()}}destroy(){this._cachedLightDirections.length=0,this._sampleCount.value=0}reset(){this.progress=0}precompile(e){e.precompile(A,this.configuration),e.precompile(R,this.configuration)}}export{H as ShadowAccumulator};

package/views/3d/webgl-engine/lib/Viewshed.js

@@ -1,2 +1,2 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
-import{__decorate as e}from"tslib";import s from"../../../../core/Collection.js";import{deg2rad as t}from"../../../../core/mathUtils.js";import{disposeMaybe as r}from"../../../../core/maybe.js";import{watch as i,initial as o,when as a,sync as n}from"../../../../core/reactiveUtils.js";import{property as h,subclass as d}from"../../../../core/accessorSupport/decorators.js";import{translate as c,fromTranslation as p,scale as w,mul as l}from"../../../../core/libs/gl-matrix-2/math/mat4.js";import{create as m}from"../../../../core/libs/gl-matrix-2/factories/mat4f64.js";import{sub as f,distance as u}from"../../../../core/libs/gl-matrix-2/math/vec3.js";import{create as v,fromValues as _}from"../../../../core/libs/gl-matrix-2/factories/vec3f64.js";import{Sphere as V}from"../../../../geometry/support/sphere.js";import{InternalRenderCategory as g}from"../../webgl.js";import M from"../../webgl/RenderNode.js";import{ViewshedShadowMap as b}from"./ViewshedShadowMap.js";import{V as y}from"../../../../chunks/Viewshed.glsl.js";import{ViewshedTechnique as S}from"../shaders/ViewshedTechnique.js";let j=class extends M{get shadowMap(){return this._shadowMap}get hasViewsheds(){return this._viewsheds.length>0}get _contentPixelRatio(){return this.view.state.contentPixelRatio}get _viewshedsInView(){return this._viewsheds.items.filter(e=>P(this.view,e))}constructor(e){super(e),this.isDecoration=!1,this._passParameters=new y,this._viewsheds=new s,this._shadowMap=null,this.consumes={required:[g.VIEWSHED,"normals"]},this.produces=g.VIEWSHED,this.requireGeometryDepth=!0}initialize(){this._shadowMap=new b(this.fboCache),this.addHandles([i(()=>this.view.resolutionScale,e=>{const s=this._shadowMap;s&&(s.settings.textureSizeQuality=e)},o),a(()=>!this.hasViewsheds,()=>this._shadowMap?.dispose()),i(()=>this._viewshedsInView.map(e=>[e.observerRenderSpace,e.heading,e.tilt,e.farDistance,e.horizontalFieldOfView,e.verticalFieldOfView]),()=>this.requestRender(1),n)])}destroy(){this._shadowMap=r(this._shadowMap)}precompile(){if(this.hasViewsheds){this.techniques.precompile(S);for(const e of this._viewshedsInView)if(this._shadowMap?.isActive(e))return void this.view.stage.renderer.precompileViewshedShadowMap()}}render(e){const s=this.bindParameters,t=this.renderingContext,r=e.find(({name:e})=>e===g.VIEWSHED);if(!this.hasViewsheds||!s.depth||this.isDecoration&&!s.decorations)return r;this._passParameters.shadowMap=this._shadowMap??this._passParameters.shadowMap,this._passParameters.normals=e.find(({name:e})=>"normals"===e)?.getTexture();const i=this.techniques.get(S);if(!i?.compiled)return this.requestRender(1),r;const o=this.view.stage.renderer.isFeatureEnabled(8);for(const a of this._viewshedsInView){if(!this._renderShadowCubeMap(s,a,o)||!this._shadowMap?.ready)continue;const e=this._setupViewshedParameters(a,s.camera);t.bindFramebuffer(r.fbo),t.bindTechnique(i,s,e),t.screen.draw()}return this.shadowMap?.dispose(),r}updateViewsheds(e){const s=this._viewsheds,{removes:t,adds:r}=e;if(t&&(Array.isArray(t)?s.removeMany(t):s.remove(t)),r)if(Array.isArray(r)){const e=r.filter(e=>!s.includes(e));s.addMany(e)}else s.includes(r)||s.add(r)}_renderShadowCubeMap(e,s,t){const r=this._shadowMap;if(!r)return!1;const i=this.view.basemapTerrain.hasStencilEnabledExtents,o=r.start(e.camera,s,t,this._contentPixelRatio,i);return o&&r.faces.forEach(e=>this.view.stage.renderer.renderViewshedShadowMap(e)),r.finish(),o}_setupViewshedParameters(e,s){const r=this._shadowMap;if(!r)return this._passParameters;const i=this._passParameters,o=e.effectiveObserverRenderSpace;i.localOrigin=o,i.observerOffset=f(E,e.observerRenderSpace,e.effectiveObserverRenderSpace),i.fovs=[t(e.horizontalFieldOfView),t(e.verticalFieldOfView)],i.headingAndTilt=[t(e.heading),t(e.tiltParallelToSurface)],i.upVector=e.tiltedUpVector;const a=R(e.targetRenderSpace,o);i.targetVector=a;const n=new Array,h=new Array;for(let t=0;t<r.numActiveFaces;t++)c(I,r.viewshedViewMatrices[t],o),n.push(...I),x(r.viewshedProjectionMatrices[t],I,D),h.push(...D);return i.viewMatrices=n,i.projectionMatrices=h,i.volumeOffset=this.selectedViewshed?.()===e.viewshed?A(e,this.view,s.eye):0,i}get test(){return{viewsheds:this._viewsheds,shadowMap:this._shadowMap,viewshedsInView:this._viewshedsInView}}};function R(e,s){const t=v();return f(t,e,s)}function x(e,s,t){const r=_(.5,.5,.5);return p(t,r),w(t,t,r),l(t,t,e),l(t,t,s),t}function P(e,s){const t=new V(s.observerRenderSpace,s.farDistanceRenderSpace);return!!e.ready&&e.frustum.intersectsSphere(t)}function A(e,s,t){if(null==e)return 0;const{observerRenderSpace:r,targetRenderSpace:i}=e,o=u(t,r)>u(t,i)?e.observer:e.target;return s.pixelSizeAt(o)}e([h()],j.prototype,"selectedViewshed",void 0),e([h()],j.prototype,"isDecoration",void 0),e([h()],j.prototype,"shadowMap",null),e([h()],j.prototype,"hasViewsheds",null),e([h()],j.prototype,"_contentPixelRatio",null),e([h()],j.prototype,"_viewshedsInView",null),e([h()],j.prototype,"consumes",void 0),e([h()],j.prototype,"produces",void 0),j=e([d("esri.views.3d.webgl-engine.lib.Viewshed")],j);const E=v(),I=m(),D=m();export{j as Viewshed,A as computeOffsetScale};
+import{__decorate as e}from"tslib";import s from"../../../../core/Collection.js";import{deg2rad as t}from"../../../../core/mathUtils.js";import{disposeMaybe as r}from"../../../../core/maybe.js";import{watch as i,initial as o,when as a,sync as n}from"../../../../core/reactiveUtils.js";import{property as h,subclass as d}from"../../../../core/accessorSupport/decorators.js";import{translate as c,fromTranslation as p,scale as w,mul as l}from"../../../../core/libs/gl-matrix-2/math/mat4.js";import{create as m}from"../../../../core/libs/gl-matrix-2/factories/mat4f64.js";import{sub as f,distance as u}from"../../../../core/libs/gl-matrix-2/math/vec3.js";import{create as v,fromValues as _}from"../../../../core/libs/gl-matrix-2/factories/vec3f64.js";import{Sphere as V}from"../../../../geometry/support/sphere.js";import{InternalRenderCategory as g}from"../../webgl.js";import M from"../../webgl/RenderNode.js";import{ViewshedShadowMap as b}from"./ViewshedShadowMap.js";import{V as y}from"../../../../chunks/Viewshed.glsl.js";import{ViewshedTechnique as S}from"../shaders/ViewshedTechnique.js";let j=class extends M{get shadowMap(){return this._shadowMap}get hasViewsheds(){return this._viewsheds.length>0}get _contentPixelRatio(){return this.view.state.contentPixelRatio}get _viewshedsInView(){return this._viewsheds.items.filter(e=>P(this.view,e))}constructor(e){super(e),this.isDecoration=!1,this._passParameters=new y,this._viewsheds=new s,this._shadowMap=null,this.consumes={required:[g.VIEWSHED,"normals"]},this.produces=g.VIEWSHED,this.requireGeometryDepth=!0}initialize(){this._shadowMap=new b(this.fboCache),this.addHandles([i(()=>this.view.resolutionScale,e=>{const s=this._shadowMap;s&&(s.settings.textureSizeQuality=e)},o),a(()=>!this.hasViewsheds,()=>this._shadowMap?.dispose()),i(()=>this._viewshedsInView.map(e=>[e.observerRenderSpace,e.heading,e.tilt,e.farDistance,e.horizontalFieldOfView,e.verticalFieldOfView]),()=>this.requestRender(1),n)])}destroy(){this._shadowMap=r(this._shadowMap)}precompile(){if(this.hasViewsheds){this.techniques.precompile(S);for(const e of this._viewshedsInView)if(this._shadowMap?.isActive(e))return void this.view.stage.renderer.precompileViewshedShadowMap()}}render(e){const s=this.bindParameters,t=this.renderingContext,r=e.find(({name:e})=>e===g.VIEWSHED);if(!this.hasViewsheds||!s.depth||this.isDecoration&&!s.decorations)return r;const i=this.techniques.getCompiled(S);if(!i)return this.requestRender(1),r;const o=this.view.stage.renderer.isFeatureEnabled(8);this._passParameters.shadowMap=this._shadowMap??this._passParameters.shadowMap,this._passParameters.normals=e.find(({name:e})=>"normals"===e)?.getTexture();for(const a of this._viewshedsInView){if(!this._renderShadowCubeMap(s,a,o)||!this._shadowMap?.ready)continue;const e=this._setupViewshedParameters(a,s.camera);t.bindFramebuffer(r.fbo),t.bindTechnique(i,s,e),t.screen.draw()}return this.shadowMap?.dispose(),r}updateViewsheds(e){const s=this._viewsheds,{removes:t,adds:r}=e;if(t&&(Array.isArray(t)?s.removeMany(t):s.remove(t)),r)if(Array.isArray(r)){const e=r.filter(e=>!s.includes(e));s.addMany(e)}else s.includes(r)||s.add(r)}_renderShadowCubeMap(e,s,t){const r=this._shadowMap;if(!r)return!1;const i=this.view.basemapTerrain.hasStencilEnabledExtents,o=r.start(e.camera,s,t,this._contentPixelRatio,i);return o&&r.faces.forEach(e=>this.view.stage.renderer.renderViewshedShadowMap(e)),r.finish(),o}_setupViewshedParameters(e,s){const r=this._shadowMap;if(!r)return this._passParameters;const i=this._passParameters,o=e.effectiveObserverRenderSpace;i.localOrigin=o,i.observerOffset=f(E,e.observerRenderSpace,e.effectiveObserverRenderSpace),i.fovs=[t(e.horizontalFieldOfView),t(e.verticalFieldOfView)],i.headingAndTilt=[t(e.heading),t(e.tiltParallelToSurface)],i.upVector=e.tiltedUpVector;const a=R(e.targetRenderSpace,o);i.targetVector=a;const n=new Array,h=new Array;for(let t=0;t<r.numActiveFaces;t++)c(I,r.viewshedViewMatrices[t],o),n.push(...I),x(r.viewshedProjectionMatrices[t],I,D),h.push(...D);return i.viewMatrices=n,i.projectionMatrices=h,i.volumeOffset=this.selectedViewshed?.()===e.viewshed?A(e,this.view,s.eye):0,i}get test(){return{viewsheds:this._viewsheds,shadowMap:this._shadowMap,viewshedsInView:this._viewshedsInView}}};function R(e,s){const t=v();return f(t,e,s)}function x(e,s,t){const r=_(.5,.5,.5);return p(t,r),w(t,t,r),l(t,t,e),l(t,t,s),t}function P(e,s){const t=new V(s.observerRenderSpace,s.farDistanceRenderSpace);return!!e.ready&&e.frustum.intersectsSphere(t)}function A(e,s,t){if(null==e)return 0;const{observerRenderSpace:r,targetRenderSpace:i}=e,o=u(t,r)>u(t,i)?e.observer:e.target;return s.pixelSizeAt(o)}e([h()],j.prototype,"selectedViewshed",void 0),e([h()],j.prototype,"isDecoration",void 0),e([h()],j.prototype,"shadowMap",null),e([h()],j.prototype,"hasViewsheds",null),e([h()],j.prototype,"_contentPixelRatio",null),e([h()],j.prototype,"_viewshedsInView",null),e([h()],j.prototype,"consumes",void 0),e([h()],j.prototype,"produces",void 0),j=e([d("esri.views.3d.webgl-engine.lib.Viewshed")],j);const E=v(),I=m(),D=m();export{j as Viewshed,A as computeOffsetScale};

package/views/3d/webgl-engine/shaders/MeasurementArrow.glsl.js

@@ -1,2 +1,2 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
-import"../core/shaderLibrary/util/View.glsl.js";import"../core/shaderModules/Float4PassUniform.js";import"../core/shaderModules/FloatPassUniform.js";import"../core/shaderModules/glsl.js";import"./alphaCutoff.glsl.js";import"../../../webgl/ShaderBuilder.js";export{b as build}from"../../../../chunks/MeasurementArrow.glsl.js";
+import"../core/shaderLibrary/util/View.glsl.js";import"../core/shaderModules/Float4PassUniform.js";import"../core/shaderModules/FloatPassUniform.js";import"../core/shaderModules/glsl.js";import"./OutputColorHighlightOLID.glsl.js";import"../../../webgl/ShaderBuilder.js";export{b as build}from"../../../../chunks/MeasurementArrow.glsl.js";

package/views/3d/webgl-engine/shaders/MeasurementArrowTechnique.js

@@ -1,2 +1,2 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
-import{__decorate as e}from"tslib";import{subclass as r}from"../../../../core/accessorSupport/decorators.js";import{glLayout as o}from"../../support/buffer/glUtil.js";import{newLayout as t}from"../../support/buffer/InterleavedLayout.js";import{ReloadableShader as s}from"../core/shaderTechnique/ReloadableShader.js";import{ShaderTechnique as i}from"../core/shaderTechnique/ShaderTechnique.js";import{blending as n}from"../lib/OrderIndependentTransparency.js";import{M as p}from"../../../../chunks/MeasurementArrow.glsl.js";import{PrimitiveType as l}from"../../../webgl/enums.js";import{makePipelineState as a,defaultColorWrite as m,defaultDepthWrite as f}from"../../../webgl/renderState.js";let u=class extends i{constructor(e,r){super(e,r,o(c)),this.shader=new s(p,()=>import("./MeasurementArrow.glsl.js")),this.primitiveType=l.TRIANGLE_STRIP}initializePipeline(e){return a({blending:e.transparent?n(e.oitPass):null,polygonOffset:e.polygonOffsetEnabled?{factor:0,units:-4}:null,depthTest:{func:513},depthWrite:f,colorWrite:m})}};u=e([r("esri.views.3d.webgl-engine.shaders.MeasurementArrowTechnique")],u);const c=t().vec3f("position").vec3f("normal").vec2f("uv0").f32("length");export{u as MeasurementArrowTechnique,c as layout};
+import{__decorate as e}from"tslib";import{subclass as r}from"../../../../core/accessorSupport/decorators.js";import{glLayout as s}from"../../support/buffer/glUtil.js";import{newLayout as o}from"../../support/buffer/InterleavedLayout.js";import{ReloadableShader as t}from"../core/shaderTechnique/ReloadableShader.js";import{ShaderTechnique as i}from"../core/shaderTechnique/ShaderTechnique.js";import{drawBuffers as n,blending as p}from"../lib/OrderIndependentTransparency.js";import{M as a}from"../../../../chunks/MeasurementArrow.glsl.js";import{PrimitiveType as l}from"../../../webgl/enums.js";import{makePipelineState as m,defaultColorWrite as f,defaultDepthWrite as u}from"../../../webgl/renderState.js";let c=class extends i{constructor(e,r){super(e,r,s(d)),this.shader=new t(a,()=>import("./MeasurementArrow.glsl.js")),this.primitiveType=l.TRIANGLE_STRIP}initializePipeline(e){const{transparent:r,oitPass:s,polygonOffsetEnabled:o,hasEmission:t}=e;return m({blending:r?p(s):null,polygonOffset:o?{factor:0,units:-4}:null,depthTest:{func:513},depthWrite:u,drawBuffers:n(s,t),colorWrite:f})}};c=e([r("esri.views.3d.webgl-engine.shaders.MeasurementArrowTechnique")],c);const d=o().vec3f("position").vec3f("normal").vec2f("uv0").f32("length");export{c as MeasurementArrowTechnique,d as layout};

package/views/3d/webgl-engine/shaders/MeasurementArrowTechniqueConfiguration.js

@@ -1,2 +1,2 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
-import{__decorate as o}from"tslib";import{parameter as t}from"../core/shaderTechnique/ShaderTechniqueConfiguration.js";import{DefaultTechniqueConfiguration as e}from"../materials/DefaultTechniqueConfiguration.js";class r extends e{constructor(){super(...arguments),this.polygonOffsetEnabled=!1,this.transparent=!1}}o([t()],r.prototype,"polygonOffsetEnabled",void 0),o([t()],r.prototype,"transparent",void 0);export{r as MeasurementArrowTechniqueConfiguration};
+import{__decorate as e}from"tslib";import{parameter as t}from"../core/shaderTechnique/ShaderTechniqueConfiguration.js";import{DefaultTechniqueConfiguration as o}from"../materials/DefaultTechniqueConfiguration.js";class r extends o{constructor(){super(...arguments),this.polygonOffsetEnabled=!1,this.transparent=!1,this.discardInvisibleFragments=!0,this.draped=!1,this.emissionSource=0,this.snowCover=!1,this.textureCoordinateType=0}}e([t()],r.prototype,"polygonOffsetEnabled",void 0),e([t()],r.prototype,"transparent",void 0);export{r as MeasurementArrowTechniqueConfiguration};

package/views/layers/MediaLayerView.d.ts

@@ -1,8 +1,12 @@
+import type MediaLayer from "../../layers/MediaLayer.js";
+import type MediaLayerInteractionOptions from "../3d/layers/support/MediaLayerInteractionOptions.js";
 import type LayerView from "./LayerView.js";
-import type { MediaLayerViewMixin, MediaLayerViewMixinProperties } from "./MediaLayerViewMixin.js";
+import type { ResourceHandle } from "../../core/Handles.js";
+import type { MediaElement } from "../../layers/media/types.js";
+import type { LayerViewHighlightOptions } from "./types.js";
 import type { LayerViewProperties } from "./LayerView.js";
 
-export interface MediaLayerViewProperties extends LayerViewProperties, MediaLayerViewMixinProperties {}
+export interface MediaLayerViewProperties extends LayerViewProperties, Partial<Pick<MediaLayerView, "interactionOptions" | "interactive" | "selectedElement">> {}
 
 /**
  * Represents the [LayerView](https://developers.arcgis.com/javascript/latest/references/core/views/layers/LayerView/) of a [MediaLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/MediaLayer/)
@@ -27,5 +31,87 @@ export interface MediaLayerViewProperties extends LayerViewProperties, MediaLaye
  * @since 4.30
  * @see [MediaLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/MediaLayer/)
  */
-export default abstract class MediaLayerView extends MediaLayerViewSuperclass {}
-declare const MediaLayerViewSuperclass: typeof LayerView & typeof MediaLayerViewMixin
+export default abstract class MediaLayerView extends LayerView {
+  /**
+   * Options for when the layer view is interactive.
+   *
+   * > [!WARNING]
+   * >
+   * > Interactivity for 2D [MapViews](https://developers.arcgis.com/javascript/latest/references/core/views/MapView/) was added at version 4.31.
+   *
+   * @since 4.30
+   * @see [interactive](https://developers.arcgis.com/javascript/latest/references/core/views/layers/MediaLayerView/#interactive)
+   */
+  accessor interactionOptions: MediaLayerInteractionOptions;
+  /**
+   * Enables interactivity for the [layer](https://developers.arcgis.com/javascript/latest/references/core/views/layers/MediaLayerView/#layer). When set to `true`, any elements in the
+   * layer's [MediaLayer.source](https://developers.arcgis.com/javascript/latest/references/core/layers/MediaLayer/#source) become selectable and editable.
+   *
+   * > [!WARNING]
+   * >
+   * > Interactivity for 2D [MapViews](https://developers.arcgis.com/javascript/latest/references/core/views/MapView/) was added at version 4.31.
+   *
+   * @default false
+   * @since 4.30
+   * @see [selectedElement](https://developers.arcgis.com/javascript/latest/references/core/views/layers/MediaLayerView/#selectedElement)
+   * @see [interactionOptions](https://developers.arcgis.com/javascript/latest/references/core/views/layers/MediaLayerView/#interactionOptions)
+   * @example
+   * view.whenLayerView(mediaLayer).then((mediaLayerView) => {
+   *   // Enable interactivity and select first element
+   *   mediaLayerView.interactive = true;
+   *
+   *   mediaLayerView.selectedElement = mediaLayer.source.elements.at(0);
+   * });
+   */
+  accessor interactive: boolean;
+  /**
+   * The layer being viewed.
+   *
+   * @since 5.0
+   */
+  get layer(): MediaLayer;
+  /**
+   * The selected element. If [interactive](https://developers.arcgis.com/javascript/latest/references/core/views/layers/MediaLayerView/#interactive) is `true`, any element in the
+   * [layer](https://developers.arcgis.com/javascript/latest/references/core/views/layers/MediaLayerView/#layer) can be selected by clicking on it in the view. As long as [interactive](https://developers.arcgis.com/javascript/latest/references/core/views/layers/MediaLayerView/#interactive)
+   * remains `true`, the properties of the selected element can be edited by interacting with
+   * manipulators in the view.
+   *
+   * > [!WARNING]
+   * >
+   * > Interactivity for 2D [MapViews](https://developers.arcgis.com/javascript/latest/references/core/views/MapView/) was added at version 4.31.
+   *
+   * @since 4.30
+   * @see [interactive](https://developers.arcgis.com/javascript/latest/references/core/views/layers/MediaLayerView/#interactive)
+   * @example
+   * view.whenLayerView(mediaLayer).then((mediaLayerView) => {
+   *   // Enable interactivity and select first element
+   *   mediaLayerView.interactive = true;
+   *
+   *   mediaLayerView.selectedElement = mediaLayer.source.elements.at(0);
+   * });
+   */
+  accessor selectedElement: MediaElement | null | undefined;
+  /**
+   * Highlights the given media element(s) in a MediaLayerView. Highlights are only supported in
+   * [3D SceneView](https://developers.arcgis.com/javascript/latest/references/core/views/SceneView/) or [Scene component](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-scene/).
+   *
+   * @param target - The media element(s) to highlight.
+   * @param options - An object with the following properties.
+   * @returns Returns a highlight handler with a `remove()` method that
+   * can be called to remove the highlight.
+   * @since 5.0
+   * @see [SceneView.highlights](https://developers.arcgis.com/javascript/latest/references/core/views/SceneView/#highlights)
+   * @see [Sample: Highlight SceneLayer](https://developers.arcgis.com/javascript/latest/sample-code/highlight-scenelayer/)
+   * @example
+   * // Add a new set of highlight options to the highlights collection
+   * const highlightName = "mark";
+   * view.highlights.push({ name: highlightName, color: "red", fillOpacity: 0.5 });
+   *
+   * // Highlight a specific media element
+   * view.whenLayerView(layer).then((layerView) => {
+   *   let element = layer.source.elements.getItemAt(0);
+   *   layerView.highlight(element, { name: highlightName } );
+   * });
+   */
+  highlight(target: MediaElement | Iterable<MediaElement>, options?: LayerViewHighlightOptions): ResourceHandle;
+}

package/views/layers/MediaLayerView.js

@@ -1,2 +1,2 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
-import e from"./LayerView.js";import{MediaLayerViewMixin as i}from"./MediaLayerViewMixin.js";class r extends(i(e)){}export{r as default};
+import{__decorate as t}from"tslib";import{property as e}from"../../core/accessorSupport/decorators.js";import o from"../3d/layers/support/MediaLayerInteractionOptions.js";import r from"./LayerView.js";class i extends r{constructor(){super(...arguments),this.layer=null,this.interactive=!1,this.interactionOptions=new o,this.selectedElement=null}highlight(t,e){throw new Error("missing implementation")}}t([e()],i.prototype,"layer",void 0),t([e()],i.prototype,"interactive",void 0),t([e({type:o})],i.prototype,"interactionOptions",void 0),t([e()],i.prototype,"selectedElement",void 0);export{i as default};

package/widgets/Measurement.d.ts

@@ -86,7 +86,7 @@ export type MeasurementWidget = AreaMeasurement | DistanceMeasurement;
  *   - all three distances (direct, horizontal, and vertical), areas, and perimeters are computed in
  *     a Euclidean manner (in their respective PCS).
  *
- * @deprecated since version 5.0. Use the [Area Measurement 2D](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-area-measurement-2d/), [Area Measurement 3D](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-area-measurement-3d/), [Direct Line Measurement 3D](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-direct-line-measurement-3d/), or [Distance Measurement 2D](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-distance-measurement/) components instead. For information on widget deprecation, read about [Esri's move to web components](https://developers.arcgis.com/javascript/latest/components-transition-plan/).
+ * @deprecated since version 5.0. Use the [Area Measurement 2D](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-area-measurement-2d/), [Area Measurement 3D](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-area-measurement-3d/), [Direct Line Measurement 3D](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-direct-line-measurement-3d/), or [Distance Measurement 2D](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-distance-measurement-2d/) components instead. For information on widget deprecation, read about [Esri's move to web components](https://developers.arcgis.com/javascript/latest/components-transition-plan/).
  * @since 4.13
  * @see [MeasurementViewModel](https://developers.arcgis.com/javascript/latest/references/core/widgets/Measurement/MeasurementViewModel/)
  * @see [Sample - Measurement widget](https://developers.arcgis.com/javascript/latest/sample-code/widgets-measurement/)