12345 |
- /*
- All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- See https://js.arcgis.com/4.25/esri/copyright.txt for details.
- */
- import{_ as e}from"../chunks/tslib.es6.js";import"../intl.js";import{handlesGroup as t}from"../core/handleUtils.js";import{removeMaybe as o,destroyMaybe as i,isSome as s}from"../core/maybe.js";import{watch as n,syncAndInitial as l,when as r}from"../core/reactiveUtils.js";import{property as a}from"../core/accessorSupport/decorators/property.js";import"../core/arrayUtils.js";import{cast as c}from"../core/accessorSupport/decorators/cast.js";import{subclass as p}from"../core/accessorSupport/decorators/subclass.js";import d from"./Widget.js";import u from"./Sketch/SketchViewModel.js";import h from"./support/SelectionToolbar.js";import g from"./support/SnappingControls.js";import{isRTL as v}from"./support/widgetUtils.js";import{messageBundle as m}from"./support/decorators/messageBundle.js";import{vmEvent as _}from"./support/decorators/vmEvent.js";import{tsx as b}from"./support/jsxFactory.js";import{substitute as w}from"../intl/substitute.js";const f={base:"esri-sketch",verticalLayout:"esri-sketch--vertical",panel:"esri-sketch__panel",infoPanel:"esri-sketch__info-panel",section:"esri-sketch__section",toolSection:"esri-sketch__tool-section",infoSection:"esri-sketch__info-section",infoCountSection:"esri-sketch__info-count-section",menuContainer:"esri-sketch__menu-container",menuHeader:"esri-sketch__menu-header",menuTitle:"esri-sketch__menu-title",featureCountBadge:"esri-sketch__feature-count-badge",featureCountText:"esri-sketch__feature-count-text",featureCountNumber:"esri-sketch__feature-count-number",actionToggle:"esri-sketch__action-toggle",actionToggleOn:"esri-sketch__action-toggle--on",actionTitle:"esri-sketch__item-action-title",actionIcon:"esri-sketch__item-action-icon",disabled:"esri-disabled",esriWidget:"esri-widget",rotating:"esri-rotating",widgetIcon:"esri-icon-edit"},y={createTools:{point:!0,polyline:!0,polygon:!0,rectangle:!0,circle:!0},selectionTools:{"rectangle-selection":!0,"lasso-selection":!0},undoRedoMenu:!0,settingsMenu:!0,snappingControls:!0,snappingControlsElements:{header:!1,enabledToggle:!0,selfEnabledToggle:!0,featureEnabledToggle:!0,layerList:!0}};let C=class extends d{constructor(e,t){super(e,t),this._activeCreateOptions=null,this._menuOpen=!1,this._selectionToolbar=null,this._snappingControls=null,this._viewModelHandlesGroup=null,this.availableCreateTools=["point","polyline","polygon","rectangle","circle"],this.creationMode="continuous",this.iconClass=f.widgetIcon,this.layout="horizontal",this.messages=null,this.visibleElements={...y},this._activateCreateTool=this._activateCreateTool.bind(this),this.viewModel=e?.viewModel||new u}initialize(){const{layer:e,view:i}=this,s=new h({view:"2d"===i?.type?i:null,layers:e?[e]:null});this.addHandles([n((()=>this.viewModel),(e=>{this._viewModelHandlesGroup=o(this._viewModelHandlesGroup),e&&(this._viewModelHandlesGroup=t([e.on("create",(e=>{this.scheduleRender(),this._onCreateOperation(e)})),e.on("update",(()=>this.scheduleRender())),e.on("delete",(e=>this.emit("delete",e))),e.on("undo",(()=>this.scheduleRender())),e.on("redo",(()=>this.scheduleRender())),n((()=>e.layer),(e=>{this._selectionToolbar.layers=e?[e]:null})),n((()=>e.view),(e=>{this._selectionToolbar.view="2d"===e?.type?e:null,this._setUpSnappingControls()})),n((()=>e.state),(()=>this.notifyChange("state")))]))}),l),r((()=>s.activeToolInfo),(()=>this.viewModel.cancel())),s.on("complete",(e=>this._onSelectionOperationComplete(e)))]),this._selectionToolbar=s,this._setUpSnappingControls()}loadDependencies(){return Promise.all([import("@esri/calcite-components/dist/components/calcite-action.js"),import("@esri/calcite-components/dist/components/calcite-icon.js")])}destroy(){this._selectionToolbar.destroy(),this._viewModelHandlesGroup=o(this._viewModelHandlesGroup),this._snappingControls=i(this._snappingControls)}get activeTool(){const e=this._selectionToolbar.activeToolInfo;if(e)switch(e.toolName){case"lasso":return"lasso-selection";case"rectangle":return"rectangle-selection";case"default":return"custom-selection"}return this.viewModel.activeTool}get createGraphic(){return this.viewModel.createGraphic}get defaultCreateOptions(){return this.viewModel.defaultCreateOptions}set defaultCreateOptions(e){this.viewModel.defaultCreateOptions=e}get defaultUpdateOptions(){return this.viewModel.defaultUpdateOptions}set defaultUpdateOptions(e){this.viewModel.defaultUpdateOptions=e}get label(){return this.messages?.widgetLabel??""}set label(e){this._overrideIfSome("label",e)}get labelOptions(){return this.viewModel.labelOptions}set labelOptions(e){this.viewModel.labelOptions=e}get layer(){return this.viewModel.layer}set layer(e){this.viewModel.layer=e}get snappingOptions(){return this.viewModel.snappingOptions}set snappingOptions(e){this.viewModel.snappingOptions=e}get state(){return this._selectionToolbar.activeToolInfo?"active":this.viewModel.state}get tooltipOptions(){return this.viewModel.tooltipOptions}set tooltipOptions(e){this.viewModel.tooltipOptions=e}get updateGraphics(){return this.viewModel.updateGraphics}get view(){return this.viewModel.view}set view(e){this.viewModel.view=e}set viewModel(e){const t=this._get("viewModel");e!==t&&(t&&i(t),this._set("viewModel",e))}castVisibleElements(e){const t={...y,...e,createTools:{...y.createTools,...e?.createTools},selectionTools:{...y.selectionTools,...e?.selectionTools},snappingControlsElements:{...y.snappingControlsElements,...e?.snappingControlsElements}};return s(this._snappingControls)&&(this._snappingControls.visibleElements=t.snappingControlsElements),t}create(e,t){this._activeCreateOptions=t||null,this.viewModel.create(e,t)}update(e,t){return this.viewModel.update(e,t)}complete(){this.viewModel.complete()}cancel(){this._selectionToolbar.cancel(),this.viewModel.cancel()}undo(){this.viewModel.undo(),this.view?.focus()}redo(){this.viewModel.redo(),this.view?.focus()}delete(){this.viewModel.delete()}render(){const{label:e,layout:t,viewModel:{state:o}}=this;return b("div",{"aria-label":e,class:this.classes(f.base,f.esriWidget,{[f.disabled]:"disabled"===o,[f.verticalLayout]:"vertical"===t})},b("div",{role:"toolbar",class:f.panel},this.renderTopPanelContents()),b("div",{class:this.classes(f.panel,f.infoPanel)},this.renderInfoPanelContents()))}renderTopPanelContents(){const e=this.classes(f.section,f.toolSection),{availableCreateTools:t,visibleElements:o}=this;return[b("div",{role:"menu",key:"selection-button-container",class:e},this.renderDefaultSelectionButton(),this.renderSelectionToolbar()),t&&t.length?b("div",{role:"menu",class:e},this.renderDrawButtons()):null,o.undoRedoMenu?b("div",{role:"menu",key:"undo-redo-menu-button-container",class:e},this.renderUndoRedoMenuButtons()):null,o.settingsMenu?b("div",{key:"settings-menu-button-container",class:f.section},this.renderSettingsMenuButton()):null]}renderInfoPanelContents(){return this._menuOpen?this.renderSettingsMenu():this.updateGraphics.length?[b("div",{class:this.classes(f.section,f.infoSection,f.infoCountSection),key:"feature-count-container"},this.renderFeatureCount()),b("div",{class:this.classes(f.section,f.infoSection),key:"delete-button-container"},this.renderDeleteButton())]:void 0}renderSettingsMenu(){const{settings:e}=this.messages;return[b("div",{role:"menu",class:f.menuContainer,key:"settings-menu-container"},b("header",{class:f.menuHeader,key:"settings-menu-header"},b("span",{class:f.menuTitle},e)),this.renderSnappingControls())]}renderSnappingControls(){const{snappingControls:e}=this.visibleElements;if(s(this._snappingControls)&&e)return this._snappingControls.render()}renderFeatureCount(){const{layout:e,messages:t,updateGraphics:{length:o}}=this,i=w(1===o?t.featureCount:t.featuresCount,{count:o});return b("div",{class:f.featureCountBadge,"aria-label":i},b("span",{class:f.featureCountNumber},"vertical"===e?o:i))}renderDeleteButton(){const e=this.messages.deleteFeature;return b("calcite-action",{bind:this,label:e,onclick:this.delete,scale:"s",text:e,title:e},b("calcite-icon",{scale:"s",icon:"trash"}))}renderDefaultSelectionButton(){if(!this.viewModel.updateOnGraphicClick)return;const e=this.messages.selectFeature;return b("calcite-action",{active:"ready"===this.state,bind:this,label:e,onclick:this._activateDefaultSelectTool,scale:"s",text:e,title:e},b("calcite-icon",{scale:"s",icon:"cursor"}))}renderSelectionToolbar(){if("2d"!==this.view?.type)return;const e=this.visibleElements.selectionTools;return this._selectionToolbar.visibleElements={lassoTool:!!e["lasso-selection"],rectangleTool:!!e["rectangle-selection"]},this._selectionToolbar.render()}renderDrawButtons(){const e=this.visibleElements.createTools;return this.availableCreateTools.map((t=>"point"===t&&e.point?this.renderPointButton():"polyline"===t&&e.polyline?this.renderPolylineButton():"polygon"===t&&e.polygon?this.renderPolygonButton():"rectangle"===t&&e.rectangle?this.renderRectangleButton():"circle"===t&&e.circle?this.renderCircleButton():void 0))}renderPointButton(){const e="point",t=this.messages.drawPoint;return b("calcite-action",{active:this.activeTool===e,bind:this,label:t,onclick:()=>this._activateCreateTool(e),scale:"s",text:t,title:t},b("calcite-icon",{scale:"s",icon:"pin"}))}renderPolygonButton(){const e="polygon",t=this.messages.drawPolygon;return b("calcite-action",{active:this.activeTool===e,bind:this,label:t,onclick:()=>this._activateCreateTool(e),scale:"s",text:t,title:t},b("calcite-icon",{scale:"s",icon:"polygon"}))}renderPolylineButton(){const e="polyline",t=this.messages.drawPolyline;return b("calcite-action",{active:this.activeTool===e,bind:this,label:t,onclick:()=>this._activateCreateTool(e),scale:"s",text:t,title:t},b("calcite-icon",{scale:"s",icon:"line"}))}renderCircleButton(){const e="circle",t=this.messages.drawCircle;return b("calcite-action",{active:this.activeTool===e,bind:this,label:t,onclick:()=>this._activateCreateTool(e),scale:"s",text:t,title:t},b("calcite-icon",{scale:"s",icon:"circle"}))}renderRectangleButton(){const e="rectangle",t=this.messages.drawRectangle;return b("calcite-action",{active:this.activeTool===e,bind:this,label:t,onclick:()=>this._activateCreateTool(e),scale:"s",text:t,title:t},b("calcite-icon",{scale:"s",icon:"rectangle"}))}renderUndoRedoMenuButtons(){return[this.renderUndoButton(),this.renderRedoButton()]}renderUndoButton(){const e=this.messages.undo;return b("calcite-action",{disabled:!this.viewModel.canUndo(),bind:this,label:e,onclick:this.undo,scale:"s",text:e,title:e},b("calcite-icon",{scale:"s",icon:v(this.container)?"redo":"undo"}))}renderRedoButton(){const e=this.messages.redo;return b("calcite-action",{disabled:!this.viewModel.canRedo(),bind:this,label:e,onclick:this.redo,scale:"s",text:e,title:e},b("calcite-icon",{scale:"s",icon:v(this.container)?"undo":"redo"}))}renderSettingsMenuButton(){const e=this.messages.settings;return b("calcite-action",{active:this._menuOpen,bind:this,label:e,onclick:this._toggleMenu,scale:"s",text:e,title:e},b("calcite-icon",{scale:"s",icon:"gear"}))}_activateCreateTool(e){this.activeTool!==e?(this._selectionToolbar.cancel(),this.create(e)):this.cancel()}_onCreateOperation(e){if("complete"!==e.state)return;const{creationMode:t}=this,{type:o}=e;if("create"===o){const{tool:o,graphic:i}=e,s=this._activeCreateOptions;this._activeCreateOptions=null,"continuous"===t?this.create(o,s):"update"===t&&this.update([i])}}_toggleMenu(){this._menuOpen=!this._menuOpen,this.scheduleRender()}_onSelectionOperationComplete(e){const{viewModel:{defaultUpdateOptions:t}}=this,{selection:o}=e;if(!e.aborted&&o.length){const e=t.tool,i=o.length>1&&"reshape"===e?"transform":e;this.update(o,{...t,tool:i})}this.notifyChange("state")}_activateDefaultSelectTool(){this.cancel(),this.view?.focus()}_setUpSnappingControls(){const{snappingOptions:e,view:t}=this;if(this._snappingControls=i(this._snappingControls),!e||!t)return;const o=new g({snappingOptions:e,view:t,visibleElements:this.visibleElements.snappingControlsElements});this._snappingControls=o}};e([a()],C.prototype,"activeTool",null),e([a({cast:e=>{if(!e||!e.length)return null;const t=new Set(["point","polyline","polygon","rectangle","circle"]);return e.filter((e=>t.has(e)))}})],C.prototype,"availableCreateTools",void 0),e([a({readOnly:!0})],C.prototype,"createGraphic",null),e([a()],C.prototype,"creationMode",void 0),e([a()],C.prototype,"defaultCreateOptions",null),e([a()],C.prototype,"defaultUpdateOptions",null),e([a()],C.prototype,"iconClass",void 0),e([a()],C.prototype,"label",null),e([a()],C.prototype,"labelOptions",null),e([a()],C.prototype,"layer",null),e([a({type:["horizontal","vertical"]})],C.prototype,"layout",void 0),e([a(),m("esri/widgets/Sketch/t9n/Sketch")],C.prototype,"messages",void 0),e([a()],C.prototype,"snappingOptions",null),e([a()],C.prototype,"state",null),e([a()],C.prototype,"tooltipOptions",null),e([a({readOnly:!0})],C.prototype,"updateGraphics",null),e([a()],C.prototype,"view",null),e([a(),_(["create","update","undo","redo"])],C.prototype,"viewModel",null),e([a()],C.prototype,"visibleElements",void 0),e([c("visibleElements")],C.prototype,"castVisibleElements",null),C=e([p("esri.widgets.Sketch")],C);const T=C;export{T as default};
|