@arcgis/map-components 5.2.0-next.95 → 5.2.0-next.97

package/dist/components/arcgis-layer-list-next/customElement.js

@@ -1,30 +1,31 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
-import { c as R } from "../../chunks/runtime.js";
+import { c as k } from "../../chunks/runtime.js";
 import { html as h } from "lit";
 import { keyed as v } from "lit/directives/keyed.js";
-import { repeat as N } from "lit/directives/repeat.js";
-import x from "@arcgis/core/layers/list/LayerItemCollection.js";
-import { classes as B } from "@arcgis/toolkit/dom";
-import { generateGuid as k } from "@arcgis/toolkit/string";
+import { repeat as x } from "lit/directives/repeat.js";
+import B from "@arcgis/core/layers/list/LayerItemCollection.js";
+import { classes as S } from "@arcgis/toolkit/dom";
+import { generateGuid as U } from "@arcgis/toolkit/string";
 import { createRef as w, ref as b } from "lit/directives/ref.js";
-import { u as S } from "../../chunks/useT9n.js";
-import { m as U } from "../../chunks/useViewModel.js";
-import { g as $ } from "../../chunks/globalCss.js";
-import { c as y } from "../../chunks/css.js";
-import { g as m, a as F, m as G, b as H, r as V, s as j, c as q, d as z, e as J } from "../../chunks/layer-list-utils.js";
+import { u as G } from "../../chunks/useT9n.js";
+import { m as H } from "../../chunks/useViewModel.js";
+import { g as C } from "../../chunks/globalCss.js";
+import { c as I } from "../../chunks/css.js";
+import { g as m, a as F, m as V, b as j, r as M, s as q, c as z, d as J, e as K } from "../../chunks/layer-list-utils.js";
 import p from "@arcgis/core/core/Collection.js";
-import { on as C, watch as K } from "@arcgis/core/core/reactiveUtils.js";
-import { LitElement as Q, createEvent as I, renderElement as M, safeClassMap as E, nothing as A } from "@arcgis/lumina";
+import { on as $, watch as A } from "@arcgis/core/core/reactiveUtils.js";
+import { LitElement as Q, createEvent as y, renderElement as O, safeClassMap as E, nothing as D } from "@arcgis/lumina";
 import { usePropertyChange as W } from "@arcgis/lumina/controllers";
 import { reEmitEvent as X } from "@arcgis/lumina/controllers/accessor";
 import { u as Y } from "../../chunks/useCloseEvent.js";
-import { r as Z, A as ee } from "../../chunks/layer-list-item.js";
-import { s as te, a as se } from "../../chunks/layer-list-next.js";
+import { ArcgisLayerListItem as Z } from "./layer-list-item/customElement.js";
+import { s as ee, a as te } from "../../chunks/layer-list-next.js";
+import { i as se, h as ie, r as ae } from "../../chunks/utils2.js";
 import "../arcgis-layer-list-item-indicator/customElement.js";
-const O = "nested", ie = U(x);
-class ae extends Q {
+const P = "nested", re = H(B);
+class oe extends Q {
   constructor() {
-    super(...arguments), this._lastDragDetail = null, this._rootListRef = w(), this._layerFlowItemRef = w(), this._panelFlowItemRef = w(), this._selectedDragItemLayerUid = null, this._rootGroupUid = `operational-${k()}`, this._openedLayersController = null, this.messages = S(), this._canMove = ({ dragEl: e, fromEl: t, toEl: s }, a) => {
+    super(...arguments), this._lastDragDetail = null, this._rootListRef = w(), this._layerFlowItemRef = w(), this._panelFlowItemRef = w(), this._selectedDragItemLayerUid = null, this._rootGroupUid = `operational-${U()}`, this._openedLayersController = null, this.messages = G(), this._canMove = ({ dragEl: e, fromEl: t, toEl: s }, a) => {
       const i = a === "pull" ? this.listItemCanGiveFunction : this.listItemCanReceiveFunction, r = m(e, this.operationalItems);
       if (!r?.sortable)
         return !1;
@@ -32,8 +33,8 @@ class ae extends Q {
         selected: r,
         from: n,
         to: g
-      }, _ = o?.group, c = l?.group, D = n?.layer?.type ?? "", P = g?.layer?.type ?? "", T = /* @__PURE__ */ new Set(["map-image", "catalog", "knowledge-graph"]);
-      return _ && c && typeof i == "function" ? i(f) : L && !T.has(D) && !T.has(P) && r?.layer?.type !== "sublayer";
+      }, _ = o?.group, c = l?.group, R = n?.layer?.type ?? "", N = g?.layer?.type ?? "", T = /* @__PURE__ */ new Set(["map-image", "catalog", "knowledge-graph"]);
+      return _ && c && typeof i == "function" ? i(f) : L && !T.has(R) && !T.has(N) && r?.layer?.type !== "sublayer";
     }, this._onCatalogOpen = (e) => {
       this.openedLayers.push(e.layer?.parent);
     }, this._onTablesOpen = (e) => {
@@ -45,30 +46,30 @@ class ae extends Q {
     }, this._setActiveItem = (e) => {
       if (this.visibilityAppearance !== "default")
         return;
-      const t = Array.from(e.composedPath()).find((a) => a.classList?.contains(y.item)), s = m(t, this.operationalItems);
+      const t = Array.from(e.composedPath()).find((a) => a.classList?.contains(I.item)), s = m(t, this.operationalItems);
       this._activeItem = s;
-    }, this.viewModel = ie(this), this.arcgisClose = Y(this), this._activeItem = null, this._onTooltipReferenceChange = (e, t) => {
+    }, this.viewModel = re(this), this.arcgisClose = Y(this), this._activeItem = null, this._onTooltipReferenceChange = (e, t) => {
       t ? this._tooltipReferenceMap.set(e, t) : this._tooltipReferenceMap.delete(e);
     }, this._onSelectedDragItemLayerUidChange = (e) => {
       this._selectedDragItemLayerUid = e;
     }, this._onTriggerAction = (e, t) => {
       this.triggerAction(e, t);
-    }, this._tooltipReferenceMap = /* @__PURE__ */ new Map(), this._layerListMap = /* @__PURE__ */ new Map(), this.layerTablesEnabled = new p(["knowledge-graph"]), this.mapImageOptions = null, this.openedLayerLists = new p(), this.tileOptions = null, this.autoDestroyDisabled = !1, this.closed = !1, this.collapsed = !1, this.dragEnabled = !1, this.filterPlaceholder = "", this.filterText = "", this.headingLevel = 2, this.hideCatalogLayerList = !1, this.hideNoFilterResultsNotice = !1, this.hideNoItemsNotice = !1, this.hideStatusIndicators = !1, this.icon = "layers", this.layerTablesAvailable = new p(["knowledge-graph"]), this.listItemCreatedFunction = this.viewModel.listItemCreatedFunction, this.listModeDisabled = this.viewModel.listModeDisabled, this.minDragEnabledItems = G, this.minFilterItems = H, this.openedLayers = new p(), this.operationalItems = this.viewModel.operationalItems, this.selectedItems = new p(), this.selectionMode = "none", this.showCloseButton = !1, this.showCollapseButton = !1, this.showErrors = !1, this.showFilter = !1, this.showHeading = !1, this.showTemporaryLayerIndicators = !1, this.state = this.viewModel.state, this.view = this.viewModel.view, this.visibilityAppearance = "default", this.arcgisFilterChange = I(), this.arcgisOpenedLayersChange = I(), this.arcgisPropertyChange = W()("state"), this.arcgisReady = I(), this.arcgisSelectedItemsChange = I(), this.arcgisTriggerAction = X(() => this.viewModel, "trigger-action");
+    }, this._tooltipReferenceMap = /* @__PURE__ */ new Map(), this._layerListMap = /* @__PURE__ */ new Map(), this.layerTablesEnabled = new p(["knowledge-graph"]), this.mapImageOptions = null, this.openedLayerLists = new p(), this.tileOptions = null, this.autoDestroyDisabled = !1, this.closed = !1, this.collapsed = !1, this.dragEnabled = !1, this.filterPlaceholder = "", this.filterText = "", this.headingLevel = 2, this.hideCatalogLayerList = !1, this.hideNoFilterResultsNotice = !1, this.hideNoItemsNotice = !1, this.hideStatusIndicators = !1, this.icon = "layers", this.layerTablesAvailable = new p(["knowledge-graph"]), this.listItemCreatedFunction = this.viewModel.listItemCreatedFunction, this.listModeDisabled = this.viewModel.listModeDisabled, this.minDragEnabledItems = V, this.minFilterItems = j, this.openedLayers = new p(), this.operationalItems = this.viewModel.operationalItems, this.selectedItems = new p(), this.selectionMode = "none", this.showCloseButton = !1, this.showCollapseButton = !1, this.showErrors = !1, this.showFilter = !1, this.showHeading = !1, this.showTemporaryLayerIndicators = !1, this.state = this.viewModel.state, this.view = this.viewModel.view, this.visibilityAppearance = "default", this.arcgisFilterChange = y(), this.arcgisOpenedLayersChange = y(), this.arcgisPropertyChange = W()("state"), this.arcgisReady = y(), this.arcgisSelectedItemsChange = y(), this.arcgisTriggerAction = X(() => this.viewModel, "trigger-action");
   }
   static {
     this.properties = { _catalogLayerList: 16, _tableList: 16, _tooltipReferenceMap: 16, _layerListMap: 16, _totalItems: 16, _visibleItems: 16, _openedPanelItems: 16, _dragEnabled: 16, _filterEnabled: 16, layerTablesEnabled: 16, mapImageOptions: 16, openedLayerLists: 16, tileOptions: 16, _renderedOpenLayerFlowItems: 16, autoDestroyDisabled: 5, catalogLayerList: 32, catalogOptions: 0, closed: 5, collapsed: 5, dragEnabled: 5, filterPlaceholder: 1, filterPredicate: 0, filterText: 1, headingLevel: 9, hideCatalogLayerList: 5, hideNoFilterResultsNotice: 5, hideNoItemsNotice: 5, hideStatusIndicators: 5, icon: 1, knowledgeGraphOptions: 0, label: 1, layerTablesAvailable: 0, listItemCanGiveFunction: 0, listItemCanReceiveFunction: 0, listItemCreatedFunction: 0, listModeDisabled: 5, messageOverrides: 0, minDragEnabledItems: 9, minFilterItems: 9, openedLayers: 32, operationalItems: 0, referenceElement: 1, selectedItems: 0, selectionMode: 1, showCloseButton: 5, showCollapseButton: 5, showErrors: 5, showFilter: 5, showHeading: 5, showTemporaryLayerIndicators: 5, state: 32, tableList: 32, view: 0, visibilityAppearance: 1 };
   }
   static {
-    this.styles = [te, se];
+    this.styles = [ee, te];
   }
   get _totalItems() {
-    return this.viewModel.operationalItems.flatten((e) => e.children.filter((t) => t.layer?.type !== "catalog-dynamic-group")).length;
+    return this.viewModel.operationalItems.flatten((t) => t.children.filter((s) => s.layer?.type !== "catalog-dynamic-group")).length;
   }
   get _visibleItems() {
     return this.operationalItems?.filter((e) => !e.hidden && (this.showErrors || !e.error));
   }
   get _openedPanelItems() {
-    return this._visibleItems.flatten((e) => e.children).filter(({ hidden: e, panel: t }) => !e && t?.open && !t.disabled && t.flowEnabled);
+    return this._visibleItems.flatten((e) => e.children).filter((e) => !e.hidden && e.panel?.open && !e.panel.disabled && e.panel.flowEnabled && (!se(e) || ie(e)));
   }
   get _dragEnabled() {
     return this._totalItems >= this.minDragEnabledItems && this.dragEnabled;
@@ -91,12 +92,15 @@ class ae extends Q {
   }
   loaded() {
     this.manager.onLifecycle(() => [
-      C(() => this.openedLayers, "change", () => {
+      $(() => this.openedLayers, "change", () => {
         this._handleOpenedLayersChange();
       }, { initial: !0 }),
-      C(() => this.viewModel.operationalItems, "change", () => V(this.selectedItems), { initial: !0 }),
-      C(() => this.selectedItems, "change", () => this.arcgisSelectedItemsChange.emit()),
-      K(() => [this.filterPredicate, this._rootListRef.value], () => j(this._rootListRef.value, this.filterPredicate, this.operationalItems))
+      $(() => this.viewModel.operationalItems, "change", () => M(this.selectedItems), { initial: !0 }),
+      A(() => this.operationalItems.flatten((e) => e.children).map((e) => e.uid).join(","), () => {
+        M(this.selectedItems), this.requestUpdate();
+      }, { initial: !0 }),
+      $(() => this.selectedItems, "change", () => this.arcgisSelectedItemsChange.emit()),
+      A(() => [this.filterPredicate, this._rootListRef.value], () => q(this._rootListRef.value, this.filterPredicate, this.operationalItems))
     ]);
   }
   triggerAction(e, t) {
@@ -153,7 +157,7 @@ class ae extends Q {
   }
   async _createCatalogLayerList(e) {
     const { headingLevel: t, catalogOptions: s, filterPlaceholder: a, listItemCreatedFunction: i, minFilterItems: r, selectionMode: o, visibilityAppearance: l } = this;
-    return M(h`<arcgis-catalog-layer-list-next .headingLevel=${t} .filterPlaceholder=${s?.filterPlaceholder ?? a} .listItemCreatedFunction=${s?.listItemCreatedFunction ?? i} .minFilterItems=${s?.minFilterItems ?? r} .selectionMode=${s?.selectionMode ?? o} .visibilityAppearance=${s?.visibilityAppearance ?? l} .showErrors=${s?.showErrors ?? this.showErrors} .showFilter=${s?.showFilter ?? this.showFilter} .hideStatusIndicators=${s?.hideStatusIndicators ?? this.hideStatusIndicators} .showTemporaryLayerIndicators=${s?.showTemporaryLayerIndicators ?? this.showTemporaryLayerIndicators} .messageOverrides=${this.messageOverrides} @arcgisReady=${(n) => n.stopPropagation()} .catalogLayer=${e} .view=${this.view} .referenceElement=${this.referenceElement} @catalogOpen=${this._onCatalogOpen} @tablesOpen=${this._onTablesOpen}></arcgis-catalog-layer-list-next>`);
+    return O(h`<arcgis-catalog-layer-list-next .headingLevel=${t} .filterPlaceholder=${s?.filterPlaceholder ?? a} .listItemCreatedFunction=${s?.listItemCreatedFunction ?? i} .minFilterItems=${s?.minFilterItems ?? r} .selectionMode=${s?.selectionMode ?? o} .visibilityAppearance=${s?.visibilityAppearance ?? l} .showErrors=${s?.showErrors ?? this.showErrors} .showFilter=${s?.showFilter ?? this.showFilter} .hideStatusIndicators=${s?.hideStatusIndicators ?? this.hideStatusIndicators} .showTemporaryLayerIndicators=${s?.showTemporaryLayerIndicators ?? this.showTemporaryLayerIndicators} .messageOverrides=${this.messageOverrides} @arcgisReady=${(n) => n.stopPropagation()} .catalogLayer=${e} .view=${this.view} .referenceElement=${this.referenceElement} @catalogOpen=${this._onCatalogOpen} @tablesOpen=${this._onTablesOpen}></arcgis-catalog-layer-list-next>`);
   }
   _getTableListParams(e) {
     switch (e.type) {
@@ -175,14 +179,14 @@ class ae extends Q {
   }
   async _createTableList(e) {
     const { headingLevel: t, selectionMode: s, dragEnabled: a } = this, i = this._getTableListParams(e);
-    return M(h`<arcgis-table-list-next .headingLevel=${i?.headingLevel ?? t} .selectionMode=${i?.selectionMode ?? s} .dragEnabled=${i?.dragEnabled ?? a} .collapsed=${i?.collapsed} .filterPlaceholder=${i?.filterPlaceholder} .filterText=${i?.filterText} .icon=${i?.icon ?? void 0} .label=${i?.label ?? void 0} .listItemCreatedFunction=${i?.listItemCreatedFunction} .messageOverrides=${this.messageOverrides} .tables=${i?.tables} .referenceElement=${this.referenceElement} @arcgisReady=${(r) => r.stopPropagation()}></arcgis-table-list-next>`);
+    return O(h`<arcgis-table-list-next .headingLevel=${i?.headingLevel ?? t} .selectionMode=${i?.selectionMode ?? s} .dragEnabled=${i?.dragEnabled ?? a} .collapsed=${i?.collapsed} .filterPlaceholder=${i?.filterPlaceholder} .filterText=${i?.filterText} .icon=${i?.icon ?? void 0} .label=${i?.label ?? void 0} .listItemCreatedFunction=${i?.listItemCreatedFunction} .messageOverrides=${this.messageOverrides} .tables=${i?.tables} .referenceElement=${this.referenceElement} @arcgisReady=${(r) => r.stopPropagation()}></arcgis-table-list-next>`);
   }
   _handlePanelFlowItemBack(e) {
     e.open = !1;
   }
   _moveLayerFromChildList({ toEl: e, fromEl: t, dragEl: s, newIndex: a }) {
     const i = this._resolveListContainer(e), r = this._resolveListContainer(t), o = m(s, this.operationalItems), l = this._getContainerItem(i), n = this._getContainerItem(r);
-    a == null || !o || (this.viewModel.moveItem(o, n, l, a), Z(this, o.uid, (d) => this._resolveListContainer(d.parentElement) === i));
+    a == null || !o || (this.viewModel.moveItem(o, n, l, a), ae(this, o.uid, (d) => this._resolveListContainer(d.parentElement) === i));
   }
   _onCalciteListDragEnd(e) {
     const { fromEl: t, toEl: s, dragEl: a, oldIndex: i } = e;
@@ -215,12 +219,12 @@ class ae extends Q {
   _sortLayers(e, t) {
     if (e)
       if (e === this._rootListRef.value)
-        q(this.el.view?.map?.layers, t);
+        z(this.el.view?.map?.layers, t);
       else {
         const s = m(e, this.operationalItems);
         if (!s)
           return;
-        z(s, t);
+        J(s, t);
       }
   }
   _handleCalciteListChange(e) {
@@ -232,10 +236,10 @@ class ae extends Q {
   }
   render() {
     const { state: e } = this, t = {
-      [$.hidden]: e === "loading",
-      [$.disabled]: e === "disabled"
+      [C.hidden]: e === "loading",
+      [C.disabled]: e === "disabled"
     };
-    return h`<div class=${E(B($.widget, t))}>${this._visibleItems?.length ? this._renderItemTooltips() : null}${this._renderItems()}</div>`;
+    return h`<div class=${E(S(C.widget, t))}>${this._visibleItems?.length ? this._renderItemTooltips() : null}${this._renderItems()}</div>`;
   }
   _renderItemTooltip(e) {
     const { _tooltipReferenceMap: t, messages: s } = this;
@@ -254,17 +258,17 @@ class ae extends Q {
     return h`<div slot=message>${this.messages.noItemsToDisplay}</div>`;
   }
   _renderNoItems() {
-    return this.hideNoItemsNotice ? null : h`<div class=${E(y.itemMessage)}><calcite-notice icon=information kind=info open width=full>${this._renderNoItemsMessage()}</calcite-notice></div>`;
+    return this.hideNoItemsNotice ? null : h`<div class=${E(I.itemMessage)}><calcite-notice icon=information kind=info open width=full>${this._renderNoItemsMessage()}</calcite-notice></div>`;
   }
   _renderLayerFlowItem(e, t) {
     const { messages: s, openedLayers: a } = this, i = e.title || this.messages.untitledLayer;
-    return v(e?.uid ?? i, h`<calcite-flow-item data-layer-uid=${e?.uid ?? "" ?? A} .description=${i} .heading=${s[e.type === "catalog" ? "catalogLayers" : "tables"]} .headingLevel=${this.headingLevel} .selected=${t} @calciteFlowItemBack=${(r) => {
+    return v(e?.uid ?? i, h`<calcite-flow-item data-layer-uid=${e?.uid ?? "" ?? D} .description=${i} .heading=${s[e.type === "catalog" ? "catalogLayers" : "tables"]} .headingLevel=${this.headingLevel} .selected=${t} @calciteFlowItemBack=${(r) => {
       r.preventDefault(), a.pop(), a.at(-1) && this._layerFlowItemRef.value?.setFocus();
     }} ${b(this._layerFlowItemRef)}>${this._layerListMap.get(e)}</calcite-flow-item>`);
   }
   _renderPanelFlowItems() {
     const { _openedPanelItems: e, openedLayers: t } = this;
-    return N(e.toArray(), (a) => a.uid, (a, i) => {
+    return x(e.toArray(), (a) => a.uid, (a, i) => {
       const { panel: r, title: o } = a, l = () => this._handlePanelFlowItemBack(r);
       return h`<calcite-flow-item .description=${o} .heading=${r.title} .headingLevel=${this.headingLevel} .selected=${!t.length && i === e.length - 1} @calciteFlowItemBack=${(n) => {
         n.preventDefault(), l();
@@ -273,19 +277,19 @@ class ae extends Q {
   }
   _renderItems() {
     const { collapsed: e, _visibleItems: t, _openedPanelItems: s, _filterEnabled: a, _rootGroupUid: i, showCloseButton: r, showCollapseButton: o, showHeading: l, _dragEnabled: n, selectionMode: d, filterText: g, openedLayers: u, filterPlaceholder: L, messages: f } = this, _ = [
-      h`<calcite-flow-item .closable=${r} .closed=${this.closed} .collapsed=${e} .collapsible=${o} .heading=${l ? f.componentLabel : void 0} .headingLevel=${this.headingLevel} .selected=${!u.length && !s.length} @calciteFlowItemClose=${() => this.closed = !1}>${t?.length ? h`<calcite-list @focusin=${this._setActiveItem} @focusout=${this._clearActiveItem} .canPull=${(c) => this._canMove(c, "pull")} .canPut=${(c) => this._canMove(c, "put")} data-layer-type=${i ?? A} .displayMode=${O} .dragEnabled=${n} .filterEnabled=${a} .filterPlaceholder=${L} .filterProps=${J} .filterText=${a ? g : ""} .group=${i} .label=${f.componentLabel} @mouseleave=${this._clearActiveItem} @mouseover=${this._setActiveItem} selection-appearance=highlight .selectionMode=${d} @calciteListChange=${this._handleCalciteListChange} @calciteListFilter=${(c) => {
+      h`<calcite-flow-item .closable=${r} .closed=${this.closed} .collapsed=${e} .collapsible=${o} .heading=${l ? f.componentLabel : void 0} .headingLevel=${this.headingLevel} .selected=${!u.length && !s.length} @calciteFlowItemClose=${() => this.closed = !1}>${t?.length ? h`<calcite-list @focusin=${this._setActiveItem} @focusout=${this._clearActiveItem} .canPull=${(c) => this._canMove(c, "pull")} .canPut=${(c) => this._canMove(c, "put")} data-layer-type=${i ?? D} .displayMode=${P} .dragEnabled=${n} .filterEnabled=${a} .filterPlaceholder=${L} .filterProps=${K} .filterText=${a ? g : ""} .group=${i} .label=${f.componentLabel} @mouseleave=${this._clearActiveItem} @mouseover=${this._setActiveItem} selection-appearance=highlight .selectionMode=${d} @calciteListChange=${this._handleCalciteListChange} @calciteListFilter=${(c) => {
         this.filterText = c.currentTarget?.filterText ?? "", this.arcgisFilterChange.emit();
-      }} @calciteListOrderChange=${(c) => this._onCalciteListOrderChange(c.detail)} @calciteListDragEnd=${(c) => this._onCalciteListDragEnd(c.detail)} ${b(this._rootListRef)}>${t.toArray().map((c) => this._renderItem(c))}${a && !this.hideNoFilterResultsNotice ? h`<div class=${E(y.filterNoResults)} slot=filter-no-results><calcite-notice kind=info open width=full>${this._renderNoItemsMessage()}</calcite-notice></div>` : null}</calcite-list>` : this._renderNoItems()}</calcite-flow-item>`,
+      }} @calciteListOrderChange=${(c) => this._onCalciteListOrderChange(c.detail)} @calciteListDragEnd=${(c) => this._onCalciteListDragEnd(c.detail)} ${b(this._rootListRef)}>${t.toArray().map((c) => this._renderItem(c))}${a && !this.hideNoFilterResultsNotice ? h`<div class=${E(I.filterNoResults)} slot=filter-no-results><calcite-notice kind=info open width=full>${this._renderNoItemsMessage()}</calcite-notice></div>` : null}</calcite-list>` : this._renderNoItems()}</calcite-flow-item>`,
       this._renderPanelFlowItems(),
       this._renderedOpenLayerFlowItems
     ];
     return this.closed ? null : v("root-flow", h`<calcite-flow>${_}</calcite-flow>`);
   }
   _renderItem(e, t, s) {
-    return v(e.uid, ee({ activeItem: this._activeItem, canMove: this._canMove, css: y, displayMode: O, dragEnabled: this.dragEnabled, hideStatusIndicators: this.hideStatusIndicators, hideCatalogLayerList: this.hideCatalogLayerList, item: e, messages: this.messages, layerTablesEnabled: this.layerTablesEnabled, listModeDisabled: this.viewModel.listModeDisabled, operationalItems: this.operationalItems, parent: t, parentTitles: s, rootGroupUid: this._rootGroupUid, selectedDragItemLayerUid: this._selectedDragItemLayerUid, selectedItems: this.selectedItems, selectionMode: this.selectionMode, setCurrentActiveItem: this._setCurrentActiveItem, showTemporaryLayerIndicators: this.showTemporaryLayerIndicators, showCloseButton: this.showCloseButton, showCollapseButton: this.showCollapseButton, showErrors: this.showErrors, showHeading: this.showHeading, showFilter: this.showFilter, clearActiveItem: this._clearActiveItem, visibilityAppearance: this.visibilityAppearance, handleAction: this._onTriggerAction, handleCatalogOpen: this._onCatalogOpen, handleSelectedDragItemLayerUidChange: this._onSelectedDragItemLayerUidChange, handleTablesOpen: this._onTablesOpen, handleTooltipReferenceChange: this._onTooltipReferenceChange, view: this.view }));
+    return v(e.uid, Z({ activeItem: this._activeItem, canMove: this._canMove, css: I, displayMode: P, dragEnabled: this.dragEnabled, hideStatusIndicators: this.hideStatusIndicators, hideCatalogLayerList: this.hideCatalogLayerList, item: e, messages: this.messages, layerTablesEnabled: this.layerTablesEnabled, listModeDisabled: this.viewModel.listModeDisabled, operationalItems: this.operationalItems, parent: t, parentTitles: s, rootGroupUid: this._rootGroupUid, selectedDragItemLayerUid: this._selectedDragItemLayerUid, selectedItems: this.selectedItems, selectionMode: this.selectionMode, setCurrentActiveItem: this._setCurrentActiveItem, showTemporaryLayerIndicators: this.showTemporaryLayerIndicators, showCloseButton: this.showCloseButton, showCollapseButton: this.showCollapseButton, showErrors: this.showErrors, showHeading: this.showHeading, showFilter: this.showFilter, clearActiveItem: this._clearActiveItem, visibilityAppearance: this.visibilityAppearance, handleAction: this._onTriggerAction, handleCatalogOpen: this._onCatalogOpen, handleSelectedDragItemLayerUidChange: this._onSelectedDragItemLayerUidChange, handleTablesOpen: this._onTablesOpen, handleTooltipReferenceChange: this._onTooltipReferenceChange, view: this.view }));
   }
 }
-R("arcgis-layer-list-next", ae);
+k("arcgis-layer-list-next", oe);
 export {
-  ae as ArcgisLayerListNext
+  oe as ArcgisLayerListNext
 };

package/dist/components/arcgis-layer-list-next/layer-list-item/customElement.js

@@ -1,13 +1,137 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
-import "lit";
-import "lit/directives/keyed.js";
-import "@arcgis/core/layers/catalog/catalogUtils.js";
-import "@arcgis/lumina";
-import "@arcgis/toolkit/dom";
-import "lit/directives/ref.js";
-import "../../../chunks/action-utils.js";
-import "../../../chunks/layer-list-utils.js";
-import { A as L } from "../../../chunks/layer-list-item.js";
+import { html as s } from "lit";
+import { keyed as K } from "lit/directives/keyed.js";
+import { isLayerFromCatalog as Le } from "@arcgis/core/layers/catalog/catalogUtils.js";
+import { safeClassMap as r, nothing as d } from "@arcgis/lumina";
+import { classes as Q } from "@arcgis/toolkit/dom";
+import { createRef as W, ref as X } from "lit/directives/ref.js";
+import { a as Me } from "../../../chunks/action-utils.js";
+import { f as ke, i as Y, l as Ee, h as Pe, j as we, k as De, g as Oe } from "../../../chunks/layer-list-utils.js";
+import { i as Fe, g as Z, t as ee, h as te, a as Ge, F as Re, b as Ve, L as ie, f as He } from "../../../chunks/utils2.js";
+const ae = /* @__PURE__ */ new Map();
+function le(a) {
+  return a ? ae.get(a) ?? !1 : !1;
+}
+function Ue(a, e) {
+  const y = !(a.aria?.pressed ?? le(e));
+  return a.aria = { ...a.aria, pressed: y }, e && ae.set(e, y), y;
+}
+function qe(a) {
+  const { item: e, itemType: y = "layer", parent: f, hideStatusIndicators: ne, css: i, visibilityAppearance: I, hideCatalogLayerList: ce, dragEnabled: P = !1, rootGroupUid: A, listModeDisabled: se = !1, selectionMode: T, displayMode: oe, layerTablesEnabled: C, showErrors: re, parentTitles: w, selectedItems: de, activeItem: me, handleCatalogOpen: ue, handleTablesOpen: be, selectedDragItemLayerUid: ge, handleSelectedDragItemLayerUidChange: pe, handlePanelOpen: $e, messages: l, setCurrentActiveItem: D, clearActiveItem: O } = a, c = Fe(e), p = W(), S = W(), ye = y === "table" ? l.untitledTable ?? "" : l.untitledLayer ?? "", fe = c ? l.trackInfo?.[e.trackInfoType] ?? e.trackInfoType ?? "" : "", b = e.title || fe || ye || "";
+  let F = null;
+  !ne && !c && (F = s`<arcgis-layer-list-item-indicator class=${r(i.statusIndicator)} .messages=${l} .item=${e} .parent=${f} slot=content-end></arcgis-layer-list-item-indicator>`);
+  let G = null;
+  {
+    const { layer: t } = e, n = t && "persistenceEnabled" in t && (Le(t) || !t.persistenceEnabled);
+    !c && (a.showTemporaryLayerIndicators || a.showTemporaryTableIndicators) && n && (G = s`<calcite-icon class=${r(i.itemTemporaryIcon)} icon=temporary scale=s slot=content-start title=${l.temporary ?? d}></calcite-icon>`);
+  }
+  let R = null;
+  if ("visible" in e && "visibleToggle" in i && I) {
+    const t = Z(f);
+    if (t !== "inherited") {
+      const n = ke({
+        visible: e.visible,
+        exclusive: t === "exclusive",
+        visibilityAppearance: I
+      }), o = I === "checkbox", m = l.layerVisibility, $ = e.title ?? e.layer?.title ?? "", g = $ ? `${m ?? ""}: ${$}` : m ?? "", v = c ? e.visible : le(e.layer?.id);
+      R = s`<calcite-action .aria=${{ pressed: v }} class=${r(i.visibleToggle)} .icon=${o ? n : void 0} .label=${g} @click=${(E) => {
+        c || Ue(E.currentTarget, e.layer?.id), ee(e, f);
+      }} .slot=${o ? "actions-start" : "actions-end"} .text=${m ?? ""} title=${m ?? d}>${o ? null : s`<calcite-icon class=${r(Q({
+        [i.visibleIcon]: t !== "exclusive" && e.visible
+      }))} .icon=${n} scale=s></calcite-icon>`}</calcite-action>`;
+    }
+  }
+  let V = null;
+  {
+    const t = e.panel;
+    t?.open && !t.disabled && !t.flowEnabled && (!c || te(e)) && (V = s`<div class=${r(i.itemContentBottom)} slot=content-bottom><arcgis-layer-list-item-panel .item=${e} .view=${a.view}></arcgis-layer-list-item-panel></div>`);
+  }
+  let H = null;
+  {
+    const t = e.panel;
+    if (t?.visible && (!c || te(e))) {
+      const { open: n, title: o, disabled: m } = t;
+      (t.content === "legend" || Array.isArray(t.content) && t.content.includes("legend")) && (t.icon = "legend");
+      const $ = {
+        icon: t.icon,
+        image: t.image ?? void 0,
+        indicator: !1
+      }, g = Me($);
+      H = s`<calcite-action .active=${n} .disabled=${m} .icon=${g} @click=${() => Ge(e, $e)} slot=actions-end .text=${o ?? ""} title=${o ?? void 0 ?? d}>${Re(i, t)}</calcite-action>`;
+    }
+  }
+  let U = null;
+  {
+    const t = e.layer, n = t?.type === "catalog-footprint", o = t?.type === "sublayer" && Y(t, "footprints");
+    !c && "itemCatalogIcon" in i && (n || o) && (U = s`<calcite-icon class=${r(i.itemCatalogIcon)} icon=footprint scale=s slot=content-start></calcite-icon>`);
+  }
+  let q = null;
+  {
+    const t = e.layer, n = t?.type === "catalog-dynamic-group", o = t?.type === "sublayer" && Y(t, "layers-in-view");
+    !c && "itemCatalogIcon" in i && (n || o) && (q = s`<calcite-icon class=${r(i.itemCatalogIcon)} icon=catalog-dataset scale=s slot=content-start></calcite-icon>`);
+  }
+  let j = null;
+  if ("visible" in e) {
+    const t = e.layer;
+    !c && !ce && t?.type === "catalog-dynamic-group" && (j = s`<calcite-action .disabled=${!t.visible} icon=chevron-right icon-flip-rtl @click=${() => ue?.(e)} scale=s slot=actions-end .text=${b ?? ""}></calcite-action>`);
+  }
+  let B = null, x = !1;
+  {
+    const t = e.layer;
+    if (!c && C && t)
+      switch (t.type) {
+        case "knowledge-graph":
+          x = C.includes(t.type) && "tables" in t && !!t.tables?.length;
+          break;
+        case "map-image":
+        case "tile":
+          x = C.includes(t.type) && "subtables" in t && !!t.subtables?.length;
+          break;
+      }
+    "itemTableIcon" in i && "visible" in e && "tables" in l && x && (B = K(`${e.uid}-tables`, s`<calcite-list-item class=${r(i.item)} data-layer-id=${t?.id ?? d} drag-disabled .label=${l.tables} title=${l.tables ?? d} @calciteListItemSelect=${() => be?.(e)} .value=${e}><calcite-icon class=${r(i.itemTableIcon)} icon=table scale=s slot=content-start></calcite-icon><calcite-icon flip-rtl icon=chevron-right scale=s slot=content-end></calcite-icon></calcite-list-item>`));
+  }
+  let N = null;
+  if ("children" in e) {
+    const t = [...w ?? [], e.title], { children: n, layer: o } = e, m = o?.type !== "catalog-dynamic-group" && Ee(e), $ = se ? !1 : Pe(o), g = o?.type === "group", v = !$ && !m && P && g, E = g && "sortable" in e && e.sortable, Ce = n.some((u) => "sortable" in u && u.sortable), Se = P && (m || v) && (Ce || v) && ("childrenSortable" in e && e.childrenSortable || E) && we(e), xe = m ? (n?.filter((u) => !u.hidden && (re || !u.error)).toArray() ?? []).map((u) => qe({
+      ...a,
+      item: u,
+      parent: e,
+      parentTitles: t
+    })) : null;
+    (m || v) && (N = s`<calcite-list .canPull=${(u) => a.canMove ? a.canMove(u, "pull") : !1} .canPut=${(u) => a.canMove ? a.canMove(u, "put") : !1} data-item=${e.uid ?? d} data-layer-type=${A ?? d} .displayMode=${oe} .dragEnabled=${Se} .group=${g ? A : `${A}-${o?.uid}`} .label=${e.title} selection-appearance=highlight .selectionMode=${T}>${xe}${B}</calcite-list>`);
+  }
+  let L = null;
+  if (!c && e.error) {
+    const t = "layerError" in l ? l.layerError : l.tableError;
+    L = s`<div class=${r(i.itemMessage)} slot=content-bottom><calcite-notice icon=exclamation-mark-triangle kind=warning open scale=s width=full><div slot=message>${t}</div></calcite-notice></div>`;
+  } else "incompatible" in e && e.incompatible && "layerIncompatible" in l && (L = s`<div class=${r(i.itemMessage)} slot=content-bottom><calcite-notice icon=exclamation-mark-triangle kind=warning open scale=s tabindex=0 width=full ${X(S)}><div slot=message>${l.layerIncompatible}</div></calcite-notice></div>`);
+  const _ = Ve(e), M = e.actionsSections.reduce((t, n) => t + n.length, 0), z = De(_), ve = _.toArray().map((t) => s`<calcite-action-group>${t.toArray().map((n) => ie(a, n, !0))}</calcite-action-group>`), he = (t) => {
+    e.actionsOpen = t.currentTarget.open;
+  };
+  let J = null;
+  M > 1 && (J = s`<calcite-action-menu appearance=transparent .label=${l.menu ?? ""} .open=${e.actionsOpen} overlay-positioning=fixed placement=bottom-end slot=actions-end @calciteActionMenuOpen=${he}><calcite-action .aria=${{
+    expanded: e.actionsOpen ?? !1,
+    hasPopup: "true"
+  }} icon=ellipsis scale=s slot=trigger .text=${l.options ?? ""} title=${l.options ?? d}></calcite-action>${ve}</calcite-action-menu>`);
+  let k = null;
+  M === 1 && z ? k = ie(a, z, !1) : M > 1 && (k = J);
+  const Ie = c ? b : "visibleAtCurrentTimeExtent" in e && "layerInvisibleAtTime" in l && !e.visibleAtCurrentTimeExtent ? `${b} (${l.layerInvisibleAtTime})` : "visibleAtCurrentScale" in e && "layerInvisibleAtScale" in l && !e.visibleAtCurrentScale ? `${b} (${l.layerInvisibleAtScale})` : b, Ae = "parent" in e && e.parent?.layer?.type === "catalog", h = e.layer, Te = !c && ("visibleAtCurrentScale" in e && !e.visibleAtCurrentScale || "visibleAtCurrentTimeExtent" in e && !e.visibleAtCurrentTimeExtent);
+  return queueMicrotask(() => {
+    c || He(p.value ?? null, e, ge, pe), S.value && (a.handleTooltipReferenceChange?.(h?.uid, S.value), queueMicrotask(() => a.handleTooltipReferenceChange?.(h?.uid, null)));
+  }), K(e.uid, s`<calcite-list-item class=${r(Q(i.item, "itemActive" in i && { [i.itemActive]: me?.uid === e.uid }))} data-item=${e.uid ?? d} data-layer-id=${h?.id ?? d} .dragDisabled=${!("sortable" in e && e.sortable) || Ae} id=${(c ? void 0 : h?.uid) ?? d} .label=${b} .metadata=${{ parentTitles: w ?? [], _title: b }} .expanded=${"open" in e && e.open} .selected=${T !== "none" ? de.includes(e) : !1} title=${Ie ?? d} .unavailable=${Te} .value=${e} @focusin=${() => {
+    D?.(e), p.value?.classList.add(i.itemActive);
+  }} @focusout=${() => {
+    O?.(), p.value?.classList.remove(i.itemActive);
+  }} @mouseover=${() => {
+    D?.(e), p.value?.classList.add(i.itemActive);
+  }} @mouseleave=${() => {
+    O?.(), p.value?.classList.remove(i.itemActive);
+  }} @calciteListItemSelect=${(t) => {
+    t.target === t.currentTarget && "visible" in e && Oe(t.currentTarget, a.operationalItems) === e && T === "none" && Z(f) !== "inherited" && ee(e, f);
+  }} @calciteListItemToggle=${(t) => {
+    "open" in e && (t.stopPropagation(), e.open = t.target.expanded);
+  }} ${X(p)}>${U}${q}${F}${R}${j}${G}${N}${L}${V}${H}${k}</calcite-list-item>`);
+}
 export {
-  L as ArcgisLayerListItem
+  qe as ArcgisLayerListItem
 };

package/dist/components/arcgis-layer-list-next/types.d.ts

@@ -40,6 +40,11 @@ export type LayerListMessages = {
     tableError: string;
     temporary: string;
     tables: string;
+    trackInfo: {
+        latestObservations: string;
+        previousObservations: string;
+        trackLines: string;
+    };
     catalogLayers: string;
     connectionStatus: string;
     updating: string;

package/dist/components/arcgis-legend-card-color-ramp/customElement.js

@@ -4,7 +4,7 @@ import { css as y, html as s } from "lit";
 import { LitElement as v, safeClassMap as $, safeStyleMap as u } from "@arcgis/lumina";
 import { classes as L } from "@arcgis/toolkit/dom";
 import { r as b } from "../../chunks/svgUtils.js";
-import { a as x } from "../../chunks/utils2.js";
+import { a as x } from "../../chunks/utils3.js";
 const w = y`:host{display:flex}.layer-row{display:flex;flex:1}.color-ramp-container{justify-content:center}.symbol-container{display:flex;flex-direction:column}.interval-separators-container{text-align:center}.interval-separator{font-size:.5em}.ramp-label{margin:0 .5em;white-space:nowrap;height:25px;line-height:var(--calcite-font-line-height-fixed-xl)}`, R = 25, E = 25, _ = 100;
 class S extends v {
   constructor() {

package/dist/components/arcgis-legend-card-element/customElement.js

@@ -7,7 +7,7 @@ import { classes as r } from "@arcgis/toolkit/dom";
 import { H as w } from "../../chunks/heading.js";
 import { g as f } from "../../chunks/globalCss.js";
 import { a as _, g as v } from "../../chunks/titleUtils.js";
-import { s as $, i as z, g as x } from "../../chunks/utils2.js";
+import { s as $, i as z, g as x } from "../../chunks/utils3.js";
 const C = k`.esri-widget__heading{color:var(--calcite-color-text-2);margin:0 0 .5rem;font-weight:var(--calcite-font-weight-semibold)}h1.esri-widget__heading{font-size:var(--calcite-font-size-xl)}h2.esri-widget__heading{font-size:var(--calcite-font-size-md)}h3.esri-widget__heading,h4.esri-widget__heading,h5.esri-widget__heading,h6.esri-widget__heading{font-size:var(--calcite-font-size)}.section{word-break:break-word;word-wrap:break-word;padding:var(--calcite-space-sm) var(--calcite-space-md);min-width:250px;max-width:500px;height:100%;height:-moz-available;height:-webkit-fill-available;height:fill-available;overflow:auto;font-size:var(--calcite-font-size-sm)}.carousel-title-container{margin-bottom:var(--calcite-space-sm)}.carousel-title{margin:0}.section-title{font-weight:var(--calcite-font-weight-regular)}.layer-caption{padding:var(--calcite-space-2xs) 0;margin:0;font-weight:var(--calcite-font-weight-regular)}.imagery-layer-stretched-image{display:block;margin-bottom:-2px}.image-label{padding-inline-start:var(--calcite-space-xs)}.label-element{margin:.1em;padding:.5em 1em;min-width:2em;min-height:1em;text-align:center;display:flex;align-items:center;justify-content:center;flex:1}.layer-row{display:flex;align-items:center}.symbol{display:block;margin:auto}.pie-chart-ramp-preview{display:flex;justify-content:center}.relationship-container{display:flex;flex-direction:column}.relationship-container .layer-row{padding-bottom:.5em}.relationship-container .layer-row:last-child{padding-bottom:0}.container{display:flex;gap:var(--calcite-space-sm);flex-wrap:wrap}.background-styles-container{display:flex;flex-wrap:wrap}:host([stacked]) .container{display:table}:host([stacked]) .symbol-row{display:table-row;width:100%}:host([stacked]) .symbol-row:not(:last-child) .label-cell,:host([stacked]) .symbol-row:not(:last-child) .symbol-cell{padding-bottom:var(--calcite-space-xs)}:host([stacked]) .label-cell{display:table-cell;vertical-align:middle}:host([stacked]) .symbol-cell{display:table-cell;vertical-align:middle;text-align:center}:host([stacked]) .symbol-cell div{display:flex;align-items:center;justify-content:center}`;
 function F(m) {
   return m ? m.r * 0.299 + m.g * 0.587 + m.b * 0.114 >= 127 : void 0;

package/dist/components/arcgis-legend-card-size-ramp/customElement.js

@@ -2,7 +2,7 @@
 import { c as C } from "../../chunks/runtime.js";
 import { css as P, html as X } from "lit";
 import { LitElement as j, safeStyleMap as v, safeClassMap as Y } from "@arcgis/lumina";
-import { s as k, g as I, p as R } from "../../chunks/utils2.js";
+import { s as k, g as I, p as R } from "../../chunks/utils3.js";
 const A = P`.size-ramp-container{display:flex;align-items:center;justify-content:center}.size-ramp-vertical-container{display:flex;flex-direction:column;align-items:center;justify-content:center}.size-ramp-label{margin:0 .5em;white-space:nowrap}.size-ramp-vertical-ramp{display:flex;flex-direction:column;align-items:center}.size-ramp-ramp{display:flex;flex-direction:row-reverse;align-items:center}.size-ramp-preview{display:flex}`, M = "#ddd";
 function N(e) {
   if (!e)

package/dist/components/arcgis-legend-classic-color-ramp/customElement.js

@@ -2,7 +2,7 @@
 import { c as r } from "../../chunks/runtime.js";
 import { css as s, html as l } from "lit";
 import { LitElement as i, safeStyleMap as c, safeClassMap as o } from "@arcgis/lumina";
-import { s as p, a as n } from "../../chunks/utils2.js";
+import { s as p, a as n } from "../../chunks/utils3.js";
 const m = s`.layer-row{display:flex}.layer-cell{padding:var(--calcite-space-2xs) 0;vertical-align:middle;word-break:break-word}.layer-cell-symbols{text-align:center}.layer-cell-info{padding-right:var(--calcite-space-sm);padding-left:var(--calcite-space-sm);max-width:250px;word-break:normal;word-wrap:normal;font-size:var(--calcite-font-size-sm)}.color-ramp{width:24px}.opacity-ramp{background-image:url(data:image/avif;base64,AAAAHGZ0eXBhdmlmAAAAAG1pZjFhdmlmbWlhZgAAANZtZXRhAAAAAAAAACFoZGxyAAAAAAAAAABwaWN0AAAAAAAAAAAAAAAAAAAAAA5waXRtAAAAAAABAAAAImlsb2MAAAAAREAAAQABAAAAAAD6AAEAAAAAAAAAHgAAACNpaW5mAAAAAAABAAAAFWluZmUCAAAAAAEAAGF2MDEAAAAAVmlwcnAAAAA4aXBjbwAAAAxhdjFDgQAMAAAAABRpc3BlAAAAAAAAAAgAAAAIAAAAEHBpeGkAAAAAAwgICAAAABZpcG1hAAAAAAAAAAEAAQOBAgMAAAAmbWRhdBIACggYCL/kgIaDQjIQGAAAAEBAA1LuL7oS8L0QEA==)}.ramp-labels{display:flex;flex-flow:column nowrap;justify-content:space-between}.ramp-label{position:relative;padding:0 var(--calcite-space-sm);line-height:var(--calcite-font-size-sm);white-space:nowrap;font-size:var(--calcite-font-size-sm)}.ramp-label:before{display:block;position:absolute;top:.25em;right:100%;border-width:3px 4px 3px 0;border-style:solid;border-color:transparent var(--calcite-color-text-1) transparent transparent;width:0;height:0;content:""}.ramp-label:first-child{margin-top:calc(var(--calcite-font-size-sm) / 3 * -1)}.ramp-label:last-child{bottom:calc(var(--calcite-font-size-sm) * .25 * -1)}.layer-caption{display:table-caption;padding:var(--calcite-space-sm) 0}:dir(rtl) .ramp-label:before{right:auto;left:100%;border-width:3px 0 3px 4px;border-color:transparent transparent transparent var(--calcite-color-text-1)}`;
 class d extends i {
   constructor() {

package/dist/components/arcgis-legend-classic-element/customElement.js

@@ -4,7 +4,7 @@ import { css as f, html as s } from "lit";
 import { LitElement as u, safeClassMap as m, nothing as o, safeStyleMap as $ } from "@arcgis/lumina";
 import { classes as y } from "@arcgis/toolkit/dom";
 import { a as E, g as p } from "../../chunks/titleUtils.js";
-import { s as h, i as L, g as b } from "../../chunks/utils2.js";
+import { s as h, i as L, g as b } from "../../chunks/utils3.js";
 const x = f`:host{contain:content}.layer-body:has(>arcgis-legend-classic-element){display:flex;flex-direction:column;gap:calc(var(--arcgis-internal-legend-layer-gap) / 2)}.layer-body arcgis-legend-classic-element{margin-inline-start:var(--arcgis-internal-legend-layer-padding)}.layer-table{display:table;width:100%}.layer-caption{display:table-caption;word-break:break-word;color:var(--calcite-color-text-1);font-size:var(--calcite-font-size-sm);font-weight:var(--calcite-font-weight-regular);padding-bottom:var(--calcite-space-sm)}.layer-row{display:table-row}.layer-body:has(>.layer-row+.layer-row)>.layer-row .layer-cell{padding-block:var(--calcite-space-2xs)}.layer-cell{vertical-align:middle;word-break:break-word;display:table-cell}.layer-cell-info{padding-inline-start:var(--calcite-space-xs);max-width:250px;word-break:normal;word-wrap:normal;font-size:var(--calcite-font-size-sm)}.layer-cell-inline-title{font-weight:var(--calcite-font-weight-medium);font-size:var(--calcite-font-size)}.imagery-layer-stretched-image{display:block;margin-bottom:-2px}.imagery-layer-info-stretched{padding:0 2px;vertical-align:top}.layer-cell-symbols{text-align:center}.symbol{display:flex;justify-content:center}`;
 class z extends u {
   static {

package/dist/components/arcgis-legend-classic-size-ramp/customElement.js

@@ -4,7 +4,7 @@ import { css as n, html as i } from "lit";
 import { LitElement as m, safeClassMap as r } from "@arcgis/lumina";
 import { classes as l } from "@arcgis/toolkit/dom";
 import { g as o } from "../../chunks/titleUtils.js";
-import { s as c, g as p } from "../../chunks/utils2.js";
+import { s as c, g as p } from "../../chunks/utils3.js";
 const d = n`.size-ramp-container{display:table}.size-ramp-row{display:table-row}.size-ramp-row:not(:last-child) .size-ramp-cell,.size-ramp-row:not(:last-child) .size-ramp-label{padding-bottom:var(--calcite-space-xs)}.size-ramp-cell{min-width:100px;vertical-align:middle;word-break:break-word;display:table-cell}.size-ramp-label{padding-inline-start:var(--calcite-space-sm);max-width:250px;word-break:normal;word-wrap:normal;font-size:var(--calcite-font-size-sm)}.size-ramp-symbol-container{min-width:10px;text-align:center}.size-ramp-symbol{display:flex;justify-content:center}`;
 class g extends m {
   constructor() {

package/dist/components/arcgis-legend-spike-ramp/customElement.js

@@ -2,7 +2,7 @@
 import { c as W } from "../../chunks/runtime.js";
 import { css as X, html as v } from "lit";
 import { LitElement as Y, safeStyleMap as b } from "@arcgis/lumina";
-import { s as A, g as z, p as k } from "../../chunks/utils2.js";
+import { s as A, g as z, p as k } from "../../chunks/utils3.js";
 const C = X`.spike-ramp-container{display:flex;flex-direction:row;gap:var(--calcite-space-sm-plus)}.spike-ramp-preview-container{display:flex;position:relative;gap:var(--calcite-space-sm-plus);border-bottom:var(--calcite-border-width-sm) solid var(--calcite-color-border-2);padding-inline-end:var(--calcite-space-xl)}.spike-ramp-preview{display:flex;gap:var(--calcite-space-sm-plus);align-items:end}.spike-ramp-symbol-preview{display:flex}.spike-ramp-lines{display:flex;position:absolute;bottom:0}.spike-ramp-labels-container{display:flex;position:relative;top:-5px;flex:1;min-width:120px}.spike-ramp-label{position:relative;padding:0 var(--calcite-space-sm);line-height:1em;word-break:break-all;font-size:var(--calcite-font-size-sm)}.spike-ramp-label:before{display:block;position:absolute;top:.25em;right:100%;border-width:3px 4px 3px 0;border-style:solid;border-color:transparent var(--calcite-color-text-1) transparent transparent;width:0;height:0;content:""}`, I = "#ddd", e = window.devicePixelRatio;
 function u(m) {
   return m.infos.filter((r, o) => o % 2 === 0);

package/dist/components/arcgis-oriented-imagery-viewer-panoramic-viewer/customElement.js

@@ -29,7 +29,7 @@ import W from "@arcgis/core/geometry/Point.js";
 import { createSphere as Te } from "@arcgis/core/geometry/support/meshUtils.js";
 import Se from "@arcgis/core/layers/ImageryTileLayer.js";
 import ze from "@arcgis/core/symbols/Font.js";
-import { c as Ie, b as Pe, f as Le } from "../../chunks/utils3.js";
+import { c as Ie, b as Pe, f as Le } from "../../chunks/utils4.js";
 import Re from "@arcgis/core/symbols/TextSymbol.js";
 import { log as Ae } from "@arcgis/toolkit/log";
 const Fe = se`:host{height:100%;--arcgis-view-color-focus: none}`;

package/dist/components/arcgis-oriented-imagery-viewer-panoramic-viewer-zoom/customElement.js

@@ -6,7 +6,7 @@ import { g as f } from "../../chunks/globalCss.js";
 import { s as w, c as d, a as g } from "../../chunks/zoom.js";
 import { u as O } from "../../chunks/useT9n.js";
 import { u as V } from "../../chunks/useView.js";
-import { m as s, f as i, a as n, b as p, c as y, d as m } from "../../chunks/utils3.js";
+import { m as s, f as i, a as n, b as p, c as y, d as m } from "../../chunks/utils4.js";
 import { clamp as z } from "@arcgis/toolkit/number";
 class F extends l {
   constructor() {

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

@@ -395,6 +395,13 @@ export abstract class ArcgisPopup extends LitElement {
    * @default false
    */
   accessor hideCollapseButton: boolean;
+  /**
+   * Indicates whether to hide relationship content when there are no relationship items to display.
+   *
+   * @default false
+   * @since 5.2
+   */
+  accessor hideEmptyRelationshipContent: boolean;
   /**
    * Indicates whether to hide the group heading for a list of multiple features.
    *