@arcgis/map-components 6.0.0-next.2 → 6.0.0-next.21

package/dist/components/arcgis-time-bar-slider/customElement.js

@@ -1,29 +1,28 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/6.0/LICENSE.txt */
 import { c as d } from "../../chunks/runtime.js";
-import { css as m, html as r } from "lit";
+import { css as m, html as s } from "lit";
 import { ref as u } from "lit/directives/ref.js";
 import l from "@arcgis/core/time/TimeExtent.js";
-import { LitElement as h, nothing as v, safeClassMap as g } from "@arcgis/lumina";
-const w = m`:host{background-color:var(--calcite-color-surface-2);block-size:var(--calcite-size-fixed-xxxl);color:var(--calcite-color-text-1);display:flex;flex:1 0 auto;font-family:var(--calcite-font-family);font-size:var(--calcite-font-size-sm);inline-size:auto;--arcgis-internal-time-bar-slider-tick-gap: 100}.root{align-items:center;block-size:100%;display:flex;inline-size:100%}slot[name=max],slot[name=min]{display:flex}.slider{padding-inline:var(--calcite-spacing-md);--labels-container-width: 100%}.slider-container{flex:1 1 auto;min-inline-size:calc(var(--calcite-spacing-md) * 15)}.slider--has-ticks{margin-top:calc(var(--calcite-spacing-md) * -1)}.hidden,.max-date,.min-date{flex:0 0 auto}.hidden{inline-size:0}.max-date,.min-date{inline-size:calc(var(--calcite-size-md) * 3.125)}.popover{padding:var(--calcite-spacing-xxs) var(--calcite-spacing-xs) var(--calcite-spacing-xs)}.ticks-container{flex:1;position:relative;width:100%;arcgis-ticks,>slot::slotted(arcgis-ticks){inset:0;position:absolute;white-space:nowrap;--arcgis-ticks-font-weight: var(--calcite-font-weight-normal);--arcgis-ticks-label-width: auto;--arcgis-ticks-tick-transform: unset;--arcgis-ticks-tick-width: var(--calcite-size-px)}}.slider.slider--out-of-range{--arcgis-internal-slider-handle-color: var(--calcite-color-status-danger);--arcgis-internal-slider-track-range-background-color: var(--calcite-color-status-danger)}.lock-time-window{--arcgis-internal-time-bar-slider-border-margin: calc(var(--calcite-spacing-base) + 1px);border-image:linear-gradient(transparent var(--arcgis-internal-time-bar-slider-border-margin),var(--calcite-action-group-border-color, var(--calcite-color-border-3)) var(--arcgis-internal-time-bar-slider-border-margin),var(--calcite-action-group-border-color, var(--calcite-color-border-3)) calc(100% - var(--arcgis-internal-time-bar-slider-border-margin)),transparent var(--arcgis-internal-time-bar-slider-border-margin));border-image-slice:1;border-inline-end-style:solid;border-inline-end-width:var(--calcite-border-width-sm);padding-inline-end:var(--calcite-spacing-sm)}`;
-class p extends h {
+import { LitElement as h, createEvent as g, nothing as v, safeClassMap as w } from "@arcgis/lumina";
+import { useDirection as p, usePropertyChange as f } from "@arcgis/lumina/controllers";
+const b = m`:host{background-color:var(--calcite-color-surface-2);block-size:var(--calcite-size-fixed-xxxl);color:var(--calcite-color-text-1);display:flex;flex:1 0 auto;font-family:var(--calcite-font-family);font-size:var(--calcite-font-size-sm);inline-size:auto;--arcgis-internal-time-bar-slider-tick-gap: 100}.root{align-items:center;block-size:100%;display:flex;inline-size:100%}slot[name=max],slot[name=min]{display:flex}.slider{padding-inline:var(--calcite-spacing-xl);--arcgis-internal-slider-track-size: var(--calcite-size-px);--arcgis-slider-track-background-color: var(--calcite-color-border-1);--labels-container-width: 100%}.slider-container{flex:1 1 auto;min-inline-size:calc(var(--calcite-spacing-md) * 15)}.slider--has-ticks{margin-top:calc(var(--calcite-spacing-md) * -1)}.hidden,.max-date,.min-date{flex:0 0 auto}.hidden{inline-size:0}.popover{padding:var(--calcite-spacing-xxs) var(--calcite-spacing-xs) var(--calcite-spacing-xs)}.ticks-container{flex:1;position:relative;width:100%;arcgis-ticks,>slot::slotted(arcgis-ticks){inset:0;position:absolute;white-space:nowrap;--arcgis-internal-ticks-color: var(--calcite-color-text-1);--arcgis-ticks-font-weight: var(--calcite-font-weight-normal);--arcgis-ticks-label-width: auto;--arcgis-ticks-tick-color: var(--calcite-color-border-1);--arcgis-ticks-tick-transform: unset;--arcgis-ticks-tick-width: var(--calcite-size-px)}}.slider.slider--out-of-range{--arcgis-internal-slider-handle-color: var(--calcite-color-status-danger);--arcgis-internal-slider-track-range-background-color: var(--calcite-color-status-danger)}.lock-time-window{--arcgis-internal-time-bar-slider-border-margin: calc(var(--calcite-spacing-base) + 1px);border-image:linear-gradient(transparent var(--arcgis-internal-time-bar-slider-border-margin),var(--calcite-action-group-border-color, var(--calcite-color-border-3)) var(--arcgis-internal-time-bar-slider-border-margin),var(--calcite-action-group-border-color, var(--calcite-color-border-3)) calc(100% - var(--arcgis-internal-time-bar-slider-border-margin)),transparent var(--arcgis-internal-time-bar-slider-border-margin));border-image-slice:1}:dir(ltr){.lock-time-window{border-inline-end-style:solid;border-inline-end-width:var(--calcite-border-width-sm);margin-inline-end:var(--calcite-spacing-sm);padding-inline-end:var(--calcite-spacing-sm)}}:dir(rtl){.lock-time-window{border-inline-start-style:solid;border-inline-start-width:var(--calcite-border-width-sm);margin-inline-start:var(--calcite-spacing-sm);padding-inline-start:var(--calcite-spacing-sm)}}`;
+class k extends h {
   constructor() {
-    super(...arguments), this.#t = new ResizeObserver(([e]) => {
+    super(...arguments), this._direction = p(), this.#t = new ResizeObserver(([e]) => {
       this._sliderWidth = e.contentRect.width;
-    }), this.#a = 100, this.#r = 100, this.#n = (e, i) => i === "value" ? this.viewModel?.formatDateTime(new Date(e)) : void 0, this.autoDestroyDisabled = !1, this.lockTimeWindow = !1, this.popoverDisplay = "none", this.showLockTimeWindow = !1, this.showMax = !1, this.showMin = !1, this.showTicks = !1;
+    }), this.#i = 100, this.#a = 100, this.#s = (e, i) => i === "value" ? this.viewModel?.formatDateTime(new Date(e)) : void 0, this.autoDestroyDisabled = !1, this.lockTimeWindow = !1, this.popoverDisplay = "none", this.showLockTimeWindow = !1, this.showMax = !1, this.showMin = !1, this.showTicks = !1, this.arcgisPropertyChange = f()("activeValue", "lockTimeWindow"), this.arcgisReady = g();
   }
   static {
     this.properties = { _activeValue: 16, _sliderFillPlacement: 16, _sliderWidth: 16, _timeExtentEpochValues: 16, activeValue: 32, autoDestroyDisabled: 5, lockTimeWindow: 5, messages: 0, popoverDisplay: 1, showLockTimeWindow: 5, showMax: 5, showMin: 5, showTicks: 5, viewModel: 0 };
   }
   static {
-    this.styles = w;
+    this.styles = b;
   }
   #t;
-  #i;
-  #s;
   #e;
+  #i;
   #a;
-  #r;
-  #n;
+  #s;
   get _sliderFillPlacement() {
     switch (this.viewModel?.mode) {
       case "cumulative-from-end":
@@ -43,27 +42,27 @@ class p extends h {
     const { fullTimeExtent: i } = e;
     if (!i)
       return;
-    const { start: t, end: s } = i;
-    if (!t || !s)
+    const { start: t, end: a } = i;
+    if (!t || !a)
       return;
-    const { timeExtent: a } = e;
-    if (!a)
+    const { timeExtent: r } = e;
+    if (!r)
       switch (e.mode) {
         case "cumulative-from-end":
         case "instant":
           return [t.getTime()];
         case "cumulative-from-start":
-          return [s.getTime()];
+          return [a.getTime()];
         case "time-window":
-          return [t.getTime(), s.getTime()];
+          return [t.getTime(), a.getTime()];
       }
-    const { start: o, end: n } = a;
+    const { start: o, end: n } = r;
     switch (e.mode) {
       case "cumulative-from-end":
       case "instant":
-        return o ? o.getTime() < t.getTime() ? [t.getTime()] : o.getTime() > s.getTime() ? [s.getTime()] : [o.getTime()] : void 0;
+        return o ? o.getTime() < t.getTime() ? [t.getTime()] : o.getTime() > a.getTime() ? [a.getTime()] : [o.getTime()] : void 0;
       case "cumulative-from-start":
-        return n ? n.getTime() < t.getTime() ? [t.getTime()] : n.getTime() > s.getTime() ? [s.getTime()] : [n.getTime()] : void 0;
+        return n ? n.getTime() < t.getTime() ? [t.getTime()] : n.getTime() > a.getTime() ? [a.getTime()] : [n.getTime()] : void 0;
       case "time-window":
         return o && n ? [o.getTime(), n.getTime()] : void 0;
     }
@@ -88,7 +87,7 @@ class p extends h {
   async destroy() {
     await this.manager.destroy();
   }
-  #o() {
+  #c() {
     return (e) => {
       if (e) {
         this.#e = e, this.#t.observe(e);
@@ -97,28 +96,28 @@ class p extends h {
       this.#e && (this.#t.unobserve(this.#e), this.#e = void 0);
     };
   }
-  #l() {
+  #d() {
     const e = Number.parseInt(window.getComputedStyle(this.el).getPropertyValue("--arcgis-internal-time-bar-slider-tick-gap"), 10);
-    return Number.isFinite(e) && e > 0 ? e : this.#a;
+    return Number.isFinite(e) && e > 0 ? e : this.#i;
   }
-  #c(e, i) {
-    const { viewModel: t } = this, { start: s, end: a } = e;
-    if (!t || !s || !a)
+  #m(e, i) {
+    const { viewModel: t } = this, { start: a, end: r } = e;
+    if (!t || !a || !r)
       return;
-    const n = (a.getTime() - s.getTime()) / i;
-    return t.tickFormats.find(({ duration: c }) => c > this.#l() * n) ?? t.tickFormats.at(-1);
+    const n = (r.getTime() - a.getTime()) / i;
+    return t.tickFormats.find(({ duration: c }) => c > this.#d() * n) ?? t.tickFormats.at(-1);
   }
-  #d() {
+  #u() {
     this.lockTimeWindow = !this.lockTimeWindow;
   }
-  #m(e) {
+  #h(e) {
     this._activeValue = e.target.activeValue;
   }
-  #u(e) {
+  #g(e) {
     const { viewModel: i } = this, t = i?.mode;
-    t && (i.timeExtent = this.#h(e.target.values, t), this._activeValue = e.target.activeValue);
+    t && (i.timeExtent = this.#v(e.target.values, t), this._activeValue = e.target.activeValue);
   }
-  #h([e, i], t) {
+  #v([e, i], t) {
     switch (t) {
       case "cumulative-from-end":
         return new l({ start: new Date(e), end: null });
@@ -130,63 +129,59 @@ class p extends h {
         return new l({ start: new Date(e), end: new Date(i ?? e) });
     }
   }
-  #v() {
+  #r() {
     const { messages: e, showLockTimeWindow: i, viewModel: t } = this;
     if (!e || !i || !t)
       return null;
-    const s = this.lockTimeWindow ? "lock" : "unlock", a = this.lockTimeWindow ? e.unlockTimeWindow : e.lockTimeWindow;
-    return r`<calcite-action .active=${this.lockTimeWindow} class="lock-time-window" .disabled=${t.disabled || t.mode !== "time-window"} .icon=${s} @click=${this.#d} .text=${a} title=${a ?? v}></calcite-action>`;
+    const a = this.lockTimeWindow ? "lock" : "unlock", r = this.lockTimeWindow ? e.unlockTimeWindow : e.lockTimeWindow;
+    return s`<calcite-action .active=${this.lockTimeWindow} class="lock-time-window" .disabled=${!t.interactive || t.mode !== "time-window"} .icon=${a} @click=${this.#u} .text=${r} title=${r ?? v}></calcite-action>`;
   }
-  #g() {
+  #n() {
     const e = this.viewModel?.fullTimeExtent?.end;
-    return this.showMax && e ? r`<slot name=max><arcgis-time-bar-date .autoDestroyDisabled=${this.autoDestroyDisabled} class="max-date" .date=${e} .viewModel=${this.viewModel}></arcgis-time-bar-date></slot>` : r`<div class="hidden"></div>`;
+    return this.showMax && e ? s`<slot name=max><arcgis-time-bar-date .autoDestroyDisabled=${this.autoDestroyDisabled} class="max-date" .date=${e} .viewModel=${this.viewModel}></arcgis-time-bar-date></slot>` : s`<div class="hidden"></div>`;
   }
-  #w() {
+  #o() {
     const e = this.viewModel?.fullTimeExtent?.start;
-    return this.showMin && e ? r`<slot name=min><arcgis-time-bar-date .autoDestroyDisabled=${this.autoDestroyDisabled} class="min-date" .date=${e} .viewModel=${this.viewModel}></arcgis-time-bar-date></slot>` : r`<div class="hidden"></div>`;
+    return this.showMin && e ? s`<slot name=min><arcgis-time-bar-date .autoDestroyDisabled=${this.autoDestroyDisabled} class="min-date" .date=${e} .viewModel=${this.viewModel}></arcgis-time-bar-date></slot>` : s`<div class="hidden"></div>`;
   }
-  #p() {
-    return this.popoverDisplay !== "none" ? r`<div class="popover" slot=popover><slot name=popover>${this.#f()}</slot></div>` : null;
+  #w() {
+    return this.popoverDisplay !== "none" ? s`<div class="popover" slot=popover><slot name=popover>${this.#p()}</slot></div>` : null;
   }
-  #f() {
+  #p() {
     const { activeValue: e, messages: i, viewModel: t } = this;
     if (!e || !i || !t)
       return null;
     switch (t.mode) {
       case "cumulative-from-end":
       case "instant":
-        const s = t.timeExtent?.start;
-        return s ? r`<arcgis-time-bar-date .autoDestroyDisabled=${this.autoDestroyDisabled} .date=${s} .viewModel=${t}></arcgis-time-bar-date>` : null;
+        const a = t.timeExtent?.start;
+        return a ? s`<arcgis-time-bar-date .autoDestroyDisabled=${this.autoDestroyDisabled} .date=${a} .viewModel=${t}></arcgis-time-bar-date>` : null;
       case "cumulative-from-start":
-        const a = t.timeExtent?.end;
-        return a ? r`<arcgis-time-bar-date .autoDestroyDisabled=${this.autoDestroyDisabled} .date=${a} .viewModel=${t}></arcgis-time-bar-date>` : null;
+        const r = t.timeExtent?.end;
+        return r ? s`<arcgis-time-bar-date .autoDestroyDisabled=${this.autoDestroyDisabled} .date=${r} .viewModel=${t}></arcgis-time-bar-date>` : null;
       case "time-window":
-        return e instanceof Date ? r`<arcgis-time-bar-date .autoDestroyDisabled=${this.autoDestroyDisabled} .date=${e} .viewModel=${t}></arcgis-time-bar-date>` : r`<arcgis-time-bar-extent .autoDestroyDisabled=${this.autoDestroyDisabled} .messages=${i} .viewModel=${t}></arcgis-time-bar-extent>`;
+        return e instanceof Date ? s`<arcgis-time-bar-date .autoDestroyDisabled=${this.autoDestroyDisabled} .date=${e} .viewModel=${t}></arcgis-time-bar-date>` : s`<arcgis-time-bar-extent .autoDestroyDisabled=${this.autoDestroyDisabled} .messages=${i} .viewModel=${t}></arcgis-time-bar-extent>`;
     }
   }
-  #b() {
+  #l() {
     const { messages: e, viewModel: i } = this;
-    if (!i?.fullTimeExtent?.start || !i?.fullTimeExtent?.end || !e)
-      return null;
-    const t = this.#c(i.fullTimeExtent, this._sliderWidth ?? this.#r);
-    if (!t)
+    if (!i?.fullTimeExtent?.start || !i?.fullTimeExtent?.end || !e || (i.tickFormat = this.#m(i.fullTimeExtent, this._sliderWidth ?? this.#a), !i.tickFormat))
       return null;
-    (!this.#i || !this.#s || this.#i !== t) && (this.#i = t, this.#s = i.getTickValues(t.timeInterval), i.tickFormat = t.format);
-    const s = i.fullTimeExtent.start.getTime(), a = i.fullTimeExtent.end.getTime();
-    return r`<div class="slider-container" ${u(this.#o())}><arcgis-slider allow-values-overlap .autoDestroyDisabled=${this.autoDestroyDisabled} class=${g({
+    const t = i.fullTimeExtent.start.getTime(), a = i.fullTimeExtent.end.getTime();
+    return s`<div class="slider-container" ${u(this.#c())}><arcgis-slider allow-values-overlap .autoDestroyDisabled=${this.autoDestroyDisabled} class=${w({
       slider: !0,
       "slider--has-ticks": this.showTicks,
       "slider--out-of-range": i.isOutOfRange
-    })} .disabled=${!i.interactive} .fillPlacement=${this._sliderFillPlacement} .labelFormatter=${this.#n} .max=${a} .min=${s} @arcgisActiveValueChange=${this.#m} @arcgisInput=${this.#u} .popoverLabel=${e.timeExtent} .popoverDisplay=${this.popoverDisplay === "none" ? "auto" : this.popoverDisplay} precision=0 .steps=${i.effectiveStopsEpoch} .values=${this._timeExtentEpochValues} .valuesDraggingDisabled=${this.lockTimeWindow}>${this.#p()}${this.#T(i, s, a)}</arcgis-slider></div>`;
+    })} .disabled=${!i.interactive} .fillPlacement=${this._sliderFillPlacement} .labelFormatter=${this.#s} .max=${a} .min=${t} @arcgisActiveValueChange=${this.#h} @arcgisInput=${this.#g} .popoverLabel=${e.timeExtent} .popoverDisplay=${this.popoverDisplay === "none" ? "auto" : this.popoverDisplay} precision=0 .steps=${i.effectiveStopsEpoch} .values=${this._timeExtentEpochValues} .valuesDraggingDisabled=${this.lockTimeWindow}>${this.#w()}${this.#f(i, t, a)}</arcgis-slider></div>`;
   }
-  #T(e, i, t) {
-    return this.showTicks ? r`<div slot=content-end class="ticks-container"><slot name=content-end><arcgis-ticks .autoDestroyDisabled=${this.autoDestroyDisabled} .labelFormatter=${e.tickFormatter} .max=${t} .min=${i} mode=value show-labels .values=${this.#s}></arcgis-ticks></slot></div>` : null;
+  #f(e, i, t) {
+    return this.showTicks ? s`<div slot=content-end class="ticks-container"><slot name=content-end><arcgis-ticks .autoDestroyDisabled=${this.autoDestroyDisabled} .labelFormatter=${e.tickFormatter} .max=${t} .min=${i} mode=value show-labels .values=${e.tickValues}></arcgis-ticks></slot></div>` : null;
   }
   render() {
-    return r`<div class="root">${this.#v()}${this.#w()}${this.#b()}${this.#g()}</div>`;
+    return s`<div class="root">${this._direction === "ltr" ? s`${this.#r()}${this.#o()}${this.#l()}${this.#n()}` : s`${this.#n()}${this.#l()}${this.#o()}${this.#r()}`}</div>`;
   }
 }
-d("arcgis-time-bar-slider", p);
+d("arcgis-time-bar-slider", k);
 export {
-  p as ArcgisTimeBarSlider
+  k as ArcgisTimeBarSlider
 };

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

@@ -6,7 +6,7 @@ import type { PublicLitElement as LitElement } from "@arcgis/lumina";
 import type { ArcgisReferenceElement, IconName } from "../types.js";
 import type { T9nMeta } from "@arcgis/lumina/controllers";
 import type { GoToOverride } from "@arcgis/core/widgets/support/types.js";
-import type { PositionFilterFunction, TrackViewModelState } from "./types.js";
+import type { PositionFilterFunction, State } from "./types.js";
 import type { Button as Button } from "@esri/calcite-components/components/calcite-button";
 
 /**
@@ -183,7 +183,7 @@ export abstract class ArcgisTrack extends LitElement {
    *   const geofenceExtent = new Extent({
    *     // whatever
    *   });
-   *   return geometryEngine.within(myLocation, geofenceExtent);
+   *   return withinExecute(myLocation, geofenceExtent);
    * };
    */
   accessor positionFilterFunction: PositionFilterFunction | undefined;
@@ -220,7 +220,7 @@ export abstract class ArcgisTrack extends LitElement {
    *
    * @default "disabled"
    */
-  get state(): TrackViewModelState;
+  get state(): State;
   /**
    * Indicates whether new positions are being watched.
    *

package/dist/components/arcgis-track/types.d.ts

@@ -4,7 +4,7 @@
  */
 export type PositionFilterFunction = (args: { position: FilterPosition; }) => boolean;
 
-export type TrackViewModelState = "disabled" | "error" | "feature-unsupported" | "ready" | "tracking" | "waiting";
+export type State = "disabled" | "error" | "feature-unsupported" | "ready" | "tracking" | "waiting";
 
 export interface FilterPosition {
   timestamp: number;

package/dist/components/arcgis-utility-network-trace-aggregated-geometry-result-item/customElement.d.ts

@@ -9,9 +9,62 @@ import type { UtilityNetworkTraceResultItemState } from "../arcgis-utility-netwo
 import type { T9nMeta } from "@arcgis/lumina/controllers";
 
 /**
- * Trace result item for displaying [aggregated geometry](https://developers.arcgis.com/javascript/latest/references/core/rest/networks/support/TraceResult/#aggregatedGeometry) results from a trace.
+ * The Utility Network Trace Aggregated Geometry Result Item component displays the
+ * [aggregated geometry](https://developers.arcgis.com/javascript/latest/references/core/rest/networks/support/TraceResult/#aggregatedGeometry)
+ * returned by a utility network trace. It creates graphics for the result's line, multipoint, and polygon geometries
+ * and displays them in the view. Provides options to show or hide the graphics, change their color and size.
+ *
+ * Add this component directly to the default slot of [arcgis-utility-network-trace-results](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-results/).
+ * The parent supplies the required read-only properties for the
+ * [trace result](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-aggregated-geometry-result-item/#traceResult) and
+ * [MapView](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-aggregated-geometry-result-item/#view).
+ *
+ * By default, the [arcgis-utility-network-trace-results](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-results/) component displays the
+ * [aggregated geometry](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-aggregated-geometry-result-item/),
+ * [elements](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-elements-result-item/), and
+ * [functions](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-functions-result-item/) result items for the result types
+ * returned by the trace. Adding content to its default slot replaces all default result items. Add each result item
+ * that the custom configuration should display.
+ *
+ * By default, the component creates and manages a graphics layer. Set
+ * [graphicsLayer](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-aggregated-geometry-result-item/#graphicsLayer) to render the
+ * aggregated geometry graphics in an existing layer instead.
  *
  * @since 5.2
+ * @example
+ * The following example displays aggregated geometry in a custom set of trace result items.
+ * Providing result items in the default slot replaces the parent's default result items.
+ * This example displays only aggregated geometry results.
+ * ```html
+ * <arcgis-map item-id="471eb0bf37074b1fbb972b1da70fb310">
+ *   <arcgis-utility-network-trace-analysis slot="bottom-left">
+ *     <arcgis-utility-network-trace-results slot="results">
+ *       <arcgis-utility-network-trace-aggregated-geometry-result-item>
+ *       </arcgis-utility-network-trace-aggregated-geometry-result-item>
+ *     </arcgis-utility-network-trace-results>
+ *   </arcgis-utility-network-trace-analysis>
+ * </arcgis-map>
+ * ```
+ * @example
+ * Customize the color and size of the aggregated geometry graphics. Setting `hide-graphics` initially hides the
+ * graphics from the map. Users can show them with the component's toggle.
+ * ```html
+ * <arcgis-map item-id="471eb0bf37074b1fbb972b1da70fb310">
+ *   <arcgis-utility-network-trace-analysis slot="bottom-left">
+ *     <arcgis-utility-network-trace-results slot="results">
+ *       <arcgis-utility-network-trace-aggregated-geometry-result-item
+ *         graphics-color="rgba(0, 122, 194, 0.6)"
+ *         selection-size="8"
+ *         hide-graphics
+ *       ></arcgis-utility-network-trace-aggregated-geometry-result-item>
+ *     </arcgis-utility-network-trace-results>
+ *   </arcgis-utility-network-trace-analysis>
+ * </arcgis-map>
+ * ```
+ * @see [arcgis-utility-network-trace-results](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-results/)
+ * @see [arcgis-utility-network-trace-analysis](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-analysis/)
+ * @see [arcgis-utility-network-trace-elements-result-item](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-elements-result-item/)
+ * @see [arcgis-utility-network-trace-functions-result-item](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-functions-result-item/)
  * @see [Result types](https://doc.esri.com/en/arcgis-pro/latest/help/data/utility-network/configure-a-trace.html#DA5)
  */
 export abstract class ArcgisUtilityNetworkTraceAggregatedGeometryResultItem extends LitElement {
@@ -57,23 +110,39 @@ export abstract class ArcgisUtilityNetworkTraceAggregatedGeometryResultItem exte
    * @default false
    */
   get emitsArcgisResultReady(): true;
-  /** The graphics which represent the aggregated geometry results from the trace. */
+  /**
+   * The graphics created from the line, multipoint, and polygon geometries in the aggregated geometry result.
+   *
+   * Read this property after
+   * [@arcgisResultReady](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-aggregated-geometry-result-item/#event-arcgisResultReady) fires.
+   */
   get geometryGraphics(): Graphic[];
   /**
-   * The color used for the aggregated geometry graphics.
-   * Default value is #FFFF00.
+   * The color of the aggregated geometry graphics.
+   * The default is yellow with 0.6 opacity.
+   *
+   * @see [Color constructor](https://developers.arcgis.com/javascript/latest/references/core/Color/#constructors-summary)
    */
   accessor graphicsColor: Color;
   /**
-   * The layer used to render the graphics which represent the aggregated geometry result.
-   * If this property is not specified, a new layer will be created on the map.
+   * The layer used to render the aggregated geometry graphics.
+   *
+   * When the result is cleared or the component is destroyed:
+   *
+   * - If the layer is provided by the application, the component removes only the aggregated geometry graphics it
+   *   created. The layer and any other graphics remain unchanged.
+   * - If no layer is provided, the component creates and manages a layer. It removes the aggregated geometry graphics
+   *   and the component-owned layer from the map.
    */
   accessor graphicsLayer: GraphicsLayer | undefined;
-  /** The heading of the result item. */
+  /** The heading displayed above the aggregated geometry controls. */
   accessor heading: string | undefined;
   /**
-   * Whether to hide the aggregated geometry [graphics](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-aggregated-geometry-result-item/#geometryGraphics)
-   * from the map when the trace result contains aggregated geometry results.
+   * Whether to hide the aggregated geometry graphics from the map.
+   *
+   * When true, the graphics remain available through
+   * [geometryGraphics](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-aggregated-geometry-result-item/#geometryGraphics) but are removed
+   * from the [graphicsLayer](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-aggregated-geometry-result-item/#graphicsLayer).
    *
    * @default false
    */
@@ -92,28 +161,36 @@ export abstract class ArcgisUtilityNetworkTraceAggregatedGeometryResultItem exte
       showGraphics?: string | undefined;
   };
   /**
-   * The size of the aggregated geometry graphics to render, in points.
+   * The marker size and line or polygon-outline width of the aggregated geometry graphics, in points.
+   * The default is 12.
    *
    * @default 12
    */
   accessor selectionSize: number;
   /**
-   * Whether the component has finished adding aggregated geometry graphics to the map.
+   * The processing state of the aggregated geometry result item: `"loading"` while processing a trace result and
+   * `"ready"` when no processing is in progress.
    *
    * @default "ready"
    */
   get state(): UtilityNetworkTraceResultItemState;
-  /** The trace result containing the aggregated geometry result to render graphics for. */
+  /** The trace result containing the aggregated geometry to display. */
   get traceResult(): TraceResult | undefined;
   /**
-   * 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-utility-network-trace-aggregated-geometry-result-item component will be associated with a map or scene component rather than using the `view` property.
+   * The MapView supplied by the parent [arcgis-utility-network-trace-results](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-results/) component.
+   * Used to display the aggregated geometry graphics.
    */
   get view(): MapView | undefined;
   /**
    * Removes the aggregated geometry graphics from the
    * [graphicsLayer](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-aggregated-geometry-result-item/#graphicsLayer).
-   * If the layer was created by the component, it is also removed from the map.
+   * If the layer was created by the component, it is also removed from the map. The method clears
+   * [geometryGraphics](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-aggregated-geometry-result-item/#geometryGraphics) and resets
+   * [state](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-aggregated-geometry-result-item/#state) to `"ready"`.
+   *
+   * This method does not clear the parent-provided
+   * [traceResult](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-aggregated-geometry-result-item/#traceResult) or emit
+   * [@arcgisResultReady](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-aggregated-geometry-result-item/#event-arcgisResultReady).
    */
   clearResult(): void;
   /** Permanently destroy the component. */
@@ -121,13 +198,16 @@ export abstract class ArcgisUtilityNetworkTraceAggregatedGeometryResultItem exte
   /** 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: "hideGraphics" | "geometryGraphics" | "graphicsColor" | "selectionSize" | "state"; }>;
   /**
-   * Fires when the component finishes processing the aggregated geometry results.
+   * Fires when the component finishes processing the current trace result.
    *
-   * If the component has a valid trace result with aggregated geometry results, this fires
-   * when the aggregated geometry graphics have been added to the map.
+   * For a result with aggregated geometry, the event fires after the graphics are created and, unless
+   * [hideGraphics](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-aggregated-geometry-result-item/#hideGraphics) is `true`, added to
+   * the map. The event also fires when processing completes without graphics because the result, aggregated geometry,
+   * or map view is unavailable.
    *
-   * If the component does not have a valid map or trace result, this fires when the
-   * component has finished loading.
+   * Clearing a result with
+   * [clearResult()](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-aggregated-geometry-result-item/#clearResult) does not emit this
+   * event.
    */
   readonly arcgisResultReady: import("@arcgis/lumina").TargetedEvent<this, void>;
   readonly "@eventTypes": {

package/dist/components/arcgis-utility-network-trace-analysis/customElement.d.ts

@@ -93,7 +93,6 @@ import type { UtilityNetworkTraceAnalysisState } from "@arcgis/core/networks/Uti
  * @slot
  * [results] - Slot for instances of [arcgis-utility-network-trace-results](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-results/),
  * for displaying the results of one or more traces.
- * @internal
  * @since 5.0
  */
 export abstract class ArcgisUtilityNetworkTraceAnalysis extends LitElement {
@@ -320,13 +319,18 @@ export abstract class ArcgisUtilityNetworkTraceAnalysis extends LitElement {
    */
   accessor hidePlaceholder: boolean;
   /**
-   * Indicates whether default actions are disabled (hidden) when viewing trace result features.
+   * Indicates whether default actions are disabled (hidden) when
+   * selecting trace locations and viewing trace result features.
    * This property must be set to `true` to disable default actions.
    *
    * @default false
    */
   accessor includeDefaultActionsDisabled: boolean;
-  /** The component's default label. */
+  /**
+   * The component's default label.
+   *
+   * @deprecated since 5.2. This property has no effect.
+   */
   accessor label: string | undefined;
   /**
    * Replace localized message strings with your own strings.
@@ -402,7 +406,7 @@ export abstract class ArcgisUtilityNetworkTraceAnalysis extends LitElement {
    */
   readonly arcgisHideGraphicsChange: import("@arcgis/lumina").TargetedEvent<this, boolean>;
   /** 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: "aggregatedGeometryResultsGraphicsColor" | "hideGraphics"; }>;
+  readonly arcgisPropertyChange: import("@arcgis/lumina").TargetedEvent<this, { name: "aggregatedGeometryResultsGraphicsColor" | "hideGraphics" | "state" | "traceError" | "traceResult"; }>;
   /** Emitted when the component associated with a map or scene view is ready for user interaction. */
   readonly arcgisReady: import("@arcgis/lumina").TargetedEvent<this, void>;
   /**
@@ -446,7 +450,7 @@ export abstract class ArcgisUtilityNetworkTraceAnalysis extends LitElement {
    */
   readonly arcgisTraceLocationSelectStart: import("@arcgis/lumina").TargetedEvent<this, SelectStartPayload>;
   /**
-   * Fires when the trace result is cleared from the results tab.
+   * Fires when trace results and errors are cleared from the results tab.
    *
    * @example
    * ```js