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

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

/*
All material copyright ESRI, All Rights Reserved, unless otherwise specified.
See https://js.arcgis.com/4.33/esri/copyright.txt for details.
*/
import{_ as e}from"../../chunks/tslib.es6.js";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 o}from"../../core/accessorSupport/decorators/property.js";import"../../core/has.js";import"../../core/Logger.js";import{subclass as a}from"../../core/accessorSupport/decorators/subclass.js";import r from"../Widget.js";import{loadCalciteComponents as d}from"./componentsUtils.js";import{globalCss as p}from"./globalCss.js";import{loadLabeledSwitchComponents as c,LabeledSwitch as g}from"./LabeledSwitch.js";import{setFocus as h}from"./widgetUtils.js";import{messageBundle as b}from"./decorators/messageBundle.js";import{tsx as m}from"./jsxFactory.js";import u from"./SnappingControls/SnappingControlsViewModel.js";import{itemTitleMatchesFilter as y}from"./SnappingControls/snappingLayerListUtils.js";import _ from"./SnappingControls/VisibleElements.js";const L="esri-snapping-controls",w={base:L,container:`${L}__container`,toggleBlock:`${L}__toggle-block`,layerListBlock:`${L}__layer-list-block`,layerList:`${L}__layer-list`,layerListFilter:`${L}__layer-list__filter`,layerListButton:`${L}__layer-list__button`,layerListItem:`${L}__layer-list__item`,layerListGroup:`${L}__layer-list__group`,nestedContainer:`${L}__nested-container`};let v=class extends r{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 _,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),h(e.target)};const{snappingOptions:i,view:s,viewModel:l}=e;this.viewModel=l??(this._defaultViewModel=new u({snappingOptions:i,view:s}))}normalizeCtorArgs(e){const{snappingOptions:t,view:i,viewModel:s,...l}=e;return l}destroy(){this.viewModel!==this._defaultViewModel&&(this._defaultViewModel=s(this._defaultViewModel))}loadDependencies(){return Promise.all([d({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(w.base,p.widget)},m("div",{class:w.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:w.nestedContainer},s):null].filter(t);return 0===l.length?null:m("calcite-block",{class:w.toggleBlock,expanded:!0,heading:e.header?this.label:"",key:"toggle-block",label:this.label},l)}_renderEnabledToggle(){return m(g,{checked:this.viewModel.snappingOptions.enabled,disabled:this._enabledToggleDisabled,key:`${this.id}__enabled-toggle`,label:this.messages.enableSnapping,onChange:this._enableSnappingSwitchChange})}_renderSelfEnabledToggle(){return m(g,{checked:this.viewModel.snappingOptions.selfEnabled,disabled:this._secondaryElementsDisabled,key:`${this.id}__self-enabled-toggle`,label:this.messages.geometryGuides,onChange:this._selfEnabledSwitchChange})}_renderFeatureEnabledToggle(){return m(g,{checked:this.viewModel.snappingOptions.featureEnabled,disabled:this._secondaryElementsDisabled,key:`${this.id}__feature-enabled-toggle`,label:this.messages.featureToFeature,onChange:this._featureEnabledSwitchChange})}_renderGridEnabledToggle(){return m(g,{checked:this.viewModel.snappingOptions.gridEnabled,disabled:this._secondaryElementsDisabled,key:`${this.id}__grid-enabled-toggle`,label:this.messages.grid,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:w.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:w.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:w.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:o}=s;(l||"2d"===e?.type&&e.grid)&&this._startLoadGrid();const a=this._gridLoadTask?.value,r=a&&"2d"===e?.type&&m(a,{snappingManager:i,snappingOptions:s,view:e,visibleElements:t.gridControlsElements});return m("calcite-block",{class:w.layerListBlock,collapsible:!0,disabled:!n||!o,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}))}async _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?y(e,i):null){case"children":{const t=e.children.filter((e=>!1!==y(e,i)));return this._renderLayerListItemGroup(e,t)}case"self":case null:return this._renderLayerListItemOrGroup(e);case!1:return"self"===y(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:w.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:w.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,o=l||i.untitledLayer,a=l&&""!==l?l:n(),r=!!t?.length,d=t??s,p=()=>{this.viewModel.toggleSnappingForLayers(e.childLayerIds,"enabled"!==e.enabled)},c=d?.find((e=>!!e.children.length));return m("calcite-list-item",{class:w.layerListGroup,expanded:r,key:a,label:o,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:c?"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([o()],v.prototype,"_defaultViewModel",void 0),e([o()],v.prototype,"_layerListFilter",void 0),e([o()],v.prototype,"_gridLoadTask",void 0),e([o()],v.prototype,"_openAndReady",null),e([o()],v.prototype,"label",null),e([o({type:Boolean,nonNullable:!0})],v.prototype,"layerListOpen",void 0),e([o({type:Boolean,nonNullable:!0})],v.prototype,"gridOptionsOpen",void 0),e([o(),b("esri/widgets/support/SnappingControls/t9n/SnappingControls")],v.prototype,"messages",void 0),e([o(),b("esri/t9n/common")],v.prototype,"messagesCommon",void 0),e([o()],v.prototype,"snappingOptions",null),e([o()],v.prototype,"snappingManager",void 0),e([o()],v.prototype,"view",null),e([o()],v.prototype,"viewModel",null),e([o({type:_,nonNullable:!0})],v.prototype,"visibleElements",void 0),e([o()],v.prototype,"_enabledToggleDisabled",null),e([o()],v.prototype,"_secondaryElementsDisabled",null),v=e([a("esri.widgets.support.SnappingControls")],v);const f=v;export{f as default};