@arcgis/map-components 5.1.0-next.75 → 5.1.0-next.77

package/dist/components/arcgis-feature-relationship/customElement.js

@@ -1,36 +1,37 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
-import { c as T } from "../../chunks/runtime.js";
-import { css as k, html as o } from "lit";
+import { c as k } from "../../chunks/runtime.js";
+import { css as H, html as o } from "lit";
 import { keyed as P } from "lit/directives/keyed.js";
 import { debounce as $ } from "@arcgis/toolkit/function";
-import { LitElement as H, renderElement as D, safeClassMap as x } from "@arcgis/lumina";
+import { LitElement as K, renderElement as D, safeClassMap as x } from "@arcgis/lumina";
 import { templateHasKey as E, stripHTML as N } from "@arcgis/core/applications/Components/stringUtils.js";
-import { isRelatableFeatureSupportedLayer as K, findRelatedLayer as W } from "@arcgis/core/applications/Components/featureUtils.js";
-import { substitute as Z, formatNumber as O } from "@arcgis/core/intl.js";
-import { watch as f, on as z } from "@arcgis/core/core/reactiveUtils.js";
-import { o as G } from "../../chunks/feature-utils.js";
-import V from "@arcgis/core/core/Collection.js";
-import S from "@arcgis/core/rest/support/RelationshipQuery.js";
+import { renderingSanitizer as O } from "@arcgis/core/applications/Components/sanitizerUtils.js";
+import { isRelatableFeatureSupportedLayer as W, findRelatedLayer as z } from "@arcgis/core/applications/Components/featureUtils.js";
+import { substitute as Z, formatNumber as M } from "@arcgis/core/intl.js";
+import { watch as f, on as G } from "@arcgis/core/core/reactiveUtils.js";
+import { o as J } from "../../chunks/feature-utils.js";
+import S from "@arcgis/core/core/Collection.js";
+import V from "@arcgis/core/rest/support/RelationshipQuery.js";
 import { ignoreAbortErrors as q } from "@arcgis/core/core/promiseUtils.js";
-import { classes as M } from "@arcgis/toolkit/dom";
-import { createRef as J, ref as U } from "lit/directives/ref.js";
-import X from "@arcgis/core/popup/Feature.js";
-const Y = k`:host{position:relative;flex:1 1 auto}.list{min-height:var(--calcite-spacing-xxxl)}.list-item-hidden{display:none}.feature-observer{position:relative;bottom:var(--calcite-spacing-xxl);z-index:2;text-align:center}.sticky-loading-container{display:flex;position:sticky;bottom:var(--calcite-spacing-sm);align-items:center;justify-content:center;z-index:2;margin:0;padding:0;height:var(--calcite-spacing-xxxl);pointer-events:none}`, ee = (g) => {
+import { classes as Q } from "@arcgis/toolkit/dom";
+import { createRef as U, ref as X } from "lit/directives/ref.js";
+import Y from "@arcgis/core/popup/Feature.js";
+const ee = H`:host{position:relative;flex:1 1 auto}.list{min-height:var(--calcite-spacing-xxxl)}.list-item-hidden{display:none}.feature-observer{position:relative;bottom:var(--calcite-spacing-xxl);z-index:2;text-align:center}.sticky-loading-container{display:flex;position:sticky;bottom:var(--calcite-spacing-sm);align-items:center;justify-content:center;z-index:2;margin:0;padding:0;height:var(--calcite-spacing-xxxl);pointer-events:none}`, te = (g) => {
   const e = [];
   if (g.formTemplate) {
     const { description: t, title: r } = g.formTemplate;
-    g.fields?.forEach((s) => {
-      const i = r && E(r, s.name), a = t && E(t, s.name);
-      (i || a) && e.push(s.name);
+    g.fields?.forEach((i) => {
+      const s = r && E(r, i.name), a = t && E(t, i.name);
+      (s || a) && e.push(i.name);
     });
   }
   return e;
 }, L = 100;
-class te extends H {
+class re extends K {
   constructor() {
     super(...arguments), this._increaseFeaturePage = () => {
-      const { state: e, showAllEnabled: t, relatedFeatures: r, featuresPerPage: s, featurePage: i } = this;
-      e === "ready" && t && r.length >= s * i && this.featurePage++;
+      const { state: e, showAllEnabled: t, relatedFeatures: r, featuresPerPage: i, featurePage: s } = this;
+      e === "ready" && t && r.length >= i * s && this.featurePage++;
     }, this._relatedFeatureIntersectionObserver = new IntersectionObserver(([e]) => {
       e?.isIntersecting && this._increaseFeaturePage();
     }, {
@@ -60,19 +61,19 @@ class te extends H {
       !this.featureCount || this.relatedLayer?.type === "subtype-group" && !this.activeCategory || (this.relatedFeatureViewModels.destroyAll(), this.featurePage = 1, t.destroyAll(), t.addMany(this._sliceFeatures(await this._queryRelatedFeatures({ signal: e?.signal }))));
     }, this._addFlowItem = (e) => {
       e && this.flowItems?.push(e);
-    }, this._relatedFeatureIntersectionObserverNode = J(), this.relatedFeatures = new V(), this._queryAbortController = null, this._queryPageAbortController = null, this._queryFeatureCountAbortController = null, this.featureCount = 0, this._loaded = !1, this.relatedFeatureViewModels = new V(), this.autoDestroyDisabled = !1, this.featuresPerPage = 10, this.flowType = "feature-relationship", this.headingLevel = 2, this.hideHeading = !1, this.hideDescription = !1, this.showAllEnabled = !1;
+    }, this._relatedFeatureIntersectionObserverNode = U(), this.relatedFeatures = new S(), this._queryAbortController = null, this._queryPageAbortController = null, this._queryFeatureCountAbortController = null, this.featureCount = 0, this._loaded = !1, this.relatedFeatureViewModels = new S(), this.autoDestroyDisabled = !1, this.featuresPerPage = 10, this.flowType = "feature-relationship", this.headingLevel = 2, this.hideHeading = !1, this.hideDescription = !1, this.showAllEnabled = !1;
   }
   static {
     this.properties = { allCategories: 16, _queryAbortController: 16, _queryPageAbortController: 16, _queryFeatureCountAbortController: 16, featureCount: 16, _loaded: 16, canLoad: 16, canQuery: 16, displayShowAllButton: 16, displayListItems: 16, categories: 16, itemDescriptionFieldName: 16, relatedFeatureViewModels: 16, state: 16, autoDestroyDisabled: 5, allItemsDescription: 32, featurePage: 9, featuresPerPage: 9, flowItems: 0, flowType: 1, headingLevel: 9, messages: 0, heading: 1, description: 1, values: 0, activeCategory: 0, hideHeading: 5, hideDescription: 5, displayCount: 9, graphic: 0, layer: 0, map: 0, view: 0, spatialReference: 0, timeZone: 1, orderByFields: 0, relationshipId: 9, showAllEnabled: 5, label: 3 };
   }
   static {
-    this.styles = Y;
+    this.styles = ee;
   }
   get orderByFieldsFixedCasing() {
     const { orderByFields: e, relatedLayer: t } = this;
     return e && t?.loaded ? e.map((r) => {
-      const s = r.clone();
-      return s.field = G(r.field, t), s;
+      const i = r.clone();
+      return i.field = J(r.field, t), i;
     }) : e ?? [];
   }
   get supportsCacheHint() {
@@ -91,8 +92,8 @@ class te extends H {
     const { layer: e, map: t, relationship: r } = this;
     if (!e?.loaded || !t || !r)
       return null;
-    const s = e.type === "subtype-sublayer" && e.parent && K(e.parent) ? e.parent : e;
-    return W(t, s, r) ?? null;
+    const i = e.type === "subtype-sublayer" && e.parent && W(e.parent) ? e.parent : e;
+    return z(t, i, r) ?? null;
   }
   get relatedLayerKeyField() {
     const { relatedLayer: e, relationshipId: t } = this;
@@ -121,8 +122,8 @@ class te extends H {
     return !!this.relatedLayer && !!this.relationship && this.relationshipId != null && this.objectId != null && !!e?.supportsCount && e?.supportsPagination;
   }
   get displayShowAllButton() {
-    const { showAllEnabled: e, featureCount: t, displayCount: r, state: s, allCategoriesCount: i } = this, a = !!i && (i > r || r === 0), n = !!t && (t > r || r === 0);
-    return !e && s === "ready" && (a || n);
+    const { showAllEnabled: e, featureCount: t, displayCount: r, state: i, allCategoriesCount: s } = this, a = !!s && (s > r || r === 0), n = !!t && (t > r || r === 0);
+    return !e && i === "ready" && (a || n);
   }
   get displayListItems() {
     const { relatedFeatures: e, allCategoriesCount: t } = this;
@@ -136,21 +137,21 @@ class te extends H {
     return this.orderByFieldsFixedCasing[0]?.field || null;
   }
   get state() {
-    const { _queryAbortController: e, _queryFeatureCountAbortController: t, _queryPageAbortController: r, canQuery: s, _loaded: i, canLoad: a } = this;
-    return t || a && !i ? "loading" : e || r ? "querying" : s ? "ready" : "disabled";
+    const { _queryAbortController: e, _queryFeatureCountAbortController: t, _queryPageAbortController: r, canQuery: i, _loaded: s, canLoad: a } = this;
+    return t || a && !s ? "loading" : e || r ? "querying" : i ? "ready" : "disabled";
   }
   get allItemsDescription() {
-    const { messages: e, featureCount: t, allCategories: r, allCategoriesCount: s } = this;
+    const { messages: e, featureCount: t, allCategories: r, allCategoriesCount: i } = this;
     return Z(e?.numberRecords ?? "", {
-      number: O(r ? s : t)
+      number: M(r ? i : t)
     });
   }
   get featurePage() {
     return this._featurePage;
   }
   set featurePage(e) {
-    const { featuresPerPage: t, featureCount: r } = this, s = 1, i = Math.ceil(r / t) || 1;
-    this._featurePage = Math.min(Math.max(e, s), i);
+    const { featuresPerPage: t, featureCount: r } = this, i = 1, s = Math.ceil(r / t) || 1;
+    this._featurePage = Math.min(Math.max(e, i), s);
   }
   get heading() {
     const { activeCategory: e } = this;
@@ -187,7 +188,7 @@ class te extends H {
       f(() => [this.featurePage, this.showAllEnabled], () => this._queryPageDebounced()),
       f(() => [this.layer, this.relationshipId, this.objectId, this.canQuery, this.activeCategory], () => this._queryFeatureCountDebounced(), { initial: !0 }),
       f(() => [this.state, this.showAllEnabled, this._relatedFeatureIntersectionObserverNode], () => this._handleRelatedFeatureObserverChange()),
-      z(() => this.relatedFeatures, "change", () => this._setRelatedFeaturesViewModels())
+      G(() => this.relatedFeatures, "change", () => this._setRelatedFeaturesViewModels())
     ]), this.manager.onDestroy(() => {
       this.relatedFeatureViewModels.destroyAll(), this.relatedFeatures.destroyAll(), this._cancelQuery(), this._cancelQueryFeatureCount(), this._cancelQueryPage(), this._unobserveRelatedFeatureObserver();
     });
@@ -195,19 +196,19 @@ class te extends H {
   async _queryFeatureCount() {
     const { layer: e, relatedLayer: t } = this;
     await e?.load(), await t?.load();
-    const { _queryFeatureCountAbortController: r, activeCategory: s, canQuery: i, objectId: a, relatedLayerKeyField: n, relationshipId: l, relationshipKey: d, supportsCacheHint: b } = this;
-    if (!i || !e || !t || a == null) {
+    const { _queryFeatureCountAbortController: r, activeCategory: i, canQuery: s, objectId: a, relatedLayerKeyField: n, relationshipId: l, relationshipKey: d, supportsCacheHint: b } = this;
+    if (!s || !e || !t || a == null) {
       this.featureCount = 0, this.allCategories = void 0;
       return;
     }
-    if (t?.type === "subtype-group" && !s) {
+    if (t?.type === "subtype-group" && !i) {
       if (this.featureCount = 0, this.relatedFeatureViewModels.destroyAll(), this.featurePage = 1, this.relatedFeatures.destroyAll(), n && d != null) {
-        const { default: F } = await import("@arcgis/core/smartMapping/statistics/uniqueValues.js"), { uniqueValueInfos: w } = await F({
+        const { default: F } = await import("@arcgis/core/smartMapping/statistics/uniqueValues.js"), { uniqueValueInfos: v } = await F({
           layer: t,
           sqlWhere: `${n} = '${d}'`,
           field: t.subtypeField ?? void 0,
           signal: r?.signal
-        }), v = w.map(({ count: h, value: y }) => {
+        }), w = v.map(({ count: h, value: y }) => {
           const m = t.subtypes?.find((I) => I.code === y)?.name;
           return y != null && m ? {
             count: h,
@@ -215,11 +216,11 @@ class te extends H {
             name: m
           } : void 0;
         }).filter((h) => h != null);
-        this.allCategories = v;
+        this.allCategories = w;
       }
       return;
     }
-    const { historicMoment: p, gdbVersion: _ } = e, C = new S({
+    const { historicMoment: p, gdbVersion: _ } = e, C = new V({
       cacheHint: b,
       gdbVersion: _,
       historicMoment: p,
@@ -233,40 +234,40 @@ class te extends H {
     this.allCategories = void 0, this.featureCount = c[a] || 0;
   }
   _getRelationshipWhereClause(e) {
-    const { activeCategory: t } = this, r = e.createQuery(), s = "subtypeField" in e ? e.subtypeField : void 0, i = t && s ? `${s} = ${t.value}` : void 0, a = r.where;
-    return a && i ? `(${a}) AND (${i})` : a ?? i;
+    const { activeCategory: t } = this, r = e.createQuery(), i = "subtypeField" in e ? e.subtypeField : void 0, s = t && i ? `${i} = ${t.value}` : void 0, a = r.where;
+    return a && s ? `(${a}) AND (${s})` : a ?? s;
   }
   _sliceFeatures(e) {
     const { showAllEnabled: t, displayCount: r } = this;
     return t ? e : r ? e.slice(0, r) : [];
   }
   async _queryPage() {
-    const { relatedFeatures: e, featurePage: t, showAllEnabled: r, _queryPageAbortController: s, featureCount: i } = this;
-    !r || t < 2 || !i || this.relatedLayer?.type === "subtype-group" && !this.activeCategory || e.addMany(await this._queryRelatedFeatures({ signal: s?.signal }));
+    const { relatedFeatures: e, featurePage: t, showAllEnabled: r, _queryPageAbortController: i, featureCount: s } = this;
+    !r || t < 2 || !s || this.relatedLayer?.type === "subtype-group" && !this.activeCategory || e.addMany(await this._queryRelatedFeatures({ signal: i?.signal }));
   }
   async _queryRelatedFeatures(e) {
-    const { displayCount: t, featureCount: r, featurePage: s, featuresPerPage: i, layer: a, orderByFieldsFixedCasing: n, relatedLayer: l, relatedLayerKeyFields: d, relationshipId: b, showAllEnabled: p, supportsCacheHint: _ } = this, { canQuery: C, objectId: c } = this;
+    const { displayCount: t, featureCount: r, featurePage: i, featuresPerPage: s, layer: a, orderByFieldsFixedCasing: n, relatedLayer: l, relatedLayerKeyFields: d, relationshipId: b, showAllEnabled: p, supportsCacheHint: _ } = this, { canQuery: C, objectId: c } = this;
     if (!C || !a || !l || c == null)
       return [];
-    const F = p ? ((s - 1) * i + r) % r : 0, w = p ? i : t, v = l.objectIdField, h = "subtypeField" in l ? l.subtypeField : void 0, y = [
+    const F = p ? ((i - 1) * s + r) % r : 0, v = p ? s : t, w = l.objectIdField, h = "subtypeField" in l ? l.subtypeField : void 0, y = [
       ...n.map((u) => u.field),
-      ...ee(l),
+      ...te(l),
       ...d,
-      v,
+      w,
       h
-    ].filter((u) => u != null), m = n.map((u) => `${u.field} ${u.order}`), { historicMoment: I, gdbVersion: Q } = a, j = new S({
+    ].filter((u) => u != null), m = n.map((u) => `${u.field} ${u.order}`), { historicMoment: I, gdbVersion: j } = a, T = new V({
       orderByFields: m,
       start: F,
-      num: w,
+      num: v,
       outFields: y,
       cacheHint: _,
       historicMoment: I,
-      gdbVersion: Q,
+      gdbVersion: j,
       relationshipId: b,
       returnGeometry: !1,
       objectIds: [c],
       where: this._getRelationshipWhereClause(l)
-    }), A = (await a.queryRelatedFeatures(j, {
+    }), A = (await a.queryRelatedFeatures(T, {
       signal: e?.signal
     }))[c]?.features || [];
     return l.type === "subtype-group" && h ? A.forEach((u) => {
@@ -300,17 +301,17 @@ class te extends H {
     this._relatedFeatureIntersectionObserverNode.value && this._relatedFeatureIntersectionObserver.unobserve(this._relatedFeatureIntersectionObserverNode.value);
   }
   _matchesFeature(e, t) {
-    const r = e?.graphic?.getObjectId(), s = t?.getObjectId();
-    return r != null && s != null && r === s;
+    const r = e?.graphic?.getObjectId(), i = t?.getObjectId();
+    return r != null && i != null && r === i;
   }
   _setRelatedFeaturesViewModels() {
-    const { relatedFeatures: e, relatedFeatureViewModels: t, map: r, view: s, spatialReference: i, timeZone: a } = this;
+    const { relatedFeatures: e, relatedFeatureViewModels: t, map: r, view: i, spatialReference: s, timeZone: a } = this;
     e?.filter(Boolean).forEach((n) => {
-      t.some((d) => this._matchesFeature(d, n)) || t.add(new X({
+      t.some((d) => this._matchesFeature(d, n)) || t.add(new Y({
         abilities: { relationshipContent: !1 },
         map: r,
-        view: s,
-        spatialReference: i,
+        view: i,
+        spatialReference: s,
         timeZone: a,
         graphic: n
       }));
@@ -338,15 +339,15 @@ class te extends H {
     return o`<calcite-icon flip-rtl icon=chevron-right scale=s slot=content-end></calcite-icon>`;
   }
   _renderCategory(e) {
-    const { count: t, name: r } = e, s = O(t);
-    return o`<calcite-list-item class="list-item" .disabled=${!t} .label=${r} @calciteListItemSelect=${() => this._selectCategory(e)}><calcite-chip .label=${s} scale=s slot=content-end>${s}</calcite-chip>${this._renderChevronIconNode()}</calcite-list-item>`;
+    const { count: t, name: r } = e, i = M(t);
+    return o`<calcite-list-item class="list-item" .disabled=${!t} .label=${r} @calciteListItemSelect=${() => this._selectCategory(e)}><calcite-chip .label=${i} scale=s slot=content-end>${i}</calcite-chip>${this._renderChevronIconNode()}</calcite-list-item>`;
   }
   _renderRelatedFeature(e) {
-    const { itemDescriptionFieldName: t, values: r } = this, { formattedAttributes: s, state: i, heading: a } = e, n = {
+    const { itemDescriptionFieldName: t, values: r } = this, { formattedAttributes: i, state: s, heading: a } = e, n = {
       ...r,
-      ...s?.global
+      ...i?.global
     }, l = (t && n?.[t]) ?? "";
-    return o`<calcite-list-item class=${x(M("list-item", { "list-item-hidden": i === "loading" }))} .description=${N(l.toString())} .label=${N(a)} @calciteListItemSelect=${() => this._selectRecord(e)}>${this._renderChevronIconNode()}</calcite-list-item>`;
+    return o`<calcite-list-item class=${x(Q("list-item", { "list-item-hidden": s === "loading" }))} .description=${N(l.toString())} .label=${N(a)} @calciteListItemSelect=${() => this._selectRecord(e)}><div slot=heading .innerHTML=${O.sanitize(a ?? "") ?? ""}></div><div slot=description .innerHTML=${O.sanitize(l ?? "") ?? ""}></div>${this._renderChevronIconNode()}</calcite-list-item>`;
   }
   _renderShowAllListItem() {
     return this.displayShowAllButton ? o`<calcite-list-item .description=${this.allItemsDescription} .label=${this.messages?.showAll} @calciteListItemSelect=${() => this._showAllRecords()}>${this._renderShowAllIconNode()}</calcite-list-item>` : null;
@@ -355,7 +356,7 @@ class te extends H {
     return o`<calcite-notice icon=information kind=brand open scale=s width=full><div slot=message>${this.messages?.noRelatedFeatures}</div></calcite-notice>`;
   }
   _renderFeatureObserver() {
-    return o`<div class="feature-observer" ${U(this._relatedFeatureIntersectionObserverNode)}></div>`;
+    return o`<div class="feature-observer" ${X(this._relatedFeatureIntersectionObserverNode)}></div>`;
   }
   _renderList() {
     const { relatedFeatureViewModels: e, categories: t } = this;
@@ -363,7 +364,7 @@ class te extends H {
   }
   _renderRelatedFeatures() {
     const { displayListItems: e } = this, { state: t } = this;
-    return o`<div class=${x(M("list", {
+    return o`<div class=${x(Q("list", {
       "list-querying": t === "querying"
     }))}>${e ? this._renderList() : t === "ready" ? this._renderNoRelatedFeaturesMessage() : null}${this._renderStickyLoading()}${this._renderFeatureObserver()}</div>`;
   }
@@ -371,7 +372,7 @@ class te extends H {
     return o`<calcite-notice icon=exclamation-mark-triangle kind=danger open scale=s width=full><div slot=message>${this.messages?.relationshipNotFound}</div></calcite-notice>`;
   }
 }
-T("arcgis-feature-relationship", te);
+k("arcgis-feature-relationship", re);
 export {
-  te as ArcgisFeatureRelationship
+  re as ArcgisFeatureRelationship
 };

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

@@ -51,7 +51,7 @@ export abstract class ArcgisFeatures extends LitElement {
    */
   accessor actions: Collection<PopupAction>;
   /**
-   * Indicates if the component is active when it is visible and is not [waiting](https://developers.arcgis.com/javascript/latest/references/core/widgets/Features/FeaturesViewModel/#waitingForResult) for results.
+   * Indicates if the component is active when it is visible and is not [waiting](https://developers.arcgis.com/javascript/latest/references/core/popup/Features/#waitingForResult) for results.
    *
    * @default false
    */
@@ -446,7 +446,7 @@ export abstract class ArcgisFeatures extends LitElement {
    *
    * @default false
    * @see [fetchFeatures()](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-features/#fetchFeatures)
-   * @see [active](https://developers.arcgis.com/javascript/latest/references/core/widgets/Features/FeaturesViewModel/#active)
+   * @see [active](https://developers.arcgis.com/javascript/latest/references/core/popup/Features/#active)
    * @see [clear()](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-features/#clear)
    * @since 5.0
    * @example

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

@@ -1,37 +1,37 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
-import { c as O } from "../../chunks/runtime.js";
-import { css as B, html as o } from "lit";
-import { keyed as b } from "lit/directives/keyed.js";
-import L from "@arcgis/core/popup/Features.js";
+import { c as L } from "../../chunks/runtime.js";
+import { css as O, html as o } from "lit";
+import { keyed as $ } from "lit/directives/keyed.js";
+import B from "@arcgis/core/popup/Features.js";
 import { u as R } from "../../chunks/useT9n.js";
-import { classes as $ } from "@arcgis/toolkit/dom";
-import { usePropertyChange as S, bypassReadOnly as x } from "@arcgis/lumina/controllers";
+import { classes as C } from "@arcgis/toolkit/dom";
+import { usePropertyChange as S, bypassReadOnly as T } from "@arcgis/lumina/controllers";
 import { m as P } from "../../chunks/useViewModel.js";
-import { LitElement as H, createEvent as C, renderElement as z, nothing as c, safeClassMap as y } from "@arcgis/lumina";
-import { substitute as d, formatNumber as F } from "@arcgis/core/intl.js";
+import { LitElement as H, createEvent as y, renderElement as z, nothing as c, safeClassMap as A } from "@arcgis/lumina";
+import { substitute as d, formatNumber as _ } from "@arcgis/core/intl.js";
 import { watch as l } from "@arcgis/core/core/reactiveUtils.js";
 import { b as V, t as U, z as Z, a as j } from "../../chunks/action-utils.js";
-import { stripHTML as A } from "@arcgis/core/applications/Components/stringUtils.js";
-import T from "@arcgis/core/core/Collection.js";
+import { stripHTML as I } from "@arcgis/core/applications/Components/stringUtils.js";
+import k from "@arcgis/core/core/Collection.js";
 import { a as G } from "../../chunks/feature-utils.js";
-import { renderingSanitizer as k } from "@arcgis/core/applications/Components/sanitizerUtils.js";
+import { renderingSanitizer as m } from "@arcgis/core/applications/Components/sanitizerUtils.js";
 import { initializeProjection as K } from "@arcgis/core/applications/Components/featureUtils.js";
-import { createRef as m, ref as v } from "lit/directives/ref.js";
-const q = B`:host{display:flex;overflow:hidden;flex:1 1 auto}.root{--calcite-color-background: var(--calcite-color-foreground-1);display:flex;overflow:hidden;flex:1 1 auto;flex-direction:column}.root img{image-orientation:from-image}.flow-item-collapsed{--calcite-flow-item-header-border-block-end: none}.container{display:flex;flex:1 1 auto;background-color:var(--calcite-color-foreground-1)}.container calcite-list{width:100%}.container:not(:empty){padding:var(--arcgis-internal-padding-md, var(--calcite-spacing-md))}.root .arcgis-feature,.root .arcgis-feature-relationship,.root .arcgis-feature-utility-network-associations{background-color:transparent}.heading{word-break:break-word;word-wrap:break-word}.header,.footer{display:flex;align-items:center;justify-content:flex-end;background-color:var(--calcite-color-foreground-1)}.footer{flex:1}.pagination-text{padding-inline:var(--calcite-spacing-sm);color:var(--calcite-color-text-3);font-size:var(--calcite-font-size-sm)}.loader{align-self:center;padding-inline:var(--calcite-spacing-lg)}.pagination-action-bar{flex:1}.pagination-menu-button{padding-inline:var(--calcite-spacing-xxs);border-inline-start:var(--calcite-border-width-sm) solid var(--calcite-color-border-3)}.icon{display:inline-block;flex:0 0 var(--calcite-spacing-lg);width:var(--calcite-spacing-lg);height:var(--calcite-spacing-lg)}.action-image{flex:0 0 var(--calcite-spacing-lg);background-position:50% 50%;background-repeat:no-repeat;background-size:contain;width:var(--calcite-spacing-lg);height:var(--calcite-spacing-lg)}.header{border-block-end:var(--calcite-border-width-sm) solid var(--calcite-color-border-3)}.content-feature{--calcite-flow-item-footer-padding: 0}.feature-menu-observer{position:relative;bottom:var(--calcite-spacing-xxl);z-index:2;text-align:center}.action-exit{transform:scaleX(-1)}`, w = j.clone();
-function W(I) {
-  return I?.declaredClass.startsWith("esri.layers.") ?? !1;
+import { createRef as w, ref as v } from "lit/directives/ref.js";
+const q = O`:host{display:flex;overflow:hidden;flex:1 1 auto}.root{--calcite-color-background: var(--calcite-color-foreground-1);display:flex;overflow:hidden;flex:1 1 auto;flex-direction:column}.root img{image-orientation:from-image}.flow-item-collapsed{--calcite-flow-item-header-border-block-end: none}.container{display:flex;flex:1 1 auto;background-color:var(--calcite-color-foreground-1)}.container calcite-list{width:100%}.container:not(:empty){padding:var(--arcgis-internal-padding-md, var(--calcite-spacing-md))}.root .arcgis-feature,.root .arcgis-feature-relationship,.root .arcgis-feature-utility-network-associations{background-color:transparent}.heading{word-break:break-word;word-wrap:break-word}.header,.footer{display:flex;align-items:center;justify-content:flex-end;background-color:var(--calcite-color-foreground-1)}.footer{flex:1}.pagination-text{padding-inline:var(--calcite-spacing-sm);color:var(--calcite-color-text-3);font-size:var(--calcite-font-size-sm)}.loader{align-self:center;padding-inline:var(--calcite-spacing-lg)}.pagination-action-bar{flex:1}.pagination-menu-button{padding-inline:var(--calcite-spacing-xxs);border-inline-start:var(--calcite-border-width-sm) solid var(--calcite-color-border-3)}.icon{display:inline-block;flex:0 0 var(--calcite-spacing-lg);width:var(--calcite-spacing-lg);height:var(--calcite-spacing-lg)}.action-image{flex:0 0 var(--calcite-spacing-lg);background-position:50% 50%;background-repeat:no-repeat;background-size:contain;width:var(--calcite-spacing-lg);height:var(--calcite-spacing-lg)}.header{border-block-end:var(--calcite-border-width-sm) solid var(--calcite-color-border-3)}.content-feature{--calcite-flow-item-footer-padding: 0}.feature-menu-observer{position:relative;bottom:var(--calcite-spacing-xxl);z-index:2;text-align:center}.action-exit{transform:scaleX(-1)}`, F = j.clone();
+function W(x) {
+  return x?.declaredClass.startsWith("esri.layers.") ?? !1;
 }
-const X = P(L);
+const X = P(B);
 class J extends H {
   constructor() {
     super(...arguments), this._fetchFeaturesController = null, this._featureMenuIntersectionObserverCallback = ([e]) => {
       e?.isIntersecting && this.viewModel.featurePage != null && this.viewModel.featurePage++;
     }, this._featureMenuIntersectionObserver = new IntersectionObserver(this._featureMenuIntersectionObserverCallback, {
       root: window.document
-    }), this._featureMenuIntersectionObserverNode = null, this._rootFlowItemNode = m(), this._featureMenuViewportNode = m(), this._actionBarMenuNode = m(), this._flowContainerNode = m(), this.messages = R(), this._selectedFeatureComponent = m(), this._cancelOpenRelatedFeature = () => {
+    }), this._featureMenuIntersectionObserverNode = null, this._rootFlowItemNode = w(), this._featureMenuViewportNode = w(), this._actionBarMenuNode = w(), this._flowContainerNode = w(), this.messages = R(), this._selectedFeatureComponent = w(), this._cancelOpenRelatedFeature = () => {
       const { _openRelatedFeatureAbortController: e } = this;
       e && e.abort(), this._openRelatedFeatureAbortController = null;
-    }, this._openRelatedFeatureAbortController = null, this.flowItems = new T(), this.viewModel = X(this), this.actions = this.viewModel.actions, this.active = this.viewModel.active, this.autoDestroyDisabled = !1, this.collapsed = !1, this.content = this.viewModel.content, this.defaultPopupTemplateEnabled = this.viewModel.defaultPopupTemplateEnabled, this.featureCount = this.viewModel.featureCount, this.featureMenuOpen = !1, this.featureNavigationTop = !1, this.features = this.viewModel.features, this.featuresPerPage = this.viewModel.featuresPerPage, this.featureItemAbilities = this.viewModel.featureItemAbilities, this.goToOverride = this.viewModel.goToOverride, this.headerActions = new T(), this.heading = this.viewModel.heading, this.headingLevel = 2, this.hideActionBar = !1, this.hideCloseButton = !1, this.hideFeatureMenuHeading = !1, this.hideFeatureNavigation = !1, this.hideFeatureListLayerTitle = !1, this.hideHeading = !1, this.hideSelectFeature = !1, this.hideSpinner = !1, this.hideContent = !1, this.chartAnimationDisabled = this.viewModel.featureItemAbilities?.chartAnimation, this.hideAttachmentsContent = this.viewModel.featureItemAbilities?.attachmentsContent, this.hideCustomContent = this.viewModel.featureItemAbilities?.customContent, this.hideExpressionContent = !1, this.hideFieldsContent = this.viewModel.featureItemAbilities?.fieldsContent, this.hideMediaContent = this.viewModel.featureItemAbilities?.mediaContent, this.hideRelationshipContent = this.viewModel.featureItemAbilities?.relationshipContent, this.hideTextContent = this.viewModel.featureItemAbilities?.textContent, this.hideUtilityNetworkContent = this.viewModel.featureItemAbilities?.utilityNetworkAssociationsContent, this.hideLastEditedInfo = !1, this.highlightDisabled = this.viewModel.highlightEnabled, this.includeDefaultActionsDisabled = this.viewModel.includeDefaultActions, this.initialDisplayMode = this.viewModel.initialDisplayMode, this.location = this.viewModel.location, this.map = this.viewModel.map, this.open = this.viewModel.open, this.promises = this.viewModel.promises, this.responsiveActionsEnabled = !1, this.selectedFeature = this.viewModel.selectedFeature, this.selectedFeatureIndex = this.viewModel.selectedFeatureIndex, this.showCollapseButton = !1, this.spatialReference = this.viewModel.spatialReference, this.state = this.viewModel.state, this.timeZone = this.viewModel.timeZone, this.updateLocationEnabled = this.viewModel.updateLocationEnabled, this.view = this.viewModel.view, this.arcgisPropertyChange = S()("active", "collapsed", "featureCount", "featureMenuOpen", "features", "promises", "selectedDrillInFeature", "selectedFeature", "selectedFeatureComponent", "selectedFeatureIndex", "state", "open"), this.arcgisReady = C(), this.arcgisClose = C(), this.arcgisTriggerAction = C();
+    }, this._openRelatedFeatureAbortController = null, this.flowItems = new k(), this.viewModel = X(this), this.actions = this.viewModel.actions, this.active = this.viewModel.active, this.autoDestroyDisabled = !1, this.collapsed = !1, this.content = this.viewModel.content, this.defaultPopupTemplateEnabled = this.viewModel.defaultPopupTemplateEnabled, this.featureCount = this.viewModel.featureCount, this.featureMenuOpen = !1, this.featureNavigationTop = !1, this.features = this.viewModel.features, this.featuresPerPage = this.viewModel.featuresPerPage, this.featureItemAbilities = this.viewModel.featureItemAbilities, this.goToOverride = this.viewModel.goToOverride, this.headerActions = new k(), this.heading = this.viewModel.heading, this.headingLevel = 2, this.hideActionBar = !1, this.hideCloseButton = !1, this.hideFeatureMenuHeading = !1, this.hideFeatureNavigation = !1, this.hideFeatureListLayerTitle = !1, this.hideHeading = !1, this.hideSelectFeature = !1, this.hideSpinner = !1, this.hideContent = !1, this.chartAnimationDisabled = this.viewModel.featureItemAbilities?.chartAnimation, this.hideAttachmentsContent = this.viewModel.featureItemAbilities?.attachmentsContent, this.hideCustomContent = this.viewModel.featureItemAbilities?.customContent, this.hideExpressionContent = !1, this.hideFieldsContent = this.viewModel.featureItemAbilities?.fieldsContent, this.hideMediaContent = this.viewModel.featureItemAbilities?.mediaContent, this.hideRelationshipContent = this.viewModel.featureItemAbilities?.relationshipContent, this.hideTextContent = this.viewModel.featureItemAbilities?.textContent, this.hideUtilityNetworkContent = this.viewModel.featureItemAbilities?.utilityNetworkAssociationsContent, this.hideLastEditedInfo = !1, this.highlightDisabled = this.viewModel.highlightEnabled, this.includeDefaultActionsDisabled = this.viewModel.includeDefaultActions, this.initialDisplayMode = this.viewModel.initialDisplayMode, this.location = this.viewModel.location, this.map = this.viewModel.map, this.open = this.viewModel.open, this.promises = this.viewModel.promises, this.responsiveActionsEnabled = !1, this.selectedFeature = this.viewModel.selectedFeature, this.selectedFeatureIndex = this.viewModel.selectedFeatureIndex, this.showCollapseButton = !1, this.spatialReference = this.viewModel.spatialReference, this.state = this.viewModel.state, this.timeZone = this.viewModel.timeZone, this.updateLocationEnabled = this.viewModel.updateLocationEnabled, this.view = this.viewModel.view, this.arcgisPropertyChange = S()("active", "collapsed", "featureCount", "featureMenuOpen", "features", "promises", "selectedDrillInFeature", "selectedFeature", "selectedFeatureComponent", "selectedFeatureIndex", "state", "open"), this.arcgisReady = y(), this.arcgisClose = y(), this.arcgisTriggerAction = y();
   }
   static {
     this.properties = { _openRelatedFeatureAbortController: 16, flowItems: 16, _hideActionText: 16, _featureNavigationVisible: 16, _isCollapsed: 16, _collapseEnabled: 16, _featureFlowItemSelected: 16, viewModel: 0, actions: 0, active: 0, autoDestroyDisabled: 5, collapsed: 5, content: 1, defaultPopupTemplateEnabled: 5, featureCount: 9, featureMenuOpen: 5, featureMenuTitle: 1, featureNavigationTop: 5, features: 0, featuresPerPage: 9, featureItemAbilities: 0, goToOverride: 0, headerActions: 0, heading: 1, headingLevel: 9, hideActionBar: 5, hideCloseButton: 5, hideFeatureMenuHeading: 5, hideFeatureNavigation: 5, hideFeatureListLayerTitle: 5, hideHeading: 5, hideSelectFeature: 5, hideSpinner: 5, hideContent: 5, chartAnimationDisabled: 5, hideAttachmentsContent: 5, hideCustomContent: 5, hideExpressionContent: 5, hideFieldsContent: 5, hideMediaContent: 5, hideRelationshipContent: 5, hideTextContent: 5, hideUtilityNetworkContent: 5, hideLastEditedInfo: 5, highlightDisabled: 5, icon: 1, includeDefaultActionsDisabled: 5, initialDisplayMode: 1, label: 1, location: 0, map: 0, messageOverrides: 0, open: 5, referenceElement: 1, promises: 0, responsiveActionsEnabled: 5, selectedDrillInFeature: 32, selectedFeature: 0, selectedFeatureComponent: 32, selectedFeatureIndex: 9, showCollapseButton: 5, spatialReference: 0, state: 32, timeZone: 1, updateLocationEnabled: 5, view: 0 };
@@ -101,7 +101,7 @@ class J extends H {
       l(() => this.viewModel?.featureItems, () => this._featureMenuViewportScrollTop()),
       l(() => this.flowItems.length, () => {
         const e = Array.from(this.flowItems).at(-1);
-        x(() => this.selectedDrillInFeature = e?.graphic ?? void 0);
+        T(() => this.selectedDrillInFeature = e?.graphic ?? void 0);
       }),
       l(() => [this.flowItems?.length, this.featureMenuOpen], () => {
         this.setFocus();
@@ -122,7 +122,7 @@ class J extends H {
   }
   updated() {
     const e = this._selectedFeatureComponent.value ?? void 0;
-    this.selectedFeatureComponent !== e && x(() => this.selectedFeatureComponent = e);
+    this.selectedFeatureComponent !== e && T(() => this.selectedFeatureComponent = e);
   }
   _cancelFetchingFeatures() {
     this._fetchFeaturesController?.abort(), this._fetchFeaturesController = null;
@@ -265,15 +265,15 @@ class J extends H {
   _renderFeaturePaginationText() {
     const { messages: e, viewModel: t } = this, { featureCount: i, selectedFeatureIndex: s } = t;
     return o`<div class="pagination-text">${d(e.pageText ?? "", {
-      index: F(s + 1),
-      total: F(i)
+      index: _(s + 1),
+      total: _(i)
     })}</div>`;
   }
   _renderFeatureMenuButton() {
     const { messages: e, viewModel: t } = this, { featureCount: i, selectedFeatureIndex: s, pendingPromisesCount: a } = t;
     return o`<calcite-action class="pagination-menu-button" icon=list .label=${e.selectFeature} .loading=${a > 0} @click=${this._handlePaginationMenuButton} .text=${d(e.pageText ?? "", {
-      index: F(s + 1),
-      total: F(i)
+      index: _(s + 1),
+      total: _(i)
     })} text-enabled title=${e.selectFeature ?? c}></calcite-action>`;
   }
   _renderPagination() {
@@ -282,13 +282,13 @@ class J extends H {
   }
   _renderFeatureMenuItem(e) {
     const { initialDisplayMode: t } = this, { selectedFeatureItem: i, featureItems: s } = this.viewModel, a = e === i, n = s.indexOf(e);
-    return o`<calcite-list-item @blur=${this._removeActiveFeature} @focus=${() => this._setActiveFeature(n)} @mouseleave=${this._removeActiveFeature} @mouseover=${() => this._setActiveFeature(n)} .selected=${a} @calciteListItemSelect=${() => this._selectFeature(n)}><span .innerHTML=${(k.sanitize(e.heading) || this.messages.untitled) ?? ""} slot=content></span>${t === "list" ? o`<calcite-icon flip-rtl icon=chevron-right scale=s slot=content-end></calcite-icon>` : null}</calcite-list-item>`;
+    return o`<calcite-list-item @blur=${this._removeActiveFeature} @focus=${() => this._setActiveFeature(n)} @mouseleave=${this._removeActiveFeature} @mouseover=${() => this._setActiveFeature(n)} .selected=${a} @calciteListItemSelect=${() => this._selectFeature(n)}><span .innerHTML=${(m.sanitize(e.heading) || this.messages.untitled) ?? ""} slot=content></span>${t === "list" ? o`<calcite-icon flip-rtl icon=chevron-right scale=s slot=content-end></calcite-icon>` : null}</calcite-list-item>`;
   }
   _renderFeatureMenu() {
     const { messages: e, viewModel: t } = this, i = this._groupResultsByLayer(), s = this.initialDisplayMode === "list" ? "none" : "single";
     return t.featureItems.length ? o`<calcite-list display-mode=flat .label=${e?.featuresList ?? ""} selection-appearance=icon .selectionMode=${s}>${Array.from(i.keys(), (a) => {
       const n = i.get(a)?.map((h) => this._renderFeatureMenuItem(h)), r = a ? a.title ?? this.messages.untitled : null;
-      return !this.hideFeatureListLayerTitle && r !== null ? b(a ?? "map-graphics", o`<calcite-list-item-group .heading=${r}>${n}</calcite-list-item-group>`) : n;
+      return !this.hideFeatureListLayerTitle && r !== null ? $(a ?? "map-graphics", o`<calcite-list-item-group .heading=${r}>${n}</calcite-list-item-group>`) : n;
     })}</calcite-list>` : null;
   }
   _renderHeaderAction(e) {
@@ -299,40 +299,40 @@ class J extends H {
     return this.headerActions.map((e) => this._renderHeaderAction(e)).toArray();
   }
   _renderContentFeature() {
-    const { headingLevel: e, hideCloseButton: t, _isCollapsed: i, _collapseEnabled: s, _featureFlowItemSelected: a, featureNavigationTop: n, flowItems: r, initialDisplayMode: h, selectedFeature: u } = this, { active: p } = this.viewModel, f = this._getHeading();
-    if (h === "list" && !u)
+    const { headingLevel: e, hideCloseButton: t, _isCollapsed: i, _collapseEnabled: s, _featureFlowItemSelected: a, featureNavigationTop: n, flowItems: r, initialDisplayMode: h, selectedFeature: p } = this, { active: f } = this.viewModel, u = this._getHeading();
+    if (h === "list" && !p)
       return null;
     const g = r.length === 0 && a;
-    return o`<calcite-flow-item class=${y($({
+    return o`<calcite-flow-item class=${A(C({
       "content-feature": !0,
       "flow-item-collapsed": i
-    }))} .closable=${!t} .closed=${!p} .collapsed=${i} .collapseDirection=${n ? "down" : "up"} .collapsible=${s} .headingLevel=${e} .selected=${g} @calciteFlowItemBack=${this._handleFeatureBack} .loading=${!!this._openRelatedFeatureAbortController} @calciteFlowItemClose=${this._handleClose} @calciteFlowItemToggle=${this._handleCollapseToggle} .heading=${A(f)} ${v(this._rootFlowItemNode)}>${this._renderHeaderActions()}${this._renderActionBar()}<div class=${y($("container", "content-container"))}>${this._renderContent()}</div>${this._renderFooter()}</calcite-flow-item>`;
+    }))} .closable=${!t} .closed=${!f} .collapsed=${i} .collapseDirection=${n ? "down" : "up"} .collapsible=${s} .headingLevel=${e} .selected=${g} @calciteFlowItemBack=${this._handleFeatureBack} .loading=${!!this._openRelatedFeatureAbortController} @calciteFlowItemClose=${this._handleClose} @calciteFlowItemToggle=${this._handleCollapseToggle} .heading=${I(u)} ${v(this._rootFlowItemNode)}><div slot=heading .innerHTML=${m.sanitize(u ?? "") ?? ""}></div>${this._renderHeaderActions()}${this._renderActionBar()}<div class=${A(C("container", "content-container"))}>${this._renderContent()}</div>${this._renderFooter()}</calcite-flow-item>`;
   }
   _renderFeatureMenuContainer() {
-    const { viewModel: e, hideCloseButton: t, featureMenuTitle: i, messages: s, initialDisplayMode: a, featureMenuOpen: n, _featureFlowItemSelected: r, _collapseEnabled: h, _isCollapsed: u, featureNavigationTop: p, headingLevel: f } = this, { active: g, featureItems: _, pendingPromisesCount: M } = e, D = i ?? s.selectFeature;
+    const { viewModel: e, hideCloseButton: t, featureMenuTitle: i, messages: s, initialDisplayMode: a, featureMenuOpen: n, _featureFlowItemSelected: r, _collapseEnabled: h, _isCollapsed: p, featureNavigationTop: f, headingLevel: u } = this, { active: g, featureItems: M, pendingPromisesCount: b } = e, D = i ?? s.selectFeature;
     if (a === "feature" && !n)
       return null;
     const N = !r;
-    return o`<calcite-flow-item class=${y($({
-      "flow-item-collapsed": u
-    }))} .closable=${a === "list" && !t} .closed=${!g} .collapsed=${a === "list" && u} .collapseDirection=${p ? "down" : "up"} .collapsible=${a === "list" && h} .description=${this.hideFeatureMenuHeading ? void 0 : d(s.total ?? "", {
-      total: _.length
-    })} .heading=${this.hideFeatureMenuHeading ? void 0 : D} .headingLevel=${f} .loading=${e.waitingForContents} .selected=${N} @calciteFlowItemBack=${(E) => {
+    return o`<calcite-flow-item class=${A(C({
+      "flow-item-collapsed": p
+    }))} .closable=${a === "list" && !t} .closed=${!g} .collapsed=${a === "list" && p} .collapseDirection=${f ? "down" : "up"} .collapsible=${a === "list" && h} .description=${this.hideFeatureMenuHeading ? void 0 : d(s.total ?? "", {
+      total: M.length
+    })} .heading=${this.hideFeatureMenuHeading ? void 0 : D} .headingLevel=${u} .loading=${e.waitingForContents} .selected=${N} @calciteFlowItemBack=${(E) => {
       E.preventDefault(), this._handleFeatureMenuBack();
-    }} @calciteFlowItemClose=${this._handleClose} @calciteFlowItemToggle=${this._handleCollapseToggle} ${v(this._featureMenuViewportNode)}>${a === "list" ? this._renderHeaderActions() : null}${M > 0 ? o`<calcite-loader class="loader" inline .label=${s.loading ?? ""} slot=header-actions-end></calcite-loader>` : null}<div class="container">${this._renderFeatureMenu()}</div><div class="feature-menu-observer" ${v(this._featureMenuIntersectionObserverCreated)}></div>${a === "feature" ? o`<calcite-button appearance=transparent @click=${this._handleFeatureMenuBack} slot=footer-start width=full>${s.back}</calcite-button>` : null}</calcite-flow-item>`;
+    }} @calciteFlowItemClose=${this._handleClose} @calciteFlowItemToggle=${this._handleCollapseToggle} ${v(this._featureMenuViewportNode)}>${a === "list" ? this._renderHeaderActions() : null}${b > 0 ? o`<calcite-loader class="loader" inline .label=${s.loading ?? ""} slot=header-actions-end></calcite-loader>` : null}<div class="container">${this._renderFeatureMenu()}</div><div class="feature-menu-observer" ${v(this._featureMenuIntersectionObserverCreated)}></div>${a === "feature" ? o`<calcite-button appearance=transparent @click=${this._handleFeatureMenuBack} slot=footer-start width=full>${s.back}</calcite-button>` : null}</calcite-flow-item>`;
   }
   _renderFlowItem(e, t) {
-    const { messages: i, hideCloseButton: s, hideSelectFeature: a, active: n } = this, r = "graphic" in e && "isFeatureFromTable" in e && !e.isFeatureFromTable, h = r && !a, u = e.flowType === "feature-association", p = i.returnToInitialFeature ?? "", f = i?.selectFeature, g = this._getActionTitle(w), _ = !this.hideActionBar && u && r;
-    return o`<calcite-flow-item .closable=${!s} .closed=${!n} .description=${A(this._getDrillInFlowItemDescription(e) ?? "")} .heading=${this.hideHeading ? void 0 : A(e.heading ?? "")} .selected=${t} @calciteFlowItemBack=${(M) => {
-      M.preventDefault(), this._handleDrillInBackClick();
-    }} .loading=${!!this._openRelatedFeatureAbortController} @calciteFlowItemClose=${this._handleClose}><calcite-action class="action-exit" icon=move-up @click=${this._removeFlowItems} slot=header-actions-start .text=${p ?? ""} title=${p ?? "" ?? c}></calcite-action>${h ? o`<calcite-action icon=zoom-to-object @click=${() => this._openRelatedFeature(e)} slot=header-actions-end .text=${f ?? ""} title=${f ?? c}></calcite-action>` : null}${_ ? o`<calcite-action-bar expand-disabled expanded scale=s slot=action-bar><calcite-action-group overlay-positioning=fixed scale=s><calcite-action .disabled=${w.disabled} .icon=${w.icon ?? void 0} .loading=${w.active} scale=s text-enabled .text=${g} title=${g ?? c} @click=${() => Z(this.viewModel, e)}></calcite-action></calcite-action-group></calcite-action-bar>` : null}<div class="container">${e}</div></calcite-flow-item>`;
+    const { messages: i, hideCloseButton: s, hideSelectFeature: a, active: n } = this, r = "graphic" in e && "isFeatureFromTable" in e && !e.isFeatureFromTable, h = r && !a, p = e.flowType === "feature-association", f = i.returnToInitialFeature ?? "", u = i?.selectFeature, g = this._getActionTitle(F), M = !this.hideActionBar && p && r;
+    return o`<calcite-flow-item .closable=${!s} .closed=${!n} .description=${I(this._getDrillInFlowItemDescription(e) ?? "")} .heading=${this.hideHeading ? void 0 : I(e.heading ?? "")} .selected=${t} @calciteFlowItemBack=${(b) => {
+      b.preventDefault(), this._handleDrillInBackClick();
+    }} .loading=${!!this._openRelatedFeatureAbortController} @calciteFlowItemClose=${this._handleClose}>${this.hideHeading ? null : o`<div slot=heading .innerHTML=${m.sanitize(e.heading ?? "") ?? ""}></div>`}<div slot=description .innerHTML=${m.sanitize(this._getDrillInFlowItemDescription(e) ?? "") ?? ""}></div><calcite-action class="action-exit" icon=move-up @click=${this._removeFlowItems} slot=header-actions-start .text=${f ?? ""} title=${f ?? "" ?? c}></calcite-action>${h ? o`<calcite-action icon=zoom-to-object @click=${() => this._openRelatedFeature(e)} slot=header-actions-end .text=${u ?? ""} title=${u ?? c}></calcite-action>` : null}${M ? o`<calcite-action-bar expand-disabled expanded scale=s slot=action-bar><calcite-action-group overlay-positioning=fixed scale=s><calcite-action .disabled=${F.disabled} .icon=${F.icon ?? void 0} .loading=${F.active} scale=s text-enabled .text=${g} title=${g ?? c} @click=${() => Z(this.viewModel, e)}></calcite-action></calcite-action-group></calcite-action-bar>` : null}<div class="container">${e}</div></calcite-flow-item>`;
   }
   _renderContentContainer() {
     const e = this.flowItems?.toArray(), t = e?.map((s, a) => this._renderFlowItem(s, this._featureFlowItemSelected && a === e.length - 1)), i = this.initialDisplayMode === "list" ? [this._renderFeatureMenuContainer(), this._renderContentFeature(), t] : [this._renderContentFeature(), t, this._renderFeatureMenuContainer()];
     return o`<calcite-flow ${v(this._flowContainerNode)}>${i}</calcite-flow>`;
   }
   _renderActionBar() {
-    const t = this.viewModel.selectedFeatureItem?.isFeatureFromTable && !this.location ? this.viewModel.allActions.filter((i) => i.id !== w.id) : this.viewModel.allActions;
+    const t = this.viewModel.selectedFeatureItem?.isFeatureFromTable && !this.location ? this.viewModel.allActions.filter((i) => i.id !== F.id) : this.viewModel.allActions;
     return !this._isCollapsed && !this.hideActionBar && t.length ? o`<calcite-action-bar expand-disabled .expanded=${!this._hideActionText} scale=s slot=action-bar><calcite-action-group overlay-positioning=fixed scale=s ${v(this._actionBarMenuNode)}>${this._renderActions()}</calcite-action-group></calcite-action-bar>` : null;
   }
   _renderActions() {
@@ -343,10 +343,10 @@ class J extends H {
   }
   _renderContent() {
     const { content: e, selectedFeatureItem: t } = this.viewModel;
-    return t ? b(t, o`<arcgis-feature .autoDestroyDisabled=${this.autoDestroyDisabled} .chartAnimationDisabled=${this.chartAnimationDisabled} .defaultPopupTemplateEnabled=${this.defaultPopupTemplateEnabled} .flowItems=${this.flowItems} .graphic=${t.graphic} .headingLevel=${this.headingLevel + 1} .hideAttachmentsContent=${this.hideAttachmentsContent} .hideContent=${this.hideContent} .hideCustomContent=${this.hideCustomContent} .hideExpressionContent=${this.hideExpressionContent} .hideFieldsContent=${this.hideFieldsContent} hide-heading .hideLastEditedInfo=${this.hideLastEditedInfo} .hideMediaContent=${this.hideMediaContent} .hideTextContent=${this.hideTextContent} .location=${this.location} .map=${this.map} .referenceElement=${this.referenceElement} .showRelationshipContent=${!this.hideRelationshipContent} .showUtilityNetworkContent=${!this.hideUtilityNetworkContent} .spatialReference=${this.spatialReference} .timeZone=${this.timeZone} ${v(this._selectedFeatureComponent)}></arcgis-feature>`) : typeof e == "string" ? b(e, o`<div .innerHTML=${k.sanitize(e) ?? ""}></div>`) : e ?? null;
+    return t ? $(t, o`<arcgis-feature .autoDestroyDisabled=${this.autoDestroyDisabled} .chartAnimationDisabled=${this.chartAnimationDisabled} .defaultPopupTemplateEnabled=${this.defaultPopupTemplateEnabled} .flowItems=${this.flowItems} .graphic=${t.graphic} .headingLevel=${this.headingLevel + 1} .hideAttachmentsContent=${this.hideAttachmentsContent} .hideContent=${this.hideContent} .hideCustomContent=${this.hideCustomContent} .hideExpressionContent=${this.hideExpressionContent} .hideFieldsContent=${this.hideFieldsContent} hide-heading .hideLastEditedInfo=${this.hideLastEditedInfo} .hideMediaContent=${this.hideMediaContent} .hideTextContent=${this.hideTextContent} .location=${this.location} .map=${this.map} .referenceElement=${this.referenceElement} .showRelationshipContent=${!this.hideRelationshipContent} .showUtilityNetworkContent=${!this.hideUtilityNetworkContent} .spatialReference=${this.spatialReference} .timeZone=${this.timeZone} ${v(this._selectedFeatureComponent)}></arcgis-feature>`) : typeof e == "string" ? $(e, o`<div .innerHTML=${m.sanitize(e) ?? ""}></div>`) : e ?? null;
   }
 }
-O("arcgis-features", J);
+L("arcgis-features", J);
 export {
   J as ArcgisFeatures
 };

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

@@ -139,7 +139,7 @@ export abstract class ArcgisPopup extends LitElement {
    */
   accessor actions: Collection<PopupAction>;
   /**
-   * Indicates if the component is active when it is visible and is not [waiting](https://developers.arcgis.com/javascript/latest/references/core/widgets/Popup/PopupViewModel/#waitingForResult).
+   * Indicates if the component is active when it is visible and is not [waiting](https://developers.arcgis.com/javascript/latest/references/core/popup/Features/#waitingForResult).
    *
    * @default false
    */
@@ -471,7 +471,7 @@ export abstract class ArcgisPopup extends LitElement {
    *
    * @default false
    * @see [fetchFeatures()](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-popup/#fetchFeatures)
-   * @see [active](https://developers.arcgis.com/javascript/latest/references/core/widgets/Features/FeaturesViewModel/#active)
+   * @see [active](https://developers.arcgis.com/javascript/latest/references/core/popup/Features/#active)
    * @see [clear()](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-popup/#clear)
    * @since 5.0
    * @example