@arcgis/map-components 5.1.0-next.12 → 5.1.0-next.121

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

@@ -12,7 +12,7 @@ import type { SystemOrLengthUnit } from "@arcgis/core/core/units.js";
  * The Direct Line Measurement 3D component can be added to an [arcgis-scene](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-scene/)
  * component to calculate and display vertical, horizontal, and direct distances between two points.
  *
- * [![measurement-line-3d](https://developers.arcgis.com/javascript/latest/assets/img/apiref/widgets/3D_DirectLineMeasurement_widget.png)](https://developers.arcgis.com/javascript/latest/sample-code/measurement-3d/)
+ * [![measurement-line-3d](https://developers.arcgis.com/javascript/latest/assets/references/core/widgets/3D_DirectLineMeasurement_widget.avif)](https://developers.arcgis.com/javascript/latest/sample-code/measurement-3d/)
  *
  * How distances are computed depends on the scene's spatial reference.
  *
@@ -29,7 +29,7 @@ import type { SystemOrLengthUnit } from "@arcgis/core/core/units.js";
  * the measurement visualization is simplified, and only the horizontal and vertical distances are calculated.
  * The direct distance option becomes unavailable.
  *
- * ![measurement-line-3d](https://developers.arcgis.com/javascript/latest/assets/img/apiref/widgets/direct-line-measurement-3d.png)
+ * ![measurement-line-3d](https://developers.arcgis.com/javascript/latest/assets/references/core/widgets/direct-line-measurement-3d.avif)
  *
  * When the component is active, a horizontal "laser" line is drawn which indicates the height at the current mouse position.
  * This line can help in analyzing the heights of objects relative to each other and the terrain.

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

@@ -1,28 +1,27 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
 import { c as _ } from "../../chunks/runtime.js";
-import { css as f, html as g } from "lit";
-import { LitElement as w, createEvent as v, nothing as b, safeClassMap as x } from "@arcgis/lumina";
+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 { 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 { g as u } from "../../chunks/globalCss.js";
-import { V as p } from "../../chunks/visible-element.js";
+import { g as p } from "../../chunks/globalCss.js";
+import { V as u } from "../../chunks/visible-element.js";
 import O from "@arcgis/core/analysis/DirectLineMeasurementAnalysis.js";
-import { isAboveGeodesicDistanceThreshold as U } from "@arcgis/core/applications/Components/analysisUtils.js";
-import { getDefaultUnitForView as V } from "@arcgis/core/applications/Components/getDefaultUnits.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 { watch as S } from "@arcgis/core/core/reactiveUtils.js";
-import { A as L } from "../../chunks/AnalysisViewModel.js";
-import { g as C, a as E, b as d, c as m } from "../../chunks/measurementUtils.js";
-const P = 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:300px}`;
-var A = Object.defineProperty, j = Object.getOwnPropertyDescriptor, a = (e, t, i, n) => {
-  for (var r = n > 1 ? void 0 : n ? j(t, i) : t, s = e.length - 1, c; s >= 0; s--)
-    (c = e[s]) && (r = (n ? c(t, i, r) : c(r)) || r);
-  return n && r && A(t, i, r), r;
+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:300px}`;
+var j = Object.defineProperty, B = Object.getOwnPropertyDescriptor, a = (t, e, r, o) => {
+  for (var i = o > 1 ? void 0 : o ? B(e, r) : e, n = t.length - 1, c; n >= 0; n--)
+    (c = t[n]) && (i = (o ? c(e, r, i) : c(i)) || i);
+  return o && i && j(e, r, i), i;
 };
-let o = class extends L {
+let s = class extends U {
   constructor() {
     super(...arguments), this.supportedViewType = "3d", this.unsupportedErrorMessage = "The Direct Line Measurement 3D component is only supported in 3D views.";
   }
@@ -32,61 +31,53 @@ let o = class extends L {
       S(
         () => ({
           analysis: this.analysis,
-          unit: this.unit
+          unit: this._userUnit
         }),
-        ({ analysis: e, unit: t }) => {
-          e != null && (e.unit = t);
+        ({ analysis: t, unit: e }) => {
+          e && (t.unit = e);
         },
         { sync: !0, initial: !0 }
       )
     );
   }
   get state() {
-    const { analysis: e, disabled: t, operationState: i, ready: n, supported: r } = this, { valid: s } = e;
-    return C({ supported: r, disabled: t, ready: n, operationState: i, valid: s });
+    const { analysis: t, disabled: e, operationState: r, ready: o, supported: i } = this, { valid: n } = t;
+    return L({ supported: i, disabled: e, ready: o, operationState: r, valid: n });
   }
   get displayState() {
-    return E(this.state, !!this.analysis.startPoint);
+    return C(this.state, !!this.analysis.startPoint);
   }
   get measurement() {
-    const e = this.analysisView?.result, t = e?.mode ?? "euclidean";
+    const t = this.analysisView?.result, e = t?.mode ?? "euclidean";
     if (!this.analysis.valid)
       return {
-        mode: t,
+        mode: e,
         directDistance: d(void 0),
         horizontalDistance: d(void 0),
         verticalDistance: d(void 0)
       };
-    const i = e?.directDistance, n = i != null && U(i);
+    const r = t?.directDistance, o = r != null && V(r);
     return {
-      mode: t,
-      directDistance: d(n ? void 0 : i),
-      horizontalDistance: d(e?.horizontalDistance),
-      verticalDistance: d(e?.verticalDistance)
+      mode: e,
+      directDistance: d(o ? void 0 : r),
+      horizontalDistance: d(t?.horizontalDistance),
+      verticalDistance: d(t?.verticalDistance)
     };
   }
   get unitOptions() {
-    const e = this._userUnitOptions?.filter((t) => m.includes(t));
-    return e && e.length > 0 ? e : m.slice();
+    return E(this._userUnitOptions, m, m);
   }
-  set unitOptions(e) {
-    this._userUnitOptions = e;
+  set unitOptions(t) {
+    this._userUnitOptions = t;
   }
   get unit() {
-    const e = this._userUnit ?? this.analysis.unit, t = this.unitOptions;
-    if (e && t.includes(e))
-      return e;
-    const i = this._defaultUnit;
-    return i && t.includes(i) ? i : t[0];
+    return P(this._userUnit, this.analysis.unit, this.unitOptions, this.defaultMeasurementSystem);
   }
-  set unit(e) {
-    this._userUnit = e;
+  set unit(t) {
+    this._userUnit = t;
   }
-  get _defaultUnit() {
-    return this.view ? V(this.view) : void 0;
-  }
-  async place(e) {
-    await this.analysisView?.place(e);
+  async place(t) {
+    await this.analysisView?.place(t);
   }
   clearAnalysis() {
     this.analysis.startPoint = null, this.analysis.endPoint = null;
@@ -97,41 +88,38 @@ let o = class extends L {
 };
 a([
   l({ readOnly: !0 })
-], o.prototype, "state", 1);
+], s.prototype, "state", 1);
 a([
   l({ readOnly: !0 })
-], o.prototype, "displayState", 1);
+], s.prototype, "displayState", 1);
 a([
   l({ readOnly: !0 })
-], o.prototype, "measurement", 1);
+], s.prototype, "measurement", 1);
 a([
   l()
-], o.prototype, "unitOptions", 1);
+], s.prototype, "unitOptions", 1);
 a([
   l()
-], o.prototype, "_userUnitOptions", 2);
+], s.prototype, "_userUnitOptions", 2);
 a([
   l()
-], o.prototype, "unit", 1);
+], s.prototype, "unit", 1);
 a([
   l()
-], o.prototype, "_userUnit", 2);
-a([
-  l({ readOnly: !0 })
-], o.prototype, "_defaultUnit", 1);
-o = a([
+], s.prototype, "_userUnit", 2);
+s = a([
   $("components.direct-line-measurement-3d.DirectLineMeasurement3dViewModel")
-], o);
-const B = k(o);
-class T extends w {
+], s);
+const T = k(s);
+class Z extends f {
   constructor() {
-    super(...arguments), this.viewModel = B(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 = 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();
   }
   static {
     this.properties = { view: 0, analysis: 0, autoDestroyDisabled: 5, hideStartButton: 5, hideUnitSelect: 5, hideVisualization: 5, icon: 3, label: 1, referenceElement: 1, state: 32, unit: 1, unitOptions: 0 };
   }
   static {
-    this.styles = P;
+    this.styles = A;
   }
   async clear() {
     this.viewModel.clear();
@@ -143,26 +131,26 @@ class T extends w {
     M(this.viewModel.start());
   }
   render() {
-    const { messages: t, unit: i, unitOptions: n, viewModel: r } = this, { measurement: s, state: c } = r;
-    return g`<div aria-label=${t.componentLabel ?? b} class=${x(z("root", u.widget, u.panel))} role=presentation><arcgis-measurement-content .state=${r.displayState} .hintLabel=${t.hint} .unsupportedLabel=${t.unsupported} .items=${[
+    const { messages: e, unit: r, unitOptions: o, viewModel: i } = this, { measurement: n, 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=${[
       {
-        title: t.direct,
-        measurement: s.directDistance
+        title: e.direct,
+        measurement: n.directDistance
       },
       {
-        title: t.horizontal,
-        measurement: s.horizontalDistance
+        title: e.horizontal,
+        measurement: n.horizontalDistance
       },
       {
-        title: t.vertical,
-        measurement: s.verticalDistance
+        title: e.vertical,
+        measurement: n.verticalDistance
       }
-    ]}>${p({ hidden: this.hideUnitSelect, children: g`<arcgis-unit-select slot=settings .options=${n} .selectLabel=${t.unit} .value=${i} @arcgisUnitSelectChange=${(h) => {
+    ]}>${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>` })}${p({ hidden: this.hideStartButton, children: g`<calcite-button slot=actions .disabled=${c === "disabled" || c === "unsupported"} @click=${this.start}>${t.newMeasurement}</calcite-button>` })}</arcgis-measurement-content></div>`;
+    }}></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>`;
   }
 }
-_("arcgis-direct-line-measurement-3d", T);
+_("arcgis-direct-line-measurement-3d", Z);
 export {
-  T as ArcgisDirectLineMeasurement3d
+  Z as ArcgisDirectLineMeasurement3d
 };

package/dist/components/arcgis-directional-pad/customElement.js

@@ -1,18 +1,19 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
-import { c as d } from "../../chunks/runtime.js";
-import { css as h, html as o } from "lit";
-import { ref as u } from "lit/directives/ref.js";
-import { keyed as r } from "lit/directives/keyed.js";
-import { usePropertyChange as p } from "@arcgis/lumina/controllers";
-import { focusElement as m } from "@arcgis/toolkit/dom";
-import { watch as b } from "@arcgis/core/core/reactiveUtils.js";
-import g from "@arcgis/core/widgets/DirectionalPad/DirectionalPadViewModel.js";
-import { LitElement as v, createEvent as f, safeClassMap as w, nothing as s, safeStyleMap as _ } from "@arcgis/lumina";
-import { u as $ } from "../../chunks/useT9n.js";
-import { m as R } from "../../chunks/useViewModel.js";
-import { g as x } from "../../chunks/component-utils.js";
-import { g as c } from "../../chunks/globalCss.js";
-const l = [-45, 0, 45, -90, 90, -135, 180, 135], C = {
+import { c as l } from "../../chunks/runtime.js";
+import { css as d, html as i } from "lit";
+import { ref as h } from "lit/directives/ref.js";
+import { keyed as s } from "lit/directives/keyed.js";
+import { usePropertyChange as u } from "@arcgis/lumina/controllers";
+import { focusElement as p } from "@arcgis/toolkit/dom";
+import { watch as m } from "@arcgis/core/core/reactiveUtils.js";
+import b from "@arcgis/core/widgets/DirectionalPad/DirectionalPadViewModel.js";
+import { LitElement as g, createEvent as v, safeClassMap as f, nothing as a, safeStyleMap as w } from "@arcgis/lumina";
+import { u as _ } from "../../chunks/useT9n.js";
+import { m as $ } from "../../chunks/useViewModel.js";
+import { g as R } from "../../chunks/component-utils.js";
+import { g as r } from "../../chunks/globalCss.js";
+import { f as C, c as x } from "../../chunks/utils.js";
+const c = [-45, 0, 45, -90, 90, -135, 180, 135], y = {
   0: { label: "north", iconName: "chevron-up" },
   45: { label: "northEast", iconName: "chevron-up-right" },
   90: { label: "east", iconName: "chevron-right" },
@@ -21,24 +22,16 @@ const l = [-45, 0, 45, -90, 90, -135, 180, 135], C = {
   "-135": { label: "southWest", iconName: "chevron-down-left" },
   "-90": { label: "west", iconName: "chevron-left" },
   "-45": { label: "northWest", iconName: "chevron-up-left" }
-}, y = h`:host{outline:none;box-shadow:none!important;background-color:transparent!important;user-select:none;calcite-action-pad{display:contents}calcite-action-group{touch-action:none}calcite-action{aspect-ratio:1}}.root{display:flex;flex-direction:column;gap:var(--calcite-spacing-sm)}.buttons-container{--calcite-color-background: transparent;--calcite-action-group-gap: 0;calcite-action{--calcite-color-focus: var(--calcite-color-foreground-3)}calcite-action:not([active]){--calcite-action-background-color-press: var(--calcite-color-foreground-1)}calcite-action[active]{--calcite-action-background-color: var(--calcite-color-foreground-3)}calcite-icon{transform:var(--rotation, unset)}@media(hover:none){calcite-action{--calcite-action-background-color-hover: var(--calcite-color-foreground-1);--calcite-action-text-color-press: var(--calcite-color-text-3)}}}.rotation-container{display:block;width:100%;calcite-action{flex:.3}}.rotation-slider-container{display:flex;flex:1;align-items:center;calcite-slider{flex:1;padding-inline:var(--calcite-spacing-xxs)}}`;
-function M(a) {
-  const { x: t, y: e, width: i, height: n } = a.getBoundingClientRect();
-  return { x: t + i / 2, y: e + n / 2 };
-}
-function B(a) {
-  return a?.spatialReference?.isWebMercator || a?.spatialReference?.isGeographic || !1;
-}
-const S = R(g);
-class E extends v {
+}, M = d`:host{outline:none;box-shadow:none!important;background-color:transparent!important;user-select:none;calcite-action-pad{display:contents}calcite-action-group{touch-action:none}calcite-action{aspect-ratio:1}}.root{display:flex;flex-direction:column;gap:var(--calcite-spacing-sm)}.buttons-container{--calcite-color-background: transparent;--calcite-action-group-gap: 0;calcite-action{--calcite-color-focus: var(--calcite-color-foreground-3)}calcite-action:not([active]){--calcite-action-background-color-press: var(--calcite-color-foreground-1)}calcite-action[active]{--calcite-action-background-color: var(--calcite-color-foreground-3)}calcite-icon{transform:var(--rotation, unset)}@media(hover:none){calcite-action{--calcite-action-background-color-hover: var(--calcite-color-foreground-1);--calcite-action-text-color-press: var(--calcite-color-text-3)}}}.rotation-container{display:block;width:100%;calcite-action{flex:.3}}.rotation-slider-container{display:flex;flex:1;align-items:center;calcite-slider{flex:1;padding-inline:var(--calcite-spacing-xxs)}}`, S = $(b);
+class B extends g {
   constructor() {
-    super(...arguments), this.messages = $({}), this._onContextMenu = (t) => t.preventDefault(), this._buttons = {}, this.viewModel = S(this), this.angle = this.viewModel.angle, this.rotation = this.viewModel.rotation, this.view = this.viewModel.view, this.autoDestroyDisabled = !1, this.disabled = this.viewModel.disabled, this.hideDirectionalButtons = !1, this.icon = "move", this.showRotationResetButton = !1, this.showRotationSlider = !1, this.state = this.viewModel.state, this.visualScale = "s", this.arcgisPropertyChange = p()("state"), this.arcgisReady = f();
+    super(...arguments), this.messages = _({}), this._onContextMenu = (t) => t.preventDefault(), this._buttons = {}, this.viewModel = S(this), this.angle = this.viewModel.angle, this.rotation = this.viewModel.rotation, this.view = this.viewModel.view, this.autoDestroyDisabled = !1, this.disabled = this.viewModel.disabled, this.hideDirectionalButtons = !1, this.icon = "move", this.showRotationResetButton = !1, this.showRotationSlider = !1, this.state = this.viewModel.state, this.visualScale = "s", this.arcgisPropertyChange = u()("state"), this.arcgisReady = v();
   }
   static {
     this.properties = { _rotationEnabled: 16, angle: 16, rotation: 16, view: 0, autoDestroyDisabled: 5, disabled: 5, hideDirectionalButtons: 5, icon: 1, label: 1, messageOverrides: 0, referenceElement: 1, showRotationResetButton: 5, showRotationSlider: 5, state: 32, visualScale: 1 };
   }
   static {
-    this.styles = y;
+    this.styles = M;
   }
   get _rotationEnabled() {
     return this.view?.ready ? this.view.constraints.rotationEnabled ?? !1 : !0;
@@ -49,8 +42,8 @@ class E extends v {
   loaded() {
     this.manager.onLifecycle(() => [
       // Move focus when movement angle changed by touch/mouse (not keyboard!)
-      b(() => this.viewModel.angle, () => {
-        this._buttonsContainer?.contains(document.activeElement) && (this.viewModel.angle == null ? x(this)?.focus() : m(this._buttons[this.viewModel.angle]));
+      m(() => this.viewModel.angle, () => {
+        this._buttonsContainer?.contains(document.activeElement) && (this.viewModel.angle == null ? R(this)?.focus() : p(this._buttons[this.viewModel.angle]));
       })
     ]);
   }
@@ -71,8 +64,8 @@ class E extends v {
     if (this._buttonsContainer === void 0)
       return;
     t.composedPath().find((n) => n.hasPointerCapture?.(t.pointerId))?.releasePointerCapture(t.pointerId);
-    const i = M(this._buttonsContainer);
-    this.viewModel.beginFollowingPointer(t, i);
+    const o = C(this._buttonsContainer);
+    this.viewModel.beginFollowingPointer(t, o);
   }
   _onSliderInput({ currentTarget: t }) {
     typeof t.value == "number" && (this.viewModel.rotation = t.value);
@@ -84,11 +77,11 @@ class E extends v {
     this.viewModel.moveOnce(t);
   }
   render() {
-    const { label: t, disabled: e } = this, i = this.view == null || this.view.type === "2d";
-    return o`<div .ariaLabel=${t ?? void 0} class=${w({ root: !0, [c.widget]: !0, [c.disabled]: e })} tabindex=-1>${i ? this._renderContent() : this._renderUnsupportedMessage()}</div>`;
+    const { label: t, disabled: e } = this, o = this.view == null || this.view.type === "2d";
+    return i`<div .ariaLabel=${t ?? void 0} class=${f({ root: !0, [r.widget]: !0, [r.disabled]: e })} tabindex=-1>${o ? this._renderContent() : this._renderUnsupportedMessage()}</div>`;
   }
   _renderUnsupportedMessage() {
-    return o`<section class="error"><p>${this.messages.unsupported}</p></section>`;
+    return i`<section class="error"><p>${this.messages.unsupported}</p></section>`;
   }
   _renderContent() {
     return [
@@ -97,31 +90,31 @@ class E extends v {
     ];
   }
   _renderDirectionalButtons() {
-    return r("directional-buttons-container", o`<calcite-action-bar expand-disabled floating layout=grid .scale=${this.visualScale} overflow-actions-disabled><calcite-action-group class="buttons-container" dir=ltr @contextmenu=${{
+    return s("directional-buttons-container", i`<calcite-action-bar expand-disabled floating layout=grid .scale=${this.visualScale} overflow-actions-disabled><calcite-action-group class="buttons-container" dir=ltr @contextmenu=${{
       handleEvent: this._onContextMenu,
       capture: !0
-    }} ${u(this._setButtonContainerRef)}>${l.slice(0, 4).map(this._renderButton, this)}${this._renderCompass()}${l.slice(4).map(this._renderButton, this)}</calcite-action-group></calcite-action-bar>`);
+    }} ${h(this._setButtonContainerRef)}>${c.slice(0, 4).map(this._renderButton, this)}${this._renderCompass()}${c.slice(4).map(this._renderButton, this)}</calcite-action-group></calcite-action-bar>`);
   }
   _renderButton(t) {
-    const { label: e, iconName: i } = C[t], n = this.messages[e];
-    return o`<calcite-action .active=${this.angle === t} alignment=center class="button" data-angle=${t ?? s} .disabled=${this.disabled} @click=${this._onClick.bind(this, t)} @pointerdown=${this._onButtonPointerDown} .text=${n ?? ""} title=${n ?? s}><calcite-icon .icon=${i} .scale=${this.visualScale}></calcite-icon></calcite-action>`;
+    const { label: e, iconName: o } = y[t], n = this.messages[e];
+    return i`<calcite-action .active=${this.angle === t} alignment=center class="button" data-angle=${t ?? a} .disabled=${this.disabled} @click=${this._onClick.bind(this, t)} @pointerdown=${this._onButtonPointerDown} .text=${n ?? ""} title=${n ?? a}><calcite-icon .icon=${o} .scale=${this.visualScale}></calcite-icon></calcite-action>`;
   }
   _renderCompass() {
-    const t = this.disabled || B(this.view) ? "compass-needle" : "arrow-up", e = this.rotation === 0, i = this.messages.resetHeading;
-    return o`<calcite-action alignment=center class="compass" .disabled=${this.disabled || !this._rotationEnabled || e} @click=${this._onRotationReset} style=${_(this._rotateIcon(this.rotation))} .text=${i ?? ""} title=${i ?? s}>${!e && o`<calcite-icon .icon=${t} .scale=${this.visualScale}></calcite-icon>` || ""}</calcite-action>`;
+    const t = this.disabled || x(this.view) ? "compass-needle" : "arrow-up", e = this.rotation === 0, o = this.messages.resetHeading;
+    return i`<calcite-action alignment=center class="compass" .disabled=${this.disabled || !this._rotationEnabled || e} @click=${this._onRotationReset} style=${w(this._rotateIcon(this.rotation))} .text=${o ?? ""} title=${o ?? a}>${!e && i`<calcite-icon .icon=${t} .scale=${this.visualScale}></calcite-icon>` || ""}</calcite-action>`;
   }
   _renderRotation() {
-    return r("slider-container", o`<calcite-action-bar expand-disabled floating layout=horizontal .scale=${this.visualScale}><calcite-action-group class="rotation-container">${this.showRotationResetButton ? this._renderRotationResetButton() : null}${this._renderRotationSlider()}</calcite-action-group></calcite-action-bar>`);
+    return s("slider-container", i`<calcite-action-bar expand-disabled floating layout=horizontal .scale=${this.visualScale}><calcite-action-group class="rotation-container">${this.showRotationResetButton ? this._renderRotationResetButton() : null}${this._renderRotationSlider()}</calcite-action-group></calcite-action-bar>`);
   }
   _renderRotationResetButton() {
     const t = this.messages.resetHeading;
-    return o`<calcite-action alignment=center class="rotation-reset-button" .disabled=${this.disabled || !this._rotationEnabled} @click=${this._onRotationReset} .text=${t ?? ""} title=${t ?? s}><calcite-icon flip-rtl icon=rotate .scale=${this.visualScale}></calcite-icon></calcite-action>`;
+    return i`<calcite-action alignment=center class="rotation-reset-button" .disabled=${this.disabled || !this._rotationEnabled} @click=${this._onRotationReset} .text=${t ?? ""} title=${t ?? a}><calcite-icon flip-rtl icon=rotate .scale=${this.visualScale}></calcite-icon></calcite-action>`;
   }
   _renderRotationSlider() {
-    return o`<div class="rotation-slider-container"><calcite-slider .ariaLabel=${this.messages.heading} .disabled=${this.disabled || !this._rotationEnabled} label-handles max=360 min=0 required .scale=${this.visualScale} .value=${Math.round(this.rotation)} @calciteSliderInput=${this._onSliderInput}></calcite-slider></div>`;
+    return i`<div class="rotation-slider-container"><calcite-slider .ariaLabel=${this.messages.heading} .disabled=${this.disabled || !this._rotationEnabled} label-handles max=360 min=0 required .scale=${this.visualScale} .value=${Math.round(this.rotation)} @calciteSliderInput=${this._onSliderInput}></calcite-slider></div>`;
   }
 }
-d("arcgis-directional-pad", E);
+l("arcgis-directional-pad", B);
 export {
-  E as ArcgisDirectionalPad
+  B as ArcgisDirectionalPad
 };

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

@@ -1,20 +1,36 @@
 /// <reference path="../../index.d.ts" />
 import type RouteLayer from "@arcgis/core/layers/RouteLayer.js";
-import type PortalItem from "@arcgis/core/portal/PortalItem";
-import type PortalFolder from "@arcgis/core/portal/PortalFolder";
+import type PortalItem from "@arcgis/core/portal/PortalItem.js";
+import type PortalFolder from "@arcgis/core/portal/PortalFolder.js";
 import type { PublicLitElement as LitElement } from "@arcgis/lumina";
 import type { ArcgisReferenceElement, IconName } from "../types.js";
-import type { RouteLayerSolveResult } from "@arcgis/core/layers/types";
+import type { RouteLayerSolveResult } from "@arcgis/core/layers/types.js";
 import type { MapViewOrSceneView } from "@arcgis/core/views/MapViewOrSceneView.js";
 import type { GoToOverride, HeadingLevel } from "@arcgis/core/widgets/support/types.js";
 import type { Icon } from "@esri/calcite-components/components/calcite-icon";
-import type { RouteLayerSolveResult as RouteLayerSolveResult2 } from "@arcgis/core/layers/types.js";
 import type { SearchProperties } from "@arcgis/core/widgets/Search.js";
 import type { State } from "@arcgis/core/widgets/Directions/DirectionsViewModel.js";
 import type { SystemOrLengthUnit } from "@arcgis/core/core/units.js";
 
 /**
  * The Directions component provides a way to calculate directions, between two or more input locations with a [RouteLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/RouteLayer/), using ArcGIS Online and custom Network Analysis Route services.
+ * This component generates a route finding a least-cost path between multiple points using the routing service associated with the assigned RouteLayer. The route is calculated based on the stops and barriers added to the RouteLayer. The component provides a user interface for adding, removing, and reordering stops and barriers. Once the route is solved, the component displays the route on the map and provides turn-by-turn directions in a list format.
+ *
+ * Directions uses the [Search component](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-search/) to locate each stop, either by selecting a point on the map, or by entering a search term into the textbox.
+ * Search uses settings defined in the `Search properties`. This includes the `locationType`, which defines the type of geocoding result that is returned, and defaults to "street".
+ *
+ * Directions requires a RouteLayer to be associated with the `layer` property or using the `useDefaultRouteLayer` property. A RouteLayer can be programmatically created or derived from an external source like a portal item or webmap.
+ * Please note that in order to view or interact with routing inputs and results, the RouteLayer must be added to the map. Routing service and symbology is configured in the layer, specifically the `url` and `defaultSymbols` properties respectively.
+ *
+ * The ArcGIS Online routing service requires authentication. If an API key is specified at the app level (see [Config#apiKey](https://developers.arcgis.com/javascript/latest/references/core/config/#Config-apiKey)) or component level (see [apiKey](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-directions/#apiKey))) then this key will accompany requests to both the routing service and geocoder/reverse-geocoder.
+ * Please refer to the Search component for more information on geocoding.
+ *
+ * Locations on the map can be reverse geocoded and used as stops in the route. Click the button with a crosshairs icon to associate a location with a new or existing stop.  After clicking the button, click the map once. To cancel this process, press the `escape` key.
+ * The resulting driving directions are automatically collapsed and can be optionally saved to a new or existing portal item. This can be achieved programically with `save` and `saveAs`. The `Clear` button calls the `reset()` method, which removes all stops, directions, and the solved route.
+ *
+ * Selecting the `Edit route` button allows you to add/move/remove stops, add/move/remove/reshape polyline barriers, and add/move/remove waypoints. To add a new waypoint, first hover the cursor over the route and select the desired point. Then select and drag the point to move and place the waypoint. By default the route will be automatically resolve at the completion of any editing operation. For more complex routes, it may be advantageous to disable auto-solving and solve as and when needed with the dedicated solve button. Currently, this is only supported in 2D MapViews.
+ *
+ * **Note:** Printing in Directions is in beta and considered experimental. The print preview dialog, in some scenarios, may not display as aniticipated.
  *
  * @since 4.28
  */
@@ -50,6 +66,13 @@ export abstract class ArcgisDirections extends LitElement {
    * @default false
    */
   accessor autoDestroyDisabled: boolean;
+  /**
+   * When `true`, the route will re-solve continuously as an interactive operation is ongoing (e.g., while dragging a stop or waypoint).
+   *
+   * @default false
+   * @since 5.0
+   */
+  accessor autoSolveOnEditActive: boolean;
   /**
    * This function provides the ability to override either the [arcgis-map.goTo()](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-map/#goTo) or [arcgis-scene.goTo()](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-scene/#goTo) methods.
    *
@@ -87,6 +110,13 @@ export abstract class ArcgisDirections extends LitElement {
    * @since 5.0
    */
   accessor hideLayerDetails: boolean;
+  /**
+   * Indicates whether to the Print button will be displayed
+   *
+   * @default false
+   * @since 5.0
+   */
+  accessor hidePrintButton: boolean;
   /**
    * Indicates whether to the Save As button will be displayed
    *
@@ -123,15 +153,36 @@ export abstract class ArcgisDirections extends LitElement {
    *
    * @see [RouteLayer#solve()](https://developers.arcgis.com/javascript/latest/references/core/layers/RouteLayer/#solve)
    */
-  get lastRoute(): RouteLayerSolveResult2 | null | undefined;
+  get lastRoute(): RouteLayerSolveResult | null | undefined;
   /**
    * The [RouteLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/RouteLayer/) associated with the Directions component.
-   * This property is required.
+   * A RouteLayer must be associated with the component in order to solve routes and display results on the map.
+   *
+   * The RouteLayer can be set directly via the `layer` property, or indirectly by setting either the [mapLayerId](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-directions/#mapLayerId) or [routeLayerItemId](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-directions/#routeLayerItemId) properties.
+   * If using the latter, the component will attempt to find and use a layer matching the provided ID from the map or portal item.
+   * If no layer is found and [useDefaultRouteLayer](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-directions/#useDefaultRouteLayer) is not set to `true`, then no RouteLayer will be associated and routing functionality will be unavailable.
    * The RouteLayer contains stops and barriers and will be used to display and solve routes.
    *
-   * @since 4.24
+   * > [!WARNING]
+   * > Use `layer`, `mapLayerId`, and `routeLayerItemId` independently; only one should be set at a time.
    */
   accessor layer: RouteLayer | null | undefined;
+  /**
+   * The layer ID of a route layer in the associated map.
+   * When set, the component will attempt to find and use the layer with the provided ID from the map.
+   *
+   * > [!WARNING]
+   * > Use `layer`, `mapLayerId`, and `routeLayerItemId` independently; only one should be set at a time.
+   *
+   * @since 5.1
+   * @example
+   * ```html
+   * <arcgis-map item-id="28c1e2519ee44e93b42c8adbee0d4dd0">
+   *  <arcgis-directions slot="top-right" map-layer-id="19e2cba6c23-layer-2"></arcgis-directions>
+   * </arcgis-map>
+   * ```
+   */
+  accessor mapLayerId: string | undefined;
   /**
    * The maximum number of stops allowed for routing.
    *
@@ -175,7 +226,11 @@ export abstract class ArcgisDirections extends LitElement {
    * });
    */
   accessor unit: SystemOrLengthUnit;
-  /** @default false */
+  /**
+   * If `true`, a new [RouteLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/RouteLayer/) will be created, added to the map and assigned to the `layer` property.
+   *
+   * @default false
+   */
   accessor useDefaultRouteLayer: boolean;
   /**
    * The view associated with the component. 
@@ -184,13 +239,26 @@ export abstract class ArcgisDirections extends LitElement {
   accessor view: MapViewOrSceneView | null | undefined;
   /** Permanently destroy the component. */
   destroy(): Promise<void>;
+  /** Computes a route and directions. If successfully computed, results will be assigned to the [lastRoute](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-directions/#lastRoute) property. */
   getDirections(): Promise<RouteLayerSolveResult>;
+  /**
+   * Saves the currently assigned [RouteLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/RouteLayer/)
+   * (see [layer](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-directions/#layer)) to an existing portal item.
+   */
   save(): Promise<PortalItem>;
   /**
+   * Saves the currently assigned [RouteLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/RouteLayer/)
+   * (see [layer](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-directions/#layer)) to a new portal item.
+   *
    * @param portalItem
    * @param options
    */
   saveAs(portalItem: PortalItem, options: { folder: PortalFolder; }): Promise<PortalItem>;
+  /** Starts an edit session for interactive addition, modification, and deletion of stops, barriers, and waypoints. */
+  startEditing(): Promise<void>;
+  /** Ends an interactive edit session. */
+  stopEditing(): Promise<void>;
+  /** Zoom so that the entire route is displayed within the current map extent. */
   zoomToRoute(): Promise<void>;
   "@setterTypes": {
     icon?: IconName;