@arcgis/map-components 5.2.0-next.8 → 5.2.0-next.84

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

@@ -0,0 +1,389 @@
+/// <reference path="../../index.d.ts" />
+import type Color from "@arcgis/core/Color.js";
+import type Graphic from "@arcgis/core/Graphic.js";
+import type MapView from "@arcgis/core/views/MapView.js";
+import type { PublicLitElement as LitElement } from "@arcgis/lumina";
+import type { ArcgisReferenceElement } from "../types.js";
+import type { SelectStartPayload } from "../arcgis-utility-network-trace-location-next/customElement.js";
+import type { ArcgisUtilityNetworkTraceResultsNext } from "../arcgis-utility-network-trace-results-next/customElement.js";
+import type { T9nMeta } from "@arcgis/lumina/controllers";
+import type { UtilityNetworkTraceAnalysisState } from "@arcgis/core/networks/UtilityNetworkTraceAnalysis.js";
+
+/**
+ * ## Overview
+ *
+ * > [!WARNING]
+ * > This component is the successor to the `utility-network-trace-analysis` component.
+ * > The `utility-network-trace-analysis` component is being substantially refactored to expose public trace sub-components in release 5.2 and 6.0.
+ * > To avoid destabilizing the public version of `utility-network-trace-analysis`, the refactoring work is being performed in this component.
+ * > At release, this "next" component will replace the original.
+ *
+ * The Utility Network Trace Analysis component allows users to run traces and view trace results in a utility network.
+ *
+ * - The component supports selecting a utility network and a named trace configuration in that utility network. Both the utility network and trace configuration must be [stored in the map](https://developers.arcgis.com/javascript/latest/references/core/WebMap/#utilityNetworks).
+ * - Trace locations (starting points, stopping points, and barriers) are set by selecting features on the view.
+ * - When a subnetwork-based trace is selected, the component displays the domain, tier, and target tier specified by the selected named trace configuration.
+ * - If the user selects a subnetwork trace with a specified subnetwork name, the component provides an option to choose a subnetwork name instead of starting location(s) to run the trace with.
+ *
+ * Supported trace types are: `connected`, `upstream`, `downstream`, `shortest-path` (deprecated), `path`, `subnetwork`, `subnetwork-controller`, `loops`, and `isolation`.
+ *
+ * > [!WARNING]
+ * >
+ * > The [shortest path trace type](https://pro.arcgis.com/en/pro-app/latest/help/data/trace-network/discover-the-shortest-path.htm) is deprecated with ArcGIS Pro 3.7 and ArcGIS Enterprise 12.1.
+ * >
+ * > While the shortest path trace will continue to function and be an option until the next major release, it is recommended to use the path trace to return the shortest path.
+ * > The path trace provides the same functionality to return a shortest path result while offering additional capabilities to find paths in your network.
+ *
+ * The component can display the following from a trace result: elements (as [features](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-analysis-next/#traceResultFeatures)), aggregated geometries, and function results.
+ * If the trace result includes elements that originate from a [feature layer](https://developers.arcgis.com/javascript/latest/references/core/layers/FeatureLayer/)
+ * that is not included in the map, the Results tab displays an `Unknown` layer with a count of those elements.
+ * The component's [traceResultFeatures](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-analysis-next/#traceResultFeatures) property also does not include these elements.
+ *
+ * > [!WARNING]
+ * >
+ * > The Utility Network Trace Analysis component does not support the following:
+ * >
+ * > 1. Proxied feature services or feature services that utilize stored credentials.
+ * > 2. The `circuit` trace type or the `paths` and `circuits` result types.
+ * > 3. Setting grouping properties `firstUnit` and `lastUnit` for trace locations in a [telecom domain network](https://pro.arcgis.com/en/pro-app/latest/help/data/utility-network/telecom-domain-networks.htm).
+ * >    If a [grouped object](https://doc.esri.com/en/arcgis-pro/latest/help/data/utility-network/grouping.html) is used as a trace location, its `firstUnit` and `lastUnit` attributes are not used in the trace.
+ *
+ * ## Working with nonspatial objects
+ *
+ * The Utility Network Trace Analysis component supports selecting nonspatial objects as trace locations by traversing associations.
+ *
+ * When selecting a trace location or viewing a trace result feature, information about the feature is displayed according to the
+ * [PopupTemplate](https://developers.arcgis.com/javascript/latest/references/core/PopupTemplate/) of the layer that the feature belongs to.
+ * If the feature's layer has no PopupTemplate, a default template is used to display the feature's attributes.
+ *
+ * To select a nonspatial object as a trace location, first select a spatial feature on the map that is associated with the target nonspatial object.
+ * The spatial feature's layer must have a PopupTemplate that includes a [UtilityNetworkAssociationsContent](https://developers.arcgis.com/javascript/latest/references/core/popup/content/UtilityNetworkAssociationsContent/).
+ * Navigate through the spatial feature's associations to the target nonspatial object, then add the object as a trace location.
+ *
+ * ## Examples
+ *
+ * This component can be used slotted into an [arcgis-map](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-map/):
+ *
+ * ```html
+ * <arcgis-map item-id="471eb0bf37074b1fbb972b1da70fb310">
+ *   <arcgis-utility-network-trace-analysis-next slot="bottom-left"></arcgis-utility-network-trace-analysis-next>
+ * </arcgis-map>
+ * ```
+ *
+ * Alternatively, this component can be used outside of a map by providing a [referenceElement](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-analysis-next/#referenceElement):
+ *
+ * ```html
+ * <calcite-shell>
+ *   <calcite-shell-panel slot="panel-start" position="start" width-scale="l">
+ *     <arcgis-utility-network-trace-analysis-next reference-element="#map-element"></arcgis-utility-network-trace-analysis-next>
+ *   </calcite-shell-panel>
+ *   <arcgis-map id="map-element" item-id="471eb0bf37074b1fbb972b1da70fb310"></arcgis-map>
+ * </calcite-shell>
+ * ```
+ *
+ * Note: Sign in to access the data in this demo, U/P: `viewer01`/`I68VGU^nMurF`
+ *
+ * @internal
+ * @since 5.0
+ */
+export abstract class ArcgisUtilityNetworkTraceAnalysisNext extends LitElement {
+  /** @internal */
+  protected _messages: {
+      buttons: {
+          clearResultsCustom: string;
+          clearResultsGeneric: string;
+          getResults: string;
+      };
+      componentLabel: string;
+      errors: {
+          loadErrors: {
+              noUserTypeExtension: string;
+              noUtilityNetwork: string;
+              noView: string;
+              sceneViewNotSupported: string;
+          };
+          missingTerminalBody: string;
+          missingTerminalTitle: string;
+          noStartingPointsBody: string;
+          noStartingPointsTitle: string;
+      };
+      labels: {
+          traceConfiguration: string;
+          traceInputs: string;
+          utilityNetwork: string;
+      };
+      runningTrace: string;
+      tabs: {
+          inputTab: string;
+          resultsTab: string;
+      };
+  } & T9nMeta<{
+      buttons: {
+          clearResultsCustom: string;
+          clearResultsGeneric: string;
+          getResults: string;
+      };
+      componentLabel: string;
+      errors: {
+          loadErrors: {
+              noUserTypeExtension: string;
+              noUtilityNetwork: string;
+              noView: string;
+              sceneViewNotSupported: string;
+          };
+          missingTerminalBody: string;
+          missingTerminalTitle: string;
+          noStartingPointsBody: string;
+          noStartingPointsTitle: string;
+      };
+      labels: {
+          traceConfiguration: string;
+          traceInputs: string;
+          utilityNetwork: string;
+      };
+      runningTrace: string;
+      tabs: {
+          inputTab: string;
+          resultsTab: string;
+      };
+  }>;
+  /**
+   * The color used to render graphics for aggregated geometries in trace results, specified as a
+   * [Color](https://developers.arcgis.com/javascript/latest/references/core/Color/) object.
+   *
+   * Aggregated geometry is only rendered if the trace configuration specifies aggregated geometry as a result type.
+   *
+   * Default color is #FFFF00.
+   *
+   * @example
+   * Set the default aggregated geometry graphics color to lime green.
+   * ```js
+   * const traceElement = document.querySelector("arcgis-utility-network-trace-analysis-next");
+   * traceElement.aggregatedGeometryGraphicsColor = new Color("lime");
+   * ```
+   * @see [Color constructor](https://developers.arcgis.com/javascript/latest/references/core/Color/#constructors-summary)
+   */
+  accessor aggregatedGeometryGraphicsColor: Color;
+  /**
+   * If true, the component will not be destroyed automatically when it is
+   * disconnected from the document. This is useful when you want to move the
+   * component to a different place on the page, or temporarily hide it. If this
+   * is set, make sure to call the [destroy()](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-analysis-next/#destroy) method when you are done to
+   * prevent memory leaks.
+   *
+   * @default false
+   */
+  accessor autoDestroyDisabled: boolean;
+  /**
+   * A function to run before trace location selection starts.
+   *
+   * @internal
+   * @example
+   * ```js
+   * const traceElement = document.querySelector("arcgis-utility-network-trace-analysis-next");
+   * traceElement.beforeTraceLocationSelectStart = async () => await doAsyncWork();
+   * ```
+   */
+  accessor beforeTraceLocationSelectStart: (() => Promise<void>) | undefined;
+  /**
+   * Whether to disable highlighting trace result features on the map.
+   *
+   * If true, the features returned by a trace will not be highlighted on the map.
+   *
+   * @default false
+   * @example
+   * Disable highlighting trace result features.
+   * ```html
+   * <arcgis-map item-id="471eb0bf37074b1fbb972b1da70fb310">
+   *   <arcgis-utility-network-trace-analysis-next disable-highlight-feature-results slot="top-right">
+   *   </arcgis-utility-network-trace-analysis-next>
+   * </arcgis-map>
+   * ```
+   */
+  accessor disableHighlightFeatureResults: boolean;
+  /**
+   * Indicates whether to hide the action bar that holds the feature's
+   * [actions](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-features/#actions)
+   * when selecting trace locations and viewing trace result features.
+   *
+   * @default false
+   * @internal
+   */
+  accessor hideActionBar: boolean;
+  /**
+   * Whether to hide feature results in the results tab.
+   *
+   * If true, when features are returned by a trace, they will not be visible in the results tab.
+   * A message will be displayed in its place indicating that features were returned by the trace, but are not visible in the results pane.
+   * This string can be overridden with the `messageOverrides` property.
+   *
+   * @default false
+   * @example
+   * Do not show features in the results tab.
+   * ```html
+   * <arcgis-map item-id="471eb0bf37074b1fbb972b1da70fb310">
+   *   <arcgis-utility-network-trace-analysis-next hide-feature-results slot="top-right">
+   *   </arcgis-utility-network-trace-analysis-next>
+   * </arcgis-map>
+   * ```
+   * @example
+   * Override the message displayed in the results tab when features are hidden.
+   * ```js
+   * const traceElement = document.querySelector("arcgis-utility-network-trace-analysis-next");
+   * traceElement.messageOverrides = { resultFeaturesAreHidden: "Feature results were sent to the results window." };
+   * ```
+   */
+  accessor hideFeatureResults: boolean;
+  /** The component's default label. */
+  accessor label: string | undefined;
+  /**
+   * Replace localized message strings with your own strings.
+   *
+   * _**Note**: Individual message keys may change between releases._
+   */
+  accessor messageOverrides: NonNullable<ArcgisUtilityNetworkTraceResultsNext["messageOverrides"]> & {
+      buttons?: {
+          clearResultsCustom?: string | undefined;
+          clearResultsGeneric?: string | undefined;
+          getResults?: string | undefined;
+      } | undefined;
+      componentLabel?: string | undefined;
+      errors?: {
+          loadErrors?: {
+              noUserTypeExtension?: string | undefined;
+              noUtilityNetwork?: string | undefined;
+              noView?: string | undefined;
+              sceneViewNotSupported?: string | undefined;
+          } | undefined;
+          missingTerminalBody?: string | undefined;
+          missingTerminalTitle?: string | undefined;
+          noStartingPointsBody?: string | undefined;
+          noStartingPointsTitle?: string | undefined;
+      } | undefined;
+      labels?: {
+          traceConfiguration?: string | undefined;
+          traceInputs?: string | undefined;
+          utilityNetwork?: string | undefined;
+      } | undefined;
+      runningTrace?: string | undefined;
+      tabs?: {
+          inputTab?: string | undefined;
+          resultsTab?: string | undefined;
+      } | undefined;
+  };
+  /**
+   * By assigning the `id` attribute of the Map or Scene component to this property, you can position a child component anywhere in the DOM while still maintaining a connection to the Map or Scene.
+   *
+   * @see [Associate components with a Map or Scene component](https://developers.arcgis.com/javascript/latest/programming-patterns/#associate-components-with-a-map-or-scene-component)
+   */
+  accessor referenceElement: ArcgisReferenceElement | string | undefined;
+  /** The current state of the component. */
+  get state(): UtilityNetworkTraceAnalysisState;
+  /**
+   * An array of features returned by the trace result.
+   *
+   * This array is populated if the trace returned [element](https://developers.arcgis.com/javascript/latest/references/core/rest/networks/support/TraceResult/#elements) results.
+   *
+   * When [@arcgisTraceResultFeaturesReady](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-analysis-next/#event-arcgisTraceResultFeaturesReady) is raised, trace result features are available.
+   * When a new trace has been run, or the trace results are cleared, this array is cleared.
+   */
+  get traceResultFeatures(): Graphic[];
+  /**
+   * 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-analysis-next component will be associated with a map or scene component rather than using the `view` property.
+   */
+  accessor view: MapView | null | undefined;
+  /** Permanently destroy the component. */
+  destroy(): Promise<void>;
+  /**
+   * Fires when the user toggles displaying aggregated geometry results in the result pane.
+   * Event payload contains a boolean representing whether the aggregated geometry graphics are hidden.
+   * If true, the aggregated geometry graphics are hidden on the view.
+   *
+   * @example
+   * ```js
+   * const traceElement = document.querySelector("arcgis-utility-network-trace-analysis-next");
+   * traceElement.addEventListener("arcgisHideGraphicsChange", (event) => {
+   *   const hideGraphics = event.detail;
+   *   console.log(hideGraphics);
+   * });
+   * ```
+   */
+  readonly arcgisHideGraphicsChange: import("@arcgis/lumina").TargetedEvent<this, boolean>;
+  /** Emitted when the component associated with a map or scene view is ready to be interacted with. */
+  readonly arcgisReady: import("@arcgis/lumina").TargetedEvent<this, void>;
+  /**
+   * Fires when the user completes the selection of a trace location.
+   *
+   * @internal
+   * @example
+   * ```js
+   * const traceElement = document.querySelector("arcgis-utility-network-trace-analysis-next");
+   * traceElement.addEventListener("arcgisTraceLocationSelectEnd", () => {
+   *   console.log("Selection finished!");
+   * });
+   * ```
+   */
+  readonly arcgisTraceLocationSelectEnd: import("@arcgis/lumina").TargetedEvent<this, void>;
+  /**
+   * Fires when the user begins selection of a trace location.
+   * Event payload contains a callback method `cancelSelect` to cancel a selection in progress.
+   * The event can also be prevented with `event.preventDefault()` to stop the selection.
+   *
+   * @internal
+   * @example
+   * ```js
+   * const traceElement = document.querySelector("arcgis-utility-network-trace-analysis-next");
+   * traceElement.addEventListener("arcgisTraceLocationSelectStart", (event) => {
+   *   event.preventDefault();
+   * });
+   * ```
+   * @example
+   * ```js
+   * let cancelSelect;
+   * const traceElement = document.querySelector("arcgis-utility-network-trace-analysis-next");
+   * traceElement.addEventListener("arcgisTraceLocationSelectStart", (event) => {
+   *   cancelSelect = event.detail.cancelSelect;
+   * });
+   *
+   * setTimeout(() => {
+   *   cancelSelect();
+   * }, 3000);
+   * ```
+   */
+  readonly arcgisTraceLocationSelectStart: import("@arcgis/lumina").TargetedEvent<this, SelectStartPayload>;
+  /**
+   * Fires when the trace result is cleared from the results tab.
+   *
+   * @example
+   * ```js
+   * const traceElement = document.querySelector("arcgis-utility-network-trace-analysis-next");
+   * traceElement.addEventListener("arcgisTraceResultClear", (event) => {
+   *   console.log("Trace result was cleared.");
+   * });
+   * ```
+   */
+  readonly arcgisTraceResultClear: import("@arcgis/lumina").TargetedEvent<this, void>;
+  /**
+   * Fires when the trace result features are ready.
+   * Check property [traceResultFeatures](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-analysis-next/#traceResultFeatures) for the trace result features.
+   *
+   * @example
+   * ```js
+   * const traceElement = document.querySelector("arcgis-utility-network-trace-analysis-next");
+   * traceElement.addEventListener("arcgisTraceResultFeaturesReady", (event) => {
+   *   const resultFeatures = traceElement.traceResultFeatures;
+   *   console.log(resultFeatures);
+   * });
+   * ```
+   */
+  readonly arcgisTraceResultFeaturesReady: import("@arcgis/lumina").TargetedEvent<this, void>;
+  readonly "@eventTypes": {
+    arcgisHideGraphicsChange: ArcgisUtilityNetworkTraceAnalysisNext["arcgisHideGraphicsChange"]["detail"];
+    arcgisReady: ArcgisUtilityNetworkTraceAnalysisNext["arcgisReady"]["detail"];
+    arcgisTraceLocationSelectEnd: ArcgisUtilityNetworkTraceAnalysisNext["arcgisTraceLocationSelectEnd"]["detail"];
+    arcgisTraceLocationSelectStart: ArcgisUtilityNetworkTraceAnalysisNext["arcgisTraceLocationSelectStart"]["detail"];
+    arcgisTraceResultClear: ArcgisUtilityNetworkTraceAnalysisNext["arcgisTraceResultClear"]["detail"];
+    arcgisTraceResultFeaturesReady: ArcgisUtilityNetworkTraceAnalysisNext["arcgisTraceResultFeaturesReady"]["detail"];
+  };
+}

package/dist/components/arcgis-utility-network-trace-analysis-next/customElement.js

@@ -0,0 +1,186 @@
+/* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
+import { c as p } from "../../chunks/runtime.js";
+import { css as m, html as a } from "lit";
+import { ref as g } from "lit/directives/ref.js";
+import { keyed as u } from "lit/directives/keyed.js";
+import y from "@arcgis/core/Color.js";
+import "@arcgis/core/core/Error.js";
+import { when as f } from "@arcgis/core/core/reactiveUtils.js";
+import b from "@arcgis/core/networks/UtilityNetworkTraceAnalysis.js";
+import { LitElement as w, createEvent as o } from "@arcgis/lumina";
+import { log as v } from "@arcgis/toolkit/log";
+import { u as T } from "../../chunks/useT9n.js";
+import { m as $ } from "../../chunks/useViewModel.js";
+import { l as _ } from "../../chunks/async-utils.js";
+const R = m`:host{--arcgis-internal-color-black-30: color-mix(in srgb, #000000 30.2%, transparent);--arcgis-internal-box-shadow: var(--calcite-spacing-none) var(--calcite-spacing-px) var(--calcite-spacing-base) var(--arcgis-internal-color-black-30);--arcgis-internal-top-max-width: calc(min(100cqw, 100vw) - var(--calcite-spacing-xxxl));--arcgis-internal-panel-width: 300px;--arcgis-internal-panel-height: 100%;--arcgis-internal-panel-height-sm: 240px;--arcgis-internal-panel-height-md: 420px;--arcgis-internal-panel-height-lg: 540px;--arcgis-internal-panel-height-xl: 680px;--arcgis-internal-panel-gap: var(--calcite-spacing-lg);--arcgis-internal-panel-actions-gap: var(--calcite-spacing-sm);--arcgis-internal-basemap-gallery-width-lg: 450px;--arcgis-internal-collapse-icon-flip: scaleX(1);--arcgis-internal-row-direction: row;--arcgis-internal-legend-width: 300px;--arcgis-internal-layout-overlay-space-top: var(--arcgis-layout-overlay-space-top, 0px);--arcgis-internal-layout-overlay-space-bottom: var(--arcgis-layout-overlay-space-bottom, 0px);--arcgis-internal-layout-overlay-space-left: var(--arcgis-layout-overlay-space-left, 0px);--arcgis-internal-layout-overlay-space-right: var(--arcgis-layout-overlay-space-right, 0px);--arcgis-internal-view-color-focus: var(--arcgis-view-color-focus, var(--calcite-color-brand));--arcgis-internal-attribution-space-bottom: var(--arcgis-internal-layout-overlay-space-bottom);--arcgis-internal-attribution-space-left: var(--arcgis-internal-layout-overlay-space-left);--arcgis-internal-attribution-space-right: var(--arcgis-internal-layout-overlay-space-right);--arcgis-internal-attribution-font-size: var(--calcite-font-size-sm);--arcgis-internal-attribution-font-size-sm: var(--calcite-font-size-xs);--arcgis-internal-sketch-justify-content: flex-start}:host{display:flex;flex-direction:column;height:var(--arcgis-internal-panel-height, 100%)}arcgis-utility-network-trace-inputs-next[mode=default]{height:auto}calcite-tabs{display:flex;flex-direction:column;height:100%}calcite-tab{--calcite-tab-content-space-y: 0;min-height:var(--arcgis-internal-panel-height-sm, 240px)}calcite-tab:not([selected]){flex:0}calcite-panel{--calcite-panel-background-color: var(--calcite-color-foreground-1)}calcite-notice{margin:var(--calcite-spacing-md)}.inputs-tab-container{display:flex;flex-direction:column;height:100%}.trace-inputs-warning{flex:none;height:fit-content;calcite-notice{margin:var(--calcite-spacing-md) var(--calcite-spacing-md) 0}}`, x = $(b);
+class C extends w {
+  constructor() {
+    super(...arguments), this._messages = T({ blocking: !0 }), this.#t = x(this), this.#s = [], this._activeTab = "input", this._showMissingTerminalWarning = !1, this._showNoStartingPointsWarning = !1, this._mode = "default", this.autoDestroyDisabled = !1, this.aggregatedGeometryGraphicsColor = new y([255, 255, 0, 0.6]), this.disableHighlightFeatureResults = !1, this.hideActionBar = !1, this.hideFeatureResults = !1, this.state = this.#t.state, this.view = this.#t.view, this.arcgisHideGraphicsChange = o(), this.arcgisReady = o(), this.arcgisTraceLocationSelectEnd = o(), this.arcgisTraceLocationSelectStart = o(), this.arcgisTraceResultClear = o(), this.arcgisTraceResultFeaturesReady = o();
+  }
+  static {
+    this.properties = { _activeTab: 16, _traceError: 16, _traceResult: 16, _showMissingTerminalWarning: 16, _showNoStartingPointsWarning: 16, _mode: 16, autoDestroyDisabled: 5, beforeTraceLocationSelectStart: 0, aggregatedGeometryGraphicsColor: 0, disableHighlightFeatureResults: 5, hideActionBar: 5, hideFeatureResults: 5, label: 3, messageOverrides: 0, traceResultFeatures: 32, referenceElement: 1, state: 32, view: 0 };
+  }
+  static {
+    this.styles = R;
+  }
+  #t;
+  #e;
+  #i;
+  get #o() {
+    const { view: t } = this;
+    return t?.map ? t.map.allLayers.toArray().concat(t.map.allTables.toArray()) : [];
+  }
+  #c;
+  #s;
+  get traceResultFeatures() {
+    return this.#i?.traceResultFeatures ?? [];
+  }
+  async destroy() {
+    this.#n(), this.#i?.destroy(), this.#e?.destroy(), await this.manager.destroy();
+  }
+  load() {
+    this.manager.onLifecycle(() => [
+      f(() => !this.#t.utilityNetwork, () => this.#a("input"))
+    ]);
+  }
+  #r() {
+    this._traceResult = void 0, this.#n(), this.#g();
+  }
+  #l() {
+    if (!this.#e)
+      return;
+    const { traceLocations: t, traceLocationFlagInfos: e, traceConfiguration: r, isSubnetworkNameTraceSelected: s } = this.#e, i = !!r?.subnetworkName, c = t?.some((n) => n.type === "starting-point"), l = e?.some((n) => !!n.flagProperties.terminalConfiguration && !n.flagProperties.selectedTerminals?.size) ?? !1;
+    this._traceError = void 0, this._showNoStartingPointsWarning = !s && !c || s && !i, this._showMissingTerminalWarning = l;
+  }
+  #a(t) {
+    this._activeTab = t;
+  }
+  #h(t) {
+    const { _messages: e } = this;
+    switch (t) {
+      case "no-user-type-extension":
+        return e.errors.loadErrors.noUserTypeExtension;
+      case "no-utility-network":
+        return e.errors.loadErrors.noUtilityNetwork;
+      case "no-view":
+        return e.errors.loadErrors.noView;
+      case "sceneView-not-supported":
+        return e.errors.loadErrors.sceneViewNotSupported;
+      default:
+        return t;
+    }
+  }
+  #n() {
+    this.#s.forEach((t) => t.remove()), this.#s = [];
+  }
+  #g() {
+    this.#i?.clearAggregatedGeometryGraphics();
+  }
+  #u() {
+    const { _traceResult: t, view: e } = this, r = this.#t.utilityNetwork;
+    if (!r || !t?.elements || !e)
+      return;
+    r.getObjectIdsFromElements(t.elements).forEach((i) => {
+      const c = e.allLayerViews.find((n) => {
+        const h = n.layer;
+        if (r.isUtilityLayer(h)) {
+          const d = Number(i.layerUrl.split("/").pop());
+          return h.layerId === d;
+        }
+        return !1;
+      });
+      if (!c)
+        return;
+      const l = c.highlight(i.objectIds);
+      this.#s.push(l);
+    });
+  }
+  async #d() {
+    const t = this.#e?.selectedNamedTraceConfiguration, e = this.#e?.traceConfiguration;
+    if (!(t?.traceType && e)) {
+      v("error", this, "Trace configuration not found");
+      return;
+    }
+    const r = this.#e?.traceLocations;
+    try {
+      this._traceResult = await this.#t.executeTraceConfiguration({
+        traceType: t.traceType,
+        traceConfiguration: e,
+        traceLocations: r ?? [],
+        resultTypes: t.resultTypes,
+        outSpatialReference: this.view?.spatialReference
+      }), this.disableHighlightFeatureResults || this.#u();
+    } catch (s) {
+      _(s, this, "Error while running trace"), this._traceError = s, this._traceResult = void 0;
+    }
+  }
+  #p() {
+    this.#l(), !(this._showNoStartingPointsWarning || this._showMissingTerminalWarning) && (this._showNoStartingPointsWarning = !1, this._showMissingTerminalWarning = !1, this.#r(), this.#a("results"), this.#d());
+  }
+  #m(t) {
+    t && (this.#e = t);
+  }
+  #y(t) {
+    t && (this.#i = t);
+  }
+  #f(t) {
+    t.stopPropagation(), this.arcgisHideGraphicsChange.emit(t.detail);
+  }
+  #b(t) {
+    t.stopPropagation(), this.arcgisTraceLocationSelectStart.emit(t.detail).defaultPrevented && t.preventDefault();
+  }
+  #w(t) {
+    t.stopPropagation(), this.arcgisTraceLocationSelectEnd.emit();
+  }
+  #v(t) {
+    t.stopPropagation(), this.arcgisTraceResultFeaturesReady.emit();
+  }
+  #T(t) {
+    const e = t.detail;
+    this.aggregatedGeometryGraphicsColor = e;
+  }
+  #$() {
+    this._showNoStartingPointsWarning = !1, this._showMissingTerminalWarning = !1;
+  }
+  #_() {
+    this.#t.utilityNetwork = this.#e?.selectedUtilityNetwork;
+  }
+  #R() {
+    const { _messages: t } = this;
+    return a`<calcite-panel class="trace-inputs-warning"><calcite-notice open icon=exclamation-mark-triangle closable kind=danger scale=s @calciteNoticeClose=${() => this._showMissingTerminalWarning = !1}><div slot=title>${t.errors.missingTerminalTitle}</div><div slot=message>${t.errors.missingTerminalBody}</div></calcite-notice></calcite-panel>`;
+  }
+  #x() {
+    const { _messages: t } = this;
+    return a`<calcite-panel class="trace-inputs-warning"><calcite-notice open icon=exclamation-mark-triangle closable kind=danger scale=s @calciteNoticeClose=${() => this._showNoStartingPointsWarning = !1}><div slot=title>${t.errors.noStartingPointsTitle}</div><div slot=message>${t.errors.noStartingPointsBody}</div></calcite-notice></calcite-panel>`;
+  }
+  #C() {
+    return u(`${this.el.id}__results-tab-item`, a`<calcite-tab .selected=${this._activeTab === "results"}>${this.state === "executing" ? a`<calcite-panel><calcite-loader .label=${this._messages.runningTrace} .text=${this._messages.runningTrace}></calcite-loader></calcite-panel>` : a`<arcgis-utility-network-trace-results-next .autoDestroyDisabled=${this.autoDestroyDisabled} .aggregatedGeometryGraphicsColor=${this.aggregatedGeometryGraphicsColor} .hideActionBar=${this.hideActionBar} .hideFeatureResults=${this.hideFeatureResults} .layers=${this.#o} .messageOverrides=${this.messageOverrides} .referenceElement=${this.referenceElement} .traceConfigTitle=${this.#c?.title} .traceError=${this._traceError} .traceResult=${this._traceResult} .utilityNetwork=${this.#t.utilityNetwork ?? void 0} .view=${this.view ?? void 0} @arcgisAggregatedGeometryGraphicsColorChange=${this.#T} @arcgisHideGraphicsChange=${this.#f} @arcgisTraceResultFeaturesReady=${this.#v} ${g(this.#y)}></arcgis-utility-network-trace-results-next>`}</calcite-tab>`);
+  }
+  #k() {
+    const { _messages: t, _traceResult: e } = this, s = !!(e?.elements.length || e?.globalFunctionResults.length || e?.aggregatedGeometry) && this.#i?.state === "ready", i = this.#i?.numResults ?? 0;
+    return a`<calcite-button appearance=outline width=full @click=${() => {
+      this.#a("input"), this.#r(), this.arcgisTraceResultClear.emit();
+    }} .disabled=${!s} slot=footer>${i > 0 && !this.hideFeatureResults && this.state !== "executing" ? t.buttons.clearResultsCustom.replace("{number}", i.toString()) : t.buttons.clearResultsGeneric}</calcite-button>`;
+  }
+  #S() {
+    const { _mode: t } = this, { loadError: e } = this.#t, s = (e === "no-user-type-extension" || e === "sceneView-not-supported" ? a`<calcite-notice kind=danger open scale=s slot=content-top width=auto><div slot=message>${this.#h(e)}</div></calcite-notice>` : void 0) ?? a`${this._showNoStartingPointsWarning && t === "default" && this.#x() || ""}${this._showMissingTerminalWarning && t === "default" && this.#R() || ""}<arcgis-utility-network-trace-inputs-next .autoDestroyDisabled=${this.autoDestroyDisabled} .hideActionBar=${this.hideActionBar} .referenceElement=${this.referenceElement} .view=${this.view ?? void 0} .beforeTraceLocationSelectStart=${this.beforeTraceLocationSelectStart} @arcgisPropertyChange=${(i) => {
+      i.stopPropagation(), i.detail.name === "mode" && (this._mode = i.target.mode);
+    }} @arcgisSelectedNamedTraceConfigurationChange=${this.#$} @arcgisTraceLocationSelectEnd=${this.#w} @arcgisTraceLocationSelectStart=${this.#b} @arcgisUtilityNetworkChange=${this.#_} ${g(this.#m)}></arcgis-utility-network-trace-inputs-next>`;
+    return u(`${this.el.id}__inputs-tab-item`, a`<calcite-tab .selected=${this._activeTab === "input"}><div class="inputs-tab-container">${s}</div></calcite-tab>`);
+  }
+  #N() {
+    const { state: t } = this;
+    if (this._mode !== "default")
+      return null;
+    const e = t === "disabled" || t === "loading" || !this.#e?.traceConfiguration;
+    return a`<calcite-button appearance=solid width=full @click=${this.#p} slot=footer .disabled=${e}>${this._messages.buttons.getResults}</calcite-button>`;
+  }
+  render() {
+    const { _activeTab: t, state: e } = this;
+    return a`<calcite-panel><calcite-tabs layout=center position=top><calcite-tab-nav slot=title-group><calcite-tab-title @click=${() => this.#a("input")} .selected=${t === "input"}>${this._messages.tabs.inputTab}</calcite-tab-title><calcite-tab-title @click=${() => this.#a("results")} .selected=${t === "results"} .disabled=${e === "disabled" || e === "loading"}>${this._messages.tabs.resultsTab}</calcite-tab-title></calcite-tab-nav>${this.#S()}${this.#C()}</calcite-tabs>${t === "input" ? this.#N() : null}${t === "results" ? this.#k() : null}</calcite-panel>`;
+  }
+}
+p("arcgis-utility-network-trace-analysis-next", C);
+export {
+  C as ArcgisUtilityNetworkTraceAnalysisNext
+};

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

@@ -0,0 +1 @@
+export * from "./customElement.js";

package/dist/components/arcgis-utility-network-trace-analysis-next/index.js

@@ -0,0 +1,11 @@
+import "@esri/calcite-components/components/calcite-panel";
+import "@esri/calcite-components/components/calcite-notice";
+import "@esri/calcite-components/components/calcite-tab";
+import "@esri/calcite-components/components/calcite-loader";
+import "../arcgis-utility-network-trace-results-next/index.js";
+import "@esri/calcite-components/components/calcite-button";
+import "../arcgis-utility-network-trace-inputs-next/index.js";
+import "@esri/calcite-components/components/calcite-tabs";
+import "@esri/calcite-components/components/calcite-tab-nav";
+import "@esri/calcite-components/components/calcite-tab-title";
+export * from "./customElement.js";

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

@@ -0,0 +1,27 @@
+import type Layer from "@arcgis/core/layers/Layer.js";
+import type UtilityNetwork from "@arcgis/core/networks/UtilityNetwork.js";
+import type TraceResult from "@arcgis/core/rest/networks/support/TraceResult.js";
+import type MapView from "@arcgis/core/views/MapView.js";
+
+export type UtilityNetworkTraceAnalysisDisplayMode = "add-spatial-feature" | "add-spatial-instructions" | "default";
+
+/**
+ * Defines the common properties shared by all children of [arcgis-utility-network-trace-results-next](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-utility-network-trace-results-next/).
+ *
+ * @internal
+ * @since 5.2
+ */
+export interface UtilityNetworkTraceResultItem {
+  /** The layers used by the result item. */
+  layers?: Layer[];
+  /** The heading of the result item. */
+  heading?: string;
+  /** The trace result used by the result item. */
+  traceResult?: TraceResult;
+  /** The utility network used by the result item. */
+  utilityNetwork?: UtilityNetwork;
+  /** The MapView used by the result item. */
+  view?: MapView;
+  /** A method to clean up side effects from the result item. */
+  clearResult?: () => void;
+}

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

@@ -0,0 +1,30 @@
+/// <reference path="../../index.d.ts" />
+import type TraceResult from "@arcgis/core/rest/networks/support/TraceResult.js";
+import type { PublicLitElement as LitElement } from "@arcgis/lumina";
+import type { T9nMeta } from "@arcgis/lumina/controllers";
+
+/**
+ * Trace result item for displaying [function](https://developers.arcgis.com/javascript/latest/references/core/rest/networks/support/TraceResult/#globalFunctionResults) results from a trace.
+ *
+ * @internal
+ * @since 5.2
+ * @see [Set up functions](https://doc.esri.com/en/arcgis-pro/latest/help/data/utility-network/configure-a-trace.html#CBB)
+ */
+export abstract class ArcgisUtilityNetworkTraceFunctionsResultItem extends LitElement {
+  /** @internal */
+  protected _messages: {
+      componentLabel: string;
+      labels: { functionResults: string; };
+  } & T9nMeta<{
+      componentLabel: string;
+      labels: { functionResults: string; };
+  }>;
+  /** The heading displayed above the result item. */
+  accessor heading: string | undefined;
+  /**
+   * The trace result containing the function results to render.
+   *
+   * @required
+   */
+  accessor traceResult: TraceResult | undefined;
+}