@esri/hub-web-components 0.35.0 → 0.36.1

package/dist/components/arcgis-layout-container/customElement.js

@@ -1,42 +1,42 @@
-import { g as D, c as A } from "../../chunks/runtime.js";
+import { g as D, c as I } from "../../chunks/runtime.js";
 import { html as p } from "lit-html";
-import { keyed as w } from "lit-html/directives/keyed.js";
-import { LitElement as k, useContextProvider as I, createEvent as m, noShadowRoot as T } from "@arcgis/lumina";
-import { createRef as $, ref as x } from "lit/directives/ref.js";
-import { l as M } from "../../chunks/layoutContext.js";
-import { css as O } from "@lit/reactive-element/css-tag.js";
-import { layoutNodeTags as R, cloneObject as f, findNodeById as v, setProp as V, getProp as H, deepMerge as j, Logger as _, createId as B, getWithDefault as U } from "@esri/hub-common";
-import { g as z } from "../../chunks/state.js";
-import { p as F } from "../../chunks/processLayout.js";
-import { c as q, b as E, i as L, a as C } from "../../chunks/typeGuards.js";
-import { a as G, i as W } from "../../chunks/interpolate-translations.js";
-import { u as J } from "../../chunks/useT9n.js";
-import { migrateSchema as K } from "@esri/hub-components";
-import { f as P } from "../../chunks/findColumnAndNodeIndex.js";
-import { dictionary as N } from "@esri/telemetry-dictionary-hub";
+import { keyed as $ } from "lit-html/directives/keyed.js";
+import { LitElement as M, useContextProvider as T, createEvent as v, noShadowRoot as O } from "@arcgis/lumina";
+import { createRef as x, ref as R } from "lit/directives/ref.js";
+import { l as V } from "../../chunks/layoutContext.js";
+import { css as H } from "@lit/reactive-element/css-tag.js";
+import { layoutNodeTags as S, cloneObject as f, findNodeById as L, setProp as j, getProp as U, deepMerge as B, Logger as _, createId as z, getWithDefault as F } from "@esri/hub-common";
+import { g as q } from "../../chunks/state.js";
+import { p as G } from "../../chunks/processLayout.js";
+import { c as W, b as C, i as m, a as w } from "../../chunks/typeGuards.js";
+import { a as J, i as K } from "../../chunks/interpolate-translations.js";
+import { u as Q } from "../../chunks/useT9n.js";
+import { migrateSchema as X } from "@esri/hub-components";
+import { f as A } from "../../chunks/findColumnAndNodeIndex.js";
+import { dictionary as b } from "@esri/telemetry-dictionary-hub";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
-See https://js.arcgis.com/0.35/esri/copyright.txt for details.
-v0.35.0 */
-const Q = O`@layer{arcgis-layout-container{display:block;--offset-top: 0px;calcite-shell{position:static;font-size:inherit}#arcgis-layout-container-edit-mode-live-region{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}}arcgis-layout-container[is-edit-mode]{height:calc(100vh - var(--offset-top));arcgis-layout{margin-block-start:15px}calcite-panel>*{margin:1rem}calcite-panel>calcite-action.panel-close{margin:0}}}`;
-function X(i, t) {
+See https://js.arcgis.com/0.36/esri/copyright.txt for details.
+v0.36.1 */
+const Y = H`@layer{arcgis-layout-container{display:block;--offset-top: 0px;calcite-shell{position:static;font-size:inherit}#arcgis-layout-container-edit-mode-live-region{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}}arcgis-layout-container[is-edit-mode]{height:calc(100vh - var(--offset-top));arcgis-layout{margin-block-start:15px}calcite-panel>*{margin:1rem}calcite-panel>calcite-action.panel-close{margin:0}}}`;
+function Z(i, t) {
   const s = ["order", "offset", "width"], e = [];
   return s.forEach((a) => {
     let o;
-    E(i) && (o = i.sectionProps?.[a]), L(i) && (o = i.rowProps?.[a]), C(i) && (o = i.columnProps?.[a]), typeof o == "number" ? (o < 0 || o > 12) && e.push(`Node "${i.id}": ${t} > ${a} out of range (0-12): ${o}`) : typeof o == "object" && Object.entries(o).forEach(([n, r]) => {
+    C(i) && (o = i.sectionProps?.[a]), m(i) && (o = i.rowProps?.[a]), w(i) && (o = i.columnProps?.[a]), typeof o == "number" ? (o < 0 || o > 12) && e.push(`Node "${i.id}": ${t} > ${a} out of range (0-12): ${o}`) : typeof o == "object" && Object.entries(o).forEach(([n, r]) => {
       typeof r == "number" && (r < 0 || r > 12) && e.push(`Node "${i.id}": ${t} > ${a}.${n} out of range (0-12): ${r}`);
     });
   }), e;
 }
-function Y(i, t, s, e) {
+function tt(i, t, s, e) {
   const a = [];
-  return i.id || a.push(`${t} > missing required id.`), i.tag || a.push(`${t} > missing required tag.`), i.id && (s.has(i.id) && a.push(`Node "${i.id}": ${t} > duplicate id: "${i.id}"`), s.add(i.id)), e.includes(i.tag) || a.push(`Node "${i.id}": ${t} > has invalid tag: ${i.tag}`), a.push(...X(i, t)), (E(i) || L(i) || C(i)) && (!i.children || !Array.isArray(i.children) || i.children.length === 0) && a.push(`Node "${i.id}": ${t} > missing or empty children array.`), a;
+  return i.id || a.push(`${t} > missing required id.`), i.tag || a.push(`${t} > missing required tag.`), i.id && (s.has(i.id) && a.push(`Node "${i.id}": ${t} > duplicate id: "${i.id}"`), s.add(i.id)), e.includes(i.tag) || a.push(`Node "${i.id}": ${t} > has invalid tag: ${i.tag}`), a.push(...Z(i, t)), (C(i) || m(i) || w(i)) && (!i.children || !Array.isArray(i.children) || i.children.length === 0) && a.push(`Node "${i.id}": ${t} > missing or empty children array.`), a;
 }
-function b({ node: i, nodePath: t, idSet: s, validTags: e, errors: a }) {
+function N({ node: i, nodePath: t, idSet: s, validTags: e, errors: a }) {
   if (i.tag === "arcgis-nav-card") {
     const o = i.properties;
     o && typeof o == "object" && Array.isArray(o.sections) && o.sections.forEach((r, c) => {
       const u = `${t}.sections[${c}]`;
-      b({
+      N({
         node: r,
         nodePath: u,
         idSet: s,
@@ -45,11 +45,11 @@ function b({ node: i, nodePath: t, idSet: s, validTags: e, errors: a }) {
       });
     });
   }
-  a.push(...Y(i, t, s, e)), Array.isArray(i.children) && i.children.forEach((o, n) => {
-    let r = `${t}.Child[${n}]`, c = Array.from(R);
-    E(i) ? (c = ["arcgis-layout-row"], r = `${t}.Row[${n}]`) : L(i) ? (c = ["arcgis-layout-column"], r = `${t}.Column[${n}]`) : C(i) && (c = Array.from(R).filter(
+  a.push(...tt(i, t, s, e)), Array.isArray(i.children) && i.children.forEach((o, n) => {
+    let r = `${t}.Child[${n}]`, c = Array.from(S);
+    C(i) ? (c = ["arcgis-layout-row"], r = `${t}.Row[${n}]`) : m(i) ? (c = ["arcgis-layout-column"], r = `${t}.Column[${n}]`) : w(i) && (c = Array.from(S).filter(
       (u) => u !== "arcgis-layout-column" && u !== "arcgis-layout-section"
-    )), b({
+    )), N({
       node: o,
       nodePath: r,
       idSet: s,
@@ -58,13 +58,13 @@ function b({ node: i, nodePath: t, idSet: s, validTags: e, errors: a }) {
     });
   });
 }
-function Z(i) {
+function it(i) {
   const t = [], s = /* @__PURE__ */ new Set();
   return i ? typeof i != "object" ? (t.push("Layout must be an object."), t) : !i.sections.length || !Array.isArray(i.sections) ? (t.push("Layout must have a sections array."), t) : (i.sections.forEach((e, a) => {
-    if (q(e))
+    if (W(e))
       return;
     const o = e, n = `Section[${a}]`;
-    b({
+    N({
       node: o,
       nodePath: n,
       idSet: s,
@@ -73,7 +73,7 @@ function Z(i) {
     });
   }), t) : (t.push("Layout must be defined."), t);
 }
-async function tt(i) {
+async function et(i) {
   switch (i) {
     case "arcgis-text-card":
       return (await import("../../chunks/migrateTextCard.js")).migrateTextCard;
@@ -82,38 +82,38 @@ async function tt(i) {
       return ((t) => t);
   }
 }
-function it(i) {
+function st(i) {
   const t = f(i);
   return t.schemaVersion = 2, t;
 }
-const et = {
-  2: it
+const ot = {
+  2: st
 };
-async function st(i) {
-  const t = K(i, et), s = await Promise.all(
-    t.sections.map(async (e) => await S(e))
+async function at(i) {
+  const t = X(i, ot), s = await Promise.all(
+    t.sections.map(async (e) => await P(e))
   );
   return t.sections = s, t;
 }
-async function S(i) {
-  const s = (await tt(i.tag))(i);
+async function P(i) {
+  const s = (await et(i.tag))(i);
   return Array.isArray(s.children) && (s.children = await Promise.all(
-    s.children.map(async (e) => await S(e))
+    s.children.map(async (e) => await P(e))
   )), s;
 }
-function ot(i, t) {
+function nt(i, t) {
   if (i.children && t < i.children.length - 1)
     return i.children[t + 1];
 }
-function at(i, t) {
+function rt(i, t) {
   if (i.children && t > 0)
     return i.children[t - 1];
 }
-function nt(i, t) {
+function ct(i, t) {
   if (t < i.sections.length - 1)
     return i.sections[t + 1];
 }
-function rt(i, t) {
+function dt(i, t) {
   if (t > 0)
     return i.sections[t - 1];
 }
@@ -127,38 +127,38 @@ function lt(i, t) {
           const c = n.children[r];
           if (c.children)
             for (let u = 0; u < c.children.length; u++) {
-              const h = c.children[u];
-              if (h.children)
-                for (let d = 0; d < h.children.length; d++) {
-                  const y = h.children[d];
+              const d = c.children[u];
+              if (d.children)
+                for (let l = 0; l < d.children.length; l++) {
+                  const y = d.children[l];
                   if (y.id === i.id)
-                    if (d > 0) {
-                      const l = h.children[d - 1];
-                      return h.children[d - 1] = h.children[d], h.children[d] = l, !0;
+                    if (l > 0) {
+                      const h = d.children[l - 1];
+                      return d.children[l - 1] = d.children[l], d.children[l] = h, !0;
                     } else {
                       if (u > 0)
-                        return h.children.splice(d, 1), c.children[u - 1].children?.push(i), !0;
+                        return d.children.splice(l, 1), c.children[u - 1].children?.push(i), !0;
                       if (r > 0) {
-                        h.children.splice(d, 1);
-                        const l = at(n, r);
-                        if (l?.children && l.children.length > 0)
-                          return l.children[l.children.length - 1].children?.push(i), !0;
+                        d.children.splice(l, 1);
+                        const h = rt(n, r);
+                        if (h?.children && h.children.length > 0)
+                          return h.children[h.children.length - 1].children?.push(i), !0;
                       } else if (o > 0) {
-                        h.children.splice(d, 1);
-                        const l = rt(a, o);
-                        if (l?.children && l.children.length > 0) {
-                          const g = l.children[l.children.length - 1];
+                        d.children.splice(l, 1);
+                        const h = dt(a, o);
+                        if (h?.children && h.children.length > 0) {
+                          const g = h.children[h.children.length - 1];
                           if (g.children && g.children.length > 0)
                             return g.children[g.children.length - 1].children?.push(i), !0;
                         }
                       }
                     }
                   if (y.tag === "arcgis-nav-card") {
-                    const l = y.properties?.sections;
-                    if (l && e({ sections: l }))
+                    const h = y.properties?.sections;
+                    if (h && e({ sections: h }))
                       return !0;
                   }
-                  if (y.children && L(y) && e({ sections: [{ children: [y] }] }))
+                  if (y.children && m(y) && e({ sections: [{ children: [y] }] }))
                     return !0;
                 }
             }
@@ -168,7 +168,7 @@ function lt(i, t) {
   }
   return e(s), s;
 }
-function dt(i, t) {
+function ht(i, t) {
   const s = f(t);
   function e(a) {
     for (let o = 0; o < a.sections.length; o++) {
@@ -178,38 +178,38 @@ function dt(i, t) {
           const c = n.children[r];
           if (c.children)
             for (let u = 0; u < c.children.length; u++) {
-              const h = c.children[u];
-              if (h.children)
-                for (let d = 0; d < h.children.length; d++) {
-                  const y = h.children[d];
+              const d = c.children[u];
+              if (d.children)
+                for (let l = 0; l < d.children.length; l++) {
+                  const y = d.children[l];
                   if (y.id === i.id)
-                    if (d < h.children.length - 1) {
-                      const l = h.children[d + 1];
-                      return h.children[d + 1] = h.children[d], h.children[d] = l, !0;
+                    if (l < d.children.length - 1) {
+                      const h = d.children[l + 1];
+                      return d.children[l + 1] = d.children[l], d.children[l] = h, !0;
                     } else {
                       if (u < c.children.length - 1)
-                        return h.children.splice(d, 1), c.children[u + 1].children?.unshift(i), !0;
+                        return d.children.splice(l, 1), c.children[u + 1].children?.unshift(i), !0;
                       if (r < n.children.length - 1) {
-                        h.children.splice(d, 1);
-                        const l = ot(n, r);
-                        if (l?.children && l.children.length > 0)
-                          return l.children[0].children?.unshift(i), !0;
+                        d.children.splice(l, 1);
+                        const h = nt(n, r);
+                        if (h?.children && h.children.length > 0)
+                          return h.children[0].children?.unshift(i), !0;
                       } else if (o < a.sections.length - 1) {
-                        h.children.splice(d, 1);
-                        const l = nt(a, o);
-                        if (l?.children && l.children.length > 0) {
-                          const g = l.children[0];
+                        d.children.splice(l, 1);
+                        const h = ct(a, o);
+                        if (h?.children && h.children.length > 0) {
+                          const g = h.children[0];
                           if (g.children && g.children.length > 0)
                             return g.children[0].children?.unshift(i), !0;
                         }
                       }
                     }
                   if (y.tag === "arcgis-nav-card") {
-                    const l = y.properties?.sections;
-                    if (l && e({ sections: l }))
+                    const h = y.properties?.sections;
+                    if (h && e({ sections: h }))
                       return !0;
                   }
-                  if (y.children && L(y) && e({ sections: [{ children: [y] }] }))
+                  if (y.children && m(y) && e({ sections: [{ children: [y] }] }))
                     return !0;
                 }
             }
@@ -219,7 +219,7 @@ function dt(i, t) {
   }
   return e(s), s;
 }
-function ct(i, t) {
+function ut(i, t) {
   const s = [];
   function e(a) {
     if (a.nodeType === Node.ELEMENT_NODE) {
@@ -235,9 +235,79 @@ function ct(i, t) {
   }
   return e(i), s;
 }
-class ht extends k {
+const yt = /\{\{\s*variables\.([^.\s}]+)\.value\s*\}\}/gu;
+function ft(i) {
+  const t = /* @__PURE__ */ new Set(), s = (e) => {
+    if (typeof e == "string") {
+      for (const a of e.matchAll(yt)) {
+        const o = a[1];
+        o && t.add(o);
+      }
+      return;
+    }
+    if (Array.isArray(e)) {
+      e.forEach((a) => s(a));
+      return;
+    }
+    e && typeof e == "object" && Object.values(e).forEach((a) => s(a));
+  };
+  return s(i), Array.from(t);
+}
+function E(i, t) {
+  const s = [], e = /* @__PURE__ */ new Set();
+  if (!i.sections?.length)
+    return s;
+  const a = (o) => {
+    const n = { ...o };
+    delete n.children, n.tag === "arcgis-nav-card" && n.properties && (n.properties = { ...n.properties }, delete n.properties.sections), !e.has(o.id) && ft(n).includes(t) && (s.push(o), e.add(o.id));
+  };
+  for (const o of i.sections)
+    if (a(o), !!o.children) {
+      for (const n of o.children)
+        if (a(n), !!n.children) {
+          for (const r of n.children)
+            if (a(r), !!r.children)
+              for (const c of r.children) {
+                if (a(c), c.tag === "arcgis-nav-card") {
+                  const u = c.properties?.sections;
+                  E(
+                    { sections: u || [] },
+                    t
+                  ).forEach((l) => a(l));
+                }
+                m(c) && c.children && E(
+                  {
+                    sections: [{ children: [c] }]
+                  },
+                  t
+                ).forEach((d) => a(d));
+              }
+        }
+    }
+  return s;
+}
+function k(i) {
+  const t = f(i);
+  return Object.keys(t.variables || {}).forEach((e) => {
+    E(t, e).length === 0 && delete t.variables?.[e];
+  }), t;
+}
+function gt(i, t) {
+  let s = f(t);
+  const e = L(s, i);
+  if (e) {
+    const a = A(e, s);
+    if (a) {
+      const { column: o, index: n } = a;
+      o.children?.splice(n, 1);
+    }
+    s = k(s);
+  }
+  return s;
+}
+class pt extends M {
   constructor() {
-    super(), this._messages = J({ blocking: !0 }), this.#t = I({ context: M }), this._isNodeDirty = !1, this._layoutRef = $(), this._layoutNodeEditorRef = $(), this._handleExitEditMode = async (t) => {
+    super(), this._messages = Q({ blocking: !0 }), this.#t = T({ context: V }), this._isNodeDirty = !1, this._layoutRef = x(), this._layoutNodeEditorRef = x(), this._handleExitEditMode = async (t) => {
       t.stopPropagation(), this.arcgisHubLayoutEditorExit.emit();
     }, this._handlePublishLayout = async (t) => {
       t.stopPropagation(), this.arcgisHubLayoutPublished.emit({
@@ -247,11 +317,11 @@ class ht extends k {
         }
       });
     }, this._resetLayout = async (t) => {
-      t.stopPropagation(), this._isConfirmResetDialogOpen = !0, this.hubTelemetry.emit(N.category.interaction.action.open.label.modal.details.resetToDefault);
+      t.stopPropagation(), this._isConfirmResetDialogOpen = !0, this.hubTelemetry.emit(b.category.interaction.action.open.label.modal.details.resetToDefault);
     }, this._confirmResetLayout = () => {
       this._hideConfirmResetDialog(), this.arcgisHubLayoutReset.emit({
         successCallback: () => {
-          this._isLayoutDirty = !0, this.hubTelemetry.emit(N.category.interaction.action.select.label.layout.details.default);
+          this._isLayoutDirty = !0, this.hubTelemetry.emit(b.category.interaction.action.select.label.layout.details.default);
         }
       });
     }, this._handleCloseEditPanel = async () => {
@@ -261,7 +331,7 @@ class ht extends k {
         await this._updateLayoutNode(this._nodeBeforeEdit.id, "properties", this._nodeBeforeEdit.properties, void 0, !0);
       }
       this._isEditPanelOpen = !1, this._nodeBeforeEdit = void 0, this.hubTelemetry.emit({
-        ...N.category.interaction.action.close.label.sidePanel,
+        ...b.category.interaction.action.close.label.sidePanel,
         details: this._layoutNodeEditorConfig?.layoutNodeConfig?.name || "unknown"
       });
     }, this._setlayoutNodeEditorRef = async (t) => {
@@ -269,7 +339,7 @@ class ht extends k {
         ...this._layoutContext,
         layoutNodeEditorRef: t
       });
-    }, this._isConfirmResetDialogOpen = !1, this._liveAnnouncement = void 0, this._layoutErrors = [], this._historyStack = [], this._historyIdx = -1, this._isLayoutDirty = !1, this._isLayoutValid = !0, this._isEditPanelOpen = !1, this.debug = !1, this.isEditMode = !1, this.isPublishing = !1, this.options = {}, this.arcgisHubLayoutChanged = m(), this.arcgisHubLayoutEditorExit = m(), this.arcgisHubLayoutPublished = m(), this.arcgisHubLayoutReset = m(), this.hubTelemetry = m(), this.listen("arcgisLayoutActivateNode", (t) => {
+    }, this._isConfirmResetDialogOpen = !1, this._liveAnnouncement = void 0, this._layoutErrors = [], this._historyStack = [], this._historyIdx = -1, this._isLayoutDirty = !1, this._isLayoutValid = !0, this._isEditPanelOpen = !1, this.debug = !1, this.isEditMode = !1, this.isPublishing = !1, this.options = {}, this.arcgisHubLayoutChanged = v(), this.arcgisHubLayoutEditorExit = v(), this.arcgisHubLayoutPublished = v(), this.arcgisHubLayoutReset = v(), this.hubTelemetry = v(), this.listen("arcgisLayoutActivateNode", (t) => {
       this._handleNodeActivate(t);
     }), this.listen("arcgisLayoutDeactivateNode", (t) => {
       this._handleNodeDeactivate(t);
@@ -289,13 +359,13 @@ class ht extends k {
     this.properties = { _isConfirmResetDialogOpen: 16, _liveAnnouncement: 16, _processedLayout: 16, _layoutErrors: 16, _activatedNode: 16, _layoutNodeEditorConfig: 16, _historyStack: 16, _historyIdx: 16, _isLayoutDirty: 16, _isLayoutValid: 16, _isEditPanelOpen: 16, layout: 0, debug: 7, isEditMode: 7, isPublishing: 5, options: 0 };
   }
   static {
-    this.shadowRootOptions = T;
+    this.shadowRootOptions = O;
   }
   static {
-    this.styles = Q;
+    this.styles = Y;
   }
   get _context() {
-    return z();
+    return q();
   }
   get _layoutContext() {
     return {
@@ -313,7 +383,7 @@ class ht extends k {
     this._initShell();
   }
   willUpdate(t) {
-    (t.has("layout") || t.has("options")) && this._init(), this.hasUpdated && t.has("isEditMode") && (this._activatedNode = void 0, this._layoutNodeEditorConfig = void 0, this.updateEditModeAnnouncement(), this.isEditMode && ct(this._layoutRef.value, "arcgis-hub-gallery, arcgis-hub-image").forEach((e) => {
+    (t.has("layout") || t.has("options")) && this._init(), this.hasUpdated && t.has("isEditMode") && (this._activatedNode = void 0, this._layoutNodeEditorConfig = void 0, this.updateEditModeAnnouncement(), this.isEditMode && ut(this._layoutRef.value, "arcgis-hub-gallery, arcgis-hub-image").forEach((e) => {
       e.lazy = !1;
     })), (!this.hasUpdated || t.has("_processedLayout") || t.has("_isLayoutValid")) && this.#t.setValue(this._layoutContext);
   }
@@ -325,7 +395,7 @@ class ht extends k {
     t.style.setProperty("--offset-top", `${t.offsetTop}px`);
   }
   async _init() {
-    const t = await st(this.layout);
+    const t = await at(this.layout);
     this._layout = f(t), this._processedLayout = await this._validateAndProcess(this._layout, this.options), this._historyStack = [this._processedLayout], this._historyIdx = 0;
   }
   async getUpdateComplete() {
@@ -338,11 +408,12 @@ class ht extends k {
     await this.updateComplete, this._liveAnnouncement = t;
   }
   async _updateLayoutNode(t, s, e, a, o, n) {
-    const r = f(this._layout), c = v(r, t);
-    c && (V(s, e, c), a && (r.variables = {
+    let r = f(this._layout);
+    const c = L(r, t);
+    c && (j(s, e, c), a && (r.variables = {
       ...r.variables,
       ...a
-    }), this._layout = r, this._processedLayout = await this._validateAndProcess(r, this.options), this._activatedNode = v(this._processedLayout, t), this._historyIdx < this._historyStack.length - 1 && (this._historyStack = this._historyStack.slice(0, this._historyIdx + 1)), this._historyStack.push(this._processedLayout), this._historyIdx = this._historyStack.length - 1, this._isLayoutValid = o, this._isNodeDirty = !0, this._isLayoutDirty = !0, n && n());
+    }), r = k(r), this._layout = r, this._processedLayout = await this._validateAndProcess(r, this.options), this._activatedNode = L(this._processedLayout, t), this._historyIdx < this._historyStack.length - 1 && (this._historyStack = this._historyStack.slice(0, this._historyIdx + 1)), this._historyStack.push(this._processedLayout), this._historyIdx = this._historyStack.length - 1, this._isLayoutValid = o, this._isNodeDirty = !0, this._isLayoutDirty = !0, n && n());
   }
   _handleNodeActivate(t) {
     const { node: s } = t.detail;
@@ -352,25 +423,25 @@ class ht extends k {
     t.detail.node.id === this._activatedNode?.id && (this._activatedNode = void 0);
   }
   async _handleLayoutNodeEditorChange(t) {
-    const { layoutNodeConfig: s, id: e, values: a, valid: o } = t.detail, n = v(this._layout, e);
+    const { layoutNodeConfig: s, id: e, values: a, valid: o } = t.detail, n = L(this._layout, e);
     if (n) {
-      const c = (H(s, "editor.valuesOutCallback") || ((d) => d))(a, { nodeId: e, valid: o }), u = c.variables;
+      const c = (U(s, "editor.valuesOutCallback") || ((l) => l))(a, { nodeId: e, valid: o }), u = c.variables;
       delete c.variables;
-      const h = n.properties || {};
-      n.properties = j(h, c), await this._updateLayoutNode(e, "properties", n.properties, u, o, () => {
+      const d = n.properties || {};
+      n.properties = B(d, c), await this._updateLayoutNode(e, "properties", n.properties, u, o, () => {
         this.arcgisHubLayoutChanged.emit();
       });
     }
   }
   async _handleLayoutNodeVisibilityChange(t) {
-    const { id: s } = t.detail, e = v(this._layout, s);
+    const { id: s } = t.detail, e = L(this._layout, s);
     e && (e.visibility || (e.visibility = { kind: "static", isHidden: !1 }), e.visibility.kind === "static" && await this._updateLayoutNode(s, "visibility", { ...e.visibility, isHidden: !e.visibility.isHidden }, void 0, !0, () => {
       this.arcgisHubLayoutChanged.emit();
     }));
   }
   async _validateAndProcess(t, s) {
-    const e = Z(t);
-    return this._layoutErrors = e, e.length > 0 && !this.debug && _.error("Layout validation errors:", e), await F(t, { ...s }, this._context);
+    const e = it(t);
+    return this._layoutErrors = e, e.length > 0 && !this.debug && _.error("Layout validation errors:", e), await G(t, { ...s }, this._context);
   }
   _handleLayoutNodeEditorOpen(t) {
     const { node: s, element: e } = t.detail;
@@ -378,38 +449,35 @@ class ht extends k {
   }
   openLayoutNodeEditor(t, s) {
     this._isEditPanelOpen = !0;
-    let e = G(t.tagName.toLowerCase(), this._layoutContext, this._context);
-    e && (e = W(this._messages, e)), this._layoutNodeEditorConfig = {
+    let e = J(t.tagName.toLowerCase(), this._layoutContext, this._context);
+    e && (e = K(this._messages, e)), this._layoutNodeEditorConfig = {
       layoutNodeConfig: f(e),
       layoutNode: f(s)
     }, this._nodeBeforeEdit = f(this._activatedNode);
   }
   async _handleLayoutAddNode(t) {
     _.debug("Add node event:", t.detail.config.tag);
-    const s = f(this._layout), { column: e, index: a } = P(t.detail.adjacentNode, s);
+    const s = f(this._layout), { column: e, index: a } = A(t.detail.adjacentNode, s);
     _.debug("Found column and index:", e, a);
     const o = {
-      id: B(),
+      id: z(),
       tag: t.detail.config.tag,
       properties: t.detail.config.defaults
     };
     e.children?.splice(a + 1, 0, o), this._layout = s, this._processedLayout = await this._validateAndProcess(s, this.options), await this.updateComplete, this._activatedNode = o;
     const n = await this._layoutRef.value?.getCardEl(o.id);
     this.openLayoutNodeEditor(n, this._activatedNode), this._historyIdx < this._historyStack.length - 1 && (this._historyStack = this._historyStack.slice(0, this._historyIdx + 1)), this._historyStack.push(this._processedLayout), this._historyIdx = this._historyStack.length - 1, this._isLayoutDirty = !0, this.arcgisHubLayoutChanged.emit(), this.hubTelemetry.emit({
-      ...N.category.interaction.action.select.label.layoutNode,
+      ...b.category.interaction.action.select.label.layoutNode,
       details: t.detail.config.name
     });
   }
   async _handleLayoutRepositionNode(t) {
-    _.debug("Reposition node event:", t.detail.node.id, t.detail.direction), this._activatedNode = void 0, t.detail.direction === "up" ? (_.debug("Moving node up..."), this._layout = lt(t.detail.node, this._layout)) : (_.debug("Moving node down..."), this._layout = dt(t.detail.node, this._layout)), this._processedLayout = await this._validateAndProcess(this._layout, this.options), await this.updateComplete, this._activatedNode = t.detail.node, (await this._layoutRef.value?.getCardEl(t.detail.node.id))?.scrollIntoView({ behavior: "smooth", block: "nearest" }), this._historyIdx < this._historyStack.length - 1 && (this._historyStack = this._historyStack.slice(0, this._historyIdx + 1)), this._historyStack.push(this._processedLayout), this._historyIdx = this._historyStack.length - 1, this._isLayoutDirty = !0, this.arcgisHubLayoutChanged.emit();
+    _.debug("Reposition node event:", t.detail.node.id, t.detail.direction), this._activatedNode = void 0, t.detail.direction === "up" ? (_.debug("Moving node up..."), this._layout = lt(t.detail.node, this._layout)) : (_.debug("Moving node down..."), this._layout = ht(t.detail.node, this._layout)), this._processedLayout = await this._validateAndProcess(this._layout, this.options), await this.updateComplete, this._activatedNode = t.detail.node, (await this._layoutRef.value?.getCardEl(t.detail.node.id))?.scrollIntoView({ behavior: "smooth", block: "nearest" }), this._historyIdx < this._historyStack.length - 1 && (this._historyStack = this._historyStack.slice(0, this._historyIdx + 1)), this._historyStack.push(this._processedLayout), this._historyIdx = this._historyStack.length - 1, this._isLayoutDirty = !0, this.arcgisHubLayoutChanged.emit();
   }
   async _handleLayoutDeleteNode(t) {
     _.debug("Delete node event:", t.detail.id);
-    const { id: s } = t.detail, e = f(this._layout), a = v(e, s);
-    if (a) {
-      const { column: o, index: n } = P(a, e);
-      o.children?.splice(n, 1), this._layout = e, this._processedLayout = await this._validateAndProcess(e, this.options), this._activatedNode = void 0, this._handleCloseEditPanel(), this._historyIdx < this._historyStack.length - 1 && (this._historyStack = this._historyStack.slice(0, this._historyIdx + 1)), this._historyStack.push(this._processedLayout), this._historyIdx = this._historyStack.length - 1, this._isLayoutDirty = !0, this.arcgisHubLayoutChanged.emit();
-    }
+    const { id: s } = t.detail, e = gt(s, this._layout);
+    this._layout = e, this._processedLayout = await this._validateAndProcess(e, this.options), this._activatedNode = void 0, this._handleCloseEditPanel(), this._historyIdx < this._historyStack.length - 1 && (this._historyStack = this._historyStack.slice(0, this._historyIdx + 1)), this._historyStack.push(this._processedLayout), this._historyIdx = this._historyStack.length - 1, this._isLayoutDirty = !0, this.arcgisHubLayoutChanged.emit();
   }
   renderEditToolbar() {
     let t;
@@ -419,7 +487,7 @@ class ht extends k {
     let t;
     if (this.isEditMode) {
       const s = this._layoutNodeEditorConfig;
-      t = p`<calcite-shell-panel .collapsed=${!this._isEditPanelOpen} position=end slot=panel-end><calcite-panel .heading=${U(s || {}, "layoutNodeConfig.i18n.label", this._messages.configurableNodes.default.label)} id=editor-panel ${x(this._setlayoutNodeEditorRef)}>${s?.layoutNodeConfig?.editor && p`<calcite-action class="panel-close" icon=x @click=${this._handleCloseEditPanel} slot=header-actions-end .text=${this._messages.close}></calcite-action>${w(s.layoutNode.id, p`<arcgis-layout-node-editor .layoutNodeConfig=${s.layoutNodeConfig} .node=${s.layoutNode}></arcgis-layout-node-editor>`)}` || ""}</calcite-panel></calcite-shell-panel>`;
+      t = p`<calcite-shell-panel .collapsed=${!this._isEditPanelOpen} position=end slot=panel-end><calcite-panel .heading=${F(s || {}, "layoutNodeConfig.i18n.label", this._messages.configurableNodes.default.label)} id=editor-panel ${R(this._setlayoutNodeEditorRef)}>${s?.layoutNodeConfig?.editor && p`<calcite-action class="panel-close" icon=x @click=${this._handleCloseEditPanel} slot=header-actions-end .text=${this._messages.close}></calcite-action>${$(s.layoutNode.id, p`<arcgis-layout-node-editor .layoutNodeConfig=${s.layoutNodeConfig} .node=${s.layoutNode}></arcgis-layout-node-editor>`)}` || ""}</calcite-panel></calcite-shell-panel>`;
     }
     return t;
   }
@@ -427,10 +495,10 @@ class ht extends k {
     return p`<calcite-dialog .heading=${this._messages.resetLayout.heading} modal @calciteDialogClose=${this._hideConfirmResetDialog} .open=${this._isConfirmResetDialogOpen} scale=s slot=dialogs><div>${this._messages.resetLayout.message}</div><calcite-button appearance=outline @click=${this._hideConfirmResetDialog} round slot=footer-end>${this._messages.resetLayout.cancelButton}</calcite-button><calcite-button @click=${this._confirmResetLayout} round slot=footer-end>${this._messages.resetLayout.confirmButton}</calcite-button></calcite-dialog>`;
   }
   render() {
-    return p`<calcite-shell>${w("aria-live-region", p`<div aria-atomic=true aria-live=polite id=arcgis-layout-container-edit-mode-live-region>${this._liveAnnouncement}</div>`)}${this.renderEditToolbar()}${this.renderEditor()}<arcgis-layout .activatedNode=${this._activatedNode} .debug=${this.debug} .isEditMode=${this.isEditMode} .layout=${this._processedLayout} .options=${this.options} ${x(this._layoutRef)}></arcgis-layout>${this.renderConfirmResetDialog()}</calcite-shell>`;
+    return p`<calcite-shell>${$("aria-live-region", p`<div aria-atomic=true aria-live=polite id=arcgis-layout-container-edit-mode-live-region>${this._liveAnnouncement}</div>`)}${this.renderEditToolbar()}${this.renderEditor()}<arcgis-layout .activatedNode=${this._activatedNode} .debug=${this.debug} .isEditMode=${this.isEditMode} .layout=${this._processedLayout} .options=${this.options} ${R(this._layoutRef)}></arcgis-layout>${this.renderConfirmResetDialog()}</calcite-shell>`;
   }
 }
-A("arcgis-layout-container", ht);
+I("arcgis-layout-container", pt);
 export {
-  ht as ArcgisLayoutContainer
+  pt as ArcgisLayoutContainer
 };

package/dist/components/arcgis-layout-editor-toolbar/customElement.js

@@ -6,8 +6,8 @@ import { focusElement as l } from "@arcgis/toolkit/dom";
 import { createRef as r, ref as n } from "lit/directives/ref.js";
 import { l as c } from "../../chunks/layoutContext.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
-See https://js.arcgis.com/0.35/esri/copyright.txt for details.
-v0.35.0 */
+See https://js.arcgis.com/0.36/esri/copyright.txt for details.
+v0.36.1 */
 const d = a`calcite-navigation{border-block-start:1px solid var(--calcite-navigation-border-color, var(--calcite-color-border-3));--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);[slot=content-end]{margin-inline-end:1rem}[slot=content-end]{display:flex}[slot=content-end]{gap:.75rem}}`;
 class u extends s {
   constructor() {