@trunkjs/content-pane 1.0.6 → 1.0.8

package/CHANGELOG.md

@@ -1,3 +1,11 @@
+## 1.0.8 (2025-08-29)
+
+This was a version bump only for content-pane to align it with other projects, there were no code changes.
+
+## 1.0.7 (2025-08-29)
+
+This was a version bump only for content-pane to align it with other projects, there were no code changes.
+
 ## 1.0.6 (2025-08-29)
 
 This was a version bump only for content-pane to align it with other projects, there were no code changes.

package/components/tj-content-pane/TjContentPane.d.ts

@@ -1,9 +1,9 @@
 import { ReactiveElement } from 'lit';
 declare const ContentAreaElement2_base: (abstract new (...args: any[]) => {
-    "__#2684@#debugCached": boolean | null;
-    "__#2684@#myElementId": number;
+    "__#2794@#debugCached": boolean | null;
+    "__#2794@#myElementId": number;
     invalidateDebugCache(): void;
-    "__#2684@#myLoggerInstance": import('../../../../browser-utils/src/index.ts').Logger | null;
+    "__#2794@#myLoggerInstance": import('../../../../browser-utils/src/index.ts').Logger | null;
     readonly _debug: boolean;
     getLogger(instanceId?: string): import('../../../../browser-utils/src/index.ts').Logger;
     log(...args: any[]): void;
@@ -15,6 +15,7 @@ export declare class ContentAreaElement2 extends ContentAreaElement2_base {
     static get is(): string;
     createRenderRoot(): HTMLElement | DocumentFragment;
     constructor();
+    arrange(): void;
     connectedCallback(): Promise<void>;
 }
 export {};

package/components/tj-error-element/ErrorElement.d.ts

@@ -2,7 +2,7 @@ import { LitElement } from 'lit';
 export declare class TjErrorElement extends LitElement {
     static styles: import('lit').CSSResult[];
     private originalCode?;
-    private message;
+    accessor message: string;
     static get is(): string;
     constructor(message?: string, originalCode?: string);
     render(): import('lit-html').TemplateResult<1>;

package/index.js

@@ -1,94 +1,33 @@
-var C = Object.defineProperty;
-var _ = (n, t, r) => t in n ? C(n, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : n[t] = r;
-var h = (n, t, r) => _(n, typeof t != "symbol" ? t + "" : t, r);
-import { unsafeCSS as E, LitElement as A, html as N, ReactiveElement as I } from "lit";
-import { property as L, customElement as y } from "lit/decorators.js";
-import { create_element as b, LoggingMixin as k, Stopwatch as T, waitForDomContentLoaded as P } from "@trunkjs/browser-utils";
-function V(n) {
-  return n && typeof n == "object" && "__I__" in n && typeof n.__I__ == "object" && "i" in n.__I__;
-}
-class S {
-  constructor(t, r = !1) {
-    h(this, "rootNode");
-    h(this, "currentContainerNode", null);
-    h(this, "containerPath", []);
-    h(this, "containerIndex", [0]);
-    h(this, "lastFixedI", 20);
-    this.debug = r, this.currentContainerNode = this.rootNode = t, this.containerPath.push(this.rootNode);
-  }
-  getI(t) {
-    const r = t.tagName, o = t.getAttribute("layout"), e = { i: -99, variant: "new", tag: "hr", hi: null };
-    if (o) {
-      const s = /^(\+|-|)([0-9]\.?[0-9]?|)(;|$)/, i = o.match(s);
-      i && (console.debug("Layout matches", i), e.variant = i[1] === "+" ? "append" : i[1] === "-" ? "skip" : "new", i[2] !== "" && (e.i = parseFloat(i[2]) * 10));
-    }
-    if (r.startsWith("H") && r.length === 2) {
-      let s = r.substring(1);
-      return e.tag = "h", e.hi = parseInt(s), s === "1" && (s = "2"), e.i === -99 && (e.i = parseInt(s) * 10, this.lastFixedI = e.i), e;
-    }
-    return e.i === -99 && r === "HR" ? (e.i = this.lastFixedI + 5, e) : null;
-  }
-  getAttributeRecords(t, r = !1) {
-    const o = {};
-    for (const e of t.attributes)
-      e.name.startsWith("section-") ? o[e.name] = e.value.replace(/^section-/, "") : e.name.startsWith("layout") ? (o[e.name] = e.value, t.removeAttribute(e.name)) : r && (o[e.name] = e.value);
-    if (!r)
-      for (const e of Array.from(t.classList))
-        e.startsWith("section-") && (o.class = (o.class || "") + " " + e.replace(/^section-/, ""), t.classList.remove(e));
-    return o;
-  }
-  createNewContainerNode(t, r) {
-    const o = this.getAttributeRecords(t, t.tagName === "HR"), e = b("section", o);
-    return e.__IT = r, e;
-  }
-  arrangeSingleNode(t, r) {
-    r.i;
-    let o = 0;
-    for (o = 0; o < this.containerIndex.length && !(this.containerIndex[o] >= r.i); o++)
-      ;
-    let e = null;
-    r.variant === "append" ? (console.log("Appending to container at index", o, "with i", r.i), e = this.containerPath[o]) : e = this.createNewContainerNode(t, r);
-    const s = this.containerPath[o - 1];
-    this.containerPath.length = o, this.containerIndex.length = o, e.appendChild(t), s.appendChild(e), this.containerPath.push(e), this.containerIndex.push(r.i), this.currentContainerNode = e;
-  }
-  appendToCurrentContainer(t) {
-    if (this.currentContainerNode === null)
-      throw new Error("No current container node set");
-    this.currentContainerNode.appendChild(t);
-  }
-  arrange(t) {
-    for (let r of t) {
-      if (r.nodeType !== Node.ELEMENT_NODE) {
-        this.appendToCurrentContainer(r);
-        continue;
-      }
-      const o = r, e = this.getI(o);
-      if (!e || e.variant === "skip") {
-        this.appendToCurrentContainer(r);
-        continue;
-      }
-      this.arrangeSingleNode(o, e);
-    }
-  }
-}
-const $ = ":host{--border-color: red;--background-color: lightgray;font-family:Arial,sans-serif}#error-fixed-indicator{position:fixed;top:10px;right:10px;cursor:pointer;z-index:100000;padding:5px 10px;width:auto;max-width:90vw;min-width:100px;height:auto;box-shadow:0 4px 8px #0003;border:5px solid white;color:#fff;background-color:red;animation:blink 1s infinite;border-radius:15px;font-size:20px;font-weight:700;font-family:Arial,sans-serif}@keyframes blink{0%,to{background-color:#000}50%{background-color:red}}#error{background-color:var(--background-color);border:3px solid var(--border-color);padding:10px;margin:10px;border-radius:5px}h1{color:red;font-size:24px;margin:0}.error-details{font-size:14px;max-height:200px;overflow:auto}";
-var w = Object.defineProperty, M = Object.getOwnPropertyDescriptor, O = (n, t, r) => t in n ? w(n, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : n[t] = r, v = (n, t, r, o) => {
-  for (var e = o > 1 ? void 0 : o ? M(t, r) : t, s = n.length - 1, i; s >= 0; s--)
-    (i = n[s]) && (e = (o ? i(t, r, e) : i(e)) || e);
-  return o && e && w(t, r, e), e;
-}, R = (n, t, r) => O(n, t + "", r);
-let f = class extends A {
-  constructor(t = "An error occurred", r) {
-    super();
-    h(this, "originalCode");
-    h(this, "message");
-    this.message = t, this.originalCode = r;
+import { create_element as F, LoggingMixin as U, Stopwatch as X, waitForDomContentLoaded as Y } from "@trunkjs/browser-utils";
+import { html as Z, unsafeCSS as ee, LitElement as te, ReactiveElement as re } from "lit";
+import { customElement as R, property as ne } from "lit/decorators.js";
+const oe = ":host{--border-color: red;--background-color: lightgray;font-family:Arial,sans-serif}#error-fixed-indicator{position:fixed;top:10px;right:10px;cursor:pointer;z-index:100000;padding:5px 10px;width:auto;max-width:90vw;min-width:100px;height:auto;box-shadow:0 4px 8px #0003;border:5px solid white;color:#fff;background-color:red;animation:blink 1s infinite;border-radius:15px;font-size:20px;font-weight:700;font-family:Arial,sans-serif}@keyframes blink{0%,to{background-color:#000}50%{background-color:red}}#error{background-color:var(--background-color);border:3px solid var(--border-color);padding:10px;margin:10px;border-radius:5px}h1{color:red;font-size:24px;margin:0}.error-details{font-size:14px;max-height:200px;overflow:auto}";
+var ie = Object.create, I = Object.defineProperty, ae = Object.getOwnPropertyDescriptor, W = (e, t) => (t = Symbol[e]) ? t : Symbol.for("Symbol." + e), y = (e) => {
+  throw TypeError(e);
+}, se = (e, t, n) => t in e ? I(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n, z = (e, t) => I(e, "name", { value: t, configurable: !0 }), ce = (e) => [, , , ie((e == null ? void 0 : e[W("metadata")]) ?? null)], j = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"], w = (e) => e !== void 0 && typeof e != "function" ? y("Function expected") : e, le = (e, t, n, o, r) => ({ kind: j[e], name: t, metadata: o, addInitializer: (i) => n._ ? y("Already initialized") : r.push(w(i || null)) }), de = (e, t) => se(t, W("metadata"), e[3]), E = (e, t, n, o) => {
+  for (var r = 0, i = e[t >> 1], s = i && i.length; r < s; r++) t & 1 ? i[r].call(n) : o = i[r].call(n, o);
+  return o;
+}, D = (e, t, n, o, r, i) => {
+  var s, c, h, l, d, a = t & 7, f = !!(t & 8), u = !!(t & 16), v = a > 3 ? e.length + 1 : a ? f ? 1 : 2 : 0, L = j[a + 5], P = a > 3 && (e[v - 1] = []), Q = e[v] || (e[v] = []), _ = a && (!u && !f && (r = r.prototype), a < 5 && (a > 3 || !u) && ae(a < 4 ? r : { get [n]() {
+    return O(this, i);
+  }, set [n](p) {
+    return M(this, i, p);
+  } }, n));
+  a ? u && a < 4 && z(i, (a > 2 ? "set " : a > 1 ? "get " : "") + n) : z(r, n);
+  for (var x = o.length - 1; x >= 0; x--)
+    l = le(a, n, h = {}, e[3], Q), a && (l.static = f, l.private = u, d = l.access = { has: u ? (p) => ue(r, p) : (p) => n in p }, a ^ 3 && (d.get = u ? (p) => (a ^ 1 ? O : pe)(p, r, a ^ 4 ? i : _.get) : (p) => p[n]), a > 2 && (d.set = u ? (p, C) => M(p, r, C, a ^ 4 ? i : _.set) : (p, C) => p[n] = C)), c = (0, o[x])(a ? a < 4 ? u ? i : _[L] : a > 4 ? void 0 : { get: _.get, set: _.set } : r, l), h._ = 1, a ^ 4 || c === void 0 ? w(c) && (a > 4 ? P.unshift(c) : a ? u ? i = c : _[L] = c : r = c) : typeof c != "object" || c === null ? y("Object expected") : (w(s = c.get) && (_.get = s), w(s = c.set) && (_.set = s), w(s = c.init) && P.unshift(s));
+  return a || de(e, r), _ && I(r, n, _), u ? a ^ 4 ? i : _ : r;
+}, S = (e, t, n) => t.has(e) || y("Cannot " + n), ue = (e, t) => Object(t) !== t ? y('Cannot use the "in" operator on this value') : e.has(t), O = (e, t, n) => (S(e, t, "read from private field"), n ? n.call(e) : t.get(e)), he = (e, t, n) => t.has(e) ? y("Cannot add the same private member more than once") : t instanceof WeakSet ? t.add(e) : t.set(e, n), M = (e, t, n, o) => (S(e, t, "write to private field"), o ? o.call(e, n) : t.set(e, n), n), pe = (e, t, n) => (S(e, t, "access private method"), n), B, b, H, g, $;
+H = [R("tj-error-element")];
+class m extends (b = te, B = [ne({ type: String, reflect: !0 })], b) {
+  constructor(t = "An error occurred", n) {
+    super(), this.originalCode = void 0, he(this, $, E(g, 8, this)), E(g, 11, this), this.message = t, this.originalCode = n;
   }
   static get is() {
     return "tj-error-element";
   }
   render() {
-    return N`
+    return Z`
       <div id="error-fixed-indicator" @click=${() => this.scrollIntoView({ behavior: "smooth" })}>
         Err: ${this.message}
       </div>
@@ -103,87 +42,156 @@ let f = class extends A {
       </div>
     `;
   }
-};
-R(f, "styles", [E($)]);
-v([
-  L({ type: String, reflect: !0 })
-], f.prototype, "message", 2);
-f = v([
-  y("tj-error-element")
-], f);
-function j(n, { allowAttributes: t = !0, ignoreGaps: r = !0 } = {}) {
-  let o = "div", e = null, s = [], i = [], l = {};
-  const d = /(^[a-z][\w-]*)|#[\w-]+|\.[\w:-]+|\[\s*([\w-]+)(?:\s*=\s*(['"]?)(.*?)\3)?\s*\]/gi;
-  let a = 0;
+}
+g = ce(b);
+$ = /* @__PURE__ */ new WeakMap();
+D(g, 4, "message", B, m, $);
+m = D(g, 0, "TjErrorElement", H, m);
+m.styles = [ee(oe)];
+E(g, 1, m);
+function fe(e, { allowAttributes: t = !0, ignoreGaps: n = !0 } = {}) {
+  let o = "div", r = null, i = [], s = [], c = {};
+  const h = /(^[a-z][\w-]*)|#[\w-]+|\.[\w:-]+|\[\s*([\w-]+)(?:\s*=\s*(['"]?)(.*?)\3)?\s*\]/gi;
+  let l = 0;
   for (; ; ) {
-    const u = d.exec(n);
-    if (!u || u.index !== a) {
-      if (!r && u && u.index > a)
+    const d = h.exec(e);
+    if (!d || d.index !== l) {
+      if (!n && d && d.index > l)
         break;
       break;
     }
-    const c = u[0];
-    if (c[0] === "#") e = c.slice(1);
-    else if (c[0] === ".") s.push(c.slice(1));
-    else if (c[0] === "[") {
-      if (!t) throw new Error(`Attributes not allowed: '${c}'`);
-      const p = u[2], m = u[4] || void 0;
-      i.push({ name: p, value: m }), l[p] = m;
-    } else o = c;
-    a += c.length;
-  }
-  return { tag: o, id: e, classes: s, attrs: i, attrsMap: l, length: a, rest: n.slice(a) };
+    const a = d[0];
+    if (a[0] === "#") r = a.slice(1);
+    else if (a[0] === ".") i.push(a.slice(1));
+    else if (a[0] === "[") {
+      if (!t) throw new Error(`Attributes not allowed: '${a}'`);
+      const f = d[2], u = d[4] || void 0;
+      s.push({ name: f, value: u }), c[f] = u;
+    } else o = a;
+    l += a.length;
+  }
+  return { tag: o, id: r, classes: i, attrs: s, attrsMap: c, length: l, rest: e.slice(l) };
 }
-function D(n) {
-  return typeof n.beforeLayoutCallback == "function";
+function _e(e) {
+  return typeof e.beforeLayoutCallback == "function";
 }
-function F(n, t, r) {
-  var u, c;
-  console.log("Applying layout to element:", n, "with layout:", r);
-  const o = /^(\+|-|)([0-9]+\.?[0-9]*);?/, e = r.replace(o, ""), s = j(e), i = { class: "" };
-  s.attrsMap.class && (i.class = s.attrsMap.class + " "), i.class += s.classes.join(" "), i.id = s.id, ((u = i.class) == null ? void 0 : u.trim()) === "" && delete i.class, ((c = i.id) == null ? void 0 : c.trim()) === "" && delete i.id;
-  const l = s.tag || "div";
-  let d = !1, a = b(l, { ...i, layoutOrig: r });
-  if (l.includes("-") && !customElements.get(l))
-    console.warn(`Custom element <${l}> is not registered.`), a = new f(`Custom element <${l}> is not registered.`, n.outerHTML), n.replaceWith(a), a.append(n), d = !0;
+function ve(e, t, n) {
+  var d, a;
+  console.log("Applying layout to element:", e, "with layout:", n);
+  const o = /^(\+|-|)([0-9]+\.?[0-9]*);?/, r = n.replace(o, ""), i = fe(r), s = { class: "" };
+  i.attrsMap.class && (s.class = i.attrsMap.class + " "), s.class += i.classes.join(" "), s.id = i.id, ((d = s.class) == null ? void 0 : d.trim()) === "" && delete s.class, ((a = s.id) == null ? void 0 : a.trim()) === "" && delete s.id;
+  const c = i.tag || "div";
+  let h = !1, l = F(c, { ...s, layoutOrig: n });
+  if (c.includes("-") && !customElements.get(c))
+    console.warn(`Custom element <${c}> is not registered.`), l = new m(`Custom element <${c}> is not registered.`, e.outerHTML), e.replaceWith(l), l.append(e), h = !0;
   else {
-    const p = Array.from(n.children);
-    D(a) && (d = a.beforeLayoutCallback(n, a, p) === !1), console.log(
+    const f = Array.from(e.children);
+    _e(l) && (h = l.beforeLayoutCallback(e, l, f) === !1), console.log(
       "Replacement element created:",
-      a,
+      l,
       "with children:",
-      p,
+      f,
       "skipChildren:",
-      d
-    ), a.__ORIG_ELEMENT__ = n, a.append(...Array.from(n.children)), n.replaceWith(a);
+      h
+    ), l.__ORIG_ELEMENT__ = e, l.append(...Array.from(e.children)), e.replaceWith(l);
   }
   return {
-    replacementElement: a,
-    skipChildren: d
+    replacementElement: l,
+    skipChildren: h
   };
 }
-function g(n, t = {}) {
-  console.log("applyLayout called with element:", n, "and options:", t);
-  const { recursive: r = !0 } = t;
+function k(e, t = {}) {
+  console.log("applyLayout called with element:", e, "and options:", t);
+  const { recursive: n = !0 } = t;
   let o = [];
-  if (Array.isArray(n))
-    return n.forEach((l) => o.push(...g(l, t))), o;
-  if (!(n instanceof HTMLElement))
+  if (Array.isArray(e))
+    return e.forEach((c) => o.push(...k(c, t))), o;
+  if (!(e instanceof HTMLElement))
     return [];
-  const e = n.getAttribute("layout");
-  let s = !1, i = n;
-  if (e && ({ replacementElement: i, skipChildren: s } = F(n, t, e)), r && !s) {
-    const l = Array.from(i.children);
-    console.log("Applying layout to children:", l, "of element:", i), l.forEach((d) => o.push(...g(d, t)));
+  const r = e.getAttribute("layout");
+  let i = !1, s = e;
+  if (r && ({ replacementElement: s, skipChildren: i } = ve(e, t, r)), n && !i) {
+    const c = Array.from(s.children);
+    console.log("Applying layout to children:", c, "of element:", s), c.forEach((h) => o.push(...k(h, t)));
   }
   return o;
 }
-var W = Object.getOwnPropertyDescriptor, z = (n, t, r, o) => {
-  for (var e = o > 1 ? void 0 : o ? W(t, r) : t, s = n.length - 1, i; s >= 0; s--)
-    (i = n[s]) && (e = i(e) || e);
-  return e;
-};
-let x = class extends k(I) {
+function Te(e) {
+  return e && typeof e == "object" && "__I__" in e && typeof e.__I__ == "object" && "i" in e.__I__;
+}
+class ge {
+  constructor(t, n = !1) {
+    this.debug = n, this.currentContainerNode = null, this.containerPath = [], this.containerIndex = [0], this.lastFixedI = 20, this.currentContainerNode = this.rootNode = t, this.containerPath.push(this.rootNode);
+  }
+  getI(t) {
+    const n = t.tagName, o = t.getAttribute("layout"), r = { i: -99, variant: "new", tag: "hr", hi: null };
+    if (o) {
+      const i = /^(\+|-|)([0-9]\.?[0-9]?|)(;|$)/, s = o.match(i);
+      s && (console.debug("Layout matches", s), r.variant = s[1] === "+" ? "append" : s[1] === "-" ? "skip" : "new", s[2] !== "" && (r.i = parseFloat(s[2]) * 10));
+    }
+    if (n.startsWith("H") && n.length === 2) {
+      let i = n.substring(1);
+      return r.tag = "h", r.hi = parseInt(i), i === "1" && (i = "2"), r.i === -99 && (r.i = parseInt(i) * 10, this.lastFixedI = r.i), r;
+    }
+    return r.i === -99 && n === "HR" ? (r.i = this.lastFixedI + 5, r) : null;
+  }
+  getAttributeRecords(t, n = !1) {
+    const o = {};
+    for (const r of t.attributes)
+      r.name.startsWith("section-") ? o[r.name] = r.value.replace(/^section-/, "") : r.name.startsWith("layout") ? (o[r.name] = r.value, t.removeAttribute(r.name)) : n && (o[r.name] = r.value);
+    if (!n)
+      for (const r of Array.from(t.classList))
+        r.startsWith("section-") && (o.class = (o.class || "") + " " + r.replace(/^section-/, ""), t.classList.remove(r));
+    return o;
+  }
+  createNewContainerNode(t, n) {
+    const o = this.getAttributeRecords(t, t.tagName === "HR"), r = F("section", o);
+    return r.__IT = n, r;
+  }
+  arrangeSingleNode(t, n) {
+    n.i;
+    let o = 0;
+    for (o = 0; o < this.containerIndex.length && !(this.containerIndex[o] >= n.i); o++)
+      ;
+    let r = null;
+    n.variant === "append" ? (console.log("Appending to container at index", o, "with i", n.i), r = this.containerPath[o]) : r = this.createNewContainerNode(t, n);
+    const i = this.containerPath[o - 1];
+    this.containerPath.length = o, this.containerIndex.length = o, r.appendChild(t), i.appendChild(r), this.containerPath.push(r), this.containerIndex.push(n.i), this.currentContainerNode = r;
+  }
+  appendToCurrentContainer(t) {
+    if (this.currentContainerNode === null)
+      throw new Error("No current container node set");
+    this.currentContainerNode.appendChild(t);
+  }
+  arrange(t) {
+    for (let n of t) {
+      if (n.nodeType !== Node.ELEMENT_NODE) {
+        this.appendToCurrentContainer(n);
+        continue;
+      }
+      const o = n, r = this.getI(o);
+      if (!r || r.variant === "skip") {
+        this.appendToCurrentContainer(n);
+        continue;
+      }
+      this.arrangeSingleNode(o, r);
+    }
+  }
+}
+var me = Object.create, N = Object.defineProperty, ye = Object.getOwnPropertyDescriptor, q = (e, t) => (t = Symbol[e]) ? t : Symbol.for("Symbol." + e), G = (e) => {
+  throw TypeError(e);
+}, we = (e, t, n) => t in e ? N(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n, xe = (e, t) => N(e, "name", { value: t, configurable: !0 }), Ce = (e) => [, , , me((e == null ? void 0 : e[q("metadata")]) ?? null)], Ee = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"], V = (e) => e !== void 0 && typeof e != "function" ? G("Function expected") : e, be = (e, t, n, o, r) => ({ kind: Ee[e], name: t, metadata: o, addInitializer: (i) => n._ ? G("Already initialized") : r.push(V(i || null)) }), ke = (e, t) => we(t, q("metadata"), e[3]), Ae = (e, t, n, o) => {
+  for (var r = 0, i = e[t >> 1], s = i && i.length; r < s; r++) i[r].call(n);
+  return o;
+}, Ie = (e, t, n, o, r, i) => {
+  var s, c, h, l = t & 7, d = !1, a = 0, f = e[a] || (e[a] = []), u = l && (r = r.prototype, l < 5 && (l > 3 || !d) && ye(r, n));
+  xe(r, n);
+  for (var v = o.length - 1; v >= 0; v--)
+    h = be(l, n, c = {}, e[3], f), s = (0, o[v])(r, h), c._ = 1, V(s) && (r = s);
+  return ke(e, r), u && N(r, n, u), d ? l ^ 4 ? i : u : r;
+}, J, T, K;
+J = [R("tj-content-pane")];
+class A extends (K = U(re)) {
   static get is() {
     return "tj-content-pane";
   }
@@ -193,33 +201,36 @@ let x = class extends k(I) {
   constructor() {
     super();
   }
+  arrange() {
+    const t = new X("SectionTreeBuilder");
+    this.log("arrange() called");
+    const n = new ge(this), o = Array.from(this.children);
+    n.arrange(o), k(Array.from(this.children), { recursive: !0 }), t.lap("after arrange");
+  }
   async connectedCallback() {
-    const n = new T("SectionTreeBuilder");
-    await P(), super.connectedCallback();
-    const t = new S(this), r = Array.from(this.children);
-    t.arrange(r), g(Array.from(this.children), { recursive: !0 }), n.lap("after arrange");
+    await Y(), super.connectedCallback(), this.arrange();
   }
-};
-x = z([
-  y("tj-content-pane")
-], x);
-function J(n, t, r) {
-  const o = [], e = t.split("|");
-  for (const s of e) {
-    const i = n.querySelectorAll(s.trim());
-    if (i.length > 0)
-      for (const l of i) {
-        o.push(l);
-        for (const [d, a] of Object.entries(r))
-          l.setAttribute(d, a);
+}
+T = Ce(K);
+A = Ie(T, 0, "ContentAreaElement2", J, A);
+Ae(T, 1, A);
+function Le(e, t, n) {
+  const o = [], r = t.split("|");
+  for (const i of r) {
+    const s = e.querySelectorAll(i.trim());
+    if (s.length > 0)
+      for (const c of s) {
+        o.push(c);
+        for (const [h, l] of Object.entries(n))
+          c.setAttribute(h, l);
       }
   }
   return o;
 }
 export {
-  x as ContentAreaElement2,
-  S as SectionTreeBuilder,
-  g as applyLayout,
-  J as attrAssign,
-  V as isSectionTreeElement
+  A as ContentAreaElement2,
+  ge as SectionTreeBuilder,
+  k as applyLayout,
+  Le as attrAssign,
+  Te as isSectionTreeElement
 };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@trunkjs/content-pane",
-    "version": "1.0.6",
+    "version": "1.0.8",
     "main": "./index.js",
     "dependencies": {
         "@trunkjs/browser-utils": "^1.0.14",

package/web-types.json

@@ -5,7 +5,7 @@
         "html": {
             "elements": [
                 {
-                    "name": "content-pane",
+                    "name": "tj-content-pane",
                     "description": "Creates a tree strcture from flat content",
                     "attributes": [
                         {