@arcgis/map-components 5.2.0-next.127 → 5.2.0-next.129

package/dist/chunks/feature-utils.js

@@ -1,212 +1,226 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
 import { replace as a } from "@arcgis/core/applications/Components/stringUtils.js";
-import { fieldFormatFromFieldInfo as p } from "@arcgis/core/applications/Components/fieldFormatUtils.js";
-import { g as F } from "./layer-utils.js";
-import { log as g } from "@arcgis/toolkit/log";
-const u = /^\s*expression\//iu, C = /href=(""|'')/giu, y = /(\{([^{\r\n]+)\})/gu, L = /href\s*=\s*(?:"([^"]+)"|'([^']+)')/giu, h = /'/gu, N = "relationships/", b = /^(?:mailto:|tel:)/u;
-function $(e, t) {
-  const n = /* @__PURE__ */ new Map();
+import { fieldFormatFromFieldInfo as m } from "@arcgis/core/applications/Components/fieldFormatUtils.js";
+import { g } from "./layer-utils.js";
+import { log as F } from "@arcgis/toolkit/log";
+const u = /^\s*expression\//iu, y = /href=(""|'')/giu, C = /(\{([^{\r\n]+)\})/gu, h = /href\s*=\s*(?:"([^"]+)"|'([^']+)')/giu, L = /'/gu, N = "relationships/", b = /^(?:mailto:|tel:)/u;
+function j(e, n) {
+  const t = /* @__PURE__ */ new Map();
   if (!e)
-    return n;
+    return t;
   for (const r of e) {
     if (!r.fieldName)
       continue;
-    const i = f(r.fieldName, t);
-    r.fieldName = i, n.set(i.toLowerCase(), r);
+    const i = f(r.fieldName, n);
+    r.fieldName = i, t.set(i.toLowerCase(), r);
   }
-  return n;
+  return t;
 }
-function j(e) {
-  const t = [];
+function U(e) {
+  const n = [];
   if (!e)
-    return t;
-  const { fieldInfos: n, content: r } = e;
-  return n && t.push(...n), !r || !Array.isArray(r) || r.forEach((i) => {
+    return n;
+  const { fieldInfos: t, content: r } = e;
+  return t && n.push(...t), !r || !Array.isArray(r) || r.forEach((i) => {
     if (i.type === "fields") {
       const o = i?.fieldInfos;
-      o && t.push(...o);
+      o && n.push(...o);
     }
-  }), t;
+  }), n;
 }
-function U(e, t) {
-  return e?.getEffectivePopupTemplate(t) ?? void 0;
+function W(e, n) {
+  return e?.getEffectivePopupTemplate(n) ?? void 0;
 }
-function W(e) {
+function q(e) {
   if (e != null)
     return "sourceLayer" in e && e.sourceLayer ? e.sourceLayer : e.layer ?? void 0;
 }
-function w(e = "") {
+const w = /* @__PURE__ */ new Set([
+  "building",
+  "knowledge-graph",
+  "link-chart",
+  "map-image",
+  "map-notes",
+  "subtype-group",
+  "tile"
+]);
+function _(e) {
+  const n = e?.origin;
+  return (n == null ? void 0 : w.has(n.type ?? "") ? n.sublayer : n.layer) ?? e?.layer;
+}
+function A(e = "") {
   return e ? e.includes(N) : !1;
 }
-function _(e = "") {
+function B(e = "") {
   if (e)
     return !b.test(e.trim().toLowerCase());
 }
-function f(e, t) {
-  const n = m(t, e);
-  return n ? n.name : e;
+function f(e, n) {
+  const t = p(n, e);
+  return t ? t.name : e;
 }
-function q(e, t) {
-  return e?.map((n) => f(n, t));
+function D(e, n) {
+  return e?.map((t) => f(t, n));
 }
 function c(e) {
   return e ? u.test(e) : !1;
 }
-function A(e, t) {
-  if (!t || !c(t) || !e)
+function I(e, n) {
+  if (!n || !c(n) || !e)
     return;
-  const n = t.replace(u, "").toLowerCase();
-  return e.find(({ name: r }) => r.toLowerCase() === n);
+  const t = n.replace(u, "").toLowerCase();
+  return e.find(({ name: r }) => r.toLowerCase() === t);
 }
-function B(e, t) {
-  if (!(!e?.length || !t))
-    return e.find((n) => n.fieldName?.toLowerCase() === t.toLowerCase());
+function G(e, n) {
+  if (!(!e?.length || !n))
+    return e.find((t) => t.fieldName?.toLowerCase() === n.toLowerCase());
 }
-function I(e) {
-  const { fieldInfo: t, graphic: n, layer: r } = e;
-  return x({ fieldInfo: t, graphic: n }) ? F(r, { graphic: n }) : null;
+function T(e) {
+  const { fieldInfo: n, graphic: t, layer: r } = e;
+  return k({ fieldInfo: n, graphic: t }) ? g(r, { graphic: t }) : null;
 }
-function x({ fieldInfo: e, graphic: t }) {
-  return !!e?.fieldName && !c(e.fieldName) && !w(e.fieldName) && !t?.popupTemplate;
+function k({ fieldInfo: e, graphic: n }) {
+  return !!e?.fieldName && !c(e.fieldName) && !A(e.fieldName) && !n?.popupTemplate;
 }
-function D({
+function J({
   expressionInfos: e,
-  fieldInfo: t,
-  graphic: n,
+  fieldInfo: n,
+  graphic: t,
   isContentFieldInfos: r,
   layer: i
 }) {
-  if (!t?.fieldName)
+  if (!n?.fieldName)
     return null;
-  const o = A(e, t?.fieldName);
+  const o = I(e, n?.fieldName);
   if (o)
     return o.title || null;
-  const s = I({ fieldInfo: t, graphic: n, layer: i });
+  const s = T({ fieldInfo: n, graphic: t, layer: i });
   if (s) {
-    const l = s.getFieldAlias(t.fieldName);
-    return r ? t.label || l || t.fieldName : l || t.fieldName;
+    const l = s.getFieldAlias(n.fieldName);
+    return r ? n.label || l || n.fieldName : l || n.fieldName;
   }
-  return t.label || t.fieldName;
+  return n.label || n.fieldName;
 }
-function G(e) {
-  const { configurableFieldsContainer: t, fieldInfo: n, isContentFieldInfos: r } = e;
-  if (!n?.fieldName)
+function K(e) {
+  const { configurableFieldsContainer: n, fieldInfo: t, isContentFieldInfos: r } = e;
+  if (!t?.fieldName)
     return null;
-  const i = !t.popupTemplate && !t.fieldConfigurations ? p(n, t.getField(n.fieldName)) : t.getFieldConfiguration(n.fieldName)?.fieldFormat;
-  return r && n.fieldFormat || i;
+  const i = !n.popupTemplate && !n.fieldConfigurations ? m(t, n.getField(t.fieldName)) : n.getFieldConfiguration(t.fieldName)?.fieldFormat;
+  return r && t.fieldFormat || i;
 }
 function d(e) {
   return e.trim();
 }
-function T(e) {
-  return e.replaceAll(C, "");
+function x(e) {
+  return e.replaceAll(y, "");
 }
-function R(e, t) {
-  return `{${t.get(e.toLowerCase())?.fieldName || e}}`;
+function R(e, n) {
+  return `{${n.get(e.toLowerCase())?.fieldName || e}}`;
 }
-function k({
+function E({
   formattedValues: e,
-  template: t,
-  fieldInfoMap: n
+  template: n,
+  fieldInfoMap: t
 }) {
   return d(
-    T(
+    x(
       a(
-        a(t, (r) => R(r, n)),
+        a(n, (r) => R(r, t)),
         e
       )
     )
   );
 }
-function m(e, t) {
-  return !(e && "getField" in e && typeof e.getField == "function") || !t ? null : e.getField(t) ?? null;
+function p(e, n) {
+  return !(e && "getField" in e && typeof e.getField == "function") || !n ? null : e.getField(n) ?? null;
 }
-function E(e, t) {
-  return e.replaceAll(y, (n, r, i) => {
-    const o = m(t, i);
+function v(e, n) {
+  return e.replaceAll(C, (t, r, i) => {
+    const o = p(n, i);
     return o ? `{${o.name}}` : r;
   });
 }
-function V(e, t, n = !1) {
-  const r = t[e];
+function V(e, n, t = !1) {
+  const r = n[e];
   if (typeof r == "string") {
-    const o = (n ? encodeURIComponent(r) : r).replaceAll(
-      h,
+    const o = (t ? encodeURIComponent(r) : r).replaceAll(
+      L,
       "%27"
     );
-    t[e] = o;
+    n[e] = o;
   }
 }
-function v(e, t = !1) {
-  const n = { ...e };
-  return Object.keys(n).forEach((r) => V(r, n, t)), n;
+function O(e, n = !1) {
+  const t = { ...e };
+  return Object.keys(t).forEach((r) => V(r, t, n)), t;
 }
-function z(e, t, n) {
-  t = d(t);
-  const r = t && !t.startsWith("{");
-  return a(e, v(n, r || !1));
+function P(e, n, t) {
+  n = d(n);
+  const r = n && !n.startsWith("{");
+  return a(e, O(t, r || !1));
 }
-function H(e, t, n) {
-  const r = E(e, n);
+function S(e, n, t) {
+  const r = v(e, t);
   return r && r.replaceAll(
-    L,
-    (i, o, s) => z(i, o || s, t)
+    h,
+    (i, o, s) => P(i, o || s, n)
   );
 }
-function J({
+function Q({
   values: e,
-  globalValues: t,
-  layer: n,
+  globalValues: n,
+  layer: t,
   text: r,
   fieldInfoMap: i
 }) {
-  return r ? k({
-    formattedValues: t,
-    template: H(
+  return r ? E({
+    formattedValues: n,
+    template: S(
       r,
       {
-        ...t,
+        ...n,
         ...e
       },
-      n
+      t
     ),
     fieldInfoMap: i
   }) : "";
 }
-async function K({
+async function X({
   type: e,
-  value: t,
-  event: n
+  value: n,
+  event: t
 }) {
   try {
-    return typeof t == "function" ? t(n) : await t;
+    return typeof n == "function" ? n(t) : await n;
   } catch (r) {
-    g("error", "arcgis-feature", `An error occurred when calling the "${e}" function`, {
+    F("error", "arcgis-feature", `An error occurred when calling the "${e}" function`, {
       detail: {
         error: r,
-        graphic: n.graphic,
-        value: t
+        graphic: t.graphic,
+        value: n
       }
     });
     return;
   }
 }
 export {
-  K as a,
-  J as b,
-  U as c,
-  $ as d,
-  j as e,
-  w as f,
-  W as g,
-  D as h,
+  X as a,
+  Q as b,
+  W as c,
+  j as d,
+  U as e,
+  A as f,
+  _ as g,
+  q as h,
   c as i,
-  I as j,
-  G as k,
-  E as l,
-  k as m,
-  q as n,
-  f as o,
-  B as p,
-  _ as s
+  J as j,
+  T as k,
+  K as l,
+  v as m,
+  E as n,
+  D as o,
+  f as p,
+  G as q,
+  B as s
 };

package/dist/chunks/useArcgisViewReadyError.js

@@ -1,26 +1,27 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
 import { html as b } from "lit";
 import { initializeProjection as w } from "@arcgis/core/applications/Components/featureUtils.js";
-import { when as g, watch as s } from "@arcgis/core/core/reactiveUtils.js";
+import { signal as g } from "@arcgis/core/applications/Components/reactiveUtils.js";
+import { when as v, watch as s } from "@arcgis/core/core/reactiveUtils.js";
 import m from "@arcgis/core/geometry/Point.js";
 import P from "@arcgis/core/Graphic.js";
-import { GenericController as v, useDirection as y, makeController as _, makeGenericController as f } from "@arcgis/lumina/controllers";
-import { getSlotAssignedElements as S } from "@arcgis/toolkit/dom/slots";
-import { whenOrAbort as C } from "@arcgis/toolkit/promise";
-import { createRef as R } from "lit/directives/ref.js";
-import { c as A, S as L } from "./slots.js";
-import { observeAncestorsMutation as F, unsafeGetCalciteModeName as G } from "@arcgis/toolkit/dom";
+import { GenericController as y, useDirection as _, makeController as S, makeGenericController as f } from "@arcgis/lumina/controllers";
+import { getSlotAssignedElements as C } from "@arcgis/toolkit/dom/slots";
+import { whenOrAbort as R } from "@arcgis/toolkit/promise";
+import { createRef as A } from "lit/directives/ref.js";
+import { c as L, S as F } from "./slots.js";
+import { observeAncestorsMutation as G, unsafeGetCalciteModeName as O } from "@arcgis/toolkit/dom";
 import { createEvent as d } from "@arcgis/lumina";
-async function* O(n, o) {
+async function* M(n, o) {
   for (const e of n) {
-    const t = await C(e, o).catch(() => {
+    const t = await R(e, o).catch(() => {
     });
     if (o.aborted)
       return;
     yield* Array.isArray(t) ? t.filter((i) => i instanceof P) : [];
   }
 }
-async function* M(n, o, e, t) {
+async function* V(n, o, e, t) {
   let i;
   e instanceof m ? (await w(e.spatialReference, n.spatialReference), i = n.toScreen(e)) : i = e;
   const p = i ? n.fetchPopupFeatures(i, {
@@ -35,22 +36,22 @@ function u(n, o) {
   const e = "width" in o ? { x: o.x + o.width / 2, y: o.y + o.height / 2 } : o;
   return n.toMap(e) ?? void 0;
 }
-function V(n, o, e, t) {
+function D(n, o, e, t) {
   const i = {};
   return {
     diagnostics: i,
-    featureStream: M(n, o, e, {
+    featureStream: V(n, o, e, {
       diagnostics: i,
       signal: t
     }),
     location: u(n, e)
   };
 }
-class B extends v {
+class J extends y {
   //#endregion
   //#region Lifecycle
   constructor(o) {
-    super(o), this.direction = y(), this.popupRef = R(), this._popupAbortController = null, this.slotGroupRefs = A(), this.attributionHeight = 0, this._uiContainer = null, this.component.listenOn(globalThis, "unhandledrejection", (e) => {
+    super(o), this.direction = _(), this.popupRef = A(), this._popupElement = g(void 0), this._popupAbortController = null, this.slotGroupRefs = L(), this.attributionHeight = 0, this._uiContainer = null, this.component.listenOn(globalThis, "unhandledrejection", (e) => {
       const t = e.reason;
       if (t?.name === "webgl:required") {
         const { name: i } = t;
@@ -58,19 +59,26 @@ class B extends v {
       }
     });
   }
+  get popupElement() {
+    return this._popupElement.value;
+  }
+  set popupElement(o) {
+    this._popupElement.value = o;
+  }
   //#endregion
   //#region Private Methods
   hostLifecycle() {
     return [
-      g(() => this.component.view.ready, () => {
+      v(() => this.component.view.ready, () => {
         this._assignDefaultPopup();
       }),
       s(() => this.component.view.popup?.visible, (e, t) => {
         (e || t) && this._cancelPopupOperation(), e && this.popupElement?.open && (this.popupElement.open = !1);
       }, { initial: !0 }),
+      // Cancel the closing operation before openPopup() installs its replacement.
       s(() => this.component.popupElement?.open, (e, t) => {
         t && !e && this._cancelPopupOperation();
-      }, { initial: !0 }),
+      }, { initial: !0, sync: !0 }),
       this.component.view.on("focus-region-select", (e) => this._handleFocusRegionSelect(e)),
       this.component.view.on(
         "click",
@@ -95,9 +103,9 @@ class B extends v {
         return;
       const { fetchFeatures: t, shouldFocus: i, title: p, featureStream: l, promises: h, location: r, ...E } = o, a = r ? u(this.component.view, r) : void 0, c = r ?? this.popupElement.location;
       Object.assign(this.popupElement, E), p !== void 0 && (this.popupElement.heading = p), l ? await this.popupElement.openFeatureStream({ featureStream: l, location: a }) : h?.length ? await this.popupElement.openFeatureStream({
-        featureStream: O(h, e.signal),
+        featureStream: M(h, e.signal),
         location: a
-      }) : t && c ? await this.popupElement.openFeatureStream(V(this.component.view, this.popupElement, c, e.signal)) : (this.popupElement.featureStream = null, r !== void 0 && (this.popupElement.location = a), this.popupElement.open = !0), i && !e.signal.aborted && await this.popupElement.setFocus();
+      }) : t && c ? await this.popupElement.openFeatureStream(D(this.component.view, this.popupElement, c, e.signal)) : (this.popupElement.featureStream = null, r !== void 0 && (this.popupElement.location = a), this.popupElement.open = !0), i && !e.signal.aborted && await this.popupElement.setFocus();
     } else {
       const { location: t, ...i } = o;
       await this.component.view.openPopup({
@@ -150,7 +158,7 @@ class B extends v {
     });
   }
   _handlePopupSlotChange(o) {
-    const e = S(o.target, "arcgis-popup");
+    const e = C(o.target, "arcgis-popup");
     !this.popupElement && e.length ? this.popupElement = e[0] : e.length || (this.popupElement = void 0);
   }
   _webGLErrorAlert() {
@@ -159,23 +167,23 @@ class B extends v {
   //#endregion
   //#region Rendering
   render() {
-    return L({ direction: this.direction, popupComponentEnabled: this.component.popupComponentEnabled, slotGroupRefs: this.slotGroupRefs, handlePopupSlotChange: (o) => this._handlePopupSlotChange(o), webGLErrorElement: this._webGLErrorAlert(), popupElement: this.popupRef });
+    return F({ direction: this.direction, popupComponentEnabled: this.component.popupComponentEnabled, slotGroupRefs: this.slotGroupRefs, handlePopupSlotChange: (o) => this._handlePopupSlotChange(o), webGLErrorElement: this._webGLErrorAlert(), popupElement: this.popupRef });
   }
 }
-function I(n) {
-  _((o, e) => {
+function Q(n) {
+  S((o, e) => {
     const t = () => {
       if (n.attributionMode !== "auto")
         return;
-      const i = G(n.el);
+      const i = O(n.el);
       n.view.attributionMode !== i && (n.view.attributionMode = i);
     };
-    e.onLifecycle(() => (t(), F(n.el, ["class"], t))), e.onUpdate((i) => {
+    e.onLifecycle(() => (t(), G(n.el, ["class"], t))), e.onUpdate((i) => {
       i.has("attributionMode") && n.attributionMode === "auto" && t();
     });
   });
 }
-const J = f((n, o) => {
+const W = f((n, o) => {
   const e = d();
   return o.onLifecycle(
     () => s(
@@ -193,7 +201,7 @@ const J = f((n, o) => {
       }
     )
   ), e;
-}), Q = f(
+}), X = f(
   (n, o) => {
     const e = d();
     return o.onLifecycle(
@@ -207,8 +215,8 @@ const J = f((n, o) => {
   }
 );
 export {
-  B as U,
-  Q as a,
-  I as b,
-  J as u
+  J as U,
+  X as a,
+  Q as b,
+  W as u
 };

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

@@ -8,8 +8,8 @@ import { LitElement as _, renderElement as A } from "@arcgis/lumina";
 import { a as f } from "../../chunks/maybe.js";
 import { usePropertyChange as w, bypassReadOnly as d } from "@arcgis/lumina/controllers";
 import { getDisplayedSymbol as C } from "@arcgis/core/symbols/support/symbolUtils.js";
-import { g as I } from "../../chunks/feature-utils.js";
-import { i as v } from "../../chunks/async-utils.js";
+import { i as I } from "../../chunks/async-utils.js";
+import { g as v } from "../../chunks/feature-utils.js";
 import { stripHTML as b } from "@arcgis/core/applications/Components/stringUtils.js";
 import { watch as h } from "@arcgis/core/core/reactiveUtils.js";
 const x = m`calcite-notice{padding:var(--calcite-space-lg)}`;
@@ -108,7 +108,7 @@ class $ extends _ {
     a !== t && this._removeBoundaryGraphicFromView(a), this.selectedAggregateBoundaryFeature.geometry = e, this._boundaryGraphicView = t, t.graphics.includes(this.selectedAggregateBoundaryFeature) || t.graphics.add(this.selectedAggregateBoundaryFeature);
   }
   async _getLayerViewAndQuery(e) {
-    const { view: t } = this, a = I(e);
+    const { view: t } = this, a = v(e);
     if (!t || !a)
       return null;
     const r = await t.whenLayerView(a);
@@ -142,7 +142,7 @@ class $ extends _ {
       const n = i.features ?? [];
       this._setAggregatedFeaturesState(n), g.extent ? this._updateAggregateBoundaryFeature(g.extent) : this._removeAggregateBoundaryFeature();
     } catch (i) {
-      if (this._abortController !== r || (this._abortController = null, this._setLoading(!1), v(i)))
+      if (this._abortController !== r || (this._abortController = null, this._setLoading(!1), I(i)))
         return;
       this._resetAggregatedFeaturesState();
     }

package/dist/components/arcgis-area-measurement-3d/customElement.js

@@ -125,7 +125,7 @@ class R extends f {
     return c`<div aria-label=${e.componentLabel ?? v} class=${x({
       [g.widget]: !0,
       [g.panel]: !0
-    })} role=presentation><arcgis-measurement-content .state=${i.displayState} .hintLabel=${e.hint} .unsupportedLabel=${e.unsupported} .items=${[
+    })} role=region><arcgis-measurement-content .state=${i.displayState} .hintLabel=${e.hint} .unsupportedLabel=${e.unsupported} .items=${[
       {
         title: e.area,
         measurement: s.area

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

@@ -8,12 +8,12 @@ import { createRef as g, ref as h } from "lit/directives/ref.js";
 import C from "@arcgis/core/core/Accessor.js";
 import { property as d, subclass as E } from "@arcgis/core/core/accessorSupport/decorators.js";
 import { usePropertyChange as k } from "@arcgis/lumina/controllers";
-import { m as I } from "../../chunks/useViewModel.js";
-import { LitElement as T, createEvent as H, safeClassMap as u, nothing as M } from "@arcgis/lumina";
+import { m as T } from "../../chunks/useViewModel.js";
+import { LitElement as I, createEvent as H, safeClassMap as u, nothing as M } from "@arcgis/lumina";
 import { classes as m } from "@arcgis/toolkit/dom";
 var P = Object.defineProperty, O = Object.getOwnPropertyDescriptor, c = (i, e, t, a) => {
-  for (var n = a > 1 ? void 0 : a ? O(e, t) : e, o = i.length - 1, s; o >= 0; o--)
-    (s = i[o]) && (n = (a ? s(e, t, n) : s(n)) || n);
+  for (var n = a > 1 ? void 0 : a ? O(e, t) : e, s = i.length - 1, o; s >= 0; s--)
+    (o = i[s]) && (n = (a ? o(e, t, n) : o(n)) || n);
   return a && n && P(e, t, n), n;
 };
 const v = new EventTarget();
@@ -21,8 +21,8 @@ function S(i, e, t) {
   let a = !1;
   const n = w(
     i,
-    (o, s) => {
-      a || e(o, s);
+    (s, o) => {
+      a || e(s, o);
     },
     t
   );
@@ -117,8 +117,8 @@ c([
 r = c([
   E("map-components.expand.ExpandViewModel")
 ], r);
-const L = y`:host{display:flex;pointer-events:auto;--arcgis-internal-expand-icon-number-spacing-left: none;--arcgis-internal-expand-icon-number-spacing-right: none;--arcgis-internal-expand-action-background-color: var( --calcite-action-background-color, var(--calcite-color-foreground-1) );--arcgis-internal-expand-action-background-color-hover: var( --calcite-action-background-color-hover, var(--calcite-color-foreground-2) );--arcgis-internal-expand-action-background-color-press: var( --calcite-action-background-color-press, var(--calcite-color-foreground-3) )}arcgis-expand>.content-expanded{background-color:var(--calcite-color-background)}.root{--esri-widget-panel-max-height: 95svh;--calcite-sheet-max-height: var(--esri-widget-panel-max-height);--calcite-sheet-height: auto;--calcite-action-corner-radius: 0}.action{--calcite-action-background-color: var(--arcgis-internal-expand-action-background-color);--calcite-action-background-color-hover: var(--arcgis-internal-expand-action-background-color-hover);--calcite-action-background-color-press: var(--arcgis-internal-expand-action-background-color-press);cursor:pointer;text-align:center;color:var(--calcite-color-text-2);justify-content:center;align-items:center;margin:0;padding:0;font-size:var(--calcite-font-size);transition:background-color .125s ease-in-out;display:flex;flex-direction:column;overflow:hidden}.toggle{position:relative}.popover-content{flex-direction:column;display:flex;max-height:var(--arcgis-internal-expand-max-height, 95svh);::slotted(*){max-height:var(--arcgis-internal-expand-max-height, 95svh);overflow-y:auto}::slotted(arcgis-sketch){--arcgis-internal-sketch-gap: var(--calcite-spacing-none)}::slotted(:is(arcgis-area-measurement-2d,arcgis-area-measurement-3d,arcgis-basemap-gallery,arcgis-basemap-layer-list,arcgis-basemap-layer-list-next,arcgis-bookmarks,arcgis-building-explorer,arcgis-catalog-layer-list,arcgis-catalog-layer-list-next,arcgis-directions,arcgis-direct-line-measurement-3d,arcgis-distance-measurement-2d,arcgis-editor,arcgis-feature-form,arcgis-features,arcgis-layer-list,arcgis-layer-list-next,arcgis-legend,arcgis-line-of-sight,arcgis-print,arcgis-shadow-cast,arcgis-slice,arcgis-table-list,arcgis-table-list-next,arcgis-utility-network-trace,arcgis-grid-controls)){width:var(--arcgis-internal-panel-width);min-width:var(--calcite-spacing-xxxl);min-height:var(--calcite-spacing-xxxl);transition:max-height .25s ease-in-out}::slotted(arcgis-exploratory-analysis){width:var(--arcgis-internal-exploratory-analysis-width, fit-content);min-height:var(--calcite-spacing-xxxl);transition:max-height .25s ease-in-out}}.popover-content .esri-widget--panel{width:300px}.panel{max-height:var(--esri-widget-panel-max-height)}.panel-content{::slotted(*){width:100%}::slotted(:is(arcgis-area-measurement-2d,arcgis-area-measurement-3d,arcgis-basemap-gallery,arcgis-basemap-layer-list,arcgis-basemap-layer-list-next,arcgis-bookmarks,arcgis-building-explorer,arcgis-catalog-layer-list,arcgis-catalog-layer-list-next,arcgis-directions,arcgis-direct-line-measurement-3d,arcgis-distance-measurement-2d,arcgis-editor,arcgis-feature-form,arcgis-features,arcgis-layer-list,arcgis-layer-list-next,arcgis-legend,arcgis-line-of-sight,arcgis-print,arcgis-shadow-cast,arcgis-slice,arcgis-table-list,arcgis-table-list-next,arcgis-utility-network-trace,arcgis-grid-controls)){overflow-y:auto}}.panel-content .esri-widget{width:auto}.panel-content .esri-widget--panel{flex:auto}.arcgis-map-container-ui__element .popover-content .esri-widget,.arcgis-map-container-ui__element .popover-content .esri-widget.esri-component,.arcgis-map-container-ui__element .panel-content .esri-widget,.arcgis-map-container-ui__element .panel-content .esri-widget.esri-component,.popover-content .esri-widget,.popover-content .esri-widget.esri-component,.panel-content .esri-widget,.panel-content .esri-widget.esri-component{box-sizing:border-box;box-shadow:none;margin-bottom:0}.panel-content,.content-container{background-color:var(--calcite-color-foreground-1);flex-direction:column;flex:auto;justify-content:stretch;display:flex}.sheet .panel-content,.sheet .content-container{overflow:hidden}.panel-icon-number{align-self:center}.icon{display:flex}calcite-button:not(:hover) .icon:not(calcite-icon){color:var(--calcite-color-text-3)}.icon-flip{transform:var(--arcgis-internal-collapse-icon-flip)}.icon-number{transform-origin:50%;color:var(--calcite-color-text-inverse);pointer-events:none;background-color:var(--calcite-color-text-3);border-radius:var(--calcite-spacing-xl);justify-content:center;align-items:center;height:var(--calcite-spacing-lg);padding:.125em .333em;font-size:var(--calcite-font-size-sm);line-height:1em;display:flex;position:absolute;top:-6px;left:var(--arcgis-internal-expand-icon-number-spacing-left);right:var(--arcgis-internal-expand-icon-number-spacing-right)}`, f = "chevrons-left", x = "chevrons-right", V = I(r);
-class z extends T {
+const L = y`:host{display:flex;pointer-events:auto;--arcgis-internal-expand-icon-number-spacing-left: none;--arcgis-internal-expand-icon-number-spacing-right: none;--arcgis-internal-expand-action-background-color: var( --calcite-action-background-color, var(--calcite-color-foreground-1) );--arcgis-internal-expand-action-background-color-hover: var( --calcite-action-background-color-hover, var(--calcite-color-foreground-2) );--arcgis-internal-expand-action-background-color-press: var( --calcite-action-background-color-press, var(--calcite-color-foreground-3) )}arcgis-expand>.content-expanded{background-color:var(--calcite-color-background)}.root{--esri-widget-panel-max-height: 95svh;--calcite-sheet-max-height: var(--esri-widget-panel-max-height);--calcite-sheet-height: auto;--calcite-action-corner-radius: 0}.action{--calcite-action-background-color: var(--arcgis-internal-expand-action-background-color);--calcite-action-background-color-hover: var(--arcgis-internal-expand-action-background-color-hover);--calcite-action-background-color-press: var(--arcgis-internal-expand-action-background-color-press);cursor:pointer;text-align:center;color:var(--calcite-color-text-2);justify-content:center;align-items:center;margin:0;padding:0;font-size:var(--calcite-font-size);transition:background-color .125s ease-in-out;display:flex;flex-direction:column;overflow:hidden}.toggle{position:relative}.popover-content{flex-direction:column;display:flex;max-height:var(--arcgis-internal-expand-max-height, 95svh);::slotted(*){max-height:var(--arcgis-internal-expand-max-height, 95svh);overflow-y:auto}::slotted(arcgis-sketch){--arcgis-internal-sketch-gap: var(--calcite-spacing-none)}::slotted(:is(arcgis-area-measurement-2d,arcgis-area-measurement-3d,arcgis-basemap-gallery,arcgis-basemap-layer-list,arcgis-basemap-layer-list-next,arcgis-bookmarks,arcgis-building-explorer,arcgis-catalog-layer-list,arcgis-catalog-layer-list-next,arcgis-directions,arcgis-direct-line-measurement-3d,arcgis-distance-measurement-2d,arcgis-editor,arcgis-feature-form,arcgis-features,arcgis-layer-list,arcgis-layer-list-next,arcgis-legend,arcgis-line-of-sight,arcgis-print,arcgis-shadow-cast,arcgis-slice,arcgis-table-list,arcgis-table-list-next,arcgis-utility-network-trace,arcgis-grid-controls)){width:var(--arcgis-internal-panel-width);min-width:var(--calcite-spacing-xxxl);min-height:var(--calcite-spacing-xxxl);transition:max-height .25s ease-in-out}::slotted(arcgis-exploratory-analysis){width:var(--arcgis-internal-exploratory-analysis-width, fit-content);min-height:var(--calcite-spacing-xxxl);transition:max-height .25s ease-in-out}}.popover-content .esri-widget--panel{width:300px}.panel{max-height:var(--esri-widget-panel-max-height)}.panel-content{::slotted(*){width:100%}::slotted(:is(arcgis-area-measurement-2d,arcgis-area-measurement-3d,arcgis-basemap-gallery,arcgis-basemap-layer-list,arcgis-basemap-layer-list-next,arcgis-bookmarks,arcgis-building-explorer,arcgis-catalog-layer-list,arcgis-catalog-layer-list-next,arcgis-directions,arcgis-direct-line-measurement-3d,arcgis-distance-measurement-2d,arcgis-editor,arcgis-feature-form,arcgis-features,arcgis-layer-list,arcgis-layer-list-next,arcgis-legend,arcgis-line-of-sight,arcgis-print,arcgis-shadow-cast,arcgis-slice,arcgis-table-list,arcgis-table-list-next,arcgis-utility-network-trace,arcgis-grid-controls)){overflow-y:auto}}.panel-content .esri-widget{width:auto}.panel-content .esri-widget--panel{flex:auto}.arcgis-map-container-ui__element .popover-content .esri-widget,.arcgis-map-container-ui__element .popover-content .esri-widget.esri-component,.arcgis-map-container-ui__element .panel-content .esri-widget,.arcgis-map-container-ui__element .panel-content .esri-widget.esri-component,.popover-content .esri-widget,.popover-content .esri-widget.esri-component,.panel-content .esri-widget,.panel-content .esri-widget.esri-component{box-sizing:border-box;box-shadow:none;margin-bottom:0}.panel-content,.content-container{background-color:var(--calcite-color-foreground-1);flex-direction:column;flex:auto;justify-content:stretch;display:flex}.sheet .panel-content,.sheet .content-container{overflow:hidden}.panel-icon-number{align-self:center}.icon{display:flex}calcite-button:not(:hover) .icon:not(calcite-icon){color:var(--calcite-color-text-3)}.icon-flip{transform:var(--arcgis-internal-collapse-icon-flip)}.icon-number{transform-origin:50%;color:var(--calcite-color-text-inverse);pointer-events:none;background-color:var(--calcite-color-text-3);border-radius:var(--calcite-spacing-xl);justify-content:center;align-items:center;height:var(--calcite-spacing-lg);padding:.125em .333em;font-size:var(--calcite-font-size-sm);line-height:1em;display:flex;position:absolute;top:-6px;left:var(--arcgis-internal-expand-icon-number-spacing-left);right:var(--arcgis-internal-expand-icon-number-spacing-right)}`, f = "chevrons-left", x = "chevrons-right", V = T(r);
+class z extends I {
   constructor() {
     super(...arguments), this.popoverEl = g(), this.messages = D({}), this.viewModel = V(this), this.toggleActionEl = g(), this.view = this.viewModel.view, this.state = this.viewModel.state, this.autoDestroyDisabled = !1, this.autoCollapse = this.viewModel.autoCollapse, this.closeOnEscDisabled = !1, this.content = "", this.expanded = this.viewModel.expanded, this.expandTooltip = "", this.collapseTooltip = "", this.focusTrapDisabled = !1, this.group = this.viewModel.group, this.iconNumber = 0, this.mode = "auto", this.topLayerDisabled = !1, this.modalDisabled = !1, this.visualScale = "m", this.arcgisPropertyChange = k()("expanded"), this.arcgisReady = H();
   }
@@ -213,16 +213,16 @@ class z extends T {
     this._slottedIcon = t?.icon;
   }
   render() {
-    const { _displaySheet: e, toggleActionEl: t, expanded: a, label: n, modalDisabled: o, topLayerDisabled: s } = this;
-    return l`<div class=${u(m("root", $.widget))}>${this._renderToggle()}${e ? l`<calcite-sheet class="sheet" height=l .label=${n ?? ""} .modalDisabled=${o} .topLayerDisabled=${s} @keydown=${this._handleKeyDown} .open=${a} position=block-end @calciteSheetClose=${this.collapse}><calcite-panel class="panel" closable .closed=${!a} .heading=${n} @keydown=${this._handleKeyDown} @calcitePanelClose=${this.collapse}><div class="panel-content">${this._renderContent()}</div></calcite-panel></calcite-sheet>` : t.value ? l`<calcite-popover .focusTrapDisabled=${this.focusTrapDisabled} .label=${n ?? ""} @keydown=${this._handleKeyDown} trigger-disabled .open=${a} overlay-positioning=fixed .placement=${this.getPopoverPlacement()} .referenceElement=${t.value} .topLayerDisabled=${s} @calcitePopoverClose=${this._handlePopoverClose} ${h(this.popoverEl)}><div class="popover-content">${this._renderContent()}</div></calcite-popover>` : null}</div>`;
+    const { _displaySheet: e, toggleActionEl: t, expanded: a, label: n, modalDisabled: s, topLayerDisabled: o } = this;
+    return l`<div class=${u(m("root", $.widget))}>${this._renderToggle()}${e ? l`<calcite-sheet class="sheet" .focusTrapDisabled=${this.focusTrapDisabled} height=l .label=${n ?? ""} .modalDisabled=${s} .topLayerDisabled=${o} @keydown=${this._handleKeyDown} .open=${a} position=block-end @calciteSheetClose=${this.collapse}><calcite-panel class="panel" closable .closed=${!a} .heading=${n} @keydown=${this._handleKeyDown} @calcitePanelClose=${this.collapse}><div class="panel-content">${this._renderContent()}</div></calcite-panel></calcite-sheet>` : t.value ? l`<calcite-popover .focusTrapDisabled=${this.focusTrapDisabled} .label=${n ?? ""} @keydown=${this._handleKeyDown} trigger-disabled .open=${a} overlay-positioning=fixed .placement=${this.getPopoverPlacement()} .referenceElement=${t.value} .topLayerDisabled=${o} @calcitePopoverClose=${this._handlePopoverClose} ${h(this.popoverEl)}><div class="popover-content">${this._renderContent()}</div></calcite-popover>` : null}</div>`;
   }
   _renderBadgeNumber() {
     const { expanded: e, iconNumber: t } = this;
     return t && !e ? l`<span class="icon-number">${t}</span>` : null;
   }
   _renderToggleButton() {
-    const { expanded: e, expandTitle: t, expandIcon: a, collapseIcon: n } = this, o = e ? n : a;
-    return l`<calcite-action class=${u(m("action", "icon", { "icon-flip": o === f || o === x }))} @click=${this.toggle} .text=${t} title=${t ?? M} .icon=${o} .scale=${this.visualScale} ${h(this.toggleActionEl)}></calcite-action>`;
+    const { expanded: e, expandTitle: t, expandIcon: a, collapseIcon: n } = this, s = e ? n : a;
+    return l`<calcite-action class=${u(m("action", "icon", { "icon-flip": s === f || s === x }))} @click=${this.toggle} .text=${t} title=${t ?? M} .icon=${s} .scale=${this.visualScale} ${h(this.toggleActionEl)}></calcite-action>`;
   }
   _renderToggle() {
     return l`<div class="toggle">${this._renderToggleButton()}${this._renderBadgeNumber()}</div>`;

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

@@ -9,7 +9,7 @@ import { m as x } from "../../chunks/useViewModel.js";
 import { LitElement as F, createEvent as b, nothing as _, safeClassMap as L } from "@arcgis/lumina";
 import { substitute as T } from "@arcgis/core/intl.js";
 import { renderingSanitizer as A } from "@arcgis/core/applications/Components/sanitizerUtils.js";
-import { c as D, g as k, d as R, e as V, b as c, i as B, f as H } from "../../chunks/feature-utils.js";
+import { c as D, h as k, d as R, e as V, b as c, i as B, f as H } from "../../chunks/feature-utils.js";
 import N from "@arcgis/core/core/Collection.js";
 import { watch as P } from "@arcgis/core/core/reactiveUtils.js";
 import { stripHTML as Z } from "@arcgis/core/applications/Components/stringUtils.js";