@geoscene/map-components 4.34.9 → 5.0.20

package/dist/components/geoscene-sketch/customElement.d.ts

@@ -1,267 +1,504 @@
-/// <reference types="@geoscene/core/interfaces.d.ts" />
 /// <reference path="../../index.d.ts" />
-import { Use } from '@geoscene/lumina/controllers';
-import { default as GraphicsLayer } from '@geoscene/core/layers/GraphicsLayer.js';
-import { default as Sketch } from '@geoscene/core/widgets/Sketch.js';
-import { PublicLitElement as LitElement, TargetedEvent } from '@geoscene/lumina';
-import { GeosceneReferenceElement } from '../../utils/component-utils';
+import type GraphicsLayer from "@geoscene/core/layers/GraphicsLayer.js";
+import type Sketch from "@geoscene/core/widgets/Sketch.js";
+import type Graphic from "@geoscene/core/Graphic.js";
+import type SketchLabelOptions from "@geoscene/core/views/interactive/sketch/SketchLabelOptions.js";
+import type MapNotesLayer from "@geoscene/core/layers/MapNotesLayer.js";
+import type SnappingOptions from "@geoscene/core/views/interactive/snapping/SnappingOptions.js";
+import type TextSymbol from "@geoscene/core/symbols/TextSymbol.js";
+import type SketchTooltipOptions from "@geoscene/core/views/interactive/sketch/SketchTooltipOptions.js";
+import type Collection from "@geoscene/core/core/Collection.js";
+import type { PublicLitElement as LitElement } from "@geoscene/lumina";
+import type { GeosceneReferenceElement, IconName } from "../types.js";
+import type { CreateOptions, CreateTool, UpdateEvent, UndoEvent, RedoEvent, DeleteEvent, CreateEvent, SketchTool, SelectionTool, CreationMode, UpdateOptions, Layout, SketchPointSymbol, SketchPolygonSymbol, SketchPolylineSymbol, State, ToolbarKind } from "@geoscene/core/widgets/Sketch/types.js";
+import type { MapViewOrSceneView } from "@geoscene/core/views/MapViewOrSceneView.js";
+import type { Icon } from "@geoscene/calcite-components/components/calcite-icon";
+import type { Button as Button } from "@geoscene/calcite-components/components/calcite-button";
 
-declare const useSketchWidget: (component: LitElement & Pick<Sketch, "icon" | "label" | "scale" | "layer" | "layout" | "viewModel" | "availableCreateTools" | "creationMode" | "defaultCreateOptions" | "defaultUpdateOptions" | "labelOptions" | "toolbarKind" | "snappingOptions" | "tooltipOptions"> & {
-    state?: "ready" | "disabled" | "active" | undefined;
-    viewModel?: __geoscene.SketchViewModel | undefined;
-    closed?: boolean;
-    icon: import('@arcgis/toolkit/type').nil | string;
-    label: import('@arcgis/toolkit/type').nil | string;
-    referenceElement?: GeosceneReferenceElement | string;
-    position?: __geoscene.UIPosition;
-    geosceneReady: import('@geoscene/lumina').EventEmitter;
-    geoscenePropertyChange: import('@geoscene/lumina').EventEmitter<{
-        name: string;
-    }> | undefined;
-    el: HTMLElement & {
-        childElem?: HTMLElement & {
-            ownedBy?: HTMLElement;
-        };
-        view?: __geoscene.LinkChartView | __geoscene.MapView | __geoscene.SceneView | nullish;
-    };
-    autoDestroyDisabled: boolean;
-    destroy: () => Promise<void>;
-}) => Sketch;
 /**
- * The Sketch component provides a simple UI for creating and updating graphics on a [MapView](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-views-MapView.html) or a [SceneView](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-views-SceneView.html).
- *
- * [Read more...](https://doc.geoscene.cn/javascript/4.33/references/map-components/geoscene-sketch/)
+ * The Sketch component provides a simple UI for creating and updating graphics on a [MapView](https://doc.geoscene.cn/javascript/5.0/references/core/views/MapView/) or a [SceneView](https://doc.geoscene.cn/javascript/5.0/references/core/views/SceneView/).
  *
  * @since 4.28
  */
-export declare class GeosceneSketch extends LitElement {
-    /**
-     * The view associated with the component.
-     *   > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the Sketch component will be associated with a map or scene component rather than using the `view` property.
-     */
-    view?: __geoscene.MapView | __geoscene.SceneView | nullish;
-    /**
-     * When creating new graphics (for example after [create()](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-widgets-Sketch.html#create) has been called),
-     * this property reflects the create tool being used.
-     *
-     * [Read more...](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-widgets-Sketch.html#activeTool)
-     */
-    readonly activeTool: nullish | "circle" | "move" | "point" | "polygon" | "rectangle" | "text" | "reshape" | "multipoint" | "polyline" | "mesh" | "transform" | "freehandPolyline" | "freehandPolygon" | "rectangle-selection" | "lasso-selection" | "custom-selection";
-    /**
-     * If true, the component will not be destroyed automatically when it is
-     * disconnected from the document. This is useful when you want to move the
-     * component to a different place on the page, or temporarily hide it. If this
-     * is set, make sure to call the [destroy](https://doc.geoscene.cn/javascript/4.33/references/map-components/geoscene-sketch/#destroy) method when you are done to
-     * prevent memory leaks.
-     *
-     * @default false
-     */
-    autoDestroyDisabled: boolean;
-    /**
-     * Property controlling the visibility and order of create tool buttons.
-     * Create tool buttons will only be rendered if they are in this collections and the
-     * matching hide/show property or attribute is configured to show the tool.
-     *
-     * @default ["point", "polyline", "freehandPolyline", "polygon", "freehandPolygon", "rectangle", "circle"]
-     */
-    availableCreateTools: nullish | ("circle" | "point" | "polygon" | "rectangle" | "text" | "multipoint" | "polyline" | "mesh" | "freehandPolyline" | "freehandPolygon")[];
-    /**
-     * The graphic that is being created.
-     *
-     * [Read more...](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-widgets-Sketch.html#createGraphic)
-     */
-    readonly createGraphic: nullish | __geoscene.Graphic;
-    /**
-     * Defines the default behavior once the [create](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-widgets-Sketch.html#create) operation is completed.
-     *
-     * @default "continuous"
-     */
-    creationMode: "single" | "update" | "continuous";
-    /**
-     * Default create options set for the Sketch widget.
-     *
-     * [Read more...](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-widgets-Sketch.html#defaultCreateOptions)
-     */
-    defaultCreateOptions: __geoscene.SketchDefaultCreateOptions;
-    /**
-     * By default, sketch will auto-create a new graphics layer if none was
-     * provided. Set this prop to true to disable this behavior.
-     *
-     * @default false
-     */
-    defaultGraphicsLayerDisabled: boolean;
-    /**
-     * Default update options set for the Sketch widget.
-     *
-     * [Read more...](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-widgets-Sketch.html#defaultUpdateOptions)
-     */
-    defaultUpdateOptions: __geoscene.SketchDefaultUpdateOptions;
-    /** @default false */
-    hideCreateToolsCircle: boolean;
-    /**
-     * Indicates whether to display the multipoint tool. Regardless of setting, multipoint is not available when working with a scene view.
-     *
-     * The multipoint tool is excluded from `availableCreateTools` by default. Even if this property is false,
-     * multipoint will not be available until it is added to `availableCreateTools`.
-     *
-     * @default true
-     */
-    hideCreateToolsMultipoint: boolean;
-    /** @default false */
-    hideCreateToolsPoint: boolean;
-    /** @default false */
-    hideCreateToolsPolygon: boolean;
-    /** @default false */
-    hideCreateToolsPolyline: boolean;
-    /** @default false */
-    hideCreateToolsRectangle: boolean;
-    /** @default false */
-    hideDuplicateButton: boolean;
-    /** @default false */
-    hideDeleteButton: boolean;
-    /** @default false */
-    hideSelectionCountLabel: boolean;
-    /** @default false */
-    hideLabelsToggle: boolean;
-    /** @default false */
-    hideSelectionToolsLassoSelection: boolean;
-    /** @default false */
-    hideSelectionToolsRectangleSelection: boolean;
-    /** @default false */
-    hideSettingsMenu: boolean;
-    /** @default false */
-    hideSnappingControls: boolean;
-    /** @default false */
-    hideSnappingControlsElementsEnabledToggle: boolean;
-    /** @default false */
-    hideSnappingControlsElementsFeatureEnabledToggle: boolean;
-    /** @default false */
-    hideSnappingControlsElementsLayerList: boolean;
-    /** @default false */
-    hideSnappingControlsElementsSelfEnabledToggle: boolean;
-    /** @default false */
-    hideTooltipsToggle: boolean;
-    /** @default false */
-    hideUndoRedoMenu: boolean;
-    /**
-     * Icon which represents the component.
-     * Typically used when the component is controlled by another component (e.g. by the Expand component).
-     *
-     * @see [Calcite Icons](https://doc.geoscene.cn/calcite-design-system/icons/)
-     * @default "pencil"
-     */
-    icon: string;
-    /**
-     * The Sketch widget's default label.
-     *
-     * [Read more...](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-widgets-Sketch.html#label)
-     */
-    label: string;
-    /**
-     * Options to configure the sketch labels shown next to each segment of the geometry being created or updated.
-     *
-     * [Read more...](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-widgets-Sketch.html#labelOptions)
-     */
-    labelOptions: __geoscene.SketchLabelOptions;
-    /**
-     * The [GraphicsLayer](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-layers-GraphicsLayer.html) associated with the Sketch widget.
-     *
-     * [Read more...](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-widgets-Sketch.html#layer)
-     */
-    layer: nullish | GraphicsLayer | __geoscene.MapNotesLayer;
-    /**
-     * Determines the layout/orientation of the Sketch widget.
-     *
-     * @default "horizontal"
-     */
-    layout: "horizontal" | "vertical";
-    /**
-     * A [SimpleMarkerSymbol](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-symbols-SimpleMarkerSymbol.html), [PointSymbol3D](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-symbols-PointSymbol3D.html), [TextSymbol](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-symbols-TextSymbol.html), [CIMSymbol](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-symbols-CIMSymbol.html), or [WebStyleSymbol](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-symbols-WebStyleSymbol.html) used for representing the point geometry that is being drawn.
-     *
-     * [Read more...](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-widgets-Sketch-SketchViewModel.html#pointSymbol)
-     */
-    pointSymbol: __geoscene.PictureMarkerSymbol | __geoscene.SimpleMarkerSymbol | __geoscene.TextSymbol | __geoscene.CIMSymbol | __geoscene.PointSymbol3D | __geoscene.WebStyleSymbol;
-    /**
-     * A [SimpleFillSymbol](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-symbols-SimpleFillSymbol.html), [PolygonSymbol3D](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-symbols-PolygonSymbol3D.html), or [CIMSymbol](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-symbols-CIMSymbol.html) used for representing the polygon geometry that is being drawn.
-     *
-     * [Read more...](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-widgets-Sketch-SketchViewModel.html#polygonSymbol)
-     */
-    polygonSymbol: __geoscene.SimpleFillSymbol | __geoscene.CIMSymbol | __geoscene.PolygonSymbol3D;
-    /**
-     * A [SimpleLineSymbol](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-symbols-SimpleLineSymbol.html), [LineSymbol3D](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-symbols-LineSymbol3D.html), or [CIMSymbol](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-symbols-CIMSymbol.html) used for representing the polyline geometry that is being drawn.
-     *
-     * [Read more...](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-widgets-Sketch-SketchViewModel.html#polylineSymbol)
-     */
-    polylineSymbol: __geoscene.SimpleLineSymbol | __geoscene.CIMSymbol | __geoscene.LineSymbol3D;
-    /** @deprecated since 4.34, use [`slot`](https://doc.geoscene.cn/javascript/4.33/building-your-ui/#slots) instead. */
-    position?: __geoscene.UIPosition;
-    /**
-     * By assigning the `id` attribute of the Map or Scene component to this property, you can position a child component anywhere in the DOM while still maintaining a connection to the Map or Scene.
-     *
-     * @see [Associate components with a Map or Scene component](https://doc.geoscene.cn/javascript/4.33/programming-patterns/#associate-components-with-a-map-or-scene-component)
-     */
-    referenceElement?: GeosceneReferenceElement | string;
-    /**
-     * Determines the size of widget elements.
-     *
-     * @default "m"
-     */
-    scale: "s" | "m" | "l";
-    /**
-     * Controls the appearance of the sketch widget, allowing the toolbar to adapt its appearance appropriately based on context.
-     *
-     * Set this to `docked` for use within the Expand component, or any other situation
-     * where Sketch is not floating within a large canvas.
-     *
-     * @default "floating"
-     */
-    toolbarKind: "floating" | "docked";
-    /** @default false */
-    showSnappingControlsElementsHeader: boolean;
-    /** @default false */
-    showCreateToolsFreehandPolygon: boolean;
-    /** @default false */
-    showCreateToolsFreehandPolyline: boolean;
-    /**
-     * The [SnappingOptions](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-views-interactive-snapping-SnappingOptions.html) for sketching.
-     *
-     * [Read more...](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-widgets-Sketch.html#snappingOptions)
-     */
-    snappingOptions: __geoscene.SnappingOptions;
-    /** The current state of the component. */
-    readonly state: "ready" | "disabled" | "active";
-    /**
-     * Options to configure the tooltip shown next to the cursor when creating or updating graphics.
-     *
-     * [Read more...](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-widgets-Sketch.html#tooltipOptions)
-     */
-    tooltipOptions: __geoscene.SketchTooltipOptions;
-    /**
-     * An array of [graphics](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-Graphic.html) that are being updated by the Sketch widget.
-     *
-     * [Read more...](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-widgets-Sketch.html#updateGraphics)
-     */
-    readonly updateGraphics: __geoscene.Collection<__geoscene.Graphic>;
-    cancel(): Promise<void>;
-    complete(): Promise<void>;
-    create(tool: "circle" | "freehandPolygon" | "freehandPolyline" | "multipoint" | "point" | "polygon" | "polyline" | "rectangle", createOptions?: __geoscene.SketchViewModelCreateCreateOptions): Promise<void>;
-    delete(): Promise<void>;
-    /** Permanently destroy the component. */
-    destroy(): Promise<void>;
-    duplicate(): Promise<void>;
-    redo(): Promise<void>;
-    triggerUpdate(graphic: __geoscene.Graphic | __geoscene.Graphic[], updateOptions?: __geoscene.SketchViewModelUpdateUpdateOptions): Promise<void>;
-    undo(): Promise<void>;
-    readonly geosceneCreate: TargetedEvent<this, __geoscene.SketchCreateEvent>;
-    readonly geosceneDelete: TargetedEvent<this, __geoscene.SketchDeleteEvent>;
-    /** Emitted when the value of a property is changed. Use this to listen to changes to properties. */
-    readonly geoscenePropertyChange: TargetedEvent<this, {
-        name: "state";
-    }>;
-    /** Emitted when the component associated with a map or scene view is ready to be interacted with. */
-    readonly geosceneReady: TargetedEvent<this, void>;
-    readonly geosceneRedo: TargetedEvent<this, __geoscene.SketchRedoEvent>;
-    readonly geosceneUndo: TargetedEvent<this, __geoscene.SketchUndoEvent>;
-    readonly geosceneUpdate: TargetedEvent<this, __geoscene.SketchUpdateEvent>;
-}
-export {};
+export abstract class GeosceneSketch extends LitElement {
+  /**
+   * When creating new graphics (for example after [create()](https://doc.geoscene.cn/javascript/5.0/references/core/widgets/Sketch/#create) has been called),
+   * this property reflects the create tool being used. When updating graphics
+   * (for example after [update()](https://doc.geoscene.cn/javascript/5.0/references/core/widgets/Sketch/#update) has been called), this property reflects the
+   * update tool being used. If no create or update operation is in progress, this is `null`.
+   *
+   * Prior to 4.32, creation tools were modeled as a combination of a geometry type (point, line, polygon)
+   * and an interaction mode (click, freehand, hybrid).
+   * At 4.32, the available create tools were expanded to include "freehandPolyline" and "freehandPolygon".
+   * These tools are made available to enable interoperability with other components of the GeoScene system,
+   * where freehand polyline is a distinct create tool from polyline.
+   *
+   * To minimize compatibility issues, if "freehandPolyline" and "freehandPolygon" are not in the list
+   * of available create tools, they will not be returned by this property, even if the user is drawing a
+   * polygon in freehand mode.
+   *
+   * To opt in to freehandPolyline and freehandPolygon tools, include them when setting availableCreateTools,
+   * and hideCreateTools* properties
+   */
+  get activeTool(): SketchTool | SelectionTool | null;
+  /**
+   * If true, the component will not be destroyed automatically when it is
+   * disconnected from the document. This is useful when you want to move the
+   * component to a different place on the page, or temporarily hide it. If this
+   * is set, make sure to call the [destroy()](https://doc.geoscene.cn/javascript/5.0/references/map-components/components/geoscene-sketch/#destroy) method when you are done to
+   * prevent memory leaks.
+   *
+   * @default false
+   */
+  accessor autoDestroyDisabled: boolean;
+  /**
+   * Property controlling the visibility and order of create tool buttons.
+   * Create tool buttons will only be rendered if they are in this collections and the
+   * matching hide/show property or attribute is configured to show the tool.
+   *
+   * @default ["point", "polyline", "freehandPolyline", "polygon", "freehandPolygon", "rectangle", "circle"]
+   */
+  accessor availableCreateTools: Array<CreateTool> | null | undefined;
+  /** The graphic that is being created. */
+  get createGraphic(): Graphic | null | undefined;
+  /**
+   * Defines the default behavior once the [create()](https://doc.geoscene.cn/javascript/5.0/references/core/widgets/Sketch/#create) operation is completed. By default, the user will be
+   * able to continuously create graphics with same geometry types.
+   *
+   * **Possible Values**
+   *
+   * Value | Description |
+   * ----- | ----------- |
+   * continuous | This is the default. Users can continue creating graphics with same geometry types.
+   * single | User can create a single graphic with the specified geometry type. User must choose an operation once the graphic is created.
+   * update | The graphic will be selected for an [update()](https://doc.geoscene.cn/javascript/5.0/references/core/widgets/Sketch/#update) operation once the `create` operation is completed.
+   *
+   * @default "continuous"
+   * @since 4.14
+   */
+  accessor creationMode: CreationMode;
+  /**
+   * Default create options set for the Sketch component.
+   *
+   * @since 4.14
+   */
+  accessor defaultCreateOptions: CreateOptions;
+  /**
+   * By default, sketch will auto-create a new graphics layer if none was
+   * provided. Set this prop to true to disable this behavior.
+   *
+   * @default false
+   */
+  accessor defaultGraphicsLayerDisabled: boolean;
+  /**
+   * Default update options set for the Sketch component. Update options set on this property will be overwritten if the update options are changed
+   * when [update()](https://doc.geoscene.cn/javascript/5.0/references/core/widgets/Sketch/#update) method is called.
+   *
+   * @since 4.11
+   * @example
+   * // Turn off highlights for update operations
+   * const sketch = new Sketch({
+   *  view,
+   *  defaultUpdateOptions: {
+   *    highlightOptions: {
+   *      enabled: false
+   *    }
+   *  }
+   * });
+   * // Turn off highlights from the update() method
+   * const updateOptions = { tool: "reshape", highlightOptions: { enabled: false }};
+   * sketch.update(graphic, updateOptions);
+   */
+  accessor defaultUpdateOptions: UpdateOptions;
+  /**
+   * Indicates whether to hide the circle sketch tool.
+   *
+   * @default false
+   * @since 5.0
+   */
+  accessor hideCreateToolsCircle: boolean;
+  /**
+   * Indicates whether to hide the multipoint tool. Regardless of setting, multipoint is not available when working with a scene view.
+   *
+   * The multipoint tool is excluded from `availableCreateTools` by default. Even if this property is false,
+   * multipoint will not be available until it is added to `availableCreateTools`.
+   *
+   * @default false
+   */
+  accessor hideCreateToolsMultipoint: boolean;
+  /**
+   * Indicates whether to hide the point sketch tool.
+   *
+   * @default false
+   * @since 5.0
+   */
+  accessor hideCreateToolsPoint: boolean;
+  /**
+   * Indicates whether to hide the polygon sketch tool.
+   *
+   * @default false
+   * @since 5.0
+   */
+  accessor hideCreateToolsPolygon: boolean;
+  /**
+   * Indicates whether to hide the polyline sketch tool.
+   *
+   * @default false
+   * @since 5.0
+   */
+  accessor hideCreateToolsPolyline: boolean;
+  /**
+   * Indicates whether to hide the rectangle sketch tool.
+   *
+   * @default false
+   * @since 5.0
+   */
+  accessor hideCreateToolsRectangle: boolean;
+  /**
+   * Indicates whether to hide the 'delete' button while a graphic is selected. Do not hide this button without giving users on touch devices another way to delete selected geometries.
+   *
+   * @default false
+   * @since 5.0
+   */
+  accessor hideDeleteButton: boolean;
+  /**
+   * Indicates whether to hide the 'duplicate' button while a graphic is selected.
+   *
+   * @default false
+   * @since 5.0
+   */
+  accessor hideDuplicateButton: boolean;
+  /**
+   * Indicates whether to hide the sketch labels toggle`.
+   *
+   * @default false
+   * @since 5.0
+   */
+  accessor hideLabelsToggle: boolean;
+  /**
+   * Indicates whether to hide a label indicating the length of the currently selected feature set.
+   *
+   * @default false
+   * @since 5.0
+   */
+  accessor hideSelectionCountLabel: boolean;
+  /** @default false */
+  accessor hideSelectionToolsLassoSelection: boolean;
+  /** @default false */
+  accessor hideSelectionToolsRectangleSelection: boolean;
+  /**
+   * Indicates whether to hide the settings menu. Currently this menu contains snapping options`.
+   *
+   * @default false
+   * @since 5.0
+   */
+  accessor hideSettingsMenu: boolean;
+  /**
+   * Indicates whether to hide the `SnappingControls` component.
+   *
+   * @default false
+   * @since 5.0
+   */
+  accessor hideSnappingControls: boolean;
+  /**
+   * Indicates whether to hide the `enabledToggle` (Enable snapping). This toggles
+   * the [SnappingOptions#enabled](https://doc.geoscene.cn/javascript/5.0/references/core/views/interactive/snapping/SnappingOptions/#enabled) property.
+   * > [!WARNING]
+   * >
+   * > **Note**
+   * >
+   * > It is recommended to set `SnappingControls.snappingOptions.enabled = true` if `enabledToggle` is set to `false`.
+   * > This is because `selfEnabledToggle` and `featureEnabledToggle` require snapping globally to be enabled in order to be interactive. Otherwise, these toggles will not be responsive.
+   *
+   * @default false
+   * @since 5.0
+   */
+  accessor hideSnappingControlsElementsEnabledToggle: boolean;
+  /**
+   * Indicates whether to hide the `featureEnabledToggle` (Feature to feature). This toggles
+   * the [SnappingOptions#featureEnabled](https://doc.geoscene.cn/javascript/5.0/references/core/views/interactive/snapping/SnappingOptions/#featureEnabled) property.
+   *
+   * @default false
+   * @since 5.0
+   */
+  accessor hideSnappingControlsElementsFeatureEnabledToggle: boolean;
+  /**
+   * Indicates whether to hide the [FeatureSnappingLayerSource](https://doc.geoscene.cn/javascript/5.0/references/core/views/interactive/snapping/FeatureSnappingLayerSource/) layerList. The layerlist provides the available layer sources supported for snapping.
+   *
+   * @default false
+   * @since 5.0
+   */
+  accessor hideSnappingControlsElementsLayerList: boolean;
+  /**
+   * Indicates whether to hide the `selfEnabledToggle` (Geometry guides). This toggles
+   * the [SnappingOptions#selfEnabled](https://doc.geoscene.cn/javascript/5.0/references/core/views/interactive/snapping/SnappingOptions/#selfEnabled) property.
+   *
+   * @default false
+   * @since 5.0
+   */
+  accessor hideSnappingControlsElementsSelfEnabledToggle: boolean;
+  /**
+   * Indicates whether to hide the tooltips toggle`.
+   *
+   * @default false
+   * @since 5.0
+   */
+  accessor hideTooltipsToggle: boolean;
+  /**
+   * Indicates whether to hide the undo/redo menu within the component.
+   *
+   * @default false
+   * @since 5.0
+   */
+  accessor hideUndoRedoMenu: boolean;
+  /**
+   * Icon which represents the component.
+   * Typically used when the component is controlled by another component (e.g. by the Expand component).
+   *
+   * @default "pencil"
+   * @since 4.27
+   * @see [Calcite Icons](https://doc.geoscene.cn/calcite-design-system/icons/)
+   */
+  get icon(): Icon["icon"];
+  set icon(value: IconName);
+  /**
+   * The component's default label.
+   *
+   * @since 4.11
+   */
+  accessor label: string;
+  /**
+   * Options to configure the sketch labels shown next to each segment of the geometry being created or updated.
+   *
+   * > [!WARNING]
+   * >
+   * > **Known Limitation**
+   * >
+   * > Sketch labels are currently only supported when working with a [SceneView](https://doc.geoscene.cn/javascript/5.0/references/core/views/SceneView/).
+   *
+   * @since 4.24
+   */
+  accessor labelOptions: SketchLabelOptions;
+  /**
+   * The [GraphicsLayer](https://doc.geoscene.cn/javascript/5.0/references/core/layers/GraphicsLayer/) associated with the Sketch component. The Sketch component adds new [graphics](https://doc.geoscene.cn/javascript/5.0/references/core/Graphic/) to this layer or can only update graphics
+   * stored in this layer.
+   */
+  accessor layer: GraphicsLayer | MapNotesLayer | null | undefined;
+  /**
+   * Determines the layout/orientation of the Sketch component.
+   *
+   * @default "horizontal"
+   * @since 4.10
+   */
+  accessor layout: Layout;
+  /**
+   * A [SimpleMarkerSymbol](https://doc.geoscene.cn/javascript/5.0/references/core/symbols/SimpleMarkerSymbol/), [PictureMarkerSymbol](https://doc.geoscene.cn/javascript/5.0/references/core/symbols/PictureMarkerSymbol/), [PointSymbol3D](https://doc.geoscene.cn/javascript/5.0/references/core/symbols/PointSymbol3D/), [TextSymbol](https://doc.geoscene.cn/javascript/5.0/references/core/symbols/TextSymbol/), [CIMSymbol](https://doc.geoscene.cn/javascript/5.0/references/core/symbols/CIMSymbol/), or [WebStyleSymbol](https://doc.geoscene.cn/javascript/5.0/references/core/symbols/WebStyleSymbol/) used for representing the point geometry that is being drawn. [SimpleMarkerSymbol](https://doc.geoscene.cn/javascript/5.0/references/core/symbols/SimpleMarkerSymbol/) may also be used to symbolize point features in a [SceneView](https://doc.geoscene.cn/javascript/5.0/references/core/views/SceneView/). However, it is recommended you use [PointSymbol3D](https://doc.geoscene.cn/javascript/5.0/references/core/symbols/PointSymbol3D/) instead.
+   *
+   * > [!WARNING]
+   * >
+   * > **Known Limitation**
+   * > To avoid unintended side effects, instantiate a new symbol rather than modifying the current instance.
+   *
+   * The default value is the following:
+   * ```js
+   * {
+   *   type: "simple-marker",
+   *   style: "circle",
+   *   size: 6,
+   *   color: [255, 255, 255],
+   *   outline: {
+   *    color: [50, 50, 50],
+   *     width: 1
+   *   }
+   * }
+   * ```
+   */
+  accessor pointSymbol: SketchPointSymbol;
+  /**
+   * A [SimpleFillSymbol](https://doc.geoscene.cn/javascript/5.0/references/core/symbols/SimpleFillSymbol/), [PolygonSymbol3D](https://doc.geoscene.cn/javascript/5.0/references/core/symbols/PolygonSymbol3D/), or [CIMSymbol](https://doc.geoscene.cn/javascript/5.0/references/core/symbols/CIMSymbol/) used for representing the polygon geometry that is being drawn. [SimpleFillSymbol](https://doc.geoscene.cn/javascript/5.0/references/core/symbols/SimpleFillSymbol/) may also be used to symbolize polygon features in a [SceneView](https://doc.geoscene.cn/javascript/5.0/references/core/views/SceneView/). However, it is recommended you use [PolygonSymbol3D](https://doc.geoscene.cn/javascript/5.0/references/core/symbols/PolygonSymbol3D/) instead.
+   *
+   * > [!WARNING]
+   * >
+   * > **Known Limitation**
+   * > To avoid unintended side effects, instantiate a new symbol rather than modifying the current instance.
+   *
+   * The default value is the following:
+   * ```js
+   * {
+   *   type: "simple-fill",
+   *   color: [150, 150, 150, 0.2],
+   *   outline: {
+   *     color: [50, 50, 50],
+   *     width: 2
+   *   }
+   * }
+   * ```
+   */
+  accessor polygonSymbol: SketchPolygonSymbol;
+  /**
+   * A [SimpleLineSymbol](https://doc.geoscene.cn/javascript/5.0/references/core/symbols/SimpleLineSymbol/), [LineSymbol3D](https://doc.geoscene.cn/javascript/5.0/references/core/symbols/LineSymbol3D/), or [CIMSymbol](https://doc.geoscene.cn/javascript/5.0/references/core/symbols/CIMSymbol/) used for representing the polyline geometry that is being drawn. [SimpleLineSymbol](https://doc.geoscene.cn/javascript/5.0/references/core/symbols/SimpleLineSymbol/) may also be used to symbolize polyline features in a [SceneView](https://doc.geoscene.cn/javascript/5.0/references/core/views/SceneView/). However, it is recommended you use [LineSymbol3D](https://doc.geoscene.cn/javascript/5.0/references/core/symbols/LineSymbol3D/) instead.
+   *
+   * > [!WARNING]
+   * >
+   * > **Known Limitation**
+   * > To avoid unintended side effects, instantiate a new symbol rather than modifying the current instance.
+   *
+   * The default value is the following:
+   * ```js
+   * {
+   *   type: "simple-line",
+   *   color: [130, 130, 130],
+   *   width: 2
+   * }
+   * ```
+   */
+  accessor polylineSymbol: SketchPolylineSymbol;
+  /**
+   * By assigning the `id` attribute of the Map or Scene component to this property, you can position a child component anywhere in the DOM while still maintaining a connection to the Map or Scene.
+   *
+   * @see [Associate components with a Map or Scene component](https://doc.geoscene.cn/javascript/5.0/programming-patterns/#associate-components-with-a-map-or-scene-component)
+   */
+  accessor referenceElement: GeosceneReferenceElement | string | undefined;
+  /**
+   * Determines the size of component elements.
+   *
+   * @deprecated since 5.0, use `element.visualScale` instead.
+   * @default "m"
+   * @since 4.32
+   */
+  accessor scale: Button["scale"];
+  /**
+   * Indicates whether to display the freehandPolygon tool.
+   *
+   * @default false
+   * @since 5.0
+   */
+  accessor showCreateToolsFreehandPolygon: boolean;
+  /**
+   * Indicates whether to display the freehandPolyline tool.
+   *
+   * @default false
+   * @since 5.0
+   */
+  accessor showCreateToolsFreehandPolyline: boolean;
+  /**
+   * Indicates whether to display the text tool.
+   *
+   * @default false
+   * @since 5.0
+   */
+  accessor showCreateToolsText: boolean;
+  /**
+   * Indicates whether to display the header.
+   *
+   * @default false
+   * @since 5.0
+   */
+  accessor showSnappingControlsElementsHeader: boolean;
+  /** The [SnappingOptions](https://doc.geoscene.cn/javascript/5.0/references/core/views/interactive/snapping/SnappingOptions/) for sketching. It supports [self](https://doc.geoscene.cn/javascript/5.0/references/core/views/interactive/snapping/SnappingOptions/#selfEnabled) and [feature](https://doc.geoscene.cn/javascript/5.0/references/core/views/interactive/snapping/SnappingOptions/#featureEnabled) snapping. */
+  accessor snappingOptions: SnappingOptions;
+  /** The current state of the component. */
+  get state(): State;
+  /**
+   * A [TextSymbol](https://doc.geoscene.cn/javascript/5.0/references/core/symbols/TextSymbol/) used for representing the geometry that is being drawn.
+   *
+   * > [!WARNING]
+   * >
+   * > **Known Limitation**
+   * > To avoid unintended side effects, instantiate a new symbol rather than modifying the current instance.
+   *
+   * The default value is the following:
+   * ```js
+   * {
+   *   type: "text",
+   *   text: "hello world"
+   * }
+   * ```
+   *
+   * @since 5.0
+   */
+  accessor textSymbol: TextSymbol;
+  /**
+   * Controls the appearance of the sketch component, allowing the toolbar to adapt its appearance appropriately based on context.
+   *
+   * Set this to `docked` for use within the Expand component, or any other situation
+   * where Sketch is not floating within a large canvas.
+   *
+   * @default "floating"
+   * @since 4.32
+   */
+  accessor toolbarKind: ToolbarKind;
+  /** Options to configure the tooltip shown next to the cursor when creating or updating graphics. */
+  accessor tooltipOptions: SketchTooltipOptions;
+  /** An array of [graphics](https://doc.geoscene.cn/javascript/5.0/references/core/Graphic/) that are being updated by the Sketch component. */
+  get updateGraphics(): Collection<Graphic>;
+  /**
+   * Starting at version 5.0, `geoscene-sketch` is transitioning to a next generation geometry
+   * creation experience. This new experience provides advanced curve creation tools
+   * and allows multiple tools to be used in combination to define a single geometry.
+   *
+   * As of 5.0, this experience is only available in 2D (e.g. [`geoscene-map`](https://doc.geoscene.cn/javascript/5.0/references/map-components/geoscene-map)).
+   *
+   * This property is available to allow 2D applications to temporarily
+   * opt out of this experience.
+   *
+   * > [!CAUTION]
+   * >
+   * > This option will be removed in an upcoming release.
+   *
+   * @deprecated
+   * @default false
+   * @since 5.0
+   */
+  accessor useLegacyCreateTools: boolean;
+  /**
+   * The view associated with the component. 
+   *   > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the geoscene-sketch component will be associated with a map or scene component rather than using the `view` property.
+   */
+  accessor view: MapViewOrSceneView | null | undefined;
+  /**
+   * Specifies the size of the component.
+   *
+   * @since 5.0
+   */
+  accessor visualScale: Button["scale"];
+  cancel(): Promise<void>;
+  complete(): Promise<void>;
+  /**
+   * @param tool
+   * @param createOptions
+   */
+  create(tool: CreateTool, createOptions?: CreateOptions): Promise<void>;
+  delete(): Promise<void>;
+  /** Permanently destroy the component. */
+  destroy(): Promise<void>;
+  duplicate(): Promise<void>;
+  redo(): Promise<void>;
+  /**
+   * @param graphic
+   * @param updateOptions
+   */
+  triggerUpdate(graphic: Parameters<Sketch["update"]>[0], updateOptions?: Parameters<Sketch["update"]>[1]): Promise<void>;
+  undo(): Promise<void>;
+  "@setterTypes": {
+    icon?: IconName;
+  };
+  readonly geosceneCreate: import("@geoscene/lumina").TargetedEvent<this, CreateEvent>;
+  readonly geosceneDelete: import("@geoscene/lumina").TargetedEvent<this, DeleteEvent>;
+  /** Emitted when the value of a property is changed. Use this to listen to changes to properties. */
+  readonly geoscenePropertyChange: import("@geoscene/lumina").TargetedEvent<this, { name: "state"; }>;
+  /** Emitted when the component associated with a map or scene view is ready to be interacted with. */
+  readonly geosceneReady: import("@geoscene/lumina").TargetedEvent<this, void>;
+  readonly geosceneRedo: import("@geoscene/lumina").TargetedEvent<this, RedoEvent>;
+  readonly geosceneUndo: import("@geoscene/lumina").TargetedEvent<this, UndoEvent>;
+  readonly geosceneUpdate: import("@geoscene/lumina").TargetedEvent<this, UpdateEvent>;
+  readonly "@eventTypes": {
+    geosceneCreate: GeosceneSketch["geosceneCreate"]["detail"];
+    geosceneDelete: GeosceneSketch["geosceneDelete"]["detail"];
+    geoscenePropertyChange: GeosceneSketch["geoscenePropertyChange"]["detail"];
+    geosceneReady: GeosceneSketch["geosceneReady"]["detail"];
+    geosceneRedo: GeosceneSketch["geosceneRedo"]["detail"];
+    geosceneUndo: GeosceneSketch["geosceneUndo"]["detail"];
+    geosceneUpdate: GeosceneSketch["geosceneUpdate"]["detail"];
+  };
+}