@esri/hub-web-components 0.37.2 → 0.38.0

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

@@ -1,156 +1,156 @@
-/* COPYRIGHT Esri - https://js.arcgis.com/0.37/LICENSE.txt */
-import { g as D, c as I } from "../../chunks/runtime.js";
-import { css as M, html as p } from "lit";
+/* COPYRIGHT Esri - https://js.arcgis.com/0.38/LICENSE.txt */
+import { g as T, c as I } from "../../chunks/runtime.js";
+import { css as M, html as _ } from "lit";
 import { keyed as $ } from "lit/directives/keyed.js";
-import { LitElement as T, createEvent as v, noShadowRoot as O } from "@arcgis/lumina";
-import { useContextProvider as V } from "@arcgis/lumina/context";
-import { createRef as x, ref as R } from "lit/directives/ref.js";
-import { l as H } from "../../chunks/layoutContext.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 { LitElement as O, createEvent as v, noShadowRoot as V } from "@arcgis/lumina";
+import { useContextProvider as H } from "@arcgis/lumina/context";
+import { createRef as x, ref as P } from "lit/directives/ref.js";
+import { l as j } from "../../chunks/layoutContext.js";
+import { layoutNodeTags as R, cloneObject as y, findNodeById as b, Logger as p, getWithDefault as A, LAYOUT_SCHEMA_VERSION as U, setProp as B, getProp as z, deepMerge as F, createId as q } from "@esri/hub-common";
+import { g as G } from "../../chunks/state.js";
+import { p as W } from "../../chunks/processLayout.js";
+import { c as Y, b as w, i as m, a as C } 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";
-const Y = M`@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;
-    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}`);
+import { f as S } from "../../chunks/findColumnAndNodeIndex.js";
+import { dictionary as L } from "@esri/telemetry-dictionary-hub";
+const Z = M`@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-shell-panel{font-family:Avenir Next;--calcite-color-background: #f7f7f7;--calcite-color-background-none: rgba(255, 255, 255, 0);--calcite-color-border-1: #d4d4d4;--calcite-color-border-2: #dedede;--calcite-color-border-3: #ebebeb;--calcite-color-border-ghost: rgba(0, 0, 0, .3);--calcite-color-border-input: #949494;--calcite-color-border-white: #ffffff;--calcite-color-brand: #007ac2;--calcite-color-brand-hover: #00619b;--calcite-color-brand-press: #004874;--calcite-color-brand-underline: rgba(0, 97, 155, .4);--calcite-color-focus: #007ac2;--calcite-color-foreground-1: #ffffff;--calcite-color-foreground-2: #f2f2f2;--calcite-color-foreground-3: #ebebeb;--calcite-color-foreground-current: #d6efff;--calcite-color-inverse: #363636;--calcite-color-inverse-hover: #2b2b2b;--calcite-color-inverse-press: #212121;--calcite-color-status-danger: #d83020;--calcite-color-status-danger-hover: #a82b1e;--calcite-color-status-danger-press: #7c1d13;--calcite-color-status-info: #00619b;--calcite-color-status-info-hover: #004874;--calcite-color-status-info-press: #00304d;--calcite-color-status-success: #288835;--calcite-color-status-success-hover: #1a6324;--calcite-color-status-success-press: #0d3f14;--calcite-color-status-warning: #da7c0b;--calcite-color-status-warning-hover: #c26b00;--calcite-color-status-warning-press: #9a5b10;--calcite-color-surface-1: #f7f7f7;--calcite-color-surface-2: #ffffff;--calcite-color-surface-3: #f2f2f2;--calcite-color-surface-4: #ebebeb;--calcite-color-surface-highlight: #d6efff;--calcite-color-text-1: #141414;--calcite-color-text-2: #4a4a4a;--calcite-color-text-3: #6b6b6b;--calcite-color-text-highlight: #004874;--calcite-color-text-inverse: #ffffff;--calcite-color-text-link: #00619b;--calcite-color-transparent: rgba(0, 0, 0, 0);--calcite-color-transparent-hover: rgba(0, 0, 0, .04);--calcite-color-transparent-inverse-hover: rgba(255, 255, 255, .12);--calcite-color-transparent-inverse-press: rgba(255, 255, 255, .16);--calcite-color-transparent-press: rgba(0, 0, 0, .08);--calcite-color-transparent-scrim: rgba(255, 255, 255, .85);--calcite-color-transparent-tint: rgba(255, 255, 255, .8)}calcite-panel>*{margin:1rem}calcite-panel>calcite-action.panel-close{margin:0}}}`;
+function tt(e, t) {
+  const o = ["order", "offset", "width"], i = [];
+  return o.forEach((a) => {
+    let s;
+    w(e) && (s = e.sectionProps?.[a]), m(e) && (s = e.rowProps?.[a]), C(e) && (s = e.columnProps?.[a]), typeof s == "number" ? (s < 0 || s > 12) && i.push(`Node "${e.id}": ${t} > ${a} out of range (0-12): ${s}`) : typeof s == "object" && Object.entries(s).forEach(([r, c]) => {
+      typeof c == "number" && (c < 0 || c > 12) && i.push(`Node "${e.id}": ${t} > ${a}.${r} out of range (0-12): ${c}`);
     });
-  }), e;
+  }), i;
 }
-function tt(i, t, s, e) {
+function et(e, t, o, i) {
   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(...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;
+  return e.id || a.push(`${t} > missing required id.`), e.tag || a.push(`${t} > missing required tag.`), e.id && (o.has(e.id) && a.push(`Node "${e.id}": ${t} > duplicate id: "${e.id}"`), o.add(e.id)), i.includes(e.tag) || a.push(`Node "${e.id}": ${t} > has invalid tag: ${e.tag}`), a.push(...tt(e, t)), (w(e) || m(e) || C(e)) && (!e.children || !Array.isArray(e.children) || e.children.length === 0) && a.push(`Node "${e.id}": ${t} > missing or empty children array.`), 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}]`;
+function N({ node: e, nodePath: t, idSet: o, validTags: i, errors: a }) {
+  if (e.tag === "arcgis-nav-card") {
+    const s = e.properties;
+    s && typeof s == "object" && Array.isArray(s.sections) && s.sections.forEach((c, n) => {
+      const u = `${t}.sections[${n}]`;
       N({
-        node: r,
+        node: c,
         nodePath: u,
-        idSet: s,
+        idSet: o,
         validTags: ["arcgis-layout-section"],
         errors: a
       });
     });
   }
-  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(
+  a.push(...et(e, t, o, i)), Array.isArray(e.children) && e.children.forEach((s, r) => {
+    let c = `${t}.Child[${r}]`, n = Array.from(R);
+    w(e) ? (n = ["arcgis-layout-row"], c = `${t}.Row[${r}]`) : m(e) ? (n = ["arcgis-layout-column"], c = `${t}.Column[${r}]`) : C(e) && (n = Array.from(R).filter(
       (u) => u !== "arcgis-layout-column" && u !== "arcgis-layout-section"
     )), N({
-      node: o,
-      nodePath: r,
-      idSet: s,
-      validTags: c,
+      node: s,
+      nodePath: c,
+      idSet: o,
+      validTags: n,
       errors: a
     });
   });
 }
-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 (W(e))
+function it(e) {
+  const t = [], o = /* @__PURE__ */ new Set();
+  return e ? typeof e != "object" ? (t.push("Layout must be an object."), t) : !e.sections.length || !Array.isArray(e.sections) ? (t.push("Layout must have a sections array."), t) : (e.sections.forEach((i, a) => {
+    if (Y(i))
       return;
-    const o = e, n = `Section[${a}]`;
+    const s = i, r = `Section[${a}]`;
     N({
-      node: o,
-      nodePath: n,
-      idSet: s,
+      node: s,
+      nodePath: r,
+      idSet: o,
       validTags: ["arcgis-layout-section"],
       errors: t
     });
   }), t) : (t.push("Layout must be defined."), t);
 }
-async function et(i) {
-  return i === "arcgis-text-card" ? (await import("../../chunks/migrateTextCard.js")).migrateTextCard : ((t) => t);
+async function ot(e) {
+  return e === "arcgis-text-card" ? (await import("../../chunks/migrateTextCard.js")).migrateTextCard : ((t) => t);
 }
-function st(i) {
-  const t = f(i);
+function st(e) {
+  const t = y(e);
   return t.schemaVersion = 2, t;
 }
-const ot = {
+const at = {
   2: st
 };
-async function at(i) {
-  const t = X(i, ot), s = await Promise.all(
-    t.sections.map(async (e) => await P(e))
+async function rt(e) {
+  const t = X(e, at), o = await Promise.all(
+    t.sections.map(async (i) => await k(i))
   );
-  return t.sections = s, t;
+  return t.sections = o, t;
 }
-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 P(e))
-  )), s;
+async function k(e) {
+  const o = (await ot(e.tag))(e);
+  return Array.isArray(o.children) && (o.children = await Promise.all(
+    o.children.map(async (i) => await k(i))
+  )), o;
 }
-function nt(i, t) {
-  if (i.children && t < i.children.length - 1)
-    return i.children[t + 1];
+function ct(e, t) {
+  if (e.children && t < e.children.length - 1)
+    return e.children[t + 1];
 }
-function rt(i, t) {
-  if (i.children && t > 0)
-    return i.children[t - 1];
+function nt(e, t) {
+  if (e.children && t > 0)
+    return e.children[t - 1];
 }
-function ct(i, t) {
-  if (t < i.sections.length - 1)
-    return i.sections[t + 1];
+function lt(e, t) {
+  if (t < e.sections.length - 1)
+    return e.sections[t + 1];
 }
-function dt(i, t) {
+function dt(e, t) {
   if (t > 0)
-    return i.sections[t - 1];
+    return e.sections[t - 1];
 }
-function lt(i, t) {
-  const s = f(t);
-  function e(a) {
-    for (let o = 0; o < a.sections.length; o++) {
-      const n = a.sections[o];
-      if (n.children)
-        for (let r = 0; r < n.children.length; r++) {
-          const c = n.children[r];
-          if (c.children)
-            for (let u = 0; u < c.children.length; u++) {
-              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 (l > 0) {
-                      const h = d.children[l - 1];
-                      return d.children[l - 1] = d.children[l], d.children[l] = h, !0;
+function ht(e, t) {
+  const o = y(t);
+  function i(a) {
+    for (let s = 0; s < a.sections.length; s++) {
+      const r = a.sections[s];
+      if (r.children)
+        for (let c = 0; c < r.children.length; c++) {
+          const n = r.children[c];
+          if (n.children)
+            for (let u = 0; u < n.children.length; u++) {
+              const l = n.children[u];
+              if (l.children)
+                for (let d = 0; d < l.children.length; d++) {
+                  const f = l.children[d];
+                  if (f.id === e.id)
+                    if (d > 0) {
+                      const h = l.children[d - 1];
+                      return l.children[d - 1] = l.children[d], l.children[d] = h, !0;
                     } else {
                       if (u > 0)
-                        return d.children.splice(l, 1), c.children[u - 1].children?.push(i), !0;
-                      if (r > 0) {
-                        d.children.splice(l, 1);
-                        const h = rt(n, r);
+                        return l.children.splice(d, 1), n.children[u - 1].children?.push(e), !0;
+                      if (c > 0) {
+                        l.children.splice(d, 1);
+                        const h = nt(r, c);
                         if (h?.children && h.children.length > 0)
-                          return h.children[h.children.length - 1].children?.push(i), !0;
-                      } else if (o > 0) {
-                        d.children.splice(l, 1);
-                        const h = dt(a, o);
+                          return h.children[h.children.length - 1].children?.push(e), !0;
+                      } else if (s > 0) {
+                        l.children.splice(d, 1);
+                        const h = dt(a, s);
                         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;
+                            return g.children[g.children.length - 1].children?.push(e), !0;
                         }
                       }
                     }
-                  if (y.tag === "arcgis-nav-card") {
-                    const h = y.properties?.sections;
-                    if (h && e({ sections: h }))
+                  if (f.tag === "arcgis-nav-card") {
+                    const h = f.properties?.sections;
+                    if (h && i({ sections: h }))
                       return !0;
                   }
-                  if (y.children && m(y) && e({ sections: [{ children: [y] }] }))
+                  if (f.children && m(f) && i({ sections: [{ children: [f] }] }))
                     return !0;
                 }
             }
@@ -158,50 +158,50 @@ function lt(i, t) {
     }
     return !1;
   }
-  return e(s), s;
+  return i(o), o;
 }
-function ht(i, t) {
-  const s = f(t);
-  function e(a) {
-    for (let o = 0; o < a.sections.length; o++) {
-      const n = a.sections[o];
-      if (n.children)
-        for (let r = 0; r < n.children.length; r++) {
-          const c = n.children[r];
-          if (c.children)
-            for (let u = 0; u < c.children.length; u++) {
-              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 (l < d.children.length - 1) {
-                      const h = d.children[l + 1];
-                      return d.children[l + 1] = d.children[l], d.children[l] = h, !0;
+function ut(e, t) {
+  const o = y(t);
+  function i(a) {
+    for (let s = 0; s < a.sections.length; s++) {
+      const r = a.sections[s];
+      if (r.children)
+        for (let c = 0; c < r.children.length; c++) {
+          const n = r.children[c];
+          if (n.children)
+            for (let u = 0; u < n.children.length; u++) {
+              const l = n.children[u];
+              if (l.children)
+                for (let d = 0; d < l.children.length; d++) {
+                  const f = l.children[d];
+                  if (f.id === e.id)
+                    if (d < l.children.length - 1) {
+                      const h = l.children[d + 1];
+                      return l.children[d + 1] = l.children[d], l.children[d] = h, !0;
                     } else {
-                      if (u < c.children.length - 1)
-                        return d.children.splice(l, 1), c.children[u + 1].children?.unshift(i), !0;
-                      if (r < n.children.length - 1) {
-                        d.children.splice(l, 1);
-                        const h = nt(n, r);
+                      if (u < n.children.length - 1)
+                        return l.children.splice(d, 1), n.children[u + 1].children?.unshift(e), !0;
+                      if (c < r.children.length - 1) {
+                        l.children.splice(d, 1);
+                        const h = ct(r, c);
                         if (h?.children && h.children.length > 0)
-                          return h.children[0].children?.unshift(i), !0;
-                      } else if (o < a.sections.length - 1) {
-                        d.children.splice(l, 1);
-                        const h = ct(a, o);
+                          return h.children[0].children?.unshift(e), !0;
+                      } else if (s < a.sections.length - 1) {
+                        l.children.splice(d, 1);
+                        const h = lt(a, s);
                         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;
+                            return g.children[0].children?.unshift(e), !0;
                         }
                       }
                     }
-                  if (y.tag === "arcgis-nav-card") {
-                    const h = y.properties?.sections;
-                    if (h && e({ sections: h }))
+                  if (f.tag === "arcgis-nav-card") {
+                    const h = f.properties?.sections;
+                    if (h && i({ sections: h }))
                       return !0;
                   }
-                  if (y.children && m(y) && e({ sections: [{ children: [y] }] }))
+                  if (f.children && m(f) && i({ sections: [{ children: [f] }] }))
                     return !0;
                 }
             }
@@ -209,111 +209,112 @@ function ht(i, t) {
     }
     return !1;
   }
-  return e(s), s;
+  return i(o), o;
 }
-function ut(i, t) {
-  const s = [];
-  function e(a) {
+function ft(e, t) {
+  const o = [];
+  function i(a) {
     if (a.nodeType === Node.ELEMENT_NODE) {
-      const o = a;
-      o.matches(t) && s.push(o);
-      const n = o.shadowRoot;
-      n && e(n);
-      for (const r of Array.from(o.children))
-        e(r);
+      const s = a;
+      s.matches(t) && o.push(s);
+      const r = s.shadowRoot;
+      r && i(r);
+      for (const c of Array.from(s.children))
+        i(c);
     } else if (a instanceof ShadowRoot)
-      for (const o of Array.from(a.children))
-        e(o);
+      for (const s of Array.from(a.children))
+        i(s);
   }
-  return e(i), s;
+  return i(e), o;
 }
 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);
+function gt(e) {
+  const t = /* @__PURE__ */ new Set(), o = (i) => {
+    if (typeof i == "string") {
+      for (const a of i.matchAll(yt)) {
+        const s = a[1];
+        s && t.add(s);
       }
       return;
     }
-    if (Array.isArray(e)) {
-      e.forEach((a) => s(a));
+    if (Array.isArray(i)) {
+      i.forEach((a) => o(a));
       return;
     }
-    e && typeof e == "object" && Object.values(e).forEach((a) => s(a));
+    i && typeof i == "object" && Object.values(i).forEach((a) => o(a));
   };
-  return s(i), Array.from(t);
+  return o(e), 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));
+function E(e, t) {
+  const o = [], i = /* @__PURE__ */ new Set();
+  if (!e.sections?.length)
+    return o;
+  const a = (s) => {
+    const r = { ...s };
+    delete r.children, r.tag === "arcgis-nav-card" && r.properties && (r.properties = { ...r.properties }, delete r.properties.sections), !i.has(s.id) && gt(r).includes(t) && (o.push(s), i.add(s.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;
+  for (const s of e.sections)
+    if (a(s), !!s.children) {
+      for (const r of s.children)
+        if (a(r), !!r.children) {
+          for (const c of r.children)
+            if (a(c), !!c.children)
+              for (const n of c.children) {
+                if (a(n), n.tag === "arcgis-nav-card") {
+                  const u = n.properties?.sections;
                   E(
                     { sections: u || [] },
                     t
-                  ).forEach((l) => a(l));
+                  ).forEach((d) => a(d));
                 }
-                m(c) && c.children && E(
+                m(n) && n.children && E(
                   {
-                    sections: [{ children: [c] }]
+                    sections: [{ children: [n] }]
                   },
                   t
-                ).forEach((d) => a(d));
+                ).forEach((l) => a(l));
               }
         }
     }
-  return s;
+  return o;
 }
-function k(i) {
-  const t = f(i);
-  return Object.keys(t.variables || {}).forEach((e) => {
-    E(t, e).length === 0 && delete t.variables?.[e];
+function D(e) {
+  const t = y(e);
+  return Object.keys(t.variables || {}).forEach((i) => {
+    E(t, i).length === 0 && delete t.variables?.[i];
   }), t;
 }
-function gt(i, t) {
-  let s = f(t);
-  const e = L(s, i);
-  if (e) {
-    const a = A(e, s);
+function pt(e, t) {
+  let o = y(t);
+  const i = b(o, e);
+  if (i) {
+    const a = S(i, o);
     if (a) {
-      const { column: o, index: n } = a;
-      o.children?.splice(n, 1);
+      const { column: s, index: r } = a;
+      s.children?.splice(r, 1);
     }
-    s = k(s);
+    o = D(o);
   }
-  return s;
+  return o;
 }
-class pt extends T {
+class _t extends O {
   constructor() {
-    super(), this._messages = Q({ blocking: !0 }), this.#t = V({ context: H }), this._isNodeDirty = !1, this._layoutRef = x(), this._layoutNodeEditorRef = x(), this._handleExitEditMode = async (t) => {
+    super(), this._messages = Q({ blocking: !0 }), this.#t = H({ context: j }), 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({
-        layout: this._layout,
+        layout: this._activeLayout,
         successCallback: () => {
           this._isLayoutDirty = !1;
         }
       });
     }, this._resetLayout = async (t) => {
-      t.stopPropagation(), this._isConfirmResetDialogOpen = !0, this.hubTelemetry.emit(b.category.interaction.action.open.label.modal.details.resetToDefault);
+      t.stopPropagation(), this._isConfirmResetDialogOpen = !0, this.hubTelemetry.emit(L.category.interaction.action.open.label.modal.details.resetToDefault);
     }, this._confirmResetLayout = () => {
       this._hideConfirmResetDialog(), this.arcgisHubLayoutReset.emit({
+        type: this._activeLayoutType,
         successCallback: () => {
-          this._isLayoutDirty = !0, this.hubTelemetry.emit(b.category.interaction.action.select.label.layout.details.default);
+          this._isLayoutDirty = !0, this.hubTelemetry.emit(L.category.interaction.action.select.label.layout.details.default);
         }
       });
     }, this._handleCloseEditPanel = async () => {
@@ -323,15 +324,15 @@ class pt extends T {
         await this._updateLayoutNode(this._nodeBeforeEdit.id, "properties", this._nodeBeforeEdit.properties, void 0, !0);
       }
       this._isEditPanelOpen = !1, this._nodeBeforeEdit = void 0, this.hubTelemetry.emit({
-        ...b.category.interaction.action.close.label.sidePanel,
+        ...L.category.interaction.action.close.label.sidePanel,
         details: this._layoutNodeEditorConfig?.layoutNodeConfig?.name || "unknown"
       });
     }, this._setlayoutNodeEditorRef = async (t) => {
-      await this.updateComplete, await new Promise((s) => setTimeout(s, 100)), this.#t.setValue({
+      await this.updateComplete, await new Promise((o) => setTimeout(o, 100)), this.#t.setValue({
         ...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 = v(), this.arcgisHubLayoutEditorExit = v(), this.arcgisHubLayoutPublished = v(), this.arcgisHubLayoutReset = v(), this.hubTelemetry = v(), 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._activeLayoutType = "body", 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);
@@ -348,22 +349,22 @@ class pt extends T {
     }), this.listen("arcgisLayoutDeleteNode", async (t) => await this._handleLayoutDeleteNode(t)), this.listenOn(window, "resize", this._initShell);
   }
   static {
-    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 };
+    this.properties = { _isConfirmResetDialogOpen: 16, _liveAnnouncement: 16, _activeProcessedLayout: 16, _layoutErrors: 16, _activatedNode: 16, _layoutNodeEditorConfig: 16, _historyStack: 16, _historyIdx: 16, _isLayoutDirty: 16, _isLayoutValid: 16, _isEditPanelOpen: 16, _activeLayoutType: 16, layouts: 0, debug: 7, isEditMode: 7, isPublishing: 5, options: 0 };
   }
   static {
-    this.shadowRootOptions = O;
+    this.shadowRootOptions = V;
   }
   static {
-    this.styles = Y;
+    this.styles = Z;
   }
   get _context() {
-    return q();
+    return G();
   }
   get _layoutContext() {
     return {
-      assetPath: D("assets/layout-container/"),
+      assetPath: T("assets/layout-container/"),
       messages: this._messages,
-      layout: this._processedLayout,
+      layout: this._activeProcessedLayout,
       // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
       layoutNodeEditorRef: this.#t.value?.layoutNodeEditorRef,
       isLayoutValid: this._isLayoutValid,
@@ -375,9 +376,9 @@ class pt extends T {
     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 && 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);
+    (t.has("layouts") || t.has("options")) && this._init(), this.hasUpdated && t.has("isEditMode") && (this._activatedNode = void 0, this._layoutNodeEditorConfig = void 0, this.updateEditModeAnnouncement(), this.isEditMode && ft(this._layoutRef.value, "arcgis-hub-gallery, arcgis-hub-image").forEach((i) => {
+      i.lazy = !1;
+    })), (!this.hasUpdated || t.has("_activeProcessedLayout") || t.has("_isLayoutValid")) && this.#t.setValue(this._layoutContext);
   }
   _hideConfirmResetDialog() {
     this._isConfirmResetDialogOpen = !1;
@@ -387,110 +388,126 @@ class pt extends T {
     t.style.setProperty("--offset-top", `${t.offsetTop}px`);
   }
   async _init() {
-    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;
+    const t = await Promise.all(Object.entries(this.layouts).map(async ([a, s]) => {
+      let r, c;
+      try {
+        r = await rt(s), c = await this._validateAndProcess(r, this.options);
+      } catch (n) {
+        p.error(`Error migrating and processing ${A(s, "type", "")} layout >>>`, n), r = {
+          schemaVersion: U,
+          type: a,
+          sections: [],
+          history: []
+        }, c = r;
+      }
+      return { migratedLayout: r, processedLayout: c };
+    })), o = {}, i = {};
+    t.forEach(({ migratedLayout: a, processedLayout: s }) => {
+      const r = a.type;
+      o[r] = a, i[r] = s;
+    }), this._activeLayout = o[this._activeLayoutType], this._activeProcessedLayout = i[this._activeLayoutType], this._historyStack = [this._activeProcessedLayout], this._historyIdx = 0;
   }
   async getUpdateComplete() {
     const t = await super.getUpdateComplete();
-    return await this._layoutRef.value?.updateComplete, await new Promise((s) => setTimeout(s, 150)), t;
+    return await this._layoutRef.value?.updateComplete, await new Promise((o) => setTimeout(o, 150)), t;
   }
   async updateEditModeAnnouncement() {
     this._liveAnnouncement = "";
     const t = this.isEditMode ? this._messages.editModeActivatedLiveRegion : this._messages.editModeDeactivatedLiveRegion;
     await this.updateComplete, this._liveAnnouncement = t;
   }
-  async _updateLayoutNode(t, s, e, a, o, n) {
-    let r = f(this._layout);
-    const c = L(r, t);
-    c && (j(s, e, c), a && (r.variables = {
-      ...r.variables,
+  async _updateLayoutNode(t, o, i, a, s, r) {
+    let c = y(this._activeLayout);
+    const n = b(c, t);
+    n && (B(o, i, n), a && (c.variables = {
+      ...c.variables,
       ...a
-    }), 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());
+    }), c = D(c), this._activeLayout = c, this._activeProcessedLayout = await this._validateAndProcess(c, this.options), this._activatedNode = b(this._activeProcessedLayout, t), this._historyIdx < this._historyStack.length - 1 && (this._historyStack = this._historyStack.slice(0, this._historyIdx + 1)), this._historyStack.push(this._activeProcessedLayout), this._historyIdx = this._historyStack.length - 1, this._isLayoutValid = s, this._isNodeDirty = !0, this._isLayoutDirty = !0, r && r());
   }
   _handleNodeActivate(t) {
-    const { node: s } = t.detail;
-    this._activatedNode = s;
+    const { node: o } = t.detail;
+    this._activatedNode = o;
   }
   _handleNodeDeactivate(t) {
     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 = L(this._layout, e);
-    if (n) {
-      const c = (U(s, "editor.valuesOutCallback") || ((l) => l))(a, { nodeId: e, valid: o }), u = c.variables;
-      delete c.variables;
-      const d = n.properties || {};
-      n.properties = B(d, c), await this._updateLayoutNode(e, "properties", n.properties, u, o, () => {
+    const { layoutNodeConfig: o, id: i, values: a, valid: s } = t.detail, r = b(this._activeLayout, i);
+    if (r) {
+      const n = (z(o, "editor.valuesOutCallback") || ((d) => d))(a, { nodeId: i, valid: s }), u = n.variables;
+      delete n.variables;
+      const l = r.properties || {};
+      r.properties = F(l, n), await this._updateLayoutNode(i, "properties", r.properties, u, s, () => {
         this.arcgisHubLayoutChanged.emit();
       });
     }
   }
   async _handleLayoutNodeVisibilityChange(t) {
-    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, () => {
+    const { id: o } = t.detail, i = b(this._activeLayout, o);
+    i && (i.visibility || (i.visibility = { kind: "static", isHidden: !1 }), i.visibility.kind === "static" && await this._updateLayoutNode(o, "visibility", { ...i.visibility, isHidden: !i.visibility.isHidden }, void 0, !0, () => {
       this.arcgisHubLayoutChanged.emit();
     }));
   }
-  async _validateAndProcess(t, s) {
-    const e = it(t);
-    return this._layoutErrors = e, e.length > 0 && !this.debug && _.error("Layout validation errors:", e), await G(t, { ...s }, this._context);
+  async _validateAndProcess(t, o) {
+    const i = it(t);
+    return this._layoutErrors = i, i.length > 0 && !this.debug && p.error("Layout validation errors:", i), await W(t, { ...o }, this._context);
   }
   _handleLayoutNodeEditorOpen(t) {
-    const { node: s, element: e } = t.detail;
-    this.openLayoutNodeEditor(e, s);
+    const { node: o, element: i } = t.detail;
+    this.openLayoutNodeEditor(i, o);
   }
-  openLayoutNodeEditor(t, s) {
+  openLayoutNodeEditor(t, o) {
     this._isEditPanelOpen = !0;
-    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);
+    let i = J(t.tagName.toLowerCase(), this._layoutContext, this._context);
+    i && (i = K(this._messages, i)), this._layoutNodeEditorConfig = {
+      layoutNodeConfig: y(i),
+      layoutNode: y(o)
+    }, this._nodeBeforeEdit = y(this._activatedNode);
   }
   async _handleLayoutAddNode(t) {
-    _.debug("Add node event:", t.detail.config.tag);
-    const s = f(this._layout), { column: e, index: a } = A(t.detail.adjacentNode, s);
-    _.debug("Found column and index:", e, a);
-    const o = {
-      id: z(),
+    p.debug("Add node event:", t.detail.config.tag);
+    const o = y(this._activeLayout), { column: i, index: a } = S(t.detail.adjacentNode, o);
+    p.debug("Found column and index:", i, a);
+    const s = {
+      id: q(),
       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({
-      ...b.category.interaction.action.select.label.layoutNode,
+    i.children?.splice(a + 1, 0, s), this._activeLayout = o, this._activeProcessedLayout = await this._validateAndProcess(o, this.options), await this.updateComplete, this._activatedNode = s;
+    const r = await this._layoutRef.value?.getCardEl(s.id);
+    this.openLayoutNodeEditor(r, this._activatedNode), this._historyIdx < this._historyStack.length - 1 && (this._historyStack = this._historyStack.slice(0, this._historyIdx + 1)), this._historyStack.push(this._activeProcessedLayout), this._historyIdx = this._historyStack.length - 1, this._isLayoutDirty = !0, this.arcgisHubLayoutChanged.emit(), this.hubTelemetry.emit({
+      ...L.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 = 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();
+    p.debug("Reposition node event:", t.detail.node.id, t.detail.direction), this._activatedNode = void 0, t.detail.direction === "up" ? (p.debug("Moving node up..."), this._activeLayout = ht(t.detail.node, this._activeLayout)) : (p.debug("Moving node down..."), this._activeLayout = ut(t.detail.node, this._activeLayout)), this._activeProcessedLayout = await this._validateAndProcess(this._activeLayout, 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._activeProcessedLayout), 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 = 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();
+    p.debug("Delete node event:", t.detail.id);
+    const { id: o } = t.detail, i = pt(o, this._activeLayout);
+    this._activeLayout = i, this._activeProcessedLayout = await this._validateAndProcess(i, 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._activeProcessedLayout), this._historyIdx = this._historyStack.length - 1, this._isLayoutDirty = !0, this.arcgisHubLayoutChanged.emit();
   }
   renderEditToolbar() {
     let t;
-    return this.isEditMode && (t = p`<arcgis-layout-editor-toolbar .exitEditMode=${this._handleExitEditMode} .isLayoutDirty=${this._isLayoutDirty} .isLayoutValid=${this._isLayoutValid} .isPublishing=${this.isPublishing} .publishLayout=${this._handlePublishLayout} .resetLayout=${this._resetLayout} slot=header></arcgis-layout-editor-toolbar>`), t;
+    return this.isEditMode && (t = _`<arcgis-layout-editor-toolbar .exitEditMode=${this._handleExitEditMode} .isLayoutDirty=${this._isLayoutDirty} .isLayoutValid=${this._isLayoutValid} .isPublishing=${this.isPublishing} .publishLayout=${this._handlePublishLayout} .resetLayout=${this._resetLayout} slot=header></arcgis-layout-editor-toolbar>`), t;
   }
   renderEditor() {
     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=${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>`;
+      const o = this._layoutNodeEditorConfig;
+      t = _`<calcite-shell-panel .collapsed=${!this._isEditPanelOpen} position=end slot=panel-end><calcite-panel .heading=${A(o || {}, "layoutNodeConfig.i18n.label", this._messages.configurableNodes.default.label)} id=editor-panel ${P(this._setlayoutNodeEditorRef)}>${o?.layoutNodeConfig?.editor && _`<calcite-action class="panel-close" icon=x @click=${this._handleCloseEditPanel} slot=header-actions-end .text=${this._messages.close}></calcite-action>${$(o.layoutNode.id, _`<arcgis-layout-node-editor .layoutNodeConfig=${o.layoutNodeConfig} .node=${o.layoutNode}></arcgis-layout-node-editor>`)}` || ""}</calcite-panel></calcite-shell-panel>`;
     }
     return t;
   }
   renderConfirmResetDialog() {
-    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>`;
+    return _`<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>${$("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>`;
+    return _`<calcite-shell>${$("aria-live-region", _`<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._activeProcessedLayout} .options=${this.options} ${P(this._layoutRef)}></arcgis-layout>${this.renderConfirmResetDialog()}</calcite-shell>`;
   }
 }
-I("arcgis-layout-container", pt);
+I("arcgis-layout-container", _t);
 export {
-  pt as ArcgisLayoutContainer
+  _t as ArcgisLayoutContainer
 };