@arcgis/map-components 5.2.0-next.61 → 5.2.0-next.62

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

@@ -9,6 +9,7 @@ import type { CatalogLayerListProperties } from "@arcgis/core/widgets/CatalogLay
 import type { CatalogLayerListViewModelEvents } from "@arcgis/core/widgets/CatalogLayerList/CatalogLayerListViewModel.js";
 import type { TableListProperties } from "@arcgis/core/widgets/TableList.js";
 import type { PublicLitElement as LitElement } from "@arcgis/lumina";
+import type { useT9n } from "../../controllers/useT9n.js";
 import type { VisibilityAppearance } from "../../utils/action-utils.js";
 import type { setFilterPredicate } from "../../utils/layer-list-utils.js";
 import type { ArcgisTableList } from "../arcgis-table-list/customElement.js";
@@ -59,22 +60,7 @@ export abstract class ArcgisCatalogLayerListNext extends LitElement {
   accessor label: string | undefined;
   accessor listItemCreatedFunction: ListItemModifier | null | undefined;
   /** Overwrite localized strings for this component */
-  accessor messageOverrides: {
-      componentLabel?: string | undefined;
-      noItemsToDisplay?: string | undefined;
-      layerInvisibleAtScale?: string | undefined;
-      layerInvisibleAtTime?: string | undefined;
-      layerError?: string | undefined;
-      untitledLayer?: string | undefined;
-      layerVisibility?: string | undefined;
-      showLayer?: string | undefined;
-      hideLayer?: string | undefined;
-      layerIncompatible?: string | undefined;
-      layerIncompatibleTooltip?: string | undefined;
-      temporary?: string | undefined;
-      tables?: string | undefined;
-      catalogLayers?: string | undefined;
-  };
+  accessor messageOverrides: CatalogLayerListMessageOverrides;
   /** @internal */
   protected messages: Partial<{
       componentLabel: string;
@@ -157,8 +143,8 @@ export abstract class ArcgisCatalogLayerListNext extends LitElement {
   /** @default false */
   accessor topLayerDisabled: boolean;
   /**
-   * The view associated with the component. 
-   *   > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-catalog-layer-list-next component will be associated with a map or scene component rather than using the `view` property.
+   * The view associated with the component.
+   * > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-catalog-layer-list-next component will be associated with a map or scene component rather than using the `view` property.
    */
   accessor view: MapViewOrSceneView | null | undefined;
   /** @default "default" */
@@ -170,6 +156,7 @@ export abstract class ArcgisCatalogLayerListNext extends LitElement {
   readonly arcgisPropertyChange: import("@arcgis/lumina").TargetedEvent<this, { name: "state"; }>;
   readonly arcgisReady: import("@arcgis/lumina").TargetedEvent<this, void>;
   readonly arcgisSelectedItemsChange: import("@arcgis/lumina").TargetedEvent<this, void>;
+  readonly arcgisTriggerAction: import("@arcgis/lumina").TargetedEvent<this, CatalogLayerListViewModelEvents["trigger-action"]>;
   readonly "@eventTypes": {
     arcgisCatalogItemsChange: ArcgisCatalogLayerListNext["arcgisCatalogItemsChange"]["detail"];
     arcgisFilterChange: ArcgisCatalogLayerListNext["arcgisFilterChange"]["detail"];
@@ -177,6 +164,7 @@ export abstract class ArcgisCatalogLayerListNext extends LitElement {
     arcgisPropertyChange: ArcgisCatalogLayerListNext["arcgisPropertyChange"]["detail"];
     arcgisReady: ArcgisCatalogLayerListNext["arcgisReady"]["detail"];
     arcgisSelectedItemsChange: ArcgisCatalogLayerListNext["arcgisSelectedItemsChange"]["detail"];
+    arcgisTriggerAction: ArcgisCatalogLayerListNext["arcgisTriggerAction"]["detail"];
   };
 }
 
@@ -184,4 +172,21 @@ export type FlowLayer = CatalogLayer | SubtablesLayer;
 
 export type FlowList = ArcgisCatalogLayerListNext | ArcgisTableList;
 
+export type CatalogLayerListMessageOverrides = ReturnType<typeof useT9n<{
+    componentLabel: string;
+    noItemsToDisplay: string;
+    layerInvisibleAtScale: string;
+    layerInvisibleAtTime: string;
+    layerError: string;
+    untitledLayer: string;
+    layerVisibility: string;
+    showLayer: string;
+    hideLayer: string;
+    layerIncompatible: string;
+    layerIncompatibleTooltip: string;
+    temporary: string;
+    tables: string;
+    catalogLayers: string;
+}>>["_overrides"];
+
 export type SubtablesLayer = KnowledgeGraphLayer | MapImageLayer | TileLayer;

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

@@ -1,53 +1,66 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
-import { c as A } from "../../chunks/runtime.js";
-import { html as r } from "lit";
-import { repeat as R } from "lit/directives/repeat.js";
+import { c as O } from "../../chunks/runtime.js";
+import { html as n } from "lit";
+import { repeat as A } from "lit/directives/repeat.js";
 import { keyed as I } from "lit/directives/keyed.js";
-import { createReactiveMap as $ } from "@arcgis/core/applications/Components/featureUtils.js";
-import y from "@arcgis/core/core/Collection.js";
-import { on as L, watch as E } from "@arcgis/core/core/reactiveUtils.js";
+import { createReactiveMap as F } from "@arcgis/core/applications/Components/featureUtils.js";
+import u from "@arcgis/core/core/Collection.js";
+import { on as L, watch as R } from "@arcgis/core/core/reactiveUtils.js";
 import k from "@arcgis/core/widgets/CatalogLayerList/CatalogLayerListViewModel.js";
 import x from "@arcgis/core/widgets/LayerList/ListItem.js";
-import { createRef as D, ref as g } from "lit/directives/ref.js";
-import { LitElement as N, createEvent as h, renderElement as C, safeClassMap as w, nothing as F } from "@arcgis/lumina";
+import { LitElement as D, createEvent as d, renderElement as _, safeClassMap as b, nothing as M } from "@arcgis/lumina";
 import { usePropertyChange as B } from "@arcgis/lumina/controllers";
+import { reEmitEvent as N } from "@arcgis/lumina/controllers/accessor";
 import { classes as S } from "@arcgis/toolkit/dom";
 import { generateGuid as G } from "@arcgis/toolkit/string";
+import { createRef as H, ref as g } from "lit/directives/ref.js";
 import { u as U } from "../../chunks/useT9n.js";
-import { m as H } from "../../chunks/useViewModel.js";
+import { m as V } from "../../chunks/useViewModel.js";
 import { s as v } from "../../chunks/component-utils.js";
 import { g as f } from "../../chunks/globalCss.js";
-import { g as M, b as V, r as j, s as q, e as z } from "../../chunks/layer-list-utils.js";
-import { ArcgisLayerListItem as J } from "../arcgis-layer-list-next/layer-list-item/customElement.js";
-import { s as K, a as Q } from "../../chunks/layer-list-next.js";
-import { c as W } from "../../chunks/css.js";
-const m = W, X = (p) => {
+import { g as T, b as j, r as q, s as z, e as J } from "../../chunks/layer-list-utils.js";
+import { ArcgisLayerListItem as K } from "../arcgis-layer-list-next/layer-list-item/customElement.js";
+import { s as Q, a as W } from "../../chunks/layer-list-next.js";
+import { c as X } from "../../chunks/css.js";
+const m = X, Y = (p) => {
   const e = p?.type;
   return e === "knowledge-graph" || e === "map-image" || e === "tile";
-}, Y = (p) => p?.type === "catalog", T = "nested", Z = y.ofType(x), ee = H(k);
-class te extends N {
+}, Z = (p) => p?.type === "catalog", E = "nested", ee = u.ofType(x), te = V(k);
+class se extends D {
   constructor() {
-    super(...arguments), this._rootGroupUid = `operational-${G()}`, this._openedLayersController = null, this._rootListRef = D(), this._destroying = !1, this._destroyed = !1, this.messages = U(), this._clearActiveItem = () => {
+    super(...arguments), this.#l = `operational-${G()}`, this.#e = null, this.#o = H(), this.#i = !1, this.#t = !1, this.messages = U(), this.#r = () => {
       this._activeItem = null;
-    }, this._setActiveItem = (e) => {
+    }, this.#n = (e) => {
       if (this.visibilityAppearance !== "default")
         return;
       const t = Array.from(e.composedPath()).find((s) => s.classList?.contains(m.item));
-      this._activeItem = M(t);
-    }, this._tooltipReferenceMap = $(), this._layerListMap = $(), this._setPanelFlowItemRef = (e) => {
-      e && this._focusPanelFlowItemNode(e);
-    }, this._setRootFlowItemRef = (e) => {
-      e && this._focusRootFlowItemNode(e);
-    }, this._setLayerFlowItemRef = (e) => {
-      e && this._focusLayerFlowItemNode(e);
-    }, this.viewModel = ee(this), this._activeItem = null, this._focusRootFlowItem = !1, this._focusPanelFlowItem = !1, this._focusLayerFlowItem = null, this.layerTablesEnabled = new y(["knowledge-graph"]), this.mapImageOptions = null, this.tileOptions = null, this.view = this.viewModel.view, this.hideCatalogLayerList = !1, this.showCloseButton = !1, this.showCollapseButton = !1, this.showErrors = !1, this.showFilter = !1, this.showHeading = !1, this.hideStatusIndicators = !1, this.showTemporaryLayerIndicators = !1, this.closed = !1, this.topLayerDisabled = !1, this.autoDestroyDisabled = !1, this.state = this.viewModel.state, this.openedLayers = new y(), this.openedLayerLists = new y(), this.collapsed = !1, this.filterPlaceholder = "", this.filterText = "", this.headingLevel = 2, this.listItemCreatedFunction = this.viewModel.listItemCreatedFunction, this.minFilterItems = V, this.selectedItems = new Z(), this.selectionMode = "none", this.visibilityAppearance = "default", this.arcgisPropertyChange = B()("state"), this.arcgisReady = h(), this.arcgisCatalogItemsChange = h(), this.arcgisFilterChange = h(), this.arcgisSelectedItemsChange = h(), this.arcgisOpenedLayersChange = h();
+      this._activeItem = T(t);
+    }, this.#a = F(), this.#s = F(), this.#c = (e) => {
+      e && this.#b(e);
+    }, this.#h = (e) => {
+      e && this.#L(e);
+    }, this.#d = (e) => {
+      e && this.#v(e);
+    }, this.viewModel = te(this), this._activeItem = null, this._focusRootFlowItem = !1, this._focusPanelFlowItem = !1, this._focusLayerFlowItem = null, this.layerTablesEnabled = new u(["knowledge-graph"]), this.mapImageOptions = null, this.tileOptions = null, this.view = this.viewModel.view, this.hideCatalogLayerList = !1, this.showCloseButton = !1, this.showCollapseButton = !1, this.showErrors = !1, this.showFilter = !1, this.showHeading = !1, this.hideStatusIndicators = !1, this.showTemporaryLayerIndicators = !1, this.closed = !1, this.topLayerDisabled = !1, this.autoDestroyDisabled = !1, this.state = this.viewModel.state, this.openedLayers = new u(), this.openedLayerLists = new u(), this.collapsed = !1, this.filterPlaceholder = "", this.filterText = "", this.headingLevel = 2, this.listItemCreatedFunction = this.viewModel.listItemCreatedFunction, this.minFilterItems = j, this.selectedItems = new ee(), this.selectionMode = "none", this.visibilityAppearance = "default", this.arcgisPropertyChange = B()("state"), this.arcgisReady = d(), this.arcgisCatalogItemsChange = d(), this.arcgisFilterChange = d(), this.arcgisSelectedItemsChange = d(), this.arcgisOpenedLayersChange = d(), this.arcgisTriggerAction = N(() => this.viewModel, "trigger-action");
   }
   static {
     this.properties = { _catalogLayerList: 16, _activeItem: 16, _focusRootFlowItem: 16, _focusPanelFlowItem: 16, _focusLayerFlowItem: 16, _totalItems: 16, _filterEnabled: 16, _visibleItems: 16, _openedPanelItems: 16, _renderedOpenLayerFlowItems: 16, layerTablesEnabled: 16, mapImageOptions: 16, tileOptions: 16, view: 0, hideCatalogLayerList: 5, showCloseButton: 5, showCollapseButton: 5, showErrors: 5, showFilter: 5, showHeading: 5, hideStatusIndicators: 5, showTemporaryLayerIndicators: 5, closed: 5, topLayerDisabled: 5, autoDestroyDisabled: 5, referenceElement: 1, state: 32, openedLayers: 32, openedLayerLists: 32, catalogItems: 0, catalogLayer: 0, catalogOptions: 0, collapsed: 5, filterPlaceholder: 1, filterPredicate: 0, filterText: 1, headingLevel: 9, knowledgeGraphOptions: 0, label: 1, listItemCreatedFunction: 0, minFilterItems: 9, selectedItems: 0, selectionMode: 1, visibilityAppearance: 1, messageOverrides: 0, onCatalogOpen: 0, onTablesOpen: 0 };
   }
   static {
-    this.styles = [K, Q];
-  }
+    this.styles = [Q, W];
+  }
+  #l;
+  #e;
+  #o;
+  #i;
+  #t;
+  #r;
+  #n;
+  #a;
+  #s;
+  #c;
+  #h;
+  #d;
   get _totalItems() {
     return this.catalogItems?.flatten((e) => e.children.filter((t) => t.layer?.type !== "catalog-dynamic-group")).length ?? 0;
   }
@@ -62,7 +75,7 @@ class te extends N {
   }
   get _renderedOpenLayerFlowItems() {
     const { openedLayers: e } = this;
-    return e.toArray().map((t, s) => this._renderLayerFlowItem(t, s === e.length - 1));
+    return e.toArray().map((t, s) => this.#k(t, s === e.length - 1));
   }
   get catalogItems() {
     return this.viewModel.catalogItems;
@@ -77,68 +90,66 @@ class te extends N {
     this.viewModel.catalogLayer = e;
   }
   async destroy() {
-    this._destroying || this._destroyed || (this._destroying = !0, this._openedLayersController?.abort(), this._openedLayersController = null, await this.manager.destroy(), this.openedLayerLists.removeAll(), this.openedLayers.removeAll(), this._layerListMap.clear(), this._tooltipReferenceMap.clear(), this._destroyed = !0, this._destroying = !1);
+    this.#i || this.#t || (this.#i = !0, this.#e?.abort(), this.#e = null, await this.manager.destroy(), this.openedLayerLists.removeAll(), this.openedLayers.removeAll(), this.#s.clear(), this.#a.clear(), this.#t = !0, this.#i = !1);
   }
   loaded() {
     this.manager.onLifecycle(() => [
       L(() => this.openedLayers, "change", () => {
-        this._handleOpenedLayersChange();
+        this.#w();
       }),
       L(() => this.viewModel.catalogItems, "change", () => {
-        j(this.selectedItems), this.arcgisCatalogItemsChange.emit();
+        q(this.selectedItems), this.arcgisCatalogItemsChange.emit();
       }),
       L(() => this.selectedItems, "change", () => this.arcgisSelectedItemsChange.emit()),
-      E(() => [this.filterPredicate, this._rootListRef.value], () => q(this._rootListRef.value, this.filterPredicate))
+      R(() => [this.filterPredicate, this.#o.value], () => z(this.#o.value, this.filterPredicate))
     ]);
   }
   disconnectedCallback() {
-    super.disconnectedCallback(), this._openedLayersController?.abort(), this._openedLayersController = null, !this.autoDestroyDisabled && !this._destroyed && !this._destroying && this.destroy();
-  }
-  loadDependencies() {
+    super.disconnectedCallback(), this.#e?.abort(), this.#e = null, !this.autoDestroyDisabled && !this.#t && !this.#i && this.destroy();
   }
-  triggerAction(e, t) {
+  #u(e, t) {
     return this.viewModel.triggerAction(e, t);
   }
-  async _createFlowList(e, t) {
-    const { _layerListMap: s } = this, i = s.get(e);
-    if (i)
-      return i;
-    const o = e.type === "catalog" ? await this._createCatalogLayerList(e) : await this._createTableList(e);
-    return t.aborted || !this.isConnected || this._destroyed ? (o?.destroy?.(), o) : (t.aborted || s.set(e, o), o);
+  async #y(e, t) {
+    const s = this.#s.get(e);
+    if (s)
+      return s;
+    const a = e.type === "catalog" ? await this.#$(e) : await this.#F(e);
+    return t.aborted || !this.isConnected || this.#t ? (a?.destroy?.(), a) : (t.aborted || this.#s.set(e, a), a);
   }
-  async _handleOpenedLayersChange() {
-    if (!this.isConnected || this._destroyed)
+  async #w() {
+    if (!this.isConnected || this.#t)
       return;
-    const { _layerListMap: e, openedLayers: t, openedLayerLists: s } = this;
-    this._openedLayersController?.abort();
-    const i = new AbortController(), { signal: o } = i;
-    this._openedLayersController = i, e.forEach((c, d) => {
-      t.includes(d) || (c?.destroy?.(), e.delete(d));
+    const { openedLayers: e, openedLayerLists: t } = this;
+    this.#e?.abort();
+    const s = new AbortController(), { signal: a } = s;
+    this.#e = s, this.#s.forEach((r, c) => {
+      e.includes(c) || (r?.destroy?.(), this.#s.delete(c));
     });
-    const a = await Promise.all(t.map((c) => this._createFlowList(c, o)));
-    if (o.aborted || !this.isConnected || this._destroyed)
+    const o = await Promise.all(e.map((r) => this.#y(r, a)));
+    if (a.aborted || !this.isConnected || this.#t)
       return;
-    s.removeAll(), s.addMany(a);
-    const l = s.at(-1), n = l && "catalogLayer" in l ? l : void 0;
-    this._catalogLayerList !== n && (this._catalogLayerList = n), this.arcgisOpenedLayersChange.emit();
+    t.removeAll(), t.addMany(o);
+    const i = t.at(-1), l = i && "catalogLayer" in i ? i : void 0;
+    this._catalogLayerList !== l && (this._catalogLayerList = l), this.arcgisOpenedLayersChange.emit();
   }
-  _handlePanelFlowItemBack(e) {
+  #I(e) {
     e.open = !1, this._focusRootFlowItem = !0;
   }
-  _focusRootFlowItemNode(e) {
+  #L(e) {
     this._focusRootFlowItem && (this._focusRootFlowItem = !1, v(e));
   }
-  _focusPanelFlowItemNode(e) {
+  #b(e) {
     this._focusPanelFlowItem && (this._focusPanelFlowItem = !1, v(e));
   }
-  _focusLayerFlowItemNode(e) {
+  #v(e) {
     this._focusLayerFlowItem === e.dataset.layerUid && (this._focusLayerFlowItem = null, v(e));
   }
-  async _createCatalogLayerList(e) {
-    const { headingLevel: t, catalogOptions: s, view: i, referenceElement: o, filterPlaceholder: a, listItemCreatedFunction: l, minFilterItems: n, selectionMode: c, visibilityAppearance: d } = this;
-    return C(r`<arcgis-catalog-layer-list-next .headingLevel=${t} .filterPlaceholder=${s?.filterPlaceholder ?? a} .listItemCreatedFunction=${s?.listItemCreatedFunction ?? l} .minFilterItems=${s?.minFilterItems ?? n} .selectionMode=${s?.selectionMode ?? c} .visibilityAppearance=${s?.visibilityAppearance ?? d} .showErrors=${s?.visibleElements?.errors ?? this.showErrors} .showFilter=${s?.visibleElements?.filter ?? this.showFilter} .hideStatusIndicators=${s?.visibleElements?.statusIndicators ?? this.hideStatusIndicators} .showTemporaryLayerIndicators=${s?.visibleElements?.temporaryLayerIndicators ?? this.showTemporaryLayerIndicators} .messageOverrides=${this.messageOverrides} @arcgisReady=${(u) => u.stopPropagation()} .catalogLayer=${e} .view=${i} .referenceElement=${o} @catalogOpen=${this._onCatalogOpen} @tablesOpen=${this._onTablesOpen}></arcgis-catalog-layer-list-next>`);
+  async #$(e) {
+    const { headingLevel: t, catalogOptions: s, view: a, referenceElement: o, filterPlaceholder: i, listItemCreatedFunction: l, minFilterItems: r, selectionMode: c, visibilityAppearance: h } = this;
+    return _(n`<arcgis-catalog-layer-list-next .headingLevel=${t} .filterPlaceholder=${s?.filterPlaceholder ?? i} .listItemCreatedFunction=${s?.listItemCreatedFunction ?? l} .minFilterItems=${s?.minFilterItems ?? r} .selectionMode=${s?.selectionMode ?? c} .visibilityAppearance=${s?.visibilityAppearance ?? h} .showErrors=${s?.visibleElements?.errors ?? this.showErrors} .showFilter=${s?.visibleElements?.filter ?? this.showFilter} .hideStatusIndicators=${s?.visibleElements?.statusIndicators ?? this.hideStatusIndicators} .showTemporaryLayerIndicators=${s?.visibleElements?.temporaryLayerIndicators ?? this.showTemporaryLayerIndicators} .messageOverrides=${this.messageOverrides} @arcgisReady=${(y) => y.stopPropagation()} .catalogLayer=${e} .view=${a} .referenceElement=${o} @catalogOpen=${this.#p} @tablesOpen=${this.#m}></arcgis-catalog-layer-list-next>`);
   }
-  _getTableListParams(e) {
+  #C(e) {
     switch (e.type) {
       case "knowledge-graph":
         return { ...this.knowledgeGraphOptions, tables: e.tables };
@@ -156,95 +167,95 @@ class te extends N {
         return null;
     }
   }
-  async _createTableList(e) {
-    const { headingLevel: t, selectionMode: s, referenceElement: i, view: o } = this, a = this._getTableListParams(e);
-    return C(r`<arcgis-table-list .headingLevel=${a?.headingLevel ?? t} .selectionMode=${a?.selectionMode ?? s} .collapsed=${a?.collapsed} .filterPlaceholder=${a?.filterPlaceholder} .filterText=${a?.filterText} .label=${a?.label} .tables=${a?.tables} .view=${o} .referenceElement=${i} @arcgisReady=${(l) => l.stopPropagation()}></arcgis-table-list>`);
+  async #F(e) {
+    const { headingLevel: t, selectionMode: s, referenceElement: a, view: o } = this, i = this.#C(e);
+    return _(n`<arcgis-table-list .headingLevel=${i?.headingLevel ?? t} .selectionMode=${i?.selectionMode ?? s} .collapsed=${i?.collapsed} .filterPlaceholder=${i?.filterPlaceholder} .filterText=${i?.filterText} .label=${i?.label} .tables=${i?.tables} .view=${o} .referenceElement=${a} @arcgisReady=${(l) => l.stopPropagation()}></arcgis-table-list>`);
   }
-  _onTablesOpen(e) {
+  #m(e) {
     if (this.onTablesOpen) {
       this.onTablesOpen(e);
       return;
     }
     const t = e.layer;
-    X(t) && (this.openedLayers.push(t), this._focusLayerFlowItem = t.uid);
+    Y(t) && (this.openedLayers.push(t), this._focusLayerFlowItem = t.uid);
   }
-  _onCatalogOpen(e) {
+  #p(e) {
     if (this.onCatalogOpen) {
       this.onCatalogOpen(e);
       return;
     }
     const t = e.layer?.parent;
-    Y(t) && (this.openedLayers.push(t), this._focusLayerFlowItem = e.layer?.uid);
+    Z(t) && (this.openedLayers.push(t), this._focusLayerFlowItem = e.layer?.uid);
   }
-  _onTooltipReferenceChange(e, t) {
-    t ? this._tooltipReferenceMap.set(e, t) : this._tooltipReferenceMap.delete(e);
+  #_(e, t) {
+    t ? this.#a.set(e, t) : this.#a.delete(e);
   }
-  _onTriggerAction(e, t) {
-    this.triggerAction(e, t);
+  #M(e, t) {
+    this.#u(e, t);
   }
-  _handleCalciteListChange(e) {
+  #T(e) {
     const { selectionMode: t, selectedItems: s } = this;
     if (t === "none")
       return;
-    const i = e.target.selectedItems.map((o) => M(o)).filter(Boolean);
-    s.removeAll(), s.addMany(i);
+    const a = e.target.selectedItems.map((o) => T(o)).filter(Boolean);
+    s.removeAll(), s.addMany(a);
   }
   render() {
     const { state: e } = this, t = {
       [f.hidden]: e === "loading",
       [f.disabled]: e === "disabled"
     };
-    return r`<div class=${w(S(f.widget, f.panel, t))}>${this._visibleItems?.length ? this._renderItemTooltips() : null}${this._renderItems()}</div>`;
+    return n`<div class=${b(S(f.widget, f.panel, t))}>${this._visibleItems?.length ? this.#P() : null}${this.#R()}</div>`;
   }
-  _renderItemTooltip(e) {
-    const { _tooltipReferenceMap: t, messages: s } = this;
-    return e?.layer ? r`<calcite-tooltip overlay-positioning=fixed .referenceElement=${t.get(e.layer.uid)} .topLayerDisabled=${this.topLayerDisabled}>${s.layerIncompatibleTooltip}</calcite-tooltip>` : null;
+  #E(e) {
+    const t = this.#a, s = this.messages;
+    return e?.layer ? n`<calcite-tooltip overlay-positioning=fixed .referenceElement=${t.get(e.layer.uid)} .topLayerDisabled=${this.topLayerDisabled}>${s.layerIncompatibleTooltip}</calcite-tooltip>` : null;
   }
-  _renderItemTooltipNodes(e) {
-    return e.incompatible ? this._renderItemTooltip(e) : e.children?.filter((t) => !t.hidden).toArray().map((t) => this._renderItemTooltipNodes(t));
+  #g(e) {
+    return e.incompatible ? this.#E(e) : e.children?.filter((t) => !t.hidden).toArray().map((t) => this.#g(t));
   }
-  _renderItemTooltips() {
-    return this._visibleItems?.toArray().map((e) => this._renderItemTooltipNodes(e));
+  #P() {
+    return this._visibleItems?.toArray().map((e) => this.#g(e));
   }
-  _renderNoItemsMessage() {
-    return r`<div slot=message>${this.messages.noItemsToDisplay}</div>`;
+  #f() {
+    return n`<div slot=message>${this.messages.noItemsToDisplay}</div>`;
   }
-  _renderNoItems() {
-    return r`<div class=${w(m.itemMessage)}><calcite-notice icon=information kind=info open width=full>${this._renderNoItemsMessage()}</calcite-notice></div>`;
+  #O() {
+    return n`<div class=${b(m.itemMessage)}><calcite-notice icon=information kind=info open width=full>${this.#f()}</calcite-notice></div>`;
   }
-  _renderPanelFlowItems() {
+  #A() {
     const { _openedPanelItems: e, openedLayers: t } = this;
-    return R(e.toArray(), ({ uid: s }) => s, (s, i) => {
-      const { uid: o, title: a, panel: l } = s, n = () => this._handlePanelFlowItemBack(l);
-      return r`<calcite-flow-item .description=${a} .heading=${l.title} .headingLevel=${this.headingLevel} .selected=${!t.length && i === e.length - 1} @calciteFlowItemBack=${(c) => {
-        c.preventDefault(), n();
-      }} ${g(this._setPanelFlowItemRef)}><arcgis-layer-list-item-panel .item=${s} .view=${this.view}></arcgis-layer-list-item-panel><calcite-button appearance=transparent slot=footer-actions width=full @click=${n}>Back</calcite-button></calcite-flow-item>`;
+    return A(e.toArray(), ({ uid: s }) => s, (s, a) => {
+      const { uid: o, title: i, panel: l } = s, r = () => this.#I(l);
+      return n`<calcite-flow-item .description=${i} .heading=${l.title} .headingLevel=${this.headingLevel} .selected=${!t.length && a === e.length - 1} @calciteFlowItemBack=${(c) => {
+        c.preventDefault(), r();
+      }} ${g(this.#c)}><arcgis-layer-list-item-panel .item=${s} .view=${this.view}></arcgis-layer-list-item-panel><calcite-button appearance=transparent slot=footer-actions width=full @click=${r}>Back</calcite-button></calcite-flow-item>`;
     });
   }
-  _renderItems() {
-    const { collapsed: e, _visibleItems: t, _filterEnabled: s, _rootGroupUid: i, showCloseButton: o, showCollapseButton: a, showHeading: l, selectionMode: n, filterText: c, filterPlaceholder: d, openedLayers: u, _openedPanelItems: P } = this, b = this.label ?? this.messages.componentLabel ?? "", O = [
-      r`<calcite-flow-item .closable=${o} .closed=${this.closed} .collapsed=${e} .collapsible=${a} .heading=${l ? b : void 0} .headingLevel=${this.headingLevel} .selected=${!u.length && !P.length} @calciteFlowItemClose=${() => this.closed = !0} ${g(this._setRootFlowItemRef)}>${t?.length ? r`<calcite-list data-layer-type=${i ?? F} .displayMode=${T} .filterEnabled=${s} .filterPlaceholder=${d} .filterProps=${z} .filterText=${s ? c : ""} .group=${i} .label=${b} @focusin=${this._setActiveItem} @focusout=${this._clearActiveItem} selection-appearance=border .selectionMode=${n} @calciteListChange=${this._handleCalciteListChange} @calciteListFilter=${(_) => {
-        this.filterText = _.currentTarget?.filterText ?? "", this.arcgisFilterChange.emit();
-      }} @mouseleave=${this._clearActiveItem} @mouseover=${this._setActiveItem} ${g(this._rootListRef)}>${t.toArray().map((_) => this._renderItem(_))}${s ? r`<div class=${w(m.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(),
+  #R() {
+    const { collapsed: e, _visibleItems: t, _filterEnabled: s, showCloseButton: a, showCollapseButton: o, showHeading: i, selectionMode: l, filterText: r, filterPlaceholder: c, openedLayers: h, _openedPanelItems: y } = this, $ = this.#l, C = this.label ?? this.messages.componentLabel ?? "", P = [
+      n`<calcite-flow-item .closable=${a} .closed=${this.closed} .collapsed=${e} .collapsible=${o} .heading=${i ? C : void 0} .headingLevel=${this.headingLevel} .selected=${!h.length && !y.length} @calciteFlowItemClose=${() => this.closed = !0} ${g(this.#h)}>${t?.length ? n`<calcite-list data-layer-type=${$ ?? M} .displayMode=${E} .filterEnabled=${s} .filterPlaceholder=${c} .filterProps=${J} .filterText=${s ? r : ""} .group=${$} .label=${C} @focusin=${this.#n} @focusout=${this.#r} selection-appearance=border .selectionMode=${l} @calciteListChange=${this.#T} @calciteListFilter=${(w) => {
+        this.filterText = w.currentTarget?.filterText ?? "", this.arcgisFilterChange.emit();
+      }} @mouseleave=${this.#r} @mouseover=${this.#n} ${g(this.#o)}>${t.toArray().map((w) => this.#x(w))}${s ? n`<div class=${b(m.filterNoResults)} slot=filter-no-results><calcite-notice kind=info open width=full>${this.#f()}</calcite-notice></div>` : null}</calcite-list>` : this.#O()}</calcite-flow-item>`,
+      this.#A(),
       this._renderedOpenLayerFlowItems
     ];
-    return this.closed ? null : I("root-flow", r`<calcite-flow>${O}</calcite-flow>`);
+    return this.closed ? null : I("root-flow", n`<calcite-flow>${P}</calcite-flow>`);
   }
-  _renderLayerFlowItem(e, t) {
-    const { messages: s, openedLayers: i } = this, o = e.title || this.messages.untitledLayer;
-    return I(e.uid, r`<calcite-flow-item data-layer-uid=${e.uid ?? F} .description=${o} .heading=${s[e.type === "catalog" ? "catalogLayers" : "tables"]} .headingLevel=${this.headingLevel} .selected=${t} @calciteFlowItemBack=${(a) => {
-      a.preventDefault(), i.pop();
-      const l = i.at(-1);
-      l ? this._focusLayerFlowItem = l.uid : this._focusRootFlowItem = !0;
-    }} ${g(this._setLayerFlowItemRef)}>${this._layerListMap.get(e)}</calcite-flow-item>`);
+  #k(e, t) {
+    const { openedLayers: s } = this, a = e.title || this.messages.untitledLayer;
+    return I(e.uid, n`<calcite-flow-item data-layer-uid=${e.uid ?? M} .description=${a} .heading=${this.messages[e.type === "catalog" ? "catalogLayers" : "tables"]} .headingLevel=${this.headingLevel} .selected=${t} @calciteFlowItemBack=${(o) => {
+      o.preventDefault(), s.pop();
+      const i = s.at(-1);
+      i ? this._focusLayerFlowItem = i.uid : this._focusRootFlowItem = !0;
+    }} ${g(this.#d)}>${this.#s.get(e)}</calcite-flow-item>`);
   }
-  _renderItem(e, t, s) {
-    const { hideStatusIndicators: i, showCloseButton: o, showCollapseButton: a, showErrors: l, showFilter: n, showHeading: c, showTemporaryLayerIndicators: d } = this;
-    return I(e.uid, J({ activeItem: this._activeItem ?? void 0, css: { ...m, itemCatalogIcon: m.itemActionIcon }, displayMode: T, dragEnabled: !1, item: e, layerTablesEnabled: this.layerTablesEnabled, listModeDisabled: this.viewModel.listModeDisabled, messages: this.messages, parent: t, parentTitles: s, rootGroupUid: this._rootGroupUid, selectedItems: this.selectedItems, selectionMode: this.selectionMode, visibilityAppearance: this.visibilityAppearance, hideStatusIndicators: i, showCloseButton: o, showCollapseButton: a, showErrors: l, showFilter: n, showHeading: c, showTemporaryLayerIndicators: d, handleAction: this._onTriggerAction, handleCatalogOpen: this._onCatalogOpen, handleTablesOpen: this._onTablesOpen, handleTooltipReferenceChange: this._onTooltipReferenceChange, view: this.view }));
+  #x(e, t, s) {
+    const { hideStatusIndicators: a, showCloseButton: o, showCollapseButton: i, showErrors: l, showFilter: r, showHeading: c, showTemporaryLayerIndicators: h } = this;
+    return I(e.uid, K({ activeItem: this._activeItem ?? void 0, css: { ...m, itemCatalogIcon: m.itemActionIcon }, displayMode: E, dragEnabled: !1, item: e, layerTablesEnabled: this.layerTablesEnabled, listModeDisabled: this.viewModel.listModeDisabled, messages: this.messages, parent: t, parentTitles: s, rootGroupUid: this.#l, selectedItems: this.selectedItems, selectionMode: this.selectionMode, visibilityAppearance: this.visibilityAppearance, hideStatusIndicators: a, showCloseButton: o, showCollapseButton: i, showErrors: l, showFilter: r, showHeading: c, showTemporaryLayerIndicators: h, handleAction: this.#M.bind(this), handleCatalogOpen: this.#p.bind(this), handleTablesOpen: this.#m.bind(this), handleTooltipReferenceChange: this.#_.bind(this), view: this.view }));
   }
 }
-A("arcgis-catalog-layer-list-next", te);
+O("arcgis-catalog-layer-list-next", se);
 export {
-  te as ArcgisCatalogLayerListNext
+  se as ArcgisCatalogLayerListNext
 };

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

@@ -44,8 +44,8 @@ export abstract class ArcgisClipboard extends LitElement {
    */
   accessor referenceElement: ArcgisReferenceElement | string | undefined;
   /**
-   * The view associated with the component. 
-   *   > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-clipboard component will be associated with a map or scene component rather than using the `view` property.
+   * The view associated with the component.
+   * > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-clipboard component will be associated with a map or scene component rather than using the `view` property.
    */
   accessor view: MapView | SceneView | undefined;
   /** Emitted when the component associated with a map or scene view is ready to be interacted with. */

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

@@ -81,8 +81,8 @@ export abstract class ArcgisCompass extends LitElement {
    */
   get state(): CompassState;
   /**
-   * The view associated with the component. 
-   *   > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-compass component will be associated with a map or scene component rather than using the `view` property.
+   * The view associated with the component.
+   * > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-compass component will be associated with a map or scene component rather than using the `view` property.
    */
   accessor view: MapView | SceneView | undefined;
   /**

package/dist/components/arcgis-coordinate-conversion/customElement.d.ts

@@ -362,8 +362,8 @@ export abstract class ArcgisCoordinateConversion extends LitElement {
    */
   accessor storageType: StorageType;
   /**
-   * The view associated with the component. 
-   *   > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-coordinate-conversion component will be associated with a map or scene component rather than using the `view` property.
+   * The view associated with the component.
+   * > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-coordinate-conversion component will be associated with a map or scene component rather than using the `view` property.
    */
   accessor view: MapViewOrSceneView | null | undefined;
   /** Permanently destroy the component. */

package/dist/components/arcgis-coordinate-conversion-next/customElement.d.ts

@@ -386,8 +386,8 @@ export abstract class ArcgisCoordinateConversionNext extends LitElement {
    */
   accessor verticalUnit: LengthUnit;
   /**
-   * The view associated with the component. 
-   *   > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-coordinate-conversion-next component will be associated with a map or scene component rather than using the `view` property.
+   * The view associated with the component.
+   * > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-coordinate-conversion-next component will be associated with a map or scene component rather than using the `view` property.
    */
   accessor view: MapViewOrSceneView | null | undefined;
   /**

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

@@ -290,8 +290,8 @@ export abstract class ArcgisDaylight extends LitElement {
    */
   accessor utcOffset: number | null | undefined;
   /**
-   * The view associated with the component. 
-   *   > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-daylight component will be associated with a map or scene component rather than using the `view` property.
+   * The view associated with the component.
+   * > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-daylight component will be associated with a map or scene component rather than using the `view` property.
    */
   accessor view: SceneView | undefined;
   /**

package/dist/components/arcgis-direct-line-measurement-3d/customElement.d.ts

@@ -218,8 +218,8 @@ export abstract class ArcgisDirectLineMeasurement3d extends LitElement {
    */
   accessor unitOptions: Array<SystemOrLengthUnit>;
   /**
-   * The view associated with the component. 
-   *   > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-direct-line-measurement-3d component will be associated with a map or scene component rather than using the `view` property.
+   * The view associated with the component.
+   * > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-direct-line-measurement-3d component will be associated with a map or scene component rather than using the `view` property.
    */
   accessor view: SceneView | undefined;
   /** Clears the current measurement. */

package/dist/components/arcgis-directional-pad/customElement.d.ts

@@ -121,8 +121,8 @@ export abstract class ArcgisDirectionalPad extends LitElement {
   /** The current state of the component. */
   get state(): DirectionalPadViewModelState;
   /**
-   * The view associated with the component. 
-   *   > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-directional-pad component will be associated with a map or scene component rather than using the `view` property.
+   * The view associated with the component.
+   * > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-directional-pad component will be associated with a map or scene component rather than using the `view` property.
    */
   accessor view: MapView | null | undefined;
   /**

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

@@ -234,8 +234,8 @@ export abstract class ArcgisDirections extends LitElement {
    */
   accessor useDefaultRouteLayer: boolean;
   /**
-   * The view associated with the component. 
-   *   > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-directions component will be associated with a map or scene component rather than using the `view` property.
+   * The view associated with the component.
+   * > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-directions component will be associated with a map or scene component rather than using the `view` property.
    */
   accessor view: MapViewOrSceneView | null | undefined;
   /** Permanently destroy the component. */

package/dist/components/arcgis-distance-measurement-2d/customElement.d.ts

@@ -189,8 +189,8 @@ export abstract class ArcgisDistanceMeasurement2d extends LitElement {
    */
   accessor unitOptions: Array<SystemOrLengthUnit>;
   /**
-   * The view associated with the component. 
-   *   > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-distance-measurement-2d component will be associated with a map or scene component rather than using the `view` property.
+   * The view associated with the component.
+   * > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-distance-measurement-2d component will be associated with a map or scene component rather than using the `view` property.
    */
   accessor view: MapView | undefined;
   /** Clears the current measurement. */

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

@@ -94,7 +94,7 @@ export abstract class ArcgisEditor extends LitElement {
    *
    * @default false
    * @internal
-   * @sine 5.1
+   * @since 5.1
    */
   accessor hideSelectionToolbar: boolean;
   /**
@@ -398,8 +398,8 @@ export abstract class ArcgisEditor extends LitElement {
    */
   accessor useLegacyCreateTools: boolean;
   /**
-   * The view associated with the component. 
-   *   > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-editor component will be associated with a map or scene component rather than using the `view` property.
+   * The view associated with the component.
+   * > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-editor component will be associated with a map or scene component rather than using the `view` property.
    */
   accessor view: MapViewOrSceneView | null | undefined;
   /**

package/dist/components/arcgis-elevation-profile/customElement.d.ts

@@ -499,8 +499,8 @@ export abstract class ArcgisElevationProfile extends LitElement {
    */
   accessor uniformChartScaling: boolean;
   /**
-   * The view associated with the component. 
-   *   > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-elevation-profile component will be associated with a map or scene component rather than using the `view` property.
+   * The view associated with the component.
+   * > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-elevation-profile component will be associated with a map or scene component rather than using the `view` property.
    */
   accessor view: MapView | SceneView | undefined;
   /**