@arcgis/map-components 5.2.0-next.99 → 6.0.0-next.0

package/dist/components/arcgis-building-phase-picker/customElement.js

@@ -1,16 +1,16 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
 import { c as l } from "../../chunks/runtime.js";
 import { css as h, html as a } from "lit";
-import { keyed as o } from "lit/directives/keyed.js";
+import { keyed as c } from "lit/directives/keyed.js";
 import { LitElement as d, createEvent as u, safeClassMap as s, nothing as p } from "@arcgis/lumina";
-import { d as v } from "../../chunks/constants.js";
-import { clamp as m } from "@arcgis/toolkit/number";
-import { useDirection as g } from "@arcgis/lumina/controllers";
-import { when as f, watch as b } from "@arcgis/core/core/reactiveUtils.js";
-const w = h`:host{--num-phases: 7;--container-width: 100cqw;--phase-size: 24px;--arrow-width: 16px;--padding: var(--calcite-spacing-xxs);--divider-width-min: var(--calcite-spacing-base);--divider-width-max: var(--calcite-spacing-xl);--divider-width: calc( (var(--container-width) - (var(--phase-size) * var(--num-phases)) - (var(--arrow-width) * 2) - (var(--padding) * 2) ) / (var(--num-phases) - 1) );container-type:inline-size}.phase-picker,.phases-container{display:flex;flex-direction:row;align-items:center}.phases-container{position:relative;flex-shrink:1;padding:var(--calcite-spacing-xxs);overflow:hidden}.phase-button{appearance:none;display:flex;flex-shrink:0;align-items:center;justify-content:center;border:solid var(--calcite-border-width-sm) var(--calcite-color-border-2);border-radius:var(--calcite-corner-radius-pill);background:var(--calcite-color-background);cursor:pointer;padding:1px 0 0;width:var(--phase-size);height:var(--phase-size);color:var(--calcite-color-text-1);font-family:var(--calcite-sans-family);font-size:var(--calcite-font-size);font-weight:var(--calcite-font-weight-regular)}.phase-button:hover{border-width:var(--calcite-border-width-md);border-color:var(--calcite-color-brand)}.phase-button:focus-visible{outline:var(--calcite-border-width-md) solid var(--calcite-color-brand);outline-offset:var(--calcite-border-width-md)}.phase-button.active{border-color:var(--calcite-color-brand);background-color:var(--calcite-foreground-1)}.phase-button.current{background-color:var(--calcite-color-brand);color:var(--calcite-color-text-inverse)}.arrow-left,.arrow-right{--calcite-internal-action-padding-inline: 0;width:var(--arrow-width);min-width:var(--arrow-width)}.divider{flex:0;background:var(--calcite-color-border-1);min-width:clamp(var(--divider-width-min),var(--divider-width),var(--divider-width-max));height:var(--calcite-border-width-sm)}.divider.active{background-color:var(--calcite-color-brand)}`;
+import { d as g } from "../../chunks/constants.js";
+import { clamp as v } from "@arcgis/toolkit/number";
+import { useDirection as b } from "@arcgis/lumina/controllers";
+import { when as m, watch as f } from "@arcgis/core/core/reactiveUtils.js";
+const w = h`:host{--num-phases: 7;--container-width: 100cqw;--phase-size: 24px;--arrow-width: var(--calcite-size-md);--padding: var(--calcite-spacing-xxs);--divider-width-min: var(--calcite-spacing-base);--divider-width-max: var(--calcite-spacing-xl);--divider-width: calc( (var(--container-width) - (var(--phase-size) * var(--num-phases)) - (var(--arrow-width) * 2) - (var(--padding) * 2) ) / (var(--num-phases) - 1) );container-type:inline-size}.phase-picker,.phases-container{display:flex;flex-direction:row;align-items:center}.phases-container{position:relative;flex-shrink:1;padding:var(--calcite-spacing-xxs);overflow:hidden}.phase-button{appearance:none;display:flex;flex-shrink:0;align-items:center;justify-content:center;border:solid var(--calcite-border-width-sm) var(--calcite-color-border-2);border-radius:var(--calcite-corner-radius-pill);background:var(--arcgis-internal-building-explorer-button-background-color, var(--calcite-color-background));cursor:pointer;padding:1px 0 0;width:var(--phase-size);height:var(--phase-size);color:var(--arcgis-internal-building-explorer-button-text-color);font-family:var(--calcite-sans-family);font-size:var(--calcite-font-size);font-weight:var(--calcite-font-weight-regular)}.phase-button:hover{border-width:var(--calcite-border-width-md);border-color:var(--calcite-color-brand)}.phase-button:focus-visible{outline:var(--calcite-border-width-md) solid var(--calcite-color-brand);outline-offset:var(--calcite-border-width-md)}.phase-button.active{border-color:var(--calcite-color-brand);background-color:var(--arcgis-internal-building-explorer-button-background-color, var(--calcite-color-transparent))}.phase-button.current{border-color:var(--arcgis-internal-building-explorer-selected-button-background-color);background-color:var(--arcgis-internal-building-explorer-selected-button-background-color);color:var(--arcgis-internal-building-explorer-selected-button-text-color)}.arrow-left,.arrow-right{flex-shrink:0;inline-size:var(--arrow-width)}.divider{flex:0;background:var(--calcite-color-border-1);min-width:clamp(var(--divider-width-min),var(--divider-width),var(--divider-width-max));height:var(--calcite-border-width-sm)}.divider.active{background-color:var(--calcite-color-brand)}`;
 class x extends d {
   constructor() {
-    super(...arguments), this.#i = g(), this.#e = !0, this.#t = !1, this.arcgisBuildingPhaseChange = u({ bubbles: !0, composed: !0 });
+    super(...arguments), this.#i = b(), this.#e = !0, this.#t = !1, this.arcgisBuildingPhaseChange = u({ bubbles: !0, composed: !0 });
   }
   static {
     this.properties = { messages: 0, phase: 0, numberOfPhases: 32, phaseHeight: 32 };
@@ -28,8 +28,8 @@ class x extends d {
     return this.phases.length;
   }
   get phaseHeight() {
-    const e = v, r = e * 2 / Math.sqrt(this.numberOfPhases);
-    return Math.round(m(r, 2, e));
+    const e = g, r = e * 2 / Math.sqrt(this.numberOfPhases);
+    return Math.round(v(r, 2, e));
   }
   loaded() {
     this.listen("keydown", (e) => {
@@ -44,16 +44,19 @@ class x extends d {
           break;
       }
     }), this.manager.onLifecycle(() => [
-      f(() => this.phase?.state === "ready", () => {
+      m(() => this.phase?.state === "ready", () => {
         requestAnimationFrame(() => {
           this.#e = !0, this.#r();
         });
       }, { initial: !0 }),
-      b(() => this.phase?.value, () => {
-        this.#e = !0, this.#r();
+      f(() => this.phase?.value, () => {
+        this.#e = !0, this.requestUpdate();
       })
     ]);
   }
+  updated() {
+    this.#r();
+  }
   #r() {
     const e = this.renderRoot.querySelector("button.current");
     e && (this.#e && (e.scrollIntoView({ block: "nearest", inline: "center" }), this.#e = !1), this.#t && (e.focus(), this.#t = !1));
@@ -64,25 +67,25 @@ class x extends d {
   #s() {
     this.phase && (this.phase.previous(), this.arcgisBuildingPhaseChange.emit());
   }
-  #c(e) {
+  #o(e) {
     this.phase != null && this.phase?.value !== e && (this.phase?.select(e), this.arcgisBuildingPhaseChange.emit());
   }
   render() {
     const e = this.phase, r = this.messages;
-    return !r || e == null ? null : a`<div class="phase-picker">${c({ className: "arrow-left", disabled: !1, icon: this.#i === "rtl" ? "chevron-right" : "chevron-left", onClick: () => this.#s(), text: r.previousPhase })}<div class="phases-container">${this.phases.map((i, n) => a`${n > 0 && a`<span class=${s({
+    return !r || e == null ? null : a`<div class="phase-picker">${o({ className: "arrow-left", disabled: this.phases.length === 0 || !e.hasPrevious, icon: this.#i === "rtl" ? "chevron-right" : "chevron-left", onClick: () => this.#s(), text: r.previousPhase })}<div class="phases-container">${this.phases.map((i, n) => a`${n > 0 && a`<span class=${s({
       divider: !0,
       active: e.value >= i
-    })}></span>` || ""}${o(i, a`<button class=${s({
+    })}></span>` || ""}${c(i, a`<button class=${s({
       "phase-button": !0,
       active: e.value >= i,
       current: e.value === i
     })} @click=${() => {
-      this.#c(i);
-    }}>${i}</button>`)}`)}</div>${c({ className: "arrow-right", disabled: !1, icon: this.#i === "rtl" ? "chevron-left" : "chevron-right", onClick: () => this.#a(), text: r.nextPhase })}</div>`;
+      this.#o(i);
+    }}>${i}</button>`)}`)}</div>${o({ className: "arrow-right", disabled: this.phases.length === 0 || !e.hasNext, icon: this.#i === "rtl" ? "chevron-left" : "chevron-right", onClick: () => this.#a(), text: r.nextPhase })}</div>`;
   }
 }
-function c(t) {
-  return o(t.className, a`<calcite-action class=${s(t.className)} .disabled=${t.disabled} .icon=${t.icon} icon-flip-rtl @click=${t.onClick} scale=s .text=${t.text} title=${t.text ?? p}></calcite-action>`);
+function o(t) {
+  return c(t.className, a`<calcite-action class=${s(t.className)} .disabled=${t.disabled} .icon=${t.icon} icon-flip-rtl @click=${t.onClick} .text=${t.text} title=${t.text ?? p}></calcite-action>`);
 }
 l("arcgis-building-phase-picker", x);
 export {

package/dist/components/arcgis-catalog-layer-list/customElement.d.ts

@@ -296,7 +296,7 @@ export abstract class ArcgisCatalogLayerList extends LitElement {
    */
   accessor showErrors: boolean;
   /**
-   * Indicates whether to display a filter input box when then number of list items is equal to or greater than the value set in [CatalogLayerList#minFilterItems](https://developers.arcgis.com/javascript/latest/references/core/widgets/CatalogLayerList/#minFilterItems), allowing users to filter layers by their title.
+   * Indicates whether to display a filter input box when the number of list items is equal to or greater than the value set in [CatalogLayerList#minFilterItems](https://developers.arcgis.com/javascript/latest/references/core/widgets/CatalogLayerList/#minFilterItems), allowing users to filter layers by their title.
    *
    * @default false
    * @since 5.0
@@ -355,7 +355,7 @@ export abstract class ArcgisCatalogLayerList extends LitElement {
   readonly arcgisClose: import("@arcgis/lumina").TargetedEvent<this, void>;
   /** Emitted when the value of a property is changed. Use this to listen to changes to properties. */
   readonly arcgisPropertyChange: import("@arcgis/lumina").TargetedEvent<this, { name: "state"; }>;
-  /** Emitted when the component associated with a map or scene view is ready to be interacted with. */
+  /** Emitted when the component associated with a map or scene view is ready for user interaction. */
   readonly arcgisReady: import("@arcgis/lumina").TargetedEvent<this, void>;
   /** Emitted when an action is triggered on the component. */
   readonly arcgisTriggerAction: import("@arcgis/lumina").TargetedEvent<this, LayerListViewModelTriggerActionEvent>;

package/dist/components/arcgis-catalog-layer-list/customElement.js

@@ -1,7 +1,7 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
 import { c as e } from "../../chunks/runtime.js";
 import { usePropertyChange as i } from "@arcgis/lumina/controllers";
-import { reEmitEvent as t } from "@arcgis/lumina/controllers/accessor";
+import { reEmitEvent as t } from "@arcgis/lumina-toolkit/reEmitEvent";
 import r from "@arcgis/core/widgets/CatalogLayerList.js";
 import { LitElement as a, createEvent as o } from "@arcgis/lumina";
 import { m as s } from "../../chunks/useWidget.js";

package/dist/components/arcgis-catalog-layer-list-next/customElement.d.ts

@@ -444,7 +444,7 @@ export abstract class ArcgisCatalogLayerListNext extends LitElement {
    */
   accessor selectionMode: "multiple" | "none" | "single-persist" | "single";
   /**
-   * This property provides the ability to show or hide the close button.
+   * This property provides the ability to show or hide the close button. When the close button is shown, the `ESC` key can be used to close the component via keyboard when the focus is within the component.
    *
    * @default false
    * @example
@@ -572,7 +572,7 @@ export abstract class ArcgisCatalogLayerListNext extends LitElement {
   readonly arcgisOpenedLayersChange: import("@arcgis/lumina").TargetedEvent<this, void>;
   /** Emitted when the value of a property is changed. Use this to listen to changes to properties. */
   readonly arcgisPropertyChange: import("@arcgis/lumina").TargetedEvent<this, { name: "state"; }>;
-  /** Emitted when the component associated with a map or scene view is ready to be interacted with. */
+  /** Emitted when the component associated with a map or scene view is ready for user interaction. */
   readonly arcgisReady: import("@arcgis/lumina").TargetedEvent<this, void>;
   /** Emitted when the collection of [selectedItems](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-catalog-layer-list-next/#selectedItems) changes. */
   readonly arcgisSelectedItemsChange: import("@arcgis/lumina").TargetedEvent<this, void>;

package/dist/components/arcgis-catalog-layer-list-next/customElement.js

@@ -10,7 +10,7 @@ import N from "@arcgis/core/layers/list/CatalogItemCollection.js";
 import x from "@arcgis/core/layers/list/Item.js";
 import { LitElement as D, createEvent as d, renderElement as M, safeClassMap as b, nothing as _ } from "@arcgis/lumina";
 import { usePropertyChange as k } from "@arcgis/lumina/controllers";
-import { reEmitEvent as B } from "@arcgis/lumina/controllers/accessor";
+import { reEmitEvent as B } from "@arcgis/lumina-toolkit/reEmitEvent";
 import { classes as S } from "@arcgis/toolkit/dom";
 import { generateGuid as G } from "@arcgis/toolkit/string";
 import { createRef as H, ref as g } from "lit/directives/ref.js";

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

@@ -48,7 +48,7 @@ export abstract class ArcgisClipboard extends LitElement {
    * > **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-clipboard component will be associated with a map or scene component rather than using the `view` property.
    */
   accessor view: MapView | SceneView | undefined;
-  /** Emitted when the component associated with a map or scene view is ready to be interacted with. */
+  /** Emitted when the component associated with a map or scene view is ready for user interaction. */
   readonly arcgisReady: import("@arcgis/lumina").TargetedEvent<this, void>;
   readonly "@eventTypes": {
     arcgisReady: ArcgisClipboard["arcgisReady"]["detail"];

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

@@ -105,7 +105,7 @@ export abstract class ArcgisCompass extends LitElement {
   reset(): Promise<void>;
   /** Emitted when the value of a property is changed. Use this to listen to changes to properties. */
   readonly arcgisPropertyChange: import("@arcgis/lumina").TargetedEvent<this, { name: "state" | "orientation"; }>;
-  /** Emitted when the component associated with a map or scene view is ready to be interacted with. */
+  /** Emitted when the component associated with a map or scene view is ready for user interaction. */
   readonly arcgisReady: import("@arcgis/lumina").TargetedEvent<this, void>;
   readonly "@eventTypes": {
     arcgisPropertyChange: ArcgisCompass["arcgisPropertyChange"]["detail"];

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

@@ -9,7 +9,7 @@ import { css as g, html as p } from "lit";
 import { u as v } from "../../chunks/useT9n.js";
 import { u as f } from "../../chunks/useView.js";
 import { g as w } from "../../chunks/globalCss.js";
-import { c as y } from "../../chunks/utils.js";
+import { c as y } from "../../chunks/utils6.js";
 import { c as s } from "../../chunks/goTo.js";
 const b = g`.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{calcite-button{width:var(--calcite-spacing-xxxl);height:var(--calcite-spacing-xxxl)}}:host([visual-scale="l"]){calcite-button{width:calc(var(--calcite-spacing-xxxl) + var(--calcite-spacing-md));height:calc(var(--calcite-spacing-xxxl) + var(--calcite-spacing-md))}}:host([visual-scale="s"]){calcite-button{width:var(--calcite-spacing-xxl);height:var(--calcite-spacing-xxl)}}.root{border-radius:50%;box-shadow:var(--arcgis-internal-box-shadow, none)}.icon-container{justify-content:center;display:flex;position:absolute;transform:translate(-50%,-50%)}.icon-container:dir(rtl){transform:translate(50%,-50%)}`;
 class x extends c {

package/dist/components/arcgis-coordinate-conversion/customElement.d.ts

@@ -395,7 +395,7 @@ export abstract class ArcgisCoordinateConversion extends LitElement {
   readonly arcgisConversionChange: import("@arcgis/lumina").TargetedEvent<this, void>;
   /** Emitted when the value of a property is changed. Use this to listen to changes to properties. */
   readonly arcgisPropertyChange: import("@arcgis/lumina").TargetedEvent<this, { name: "currentLocation" | "state" | "expanded" | "mode"; }>;
-  /** Emitted when the component associated with a map or scene view is ready to be interacted with. */
+  /** Emitted when the component associated with a map or scene view is ready for user interaction. */
   readonly arcgisReady: import("@arcgis/lumina").TargetedEvent<this, void>;
   readonly "@eventTypes": {
     arcgisConversionChange: ArcgisCoordinateConversion["arcgisConversionChange"]["detail"];

package/dist/components/arcgis-coordinate-conversion-next/customElement.d.ts

@@ -426,7 +426,7 @@ export abstract class ArcgisCoordinateConversionNext extends LitElement {
   readonly arcgisConversionChange: import("@arcgis/lumina").TargetedEvent<this, void>;
   /** Emitted when the value of a property is changed. Use this to listen to changes to properties. */
   readonly arcgisPropertyChange: import("@arcgis/lumina").TargetedEvent<this, { name: "currentLocation" | "state" | "mode" | "verticalUnit"; }>;
-  /** Emitted when the component associated with a map or scene view is ready to be interacted with. */
+  /** Emitted when the component associated with a map or scene view is ready for user interaction. */
   readonly arcgisReady: import("@arcgis/lumina").TargetedEvent<this, void>;
   readonly "@eventTypes": {
     arcgisConversionChange: ArcgisCoordinateConversionNext["arcgisConversionChange"]["detail"];

package/dist/components/arcgis-coordinate-conversion-next/customElement.js

@@ -296,7 +296,7 @@ class B extends S {
   }
   renderCoordinateInputView() {
     const { messages: e } = this, o = this.inputFormat ?? this.conversions.at(0)?.format, i = this.getId("coordinate-input"), t = this.renderConversionOptions(this.formats, o ?? void 0), r = n`<calcite-action .icon=${l.goTo} .label=${e.convertAndGoTo} @click=${() => this.processUserMouseInput(!0)} .scale=${this.visualScale} .text=${e.convertAndGoTo} title=${e.convertAndGoTo ?? c}></calcite-action>`;
-    return n`<calcite-block collapsible data-testid=input-block .disabled=${this.disabled} .heading=${e.input} .headingLevel=${this.headingLevel} .scale=${this.visualScale}><div class="input-form-group"><calcite-label .scale=${this.visualScale}>${e.inputFormat}<calcite-select aria-controls=${i ?? c} class="input-select" .label=${e.inputFormat} @calciteSelectChange=${this.setInputFormat} .scale=${this.visualScale}>${t}</calcite-select></calcite-label><calcite-label .scale=${this.visualScale}>${e.inputCoordTitle}<div class="go-to-input-holder"><calcite-input class="coordinate-input" data-format=${o ?? c} data-testid=coordinate-input id=${i ?? c} @keydown=${this.processUserKeyboardInput} .placeholder=${e.inputCoordTitle} required .scale=${this.visualScale} .status=${this.invalidInput ? "invalid" : "idle"} ${p(this._coordinateInput)}></calcite-input>${r}</div></calcite-label><calcite-button appearance=outline data-testid=convert-button kind=neutral @click=${() => this.processUserMouseInput(!1)} type=button .scale=${this.visualScale} width=auto>${e.convert}</calcite-button></div></calcite-block>`;
+    return n`<calcite-block expandable data-testid=input-block .disabled=${this.disabled} .heading=${e.input} .headingLevel=${this.headingLevel} .scale=${this.visualScale}><div class="input-form-group"><calcite-label .scale=${this.visualScale}>${e.inputFormat}<calcite-select aria-controls=${i ?? c} class="input-select" .label=${e.inputFormat} @calciteSelectChange=${this.setInputFormat} .scale=${this.visualScale}>${t}</calcite-select></calcite-label><calcite-label .scale=${this.visualScale}>${e.inputCoordTitle}<div class="go-to-input-holder"><calcite-input class="coordinate-input" data-format=${o ?? c} data-testid=coordinate-input id=${i ?? c} @keydown=${this.processUserKeyboardInput} .placeholder=${e.inputCoordTitle} required .scale=${this.visualScale} .status=${this.invalidInput ? "invalid" : "idle"} ${p(this._coordinateInput)}></calcite-input>${r}</div></calcite-label><calcite-button appearance=outline data-testid=convert-button kind=neutral @click=${() => this.processUserMouseInput(!1)} type=button .scale=${this.visualScale} width=auto>${e.convert}</calcite-button></div></calcite-block>`;
   }
   renderElevation() {
     const { messages: e } = this, o = this.displayedElevation ?? e.noElevation, i = this.renderElevationActions(), t = this.hideSettingsButton ? null : this.renderElevationSettingsDropdown();

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

@@ -331,7 +331,7 @@ export abstract class ArcgisDaylight extends LitElement {
   "@setterTypes": {
     localDate?: Date | number | string;
   };
-  /** Emitted when the component associated with a map or scene view is ready to be interacted with. */
+  /** Emitted when the component associated with a map or scene view is ready for user interaction. */
   readonly arcgisReady: import("@arcgis/lumina").TargetedEvent<this, void>;
   /**
    * Fires when the user changes the date or time in the component by interacting with the slider, the date picker, the

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

@@ -13,7 +13,7 @@ import { u as ke } from "../../chunks/useView.js";
 import { t as R } from "../../chunks/earth-utils.js";
 import { m as B } from "../../chunks/handle.js";
 import { o as N, i as h, b as F, d as U, l as J, r as Ce, s as re, g as Pe } from "../../chunks/time-utils.js";
-import { b as Oe, r as $e, g as Me, e as Ue } from "../../chunks/async-utils.js";
+import { a as Oe, r as $e, g as Me, d as Ue } from "../../chunks/async-utils.js";
 import { createTrackingTarget as ze, runTracked as se, signal as Le } from "@arcgis/core/applications/Components/reactiveUtils.js";
 import { C as ne } from "../../chunks/component-wrapper.js";
 import { V as S } from "../../chunks/visible-element.js";

package/dist/components/arcgis-direct-line-measurement-3d/customElement.d.ts

@@ -143,6 +143,13 @@ export abstract class ArcgisDirectLineMeasurement3d extends LitElement {
    * 
    */
   accessor autoDestroyDisabled: boolean;
+  /**
+   * If true, all unit-reset buttons will be hidden. Unit selection dropdowns remain available, but users cannot reset units to their defaults using the UI.
+   *
+   * @default false
+   * @since 5.2
+   */
+  accessor hideResetUnitsButton: boolean;
   /**
    * If true, the button that starts a new measurement will be hidden.
    *
@@ -172,6 +179,14 @@ export abstract class ArcgisDirectLineMeasurement3d extends LitElement {
    * @see [Calcite Icons](https://developers.arcgis.com/calcite-design-system/icons/)
    */
   accessor icon: Icon["icon"] | undefined;
+  /**
+   * Indicates whether interactive creation and editing of the analysis are disabled. When true, users cannot create a new analysis interactively or modify an existing analysis using its editing manipulators. Any interactive operation in progress is canceled. If the analysis is already complete, it and its results remain visible.
+   *
+   * @default false
+   * @default false
+   * @since 5.2
+   */
+  accessor interactionDisabled: boolean;
   /** The component's default label. */
   accessor label: string | undefined;
   /**
@@ -180,6 +195,7 @@ export abstract class ArcgisDirectLineMeasurement3d extends LitElement {
    * _**Note**: Individual message keys may change between releases._
    */
   accessor messageOverrides: {
+      reset?: string | undefined;
       componentLabel?: string | undefined;
       direct?: string | undefined;
       distance?: string | undefined;
@@ -194,6 +210,7 @@ export abstract class ArcgisDirectLineMeasurement3d extends LitElement {
   };
   /** @internal */
   protected messages: {
+      reset: string;
       componentLabel: string;
       direct: string;
       distance: string;
@@ -206,6 +223,7 @@ export abstract class ArcgisDirectLineMeasurement3d extends LitElement {
       unsupported: string;
       vertical: string;
   } & T9nMeta<{
+      reset: string;
       componentLabel: string;
       direct: string;
       distance: string;
@@ -236,12 +254,20 @@ export abstract class ArcgisDirectLineMeasurement3d extends LitElement {
   /**
    * Unit system (imperial, metric) or specific unit used for displaying the distance values. Possible values are listed in
    * [unitOptions](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-direct-line-measurement-3d/#unitOptions).
+   *
+   * When no unit is explicitly set on the component or its analysis, this property uses the length unit configured in the view through
+   * [view.options.displayUnits.length](https://developers.arcgis.com/javascript/latest/references/core/views/interactive/options/ViewOptions/#displayUnits).
+   * This property overrides the distance unit on this component's analysis without changing the units configured in the view.
    */
   accessor unit: SystemOrLengthUnit;
   /**
    * List of available units and unit systems (imperial, metric) that are shown in the component's dropdown.
    * By default, the following units are included: `metric`, `imperial`, `inches`, `feet`, `us-feet`, `yards`, `miles`, `nautical-miles`, `meters`, `kilometers`.
-   * Possible [unit](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-direct-line-measurement-3d/#unit) values can only be a subset of this list.
+   * If the unit inherited from the view through
+   * [view.options.displayUnits.length](https://developers.arcgis.com/javascript/latest/references/core/views/interactive/options/ViewOptions/#displayUnits)
+   * is not listed in [unitOptions](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-direct-line-measurement-3d/#unitOptions), the component checks whether its default unit is listed there.
+   * If it is, the component uses that default. If neither unit is listed, it uses the first entry in
+   * [unitOptions](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-direct-line-measurement-3d/#unitOptions).
    */
   accessor unitOptions: Array<SystemOrLengthUnit>;
   /**
@@ -256,8 +282,8 @@ export abstract class ArcgisDirectLineMeasurement3d extends LitElement {
   /** Starts a new measurement. */
   start(): Promise<void>;
   /** Emitted when the value of a property is changed. Use this to listen to changes to properties. */
-  readonly arcgisPropertyChange: import("@arcgis/lumina").TargetedEvent<this, { name: "analysis" | "state"; }>;
-  /** Emitted when the component associated with a map or scene view is ready to be interacted with. */
+  readonly arcgisPropertyChange: import("@arcgis/lumina").TargetedEvent<this, { name: "analysis" | "interactionDisabled" | "state"; }>;
+  /** Emitted when the component associated with a map or scene view is ready for user interaction. */
   readonly arcgisReady: import("@arcgis/lumina").TargetedEvent<this, void>;
   readonly "@eventTypes": {
     arcgisPropertyChange: ArcgisDirectLineMeasurement3d["arcgisPropertyChange"]["detail"];

package/dist/components/arcgis-direct-line-measurement-3d/customElement.js

@@ -1,27 +1,27 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
-import { c as _ } from "../../chunks/runtime.js";
-import { css as w, html as g } from "lit";
-import { LitElement as f, createEvent as v, nothing as b, safeClassMap as x } from "@arcgis/lumina";
-import { usePropertyChange as y } from "@arcgis/lumina/controllers";
+import { c as w } from "../../chunks/runtime.js";
+import { css as f, html as g } from "lit";
+import { LitElement as v, createEvent as b, nothing as x, safeClassMap as y } from "@arcgis/lumina";
+import { usePropertyChange as D } from "@arcgis/lumina/controllers";
 import { classes as z } from "@arcgis/toolkit/dom";
-import { u as D } from "../../chunks/useT9n.js";
-import { m as k } from "../../chunks/useViewModel.js";
-import { b as M } from "../../chunks/async-utils.js";
+import { u as U } from "../../chunks/useT9n.js";
+import { m as M } from "../../chunks/useViewModel.js";
+import { a as k } from "../../chunks/async-utils.js";
 import { g as p } from "../../chunks/globalCss.js";
-import { V as u } from "../../chunks/visible-element.js";
+import { V as h } from "../../chunks/visible-element.js";
 import O from "@arcgis/core/analysis/DirectLineMeasurementAnalysis.js";
-import { isAboveGeodesicDistanceThreshold as V } from "@arcgis/core/applications/Components/analysisUtils.js";
-import { property as l, subclass as $ } from "@arcgis/core/core/accessorSupport/decorators.js";
+import { isAboveGeodesicDistanceThreshold as $ } from "@arcgis/core/applications/Components/analysisUtils.js";
+import { property as l, subclass as V } from "@arcgis/core/core/accessorSupport/decorators.js";
 import { watch as S } from "@arcgis/core/core/reactiveUtils.js";
-import { A as U } from "../../chunks/AnalysisViewModel.js";
-import { g as L, a as C, b as d, r as E, d as m, c as P } from "../../chunks/measurementUtils.js";
-const A = w`.esri-widget__heading{color:var(--calcite-color-text-2);margin:0 0 .5rem;font-weight:var(--calcite-font-weight-semibold)}h1.esri-widget__heading{font-size:var(--calcite-font-size-xl)}h2.esri-widget__heading{font-size:var(--calcite-font-size-md)}h3.esri-widget__heading,h4.esri-widget__heading,h5.esri-widget__heading,h6.esri-widget__heading{font-size:var(--calcite-font-size)}.esri-widget{box-sizing:border-box;color:var(--calcite-color-text-2);background-color:var(--calcite-color-foreground-1);font-size:var(--calcite-font-size);line-height:var(--calcite-font-line-height-relative-tight)}.esri-widget *,.esri-widget :before,.esri-widget :after{box-sizing:inherit}.esri-widget.esri-widget--disabled>*{opacity:.4;pointer-events:none}.esri-widget.esri-widget--compact{--esri-widget-padding-y: 0;--esri-widget-padding-x: 0}.esri-widget__anchor{color:var(--calcite-color-text-2)}.esri-widget__anchor:hover{color:var(--calcite-color-text-3)}.esri-widget__anchor:hover,.esri-widget__anchor:focus{text-decoration:underline}.esri-widget__anchor--disabled{opacity:.4;pointer-events:none}.esri-widget__header{background-color:var(--calcite-color-foreground-1);flex:1 0 100%;justify-content:space-between;align-items:center;width:100%;min-height:48px;padding:12px 0 12px 15px;display:flex}.esri-widget__heading{word-break:break-word}.esri-widget__header .esri-widget__heading{width:calc(100% - 48px);text-align:initial;color:var(--calcite-color-text-1);align-items:center;margin:0;padding:0;display:flex}.esri-widget__header-button{appearance:none;cursor:pointer;color:var(--calcite-color-text-2);background-color:var(--calcite-color-foreground-1);border:none;flex:0 0 48px;justify-content:center;align-self:stretch;align-items:center;width:48px;padding:0;display:flex}.esri-widget__footer{background-color:var(--calcite-color-foreground-1);justify-content:center;align-items:center;width:100%;min-height:48px;display:flex}.esri-widget__footer-pagination{color:var(--calcite-color-text-2);justify-content:space-between;align-items:center;display:flex}.esri-widget__footer-pagination-previous-button,.esri-widget__footer-pagination-next-button{cursor:pointer;background-color:var(--calcite-color-foreground-1);border:0;margin:0 7px;padding:12px 15px;transition:background-color .125s ease-in-out}.esri-widget__footer-pagination-previous-button:hover,.esri-widget__footer-pagination-previous-button:focus,.esri-widget__footer-pagination-next-button:hover,.esri-widget__footer-pagination-next-button:focus{color:var(--calcite-color-text-1);background-color:var(--calcite-color-foreground-1)}.esri-menu{visibility:hidden;z-index:1;background-clip:padding;background-color:var(--calcite-color-foreground-1);background-clip:padding-box;width:100%;max-height:0;margin:2px 0 0;padding:0;font-size:var(--calcite-font-size);line-height:var(--calcite-spacing-xl);position:absolute;top:100%;left:0;overflow:hidden;box-shadow:0 1px 2px #0000004d}.esri-menu .esri-menu__header{color:var(--calcite-color-text-inverse);background-color:var(--calcite-color-inverse);padding:6px 12px}.esri-menu__list{margin:0;padding:0;list-style:none}.esri-menu__list-item{cursor:pointer;border-top:1px solid #adadad4d;border-left:3px solid #0000;padding:.8em 1em}.esri-menu__list-item [class^=esri-icon-],.esri-menu__list-item [class*=" esri-icon-"]{padding-right:2.8px}.esri-menu__list-item:first-child{border-top:none}.esri-menu__list-item--focus,.esri-menu__list-item:hover,.esri-menu__list-item:focus{background-color:var(--calcite-color-foreground-1)}.esri-menu__list-item:active{background-color:var(--calcite-color-foreground-current)}.esri-menu__list-item--active,.esri-menu__list-item--active:hover,.esri-menu__list-item--active:focus{background-color:var(--calcite-color-foreground-1);border-left-color:var(--calcite-color-brand)}.esri-widget__table{border-collapse:collapse;color:var(--calcite-color-text-1);border:none;width:100%;line-height:var(--calcite-font-line-height-relative-tight)}.esri-widget__table tr:nth-child(odd){background-color:var(--calcite-color-transparent)}.esri-widget__table tr:nth-child(2n){background-color:var(--calcite-color-transparent-press)}.esri-widget__table tr a{color:var(--calcite-color-text-2)}.esri-widget__table tr a:hover,.esri-widget__table tr a:focus{color:var(--calcite-color-text-1)}.esri-widget__table tr td,.esri-widget__table tr th{vertical-align:top;word-break:break-word;padding:.5em .7em;font-size:var(--calcite-font-size-sm);font-weight:var(--calcite-font-weight-regular)}.esri-widget__table tr th{text-align:left;border-right:3px solid #0000000d;width:50%}.esri-widget__table tr td{width:50%}.esri-input{color:var(--calcite-color-text-1);background-color:var(--calcite-color-foreground-1);border:1px solid #959595;font-size:var(--calcite-font-size)}.esri-input::-ms-clear{display:none}.esri-input::placeholder{opacity:1;color:var(--calcite-color-text-2)}.esri-input:placeholder-shown{text-overflow:ellipsis}.esri-input[type=text],.esri-input[type=password],.esri-input[type=number]{height:32px;padding:0 .5em}calcite-combobox.esri-input{border:none}.esri-widget__content--empty{text-align:center;color:var(--calcite-color-border-input);flex-flow:column wrap;align-items:center;padding:18px 22px;display:flex}.esri-widget__content--empty h1.esri-widget__heading,.esri-widget__content--empty h2.esri-widget__heading,.esri-widget__content--empty h3.esri-widget__heading,.esri-widget__content--empty h4.esri-widget__heading,.esri-widget__content--empty h5.esri-widget__heading{font-weight:var(--calcite-font-weight-regular)}.esri-widget__content-illustration--empty{width:128px;padding:1rem 0}.esri-widget__content-icon--empty{width:32px;padding:.5rem 0}.esri-select{appearance:none;cursor:pointer;color:var(--calcite-color-text-2);background:var(--calcite-color-foreground-1) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-8 -8 32 32' width='32' height='32'%3E%3Cpath d='M8 11.207l-4-4V5.793l4 4 4-4v1.414z' fill='%23adadad' fillrule='nonzero'/%3E%3C/svg%3E") 100% no-repeat;border:1px solid #959595;border-radius:0;width:100%;height:32px;margin:0;padding:0 .5em;font-family:inherit;font-size:.85em;display:block}.esri-select[disabled]{cursor:auto}.esri-select::-ms-expand{display:none}.esri-disabled a,.esri-disabled [role=menu],.esri-disabled [role=checkbox],.esri-disabled [class^=esri-icon-],.esri-disabled [class*=" esri-icon-"]{color:var(--calcite-color-text-3)}.keynav-mode .esri-widget:focus,.keynav-mode .esri-widget :focus{z-index:1;outline-offset:2px;outline:2px solid #adadad}.esri-widget__loader-animation{border:.15em solid #adadad4d;border-top-color:var(--calcite-color-border-input);border-radius:100%;width:1em;height:1em;font-size:var(--calcite-font-size-md);animation:1.25s linear infinite esri-rotate;display:block;transform:translateZ(0)}:dir(rtl) .esri-widget__table th{text-align:right;border-left:3px solid #0000000d;border-right:none}:dir(rtl) .esri-select{background-position:0}:dir(rtl) .esri-menu__list-item{border-left:none;border-right:3px solid #0000}:dir(rtl) .esri-menu__list-item [class^=esri-icon-],:dir(rtl) .esri-menu__list-item [class*=" esri-icon-"]{padding-left:2px;padding-right:0}:dir(rtl) .esri-menu__list-item--active{border-right-color:var(--calcite-color-brand)}.esri-icon-font-fallback-text{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}.esri-rotating{animation:1.25s linear infinite esri-rotate;transform:translateZ(0)}.esri-clearfix:before,.esri-clearfix:after{content:" ";display:table}.esri-clearfix:after{clear:both}.esri-interactive{cursor:pointer}.esri-hidden{display:none!important}.esri-invisible{visibility:hidden!important}.esri-offscreen{position:absolute;top:-999em;left:-999em}.esri-match-height{flex-direction:column;flex:auto;display:flex;overflow:hidden}.esri-widget--panel{min-width:300px;min-height:32px;padding:var(--arcgis-internal-padding);transition:max-height .25s ease-in-out;overflow-y:auto}.esri-unit-select{width:100%}.esri-unit-select__label{--calcite-label-margin-bottom: 0;width:100%}:host{display:block}.esri-measurement-widget-content{padding:var(--arcgis-internal-padding);flex-direction:column;gap:var(--calcite-spacing-xxl);display:flex;position:relative;overflow-y:auto}.esri-measurement-widget-content__error{color:var(--calcite-color-status-danger)}.esri-measurement-widget-content__error,.esri-measurement-widget-content__hint{overflow:hidden}.esri-measurement-widget-content__error p,.esri-measurement-widget-content__hint p{margin:0;padding:0}.esri-measurement-widget-content__hint,.esri-measurement-widget-content__error,.esri-measurement-widget-content__measurement,.esri-measurement-widget-content__measurement-item{flex-direction:column;gap:var(--calcite-spacing-md);animation:.25s ease-in-out esri-fade-in;display:flex}.esri-measurement-widget-content__measurement-item--disabled{color:var(--calcite-color-border-ghost)}.esri-measurement-widget-content__measurement-item__value{font-weight:var(--calcite-font-weight-semibold)}.esri-measurement-widget-content__actions{flex-direction:column;justify-content:center;gap:var(--calcite-spacing-xs);display:flex}:host{width:var(--arcgis-internal-panel-width, 300px)}.root{min-width:var(--arcgis-internal-panel-min-width);overflow:var(--arcgis-internal-panel-overflow, visible);height:fit-content}`;
-var j = Object.defineProperty, B = Object.getOwnPropertyDescriptor, a = (t, e, r, o) => {
-  for (var i = o > 1 ? void 0 : o ? B(e, r) : e, s = t.length - 1, c; s >= 0; s--)
-    (c = t[s]) && (i = (o ? c(e, r, i) : c(i)) || i);
-  return o && i && j(e, r, i), i;
+import { A as L } from "../../chunks/AnalysisViewModel.js";
+import { g as C, a as E, b as d, r as P, d as m, c as R } from "../../chunks/measurementUtils.js";
+const A = f`.esri-widget__heading{color:var(--calcite-color-text-2);margin:0 0 .5rem;font-weight:var(--calcite-font-weight-semibold)}h1.esri-widget__heading{font-size:var(--calcite-font-size-xl)}h2.esri-widget__heading{font-size:var(--calcite-font-size-md)}h3.esri-widget__heading,h4.esri-widget__heading,h5.esri-widget__heading,h6.esri-widget__heading{font-size:var(--calcite-font-size)}.esri-widget{box-sizing:border-box;color:var(--calcite-color-text-2);background-color:var(--calcite-color-foreground-1);font-size:var(--calcite-font-size);line-height:var(--calcite-font-line-height-relative-tight)}.esri-widget *,.esri-widget :before,.esri-widget :after{box-sizing:inherit}.esri-widget.esri-widget--disabled>*{opacity:.4;pointer-events:none}.esri-widget.esri-widget--compact{--esri-widget-padding-y: 0;--esri-widget-padding-x: 0}.esri-widget__anchor{color:var(--calcite-color-text-2)}.esri-widget__anchor:hover{color:var(--calcite-color-text-3)}.esri-widget__anchor:hover,.esri-widget__anchor:focus{text-decoration:underline}.esri-widget__anchor--disabled{opacity:.4;pointer-events:none}.esri-widget__header{background-color:var(--calcite-color-foreground-1);flex:1 0 100%;justify-content:space-between;align-items:center;width:100%;min-height:48px;padding:12px 0 12px 15px;display:flex}.esri-widget__heading{word-break:break-word}.esri-widget__header .esri-widget__heading{width:calc(100% - 48px);text-align:initial;color:var(--calcite-color-text-1);align-items:center;margin:0;padding:0;display:flex}.esri-widget__header-button{appearance:none;cursor:pointer;color:var(--calcite-color-text-2);background-color:var(--calcite-color-foreground-1);border:none;flex:0 0 48px;justify-content:center;align-self:stretch;align-items:center;width:48px;padding:0;display:flex}.esri-widget__footer{background-color:var(--calcite-color-foreground-1);justify-content:center;align-items:center;width:100%;min-height:48px;display:flex}.esri-widget__footer-pagination{color:var(--calcite-color-text-2);justify-content:space-between;align-items:center;display:flex}.esri-widget__footer-pagination-previous-button,.esri-widget__footer-pagination-next-button{cursor:pointer;background-color:var(--calcite-color-foreground-1);border:0;margin:0 7px;padding:12px 15px;transition:background-color .125s ease-in-out}.esri-widget__footer-pagination-previous-button:hover,.esri-widget__footer-pagination-previous-button:focus,.esri-widget__footer-pagination-next-button:hover,.esri-widget__footer-pagination-next-button:focus{color:var(--calcite-color-text-1);background-color:var(--calcite-color-foreground-1)}.esri-menu{visibility:hidden;z-index:1;background-clip:padding;background-color:var(--calcite-color-foreground-1);background-clip:padding-box;width:100%;max-height:0;margin:2px 0 0;padding:0;font-size:var(--calcite-font-size);line-height:var(--calcite-spacing-xl);position:absolute;top:100%;left:0;overflow:hidden;box-shadow:0 1px 2px #0000004d}.esri-menu .esri-menu__header{color:var(--calcite-color-text-inverse);background-color:var(--calcite-color-inverse);padding:6px 12px}.esri-menu__list{margin:0;padding:0;list-style:none}.esri-menu__list-item{cursor:pointer;border-top:1px solid #adadad4d;border-left:3px solid #0000;padding:.8em 1em}.esri-menu__list-item [class^=esri-icon-],.esri-menu__list-item [class*=" esri-icon-"]{padding-right:2.8px}.esri-menu__list-item:first-child{border-top:none}.esri-menu__list-item--focus,.esri-menu__list-item:hover,.esri-menu__list-item:focus{background-color:var(--calcite-color-foreground-1)}.esri-menu__list-item:active{background-color:var(--calcite-color-foreground-current)}.esri-menu__list-item--active,.esri-menu__list-item--active:hover,.esri-menu__list-item--active:focus{background-color:var(--calcite-color-foreground-1);border-left-color:var(--calcite-color-brand)}.esri-widget__table{border-collapse:collapse;color:var(--calcite-color-text-1);border:none;width:100%;line-height:var(--calcite-font-line-height-relative-tight)}.esri-widget__table tr:nth-child(odd){background-color:var(--calcite-color-transparent)}.esri-widget__table tr:nth-child(2n){background-color:var(--calcite-color-transparent-press)}.esri-widget__table tr a{color:var(--calcite-color-text-2)}.esri-widget__table tr a:hover,.esri-widget__table tr a:focus{color:var(--calcite-color-text-1)}.esri-widget__table tr td,.esri-widget__table tr th{vertical-align:top;word-break:break-word;padding:.5em .7em;font-size:var(--calcite-font-size-sm);font-weight:var(--calcite-font-weight-regular)}.esri-widget__table tr th{text-align:left;border-right:3px solid #0000000d;width:50%}.esri-widget__table tr td{width:50%}.esri-input{color:var(--calcite-color-text-1);background-color:var(--calcite-color-foreground-1);border:1px solid #959595;font-size:var(--calcite-font-size)}.esri-input::-ms-clear{display:none}.esri-input::placeholder{opacity:1;color:var(--calcite-color-text-2)}.esri-input:placeholder-shown{text-overflow:ellipsis}.esri-input[type=text],.esri-input[type=password],.esri-input[type=number]{height:32px;padding:0 .5em}calcite-combobox.esri-input{border:none}.esri-widget__content--empty{text-align:center;color:var(--calcite-color-border-input);flex-flow:column wrap;align-items:center;padding:18px 22px;display:flex}.esri-widget__content--empty h1.esri-widget__heading,.esri-widget__content--empty h2.esri-widget__heading,.esri-widget__content--empty h3.esri-widget__heading,.esri-widget__content--empty h4.esri-widget__heading,.esri-widget__content--empty h5.esri-widget__heading{font-weight:var(--calcite-font-weight-regular)}.esri-widget__content-illustration--empty{width:128px;padding:1rem 0}.esri-widget__content-icon--empty{width:32px;padding:.5rem 0}.esri-select{appearance:none;cursor:pointer;color:var(--calcite-color-text-2);background:var(--calcite-color-foreground-1) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-8 -8 32 32' width='32' height='32'%3E%3Cpath d='M8 11.207l-4-4V5.793l4 4 4-4v1.414z' fill='%23adadad' fillrule='nonzero'/%3E%3C/svg%3E") 100% no-repeat;border:1px solid #959595;border-radius:0;width:100%;height:32px;margin:0;padding:0 .5em;font-family:inherit;font-size:.85em;display:block}.esri-select[disabled]{cursor:auto}.esri-select::-ms-expand{display:none}.esri-disabled a,.esri-disabled [role=menu],.esri-disabled [role=checkbox],.esri-disabled [class^=esri-icon-],.esri-disabled [class*=" esri-icon-"]{color:var(--calcite-color-text-3)}.keynav-mode .esri-widget:focus,.keynav-mode .esri-widget :focus{z-index:1;outline-offset:2px;outline:2px solid #adadad}.esri-widget__loader-animation{border:.15em solid #adadad4d;border-top-color:var(--calcite-color-border-input);border-radius:100%;width:1em;height:1em;font-size:var(--calcite-font-size-md);animation:1.25s linear infinite esri-rotate;display:block;transform:translateZ(0)}:dir(rtl) .esri-widget__table th{text-align:right;border-left:3px solid #0000000d;border-right:none}:dir(rtl) .esri-select{background-position:0}:dir(rtl) .esri-menu__list-item{border-left:none;border-right:3px solid #0000}:dir(rtl) .esri-menu__list-item [class^=esri-icon-],:dir(rtl) .esri-menu__list-item [class*=" esri-icon-"]{padding-left:2px;padding-right:0}:dir(rtl) .esri-menu__list-item--active{border-right-color:var(--calcite-color-brand)}.esri-icon-font-fallback-text{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}.esri-rotating{animation:1.25s linear infinite esri-rotate;transform:translateZ(0)}.esri-clearfix:before,.esri-clearfix:after{content:" ";display:table}.esri-clearfix:after{clear:both}.esri-interactive{cursor:pointer}.esri-hidden{display:none!important}.esri-invisible{visibility:hidden!important}.esri-offscreen{position:absolute;top:-999em;left:-999em}.esri-match-height{flex-direction:column;flex:auto;display:flex;overflow:hidden}.esri-widget--panel{min-width:300px;min-height:32px;padding:var(--arcgis-internal-padding);transition:max-height .25s ease-in-out;overflow-y:auto}.esri-unit-select{width:100%}.esri-unit-select__label{--calcite-label-margin-bottom: 0;width:100%}:host{display:block}.esri-measurement-widget-content{padding:var(--arcgis-internal-padding);flex-direction:column;gap:var(--calcite-spacing-xxl);display:flex;position:relative;overflow-y:auto}.esri-measurement-widget-content__error{color:var(--calcite-color-status-danger)}.esri-measurement-widget-content__error,.esri-measurement-widget-content__hint{overflow:hidden}.esri-measurement-widget-content__error p,.esri-measurement-widget-content__hint p{margin:0;padding:0}.esri-measurement-widget-content__hint,.esri-measurement-widget-content__error,.esri-measurement-widget-content__measurement,.esri-measurement-widget-content__measurement-item{flex-direction:column;gap:var(--calcite-spacing-md);animation:.25s ease-in-out esri-fade-in;display:flex}.esri-measurement-widget-content__measurement-item--disabled{color:var(--calcite-color-border-ghost)}.esri-measurement-widget-content__measurement-item__value{font-weight:var(--calcite-font-weight-semibold)}.esri-measurement-widget-content__actions{flex-direction:column;justify-content:center;gap:var(--calcite-spacing-xs);display:flex}:host{width:var(--arcgis-internal-panel-width, 300px)}.root{min-width:var(--arcgis-internal-panel-min-width);overflow:var(--arcgis-internal-panel-overflow, visible);height:fit-content}`;
+var j = Object.defineProperty, B = Object.getOwnPropertyDescriptor, a = (t, i, e, s) => {
+  for (var r = s > 1 ? void 0 : s ? B(i, e) : i, o = t.length - 1, c; o >= 0; o--)
+    (c = t[o]) && (r = (s ? c(i, e, r) : c(r)) || r);
+  return s && r && j(i, e, r), r;
 };
-let n = class extends U {
+let n = class extends L {
   constructor() {
     super(...arguments), this.supportedViewType = "3d", this.unsupportedErrorMessage = "The Direct Line Measurement 3D component is only supported in 3D views.";
   }
@@ -33,49 +33,61 @@ let n = class extends U {
           analysis: this.analysis,
           unit: this._userUnit
         }),
-        ({ analysis: t, unit: e }) => {
-          e && (t.unit = e);
+        ({ analysis: t, unit: i }) => {
+          i && (t.unit = i);
         },
         { sync: !0, initial: !0 }
       )
     );
   }
   get state() {
-    const { analysis: t, disabled: e, operationState: r, ready: o, supported: i } = this, { valid: s } = t;
-    return L({ supported: i, disabled: e, ready: o, operationState: r, valid: s });
+    const { analysis: t, disabled: i, operationState: e, ready: s, supported: r } = this, { valid: o } = t;
+    return C({ supported: r, disabled: i, ready: s, operationState: e, valid: o });
   }
   get displayState() {
-    return C(this.state, !!this.analysis.startPoint);
+    return E(this.state, !!this.analysis.startPoint);
   }
   get measurement() {
-    const t = this.analysisView?.result, e = t?.mode ?? "euclidean";
+    const t = this.analysisView?.result, i = t?.mode ?? "euclidean";
     if (!this.analysis.valid)
       return {
-        mode: e,
+        mode: i,
         directDistance: d(void 0),
         horizontalDistance: d(void 0),
         verticalDistance: d(void 0)
       };
-    const r = t?.directDistance, o = r != null && V(r);
+    const e = t?.directDistance, s = e != null && $(e);
     return {
-      mode: e,
-      directDistance: d(o ? void 0 : r),
+      mode: i,
+      directDistance: d(s ? void 0 : e),
       horizontalDistance: d(t?.horizontalDistance),
       verticalDistance: d(t?.verticalDistance)
     };
   }
   get unitOptions() {
-    return E(this._userUnitOptions, m, m);
+    return P(this._userUnitOptions, m, m);
   }
   set unitOptions(t) {
     this._userUnitOptions = t;
   }
   get unit() {
-    return P(this._userUnit, this.analysis.unit, this.unitOptions, this.defaultMeasurementSystem);
+    return R({
+      userUnit: this._userUnit,
+      analysisUnit: this.analysis.unit,
+      options: this.unitOptions,
+      defaultUnit: this.defaultMeasurementSystem,
+      viewUnit: this.view?.options.displayUnits.length
+    });
   }
   set unit(t) {
     this._userUnit = t;
   }
+  get canResetUnit() {
+    return this._userUnit != null || this.analysis.unit != null;
+  }
+  resetUnit() {
+    this._userUnit = void 0, this.analysis.unit = null;
+  }
   async place(t) {
     await this.analysisView?.place(t);
   }
@@ -107,16 +119,19 @@ a([
 a([
   l()
 ], n.prototype, "_userUnit", 2);
+a([
+  l({ readOnly: !0 })
+], n.prototype, "canResetUnit", 1);
 n = a([
-  $("components.direct-line-measurement-3d.DirectLineMeasurement3dViewModel")
+  V("components.direct-line-measurement-3d.DirectLineMeasurement3dViewModel")
 ], n);
-const T = k(n);
-class Z extends f {
+const T = M(n);
+class I extends v {
   constructor() {
-    super(...arguments), this.viewModel = T(this), this.messages = D({ name: "directline-measurement-3d", blocking: !0 }), this.view = this.viewModel.view, this.analysis = this.viewModel.analysis, this.autoDestroyDisabled = !1, this.hideStartButton = !1, this.hideUnitSelect = !1, this.hideVisualization = this.viewModel.hideVisualization, this.icon = "measure-line", this.state = this.viewModel.state, this.unit = this.viewModel.unit, this.unitOptions = this.viewModel.unitOptions, this.arcgisPropertyChange = y()("analysis", "state"), this.arcgisReady = v();
+    super(...arguments), this.viewModel = T(this), this.messages = U({ name: "directline-measurement-3d", blocking: !0 }), this.view = this.viewModel.view, this.analysis = this.viewModel.analysis, this.autoDestroyDisabled = !1, this.hideStartButton = !1, this.hideResetUnitsButton = !1, this.hideUnitSelect = !1, this.hideVisualization = this.viewModel.hideVisualization, this.icon = "measure-line", this.interactionDisabled = this.viewModel.interactionDisabled, this.state = this.viewModel.state, this.unit = this.viewModel.unit, this.unitOptions = this.viewModel.unitOptions, this.arcgisPropertyChange = D()("analysis", "interactionDisabled", "state"), this.arcgisReady = b();
   }
   static {
-    this.properties = { view: 0, analysis: 0, autoDestroyDisabled: 5, hideStartButton: 5, hideUnitSelect: 5, hideVisualization: 5, icon: 3, label: 1, messageOverrides: 0, referenceElement: 1, state: 32, unit: 1, unitOptions: 0 };
+    this.properties = { view: 0, analysis: 0, autoDestroyDisabled: 5, hideStartButton: 5, hideResetUnitsButton: 5, hideUnitSelect: 5, hideVisualization: 5, icon: 3, interactionDisabled: 5, label: 1, messageOverrides: 0, referenceElement: 1, state: 32, unit: 1, unitOptions: 0 };
   }
   static {
     this.styles = A;
@@ -128,29 +143,29 @@ class Z extends f {
     await this.manager.destroy();
   }
   async start() {
-    M(this.viewModel.start());
+    k(this.viewModel.start());
   }
   render() {
-    const { messages: e, unit: r, unitOptions: o, viewModel: i } = this, { measurement: s, state: c } = i;
-    return g`<div aria-label=${e.componentLabel ?? b} class=${x(z("root", p.widget, p.panel))} role=presentation><arcgis-measurement-content .state=${i.displayState} .hintLabel=${e.hint} .unsupportedLabel=${e.unsupported} .items=${[
+    const { hideResetUnitsButton: i, messages: e, unit: s, unitOptions: r, viewModel: o } = this, { measurement: c, state: u } = o;
+    return g`<div aria-label=${e.componentLabel ?? x} class=${y(z("root", p.widget, p.panel))} role=presentation><arcgis-measurement-content .state=${o.displayState} .hintLabel=${e.hint} .unsupportedLabel=${e.unsupported} .items=${[
       {
         title: e.direct,
-        measurement: s.directDistance
+        measurement: c.directDistance
       },
       {
         title: e.horizontal,
-        measurement: s.horizontalDistance
+        measurement: c.horizontalDistance
       },
       {
         title: e.vertical,
-        measurement: s.verticalDistance
+        measurement: c.verticalDistance
       }
-    ]}>${u({ hidden: this.hideUnitSelect, children: g`<arcgis-unit-select slot=settings .options=${o} .selectLabel=${e.unit} .value=${r} @arcgisUnitSelectChange=${(h) => {
-      this.unit = h.detail;
-    }}></arcgis-unit-select>` })}${u({ hidden: this.hideStartButton, children: g`<calcite-button slot=actions .disabled=${c === "disabled" || c === "unsupported"} @click=${this.start}>${e.newMeasurement}</calcite-button>` })}</arcgis-measurement-content></div>`;
+    ]}>${h({ hidden: this.hideUnitSelect, children: g`<arcgis-unit-select slot=settings .options=${r} .selectLabel=${e.unit} .value=${s} .canReset=${!i && o.canResetUnit} .resetLabel=${e.reset} @arcgisInternalUnitReset=${() => o.resetUnit()} @arcgisUnitSelectChange=${(_) => {
+      this.unit = _.detail;
+    }}></arcgis-unit-select>` })}${h({ hidden: this.hideStartButton, children: g`<calcite-button slot=actions .disabled=${u === "disabled" || u === "unsupported" || this.interactionDisabled} @click=${this.start}>${e.newMeasurement}</calcite-button>` })}</arcgis-measurement-content></div>`;
   }
 }
-_("arcgis-direct-line-measurement-3d", Z);
+w("arcgis-direct-line-measurement-3d", I);
 export {
-  Z as ArcgisDirectLineMeasurement3d
+  I as ArcgisDirectLineMeasurement3d
 };

package/dist/components/arcgis-directional-pad/DirectionalPadViewModel.d.ts

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

package/dist/components/arcgis-directional-pad/customElement.d.ts

@@ -3,7 +3,7 @@ import type MapView from "@arcgis/core/views/MapView.js";
 import type { PublicLitElement as LitElement } from "@arcgis/lumina";
 import type { ArcgisReferenceElement } from "../types.js";
 import type { T9nMeta } from "@arcgis/lumina/controllers";
-import type { DirectionalPadViewModelState } from "@arcgis/core/widgets/DirectionalPad/DirectionalPadViewModel.js";
+import type { DirectionalPadViewModelState } from "./DirectionalPadViewModel.js";
 import type { Button as Button } from "@esri/calcite-components/components/calcite-button";
 
 /**
@@ -40,7 +40,7 @@ export abstract class ArcgisDirectionalPad extends LitElement {
    */
   accessor autoDestroyDisabled: boolean;
   /**
-   * When true, the component is visually withdrawn and cannot receive user interaction.
+   * When true, the component is visually de-emphasized and does not accept user interaction.
    *
    * @default false
    */
@@ -133,7 +133,7 @@ export abstract class ArcgisDirectionalPad extends LitElement {
    * The view associated with the component.
    * > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-directional-pad component will be associated with a map or scene component rather than using the `view` property.
    */
-  accessor view: MapView | null | undefined;
+  accessor view: MapView | undefined;
   /**
    * Determines the size of directional pad buttons and the slider.
    *
@@ -147,7 +147,7 @@ export abstract class ArcgisDirectionalPad extends LitElement {
   destroy(): Promise<void>;
   /** Emitted when the value of a property is changed. Use this to listen to changes to properties. */
   readonly arcgisPropertyChange: import("@arcgis/lumina").TargetedEvent<this, { name: "state"; }>;
-  /** Emitted when the component associated with a map or scene view is ready to be interacted with. */
+  /** Emitted when the component associated with a map or scene view is ready for user interaction. */
   readonly arcgisReady: import("@arcgis/lumina").TargetedEvent<this, void>;
   readonly "@eventTypes": {
     arcgisPropertyChange: ArcgisDirectionalPad["arcgisPropertyChange"]["detail"];