@arcgis/map-components 5.2.0-next.9 → 5.2.0-next.90

package/dist/components/arcgis-map/customElement.d.ts

@@ -48,7 +48,7 @@ import type { SlotGroupRefs } from "../../support/slots.js";
  *
  * ##### 1. Using a WebMap
  * Load a [WebMap](https://developers.arcgis.com/javascript/latest/references/core/WebMap/) from [ArcGIS Online](https://www.arcgis.com/home/index.html)
- * or an [ArcGIS Enterprise portal](https://enterprise.arcgis.com/en/portal/latest/administer/windows/what-is-portal-for-arcgis-.htm) by specifying the [itemId](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-map/#itemId) attribute.
+ * or an [ArcGIS Enterprise portal](https://doc.esri.com/en/arcgis-enterprise/latest/plan/what-is-portal-for-arcgis-.html) by specifying the [itemId](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-map/#itemId) attribute.
  *
  * ```html
  * <arcgis-map item-id="05e015c5f0314db9a487a9b46cb37eca"></arcgis-map>
@@ -141,11 +141,15 @@ export abstract class ArcgisMap extends LitElement {
    *
    * @since 4.34
    * @example
+   * ```js
    * // Adds an analysis to the View
    * view.analyses.add(elevationProfileAnalysis);
+   * ```
    * @example
+   * ```js
    * // Removes an analysis from the View
    * view.analyses.remove(elevationProfileAnalysis);
+   * ```
    */
   accessor analyses: Collection<Analysis>;
   /**
@@ -165,7 +169,7 @@ export abstract class ArcgisMap extends LitElement {
    */
   accessor animationsDisabled: boolean;
   /**
-   * The ARIA attributes for the view container. Provides accessibility information to assistive technologies such as screen readers. Supports the following properties: [`label`](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-label), [`description`](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-description), [`describedByElements`](https://developer.mozilla.org/en-US/docs/Web/API/Element/ariaDescribedByElements), and [`labelledByElements`](https://developer.mozilla.org/en-US/docs/Web/API/Element/ariaLabelledByElements).
+   * The ARIA attributes for the view container. Provides accessibility information to assistive technologies such as screen readers. Supports the following properties: [`label`](https://developer.mozilla.org/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-label), [`description`](https://developer.mozilla.org/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-description), [`describedByElements`](https://developer.mozilla.org/docs/Web/API/Element/ariaDescribedByElements), and [`labelledByElements`](https://developer.mozilla.org/docs/Web/API/Element/ariaLabelledByElements).
    *
    * @since 4.34
    */
@@ -177,13 +181,15 @@ export abstract class ArcgisMap extends LitElement {
    */
   get attributionItems(): MapView["attributionItems"];
   /**
-   * The light or dark mode used to display the attribution.
-   * By default, the mode is inherited from the [Calcite's mode](https://developers.arcgis.com/calcite-design-system/core-concepts/#modes).
-   * You can override the value to style the attribution alongside the map or scene content.
+   * The display mode used for the attribution. Defaults to null.
+   *
+   * Set this property to "auto" to automatically synchronize the attribution with the nearest [Calcite mode](https://developers.arcgis.com/calcite-design-system/core-concepts/#modes). If no Calcite mode is detected, the attribution defaults to light mode. **The "auto" mode was added in version 5.2.**
+   *
+   * Set this property to "light" or "dark" to explicitly use that mode without synchronization.
    *
    * @since 5.0
    */
-  accessor attributionMode: "dark" | "light" | null | undefined;
+  accessor attributionMode: AttributionMode;
   /**
    * 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
@@ -192,19 +198,27 @@ export abstract class ArcgisMap extends LitElement {
    * prevent memory leaks.
    *
    * @default false
+   * @example
+   * ```html
+   * <arcgis-map auto-destroy-disabled></arcgis-map>
+   * ```
+   *
+   * ```js
+   * mapElement.autoDestroyDisabled = true;
+   * ```
+   * 
    */
   accessor autoDestroyDisabled: boolean;
   /**
    * The background color of the Map component.
    *
    * @example
-   * let view = new MapView({
-   *   container: "viewDiv",
-   *   map: map,
-   *   background: { // autocasts new ColorBackground()
-   *     color: "magenta" // autocasts as new Color()
-   *   }
+   * ```js
+   * const viewElement = document.querySelector("arcgis-map");
+   * viewElement.background = new ColorBackground ({
+   *   color: "magenta" // autocasts as new Color()
    * });
+   * ```
    */
   accessor background: ColorBackground | null | undefined;
   /**
@@ -295,11 +309,11 @@ export abstract class ArcgisMap extends LitElement {
    *   x: 12804.24,
    *   y: -1894032.09,
    *   spatialReference: {
-   *     wkid: view.spatialReference  // wkid 2027
+   *     wkid: viewElement.spatialReference  // wkid 2027
    *   }
    * });
    * const viewElement = document.querySelector("arcgis-map");
-   * view.center = centerPoint;
+   * viewElement.center = centerPoint;
    * ```
    * @example
    * ```js
@@ -329,7 +343,9 @@ export abstract class ArcgisMap extends LitElement {
    * @see [TileInfo#create()](https://developers.arcgis.com/javascript/latest/references/core/layers/support/TileInfo/#create)
    * @see [Zoom and LODs](https://developers.arcgis.com/javascript/latest/references/core/views/View2D/#mapview-lods)
    * @example
-   * view.constraints = new MapViewConstraints({
+   * ```js
+   * const viewElement = document.querySelector("arcgis-map");
+   * viewElement.constraints = new MapViewConstraints({
    *   geometry: { // Constrain lateral movement to Lower Manhattan
    *     type: "extent",
    *     xmin: -74.020,
@@ -341,7 +357,9 @@ export abstract class ArcgisMap extends LitElement {
    *   maxScale: 0, // User can overzoom tiles
    *   rotationEnabled: false // Disables map rotation
    * });
+   * ```
    * @example
+   * ```js
    * // This snippet shows how to set the Map scale 1:1 while generating additional LODs for the constraints.
    * const spatialReference = new SpatialReference({
    *   wkid: 2154
@@ -364,11 +382,12 @@ export abstract class ArcgisMap extends LitElement {
    *   lods
    * });
    *
-   * const arcgisMap = document.querySelector("arcgis-map");
-   * arcgisMap.spatialReference = spatialReference;
-   * arcgisMap.center = center;
-   * arcgisMap.scale = 1;
-   * arcgisMap.constraints = constraints;
+   * const viewElement = document.querySelector("arcgis-map");
+   * viewElement.spatialReference = spatialReference;
+   * viewElement.center = center;
+   * viewElement.scale = 1;
+   * viewElement.constraints = constraints;
+   * ```
    */
   accessor constraints: MapViewConstraints;
   /**
@@ -401,13 +420,15 @@ export abstract class ArcgisMap extends LitElement {
    * @since 4.12
    * @see [tryFatalErrorRecovery()](https://developers.arcgis.com/javascript/latest/references/core/views/View/#tryFatalErrorRecovery)
    * @example
+   * ```js
    * reactiveUtils.when(
-   *   () => view.fatalError,
+   *   () => viewElement.fatalError,
    *   () => {
    *     console.error("Fatal Error! View has lost its WebGL context. Attempting to recover...");
-   *     view.tryFatalErrorRecovery();
+   *     viewElement.tryFatalErrorRecovery();
    *   }
    * );
+   * ```
    */
   accessor fatalError: Error<any> | null | undefined;
   /**
@@ -418,17 +439,17 @@ export abstract class ArcgisMap extends LitElement {
   /** Gamepad input specific configuration settings. */
   get gamepad(): GamepadSettings;
   /**
-   * Allows for adding graphics directly to the default graphics in the View.
+   * Allows for adding graphics directly to the default graphics in the map component.
    *
    * @example
    * ```js
-   * // Adds a graphic to the View
-   * graphics.add(pointGraphic);
+   * // Adds a graphic to the map component.
+   * viewElement.graphics.add(pointGraphic);
    * ```
    * @example
    * ```js
-   * // Removes a graphic from the View
-   * graphics.remove(pointGraphic);
+   * // Removes a graphic from the map component.
+   * viewElement.graphics.remove(pointGraphic);
    * ```
    * @see [Graphic](https://developers.arcgis.com/javascript/latest/references/core/Graphic/)
    * @see [GraphicsLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/GraphicsLayer/)
@@ -441,12 +462,7 @@ export abstract class ArcgisMap extends LitElement {
    * @see [ElevationLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/ElevationLayer/)
    * @see [Ground](https://developers.arcgis.com/javascript/latest/references/core/Ground/)
    * @example
-   * // Use the world elevation service
-   * const map = new Map({
-   *   basemap: "topo-vector",
-   *   ground: "world-elevation"
-   * });
-   * @example
+   * ```js
    * // Create a map with the world elevation layer overlaid by a custom elevation layer
    * const worldElevation = new ElevationLayer({
    *   url: "//elevation3d.arcgis.com/arcgis/rest/services/WorldElevation3D/Terrain3D/ImageServer"
@@ -460,6 +476,9 @@ export abstract class ArcgisMap extends LitElement {
    *    layers: [ worldElevation, customElevation ]
    *   })
    * });
+   *
+   * viewElement.map = map;
+   * ```
    */
   get ground(): Ground;
   set ground(value: Ground | string);
@@ -504,40 +523,47 @@ export abstract class ArcgisMap extends LitElement {
    * @see [Sample: Highlight point features](https://developers.arcgis.com/javascript/latest/sample-code/highlight-point-features/)
    * @since 4.32
    * @example
+   * ```js
    * // Use the default highlights collection to apply a highlight to features when you hover over them
-   *
    * // A handler can be used to remove any previous highlight when applying a new one
    * let hoverHighlight;
    *
-   * view.on("pointer-move", (event) => {
-   *   // Search for the first feature in the featureLayer at the hovered location
-   *   view.hitTest(event, { include: featureLayer }).then((response) => {
-   *     if (response.results[0]) {
-   *        const graphic = response.results[0].graphic;
-   *        view.whenLayerView(graphic.layer).then((layerView) => {
-   *          // Remove any previous highlight, if it exists
-   *          hoverHighlight?.remove();
-   *          // Highlight the hit features with the temporary highlight options, which are pre-configured for this use case
-   *          hoverHighlight = layerView.highlight(graphic, { name: "temporary"});
-   *        });
+   * viewElement.addEventListener("arcgisViewPointerMove", async (event) => {
+   *   try {
+   *     await updateHoverHighlight(event);
+   *   } catch (error) {
+   *     if (error.name !== "AbortError") {
+   *       console.error(error);
    *     }
-   *   });
+   *   }
    * });
-   * @example
-   * // Override the default highlights collection
    *
-   * const view = new MapView({
-   *   map: map,
-   *   container: "viewDiv",
+   * const updateHoverHighlight = promiseUtils.debounce(async (event) => {
+   *   // Search for the first feature in the featureLayer at the hovered location
+   *   const response = await viewElement.hitTest(event.detail, { include: featureLayer });
+   *   const result = response.results[0];
    *
-   *   // Set the highlight options to be used in the view
-   *   highlights: [
-   *     { name: "default", color: "orange" },
-   *     { name: "temporary", color: "magenta" },
-   *     { name: "table", color: "cyan", fillOpacity: 0.5, haloOpacity: 0}
-   *   ]
+   *   // Remove any previous highlight, if it exists
+   *   hoverHighlight?.remove();
+   *
+   *   if (result?.type === "graphic") {
+   *     // Highlight the hit feature with the temporary highlight options
+   *     hoverHighlight = layerView.highlight(result.graphic, { name: "temporary" });
+   *   }
    * });
+   * ```
+   * @example
+   * ```js
+   * // Override the default highlights collection
+   * const viewElement = document.querySelector("arcgis-map");
+   * viewElement.highlights = new Collection([
+   *   { name: "default", color: "orange" },
+   *   { name: "temporary", color: "magenta" },
+   *   { name: "table", color: "cyan", fillOpacity: 0.5, haloOpacity: 0}
+   * ]);
+   * ```
    * @example
+   * ```js
    * // Add highlight options to the collection after initialization
    *
    * const selectionHighlightOptions = {
@@ -548,7 +574,8 @@ export abstract class ArcgisMap extends LitElement {
    * };
    *
    * // Add the options to the highlights collection at the first position
-   * view.highlights.add(selectionGroup, 0);
+   * viewElement.highlights.add(selectionGroup, 0);
+   * ```
    */
   accessor highlights: Collection<HighlightOptions>;
   /**
@@ -602,26 +629,21 @@ export abstract class ArcgisMap extends LitElement {
    *
    * @since 4.9
    * @example
+   * ```js
    * // Disable the gamepad usage, single touch panning, panning momentum and mouse wheel zooming.
-   * const view = new MapView({
-   *   container: "viewDiv",
-   *   map: new Map({
-   *     basemap: "satellite"
-   *   }),
-   *   center: [176.185, -37.643],
-   *   zoom: 13,
-   *   navigation: {
-   *     gamepad: {
-   *       enabled: false
-   *     },
-   *     actionMap: {
-   *       dragSecondary: "none", // Disable rotating the view with the right mouse button
-   *       mouseWheel: "none" // Disable zooming with the mouse wheel
-   *     },
-   *     browserTouchPanEnabled: false,
-   *     momentumEnabled: false,
-   *   }
-   * });
+   * const viewElement = document.querySelector("arcgis-map");
+   * viewElement.navigation = {
+   *   gamepad: {
+   *     enabled: false
+   *   },
+   *   actionMap: {
+   *     dragSecondary: "none", // Disable rotating the view with the right mouse button
+   *     mouseWheel: "none" // Disable zooming with the mouse wheel
+   *   },
+   *   browserTouchPanEnabled: false,
+   *   momentumEnabled: false,
+   * };
+   * ```
    */
   accessor navigation: Navigation;
   /**
@@ -731,22 +753,32 @@ export abstract class ArcgisMap extends LitElement {
    *
    * @default 0
    * @example
-   * // Due north is rotated 90 degrees, pointing to the right side of the view
-   * view.rotation = 90;
+   * ```html
+   * <!-- Due north is rotated 90 degrees, pointing to the right side of the view -->
+   * <arcgis-map basemap="satellite" rotation="90"></arcgis-map>
+   * ```
    * @example
+   * ```js
    * // Due north is rotated 180 degrees, pointing to the bottom of the view
-   * view.rotation = 180;
+   * viewElement.rotation = 180;
+   * ```
    * @example
+   * ```js
    * // Due north is rotated 270 degrees, pointing to the left side of the view
-   * view.rotation = 270;
+   * viewElement.rotation = 270;
+   * ```
    * @example
+   * ```js
    * // Due north is rotated 0 degrees, pointing to the top of the view (the default)
-   * view.rotation = 0; // 360 or multiple of 360 (e.g. 720) works here as well.
+   * viewElement.rotation = 0; // 360 or multiple of 360 (e.g. 720) works here as well.
+   * ```
    * @example
+   * ```js
    * // Disables map rotation
-   * view.constraints = {
+   * viewElement.constraints = {
    *   rotationEnabled: false
    * };
+   * ```
    */
   accessor rotation: number;
   /**
@@ -842,12 +874,14 @@ export abstract class ArcgisMap extends LitElement {
    * @see [Theme](https://developers.arcgis.com/javascript/latest/references/core/views/Theme/)
    * @see [Sample - Color theming for interactive tools](https://developers.arcgis.com/javascript/latest/sample-code/view-theme/)
    * @example
+   * ```js
    * // Update the theme to use purple graphics
    * // and slightly transparent green text
    * view.theme = new Theme({
    *   accentColor: "purple",
    *   textColor: [125, 255, 13, 0.9]
    * });
+   * ```
    */
   accessor theme: Theme | null | undefined;
   /**
@@ -858,23 +892,21 @@ export abstract class ArcgisMap extends LitElement {
    *
    * @since 4.12
    * @example
+   * ```js
    * // Create a csv layer from an online spreadsheet.
-   * let csvLayer = new CSVLayer({
+   * const csvLayer = new CSVLayer({
    *   url: "http://test.com/daily-magazines-sold-in-new-york.csv",
    *   timeInfo: {
    *     startField: "SaleDate" // The csv field contains date information.
    *   }
    * });
+   * viewElement.map.add(csvLayer);
    *
-   * // Create a mapview showing sales for the last week of March 2019 only.
-   * const view = new MapView({
-   *   map: map,
-   *   container: "viewDiv",
-   *   timeExtent: {
-   *     start: new Date("2019, 2, 24"),
-   *     end:   new Date("2019, 2, 31")
-   *   }
-   * });
+   * viewElement.timeExtent = {
+   *   start: new Date("2019, 2, 24"),
+   *   end: new Date("2019, 2, 31")
+   * };
+   * ```
    */
   accessor timeExtent: TimeExtent | null | undefined;
   /**
@@ -885,12 +917,11 @@ export abstract class ArcgisMap extends LitElement {
    * @default "system"
    * @see [wikipedia - List of tz database time zones](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones)
    * @example
+   * ```js
    * // Date and time will be displayed in Pacific/Auckland (NZ) time zone
-   * const view = new MapView({
-   *   map: map,
-   *   container: "viewDiv",
-   *   timeZone: "Pacific/Auckland"
-   * });
+   * const viewElement = document.querySelector("arcgis-map");
+   * viewElement.timeZone = "Pacific/Auckland";
+   * ```
    */
   accessor timeZone: string;
   /**
@@ -956,6 +987,8 @@ export abstract class ArcgisMap extends LitElement {
   destroy(): Promise<void>;
   /**
    * Use this method to query for features at a given screen location. These features come from origins (layers and sublayers) configured with a [PopupTemplate](https://developers.arcgis.com/javascript/latest/references/core/PopupTemplate/) and have its [FeatureLayer.popupEnabled](https://developers.arcgis.com/javascript/latest/references/core/layers/FeatureLayer/#popupEnabled) set. One example could be a custom side panel that displays feature-specific information based on an end user's click location. This method allows a developer to control how the input location is handled, and then subsequently, what to do with the results.
+   * > [!WARNING]
+   * > Using [ScreenRect](https://developers.arcgis.com/javascript/latest/references/core/core/types/#ScreenRect) as the hit target is considered **[beta](https://developers.arcgis.com/javascript/latest/faq/#what-does-the-beta-tag-mean)** functionality.
    *
    * @param hitTarget
    * @param options
@@ -1000,10 +1033,9 @@ export abstract class ArcgisMap extends LitElement {
    * **2D hitTest() behavior by layer type**
    * | Layer type | Hit test behavior |
    * | :--- | :--- |
-   * | [FeatureLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/FeatureLayer), [CatalogFootprintLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/catalog/CatalogFootprintLayer), [CSVLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/CSVLayer), [GeoJSONLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/GeoJSONLayer), [OGCFeatureLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/OGCFeatureLayer), [OrientedImageryLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/OrientedImageryLayer), [StreamLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/StreamLayer), [SubtypeGroupLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/SubtypeGroupLayer), [WFSLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/WFSLayer) | Returns all intersecting [GraphicHit](https://developers.arcgis.com/javascript/latest/references/core/views/types/#GraphicHit) features at the hit location. |
-   * | [ParquetLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/ParquetLayer) | Returns only the topmost [GraphicHit](https://developers.arcgis.com/javascript/latest/references/core/views/types/#GraphicHit) feature when the hit occurs on overlapping features. (as of version 4.34). |
+   * | [FeatureLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/FeatureLayer), [CatalogFootprintLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/catalog/CatalogFootprintLayer), [CSVLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/CSVLayer), [GeoJSONLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/GeoJSONLayer), [OGCFeatureLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/OGCFeatureLayer), [OrientedImageryLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/OrientedImageryLayer), [ParquetLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/ParquetLayer), [StreamLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/StreamLayer), [SubtypeGroupLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/SubtypeGroupLayer), [WFSLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/WFSLayer) | Returns all intersecting [GraphicHit](https://developers.arcgis.com/javascript/latest/references/core/views/types/#GraphicHit) features at the hit location. |
    * | [GeoRSSLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/GeoRSSLayer), [GraphicsLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/GraphicsLayer), [KMLLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/KMLLayer), [MapNotesLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/MapNotesLayer) | Returns all intersecting [GraphicHit](https://developers.arcgis.com/javascript/latest/references/core/views/types/#GraphicHit) features at the hit location. |
-   * | [ImageryLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/ImageryLayer),  [ImageryTileLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/ImageryTileLayer)| Returns [RasterHit](https://developers.arcgis.com/javascript/latest/references/core/views/types/#RasterHit) result containing raster pixel value used in rendering and bandId info on intersecting pixels. The `screenRect` hitTarget is not supported for these layers. |
+   * | [ImageryLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/ImageryLayer),  [ImageryTileLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/ImageryTileLayer)| Returns [RasterHit](https://developers.arcgis.com/javascript/latest/references/core/views/types/#RasterHit) result containing raster pixel value used in rendering and bandId info on intersecting pixels. Support was added in version 5.1. The `screenRect` hitTarget returns hit result at the center of the rectangle. |
    * | [VectorTileLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/VectorTileLayer) | Returns a result for all intersecting [GraphicHit](https://developers.arcgis.com/javascript/latest/references/core/views/types/#GraphicHit) features containing attributes of style layers (as of version 4.29; in prior releases, only the topmost style layer result was returned). In addition, the graphic's [origin](https://developers.arcgis.com/javascript/latest/references/core/Graphic#origin) contains the style layer's [id](https://maplibre.org/maplibre-style-spec/layers/#id) and layer index within the [vector tile style](https://doc.arcgis.com/en/arcgis-online/reference/tile-layers.htm#ESRI_SECTION1_8F68399EB47B48FF9EF46719FCC96978). Spatial information about the actual feature represented in the style layer is returned only if the style layer is a [symbol layer](https://maplibre.org/maplibre-style-spec/layers/#symbol). Otherwise, the graphic's geometry is `null`. |
    * | [MediaLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/MediaLayer) | Returns [MediaHit](https://developers.arcgis.com/javascript/latest/references/core/views/types/#MediaHit) result containing all media elements if the hit is made on intersecting elements. |
    * | [RouteLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/RouteLayer) | Returns [RouteHit](https://developers.arcgis.com/javascript/latest/references/core/views/types/#RouteHit) result containing all intersecting route elements if the hit is made on intersecting elements. |
@@ -1013,24 +1045,26 @@ export abstract class ArcgisMap extends LitElement {
    * [SimpleFillSymbol.color](https://developers.arcgis.com/javascript/latest/references/core/symbols/SimpleFillSymbol#color) to a transparent color instead.
    *
    * Release-specific changes:
-   * * At version 5.1, the [ScreenRect](https://developers.arcgis.com/javascript/latest/references/core/core/types/#ScreenRect) option was added to perform hit tests on rectangular areas.
+   * * At version 5.1, **[beta](https://developers.arcgis.com/javascript/latest/faq/#what-does-the-beta-tag-mean)** support was added for [ScreenRect](https://developers.arcgis.com/javascript/latest/references/core/core/types/#ScreenRect), allowing hit tests across rectangular screen areas.
    * * At version 4.24, [ViewHitTestResult](https://developers.arcgis.com/javascript/latest/references/core/views/types/#ViewHitTestResult) returns an array of objects containing [GraphicHit](https://developers.arcgis.com/javascript/latest/references/core/views/types/#GraphicHit) graphic, [MediaHit](https://developers.arcgis.com/javascript/latest/references/core/views/types/#MediaHit) media element, and [RouteHit](https://developers.arcgis.com/javascript/latest/references/core/views/types/#RouteHit) route.
    * * At version 4.23, all hit test features from feature layers are returned in the result. In prior releases, only the top most feature was returned.
    *
    * @param hitTarget
    * @param options
+   * @see [Sample - Access features with hitTest](https://developers.arcgis.com/javascript/latest/sample-code/map-component-hittest/)
+   * @see [Sample - Hit test features by screen rectangle](https://developers.arcgis.com/javascript/latest/sample-code/map-hittest-screen-rectangle/)
+   * @see [Sample - VectorTileLayer hitTest](https://developers.arcgis.com/javascript/latest/sample-code/layers-vectortilelayer-hittest/)
    * @example
    * ```js
-   * viewElement.addEventListener("arcgisViewClick", (event) => {
-   *    viewElement.hitTest(event.detail).then((response) => {
-   *       const result = response.results[0];
-   *       if (result?.type === "graphic") {
-   *          const { longitude, latitude } = result.mapPoint;
-   *          console.log(`Hit graphic at (${longitude}, ${latitude})`, result.graphic);
-   *       } else {
-   *          console.log("Did not hit any graphic");
-   *       }
-   *    });
+   * viewElement.addEventListener("arcgisViewClick", async (event) => {
+   *    const response = await viewElement.hitTest(event.detail);
+   *    const result = response.results[0];
+   *    if (result?.type === "graphic") {
+   *       const { longitude, latitude } = result.mapPoint;
+   *       console.log(`Hit graphic at (${longitude}, ${latitude})`, result.graphic);
+   *    } else {
+   *       console.log("Did not hit any graphic");
+   *    }
    * });
    * ```
    * @example
@@ -1386,4 +1420,6 @@ export abstract class ArcgisMap extends LitElement {
     arcgisViewReadyError: ArcgisMap["arcgisViewReadyError"]["detail"];
     arcgisViewVerticalTwoFingerDrag: ArcgisMap["arcgisViewVerticalTwoFingerDrag"]["detail"];
   };
-}
+}
+
+export type AttributionMode = MapView["attributionMode"] | "auto";

package/dist/components/arcgis-map/customElement.js

@@ -5,15 +5,15 @@ import { watch as s } from "@arcgis/core/core/reactiveUtils.js";
 import c from "@arcgis/core/views/MapView.js";
 import v from "@arcgis/core/WebMap.js";
 import { LitElement as m, createEvent as r, safeClassMap as o } from "@arcgis/lumina";
-import { reEmitEvent as e, reCreateAccessor as u, makeAccessorController as p } from "@arcgis/lumina/controllers/accessor";
+import { makeAccessorController as p, reEmitEvent as e, reCreateAccessor as u } from "@arcgis/lumina/controllers/accessor";
 import { createRef as n, ref as h } from "lit/directives/ref.js";
-import { s as g } from "../../chunks/esri-main.js";
-import { s as d } from "../../chunks/slots.js";
+import { U as g, u as d, a as y, b as f } from "../../chunks/useArcgisViewReadyError.js";
+import { s as b } from "../../chunks/esri-main.js";
+import { s as V } from "../../chunks/slots.js";
 import { C as w } from "../../chunks/resources.js";
-import { p as y, i as f } from "../../chunks/component-utils.js";
-import { U as b, u as V, a as C } from "../../chunks/useArcgisViewReadyError.js";
-import E from "@arcgis/core/core/Collection.js";
-const A = p(
+import { p as C, i as E } from "../../chunks/component-utils.js";
+import A from "@arcgis/core/core/Collection.js";
+const _ = p(
   v,
   /**
    * Since omitProps is only needed for typing, not runtime, `{} as { ... }` is
@@ -25,9 +25,9 @@ const A = p(
    */
   {}
 ), R = p(c, {});
-class _ extends m {
+class M extends m {
   constructor() {
-    super(), this._containerRef = n(), this._mapRef = n(), this._uiController = new b(this), this.extraContent = new E(), this.arcgisLoadError = V(this), this.arcgisViewReadyError = C(this), this._map = A(this), this.view = R(this), this.animationsDisabled = this.view.animationsEnabled, this.allLayerViews = this.view.allLayerViews, this.analyses = this.view.analyses, this.attributionMode = this.view.attributionMode, this.autoDestroyDisabled = !1, this.background = this.view.background, this.basemap = this._map.basemap, this.basemapView = this.view.basemapView, this.canZoomIn = this.view.canZoomIn, this.canZoomOut = this.view.canZoomOut, this.constraints = this.view.constraints, this.displayFilterDisabled = this.view.displayFilterEnabled, this.fatalError = this.view.fatalError, this.floors = this.view.floors, this.graphics = this.view.graphics, this.ground = this._map.ground, this.highlights = this.view.highlights, this.ipsInfo = this._map.ipsInfo, this.layerViews = this.view.layerViews, this.magnifier = this.view.magnifier, this.map = this.view.map, this.navigation = this.view.navigation, this.padding = this.view.padding, this.popup = this.view.popup, this.popupDisabled = this.view.popupEnabled, this.popupComponentEnabled = !1, this.ready = this.view.ready, this.resizeAlign = this.view.resizeAlign, this.resolution = this.view.resolution, this.rotation = this.view.rotation, this.selectionManager = this.view.selectionManager, this.slotGroupRefs = this._uiController.slotGroupRefs, this.spatialReference = this.view.spatialReference, this.spatialReferenceLocked = this.view.spatialReferenceLocked, this.suspended = this.view.suspended, this.theme = this.view.theme, this.timeExtent = this.view.timeExtent, this.timeZone = this.view.timeZone, this.updating = this.view.updating, this.visibleArea = this.view.visibleArea, this.arcgisViewAnalysisViewCreate = e(() => this.view, "analysis-view-create"), this.arcgisViewAnalysisViewCreateError = e(() => this.view, "analysis-view-create-error"), this.arcgisViewAnalysisViewDestroy = e(() => this.view, "analysis-view-destroy"), this.arcgisViewChange = r(), this.arcgisViewClick = e(() => this.view, "click"), this.arcgisViewDoubleClick = e(() => this.view, "double-click"), this.arcgisViewDoubleTapDrag = e(() => this.view, "double-tap-drag"), this.arcgisViewDrag = e(() => this.view, "drag"), this.arcgisViewHold = e(() => this.view, "hold"), this.arcgisViewImmediateClick = e(() => this.view, "immediate-click"), this.arcgisViewImmediateDoubleClick = e(() => this.view, "immediate-double-click"), this.arcgisViewKeyDown = e(() => this.view, "key-down"), this.arcgisViewKeyUp = e(() => this.view, "key-up"), this.arcgisViewLayerviewCreate = e(() => this.view, "layerview-create"), this.arcgisViewLayerviewCreateError = e(() => this.view, "layerview-create-error"), this.arcgisViewLayerviewDestroy = e(() => this.view, "layerview-destroy"), this.arcgisViewMouseWheel = e(() => this.view, "mouse-wheel"), this.arcgisViewPointerDown = e(() => this.view, "pointer-down"), this.arcgisViewPointerEnter = e(() => this.view, "pointer-enter"), this.arcgisViewPointerLeave = e(() => this.view, "pointer-leave"), this.arcgisViewPointerMove = e(() => this.view, "pointer-move"), this.arcgisViewPointerUp = e(() => this.view, "pointer-up"), this.arcgisViewReadyChange = r(), this.arcgisViewVerticalTwoFingerDrag = e(() => this.view, "vertical-two-finger-drag"), this.view.ui = {
+    super(), this._attributionMode = null, this._containerRef = n(), this._mapRef = n(), this._uiController = new g(this), this.extraContent = new A(), this.arcgisLoadError = d(this), this.arcgisViewReadyError = y(this), this._map = _(this), this.view = R(this), this.animationsDisabled = this.view.animationsEnabled, this.allLayerViews = this.view.allLayerViews, this.analyses = this.view.analyses, this.autoDestroyDisabled = !1, this.background = this.view.background, this.basemap = this._map.basemap, this.basemapView = this.view.basemapView, this.canZoomIn = this.view.canZoomIn, this.canZoomOut = this.view.canZoomOut, this.constraints = this.view.constraints, this.displayFilterDisabled = this.view.displayFilterEnabled, this.fatalError = this.view.fatalError, this.floors = this.view.floors, this.graphics = this.view.graphics, this.ground = this._map.ground, this.highlights = this.view.highlights, this.ipsInfo = this._map.ipsInfo, this.layerViews = this.view.layerViews, this.magnifier = this.view.magnifier, this.map = this.view.map, this.navigation = this.view.navigation, this.padding = this.view.padding, this.popup = this.view.popup, this.popupDisabled = this.view.popupEnabled, this.popupComponentEnabled = !1, this.ready = this.view.ready, this.resizeAlign = this.view.resizeAlign, this.resolution = this.view.resolution, this.rotation = this.view.rotation, this.selectionManager = this.view.selectionManager, this.slotGroupRefs = this._uiController.slotGroupRefs, this.spatialReference = this.view.spatialReference, this.spatialReferenceLocked = this.view.spatialReferenceLocked, this.suspended = this.view.suspended, this.theme = this.view.theme, this.timeExtent = this.view.timeExtent, this.timeZone = this.view.timeZone, this.updating = this.view.updating, this.visibleArea = this.view.visibleArea, this.arcgisViewAnalysisViewCreate = e(() => this.view, "analysis-view-create"), this.arcgisViewAnalysisViewCreateError = e(() => this.view, "analysis-view-create-error"), this.arcgisViewAnalysisViewDestroy = e(() => this.view, "analysis-view-destroy"), this.arcgisViewChange = r(), this.arcgisViewClick = e(() => this.view, "click"), this.arcgisViewDoubleClick = e(() => this.view, "double-click"), this.arcgisViewDoubleTapDrag = e(() => this.view, "double-tap-drag"), this.arcgisViewDrag = e(() => this.view, "drag"), this.arcgisViewHold = e(() => this.view, "hold"), this.arcgisViewImmediateClick = e(() => this.view, "immediate-click"), this.arcgisViewImmediateDoubleClick = e(() => this.view, "immediate-double-click"), this.arcgisViewKeyDown = e(() => this.view, "key-down"), this.arcgisViewKeyUp = e(() => this.view, "key-up"), this.arcgisViewLayerviewCreate = e(() => this.view, "layerview-create"), this.arcgisViewLayerviewCreateError = e(() => this.view, "layerview-create-error"), this.arcgisViewLayerviewDestroy = e(() => this.view, "layerview-destroy"), this.arcgisViewMouseWheel = e(() => this.view, "mouse-wheel"), this.arcgisViewPointerDown = e(() => this.view, "pointer-down"), this.arcgisViewPointerEnter = e(() => this.view, "pointer-enter"), this.arcgisViewPointerLeave = e(() => this.view, "pointer-leave"), this.arcgisViewPointerMove = e(() => this.view, "pointer-move"), this.arcgisViewPointerUp = e(() => this.view, "pointer-up"), this.arcgisViewReadyChange = r(), this.arcgisViewVerticalTwoFingerDrag = e(() => this.view, "vertical-two-finger-drag"), f(this), this.view.ui = {
       components: []
     };
   }
@@ -35,7 +35,7 @@ class _ extends m {
     this.properties = { _map: 16, view: 32, animationsDisabled: 5, aria: 0, allLayerViews: 32, analyses: 0, attributionItems: 32, attributionMode: 1, autoDestroyDisabled: 5, background: 0, basemap: 1, basemapView: 0, canZoomIn: 36, canZoomOut: 36, center: 1, constraints: 0, displayFilterDisabled: 5, extent: 0, fatalError: 0, floors: 0, focusAreas: 0, gamepad: 32, graphics: 0, ground: 1, hideAttribution: 5, highlights: 0, interacting: 32, ipsInfo: 0, itemId: 3, layerViews: 32, magnifier: 32, map: 0, navigating: 32, navigation: 0, padding: 0, popup: 0, popupElement: 32, popupDisabled: 5, popupComponentEnabled: 5, ready: 36, resizeAlign: 1, resolution: 40, rotation: 9, scale: 9, selectionManager: 32, slotGroupRefs: 32, spatialReference: 0, spatialReferenceLocked: 5, stationary: 32, suspended: 39, theme: 0, timeExtent: 0, timeZone: 1, updating: 36, viewpoint: 0, visibleArea: 32, zoom: 9, loadErrorSources: 0 };
   }
   static {
-    this.styles = [g, d];
+    this.styles = [b, V];
   }
   get aria() {
     return this.view?.aria;
@@ -46,11 +46,17 @@ class _ extends m {
   get attributionItems() {
     return this.view?.attributionItems ?? [];
   }
+  get attributionMode() {
+    return this._attributionMode;
+  }
+  set attributionMode(i) {
+    this._attributionMode = i, i !== "auto" && (this.view.attributionMode = i);
+  }
   get center() {
     return this.view.center;
   }
   set center(i) {
-    const t = y(i, this.view);
+    const t = C(i, this.view);
     t && (this.view.center = t);
   }
   get extent() {
@@ -105,7 +111,7 @@ class _ extends m {
     return this.view.viewpoint;
   }
   set viewpoint(i) {
-    f(this.viewpoint, i) && (this.view.viewpoint = i);
+    E(this.viewpoint, i) && (this.view.viewpoint = i);
   }
   get zoom() {
     return this.view.zoom;
@@ -178,7 +184,7 @@ class _ extends m {
     return a`${this.renderMain()}<section class=${o(w.containerUI)} ${h(this._containerRef)}>${this._uiController.render()}${this.extraContent}</section>`;
   }
 }
-l("arcgis-map", _);
+l("arcgis-map", M);
 export {
-  _ as ArcgisMap
+  M as ArcgisMap
 };

package/dist/components/arcgis-measurement/customElement.d.ts

@@ -114,6 +114,15 @@ export abstract class ArcgisMeasurement extends LitElement {
    * prevent memory leaks.
    *
    * @default false
+   * @example
+   * ```html
+   * <arcgis-measurement auto-destroy-disabled></arcgis-measurement>
+   * ```
+   *
+   * ```js
+   * measurementElement.autoDestroyDisabled = true;
+   * ```
+   * 
    */
   accessor autoDestroyDisabled: boolean;
   /**
@@ -165,8 +174,8 @@ export abstract class ArcgisMeasurement extends LitElement {
    */
   get state(): MeasurementState;
   /**
-   * 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 arcgis-measurement component will be associated with a map or scene component rather than using the `view` property.
+   * 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 arcgis-measurement component will be associated with a map or scene component rather than using the `view` property.
    */
   accessor view: MapViewOrSceneView | null | undefined;
   /** Removes all measurement widgets and associated graphics. */