@arcgis/map-components 5.1.0-next.1 → 5.1.0-next.100

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

@@ -1,18 +1,19 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
-import { c as l } from "../../chunks/runtime.js";
+import { c as p } from "../../chunks/runtime.js";
 import { html as a } from "lit";
 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 n } from "@arcgis/lumina";
-import { makeAccessorController as p, reEmitEvent as e, reCreateAccessor as g } from "@arcgis/lumina/controllers/accessor";
-import { createRef as h, ref as o } from "lit/directives/ref.js";
-import { s as u } from "../../chunks/esri-main.js";
-import { s as d, C as w } from "../../chunks/slots.js";
+import { LitElement as m, createEvent as r, safeClassMap as o } from "@arcgis/lumina";
+import { reEmitEvent as e, reCreateAccessor as u, makeAccessorController as l } 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 { 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(
+const A = l(
   v,
   /**
    * Since omitProps is only needed for typing, not runtime, `{} as { ... }` is
@@ -23,18 +24,18 @@ const A = p(
    * in an externalized package.
    */
   {}
-), _ = p(c, {});
-class R extends m {
+), R = l(c, {});
+class _ extends m {
   constructor() {
-    super(), this._containerRef = h(), this._mapRef = h(), this._uiController = new b(this), this.extraContent = new E(), this.arcgisLoadError = V(this), this.arcgisViewReadyError = C(this), this._map = A(this), this.view = _(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.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.highlightOptions = this.view.highlightOptions, 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.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._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 = {
       components: []
     };
   }
   static {
-    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, center: 1, constraints: 0, displayFilterDisabled: 5, extent: 0, fatalError: 0, floors: 0, focusAreas: 0, gamepad: 32, graphics: 0, ground: 1, hideAttribution: 5, highlights: 0, highlightOptions: 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, spatialReference: 0, spatialReferenceLocked: 5, stationary: 32, suspended: 39, theme: 0, timeExtent: 0, timeZone: 1, updating: 36, viewpoint: 0, visibleArea: 32, zoom: 9, loadErrorSources: 0 };
+    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 = [u, d];
+    this.styles = [g, d];
   }
   get aria() {
     return this.view?.aria;
@@ -83,7 +84,7 @@ class R extends m {
     return this._map.portalItem?.id;
   }
   set itemId(i) {
-    g(this._map, this), this._map.portalItem = { id: i }, this.view.map = this._map;
+    u(this._map, this), this._map.portalItem = { id: i }, this.view.map = this._map;
   }
   get navigating() {
     return this.view.navigating;
@@ -148,6 +149,12 @@ class R extends m {
   async whenLayerView(i) {
     return await this.view?.whenLayerView(i);
   }
+  async zoomIn() {
+    this.view.zoomIn();
+  }
+  async zoomOut() {
+    this.view.zoomOut();
+  }
   loaded() {
     const i = this;
     i.el.childElem = this._mapRef.value, this.view.container ??= i.el.childElem, this.map ||= this._map, this.manager.onLifecycle(() => [
@@ -158,17 +165,17 @@ class R extends m {
       s(() => this.view.ready, () => this.arcgisViewReadyChange.emit(), { initial: this.view.ready }),
       s(() => this.view.attributionHeight, (t) => {
         this._uiController.handleAttributionHeightChange(t);
-      })
+      }, { initial: !0 })
     ]);
   }
   renderMain() {
-    return a`<div class=${n(w.base)} ${o(this._mapRef)}></div>`;
+    return a`<div class=${o(w.base)} ${h(this._mapRef)}></div>`;
   }
   render() {
-    return a`${this.renderMain()}<section class=${n(w.containerUI)} ${o(this._containerRef)}>${this._uiController.render()}${this.extraContent}</section>`;
+    return a`${this.renderMain()}<section class=${o(w.containerUI)} ${h(this._containerRef)}>${this._uiController.render()}${this.extraContent}</section>`;
   }
 }
-l("arcgis-map", R);
+p("arcgis-map", _);
 export {
-  R as ArcgisMap
+  _ as ArcgisMap
 };

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

@@ -1,7 +1,6 @@
 /// <reference path="../../index.d.ts" />
 import type { PublicLitElement as LitElement } from "@arcgis/lumina";
-import type { ArcgisReferenceElement } from "../../utils/component-utils.js";
-import type { IconName } from "../../utils/action-utils.js";
+import type { ArcgisReferenceElement, IconName } from "../types.js";
 import type { MapViewOrSceneView } from "@arcgis/core/views/MapViewOrSceneView.js";
 import type { MeasurementComponentType } from "@arcgis/core/widgets/Measurement/types.js";
 import type { MeasurementWidget } from "@arcgis/core/widgets/Measurement.js";
@@ -11,7 +10,7 @@ import type { MeasurementState } from "@arcgis/core/widgets/types.js";
 
 /**
  * The Measurement component groups and manages multiple measurement tools and allows you to easily switch between them using
- * the [activeTool](#activeTool) property. The tools correspond to the measurement components for area and distance in 2D
+ * the [activeTool](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-measurement/#activeTool) property. The tools correspond to the measurement components for area and distance in 2D
  * [arcgis-area-measurement-2d](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-area-measurement-2d/), [arcgis-distance-measurement-2d](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-distance-measurement-2d/) and in 3D
  * [arcgis-area-measurement-3d](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-area-measurement-3d/), [arcgis-direct-line-measurement-3d](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-direct-line-measurement-3d/).
  *
@@ -61,8 +60,8 @@ import type { MeasurementState } from "@arcgis/core/widgets/types.js";
 export abstract class ArcgisMeasurement extends LitElement {
   /**
    * Specifies the current measurement tool to display. Setting its value to `area` activates
-   * the area measurement tool and it works in both [arcgis-map](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-map/) and [arcgis-scene](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-scene/). To measure distance in a [arcgis-map](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-map/),
-   * set the property to `distance` and in a [arcgis-scene](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-scene/) set it to `direct-line`.
+   * the area measurement tool and it works in both [arcgis-map](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-map/) and [arcgis-scene](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-scene/). To measure distance in an [arcgis-map](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-map/),
+   * set the property to `distance` and in an [arcgis-scene](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-scene/) set it to `direct-line`.
    * If this property is not set, the component will not be displayed.
    *
    * @example

package/dist/components/arcgis-measurement-content/customElement.js

@@ -1,13 +1,13 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
-import { c as n } from "../../chunks/runtime.js";
+import { c as r } from "../../chunks/runtime.js";
 import { css as s, html as e } from "lit";
 import { ref as l } from "lit/directives/ref.js";
 import c from "@arcgis/core/applications/Components/QuantityFormatter.js";
-import { LitElement as o, safeClassMap as i, nothing as g } from "@arcgis/lumina";
+import { LitElement as o, safeClassMap as n } from "@arcgis/lumina";
 import { generateGuid as u } from "@arcgis/toolkit/string";
-import { f as m } from "../../chunks/measurementUtils.js";
-const p = s`:host{--arcgis-internal-color-black-30: color-mix(in srgb, #000000 30.2%, transparent);--arcgis-internal-box-shadow: var(--calcite-spacing-none) var(--calcite-spacing-px) var(--calcite-spacing-base) var(--arcgis-internal-color-black-30);--arcgis-internal-top-max-width: calc(min(100cqw, 100vw) - var(--calcite-spacing-xxxl));--arcgis-internal-panel-width: 300px;--arcgis-internal-panel-height: 100%;--arcgis-internal-panel-height-sm: 240px;--arcgis-internal-panel-height-md: 420px;--arcgis-internal-panel-height-lg: 540px;--arcgis-internal-panel-height-xl: 680px;--arcgis-internal-panel-gap: var(--calcite-spacing-lg);--arcgis-internal-panel-actions-gap: var(--calcite-spacing-sm);--arcgis-internal-basemap-gallery-width-lg: 450px;--arcgis-internal-collapse-icon-flip: scaleX(1);--arcgis-internal-row-direction: row;--arcgis-internal-legend-width: 300px;--arcgis-internal-layout-overlay-space-top: var(--arcgis-layout-overlay-space-top, 0px);--arcgis-internal-layout-overlay-space-bottom: var(--arcgis-layout-overlay-space-bottom, 0px);--arcgis-internal-layout-overlay-space-left: var(--arcgis-layout-overlay-space-left, 0px);--arcgis-internal-layout-overlay-space-right: var(--arcgis-layout-overlay-space-right, 0px);--arcgis-internal-view-color-focus: var(--arcgis-view-color-focus, var(--calcite-color-brand));--arcgis-internal-attribution-space-bottom: var(--arcgis-internal-layout-overlay-space-bottom);--arcgis-internal-attribution-space-left: var(--arcgis-internal-layout-overlay-space-left);--arcgis-internal-attribution-space-right: var(--arcgis-internal-layout-overlay-space-right);--arcgis-internal-attribution-font-size: var(--calcite-font-size-sm);--arcgis-internal-attribution-font-size-sm: var(--calcite-font-size-xs);--arcgis-internal-sketch-justify-content: flex-start}:host,.hint,.error,.section,.actions,.item{display:flex;flex-direction:column;gap:var(--arcgis-internal-panel-gap);animation:esri-fade-in .25s ease-in-out}.error{color:var(--calcite-color-status-danger)}.error,.hint{overflow:hidden;p{margin:0;padding:0}}.results-grid{display:grid;gap:var(--calcite-spacing-md);column-gap:var(--calcite-spacing-xxl);grid-template-columns:1fr max-content;&.vertical{display:flex;flex-direction:column;align-items:flex-start;.item{display:block}.title{margin-bottom:var(--calcite-spacing-xxs)}.value{align-self:flex-start}}}.item{display:contents;&.disabled>*{color:var(--calcite-color-text-1);opacity:var(--calcite-opacity-light)}}.title{grid-column:1;word-break:break-word;--calcite-label-margin-bottom: 0}.value{grid-column:2;font-weight:var(--calcite-font-weight-semibold);white-space:nowrap;align-self:center;justify-self:flex-end}.actions{justify-content:center;gap:var(--arcgis-internal-panel-actions-gap);&[hidden]{display:none}}`;
-class d extends o {
+import { f as g } from "../../chunks/measurementUtils.js";
+const p = s`:host{--arcgis-internal-color-black-30: color-mix(in srgb, #000000 30.2%, transparent);--arcgis-internal-box-shadow: var(--calcite-spacing-none) var(--calcite-spacing-px) var(--calcite-spacing-base) var(--arcgis-internal-color-black-30);--arcgis-internal-top-max-width: calc(min(100cqw, 100vw) - var(--calcite-spacing-xxxl));--arcgis-internal-panel-width: 300px;--arcgis-internal-panel-height: 100%;--arcgis-internal-panel-height-sm: 240px;--arcgis-internal-panel-height-md: 420px;--arcgis-internal-panel-height-lg: 540px;--arcgis-internal-panel-height-xl: 680px;--arcgis-internal-panel-gap: var(--calcite-spacing-lg);--arcgis-internal-panel-actions-gap: var(--calcite-spacing-sm);--arcgis-internal-basemap-gallery-width-lg: 450px;--arcgis-internal-collapse-icon-flip: scaleX(1);--arcgis-internal-row-direction: row;--arcgis-internal-legend-width: 300px;--arcgis-internal-layout-overlay-space-top: var(--arcgis-layout-overlay-space-top, 0px);--arcgis-internal-layout-overlay-space-bottom: var(--arcgis-layout-overlay-space-bottom, 0px);--arcgis-internal-layout-overlay-space-left: var(--arcgis-layout-overlay-space-left, 0px);--arcgis-internal-layout-overlay-space-right: var(--arcgis-layout-overlay-space-right, 0px);--arcgis-internal-view-color-focus: var(--arcgis-view-color-focus, var(--calcite-color-brand));--arcgis-internal-attribution-space-bottom: var(--arcgis-internal-layout-overlay-space-bottom);--arcgis-internal-attribution-space-left: var(--arcgis-internal-layout-overlay-space-left);--arcgis-internal-attribution-space-right: var(--arcgis-internal-layout-overlay-space-right);--arcgis-internal-attribution-font-size: var(--calcite-font-size-sm);--arcgis-internal-attribution-font-size-sm: var(--calcite-font-size-xs);--arcgis-internal-sketch-justify-content: flex-start}:host,.hint,.error,.section,.actions,.item{display:flex;flex-direction:column;gap:var(--arcgis-internal-panel-gap);animation:esri-fade-in .25s ease-in-out}.error{color:var(--calcite-color-status-danger)}.error,.hint{overflow:hidden;p{margin:0;padding:0}}.results-grid{display:grid;column-gap:var(--calcite-spacing-xxs);row-gap:var(--calcite-spacing-md);grid-template-columns:1fr max-content max-content;&.vertical{display:flex;flex-direction:column;align-items:flex-start;.item{display:block}.title{margin-bottom:var(--calcite-spacing-xxs)}.value{align-self:flex-start}}}.item{display:contents;&.disabled>*{color:var(--calcite-color-text-1);opacity:var(--calcite-opacity-light)}}.title{grid-column:1;word-break:break-word;--calcite-label-margin-bottom: 0}.value{grid-column:2;font-weight:var(--calcite-font-weight-semibold);white-space:nowrap;align-self:center;justify-self:flex-end;font-variant-numeric:tabular-nums;&:has(~:empty){grid-column:span 2}~:empty{display:none}}.unit{font-weight:var(--calcite-font-weight-semibold);text-align:left}.actions{justify-content:center;gap:var(--arcgis-internal-panel-actions-gap);&[hidden]{display:none}}`;
+class m extends o {
   constructor() {
     super(...arguments), this._formatter = new c(), this._baseId = u(), this._hasActionsContent = !1, this.layout = "horizontal", this.items = [], this.state = "disabled", this.unsupportedLabel = "";
   }
@@ -35,7 +35,7 @@ class d extends o {
       case "ready":
         return this._renderActions();
       default:
-        return e`<slot name=settings></slot>${h({ idBase: this._baseId, formatter: this._formatter, items: this.items, layout: this.layout })}${this._renderActions()}`;
+        return e`<slot name=settings></slot>${d({ idBase: this._baseId, formatter: this._formatter, items: this.items, layout: this.layout })}${this._renderActions()}`;
     }
   }
   _renderActions() {
@@ -44,20 +44,24 @@ class d extends o {
     }} ${l(this._actionsRef)}></slot></div>`;
   }
 }
-function h(t) {
-  return e`<section class=${i({
+function d(t) {
+  return e`<section class=${n({
     "results-grid": !0,
     vertical: t.layout === "vertical"
-  })}>${t.items.map((a, r) => v({ formatter: t.formatter, measurement: a.measurement, title: a.title, valueId: `${t.idBase}-item-${r}` }))}</section>`;
+  })}>${t.items.map((a, i) => v({ formatter: t.formatter, measurement: a.measurement, title: a.title, valueId: `${t.idBase}-item-${i}` }))}</section>`;
+}
+function h(t) {
+  const [a = "-", i = ""] = t.value?.split(" ") ?? [];
+  return e`<output aria-live=polite class="value">${a}</output><span class="unit">${i}</span>`;
 }
 function v(t) {
-  const a = t.measurement.state === "available" ? m(t.formatter, t.measurement.value) : null;
-  return e`<div class=${i({
+  const a = t.measurement.state === "available" ? g(t.formatter, t.measurement.value) : null;
+  return e`<div class=${n({
     item: !0,
     disabled: t.measurement.state !== "available"
-  })}><calcite-label layout=inline class="title" .for=${t.valueId}>${t.title ?? ""}</calcite-label><output id=${t.valueId ?? g} aria-live=polite class="value">${a ?? "-"}</output></div>`;
+  })}><calcite-label layout=inline class="title" .for=${t.valueId}>${t.title ?? ""}</calcite-label>${h({ value: a })}</div>`;
 }
-n("arcgis-measurement-content", d);
+r("arcgis-measurement-content", m);
 export {
-  d as ArcgisMeasurementContent
+  m as ArcgisMeasurementContent
 };

package/dist/components/arcgis-multi-feature-form/customElement.d.ts

@@ -1,18 +1,16 @@
 /// <reference path="../../index.d.ts" />
-import type Graphic from "@arcgis/core/Graphic";
-import type MapView from "@arcgis/core/views/MapView";
-import type SceneView from "@arcgis/core/views/SceneView";
+import type Graphic from "@arcgis/core/Graphic.js";
+import type MapView from "@arcgis/core/views/MapView.js";
+import type SceneView from "@arcgis/core/views/SceneView.js";
 import type Collection from "@arcgis/core/core/Collection.js";
-import type Graphic2 from "@arcgis/core/Graphic.js";
 import type { PublicLitElement as LitElement } from "@arcgis/lumina";
-import type { ArcgisReferenceElement } from "../../utils/component-utils.js";
-import type { ValueChangeEvent } from "@arcgis/core/widgets/BatchAttributeForm/types";
+import type { ArcgisReferenceElement } from "../types.js";
+import type { ValueChangeEvent, BatchAttributeFormState } from "@arcgis/core/widgets/BatchAttributeForm/types.js";
 import type { Icon } from "@esri/calcite-components/components/calcite-icon";
-import type { SubmitEvent } from "@arcgis/core/widgets/FeatureForm/FeatureFormViewModel";
-import type { UIPosition } from "@arcgis/core/views/ui/types";
+import type { SubmitEvent } from "@arcgis/core/widgets/FeatureForm/FeatureFormViewModel.js";
+import type { UIPosition } from "@arcgis/core/views/ui/types.js";
 import type { EditType } from "@arcgis/core/widgets/support/forms/types.js";
 import type { HeadingLevel } from "@arcgis/core/widgets/support/types.js";
-import type { BatchAttributeFormState } from "@arcgis/core/widgets/BatchAttributeForm/types.js";
 
 /**
  * The Multi Feature Form component provides a Feature Form which works with
@@ -36,7 +34,7 @@ export abstract class ArcgisMultiFeatureForm extends LitElement {
   /** @default false */
   accessor disabled: boolean;
   accessor editType: EditType;
-  accessor features: Collection<Graphic2>;
+  accessor features: Collection<Graphic>;
   accessor groupDisplay: "all" | "sequential";
   /** @default false */
   accessor hasTooManyComplexFeatures: boolean;
@@ -94,7 +92,7 @@ export abstract class ArcgisMultiFeatureForm extends LitElement {
   readonly arcgisPropertyChange: import("@arcgis/lumina").TargetedEvent<this, { name: "status" | "valid" | "updating" | "submitHasBeenAttempted" | "activeFeatureIndex"; }>;
   /** Emitted when the component associated with a map or scene view is ready to be interacted with. */
   readonly arcgisReady: import("@arcgis/lumina").TargetedEvent<this, void>;
-  /** Fires when the [submit()](#submit) method is called. */
+  /** Fires when the [submit()](https://developers.arcgis.com/javascript/latest/references/core/widgets/BatchAttributeForm/#submit) method is called. */
   readonly arcgisSubmit: import("@arcgis/lumina").TargetedEvent<this, SubmitEvent>;
   /** Fires when a field value is updated. */
   readonly arcgisValueChange: import("@arcgis/lumina").TargetedEvent<this, ValueChangeEvent>;

package/dist/components/arcgis-navigation-toggle/customElement.d.ts

@@ -1,7 +1,8 @@
 /// <reference path="../../index.d.ts" />
-import type SceneView from "@arcgis/core/views/SceneView";
+import type SceneView from "@arcgis/core/views/SceneView.js";
 import type { PublicLitElement as LitElement } from "@arcgis/lumina";
-import type { ArcgisReferenceElement } from "../../utils/component-utils.js";
+import type { ArcgisReferenceElement } from "../types.js";
+import type { NavigationToggleState } from "./types.js";
 import type { T9nMeta } from "@arcgis/lumina/controllers";
 import type { Icon as Icon } from "@esri/calcite-components/components/calcite-icon";
 import type { Button as Button } from "@esri/calcite-components/components/calcite-button";
@@ -15,7 +16,7 @@ import type { Button as Button } from "@esri/calcite-components/components/calci
  *
  * **Known limitations**
  *
- * Navigation Toggle is only supported in a 3D [Scene](https://developers.arcgis.com/javascript/latest/references/map-components/arcgis-scene/) component.
+ * Navigation Toggle is only supported in a 3D [arcgis-scene](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-scene/) component.
  *
  *  \@since 4.28
  */
@@ -54,7 +55,7 @@ export abstract class ArcgisNavigationToggle extends LitElement {
    *
    * @default "vertical"
    */
-  accessor layout: LayoutMode;
+  accessor layout: "horizontal" | "vertical";
   /**
    * Replace localized message strings with your own strings.
    *
@@ -73,7 +74,7 @@ export abstract class ArcgisNavigationToggle extends LitElement {
    *
    * @default "pan"
    */
-  accessor navigationMode: NavigationMode;
+  accessor navigationMode: "pan" | "rotate";
   /**
    * 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.
    *
@@ -105,10 +106,4 @@ export abstract class ArcgisNavigationToggle extends LitElement {
     arcgisPropertyChange: ArcgisNavigationToggle["arcgisPropertyChange"]["detail"];
     arcgisReady: ArcgisNavigationToggle["arcgisReady"]["detail"];
   };
-}
-
-export type NavigationToggleState = "disabled" | "ready";
-
-export type NavigationMode = "pan" | "rotate";
-
-export type LayoutMode = "horizontal" | "vertical";
+}

package/dist/components/arcgis-navigation-toggle/customElement.js

@@ -1,16 +1,19 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
 import { c as d } from "../../chunks/runtime.js";
-import { usePropertyChange as g } from "@arcgis/lumina/controllers";
-import { when as c } from "@arcgis/core/core/reactiveUtils.js";
-import { LitElement as h, createEvent as p, safeClassMap as u, nothing as r } from "@arcgis/lumina";
+import { when as s } from "@arcgis/core/core/reactiveUtils.js";
+import { LitElement as g, createEvent as h, nothing as r, safeClassMap as p } from "@arcgis/lumina";
+import { usePropertyChange as u } from "@arcgis/lumina/controllers";
 import { css as v, html as m } from "lit";
 import { u as f } from "../../chunks/useT9n.js";
 import { u as b } from "../../chunks/useView.js";
 import { g as y } from "../../chunks/globalCss.js";
-const M = v`.arcgis-button{--calcite-icon-color: var(--calcite-color-text-3);--calcite-button-background-color: var(--calcite-color-foreground-1);color:var(--calcite-color-text-3);line-height:var(--calcite-font-line-height-relative-tight);display:flex;flex-flow:column;cursor:pointer;background-color:var(--calcite-color-foreground-1);font-size:var(--calcite-font-size);:hover{--calcite-icon-color: var(--calcite-color-text-1);--calcite-button-background-color: var(--calcite-color-transparent-hover)}}:host{display:flex;inline-size:fit-content;block-size:fit-content}.root{--calcite-internal-action-bar-padding: 0;--calcite-internal-action-bar-gap: 0;--calcite-action-corner-radius: 0}`, e = { pan: "move", rotate: "rotate" };
-class $ extends h {
+const M = v`.arcgis-button{--calcite-icon-color: var(--calcite-color-text-3);--calcite-button-background-color: var(--calcite-color-foreground-1);color:var(--calcite-color-text-3);line-height:var(--calcite-font-line-height-relative-tight);calcite-button{--calcite-offset-invert-focus: 1}display:flex;flex-flow:column;cursor:pointer;background-color:var(--calcite-color-foreground-1);font-size:var(--calcite-font-size);:hover{--calcite-icon-color: var(--calcite-color-text-1);--calcite-button-background-color: var(--calcite-color-transparent-hover)}}:host{display:flex;inline-size:fit-content;block-size:fit-content}.root{--calcite-internal-action-bar-padding: 0;--calcite-internal-action-bar-gap: 0;--calcite-action-corner-radius: 0}`, i = {
+  pan: "move",
+  rotate: "rotate"
+};
+class $ extends g {
   constructor() {
-    super(...arguments), this._messages = f(), this._state = "disabled", this.autoDestroyDisabled = !1, this.view = b(this), this.icon = e.pan, this.layout = "vertical", this.navigationMode = "pan", this.visualScale = "m", this.arcgisPropertyChange = g()("layout", "state"), this.arcgisReady = p();
+    super(...arguments), this._messages = f(), this._state = "disabled", this.autoDestroyDisabled = !1, this.view = b(this), this.icon = i.pan, this.layout = "vertical", this.navigationMode = "pan", this.visualScale = "m", this.arcgisPropertyChange = u()("layout", "state"), this.arcgisReady = h();
   }
   static {
     this.properties = { _state: 16, autoDestroyDisabled: 5, view: 0, icon: 1, label: 1, layout: 3, messageOverrides: 0, navigationMode: 3, referenceElement: 1, state: 35, visualScale: 1 };
@@ -29,8 +32,8 @@ class $ extends h {
   }
   load() {
     this.manager.onLifecycle(() => [
-      c(() => this.view?.navigation?.actionMap, () => this._updateNavigationActionMap()),
-      c(() => {
+      s(() => this.view?.navigation?.actionMap, () => this._updateNavigationActionMap()),
+      s(() => {
         const { view: t } = this;
         return t?.ready && t?.type === "3d" ? "ready" : "disabled";
       }, (t) => {
@@ -55,8 +58,8 @@ class $ extends h {
     t.dragPrimary = a ? "pan" : "rotate", t.dragSecondary = a ? "rotate" : "pan";
   }
   render() {
-    const { _messages: t, navigationMode: a, state: l } = this, o = t.pan ?? "", n = t.rotate ?? "", i = l === "disabled", s = a === "pan";
-    return m`<calcite-action-bar class=${u({ root: !0, [y.disabled]: i })} expand-disabled .layout=${this.layout}><calcite-action .active=${s} .disabled=${i} .icon=${e.pan} @click=${this._onPanClick} .scale=${this.visualScale} .text=${o} title=${o ?? r}></calcite-action><calcite-action .active=${!s} .disabled=${i} .icon=${e.rotate} @click=${this._onRotateClick} .scale=${this.visualScale} .text=${n} title=${n ?? r}></calcite-action></calcite-action-bar>`;
+    const { _messages: t, navigationMode: a, state: l } = this, o = t.pan ?? "", n = t.rotate ?? "", e = l === "disabled", c = a === "pan";
+    return m`<calcite-action-bar class=${p({ root: !0, [y.disabled]: e })} expand-disabled .layout=${this.layout}><calcite-action .active=${c} .disabled=${e} .icon=${i.pan} @click=${this._onPanClick} .scale=${this.visualScale} .text=${o} title=${o ?? r}></calcite-action><calcite-action .active=${!c} .disabled=${e} .icon=${i.rotate} @click=${this._onRotateClick} .scale=${this.visualScale} .text=${n} title=${n ?? r}></calcite-action></calcite-action-bar>`;
   }
 }
 d("arcgis-navigation-toggle", $);

package/dist/components/arcgis-navigation-toggle/types.d.ts

@@ -0,0 +1 @@
+export type NavigationToggleState = "disabled" | "ready";

package/dist/components/arcgis-oriented-imagery-viewer/customElement.d.ts

@@ -2,8 +2,8 @@
 import type OrientedImageryLayer from "@arcgis/core/layers/OrientedImageryLayer.js";
 import type Point from "@arcgis/core/geometry/Point.js";
 import type { PublicLitElement as LitElement } from "@arcgis/lumina";
-import type { ArcgisReferenceElement } from "../../utils/component-utils.js";
-import type { IconName } from "../../utils/action-utils.js";
+import type { ArcgisReferenceElement, IconName } from "../types.js";
+import type { AbortOptions } from "../../utils/async-utils.js";
 import type { MapViewOrSceneView } from "@arcgis/core/views/MapViewOrSceneView.js";
 import type { Icon } from "@esri/calcite-components/components/calcite-icon";
 
@@ -56,6 +56,20 @@ export abstract class ArcgisOrientedImageryViewer extends LitElement {
    * @default false
    */
   accessor galleryOpened: boolean;
+  /**
+   * Indicates whether to display the header of the widget.
+   *
+   * @default false
+   * @since 5.1
+   */
+  accessor hideHeader: boolean;
+  /**
+   * Indicates whether to display the action bar of the widget.
+   *
+   * @default false
+   * @since 5.1
+   */
+  accessor hideMenu: boolean;
   /**
    * Icon which represents the component.
    * Typically used when the component is controlled by another component (e.g. by the Expand component).
@@ -112,10 +126,17 @@ export abstract class ArcgisOrientedImageryViewer extends LitElement {
    */
   accessor label: string | null | undefined;
   /**
-   * Specifies the current [OrientedImageryLayer](https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-OrientedImageryLayer.html) to use. The layer is one the component connects to and utilizes to populate the image.
+   * Specifies the current [OrientedImageryLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/OrientedImageryLayer/) to use. The layer is one the component connects to and utilizes to populate the image.
    * The layer contains the feature data and oriented imagery properties required by the viewer to load the image and generate the associated graphics.
    */
   accessor layer: OrientedImageryLayer | null | undefined;
+  /**
+   * Layer Id of layer in the associated map. You can set `layer`, `layerId` or `orientedImageryLayerItemId`,
+   * but not more than one.
+   *
+   * @since 5.1
+   */
+  accessor layerId: string | undefined;
   /**
    * Indicates if the map-image location tool is available in the component.
    * When `true`, the user can select a point on the map and the corresponding location in pixel space will be displayed in the image, and vice versa.
@@ -133,6 +154,14 @@ export abstract class ArcgisOrientedImageryViewer extends LitElement {
    */
   accessor navigationToolActive: boolean;
   accessor orientedImageryLayerItemId: string | undefined;
+  /**
+   * When true, loading an image via directional or sequential navigation caches all neighboring images associated with that image.
+   * Navigating to adjacent images then uses the cached assets, reducing load times and improving viewer performance.
+   *
+   * @default false
+   * @since 5.0
+   */
+  accessor preloadMedia: boolean;
   /**
    * 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.
    *
@@ -154,6 +183,14 @@ export abstract class ArcgisOrientedImageryViewer extends LitElement {
   accessor view: MapViewOrSceneView | null | undefined;
   /** Permanently destroy the component. */
   destroy(): Promise<void>;
+  /**
+   * Loads the best available image for a given map point and displays it in the viewer. The method takes a `Point` object as an argument, which represents the location on the map for which the best image should be loaded. The viewer will analyze the available images for that location and select the one that best matches the given location.
+   *
+   * @param mapPoint - The [point](https://developers.arcgis.com/javascript/latest/references/core/geometry/Point/) object representing the location on the map for which to load the best image.
+   * @param options - Optional parameters for aborting the image loading process. This can be used to cancel the operation if it takes too long or if the user navigates away from the location before the image is loaded.
+   * @since 5.1
+   */
+  loadBestImage(mapPoint: Point, options?: AbortOptions): Promise<void>;
   "@setterTypes": {
     icon?: IconName;
   };

package/dist/components/arcgis-oriented-imagery-viewer/customElement.js

@@ -1,30 +1,36 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
 import { c as r } from "../../chunks/runtime.js";
 import { usePropertyChange as t } from "@arcgis/lumina/controllers";
-import o from "@arcgis/core/layers/OrientedImageryLayer.js";
-import a from "@arcgis/core/widgets/OrientedImageryViewer.js";
+import a from "@arcgis/core/layers/OrientedImageryLayer.js";
+import o from "@arcgis/core/widgets/OrientedImageryViewer.js";
 import { LitElement as n, createEvent as s } from "@arcgis/lumina";
 import { m as d } from "../../chunks/useWidget.js";
 import { css as l } from "lit";
-import { s as c } from "../../chunks/esri-main.js";
-const g = l`.esri-imagery-viewer{width:100%;height:100%}.esri-oriented-imagery-viewer{--esri-oriented-imagery-viewer-action-icon-size: 8px;--esri-oriented-imagery-viewer-min-width: 288px;--esri-oriented-imagery-viewer-min-height: 348px;--calcite-dialog-size-x: 210px;--calcite-dialog-min-size-y: 90px;--calcite-icon-size: var(--esri-oriented-imagery-viewer-action-icon-size);box-sizing:border-box;z-index:1;width:100%;min-width:var(--esri-oriented-imagery-viewer-min-width);height:100%;min-height:var(--esri-oriented-imagery-viewer-min-height);flex-direction:column;align-items:flex-start;display:flex;overflow:hidden}.esri-oriented-imagery-viewer:has(.esri-widget .esri-oriented-imagery-viewer__image-overlays-no-result){--esri-oriented-imagery-viewer-min-height: 420px}.esri-oriented-imagery-viewer__body{flex-direction:column;flex:1 0 auto;order:1;align-self:stretch;height:100%;display:flex}.esri-oriented-imagery-viewer__body-current-coverage{--calcite-icon-color: var(--calcite-color-status-danger)}.esri-oriented-imagery-viewer__body-additional-camera-locations{--calcite-icon-color: var(--calcite-color-brand)}.esri-oriented-imagery-viewer__body-additional-coverage{--calcite-icon-color: var(--calcite-color-status-info)}.esri-oriented-imagery-viewer__body-footprint{--calcite-icon-color: var(--calcite-color-status-success)}.esri-oriented-imagery-viewer__carousel{z-index:1;border:1px solid var(--calcite-color-border-2);align-items:center;width:98%;height:140px;margin:auto 1% 0;position:absolute;bottom:0;box-shadow:0 0 1px #0000004d}.esri-oriented-imagery-viewer__carousel-container{height:auto;display:inline-block;overflow:auto hidden}.esri-oriented-imagery-viewer__carousel header{--calcite-font-weight-medium: $font-weight--light;--calcite-font-size-0: $font-size--tiny}.esri-oriented-imagery-viewer__carousel-item{width:100px;height:70px}.esri-oriented-imagery-viewer__carousel-item-wrapper{box-sizing:border-box;justify-content:center;align-items:center;width:106px;height:78px;margin:auto 10px;display:flex;box-shadow:0 1px 2px #0000004d}.esri-oriented-imagery-viewer__carousel-item-wrapper--selected{box-sizing:border-box;border:2px solid var(--calcite-color-brand);justify-content:center;align-items:center;width:106px;height:78px;margin:auto 10px;display:flex;box-shadow:0 1px 2px #0000004d}.esri-oriented-imagery-viewer__carousel-content{display:flex}.esri-oriented-imagery-viewer__close{background:var(--calcite-color-foreground-1);flex-direction:row;flex-grow:0;order:7;justify-content:center;align-items:center;width:48px;height:59px;display:flex}.esri-oriented-imagery-viewer__image-enhancement-wrapper{z-index:1;border:1px solid var(--calcite-color-border-2);align-items:center;width:98%;height:140px;margin:auto 1% 0;position:absolute;bottom:0;box-shadow:0 0 1px #0000004d}.esri-oriented-imagery-viewer__image-enhancement-tools{display:flex}.esri-oriented-imagery-viewer__image-enhancement-tool-container{width:50%;margin-block:2px;padding-inline:.75rem}.esri-oriented-imagery-viewer__image-overlays{z-index:1;margin:auto;border:1px solid var(--calcite-color-border-2);align-items:center;width:100%;position:absolute;bottom:0;overflow-y:auto;box-shadow:0 0 1px #0000004d}.esri-oriented-imagery-viewer__image-overlays-layer-list,.esri-oriented-imagery-viewer__image-overlays-switch{padding:0 var(--calcite-spacing-md)}.esri-oriented-imagery-viewer__image-overlays-container{height:auto;display:flex}.esri-oriented-imagery-viewer__image-overlays-no-result{z-index:1;border:1px solid var(--calcite-color-border-2);align-items:center;width:98%;height:auto;margin:auto 1% 0;position:absolute;bottom:0;overflow-y:auto;box-shadow:0 0 1px #0000004d}.esri-oriented-imagery-viewer__image-overlays-no-result-layer-list,.esri-oriented-imagery-viewer__image-overlays-no-result-switch{padding:0 var(--calcite-spacing-md)}.esri-oriented-imagery-viewer__image-overlays-increased-height{z-index:1;border:1px solid var(--calcite-color-border-2);align-items:center;width:98%;height:200px;margin:auto 1% 0;position:absolute;bottom:0;overflow-y:auto;box-shadow:0 0 1px #0000004d}.esri-oriented-imagery-viewer__image-overlays-increased-height-layer-list,.esri-oriented-imagery-viewer__image-overlays-increased-height-switch{padding:0 var(--calcite-spacing-md)}.esri-oriented-imagery-viewer__measurement-results{width:auto;height:fit-content}.esri-oriented-imagery-viewer__measurements-table{margin-block-start:var(--calcite-spacing-sm)}.esri-oriented-imagery-viewer__measurements-bar{flex-wrap:nowrap;display:flex}.esri-oriented-imagery-viewer__measurements-button{display:flex}.esri-oriented-imagery-viewer__measurement-display{text-align:center;margin-block-end:var(--calcite-spacing-xxs)}.esri-oriented-imagery-viewer__viewer{cursor:url(data:text/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20height%3D%2226%22%20width%3D%2226%22%3E%0A%3Cpath%20stroke%3D%22%23000%22%20stroke-width%3D%221px%22%20fill%3D%22%23fff%22%20d%3D%22m15.3%2020.5s6.38-6.73%204.64-8.24-3.47%201.01-3.47%201.01%203.61-5.72%201.41-6.49c-2.2-0.769-3.33%204.36-3.33%204.36s0.873-5.76-1.06-5.76-1.58%205.39-1.58%205.39-0.574-4.59-2.18-4.12c-1.61%200.468-0.572%205.51-0.572%205.51s-1.58-4.89-2.93-3.79c-1.35%201.11%200.258%205.25%200.572%206.62%200.836%202.43%202.03%202.94%202.17%205.55%22%2F%3E%0A%3C%2Fsvg%3E%0A);flex-grow:1;width:100%;margin:0;display:flex}.esri-oriented-imagery-viewer__viewer--hidden{display:none}.esri-oriented-imagery-viewer__viewer-container{border-top:1px solid var(--calcite-color-border-3);background:var(--calcite-color-foreground-1);border-radius:0 0 3px 3px;flex:1 0 auto;order:1;align-self:stretch;width:100%;height:100%;display:flex}.esri-oriented-imagery-viewer__alert{inset-block-end:var(--calcite-spacing-md);inset-inline:var(--calcite-spacing-md);position:absolute}@keyframes rotateOrientedImageryNavigationTool{0%{transform:rotate(var(--oi-navigation-tool-rotation-from, 0deg))}to{transform:rotate(var(--oi-navigation-tool-rotation-to, 0deg))}}.esri-oriented-imagery-viewer__message-box{text-align:center;word-break:break-word;justify-content:center;align-items:center;width:100%;height:100%;padding:0 25%;font-size:var(--calcite-font-size-sm);display:flex;position:relative}.esri-oriented-imagery-viewer__navigation{transform:rotate(var(--oi-navigation-tool-rotation-to, 0deg))}.esri-oriented-imagery-viewer__navigation-animate{animation:.7s linear forwards rotateOrientedImageryNavigationTool}.esri-oriented-imagery-viewer__navigation-feature{fill:var(--calcite-color-brand);stroke:var(--calcite-color-foreground-1);stroke-width:1px}.esri-oriented-imagery-viewer__navigation-feature.selected{fill:var(--calcite-color-status-danger)}.esri-oriented-imagery-viewer__navigation-feature-path{pointer-events:none}.esri-oriented-imagery-viewer__navigation-feature-path-stop-offset-0{stop-color:var(--calcite-color-status-danger);stop-opacity:.4}.esri-oriented-imagery-viewer__navigation-feature-path-stop-offset-1{stop-color:var(--calcite-color-status-danger);stop-opacity:.2}.esri-oriented-imagery-viewer__navigation-pointer{fill:var(--calcite-color-foreground-1);fill-rule:evenodd;stroke:#0000;stroke-dasharray:none;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-width:0}.esri-oriented-imagery-viewer__navigation-pointer-north{fill:var(--calcite-color-status-danger)}.esri-oriented-imagery-viewer__navigation-wrapper{z-index:1;position:absolute;bottom:0;right:0;overflow:hidden}.esri-oriented-imagery-viewer__navigation-wrapper--zoomed{transform-origin:100% 100%;transform:scale(1.5)}.esri-oriented-imagery-viewer__navigation-wrapper-boundary{fill:var(--calcite-color-foreground-1);fill-opacity:.25;stroke:var(--calcite-color-border-2)}.esri-oriented-imagery-viewer__navigation-sector{fill:none}.esri-oriented-imagery-viewer__navigation-sector-separator{stroke:var(--calcite-color-border-2);stroke-width:1px}.esri-oriented-imagery-viewer__navigation-sector-cross{stroke:var(--calcite-color-status-danger);stroke-width:1px}.esri-oriented-imagery-viewer__navigation-sector-enabled{fill:var(--calcite-color-foreground-1);stroke:var(--calcite-color-border-2);stroke-width:1px}.esri-oriented-imagery-viewer__navigation-sector-disabled{fill:var(--calcite-color-foreground-3);stroke:var(--calcite-color-border-2);stroke-width:1px}.esri-oriented-imagery-viewer__navigation-sector-outer{fill:var(--calcite-color-foreground-1);fill-opacity:.4;stroke:none}.esri-oriented-imagery-viewer__pro .esri-oriented-imagery-viewer{width:100%;max-width:unset;height:100%;max-height:unset;position:static}.esri-oriented-imagery-viewer__sketch-tools{justify-content:center;align-items:center;width:100%;display:flex;position:absolute;bottom:0}.esri-oriented-imagery-viewer__navigation-ui{box-sizing:border-box;inset-block-end:var(--calcite-spacing-md);inset-inline:var(--calcite-spacing-md);transform-style:preserve-3d;z-index:var(--calcite-z-index-overlay);pointer-events:none;flex-direction:column;align-items:center;display:flex;position:absolute;overflow:hidden}.esri-oriented-imagery-viewer__navigation-ui__direction{--esri-oriented-imagery-viewer__navigation-ui-direction-color: wheat;--calcite-icon-color: var(--esri-oriented-imagery-viewer__navigation-ui-direction-color);cursor:not-allowed;width:160px;height:160px;position:absolute}.esri-oriented-imagery-viewer__navigation-ui__direction:not([disabled]){cursor:pointer;pointer-events:auto}.esri-oriented-imagery-viewer__navigation-ui__direction:not([disabled]):hover{--calcite-icon-color: var(--calcite-color-brand);background-color:rgba(var(--calcite-color-brand),var(--calcite-opacity-half));border-radius:50%}.esri-oriented-imagery-viewer__navigation-ui__direction-pad{box-sizing:border-box;transform:perspective(400px) rotateX(60deg) var(--rotate-transform);filter:drop-shadow(0 2px 1px #00000080);width:330px;height:330px}.esri-oriented-imagery-viewer__navigation-ui__direction--top{transform-style:preserve-3d;top:0;left:50%;transform:translate(-50%)}.esri-oriented-imagery-viewer__navigation-ui__direction--bottom{transform-style:preserve-3d;bottom:0;left:50%;transform:translate(-50%)}.esri-oriented-imagery-viewer__navigation-ui__direction--left{transform-style:preserve-3d;top:50%;left:0;transform:translateY(-50%)}.esri-oriented-imagery-viewer__navigation-ui__direction--right{transform-style:preserve-3d;top:50%;right:0;transform:translateY(-50%)}.esri-panoramic-viewer{z-index:1;position:relative;width:100%;height:100%}`, m = d(a);
-class v extends n {
+import { s as g } from "../../chunks/esri-main.js";
+import { u as c } from "../../chunks/useLayerById.js";
+const m = l`.esri-imagery-viewer{width:100%;height:100%}.esri-oriented-imagery-viewer{--esri-oriented-imagery-viewer-action-icon-size: 8px;--esri-oriented-imagery-viewer-min-width: 288px;--esri-oriented-imagery-viewer-min-height: 348px;--calcite-dialog-size-x: 210px;--calcite-dialog-min-size-y: 90px;--calcite-icon-size: var(--esri-oriented-imagery-viewer-action-icon-size);box-sizing:border-box;z-index:1;width:100%;min-width:var(--esri-oriented-imagery-viewer-min-width);height:100%;min-height:var(--esri-oriented-imagery-viewer-min-height);flex-direction:column;align-items:flex-start;display:flex;overflow:hidden}.esri-oriented-imagery-viewer:has(.esri-widget .esri-oriented-imagery-viewer__image-overlays-no-result){--esri-oriented-imagery-viewer-min-height: 420px}.esri-oriented-imagery-viewer__body{flex-direction:column;flex:1 0 auto;order:1;align-self:stretch;height:100%;display:flex}.esri-oriented-imagery-viewer__body-current-coverage{--calcite-icon-color: var(--calcite-color-status-danger)}.esri-oriented-imagery-viewer__body-additional-camera-locations{--calcite-icon-color: var(--calcite-color-brand)}.esri-oriented-imagery-viewer__body-additional-coverage{--calcite-icon-color: var(--calcite-color-status-info)}.esri-oriented-imagery-viewer__body-footprint{--calcite-icon-color: var(--calcite-color-status-success)}.esri-oriented-imagery-viewer__carousel{z-index:1;border:1px solid var(--calcite-color-border-2);align-items:center;width:98%;height:140px;margin:auto 1% 0;position:absolute;bottom:0;box-shadow:0 0 1px #0000004d}.esri-oriented-imagery-viewer__carousel-container{height:auto;display:inline-block;overflow:auto hidden}.esri-oriented-imagery-viewer__carousel header{--calcite-font-weight-medium: $font-weight--light;--calcite-font-size-0: $font-size--tiny}.esri-oriented-imagery-viewer__carousel-item{width:100px;height:70px}.esri-oriented-imagery-viewer__carousel-item-wrapper{box-sizing:border-box;justify-content:center;align-items:center;width:106px;height:78px;margin:auto 10px;display:flex;box-shadow:0 1px 2px #0000004d}.esri-oriented-imagery-viewer__carousel-item-wrapper--selected{box-sizing:border-box;border:2px solid var(--calcite-color-brand);justify-content:center;align-items:center;width:106px;height:78px;margin:auto 10px;display:flex;box-shadow:0 1px 2px #0000004d}.esri-oriented-imagery-viewer__carousel-content{display:flex}.esri-oriented-imagery-viewer__close{background:var(--calcite-color-foreground-1);flex-direction:row;flex-grow:0;order:7;justify-content:center;align-items:center;width:48px;height:59px;display:flex}.esri-oriented-imagery-viewer__image-enhancement-wrapper{z-index:1;border:1px solid var(--calcite-color-border-2);align-items:center;width:98%;height:140px;margin:auto 1% 0;position:absolute;bottom:0;box-shadow:0 0 1px #0000004d}.esri-oriented-imagery-viewer__image-enhancement-tools{display:flex}.esri-oriented-imagery-viewer__image-enhancement-tool-container{width:50%;margin-block:2px;padding-inline:.75rem}.esri-oriented-imagery-viewer__image-overlays{z-index:1;margin:auto;border:1px solid var(--calcite-color-border-2);align-items:center;width:100%;position:absolute;bottom:0;overflow-y:auto;box-shadow:0 0 1px #0000004d}.esri-oriented-imagery-viewer__image-overlays-layer-list,.esri-oriented-imagery-viewer__image-overlays-switch{padding:0 var(--calcite-spacing-md)}.esri-oriented-imagery-viewer__image-overlays-container{height:auto;display:flex}.esri-oriented-imagery-viewer__image-overlays-no-result{z-index:1;border:1px solid var(--calcite-color-border-2);align-items:center;width:98%;height:auto;margin:auto 1% 0;position:absolute;bottom:0;overflow-y:auto;box-shadow:0 0 1px #0000004d}.esri-oriented-imagery-viewer__image-overlays-no-result-layer-list,.esri-oriented-imagery-viewer__image-overlays-no-result-switch{padding:0 var(--calcite-spacing-md)}.esri-oriented-imagery-viewer__image-overlays-increased-height{z-index:1;border:1px solid var(--calcite-color-border-2);align-items:center;width:98%;height:200px;margin:auto 1% 0;position:absolute;bottom:0;overflow-y:auto;box-shadow:0 0 1px #0000004d}.esri-oriented-imagery-viewer__image-overlays-increased-height-layer-list,.esri-oriented-imagery-viewer__image-overlays-increased-height-switch{padding:0 var(--calcite-spacing-md)}.esri-oriented-imagery-viewer__measurement-results{width:auto;height:fit-content}.esri-oriented-imagery-viewer__measurements-table{margin-block-start:var(--calcite-spacing-sm)}.esri-oriented-imagery-viewer__measurements-bar{flex-wrap:nowrap;display:flex}.esri-oriented-imagery-viewer__measurements-button{display:flex}.esri-oriented-imagery-viewer__measurement-display{text-align:center;margin-block-end:var(--calcite-spacing-xxs)}.esri-oriented-imagery-viewer__viewer{cursor:url(data:text/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20height%3D%2226%22%20width%3D%2226%22%3E%0A%3Cpath%20stroke%3D%22%23000%22%20stroke-width%3D%221px%22%20fill%3D%22%23fff%22%20d%3D%22m15.3%2020.5s6.38-6.73%204.64-8.24-3.47%201.01-3.47%201.01%203.61-5.72%201.41-6.49c-2.2-0.769-3.33%204.36-3.33%204.36s0.873-5.76-1.06-5.76-1.58%205.39-1.58%205.39-0.574-4.59-2.18-4.12c-1.61%200.468-0.572%205.51-0.572%205.51s-1.58-4.89-2.93-3.79c-1.35%201.11%200.258%205.25%200.572%206.62%200.836%202.43%202.03%202.94%202.17%205.55%22%2F%3E%0A%3C%2Fsvg%3E%0A);flex-grow:1;width:100%;margin:0;display:flex}.esri-oriented-imagery-viewer__viewer--hidden{display:none}.esri-oriented-imagery-viewer__viewer-container{border-top:1px solid var(--calcite-color-border-3);background:var(--calcite-color-foreground-1);border-radius:0 0 3px 3px;flex:1 0 auto;order:1;align-self:stretch;width:100%;height:100%;display:flex}.esri-oriented-imagery-viewer__alert{inset-block-end:var(--calcite-spacing-md);inset-inline:var(--calcite-spacing-md);position:absolute}@keyframes rotateOrientedImageryNavigationTool{0%{transform:rotate(var(--oi-navigation-tool-rotation-from, 0deg))}to{transform:rotate(var(--oi-navigation-tool-rotation-to, 0deg))}}.esri-oriented-imagery-viewer__message-box{text-align:center;word-break:break-word;justify-content:center;align-items:center;width:100%;height:100%;padding:0 25%;font-size:var(--calcite-font-size-sm);display:flex;position:relative}.esri-oriented-imagery-viewer__navigation{transform:rotate(var(--oi-navigation-tool-rotation-to, 0deg))}.esri-oriented-imagery-viewer__navigation-animate{animation:.7s linear forwards rotateOrientedImageryNavigationTool}.esri-oriented-imagery-viewer__navigation-feature{fill:var(--calcite-color-brand);stroke:var(--calcite-color-foreground-1);stroke-width:1px}.esri-oriented-imagery-viewer__navigation-feature.selected{fill:var(--calcite-color-status-danger)}.esri-oriented-imagery-viewer__navigation-feature-path{pointer-events:none}.esri-oriented-imagery-viewer__navigation-feature-path-stop-offset-0{stop-color:var(--calcite-color-status-danger);stop-opacity:.4}.esri-oriented-imagery-viewer__navigation-feature-path-stop-offset-1{stop-color:var(--calcite-color-status-danger);stop-opacity:.2}.esri-oriented-imagery-viewer__navigation-pointer{fill:var(--calcite-color-foreground-1);fill-rule:evenodd;stroke:#0000;stroke-dasharray:none;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-width:0}.esri-oriented-imagery-viewer__navigation-pointer-north{fill:var(--calcite-color-status-danger)}.esri-oriented-imagery-viewer__navigation-wrapper{z-index:1;position:absolute;bottom:0;right:0;overflow:hidden}.esri-oriented-imagery-viewer__navigation-wrapper--zoomed{transform-origin:100% 100%;transform:scale(1.5)}.esri-oriented-imagery-viewer__navigation-wrapper-boundary{fill:var(--calcite-color-foreground-1);fill-opacity:.25;stroke:var(--calcite-color-border-2)}.esri-oriented-imagery-viewer__navigation-sector{fill:none}.esri-oriented-imagery-viewer__navigation-sector-separator{stroke:var(--calcite-color-border-2);stroke-width:1px}.esri-oriented-imagery-viewer__navigation-sector-cross{stroke:var(--calcite-color-status-danger);stroke-width:1px}.esri-oriented-imagery-viewer__navigation-sector-enabled{fill:var(--calcite-color-foreground-1);stroke:var(--calcite-color-border-2);stroke-width:1px}.esri-oriented-imagery-viewer__navigation-sector-disabled{fill:var(--calcite-color-foreground-3);stroke:var(--calcite-color-border-2);stroke-width:1px}.esri-oriented-imagery-viewer__navigation-sector-outer{fill:var(--calcite-color-foreground-1);fill-opacity:.4;stroke:none}.esri-oriented-imagery-viewer__pro .esri-oriented-imagery-viewer{width:100%;max-width:unset;height:100%;max-height:unset;position:static}.esri-oriented-imagery-viewer__sketch-tools{justify-content:center;align-items:center;width:100%;display:flex;position:absolute;bottom:0}.esri-oriented-imagery-viewer__navigation-ui{box-sizing:border-box;inset-block-end:var(--calcite-spacing-md);inset-inline:var(--calcite-spacing-md);transform-style:preserve-3d;z-index:var(--calcite-z-index-overlay);pointer-events:none;flex-direction:column;align-items:center;display:flex;position:absolute;overflow:hidden}.esri-oriented-imagery-viewer__navigation-ui__direction{--esri-oriented-imagery-viewer__navigation-ui-direction-color: wheat;--calcite-icon-color: var(--esri-oriented-imagery-viewer__navigation-ui-direction-color);cursor:not-allowed;width:160px;height:160px;position:absolute}.esri-oriented-imagery-viewer__navigation-ui__direction:not([disabled]){cursor:pointer;pointer-events:auto}.esri-oriented-imagery-viewer__navigation-ui__direction:not([disabled]):hover{--calcite-icon-color: var(--calcite-color-brand);background-color:rgba(var(--calcite-color-brand),var(--calcite-opacity-half));border-radius:50%}.esri-oriented-imagery-viewer__navigation-ui__direction-pad{box-sizing:border-box;transform:perspective(400px) rotateX(60deg) var(--rotate-transform);filter:drop-shadow(0 2px 1px #00000080);width:330px;height:330px}.esri-oriented-imagery-viewer__navigation-ui__direction--top{transform-style:preserve-3d;top:0;left:50%;transform:translate(-50%)}.esri-oriented-imagery-viewer__navigation-ui__direction--bottom{transform-style:preserve-3d;bottom:0;left:50%;transform:translate(-50%)}.esri-oriented-imagery-viewer__navigation-ui__direction--left{transform-style:preserve-3d;top:50%;left:0;transform:translateY(-50%)}.esri-oriented-imagery-viewer__navigation-ui__direction--right{transform-style:preserve-3d;top:50%;right:0;transform:translateY(-50%)}.esri-panoramic-viewer{z-index:1;position:relative;width:100%;height:100%}`, v = d(o);
+class h extends n {
   constructor() {
-    super(...arguments), this.widget = m(this), this._hasOrientedImageryLayerToAdd = !1, this.viewModel = this.widget.viewModel, this.view = this.widget.view, this.autoDestroyDisabled = !1, this.currentCoverageVisible = this.widget.currentCoverageVisible, this.dataCaptureEnabled = this.widget.dataCaptureEnabled, this.disabled = this.widget.disabled, this.galleryOpened = this.widget.galleryOpened, this.icon = this.widget.icon, this.imageEnhancementToolActive = this.widget.imageEnhancementToolActive, this.imageGalleryEnabled = this.widget.imageGalleryEnabled, this.imageOverlaysOpened = this.widget.imageOverlaysOpened, this.isAdditionalCoverageVisible = this.widget.isAdditionalCoverageVisible, this.isAdditionalPointSourcesVisible = this.widget.isAdditionalPointSourcesVisible, this.label = this.widget.label, this.layer = this.widget.layer, this.mapImageConversionToolState = this.widget.mapImageConversionToolState, this.navigationToolActive = this.widget.navigationToolActive, this.referencePoint = this.widget.referencePoint, this.arcgisPropertyChange = t()("imageGalleryEnabled", "layer"), this.arcgisReady = s();
+    super(...arguments), this.widget = v(this), this._hasOrientedImageryLayerToAdd = !1, this.viewModel = this.widget.viewModel, this.view = this.widget.view, this.autoDestroyDisabled = !1, this.currentCoverageVisible = this.widget.currentCoverageVisible, this.dataCaptureEnabled = this.widget.dataCaptureEnabled, this.disabled = this.widget.disabled, this.galleryOpened = this.widget.galleryOpened, this.hideHeader = this.widget.visibleElements.header, this.hideMenu = this.widget.visibleElements.menu, this.icon = this.widget.icon, this.imageEnhancementToolActive = this.widget.imageEnhancementToolActive, this.imageGalleryEnabled = this.widget.imageGalleryEnabled, this.imageOverlaysOpened = this.widget.imageOverlaysOpened, this.isAdditionalCoverageVisible = this.widget.isAdditionalCoverageVisible, this.isAdditionalPointSourcesVisible = this.widget.isAdditionalPointSourcesVisible, this.label = this.widget.label, this.layer = this.widget.layer, this.layerId = c(this, (e) => {
+      e && (this.layer = e);
+    }), this.mapImageConversionToolState = this.widget.mapImageConversionToolState, this.navigationToolActive = this.widget.navigationToolActive, this.preloadMedia = this.widget.preloadMedia, this.referencePoint = this.widget.referencePoint, this.arcgisPropertyChange = t()("imageGalleryEnabled", "layer"), this.arcgisReady = s();
   }
   static {
-    this.properties = { view: 0, autoDestroyDisabled: 5, currentCoverageVisible: 5, dataCaptureEnabled: 5, disabled: 5, galleryOpened: 5, icon: 1, imageEnhancementToolActive: 5, imageGalleryEnabled: 36, imageOverlaysOpened: 5, isAdditionalCoverageVisible: 5, isAdditionalPointSourcesVisible: 5, label: 1, layer: 0, mapImageConversionToolState: 5, navigationToolActive: 5, orientedImageryLayerItemId: 1, referenceElement: 1, referencePoint: 32 };
+    this.properties = { view: 0, autoDestroyDisabled: 5, currentCoverageVisible: 5, dataCaptureEnabled: 5, disabled: 5, galleryOpened: 5, hideHeader: 5, hideMenu: 5, icon: 1, imageEnhancementToolActive: 5, imageGalleryEnabled: 36, imageOverlaysOpened: 5, isAdditionalCoverageVisible: 5, isAdditionalPointSourcesVisible: 5, label: 1, layer: 0, layerId: 1, mapImageConversionToolState: 5, navigationToolActive: 5, orientedImageryLayerItemId: 1, preloadMedia: 5, referenceElement: 1, referencePoint: 32 };
   }
   static {
-    this.styles = [c, g];
+    this.styles = [g, m];
   }
   async destroy() {
     await this.manager.destroy();
   }
+  async loadBestImage(e, i) {
+    return await this.widget.loadBestImage(e, i);
+  }
   willUpdate(e) {
     if (e.has("orientedImageryLayerItemId")) {
       const i = this.orientedImageryLayerItemId;
-      i && this.widget && (this.layer = new o({ portalItem: { id: i } }), this.widget.view ? this.widget.view.map?.add(this.layer) : this._hasOrientedImageryLayerToAdd = !0);
+      i && this.widget && (this.layer = new a({ portalItem: { id: i } }), this.widget.view ? this.widget.view.map?.add(this.layer) : this._hasOrientedImageryLayerToAdd = !0);
     }
   }
   loaded() {
@@ -37,7 +43,7 @@ class v extends n {
     e && (this.widget.view?.map?.add(e), this._hasOrientedImageryLayerToAdd = !1);
   }
 }
-r("arcgis-oriented-imagery-viewer", v);
+r("arcgis-oriented-imagery-viewer", h);
 export {
-  v as ArcgisOrientedImageryViewer
+  h as ArcgisOrientedImageryViewer
 };

package/dist/components/arcgis-oriented-imagery-viewer-image-viewer/customElement.d.ts

@@ -0,0 +1,41 @@
+/// <reference path="../../index.d.ts" />
+import type NonPanoramicMedia from "./support/NonPanoramicMedia.js";
+import type Graphic from "@arcgis/core/Graphic.js";
+import type { PublicLitElement as LitElement } from "@arcgis/lumina";
+import type { NonPanoramicMediaProperties } from "./support/NonPanoramicMedia.js";
+import type { T9nMeta } from "@arcgis/lumina/controllers";
+
+/** @internal */
+export abstract class ArcgisOrientedImageryViewerImageViewer extends LitElement {
+  /** @internal */
+  protected _messages: Partial<{ title: string; }> & T9nMeta<{ title: string; }>;
+  /** @default false */
+  accessor hideHeader: boolean;
+  /** @default false */
+  accessor hideLoader: boolean;
+  /** @default false */
+  accessor hideZoomControls: boolean;
+  get media(): NonPanoramicMediaProperties | undefined;
+  set media(value: NonPanoramicMedia | NonPanoramicMediaProperties | undefined);
+  /**
+   * Replace localized message strings with your own strings.
+   *
+   * _**Note**: Individual message keys may change between releases._
+   */
+  accessor messageOverrides: { title?: string | undefined; };
+  /** @default 0 */
+  accessor rotation: number;
+  /** @param graphic */
+  addGraphic(graphic: Graphic): void;
+  /** @param graphics */
+  addGraphics(graphics: Graphic[]): void;
+  clearGraphics(): void;
+  mediaOnLoad(): Promise<NonPanoramicMedia | undefined>;
+  /** @param graphic */
+  removeGraphic(graphic: Graphic): void;
+  /** @param graphics */
+  removeGraphics(graphics: Graphic[]): void;
+  "@setterTypes": {
+    media?: NonPanoramicMedia | NonPanoramicMediaProperties | undefined;
+  };
+}