@arcgis/map-components 5.2.0-next.160 → 5.2.0-next.162

package/dist/components/arcgis-sketch/toolbar-sizing-controller.d.ts

@@ -0,0 +1,96 @@
+import type SketchViewModel from "@arcgis/core/widgets/Sketch/SketchViewModel.js";
+import type { LitElement } from "@arcgis/lumina";
+import type { GenericController } from "@arcgis/lumina/controllers";
+
+/**
+ * Offers Sketch's toolbar a main-axis budget when Sketch is directly slotted into a map or scene corner.
+ * The toolbar's own responsive layout decides how to arrange its tools within that budget.
+ *
+ * This controller measures the size of all of the view's slotted content, figures out which items would
+ * potentially overlap the toolbar, and uses that information to determine the actual available space.
+ *
+ * @internal
+ */
+export class ToolbarSizingController extends GenericController<void, HostElement> {
+  constructor(component: HostElement);
+  /**
+   * JSX ref for Sketch's toolbar stack.
+   *
+   * @param element
+   */
+  ref(element?: HTMLElement): void;
+}
+
+/**
+ * Calculates the available space (budget) along the toolbar's main axis within its given slot.
+ *
+ * budget = view length - (a) anchored inset - (b) same-slot reserve - (c) opposite reserve - optional opposite gap.
+ *
+ * The anchored inset includes preceding same-slot controls. The same-slot reserve covers following controls.
+ * Opposite-slot controls reserve space only if they overlap the toolbar on its cross axis.
+ *
+ * ```text
+ * Horizontal Sketch in the bottom-left corner; main axis ->
+ *
+ * +------------------------------ VIEW ----------------------------------+
+ * |                            +-------------------------------------+   |
+ * |                            |        DOES NOT BLOCK SKETCH        |   |
+ * |                            +-------------------------------------+   |
+ * |                                                                      |
+ * |              +========================+                              |
+ * |  +--------+  |     SKETCH'S SPACE     |  +-------+     +----------+  |
+ * |  | BEFORE |  | tools fit / wrap here  |  | AFTER |     | OBSTACLE |  |
+ * |  +--------+  +========================+  +-------+     +----------+  |
+ * +----------------------------------------------------------------------+
+ *    preceding      available budget        following       opposite
+ *    controls                               controls        control
+ *
+ * |<---- (a) --->|<------ budget --------->|<- (b) ->| gap |<-- (c) -->| |
+ * |<------------------------- view length ------------------------------>|
+ *
+ * (a) Anchored inset: view edge -> Sketch, including preceding controls.
+ * (b) Same-slot reserve: following controls and trailing margins.
+ * (c) Opposite reserve: obstacle -> far view edge, including its outer inset.
+ * ```
+ *
+ * Right/bottom anchoring mirrors the main-axis accounting; vertical layout uses height instead of width.
+ * The diagram shows the maximum budget, not the toolbar's actual rendered length.
+ *
+ * @param parameter0
+ * @returns A nonnegative length in CSS pixels, including zero when obstacles exhaust the available space.
+ * @internal
+ */
+export function calculateAvailableToolbarSpace(parameter0: ToolbarSizingMeasurements): number;
+
+/** The Sketch component that owns the toolbar stack. */
+export type HostElement = LitElement
+  & {
+  el: HTMLElement;
+  layout: Layout;
+  view?: SketchViewModel["view"];
+};
+
+export type ToolbarSizingMeasurements = {
+  /** Other-slot content; same-slot siblings are accounted for separately. */
+  content: ContentSizeAndPosition[];
+  /** Separation from overlapping opposite-corner content, not the view's outer margin. */
+  gap: number;
+  layout: Layout;
+  position: ScreenPosition;
+  /** Space occupied after Sketch in its slot's main-axis flow, including margins. */
+  sameSlotReserve: number;
+  toolbarBounds: Bounds;
+  viewBounds: Bounds;
+};
+
+export type Layout = "horizontal" | "vertical";
+
+export type ScreenPosition = "bottom-left" | "bottom-right" | "top-left" | "top-right";
+
+export type Bounds = Pick<DOMRect, "bottom" | "height" | "left" | "right" | "top" | "width">;
+
+/** An obstacle in another view slot. */
+export type ContentSizeAndPosition = {
+  bounds: Bounds;
+  position: ScreenPosition;
+};

package/dist/components/arcgis-time-bar-slider/customElement.d.ts

@@ -274,4 +274,12 @@ export abstract class ArcgisTimeBarSlider extends LitElement {
   accessor viewModel: TimeBarViewModel | undefined;
   /** Permanently destroy the component. */
   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: "activeValue" | "lockTimeWindow"; }>;
+  /** 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: ArcgisTimeBarSlider["arcgisPropertyChange"]["detail"];
+    arcgisReady: ArcgisTimeBarSlider["arcgisReady"]["detail"];
+  };
 }

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

@@ -1,28 +1,28 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
 import { c as d } from "../../chunks/runtime.js";
-import { css as m, html as a } 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 g, safeClassMap as v } from "@arcgis/lumina";
-import { useDirection as w } from "@arcgis/lumina/controllers";
-const p = 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 f 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._direction = w(), this.#t = new ResizeObserver(([e]) => {
+    super(...arguments), this._direction = p(), this.#t = new ResizeObserver(([e]) => {
       this._sliderWidth = e.contentRect.width;
-    }), this.#i = 100, this.#s = 100, this.#a = (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 = p;
+    this.styles = b;
   }
   #t;
   #e;
   #i;
-  #s;
   #a;
+  #s;
   get _sliderFillPlacement() {
     switch (this.viewModel?.mode) {
       case "cumulative-from-end":
@@ -42,8 +42,8 @@ class f 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: r } = e;
     if (!r)
@@ -52,17 +52,17 @@ class f extends h {
         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 } = 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;
     }
@@ -101,10 +101,10 @@ class f extends h {
     return Number.isFinite(e) && e > 0 ? e : this.#i;
   }
   #m(e, i) {
-    const { viewModel: t } = this, { start: s, end: r } = e;
-    if (!t || !s || !r)
+    const { viewModel: t } = this, { start: a, end: r } = e;
+    if (!t || !a || !r)
       return;
-    const n = (r.getTime() - s.getTime()) / i;
+    const n = (r.getTime() - a.getTime()) / i;
     return t.tickFormats.find(({ duration: c }) => c > this.#d() * n) ?? t.tickFormats.at(-1);
   }
   #u() {
@@ -133,19 +133,19 @@ class f extends h {
     const { messages: e, showLockTimeWindow: i, viewModel: t } = this;
     if (!e || !i || !t)
       return null;
-    const s = this.lockTimeWindow ? "lock" : "unlock", r = this.lockTimeWindow ? e.unlockTimeWindow : e.lockTimeWindow;
-    return a`<calcite-action .active=${this.lockTimeWindow} class="lock-time-window" .disabled=${!t.interactive || t.mode !== "time-window"} .icon=${s} @click=${this.#u} .text=${r} title=${r ?? g}></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>`;
   }
   #n() {
     const e = this.viewModel?.fullTimeExtent?.end;
-    return this.showMax && e ? a`<slot name=max><arcgis-time-bar-date .autoDestroyDisabled=${this.autoDestroyDisabled} class="max-date" .date=${e} .viewModel=${this.viewModel}></arcgis-time-bar-date></slot>` : a`<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>`;
   }
   #o() {
     const e = this.viewModel?.fullTimeExtent?.start;
-    return this.showMin && e ? a`<slot name=min><arcgis-time-bar-date .autoDestroyDisabled=${this.autoDestroyDisabled} class="min-date" .date=${e} .viewModel=${this.viewModel}></arcgis-time-bar-date></slot>` : a`<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>`;
   }
   #w() {
-    return this.popoverDisplay !== "none" ? a`<div class="popover" slot=popover><slot name=popover>${this.#p()}</slot></div>` : null;
+    return this.popoverDisplay !== "none" ? s`<div class="popover" slot=popover><slot name=popover>${this.#p()}</slot></div>` : null;
   }
   #p() {
     const { activeValue: e, messages: i, viewModel: t } = this;
@@ -154,34 +154,34 @@ class f extends h {
     switch (t.mode) {
       case "cumulative-from-end":
       case "instant":
-        const s = t.timeExtent?.start;
-        return s ? a`<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 r = t.timeExtent?.end;
-        return r ? a`<arcgis-time-bar-date .autoDestroyDisabled=${this.autoDestroyDisabled} .date=${r} .viewModel=${t}></arcgis-time-bar-date>` : null;
+        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 ? a`<arcgis-time-bar-date .autoDestroyDisabled=${this.autoDestroyDisabled} .date=${e} .viewModel=${t}></arcgis-time-bar-date>` : a`<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>`;
     }
   }
   #l() {
     const { messages: e, viewModel: i } = this;
-    if (!i?.fullTimeExtent?.start || !i?.fullTimeExtent?.end || !e || (i.tickFormat = this.#m(i.fullTimeExtent, this._sliderWidth ?? this.#s), !i.tickFormat))
+    if (!i?.fullTimeExtent?.start || !i?.fullTimeExtent?.end || !e || (i.tickFormat = this.#m(i.fullTimeExtent, this._sliderWidth ?? this.#a), !i.tickFormat))
       return null;
-    const t = i.fullTimeExtent.start.getTime(), s = i.fullTimeExtent.end.getTime();
-    return a`<div class="slider-container" ${u(this.#c())}><arcgis-slider allow-values-overlap .autoDestroyDisabled=${this.autoDestroyDisabled} class=${v({
+    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.#a} .max=${s} .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, s)}</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>`;
   }
   #f(e, i, t) {
-    return this.showTicks ? a`<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;
+    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 a`<div class="root">${this._direction === "ltr" ? a`${this.#r()}${this.#o()}${this.#l()}${this.#n()}` : a`${this.#n()}${this.#l()}${this.#o()}${this.#r()}`}</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", f);
+d("arcgis-time-bar-slider", k);
 export {
-  f as ArcgisTimeBarSlider
+  k as ArcgisTimeBarSlider
 };

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 {