@editora/ui-core 0.1.19 → 0.1.21

package/dist/transfer-list.esm.js

@@ -1,4 +1,4 @@
-import { E as D } from "./ElementBase-909688f3.mjs";
+import { E as D } from "./ElementBase-YlTLMsGk.mjs";
 const q = `
   :host {
     --ui-transfer-accent: var(--ui-color-primary, #2563eb);
@@ -658,72 +658,66 @@ const q = `
     }
   }
 `;
-function l(n) {
+function s(n) {
   return n.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
 }
-function y(n) {
-  if (!n)
-    return [];
+function k(n) {
+  if (!n) return [];
   try {
-    const r = JSON.parse(n);
-    if (!Array.isArray(r))
-      return [];
+    const e = JSON.parse(n);
+    if (!Array.isArray(e)) return [];
     const t = [];
-    return r.forEach((e) => {
-      if (!e || typeof e != "object")
-        return;
+    return e.forEach((r) => {
+      if (!r || typeof r != "object") return;
       const a = {
-        value: String(e.value ?? ""),
-        label: String(e.label ?? e.value ?? ""),
-        disabled: !!e.disabled
+        value: String(r.value ?? ""),
+        label: String(r.label ?? r.value ?? ""),
+        disabled: !!r.disabled
       };
-      e.description && (a.description = String(e.description)), a.value && t.push(a);
+      r.description && (a.description = String(r.description)), a.value && t.push(a);
     }), t;
   } catch {
     return [];
   }
 }
-function _(n) {
-  if (!n)
-    return [];
+function w(n) {
+  if (!n) return [];
   try {
-    const r = JSON.parse(n);
-    return Array.isArray(r) ? r.map((t) => String(t)) : [];
+    const e = JSON.parse(n);
+    return Array.isArray(e) ? e.map((t) => String(t)) : [];
   } catch {
     return [];
   }
 }
-function k(n, r) {
-  return new Set(Array.from(n).filter((t) => r.has(t)));
+function A(n, e) {
+  return new Set(Array.from(n).filter((t) => e.has(t)));
 }
 function R(n) {
   return n === "tick" || n === "none" ? n : "checkbox";
 }
-function h(n, r) {
-  return n == null ? r : n === "" || n === "true" || n === "1" || n === "yes" ? !0 : n === "false" || n === "0" || n === "no" ? !1 : r;
+function p(n, e) {
+  return n == null ? e : n === "" || n === "true" || n === "1" || n === "yes" ? !0 : n === "false" || n === "0" || n === "no" ? !1 : e;
 }
-function w(n) {
+function $(n) {
   return `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.25" stroke-linecap="round" stroke-linejoin="round" focusable="false" aria-hidden="true"><path d="${n === "right" ? "M9 6l6 6-6 6" : "M15 6l-6 6 6 6"}"/></svg>`;
 }
 class U extends D {
   constructor() {
-    super(...arguments), this._options = [], this._value = [], this._selectedAvailable = /* @__PURE__ */ new Set(), this._selectedChosen = /* @__PURE__ */ new Set(), this._formUnregister = null, this._suppressValueAttr = !1, this._delegatedListenersAttached = !1, this._handleRootClick = (r) => {
-      const t = r.target;
-      if (!t)
-        return;
-      const e = t.closest(".move-btn");
-      if (e && this.root.contains(e)) {
-        this._move(e.getAttribute("data-action"));
+    super(...arguments), this._options = [], this._value = [], this._selectedAvailable = /* @__PURE__ */ new Set(), this._selectedChosen = /* @__PURE__ */ new Set(), this._formUnregister = null, this._suppressValueAttr = !1, this._delegatedListenersAttached = !1, this._handleRootClick = (e) => {
+      const t = e.target;
+      if (!t) return;
+      const r = t.closest(".move-btn");
+      if (r && this.root.contains(r)) {
+        this._move(r.getAttribute("data-action"));
         return;
       }
       const a = t.closest(".item");
       a && this.root.contains(a) && this._toggleItem(a);
-    }, this._handleRootKeyDown = (r) => {
-      const t = r.target;
-      if (!t)
-        return;
-      const e = t.closest(".item");
-      e && this.root.contains(e) && this._onItemKeyDown(r, e);
+    }, this._handleRootKeyDown = (e) => {
+      const t = e.target;
+      if (!t) return;
+      const r = t.closest(".item");
+      r && this.root.contains(r) && this._onItemKeyDown(e, r);
     };
   }
   static get observedAttributes() {
@@ -755,8 +749,8 @@ class U extends D {
   get value() {
     return [...this._value];
   }
-  set value(r) {
-    this._applyValue(r, "api");
+  set value(e) {
+    this._applyValue(e, "api");
   }
   connectedCallback() {
     super.connectedCallback(), this._attachDelegatedListeners(), this._registerWithForm();
@@ -764,141 +758,135 @@ class U extends D {
   disconnectedCallback() {
     this._formUnregister && this._formUnregister(), this._detachDelegatedListeners(), super.disconnectedCallback();
   }
-  attributeChangedCallback(r, t, e) {
-    t !== e && (r === "options" && (this._options = y(e)), r === "value" && !this._suppressValueAttr && (this._value = _(e)), r === "name" && this.isConnected && this._registerWithForm(), r === "disabled" && (this._selectedAvailable.clear(), this._selectedChosen.clear()), this.isConnected && this.requestRender());
+  attributeChangedCallback(e, t, r) {
+    t !== r && (e === "options" && (this._options = k(r)), e === "value" && !this._suppressValueAttr && (this._value = w(r)), e === "name" && this.isConnected && this._registerWithForm(), e === "disabled" && (this._selectedAvailable.clear(), this._selectedChosen.clear()), this.isConnected && this.requestRender());
   }
   render() {
-    this._options.length || (this._options = y(this.getAttribute("options"))), !this._value.length && this.getAttribute("value") && (this._value = _(this.getAttribute("value")));
-    const r = new Set(this._value), t = this._options.filter((i) => !r.has(i.value)), e = this._options.filter((i) => r.has(i.value)), a = new Set(t.map((i) => i.value)), o = new Set(e.map((i) => i.value));
-    this._selectedAvailable = k(this._selectedAvailable, a), this._selectedChosen = k(this._selectedChosen, o);
-    const s = this.getAttribute("label") || "", c = this.getAttribute("description") || "", u = this.getAttribute("error") || "", d = this.getAttribute("available-label") || "Available", f = this.getAttribute("selected-label") || "Selected", A = this.getAttribute("available-empty-label") || "No items available to add.", $ = this.getAttribute("selected-empty-label") || "No items selected yet.", C = R(this.getAttribute("selection-indicator")), S = this.getAttribute("add-action-label") || "Add selected", L = this.getAttribute("remove-action-label") || "Remove selected", p = h(this.getAttribute("show-action-labels"), !0), b = h(this.getAttribute("show-action-counts"), !0), m = h(this.getAttribute("show-panel-counts"), !0), g = this.getAttribute("radius"), E = g ? ` style="--ui-transfer-panel-radius:${l(g)};"` : "", v = () => C === "none" ? "" : '<span class="indicator" part="indicator" aria-hidden="true"><span class="indicator-box"><span class="indicator-mark">✓</span></span></span>', x = (i) => p ? `<span class="move-btn-text">${l(i)}</span>` : "", z = (i) => b ? `<span class="move-btn-count">${i}</span>` : "", I = t.length ? t.map(
+    this._options.length || (this._options = k(this.getAttribute("options"))), !this._value.length && this.getAttribute("value") && (this._value = w(this.getAttribute("value")));
+    const e = new Set(this._value), t = this._options.filter((i) => !e.has(i.value)), r = this._options.filter((i) => e.has(i.value)), a = new Set(t.map((i) => i.value)), l = new Set(r.map((i) => i.value));
+    this._selectedAvailable = A(this._selectedAvailable, a), this._selectedChosen = A(this._selectedChosen, l);
+    const o = this.getAttribute("label") || "", c = this.getAttribute("description") || "", d = this.getAttribute("error") || "", b = this.getAttribute("available-label") || "Available", h = this.getAttribute("selected-label") || "Selected", C = this.getAttribute("available-empty-label") || "No items available to add.", S = this.getAttribute("selected-empty-label") || "No items selected yet.", L = R(this.getAttribute("selection-indicator")), m = this.getAttribute("add-action-label") || "Add selected", g = this.getAttribute("remove-action-label") || "Remove selected", u = p(this.getAttribute("show-action-labels"), !0), f = p(this.getAttribute("show-action-counts"), !0), v = p(this.getAttribute("show-panel-counts"), !0), x = this.getAttribute("radius"), E = x ? ` style="--ui-transfer-panel-radius:${s(x)};"` : "", z = () => L === "none" ? "" : '<span class="indicator" part="indicator" aria-hidden="true"><span class="indicator-box"><span class="indicator-mark">✓</span></span></span>', y = (i) => u ? `<span class="move-btn-text">${s(i)}</span>` : "", _ = (i) => f ? `<span class="move-btn-count">${i}</span>` : "", I = t.length ? t.map(
       (i) => `<div
               class="item"
               part="item available-item"
               role="option"
               data-side="available"
-              data-value="${l(i.value)}"
+              data-value="${s(i.value)}"
               data-selected="${this._selectedAvailable.has(i.value)}"
               aria-selected="${this._selectedAvailable.has(i.value) ? "true" : "false"}"
               aria-disabled="${i.disabled ? "true" : "false"}"
               tabindex="${i.disabled ? "-1" : "0"}"
             >
-              ${v()}
+              ${z()}
               <div class="item-copy">
-                <span class="item-title">${l(i.label)}</span>
-                ${i.description ? `<span class="item-description">${l(i.description)}</span>` : ""}
+                <span class="item-title">${s(i.label)}</span>
+                ${i.description ? `<span class="item-description">${s(i.description)}</span>` : ""}
               </div>
             </div>`
-    ).join("") : `<div class="empty" part="empty">${l(A)}</div>`, V = e.length ? e.map(
+    ).join("") : `<div class="empty" part="empty">${s(C)}</div>`, V = r.length ? r.map(
       (i) => `<div
               class="item"
               part="item selected-item"
               role="option"
               data-side="chosen"
-              data-value="${l(i.value)}"
+              data-value="${s(i.value)}"
               data-selected="${this._selectedChosen.has(i.value)}"
               aria-selected="${this._selectedChosen.has(i.value) ? "true" : "false"}"
               aria-disabled="${i.disabled ? "true" : "false"}"
               tabindex="${i.disabled ? "-1" : "0"}"
             >
-              ${v()}
+              ${z()}
               <div class="item-copy">
-                <span class="item-title">${l(i.label)}</span>
-                ${i.description ? `<span class="item-description">${l(i.description)}</span>` : ""}
+                <span class="item-title">${s(i.label)}</span>
+                ${i.description ? `<span class="item-description">${s(i.description)}</span>` : ""}
               </div>
             </div>`
-    ).join("") : `<div class="empty" part="empty">${l($)}</div>`;
+    ).join("") : `<div class="empty" part="empty">${s(S)}</div>`;
     this.setContent(`
       <style>${q}</style>
       <div class="root"${E} part="root">
-        ${s ? `<p class="label" part="label">${l(s)}</p>` : ""}
-        ${c ? `<p class="description" part="description">${l(c)}</p>` : ""}
+        ${o ? `<p class="label" part="label">${s(o)}</p>` : ""}
+        ${c ? `<p class="description" part="description">${s(c)}</p>` : ""}
         <div class="shell" part="shell">
           <section class="panel" part="panel panel-available">
             <div class="panel-header" part="panel-header">
               <div class="panel-heading">
-                <div class="panel-title">${l(d)}</div>
-                ${m ? `<span class="panel-count" part="count">${t.length}</span>` : ""}
+                <div class="panel-title">${s(b)}</div>
+                ${v ? `<span class="panel-count" part="count">${t.length}</span>` : ""}
               </div>
               <div class="panel-help">Choose entries to move into the selected list.</div>
             </div>
-            <div class="list" part="list available-list" data-list="available" role="listbox" aria-multiselectable="true">${I}</div>
+            <div class="list" part="list available-list" data-list="available" role="listbox" aria-multiselectable="true" aria-label="${s(b)}">${I}</div>
             <div class="summary" part="summary">${t.length} available</div>
           </section>
           <div class="actions" part="actions">
-            <button class="move-btn" part="action-button action-add" data-compact="${!p && !b}" data-action="add" type="button"${this._selectedAvailable.size ? "" : " disabled"}>
-              <span class="move-btn-icon" aria-hidden="true">${w("right")}</span>
-              ${x(S)}
-              ${z(this._selectedAvailable.size || 0)}
+            <button class="move-btn" part="action-button action-add" data-compact="${!u && !f}" data-action="add" type="button"${u ? "" : ` aria-label="${s(m)}"`}${this._selectedAvailable.size ? "" : " disabled"}>
+              <span class="move-btn-icon" aria-hidden="true">${$("right")}</span>
+              ${y(m)}
+              ${_(this._selectedAvailable.size || 0)}
             </button>
-            <button class="move-btn" part="action-button action-remove" data-compact="${!p && !b}" data-action="remove" type="button"${this._selectedChosen.size ? "" : " disabled"}>
-              <span class="move-btn-icon" aria-hidden="true">${w("left")}</span>
-              ${x(L)}
-              ${z(this._selectedChosen.size || 0)}
+            <button class="move-btn" part="action-button action-remove" data-compact="${!u && !f}" data-action="remove" type="button"${u ? "" : ` aria-label="${s(g)}"`}${this._selectedChosen.size ? "" : " disabled"}>
+              <span class="move-btn-icon" aria-hidden="true">${$("left")}</span>
+              ${y(g)}
+              ${_(this._selectedChosen.size || 0)}
             </button>
           </div>
           <section class="panel" part="panel panel-selected">
             <div class="panel-header" part="panel-header">
               <div class="panel-heading">
-                <div class="panel-title">${l(f)}</div>
-                ${m ? `<span class="panel-count" part="count">${e.length}</span>` : ""}
+                <div class="panel-title">${s(h)}</div>
+                ${v ? `<span class="panel-count" part="count">${r.length}</span>` : ""}
               </div>
               <div class="panel-help">Use the remove action to send items back.</div>
             </div>
-            <div class="list" part="list selected-list" data-list="chosen" role="listbox" aria-multiselectable="true">${V}</div>
-            <div class="summary" part="summary">${e.length} selected</div>
+            <div class="list" part="list selected-list" data-list="chosen" role="listbox" aria-multiselectable="true" aria-label="${s(h)}">${V}</div>
+            <div class="summary" part="summary">${r.length} selected</div>
           </section>
         </div>
-        ${u ? `<p class="error" part="error">${l(u)}</p>` : ""}
+        ${d ? `<p class="error" part="error">${s(d)}</p>` : ""}
       </div>
     `);
   }
-  _toggleItem(r) {
-    if (this.hasAttribute("disabled"))
-      return;
-    const t = r.getAttribute("data-side"), e = r.getAttribute("data-value") || "";
-    if (!e)
-      return;
+  _toggleItem(e) {
+    if (this.hasAttribute("disabled")) return;
+    const t = e.getAttribute("data-side"), r = e.getAttribute("data-value") || "";
+    if (!r) return;
     const a = t === "chosen" ? this._selectedChosen : this._selectedAvailable;
-    a.has(e) ? a.delete(e) : a.add(e), r.setAttribute("data-selected", a.has(e) ? "true" : "false"), r.setAttribute("aria-selected", a.has(e) ? "true" : "false"), this._syncActionButtons();
+    a.has(r) ? a.delete(r) : a.add(r), e.setAttribute("data-selected", a.has(r) ? "true" : "false"), e.setAttribute("aria-selected", a.has(r) ? "true" : "false"), this._syncActionButtons();
   }
-  _onItemKeyDown(r, t) {
-    var u, d, f;
-    const e = t.getAttribute("data-side");
-    if (!e)
-      return;
-    if (r.key === "Enter" || r.key === " ") {
-      r.preventDefault(), this._toggleItem(t);
+  _onItemKeyDown(e, t) {
+    const r = t.getAttribute("data-side");
+    if (!r) return;
+    if (e.key === "Enter" || e.key === " ") {
+      e.preventDefault(), this._toggleItem(t);
       return;
     }
-    if (!["ArrowDown", "ArrowUp", "Home", "End"].includes(r.key))
-      return;
-    r.preventDefault();
-    const a = this.root.querySelector(`[data-list="${e}"]`), o = Array.from((a == null ? void 0 : a.querySelectorAll('.item[tabindex="0"]')) || []);
-    if (!o.length)
-      return;
-    const s = o.indexOf(t);
-    if (r.key === "Home") {
-      (u = o[0]) == null || u.focus();
+    if (!["ArrowDown", "ArrowUp", "Home", "End"].includes(e.key)) return;
+    e.preventDefault();
+    const a = this.root.querySelector(`[data-list="${r}"]`), l = Array.from(a?.querySelectorAll('.item[tabindex="0"]') || []);
+    if (!l.length) return;
+    const o = l.indexOf(t);
+    if (e.key === "Home") {
+      l[0]?.focus();
       return;
     }
-    if (r.key === "End") {
-      (d = o[o.length - 1]) == null || d.focus();
+    if (e.key === "End") {
+      l[l.length - 1]?.focus();
       return;
     }
-    const c = r.key === "ArrowDown" ? Math.min(o.length - 1, s + 1) : Math.max(0, s - 1);
-    (f = o[c]) == null || f.focus();
+    const c = e.key === "ArrowDown" ? Math.min(l.length - 1, o + 1) : Math.max(0, o - 1);
+    l[c]?.focus();
   }
-  _move(r) {
+  _move(e) {
     if (!this.hasAttribute("disabled")) {
-      if (r === "add") {
-        const t = [...this._value, ...Array.from(this._selectedAvailable).filter((e) => !this._value.includes(e))];
+      if (e === "add") {
+        const t = [...this._value, ...Array.from(this._selectedAvailable).filter((r) => !this._value.includes(r))];
         this._selectedAvailable.clear(), this._applyValue(t, "transfer-right");
         return;
       }
-      if (r === "remove") {
-        const t = new Set(this._selectedChosen), e = this._value.filter((a) => !t.has(a));
-        this._selectedChosen.clear(), this._applyValue(e, "transfer-left");
+      if (e === "remove") {
+        const t = new Set(this._selectedChosen), r = this._value.filter((a) => !t.has(a));
+        this._selectedChosen.clear(), this._applyValue(r, "transfer-left");
       }
     }
   }
@@ -908,8 +896,8 @@ class U extends D {
   _detachDelegatedListeners() {
     this._delegatedListenersAttached && (this.root.removeEventListener("click", this._handleRootClick), this.root.removeEventListener("keydown", this._handleRootKeyDown), this._delegatedListenersAttached = !1);
   }
-  _applyValue(r, t) {
-    const e = new Set(this._options.map((s) => s.value)), a = Array.from(new Set(r.filter((s) => s && (e.size === 0 || e.has(s))))), o = [...this._value];
+  _applyValue(e, t) {
+    const r = new Set(this._options.map((o) => o.value)), a = Array.from(new Set(e.filter((o) => o && (r.size === 0 || r.has(o))))), l = [...this._value];
     this._value = a, this._suppressValueAttr = !0;
     try {
       a.length ? this.setAttribute("value", JSON.stringify(a)) : this.removeAttribute("value");
@@ -920,8 +908,8 @@ class U extends D {
       new CustomEvent("change", {
         detail: {
           value: [...this._value],
-          previousValue: o,
-          selectedItems: this._options.filter((s) => this._value.includes(s.value)),
+          previousValue: l,
+          selectedItems: this._options.filter((o) => this._value.includes(o.value)),
           source: t
         },
         bubbles: !0,
@@ -930,33 +918,32 @@ class U extends D {
     );
   }
   _syncActionButtons() {
-    const r = this.root.querySelector('[data-action="add"]'), t = this.root.querySelector('[data-action="remove"]');
-    if (r) {
-      r.disabled = this._selectedAvailable.size === 0;
-      const e = r.querySelector(".move-btn-count");
-      e && (e.textContent = String(this._selectedAvailable.size));
+    const e = this.root.querySelector('[data-action="add"]'), t = this.root.querySelector('[data-action="remove"]');
+    if (e) {
+      e.disabled = this._selectedAvailable.size === 0;
+      const r = e.querySelector(".move-btn-count");
+      r && (r.textContent = String(this._selectedAvailable.size));
     }
     if (t) {
       t.disabled = this._selectedChosen.size === 0;
-      const e = t.querySelector(".move-btn-count");
-      e && (e.textContent = String(this._selectedChosen.size));
+      const r = t.querySelector(".move-btn-count");
+      r && (r.textContent = String(this._selectedChosen.size));
     }
   }
   _registerWithForm() {
-    var r;
     this._formUnregister && (this._formUnregister(), this._formUnregister = null);
     try {
-      const e = this.getRootNode().host, o = ((r = e == null ? void 0 : e.closest) == null ? void 0 : r.call(e, "ui-form")) || null || this.closest("ui-form"), s = this.getAttribute("name");
-      o && typeof o.registerField == "function" && s && (this._formUnregister = o.registerField(s, {
-        name: s,
+      const a = this.getRootNode().host?.closest?.("ui-form") || null || this.closest("ui-form"), l = this.getAttribute("name");
+      a && typeof a.registerField == "function" && l && (this._formUnregister = a.registerField(l, {
+        name: l,
         getValue: () => [...this._value],
-        setValue: (c) => {
-          const u = Array.isArray(c) ? c.map((d) => String(d)) : [];
-          this._applyValue(u, "api");
+        setValue: (o) => {
+          const c = Array.isArray(o) ? o.map((d) => String(d)) : [];
+          this._applyValue(c, "api");
         },
         validate: async () => ({ valid: !this.hasAttribute("required") || this._value.length > 0, message: "Select at least one item." }),
-        setError: (c) => {
-          c ? (this.setAttribute("error", c), this.setAttribute("invalid", "")) : (this.removeAttribute("error"), this.removeAttribute("invalid")), this.requestRender();
+        setError: (o) => {
+          o ? (this.setAttribute("error", o), this.setAttribute("invalid", "")) : (this.removeAttribute("error"), this.removeAttribute("invalid")), this.requestRender();
         }
       }));
     } catch {

package/dist/{tree-dcd74a4a.mjs → tree-B3kE8ESs.mjs}

@@ -1,56 +1,55 @@
-import { E as g } from "./ElementBase-909688f3.mjs";
-import { n as b } from "./collection-a1aac0c6.mjs";
+import { E as g } from "./ElementBase-YlTLMsGk.mjs";
+import { n as b } from "./collection-C7URGjEI.mjs";
 import { UITreeItem as f } from "./tree-item.esm.js";
-function C(a, t) {
-  const e = [], i = t.getExpanded || (() => !1), r = t.getDisabled || (() => !1), s = (o, d, n) => {
-    o.forEach((l) => {
-      const u = t.getChildren(l) || [], c = {
-        item: l,
-        id: t.getId(l),
-        label: t.getLabel(l),
-        level: d,
-        parentId: n,
-        disabled: r(l),
-        expanded: i(l),
+function C(l, t) {
+  const e = [], i = t.getExpanded || (() => !1), r = t.getDisabled || (() => !1), s = (d, n, o) => {
+    d.forEach((a) => {
+      const u = t.getChildren(a) || [], c = {
+        item: a,
+        id: t.getId(a),
+        label: t.getLabel(a),
+        level: n,
+        parentId: o,
+        disabled: r(a),
+        expanded: i(a),
         hasChildren: u.length > 0
       };
-      e.push(c), s(u, d + 1, c.id);
+      e.push(c), s(u, n + 1, c.id);
     });
   };
-  return s(a, 1, null), e;
+  return s(l, 1, null), e;
 }
-function _(a, t) {
-  const e = [], i = t.getExpanded || (() => !1), r = t.getDisabled || (() => !1), s = (o, d, n) => {
-    o.forEach((l) => {
-      const u = t.getChildren(l) || [], c = i(l), h = {
-        item: l,
-        id: t.getId(l),
-        label: t.getLabel(l),
-        level: d,
-        parentId: n,
-        disabled: r(l),
+function _(l, t) {
+  const e = [], i = t.getExpanded || (() => !1), r = t.getDisabled || (() => !1), s = (d, n, o) => {
+    d.forEach((a) => {
+      const u = t.getChildren(a) || [], c = i(a), h = {
+        item: a,
+        id: t.getId(a),
+        label: t.getLabel(a),
+        level: n,
+        parentId: o,
+        disabled: r(a),
         expanded: c,
         hasChildren: u.length > 0
       };
-      e.push(h), h.hasChildren && c && s(u, d + 1, h.id);
+      e.push(h), h.hasChildren && c && s(u, n + 1, h.id);
     });
   };
-  return s(a, 1, null), e;
+  return s(l, 1, null), e;
 }
-function p(a, t) {
-  return a.findIndex((e) => e.id === t);
+function p(l, t) {
+  return l.findIndex((e) => e.id === t);
 }
-function m(a, t) {
-  const e = a[t];
-  return e != null && e.parentId ? a.findIndex((i) => i.id === e.parentId) : -1;
+function m(l, t) {
+  const e = l[t];
+  return e?.parentId ? l.findIndex((i) => i.id === e.parentId) : -1;
 }
-function y(a, t, e = -1) {
+function y(l, t, e = -1) {
   const i = b(t);
-  if (!i)
-    return -1;
-  for (let r = 1; r <= a.length; r += 1) {
-    const s = (e + r + a.length) % a.length, o = a[s];
-    if (!o.disabled && b(o.label).startsWith(i))
+  if (!i) return -1;
+  for (let r = 1; r <= l.length; r += 1) {
+    const s = (e + r + l.length) % l.length, d = l[s];
+    if (!d.disabled && b(d.label).startsWith(i))
       return s;
   }
   return -1;
@@ -100,8 +99,7 @@ class x extends g {
     super.connectedCallback(), this.addEventListener("click", this._onClick), this.addEventListener("keydown", this._onKeyDown), this._observer = new MutationObserver(this._onMutation), this._observer.observe(this, { childList: !0, subtree: !0, attributes: !0, attributeFilter: ["expanded", "selected", "disabled", "label", "value"] }), queueMicrotask(() => this._syncTree());
   }
   disconnectedCallback() {
-    var t;
-    this.removeEventListener("click", this._onClick), this.removeEventListener("keydown", this._onKeyDown), (t = this._observer) == null || t.disconnect(), this._observer = null, this._typeaheadTimer != null && window.clearTimeout(this._typeaheadTimer), super.disconnectedCallback();
+    this.removeEventListener("click", this._onClick), this.removeEventListener("keydown", this._onKeyDown), this._observer?.disconnect(), this._observer = null, this._typeaheadTimer != null && window.clearTimeout(this._typeaheadTimer), super.disconnectedCallback();
   }
   get value() {
     return this.getAttribute("value") || "";
@@ -119,8 +117,7 @@ class x extends g {
   }
   toggle(t) {
     const e = this._findByValue(t);
-    if (!e || e.childItems.length === 0)
-      return;
+    if (!e || e.childItems.length === 0) return;
     const i = !e.hasAttribute("expanded");
     e.toggleAttribute("expanded", i), this._emitToggle(e, i), this._syncTree();
   }
@@ -158,14 +155,13 @@ class x extends g {
     return this._allItems().find((e) => e.value === t) || null;
   }
   _syncTree() {
-    var d;
-    const t = this._allItems(), e = this._visibleRecords(), i = this.value || ((d = e.find((n) => !n.disabled)) == null ? void 0 : d.id) || "", r = this._focusedValue && e.some((n) => n.id === this._focusedValue) ? this._focusedValue : i;
+    const t = this._allItems(), e = this._visibleRecords(), i = this.value || e.find((n) => !n.disabled)?.id || "", r = this._focusedValue && e.some((n) => n.id === this._focusedValue) ? this._focusedValue : i;
     this._focusedValue = r || null;
-    const s = new Set(e.map((n) => n.id)), o = new Map(e.map((n) => [n.id, n]));
+    const s = new Set(e.map((n) => n.id)), d = new Map(e.map((n) => [n.id, n]));
     t.forEach((n) => {
-      const l = o.get(n.value);
+      const o = d.get(n.value);
       n.style.setProperty("--ui-tree-indent", this.getAttribute("indent-size") || "16px"), n.applyTreeState({
-        level: (l == null ? void 0 : l.level) || 1,
+        level: o?.level || 1,
         hasChildren: n.childItems.length > 0,
         expanded: n.hasAttribute("expanded"),
         selected: n.value === i,
@@ -176,13 +172,12 @@ class x extends g {
   }
   _moveFocus(t) {
     const e = this._visibleRecords();
-    if (!e.length)
-      return;
+    if (!e.length) return;
     const i = p(e, this._focusedValue || this.value || ""), r = i >= 0 ? i : -1;
     for (let s = 1; s <= e.length; s += 1) {
-      const o = (r + t * s + e.length) % e.length, d = e[o];
-      if (!d.disabled) {
-        this.focusValue(d.id);
+      const d = (r + t * s + e.length) % e.length, n = e[d];
+      if (!n.disabled) {
+        this.focusValue(n.id);
         return;
       }
     }
@@ -207,8 +202,7 @@ class x extends g {
   }
   _onClick(t) {
     const e = t.composedPath(), i = e.find((s) => s instanceof f);
-    if (!i || i.hasAttribute("disabled"))
-      return;
+    if (!i || i.hasAttribute("disabled")) return;
     const r = e.find((s) => s instanceof HTMLElement && s.getAttribute("data-action") === "toggle");
     if (this._focusedValue = i.value, r && i.childItems.length > 0) {
       this.toggle(i.value);
@@ -218,8 +212,7 @@ class x extends g {
   }
   _onKeyDown(t) {
     const e = this._visibleRecords();
-    if (!e.length)
-      return;
+    if (!e.length) return;
     const i = p(e, this._focusedValue || this.value || ""), r = i >= 0 ? e[i] : e[0];
     if (r) {
       if (t.key === "ArrowDown") {
@@ -245,7 +238,7 @@ class x extends g {
         }
         if (r.hasChildren && r.expanded) {
           const s = e[i + 1];
-          (s == null ? void 0 : s.parentId) === r.id && this.focusValue(s.id);
+          s?.parentId === r.id && this.focusValue(s.id);
         }
         return;
       }
@@ -286,9 +279,9 @@ class x extends g {
 typeof customElements < "u" && !customElements.get("ui-tree") && customElements.define("ui-tree", x);
 export {
   x as U,
-  _ as a,
-  p as b,
-  m as c,
-  y as d,
-  C as f
+  p as a,
+  y as b,
+  C as c,
+  _ as d,
+  m as f
 };