Select by rectangle or by click using ArcGIS JavaScript API

Question

I have a small button that has one job, select features on the Map. I am using the SketchViewModel class, to create a rectangle. Then use this rectangle to query features that intersect it. The behaviour is hold mouse, drag, release, we now have a rectangle. This is correct since the user will use the mouse to draw the rectangle that will select the features they want.

The problem I am facing is when the user single clicks on the map once the method create("rectangle") is called. The API default behaviour, is to draw a rectangle, large enough to intersect multiple features from a single click on the map.

This is not the correct behaviour that I am looking for. I looked everywhere through the help, as to change this default size of the rectangle but there is no way to change it so that on click will not draw a large rectangle.

How do I resolve this?

 // click button handler
function sketchViewClicked(event) {
 shereSketchModel.create("rectangle");
}
...
...
...
 shereSketchModel.on("create", (event) => {
 if (event.state === "complete") {
 // this polygon will be used to query features that intersect it
 const geometries = polygonGraphicsLayer.graphics.map(function(graphic) {
 return graphic.geometry;
 });
 GeometryEngineAsync.union(geometries.toArray()).then(
 (queryGeometry) => {
 SelectFeatures(queryGeometry);
 
 }
 ); }
 });

Answer 1

The default "create" behavior is to allow both "single-click" (click) to create a fixed-size rectangle AND "Left-click+Drag" (freehand) to draw it whatever size you want. If you don't want users to have the single-click option, you can change the Sketch widget's defaultCreateOptions to only allow the latter.

const sketch = new Sketch({
 layer: graphicsLayer,
 view: view,
 defaultCreateOptions : {
 mode: "freehand"
 }
});