@arcgis/map-components 5.1.0-next.83 → 5.1.0-next.84

package/dist/components/arcgis-time-slider/index.js

@@ -1 +1,8 @@
+import "@esri/calcite-components/components/calcite-action-menu";
+import "@esri/calcite-components/components/calcite-action";
+import "@arcgis/common-components/components/arcgis-ticks";
+import "@esri/calcite-components/components/calcite-label";
+import "@esri/calcite-components/components/calcite-button";
+import "@arcgis/common-components/components/arcgis-slider";
+import "@esri/calcite-components/components/calcite-icon";
 export * from "./customElement.js";

package/dist/components/arcgis-time-slider/types.d.ts

@@ -0,0 +1,147 @@
+import type TimeExtent from "@arcgis/core/time/TimeExtent.js";
+import type TimeInterval from "@arcgis/core/time/TimeInterval.js";
+import type { IconName } from "../types.js";
+
+/** Defines the layout options for the time slider component. */
+export type Layout = "auto" | "compact" | "wide";
+
+/** Defines the different modes of the time slider component. */
+export type Mode = "cumulative-from-end" | "cumulative-from-start" | "instant" | "time-window";
+
+/** Defines the different states of the time slider component. */
+export type State = "disabled" | "playing" | "ready";
+
+/** Stops are positioned at specific dates. */
+export interface StopsByDates {
+  dates: Date[];
+}
+
+/** Stops are positioned at regular intervals defined by a [time interval](https://developers.arcgis.com/javascript/latest/references/core/time/TimeInterval). */
+export interface StopsByInterval {
+  /** The interval at which stops will be created. */
+  interval: TimeInterval;
+  /** The time extent over which the stops will be distributed. */
+  timeExtent?: TimeExtent;
+}
+
+/**
+ * Stops are positioned at a specific number of evenly spaced locations along the time slider.
+ * The exact positions of the stops will be calculated based on the provided count and the time extent of the slider.
+ */
+export interface StopsByCount {
+  /** The number of stops to create along the time slider. */
+  count: number;
+  /** The time extent over which the stops will be distributed. */
+  timeExtent?: TimeExtent;
+}
+
+export type Stops = StopsByCount | StopsByDates | StopsByInterval;
+
+/**
+ * An action that can be performed by the user in the time slider component.
+ * Actions are displayed in a menu that appears when the user clicks the ellipsis button in the component.
+ */
+export interface Action {
+  /** Unique identifier of the action. */
+  id: string;
+  /**
+   * The name of the icon to display.
+   * The value of this property must match the icon name from
+   * [Calcite UI Icons](https://developers.arcgis.com/calcite-design-system/icons/).
+   */
+  icon: IconName;
+  /** The title of the action that will be displayed in the menu. */
+  title: string;
+}
+
+/**
+ * Time slider settings derived from a
+ * [timeSlider widget](https://developers.arcgis.com/javascript/latest/references/core/webdoc/Widgets/#timeSlider) in a
+ * [web map](https://developers.arcgis.com/javascript/latest/references/core/WebMap) or
+ * [web scene](https://developers.arcgis.com/javascript/latest/references/core/WebScene).
+ */
+export interface TimeSliderSettings {
+  /**
+   * The temporal extent of the entire slider.
+   *
+   * @see [arcgis-time-slider.fullTimeExtent](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-time-slider/#fullTimeExtent)
+   */
+  fullTimeExtent?: TimeExtent | null;
+  /**
+   * When `true`, the time slider will play its animation in a loop.
+   *
+   * @see [arcgis-time-slider.loop](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-time-slider/#loop)
+   */
+  loop: boolean;
+  /**
+   * The time slider mode.
+   *
+   * @see [arcgis-time-slider.mode](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-time-slider/#mode)
+   */
+  mode?: Mode;
+  /**
+   * The time (in milliseconds) between animation steps.
+   *
+   * @see [arcgis-time-slider.playRate](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-time-slider/#playRate)
+   */
+  playRate?: number;
+  /**
+   * Defines specific locations on the time slider where thumbs will snap to when manipulated.
+   *
+   * @see [arcgis-time-slider.stops](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-time-slider/#stops)
+   */
+  stops?: Stops | null;
+  /**
+   * The current time extent of the time slider.
+   *
+   * @see [arcgis-time-slider.timeExtent](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-time-slider/#timeExtent)
+   */
+  timeExtent?: TimeExtent | null;
+}
+
+/** Event payload for the trigger-action event. */
+export interface TriggerActionEvent {
+  /** The action that was clicked. */
+  action: Action;
+}
+
+/** Describes the type of date label that is being formatted by the date label formatter function. */
+export type DateLabelType = "extent" | "max" | "min";
+
+/**
+ * A function that formats the date labels displayed on the time slider.
+ *
+ * @param value
+ * @param type
+ * @param element
+ * @param layout
+ */
+export type DateLabelFormatter = (value: Date | [Date | null | undefined, Date | null | undefined] | null | undefined, type: DateLabelType, element: HTMLElement, layout: Exclude<Layout, "auto">) => void;
+
+/**
+ * Given a tick value, this function returns the label to display for that tick.
+ *
+ * @param value
+ */
+export type TickLabelFormatter = (value: number) => string;
+
+/** This type defines how tick values are interpreted and positioned along the time slider component. */
+export type TickMode = "count" | "percent" | "position";
+
+/**
+ * Tick mark and label configuration for the time slider component.
+ * Each tick configuration includes a `mode` that determines how the tick values are calculated, and a `labelFormatFunction` that formats the tick labels.
+ */
+export interface TickConfig {
+  /** If `labelsVisible` is `true`, this function will be used to format the labels for the ticks based on their values. */
+  labelFormatFunction?: TickLabelFormatter;
+  /**
+   * If `true`, labels will be rendered for the ticks based on their values and the provided `labelFormatFunction`.
+   * If `false`, only tick marks will be rendered without labels.
+   */
+  labelsVisible?: boolean;
+  /** The mode or method of positioning ticks. */
+  mode: TickMode;
+  /** The value or values for the ticks. */
+  values: number[] | number;
+}

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

@@ -1,28 +1,27 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
 import { c as m } from "../../chunks/runtime.js";
 import { css as y, html as s } from "lit";
-import { ref as o } from "lit/directives/ref.js";
-import { keyed as h } from "lit/directives/keyed.js";
-import g from "@arcgis/core/Color.js";
+import { ref as h } from "lit/directives/ref.js";
+import { keyed as g } from "lit/directives/keyed.js";
+import u from "@arcgis/core/Color.js";
 import "@arcgis/core/core/Error.js";
 import { when as f } from "@arcgis/core/core/reactiveUtils.js";
 import w from "@arcgis/core/networks/UtilityNetworkTraceAnalysis.js";
-import { LitElement as b, createEvent as l } from "@arcgis/lumina";
-import { log as T } from "@arcgis/toolkit/log";
+import { LitElement as T, createEvent as c } from "@arcgis/lumina";
+import { log as b } from "@arcgis/toolkit/log";
 import { u as v } from "../../chunks/useT9n.js";
 import { m as _ } from "../../chunks/useViewModel.js";
 import { l as R } from "../../chunks/async-utils.js";
 const $ = y`: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%)}.inputs-tab-container{display:flex;flex-direction:column;height:100%}.trace-inputs-warning{flex:none;height:fit-content;--calcite-panel-background-color: var(--calcite-color-foreground-1);calcite-notice{margin:var(--calcite-spacing-md) var(--calcite-spacing-md) 0 var(--calcite-spacing-md)}}arcgis-utility-network-trace-inputs[mode=default]{height:auto}calcite-tabs{display:flex;flex-direction:column;height:100%}calcite-tab{--calcite-tab-content-space-y: 0}calcite-tab:not([selected]){flex:0}calcite-panel{--calcite-panel-background-color: var(--calcite-color-foreground-1)}calcite-notice{margin:var(--calcite-spacing-md)}`, C = _(w);
-class k extends b {
+class k extends T {
   constructor() {
     super(...arguments), this._messages = v({ blocking: !0 }), this._viewModel = C(this), this._highlightHandles = [], this._handleRunTraceButtonClick = () => {
-      const e = this._traceInputsElement?.traceLocations, t = this._traceInputsElement?.traceLocationFlagInfos, a = e?.some((i) => i.type === "starting-point"), r = t?.some((i) => !!i.flagProperties.terminalConfiguration && !i.flagProperties.selectedTerminals?.size) ?? !1;
-      this.traceError = void 0, this.showNoStartingPointsWarning = !this._isSubnetworkNameTraceSelected && !a, this.showMissingTerminalWarning = r, !(this.showNoStartingPointsWarning || this.showMissingTerminalWarning) && (this.showNoStartingPointsWarning = !1, this.showMissingTerminalWarning = !1, this._clearTraceResult(), this._switchTab("results"), this._runTrace());
+      this._setTraceWarnings(), !(this.showNoStartingPointsWarning || this.showMissingTerminalWarning) && (this.showNoStartingPointsWarning = !1, this.showMissingTerminalWarning = !1, this._clearTraceResult(), this._switchTab("results"), this._runTrace());
     }, this._handleTraceInputsRefChange = (e) => {
       e && (this._traceInputsElement = e);
     }, this._handleTraceResultsRefChange = (e) => {
       e && (this._traceResultsElement = e);
-    }, this.activeTab = "input", this.showMissingTerminalWarning = !1, this.showNoStartingPointsWarning = !1, this.mode = "default", this.autoDestroyDisabled = !1, this.aggregatedGeometryGraphicsColor = new g([255, 255, 0, 0.6]), this.disableHighlightFeatureResults = !1, this.hideActionBar = !1, this.hideFeatureResults = !1, this.state = this._viewModel.state, this.view = this._viewModel.view, this.arcgisHideGraphicsChange = l(), this.arcgisReady = l(), this.arcgisTraceLocationSelectEnd = l(), this.arcgisTraceLocationSelectStart = l(), this.arcgisTraceResultClear = l(), this.arcgisTraceResultFeaturesReady = l();
+    }, this.activeTab = "input", this.showMissingTerminalWarning = !1, this.showNoStartingPointsWarning = !1, this.mode = "default", this.autoDestroyDisabled = !1, this.aggregatedGeometryGraphicsColor = new u([255, 255, 0, 0.6]), this.disableHighlightFeatureResults = !1, this.hideActionBar = !1, this.hideFeatureResults = !1, this.state = this._viewModel.state, this.view = this._viewModel.view, this.arcgisHideGraphicsChange = c(), this.arcgisReady = c(), this.arcgisTraceLocationSelectEnd = c(), this.arcgisTraceLocationSelectStart = c(), this.arcgisTraceResultClear = c(), this.arcgisTraceResultFeaturesReady = c();
   }
   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 };
@@ -52,6 +51,10 @@ class k extends b {
   _clearTraceResult() {
     this.traceResult = void 0, this._clearHighlights(), this._clearAggregatedGeometryGraphics();
   }
+  _setTraceWarnings() {
+    const e = this._traceInputsElement?.traceLocations, t = this._traceInputsElement?.traceLocationFlagInfos, r = !!this._traceInputsElement?.unTraceConfiguration?.subnetworkName, i = e?.some((l) => l.type === "starting-point"), n = t?.some((l) => !!l.flagProperties.terminalConfiguration && !l.flagProperties.selectedTerminals?.size) ?? !1;
+    this.traceError = void 0, this.showNoStartingPointsWarning = !this._isSubnetworkNameTraceSelected && !i || this._isSubnetworkNameTraceSelected && !r, this.showMissingTerminalWarning = n;
+  }
   _switchTab(e) {
     this.activeTab = e;
   }
@@ -82,23 +85,23 @@ class k extends b {
       return;
     a.getObjectIdsFromElements(e.elements).forEach((i) => {
       const n = t.allLayerViews.find((d) => {
-        const c = d.layer;
-        if (a.isUtilityLayer(c)) {
+        const o = d.layer;
+        if (a.isUtilityLayer(o)) {
           const p = Number(i.layerUrl.split("/").pop());
-          return c.layerId === p;
+          return o.layerId === p;
         }
         return !1;
       });
       if (!n)
         return;
-      const u = n.highlight(i.objectIds);
-      this._highlightHandles.push(u);
+      const l = n.highlight(i.objectIds);
+      this._highlightHandles.push(l);
     });
   }
   async _runTrace() {
     const e = this._traceInputsElement?.selectedNamedTraceConfiguration, t = this._traceInputsElement?.unTraceConfiguration;
     if (!(e?.traceType && t)) {
-      T("error", this, "Trace configuration not found");
+      b("error", this, "Trace configuration not found");
       return;
     }
     const a = this._traceInputsElement?.traceLocations;
@@ -128,7 +131,7 @@ class k extends b {
   }
   _handleAggregatedGeometryGraphicsColorChange(e) {
     const t = e.detail;
-    this.aggregatedGeometryGraphicsColor = new g(t);
+    this.aggregatedGeometryGraphicsColor = new u(t);
   }
   _handleSelectedNamedTraceConfigurationChange() {
     this.showNoStartingPointsWarning = !1, this.showMissingTerminalWarning = !1;
@@ -143,21 +146,18 @@ class k extends b {
     return s`<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>${this._messages.errors.noStartingPointsTitle}</div><div slot=message>${this._messages.errors.noStartingPointsBody}</div></calcite-notice></calcite-panel>`;
   }
   renderResultsTab() {
-    return h(`${this.el.id}__results-tab-item`, s`<calcite-tab .selected=${this.activeTab === "results"}>${this._viewModel.state === "executing" ? s`<calcite-panel><calcite-loader .label=${this._messages.runningTrace} .text=${this._messages.runningTrace}></calcite-loader></calcite-panel>` : s`<arcgis-utility-network-trace-results .aggregatedGeometryGraphicsColor=${this.aggregatedGeometryGraphicsColor} .hideFeatureResults=${this.hideFeatureResults} .referenceElement=${this.referenceElement} .hideActionBar=${this.hideActionBar} .layers=${this._allLayers} .traceConfigTitle=${this._selectedTraceConfig?.title} .traceError=${this.traceError} .traceResult=${this.traceResult} .utilityNetwork=${this._viewModel.utilityNetwork ?? void 0} .view=${this.view ?? void 0} .messageOverrides=${{ resultFeaturesAreHidden: this.messageOverrides?.resultFeaturesAreHidden }} @arcgisHideGraphicsChange=${this._handleHideGraphicsChange} @arcgisTraceResultFeaturesReady=${this._handleTraceResultFeaturesReady} @arcgisAggregatedGeometryGraphicsColorChange=${this._handleAggregatedGeometryGraphicsColorChange} .autoDestroyDisabled=${this.autoDestroyDisabled} ${o(this._handleTraceResultsRefChange)}></arcgis-utility-network-trace-results>`}</calcite-tab>`);
+    return g(`${this.el.id}__results-tab-item`, s`<calcite-tab .selected=${this.activeTab === "results"}>${this._viewModel.state === "executing" ? s`<calcite-panel><calcite-loader .label=${this._messages.runningTrace} .text=${this._messages.runningTrace}></calcite-loader></calcite-panel>` : s`<arcgis-utility-network-trace-results .aggregatedGeometryGraphicsColor=${this.aggregatedGeometryGraphicsColor} .hideFeatureResults=${this.hideFeatureResults} .referenceElement=${this.referenceElement} .hideActionBar=${this.hideActionBar} .layers=${this._allLayers} .traceConfigTitle=${this._selectedTraceConfig?.title} .traceError=${this.traceError} .traceResult=${this.traceResult} .utilityNetwork=${this._viewModel.utilityNetwork ?? void 0} .view=${this.view ?? void 0} .messageOverrides=${{ resultFeaturesAreHidden: this.messageOverrides?.resultFeaturesAreHidden }} @arcgisHideGraphicsChange=${this._handleHideGraphicsChange} @arcgisTraceResultFeaturesReady=${this._handleTraceResultFeaturesReady} @arcgisAggregatedGeometryGraphicsColorChange=${this._handleAggregatedGeometryGraphicsColorChange} .autoDestroyDisabled=${this.autoDestroyDisabled} ${h(this._handleTraceResultsRefChange)}></arcgis-utility-network-trace-results>`}</calcite-tab>`);
   }
   renderResultsFooter() {
-    const { mode: e, state: t } = this;
-    if (e !== "default")
-      return null;
-    const { traceResult: a } = this, i = !!(a?.elements.length || a?.globalFunctionResults.length || a?.aggregatedGeometry) && this._traceResultsElement?.state === "ready", n = this._traceResultsElement?.numResults ?? 0;
+    const { state: e } = this, { traceResult: t } = this, r = !!(t?.elements.length || t?.globalFunctionResults.length || t?.aggregatedGeometry) && this._traceResultsElement?.state === "ready", i = this._traceResultsElement?.numResults ?? 0;
     return s`<calcite-button appearance=outline width=full @click=${() => {
       this._switchTab("input"), this._clearTraceResult(), this.arcgisTraceResultClear.emit();
-    }} .disabled=${!i} slot=footer>${n > 0 && !this.hideFeatureResults && t !== "executing" ? this._messages.buttons.clearResultsCustom.replace("{number}", n.toString()) : this._messages.buttons.clearResultsGeneric}</calcite-button>`;
+    }} .disabled=${!r} slot=footer>${i > 0 && !this.hideFeatureResults && e !== "executing" ? this._messages.buttons.clearResultsCustom.replace("{number}", i.toString()) : this._messages.buttons.clearResultsGeneric}</calcite-button>`;
   }
   renderInputTab() {
-    return h(`${this.el.id}__inputs-tab-item`, s`<calcite-tab .selected=${this.activeTab === "input"}><div class="inputs-tab-container">${this.showNoStartingPointsWarning && this.mode === "default" && this.renderNoStartingPointsWarning() || ""}${this.showMissingTerminalWarning && this.mode === "default" && this.renderMissingTerminalWarning() || ""}<arcgis-utility-network-trace-inputs .view=${this.view || void 0} .referenceElement=${this.referenceElement} .beforeTraceLocationSelectStart=${this.beforeTraceLocationSelectStart} .hideActionBar=${this.hideActionBar} @arcgisSelectedNamedTraceConfigurationChange=${this._handleSelectedNamedTraceConfigurationChange} @arcgisUtilityNetworkChange=${this._handleUtilityNetworkChange} @arcgisTraceLocationSelectStart=${this._handleTraceLocationSelectStart} @arcgisTraceLocationSelectEnd=${this._handleTraceLocationSelectEnd} @arcgisPropertyChange=${(e) => {
+    return g(`${this.el.id}__inputs-tab-item`, s`<calcite-tab .selected=${this.activeTab === "input"}><div class="inputs-tab-container">${this.showNoStartingPointsWarning && this.mode === "default" && this.renderNoStartingPointsWarning() || ""}${this.showMissingTerminalWarning && this.mode === "default" && this.renderMissingTerminalWarning() || ""}<arcgis-utility-network-trace-inputs .view=${this.view || void 0} .referenceElement=${this.referenceElement} .beforeTraceLocationSelectStart=${this.beforeTraceLocationSelectStart} .hideActionBar=${this.hideActionBar} @arcgisSelectedNamedTraceConfigurationChange=${this._handleSelectedNamedTraceConfigurationChange} @arcgisUtilityNetworkChange=${this._handleUtilityNetworkChange} @arcgisTraceLocationSelectStart=${this._handleTraceLocationSelectStart} @arcgisTraceLocationSelectEnd=${this._handleTraceLocationSelectEnd} @arcgisPropertyChange=${(e) => {
       e.stopPropagation(), e.detail.name === "mode" && (this.mode = e.target.mode);
-    }} .autoDestroyDisabled=${this.autoDestroyDisabled} ${o(this._handleTraceInputsRefChange)}></arcgis-utility-network-trace-inputs></div></calcite-tab>`);
+    }} .autoDestroyDisabled=${this.autoDestroyDisabled} ${h(this._handleTraceInputsRefChange)}></arcgis-utility-network-trace-inputs></div></calcite-tab>`);
   }
   renderInputFooter() {
     const { mode: e, state: t } = this;

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

@@ -351,7 +351,7 @@ class A extends T {
     return r`<arcgis-utility-network-trace-location .view=${this.view} trace-location-type=barrier .beforeTraceLocationSelectStart=${this.beforeTraceLocationSelectStart} @arcgisTraceLocationSelectStart=${this._handleTraceLocationSelectStart} @arcgisTraceLocationSelectEnd=${this._handleTraceLocationSelectEnd} @arcgisTraceLocationChange=${() => this.arcgisTraceInputsChange.emit()} .sketchViewModel=${this._sketchViewModel} .utilityNetwork=${this.selectedUtilityNetwork} .filterLayers=${this._unLayers} .traceLocations=${this._barriers} .afterHitTest=${this._handleHitTestComplete.bind(this)} .autoDestroyDisabled=${this.autoDestroyDisabled} ${h(this._traceLocationBarrierRefChange)}></arcgis-utility-network-trace-location>`;
   }
   renderSubnetworkNameInput() {
-    return r`<calcite-input clearable type=text .placeholder=${this._messages.instructions.enterSubnetworkName} max-length=64 .value=${this.selectedSubnetworkName} @calciteInputInput=${(e) => this.selectedSubnetworkName = e.target.value}></calcite-input><calcite-input-message icon=exclamation-mark-triangle status=idle>${this._messages.labels.tooManySubnetworks}</calcite-input-message>`;
+    return r`<calcite-input clearable type=text .placeholder=${this._messages.instructions.enterSubnetworkName} max-length=64 .status=${this.selectedSubnetworkName ? "valid" : "invalid"} .value=${this.selectedSubnetworkName} @calciteInputInput=${(e) => this.selectedSubnetworkName = e.target.value}></calcite-input><calcite-input-message icon=exclamation-mark-triangle status=idle>${this._messages.labels.tooManySubnetworks}</calcite-input-message>`;
   }
   renderSubnetworkSelectList() {
     return r`<calcite-combobox .label=${this._messages.labels.subnetworkName} selection-mode=single-persist @calciteComboboxChange=${({ currentTarget: e }) => {

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

@@ -1,47 +1,46 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
 import { c as u } from "../../chunks/runtime.js";
-import { css as d, html as h } from "lit";
-import { ignoreAbortErrors as f } from "@arcgis/core/core/promiseUtils.js";
-import { when as g } from "@arcgis/core/core/reactiveUtils.js";
-import { LitElement as y, createEvent as r, nothing as c, safeClassMap as b } from "@arcgis/lumina";
-import { usePropertyChange as p } from "@arcgis/lumina/controllers";
-import { u as z } from "../../chunks/useT9n.js";
-import { u as v } from "../../chunks/useView.js";
-import { g as x } from "../../chunks/globalCss.js";
-function n(t) {
+import { css as m, html as d } from "lit";
+import { when as h } from "@arcgis/core/core/reactiveUtils.js";
+import { LitElement as f, createEvent as i, nothing as r, safeClassMap as y } from "@arcgis/lumina";
+import { usePropertyChange as g } from "@arcgis/lumina/controllers";
+import { u as b } from "../../chunks/useT9n.js";
+import { u as p } from "../../chunks/useView.js";
+import { g as z } from "../../chunks/globalCss.js";
+function c(t) {
   if (!t)
     return !1;
   if (t.type === "3d")
     return t.ready;
   if (!t?.ready)
     return !1;
-  const o = m(t), a = t.constraints?.effectiveMaxScale;
-  return a === 0 || o > a;
+  const a = l(t), o = t.constraints?.effectiveMaxScale;
+  return o === 0 || a > o;
 }
-function l(t) {
+function n(t) {
   if (!t)
     return !1;
   if (t.type === "3d")
     return t.ready;
   if (!t?.ready)
     return !1;
-  const o = m(t), a = t.constraints?.effectiveMinScale;
-  return a === 0 || o < a;
+  const a = l(t), o = t.constraints?.effectiveMinScale;
+  return o === 0 || a < o;
 }
-function m(t) {
+function l(t) {
   const e = t?.animation?.target;
   return (e && "then" in e ? void 0 : e?.scale) ?? t?.scale ?? 0;
 }
-const w = d`.arcgis-button{--calcite-icon-color: var(--calcite-color-text-3);--calcite-button-background-color: var(--calcite-color-foreground-1);color:var(--calcite-color-text-3);line-height:var(--calcite-font-line-height-relative-tight);display:flex;flex-flow:column;cursor:pointer;background-color:var(--calcite-color-foreground-1);font-size:var(--calcite-font-size);:hover{--calcite-icon-color: var(--calcite-color-text-1);--calcite-button-background-color: var(--calcite-color-transparent-hover)}}:host{display:flex;max-width:fit-content}.zoom-out{border-block-start:solid 1px var(--calcite-color-border-1)}.horizontal{flex-flow:row-reverse nowrap}.horizontal .zoom-out{border-block-start:none;border-inline-end:solid 1px var(--calcite-color-border-1)}`;
-class $ extends y {
+const v = m`.arcgis-button{--calcite-icon-color: var(--calcite-color-text-3);--calcite-button-background-color: var(--calcite-color-foreground-1);color:var(--calcite-color-text-3);line-height:var(--calcite-font-line-height-relative-tight);display:flex;flex-flow:column;cursor:pointer;background-color:var(--calcite-color-foreground-1);font-size:var(--calcite-font-size);:hover{--calcite-icon-color: var(--calcite-color-text-1);--calcite-button-background-color: var(--calcite-color-transparent-hover)}}:host{display:flex;max-width:fit-content}.zoom-out{border-block-start:solid 1px var(--calcite-color-border-1)}.horizontal{flex-flow:row-reverse nowrap}.horizontal .zoom-out{border-block-start:none;border-inline-end:solid 1px var(--calcite-color-border-1)}`;
+class x extends f {
   constructor() {
-    super(...arguments), this.messages = z({}), this._state = "disabled", this.view = v(this), this.autoDestroyDisabled = !1, this.icon = "magnifying-glass-plus", this.layout = "vertical", this.visualScale = "m", this.arcgisActionZoom = r(), this.arcgisPropertyChange = p()("state"), this.arcgisReady = r();
+    super(...arguments), this.messages = b({}), this._state = "disabled", this.view = p(this), this.autoDestroyDisabled = !1, this.icon = "magnifying-glass-plus", this.layout = "vertical", this.visualScale = "m", this.arcgisActionZoom = i(), this.arcgisPropertyChange = g()("state"), this.arcgisReady = i();
   }
   static {
     this.properties = { _state: 16, view: 0, autoDestroyDisabled: 5, icon: 1, label: 1, layout: 3, messageOverrides: 0, referenceElement: 1, visualScale: 1, state: 32 };
   }
   static {
-    this.styles = w;
+    this.styles = v;
   }
   get state() {
     return this._state;
@@ -57,29 +56,24 @@ class $ extends y {
   }
   loaded() {
     this.manager.onLifecycle(() => [
-      g(() => this.view?.ready ? "ready" : "disabled", (e) => {
+      h(() => this.view?.ready ? "ready" : "disabled", (e) => {
         this._state = e;
       }, { sync: !0, initial: !0 })
     ]);
   }
   async zoomBy(e) {
-    const { view: o } = this, a = e === 1;
-    if (!(!(a ? n(o) : l(o)) || !o))
-      if (this.arcgisActionZoom.emit({ action: a ? "zoomIn" : "zoomOut" }), o.type === "2d") {
-        const s = o.mapViewNavigation;
-        a ? await s.zoomIn() : await s.zoomOut();
-      } else
-        await f(o.goTo({ zoom: o.zoom + e }));
+    const { view: a } = this, o = e === 1;
+    !(o ? c(a) : n(a)) || !a || (this.arcgisActionZoom.emit({ action: o ? "zoomIn" : "zoomOut" }), o ? await a.zoomIn() : await a.zoomOut());
   }
   render() {
-    const e = n(this.view), o = l(this.view), { zoomIn: a, zoomOut: i } = this.messages;
-    return h`<div class=${b({
-      [x.arcgisButton]: !0,
+    const e = c(this.view), a = n(this.view), { zoomIn: o, zoomOut: s } = this.messages;
+    return d`<div class=${y({
+      [z.arcgisButton]: !0,
       horizontal: this.layout === "horizontal"
-    })}><calcite-button class="zoom-in" .disabled=${!e} icon-start=plus kind=neutral .label=${a} @click=${this.zoomIn} .scale=${this.visualScale} title=${a ?? c}></calcite-button><calcite-button class="zoom-out" .disabled=${!o} icon-start=minus kind=neutral .label=${i} @click=${this.zoomOut} .scale=${this.visualScale} title=${i ?? c}></calcite-button></div>`;
+    })}><calcite-button class="zoom-in" .disabled=${!e} icon-start=plus kind=neutral .label=${o} @click=${this.zoomIn} .scale=${this.visualScale} title=${o ?? r}></calcite-button><calcite-button class="zoom-out" .disabled=${!a} icon-start=minus kind=neutral .label=${s} @click=${this.zoomOut} .scale=${this.visualScale} title=${s ?? r}></calcite-button></div>`;
   }
 }
-u("arcgis-zoom", $);
+u("arcgis-zoom", x);
 export {
-  $ as ArcgisZoom
+  x as ArcgisZoom
 };