@arcgis/core/widgets/support/SnappingControls.js

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

/* COPYRIGHT Esri - https://js.arcgis.com/5.0.8/LICENSE.txt */
import{__decorate as e}from"tslib";import{isSome as t}from"../../core/arrayUtils.js";import{createTask as i}from"../../core/asyncUtils.js";import{destroyMaybe as s}from"../../core/maybe.js";import{watch as l}from"../../core/reactiveUtils.js";import{generateUID as n}from"../../core/uid.js";import{property as a,subclass as o}from"../../core/accessorSupport/decorators.js";import r from"../../views/interactive/snapping/SnappingOptions.js";import d from"../Widget.js";import{loadCalciteComponents as p}from"./componentsUtils.js";import{globalCss as g}from"./globalCss.js";import{loadLabeledSwitchComponents as c,LabeledSwitch as h}from"./LabeledSwitch.js";import{messageBundle as b,tsx as m}from"./widget.js";import{setFocus as y}from"./widgetUtils.js";import u from"./SnappingControls/SnappingControlsViewModel.js";import{itemTitleMatchesFilter as _}from"./SnappingControls/snappingLayerListUtils.js";import L from"./SnappingControls/VisibleElements.js";const w="esri-snapping-controls",v={base:w,container:`${w}__container`,toggleBlock:`${w}__toggle-block`,layerListBlock:`${w}__layer-list-block`,layerList:`${w}__layer-list`,layerListFilter:`${w}__layer-list__filter`,layerListButton:`${w}__layer-list__button`,layerListItem:`${w}__layer-list__item`,layerListGroup:`${w}__layer-list__group`,nestedContainer:`${w}__nested-container`};let f=class extends d{constructor(e,t){super(e,t),this._defaultViewModel=null,this._layerListFilter=null,this._gridLoadTask=null,this.layerListOpen=!0,this.gridOptionsOpen=!1,this.messages=null,this.messagesCommon=null,this.snappingManager=null,this.visibleElements=new L,this._enableSnappingSwitchChange=e=>{this.snappingOptions.enabled=e},this._featureEnabledSwitchChange=e=>{this.snappingOptions.featureEnabled=e},this._gridEnabledSwitchChange=e=>{this.snappingOptions.gridEnabled=e,e&&this._startLoadGrid()},this._selfEnabledSwitchChange=e=>{this.snappingOptions.selfEnabled=e},this._onToggleLayersButtonClick=e=>{this.viewModel.toggleSnappingForAllLayers(!this.viewModel.allLayersEnabled),y(e.target)},this.viewModel=e?.viewModel??(this._defaultViewModel=new u({snappingOptions:e?.snappingOptions,view:e?.view}))}destroy(){this.viewModel!==this._defaultViewModel&&(this._defaultViewModel=s(this._defaultViewModel))}loadDependencies(){return Promise.all([p({block:()=>import("@esri/calcite-components/dist/components/calcite-block"),button:()=>import("@esri/calcite-components/dist/components/calcite-button"),input:()=>import("@esri/calcite-components/dist/components/calcite-input"),list:()=>import("@esri/calcite-components/dist/components/calcite-list"),"list-item":()=>import("@esri/calcite-components/dist/components/calcite-list-item"),checkbox:()=>import("@esri/calcite-components/dist/components/calcite-checkbox"),loader:()=>import("@esri/calcite-components/dist/components/calcite-loader")}),c()])}initialize(){this.addHandles(l(()=>"2d"===this.view?.type&&!!this.view.grid,e=>{this.visibleElements.gridControls&&(this.snappingOptions.gridEnabled=e)}))}get _openAndReady(){return this.gridOptionsOpen&&this.snappingOptions.gridEnabled&&this.snappingOptions.enabled}get icon(){return"snap-to-point"}set icon(e){this._overrideIfSome("icon",e)}get label(){return this.messages?.widgetLabel??""}set label(e){this._overrideIfSome("label",e)}get snappingOptions(){return this.viewModel.snappingOptions}set snappingOptions(e){this.viewModel.snappingOptions=e}get view(){return this.viewModel.view}set view(e){this.viewModel.view=e}set viewModel(e){e!==this._get("viewModel")&&(null!=this._defaultViewModel&&this._defaultViewModel===e||(this._defaultViewModel=s(this._defaultViewModel)),this._set("viewModel",e))}render(){const{label:e}=this;return m("div",{"aria-label":e,class:this.classes(v.base,g.widget)},m("div",{class:v.container},this._renderContent()))}_renderContent(){return[this._renderToggles(),this._renderLayerList(),"2d"===this.view?.type&&this.visibleElements.gridControls?this._renderGridOptions():null]}_renderToggles(){const{visibleElements:e,view:i}=this,s=[e.selfEnabledToggle?this._renderSelfEnabledToggle():null,e.featureEnabledToggle?this._renderFeatureEnabledToggle():null,e.gridEnabledToggle&&"2d"===i?.type?this._renderGridEnabledToggle():null].filter(t),l=[e.enabledToggle?this._renderEnabledToggle():null,s.length>0?m("div",{class:v.nestedContainer},s):null].filter(t);return 0===l.length?null:m("calcite-block",{class:v.toggleBlock,expanded:!0,heading:e.header?this.label:"",key:"toggle-block",label:this.label},l)}_renderEnabledToggle(){return m(h,{checked:this.viewModel.snappingOptions.enabled,disabled:this._enabledToggleDisabled,key:`${this.id}__enabled-toggle`,label:this.messages.enableSnapping,topLayerDisabled:this.topLayerDisabled,onChange:this._enableSnappingSwitchChange})}_renderSelfEnabledToggle(){return m(h,{checked:this.viewModel.snappingOptions.selfEnabled,disabled:this._secondaryElementsDisabled,key:`${this.id}__self-enabled-toggle`,label:this.messages.geometryGuides,topLayerDisabled:this.topLayerDisabled,onChange:this._selfEnabledSwitchChange})}_renderFeatureEnabledToggle(){return m(h,{checked:this.viewModel.snappingOptions.featureEnabled,disabled:this._secondaryElementsDisabled,key:`${this.id}__feature-enabled-toggle`,label:this.messages.featureToFeature,topLayerDisabled:this.topLayerDisabled,onChange:this._featureEnabledSwitchChange})}_renderGridEnabledToggle(){return m(h,{checked:this.viewModel.snappingOptions.gridEnabled,disabled:this._secondaryElementsDisabled,key:`${this.id}__grid-enabled-toggle`,label:this.messages.grid,topLayerDisabled:this.topLayerDisabled,onChange:this._gridEnabledSwitchChange})}_renderLayerList(){if(!this.visibleElements.layerList)return null;const{messages:e,viewModel:t}=this,i=t.layerListViewModel.operationalItems.length>9?m("calcite-input",{class:v.layerListFilter,clearable:!0,placeholder:e?.searchLayers,onCalciteInputInput:({currentTarget:{value:e}})=>{this._layerListFilter=""===e?null:new RegExp(e,"i")}}):null,s=this._secondaryElementsDisabled,l=this.layerListOpen&&!s,n=t.layerListViewModel.operationalItems?.find(e=>!!e.children.length);return m("calcite-block",{class:v.layerListBlock,collapsible:!0,disabled:this._secondaryElementsDisabled,expanded:l,heading:e.snappingLayers,key:"list-block",onCalciteBlockToggle:e=>this.layerListOpen=e.currentTarget.expanded},i,this._renderToggleLayersButton(),m("calcite-list",{class:v.layerList,displayMode:n?"nested":"flat",label:e?.snappingLayers,selectionMode:"none"},this._renderLayerListItemCollection(t.layerListViewModel.operationalItems)))}_renderGridOptions(){const{view:e,visibleElements:t,snappingManager:i,snappingOptions:s,_openAndReady:l}=this,{gridEnabled:n,enabled:a}=s;(l||"2d"===e?.type&&e.grid)&&this._startLoadGrid();const o=this._gridLoadTask?.value,r=o&&"2d"===e?.type&&m(o,{snappingManager:i,snappingOptions:s,suppressDeprecationWarning:!0,view:e,visibleElements:t.gridControlsElements});return m("calcite-block",{class:v.layerListBlock,collapsible:!0,disabled:!n||!a,expanded:l,heading:this.messages.gridOptionsHeading,key:"grid-block",onCalciteBlockClose:()=>this.gridOptionsOpen=!1,onCalciteBlockOpen:()=>this.gridOptionsOpen=!0},r??m("calcite-loader",{label:this.messagesCommon.loading,scale:"s",text:this.messagesCommon.loading}))}_startLoadGrid(){!this._gridLoadTask&&this.visibleElements.gridControls&&"2d"===this.view?.type&&(this._gridLoadTask=i(async()=>(await import("./GridControls.js")).default))}_renderLayerListItemCollection(e){const i=this._layerListFilter;return e.map(e=>{switch(i?_(e,i):null){case"children":{const t=e.children.filter(e=>!1!==_(e,i));return this._renderLayerListItemGroup(e,t)}case"self":case null:return this._renderLayerListItemOrGroup(e);case!1:return"self"===_(e.parent,i)?this._renderLayerListItemOrGroup(e):null}}).toArray().filter(t)}_renderToggleLayersButton(){if(!this.visibleElements.layerListToggleLayersButton)return null;const{viewModel:{allLayersEnabled:e},messages:t}=this,i=e?t.disableAllLayers:t.enableAllLayers;return m("calcite-button",{appearance:"transparent",class:v.layerListButton,label:i,name:"layer-toggle",onclick:this._onToggleLayersButtonClick},i)}_renderLayerListItemOrGroup(e){if(e.children.length)return this._renderLayerListItemGroup(e);const{messages:{untitledLayer:t}}=this,i=e.title||t,s=()=>{this.viewModel.toggleSnappingForLayers([e.layer?.id],"enabled"!==e.enabled)};return m("calcite-list-item",{class:v.layerListItem,key:`${this.id}-list-item-${e.uid}`,label:i,onCalciteListItemSelect:e=>{e.stopPropagation(),s()}},m("calcite-checkbox",{checked:"enabled"===e.enabled,slot:"actions-start",onCalciteCheckboxChange:s}))}_renderLayerListItemGroup(e,t){const{messages:i}=this,{children:s,title:l}=e,a=l||i.untitledLayer,o=l&&""!==l?l:n(),r=!!t?.length,d=t??s,p=()=>{this.viewModel.toggleSnappingForLayers(e.childLayerIds,"enabled"!==e.enabled)},g=d?.find(e=>!!e.children.length);return m("calcite-list-item",{class:v.layerListGroup,expanded:r,key:o,label:a,onCalciteListItemSelect:e=>{e.stopPropagation(),p()}},m("calcite-checkbox",{checked:"enabled"===e.enabled,indeterminate:"indeterminate"===e.enabled,slot:"actions-start",onCalciteCheckboxChange:p}),m("calcite-list",{displayMode:g?"nested":"flat",label:i?.snappingLayers,selectionMode:"none"},this._renderLayerListItemCollection(d)))}get _enabledToggleDisabled(){const e=this.snappingOptions;return e.enabledToggled||e.forceDisabled}get _secondaryElementsDisabled(){return this._enabledToggleDisabled||!this.snappingOptions.enabled}};e([a()],f.prototype,"_defaultViewModel",void 0),e([a()],f.prototype,"_layerListFilter",void 0),e([a()],f.prototype,"_gridLoadTask",void 0),e([a()],f.prototype,"_openAndReady",null),e([a()],f.prototype,"label",null),e([a({type:Boolean,nonNullable:!0})],f.prototype,"layerListOpen",void 0),e([a({type:Boolean,nonNullable:!0})],f.prototype,"gridOptionsOpen",void 0),e([a(),b("esri/widgets/support/SnappingControls/t9n/SnappingControls")],f.prototype,"messages",void 0),e([a(),b("esri/t9n/common")],f.prototype,"messagesCommon",void 0),e([a({type:r})],f.prototype,"snappingOptions",null),e([a()],f.prototype,"snappingManager",void 0),e([a()],f.prototype,"view",null),e([a({type:u})],f.prototype,"viewModel",null),e([a({type:L,nonNullable:!0})],f.prototype,"visibleElements",void 0),e([a()],f.prototype,"_enabledToggleDisabled",null),e([a()],f.prototype,"_secondaryElementsDisabled",null),f=e([o("esri.widgets.support.SnappingControls")],f);const C=f;export{C as default};