@editora/ui-core 0.1.19 → 0.1.21

package/dist/select.esm.js

@@ -1,7 +1,6 @@
-import { E as R } from "./ElementBase-909688f3.mjs";
-import { f as M, a as q, b as $ } from "./collection-a1aac0c6.mjs";
-import { r as L } from "./listbox-308789a0.mjs";
-import "./collection.esm.js";
+import { E as R } from "./ElementBase-YlTLMsGk.mjs";
+import { f as M, b as q, a as $ } from "./collection-C7URGjEI.mjs";
+import { r as L } from "./listbox-DJamVeFj.mjs";
 const F = `
   :host {
     --ui-select-width: var(--ui-width, min(340px, 100%));
@@ -748,8 +747,7 @@ const F = `
   }
 `;
 function h(p) {
-  if (p == null)
-    return !1;
+  if (p == null) return !1;
   const e = String(p).toLowerCase();
   return e !== "false" && e !== "0";
 }
@@ -757,8 +755,7 @@ function f(p) {
   return String(p).replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
 }
 function D(p) {
-  if (!p)
-    return null;
+  if (!p) return null;
   const e = String(p).trim();
   return e ? e === "none" ? "4px" : e === "full" ? "999px" : e === "large" ? "16px" : /^-?\\d+(\\.\\d+)?$/.test(e) ? `${e}px` : e : null;
 }
@@ -829,8 +826,7 @@ class O extends R {
   connectedCallback() {
     super.connectedCallback(), this.root.addEventListener("click", this._onRootClick), this.root.addEventListener("keydown", this._onRootKeyDown), this.root.addEventListener("pointerdown", this._onRootPointerDown), this.root.addEventListener("pointermove", this._onRootPointerMove, { passive: !0 }), this.root.addEventListener("slotchange", this._onSlotChange), this._observer = new MutationObserver((e) => {
       e.some((i) => {
-        if (!(i.target instanceof HTMLElement) || i.target === this)
-          return i.type === "childList";
+        if (!(i.target instanceof HTMLElement) || i.target === this) return i.type === "childList";
         const s = i.target.tagName.toLowerCase();
         return s === "option" || s === "optgroup";
       }) && this._scheduleOptionsSync();
@@ -903,27 +899,22 @@ class O extends R {
     t && t.closest(".menu-item") && e.preventDefault();
   }
   _onRootPointerMove(e) {
-    if (!this._open)
-      return;
-    const t = e.target, i = t == null ? void 0 : t.closest(".menu-item[data-index]");
-    if (!i)
-      return;
+    if (!this._open) return;
+    const i = e.target?.closest(".menu-item[data-index]");
+    if (!i) return;
     const s = Number(i.dataset.index || "-1"), o = this._options[s];
     !o || o.disabled || s === this._activeIndex || this._setActiveIndex(s);
   }
   _onRootClick(e) {
     const t = e.target;
-    if (!t)
-      return;
+    if (!t) return;
     if (t.closest(".trigger")) {
-      if (this.disabled)
-        return;
+      if (this.disabled) return;
       this._open ? this._closeMenu({ restoreFocus: !1 }) : this._openMenu();
       return;
     }
     const i = t.closest(".menu-item[data-index]");
-    if (!i)
-      return;
+    if (!i) return;
     const s = Number(i.dataset.index || "-1"), o = this._options[s];
     !o || o.disabled || (this._applyValueFromUser(o.value), this._closeMenu());
   }
@@ -938,13 +929,11 @@ class O extends R {
           e.preventDefault(), this._open ? this._moveActive(-1) : this._openMenu();
           break;
         case "Home":
-          if (!this._open)
-            return;
+          if (!this._open) return;
           e.preventDefault(), this._setActiveIndex(this._firstEnabledIndex());
           break;
         case "End":
-          if (!this._open)
-            return;
+          if (!this._open) return;
           e.preventDefault(), this._setActiveIndex(this._lastEnabledIndex());
           break;
         case "Enter":
@@ -957,8 +946,7 @@ class O extends R {
           break;
         }
         case "Escape":
-          if (!this._open)
-            return;
+          if (!this._open) return;
           e.preventDefault(), this._closeMenu();
           break;
         case "Tab":
@@ -967,15 +955,13 @@ class O extends R {
       }
   }
   _onDocumentPointerDown(e) {
-    if (!this._open)
-      return;
+    if (!this._open) return;
     const t = typeof e.composedPath == "function" ? e.composedPath() : [];
     t.includes(this) || t.includes(this.root) || this._closeMenu({ restoreFocus: !1 });
   }
   _isInternalEvent(e) {
-    var s, o, a;
     const t = e.target, i = typeof e.composedPath == "function" ? e.composedPath() : [];
-    return i.includes(this) || i.includes(this.root) || t instanceof Node && (t === this || this.root.contains(t) || (s = this._controlEl) != null && s.contains(t) || (o = this._panelEl) != null && o.contains(t) || (a = this._menuEl) != null && a.contains(t)) ? !0 : !!(this._controlEl && i.includes(this._controlEl) || this._triggerEl && i.includes(this._triggerEl) || this._panelEl && i.includes(this._panelEl) || this._menuEl && i.includes(this._menuEl));
+    return i.includes(this) || i.includes(this.root) || t instanceof Node && (t === this || this.root.contains(t) || this._controlEl?.contains(t) || this._panelEl?.contains(t) || this._menuEl?.contains(t)) ? !0 : !!(this._controlEl && i.includes(this._controlEl) || this._triggerEl && i.includes(this._triggerEl) || this._panelEl && i.includes(this._panelEl) || this._menuEl && i.includes(this._menuEl));
   }
   _onWindowResize() {
     this._open && this._schedulePanelPlacement();
@@ -1024,26 +1010,23 @@ class O extends R {
     (this.getAttribute("value") || "") !== e && (this.setAttribute("value", e), this._emitValue("input", e), this._emitValue("change", e));
   }
   _attachFormRegistration() {
-    var o;
     this._formUnregister && (this._formUnregister(), this._formUnregister = null);
     const e = this.getAttribute("name");
-    if (!e)
-      return;
-    const t = this.getRootNode(), i = t instanceof ShadowRoot ? t.host : null, s = ((o = i == null ? void 0 : i.closest) == null ? void 0 : o.call(i, "ui-form")) || this.closest("ui-form");
+    if (!e) return;
+    const t = this.getRootNode(), s = (t instanceof ShadowRoot ? t.host : null)?.closest?.("ui-form") || this.closest("ui-form");
     !s || typeof s.registerField != "function" || (this._formUnregister = s.registerField(e, {
       name: e,
       getValue: () => this.value,
-      setValue: (a) => {
-        this.value = a;
+      setValue: (o) => {
+        this.value = o;
       },
       validate: async () => {
-        if (!(h(this.getAttribute("required")) || this.hasAttribute("required")))
-          return { valid: !0 };
-        const r = this.value.trim().length > 0;
-        return { valid: r, message: r ? void 0 : "This field is required." };
+        if (!(h(this.getAttribute("required")) || this.hasAttribute("required"))) return { valid: !0 };
+        const l = this.value.trim().length > 0;
+        return { valid: l, message: l ? void 0 : "This field is required." };
       },
-      setError: (a) => {
-        a ? (this.setAttribute("validation", "error"), this.setAttribute("error", a)) : (this.getAttribute("validation") === "error" && this.removeAttribute("validation"), this.removeAttribute("error"));
+      setError: (o) => {
+        o ? (this.setAttribute("validation", "error"), this.setAttribute("error", o)) : (this.getAttribute("validation") === "error" && this.removeAttribute("validation"), this.removeAttribute("error"));
       }
     }));
   }
@@ -1056,10 +1039,10 @@ class O extends R {
   }
   _buildOptionsFromChildren() {
     const e = [], t = (r, u) => {
-      const n = (r.label || r.textContent || r.value || "").trim(), c = String(r.value ?? "");
+      const n = (r.label || r.textContent || r.value || "").trim(), a = String(r.value ?? "");
       e.push({
-        value: c,
-        label: n || c,
+        value: a,
+        label: n || a,
         disabled: !!r.disabled,
         group: u
       });
@@ -1071,19 +1054,19 @@ class O extends R {
         return;
       }
       if (u === "optgroup") {
-        const n = r, c = (n.label || "").trim();
-        Array.from(n.children).forEach((l) => {
-          l instanceof HTMLOptionElement && e.push({
-            value: String(l.value ?? ""),
-            label: (l.label || l.textContent || l.value || "").trim() || String(l.value ?? ""),
-            disabled: !!l.disabled || !!n.disabled,
-            group: c
+        const n = r, a = (n.label || "").trim();
+        Array.from(n.children).forEach((c) => {
+          c instanceof HTMLOptionElement && e.push({
+            value: String(c.value ?? ""),
+            label: (c.label || c.textContent || c.value || "").trim() || String(c.value ?? ""),
+            disabled: !!c.disabled || !!n.disabled,
+            group: a
           });
         });
       }
     });
-    const s = (this.getAttribute("placeholder") || "").trim(), o = h(this.getAttribute("required")) || this.hasAttribute("required"), a = e.some((r) => r.value === "");
-    return s && !o && !a && e.unshift({ value: "", label: s, disabled: !1, group: "" }), e;
+    const s = (this.getAttribute("placeholder") || "").trim(), o = h(this.getAttribute("required")) || this.hasAttribute("required"), l = e.some((r) => r.value === "");
+    return s && !o && !l && e.unshift({ value: "", label: s, disabled: !1, group: "" }), e;
   }
   _computeOptionsFingerprint(e) {
     return e.map((t) => `${t.value}
${t.label}
${t.disabled ? "1" : "0"}
${t.group}`).join("");
@@ -1101,22 +1084,17 @@ class O extends R {
     return this.getAttribute("check-placement") === "start" ? "start" : "end";
   }
   _syncOptionsData() {
-    var c;
     const e = this._buildOptionsFromChildren(), t = this._computeOptionsFingerprint(e), i = t !== this._optionsFingerprint;
     this._options = e, this._optionsFingerprint = t;
-    const s = this.getAttribute("value") || "", o = this.hasAttribute("value"), a = this._options.some((l) => l.value === s), r = h(this.getAttribute("required")) || this.hasAttribute("required"), u = ((c = this._options.find((l) => !l.disabled)) == null ? void 0 : c.value) || "", n = !r && this._options.some((l) => l.value === "") ? "" : u;
-    return o ? a || this._setValueAttr(n) : this._setValueAttr(n), i;
+    const s = this.getAttribute("value") || "", o = this.hasAttribute("value"), l = this._options.some((a) => a.value === s), r = h(this.getAttribute("required")) || this.hasAttribute("required"), u = this._options.find((a) => !a.disabled)?.value || "", n = !r && this._options.some((a) => a.value === "") ? "" : u;
+    return o ? l || this._setValueAttr(n) : this._setValueAttr(n), i;
   }
   _currentDisplayText() {
     const e = this.value, t = (this.getAttribute("placeholder") || "").trim();
-    if (e === "" && t)
-      return t;
-    const i = this._options.find((s) => s.value === e);
-    return (i == null ? void 0 : i.label) || e;
+    return e === "" && t ? t : this._options.find((s) => s.value === e)?.label || e;
   }
   _setActiveIndex(e) {
-    if (!this._menuEl || e === this._activeIndex)
-      return;
+    if (!this._menuEl || e === this._activeIndex) return;
     this._activeIndex = e;
     const t = e >= 0 && this._menuItems[e] || null;
     this._menuEl.setActiveItem(t, {
@@ -1126,29 +1104,25 @@ class O extends R {
     });
   }
   _moveActive(e) {
-    if (!this._menuEl || !this._options.length)
-      return;
+    if (!this._menuEl || !this._options.length) return;
     const t = this._activeIndex >= 0 ? this._menuItems[this._activeIndex] : null, i = this._menuEl.move(e, {
       current: t,
       focus: !1,
       owner: this._triggerEl,
       scroll: !0
     });
-    if (!i)
-      return;
+    if (!i) return;
     const s = Number(i.dataset.index || "-1");
     s >= 0 && (this._activeIndex = s);
   }
   _selectActiveOption() {
-    if (this._activeIndex < 0)
-      return;
+    if (this._activeIndex < 0) return;
     const e = this._options[this._activeIndex];
     !e || e.disabled || (this._applyValueFromUser(e.value), this._closeMenu());
   }
   _renderMenu() {
     const e = this._menuEl;
-    if (!e)
-      return;
+    if (!e) return;
     const t = `${this._optionsFingerprint}
${this.showCheck ? "1" : "0"}
${this._checkPlacement()}`;
     if (this._menuItems.length > 0 && t === this._menuRenderFingerprint && this._menuItems.length === this._options.length) {
       this._syncMenuSelectionState(), this._schedulePanelPlacement();
@@ -1168,19 +1142,18 @@ class O extends R {
       r.group || (s = "__none__");
       const n = document.createElement("button");
       n.type = "button", n.className = "menu-item", n.id = `${this._uid}-opt-${u}`, n.setAttribute("role", "option"), n.setAttribute("data-index", String(u)), n.setAttribute("data-value", r.value), n.setAttribute("aria-selected", r.value === this.value ? "true" : "false"), n.setAttribute("aria-disabled", r.disabled ? "true" : "false"), n.tabIndex = -1, r.disabled && (n.disabled = !0);
+      const a = document.createElement("span");
+      a.className = "menu-item-label", a.textContent = r.label;
       const c = document.createElement("span");
-      c.className = "menu-item-label", c.textContent = r.label;
-      const l = document.createElement("span");
-      l.className = "menu-item-check", l.setAttribute("aria-hidden", "true");
+      c.className = "menu-item-check", c.setAttribute("aria-hidden", "true");
       const b = this.showCheck, m = this._checkPlacement();
-      l.hidden = !b, n.setAttribute("data-check-placement", m), b && m === "start" ? n.append(l, c) : n.append(c, l), e.appendChild(n), this._menuItems.push(n);
+      c.hidden = !b, n.setAttribute("data-check-placement", m), b && m === "start" ? n.append(c, a) : n.append(a, c), e.appendChild(n), this._menuItems.push(n);
     });
-    const o = this._menuItems[0] || null, a = this._menuItems[this._menuItems.length - 1] || null;
-    o && o.setAttribute("data-edge-start", "true"), a && a.setAttribute("data-edge-end", "true"), e.refresh(), this._menuRenderFingerprint = t, this._syncMenuSelectionState(), this._schedulePanelPlacement();
+    const o = this._menuItems[0] || null, l = this._menuItems[this._menuItems.length - 1] || null;
+    o && o.setAttribute("data-edge-start", "true"), l && l.setAttribute("data-edge-end", "true"), e.refresh(), this._menuRenderFingerprint = t, this._syncMenuSelectionState(), this._schedulePanelPlacement();
   }
   _syncMenuSelectionState() {
-    if (!this._menuEl)
-      return;
+    if (!this._menuEl) return;
     const e = this._selectedIndex();
     this._menuItems.forEach((i) => {
       const s = Number(i.dataset.index || "-1");
@@ -1198,38 +1171,35 @@ class O extends R {
   }
   _syncPanelPlacement() {
     const e = this._panelEl, t = this._controlEl, i = this._menuEl;
-    if (!e || !t || !i || !this._open)
-      return;
-    const s = t.getBoundingClientRect(), o = window.innerHeight || document.documentElement.clientHeight || 0, a = Math.max(0, o - s.bottom - 12), r = Math.max(0, s.top - 12), u = Math.min(Math.max(i.scrollHeight, i.offsetHeight) + 4, 320), n = a < u && r > a;
-    this._placement = n ? "top" : "bottom", e.setAttribute("data-placement", this._placement), e.style.setProperty("--ui-select-available-height", `${Math.floor(n ? r : a)}px`);
+    if (!e || !t || !i || !this._open) return;
+    const s = t.getBoundingClientRect(), o = window.innerHeight || document.documentElement.clientHeight || 0, l = Math.max(0, o - s.bottom - 12), r = Math.max(0, s.top - 12), u = Math.min(Math.max(i.scrollHeight, i.offsetHeight) + 4, 320), n = l < u && r > l;
+    this._placement = n ? "top" : "bottom", e.setAttribute("data-placement", this._placement), e.style.setProperty("--ui-select-available-height", `${Math.floor(n ? r : l)}px`);
   }
   _openMenu() {
     this._open || this.disabled || (this._cancelPanelPlacement(), this._syncOptionsData(), this._open = !0, this._syncControlState(), this._renderMenu(), this._attachOpenListeners());
   }
   _closeMenu(e = {}) {
-    var t, i;
     if (this._open && (this._open = !1, this._activeIndex = -1, this._cancelPanelPlacement(), this._teardownOpenListeners(), this._syncControlState(), e.restoreFocus !== !1))
       try {
-        (t = this._triggerEl) == null || t.focus({ preventScroll: !0 });
+        this._triggerEl?.focus({ preventScroll: !0 });
       } catch {
-        (i = this._triggerEl) == null || i.focus();
+        this._triggerEl?.focus();
       }
   }
   _syncControlState() {
     const e = this._triggerEl, t = this._controlEl, i = this._valueEl, s = this._panelEl;
-    if (!e || !t || !i || !s)
-      return;
-    const o = this.getAttribute("label") || "", a = this.getAttribute("description") || "", r = this.getAttribute("error") || "", u = this.getAttribute("aria-label") || o || "Select", n = h(this.getAttribute("loading")), c = h(this.getAttribute("required")) || this.hasAttribute("required"), l = this.getAttribute("tabindex"), b = this.hasAttribute("validation") && this.getAttribute("validation") === "error" || this.hasAttribute("invalid") || this.getAttribute("data-invalid") === "true", m = D(this.getAttribute("radius")), d = this.root.querySelector(".label"), v = this.root.querySelector(".label-text"), g = this.root.querySelector(".description"), x = this.root.querySelector(".description-text"), _ = this.root.querySelector(".error"), y = this.root.querySelector(".error-text"), w = this.root.querySelector(".meta"), A = this.root.querySelector(".required"), E = !!o || this._hasSlotContent("label"), k = !!a || this._hasSlotContent("description"), C = !!r || this._hasSlotContent("error"), I = this._hasSlotContent("leading"), z = this._hasSlotContent("trailing"), P = !!(this.getAttribute("placeholder") || "").trim() && this.value === "";
-    v && (v.textContent = o), x && (x.textContent = a), y && (y.textContent = r), d && (d.hidden = !E), g && (g.hidden = !k), _ && (_.hidden = !C), w && (w.hidden = !E && !k), A && (A.hidden = !c), i.textContent = this._currentDisplayText(), t.setAttribute("data-open", this._open ? "true" : "false"), t.setAttribute("data-placeholder-shown", P ? "true" : "false"), t.setAttribute("data-has-leading", String(I)), t.setAttribute("data-has-trailing", String(z)), e.disabled = this.disabled, e.setAttribute("aria-label", u), e.setAttribute("aria-expanded", this._open ? "true" : "false"), e.setAttribute("aria-busy", n ? "true" : "false"), e.setAttribute("aria-required", c ? "true" : "false"), b ? e.setAttribute("aria-invalid", "true") : e.removeAttribute("aria-invalid"), l != null && !this.disabled ? e.setAttribute("tabindex", l) : this.disabled ? e.setAttribute("tabindex", "-1") : e.setAttribute("tabindex", "0"), s.hidden = !this._open, s.setAttribute("data-placement", this._placement), this._open ? e.setAttribute("aria-controls", `${this._uid}-listbox`) : e.removeAttribute("aria-controls"), m && !["none", "full", "large"].includes(this.getAttribute("radius") || "") ? this.style.setProperty("--ui-select-radius", m) : this.style.removeProperty("--ui-select-radius"), this.setAttribute("aria-disabled", this.disabled ? "true" : "false"), this.setAttribute("aria-busy", n ? "true" : "false"), this.toggleAttribute("open", this._open), this._open && this._schedulePanelPlacement();
+    if (!e || !t || !i || !s) return;
+    const o = this.getAttribute("label") || "", l = this.getAttribute("description") || "", r = this.getAttribute("error") || "", u = this.getAttribute("aria-label") || o || "Select", n = h(this.getAttribute("loading")), a = h(this.getAttribute("required")) || this.hasAttribute("required"), c = this.getAttribute("tabindex"), b = this.hasAttribute("validation") && this.getAttribute("validation") === "error" || this.hasAttribute("invalid") || this.getAttribute("data-invalid") === "true", m = D(this.getAttribute("radius")), d = this.root.querySelector(".label"), v = this.root.querySelector(".label-text"), g = this.root.querySelector(".description"), x = this.root.querySelector(".description-text"), _ = this.root.querySelector(".error"), y = this.root.querySelector(".error-text"), w = this.root.querySelector(".meta"), A = this.root.querySelector(".required"), E = !!o || this._hasSlotContent("label"), k = !!l || this._hasSlotContent("description"), C = !!r || this._hasSlotContent("error"), I = this._hasSlotContent("leading"), z = this._hasSlotContent("trailing"), P = !!(this.getAttribute("placeholder") || "").trim() && this.value === "";
+    v && (v.textContent = o), x && (x.textContent = l), y && (y.textContent = r), d && (d.hidden = !E), g && (g.hidden = !k), _ && (_.hidden = !C), w && (w.hidden = !E && !k), A && (A.hidden = !a), i.textContent = this._currentDisplayText(), t.setAttribute("data-open", this._open ? "true" : "false"), t.setAttribute("data-placeholder-shown", P ? "true" : "false"), t.setAttribute("data-has-leading", String(I)), t.setAttribute("data-has-trailing", String(z)), e.disabled = this.disabled, e.setAttribute("aria-label", u), e.setAttribute("aria-expanded", this._open ? "true" : "false"), e.setAttribute("aria-busy", n ? "true" : "false"), e.setAttribute("aria-required", a ? "true" : "false"), b ? e.setAttribute("aria-invalid", "true") : e.removeAttribute("aria-invalid"), c != null && !this.disabled ? e.setAttribute("tabindex", c) : this.disabled ? e.setAttribute("tabindex", "-1") : e.setAttribute("tabindex", "0"), s.hidden = !this._open, s.setAttribute("data-placement", this._placement), this._open ? e.setAttribute("aria-controls", `${this._uid}-listbox`) : e.removeAttribute("aria-controls"), m && !["none", "full", "large"].includes(this.getAttribute("radius") || "") ? this.style.setProperty("--ui-select-radius", m) : this.style.removeProperty("--ui-select-radius"), this.setAttribute("aria-disabled", this.disabled ? "true" : "false"), this.setAttribute("aria-busy", n ? "true" : "false"), this.toggleAttribute("open", this._open), this._open && this._schedulePanelPlacement();
   }
   render() {
-    const e = this.getAttribute("label") || "", t = this.getAttribute("description") || "", i = this.getAttribute("error") || "", s = h(this.getAttribute("required")) || this.hasAttribute("required"), o = this.getAttribute("aria-label") || e || "Select", a = !!e || this._hasSlotContent("label"), r = !!t || this._hasSlotContent("description"), u = !!i || this._hasSlotContent("error"), n = this._hasSlotContent("leading"), c = this._hasSlotContent("trailing"), l = `${this._uid}-label`, b = `${this._uid}-description`, m = `${this._uid}-error`, d = `${this._uid}-trigger`, v = `${this._uid}-listbox`, g = [r ? b : "", u ? m : ""].filter(Boolean).join(" ");
+    const e = this.getAttribute("label") || "", t = this.getAttribute("description") || "", i = this.getAttribute("error") || "", s = h(this.getAttribute("required")) || this.hasAttribute("required"), o = this.getAttribute("aria-label") || e || "Select", l = !!e || this._hasSlotContent("label"), r = !!t || this._hasSlotContent("description"), u = !!i || this._hasSlotContent("error"), n = this._hasSlotContent("leading"), a = this._hasSlotContent("trailing"), c = `${this._uid}-label`, b = `${this._uid}-description`, m = `${this._uid}-error`, d = `${this._uid}-trigger`, v = `${this._uid}-listbox`, g = [r ? b : "", u ? m : ""].filter(Boolean).join(" ");
     this.setContent(`
       <style>${F}</style>
       <slot class="content-slot"></slot>
       <div class="root" part="root">
-        <div class="meta" part="meta" ${a || r ? "" : "hidden"}>
-          <label class="label" part="label" id="${l}" for="${d}" ${a ? "" : "hidden"}>
+        <div class="meta" part="meta" ${l || r ? "" : "hidden"}>
+          <label class="label" part="label" id="${c}" for="${d}" ${l ? "" : "hidden"}>
             <slot name="label"><span class="label-text">${f(e)}</span></slot>
             <span class="required" aria-hidden="true" ${s ? "" : "hidden"}>*</span>
           </label>
@@ -1238,7 +1208,7 @@ class O extends R {
           </p>
         </div>
         <div class="field-shell" part="field-shell">
-          <div class="control" part="control" data-has-leading="${n}" data-has-trailing="${c}" data-open="false">
+          <div class="control" part="control" data-has-leading="${n}" data-has-trailing="${a}" data-open="false">
             <span class="leading" part="leading" ${n ? "" : "hidden"}>
               <slot name="leading"></slot>
             </span>
@@ -1251,12 +1221,12 @@ class O extends R {
               aria-haspopup="listbox"
               aria-expanded="false"
               aria-label="${f(o)}"
-              ${a ? `aria-labelledby="${l}"` : ""}
+              ${l ? `aria-labelledby="${c}"` : ""}
               ${g ? `aria-describedby="${f(g)}"` : ""}
             >
               <span class="value" part="value"></span>
             </button>
-            <span class="trailing" part="trailing" ${c ? "" : "hidden"}>
+            <span class="trailing" part="trailing" ${a ? "" : "hidden"}>
               <slot name="trailing"></slot>
             </span>
             <span class="indicator" part="indicator" aria-hidden="true"></span>

package/dist/selection-popup.cjs.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const E=require("./ElementBase-1b301e7f.js"),S=`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const E=require("./ElementBase-EV6mVBUV.js"),S=`
   :host {
     --ui-selection-popup-z: 1280;
     --ui-selection-popup-offset: 10px;

package/dist/selection-popup.esm.js

@@ -1,4 +1,4 @@
-import { E as D } from "./ElementBase-909688f3.mjs";
+import { E as D } from "./ElementBase-YlTLMsGk.mjs";
 const E = `
   :host {
     --ui-selection-popup-z: 1280;
@@ -191,14 +191,12 @@ const E = `
   }
 `;
 function M(p, e) {
-  if (p == null || p === "")
-    return e;
+  if (p == null || p === "") return e;
   const t = Number(p);
   return Number.isFinite(t) ? t : e;
 }
 function y(p, e = !1) {
-  if (p == null)
-    return e;
+  if (p == null) return e;
   const t = String(p).toLowerCase();
   return t !== "false" && t !== "0" && t !== "off";
 }
@@ -247,8 +245,7 @@ class S extends D {
     e ? this.setAttribute("open", "") : this.removeAttribute("open");
   }
   openFor(e) {
-    if (!e)
-      return;
+    if (!e) return;
     const t = document.getElementById(e);
     t && (this._anchor = t, this.setAttribute("anchor-id", e), this.setAttribute("open", ""), this._schedulePosition());
   }
@@ -284,8 +281,7 @@ class S extends D {
     this.open && this._schedulePosition();
   }
   _onDocumentPointerDown(e) {
-    if (!this.open || !y(this.getAttribute("close-on-outside"), !0))
-      return;
+    if (!this.open || !y(this.getAttribute("close-on-outside"), !0)) return;
     const t = e.composedPath();
     t.includes(this) || this._anchor && t.includes(this._anchor) || this.close();
   }
@@ -334,18 +330,15 @@ class S extends D {
   }
   _position() {
     const e = this._popup;
-    if (!e || !this.open || !this._anchor)
-      return;
+    if (!e || !this.open || !this._anchor) return;
     if (!document.body.contains(this._anchor)) {
       this.close();
       return;
     }
     const t = this._anchor.getBoundingClientRect();
-    if (t.width === 0 && t.height === 0)
-      return;
+    if (t.width === 0 && t.height === 0) return;
     const o = e.getBoundingClientRect();
-    if (o.width === 0 || o.height === 0)
-      return;
+    if (o.width === 0 || o.height === 0) return;
     const s = this.getAttribute("placement") || "top", u = M(this.getAttribute("offset"), 10), r = 8, a = [], i = (c) => {
       a.includes(c) || a.push(c);
     };

package/dist/selector-BvAh35ve.js

@@ -0,0 +1 @@
+"use strict";let r=null,u=!0;function l(t){if(t===r)return u;let e=!0;try{document.createDocumentFragment().querySelector(t)}catch{e=!1}return r=t,u=e,e}function n(t,e){return!e||!l(e)?null:t.querySelector(e)}exports.isValidSelector=l;exports.safeQuerySelector=n;

package/dist/selector-WI8pD7YO.mjs

@@ -0,0 +1,18 @@
+let r = null, u = !0;
+function l(t) {
+  if (t === r) return u;
+  let e = !0;
+  try {
+    document.createDocumentFragment().querySelector(t);
+  } catch {
+    e = !1;
+  }
+  return r = t, u = e, e;
+}
+function n(t, e) {
+  return !e || !l(e) ? null : t.querySelector(e);
+}
+export {
+  l as i,
+  n as s
+};

package/dist/separator.cjs.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("./ElementBase-1b301e7f.js"),l=`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("./ElementBase-EV6mVBUV.js"),l=`
   :host {
     --ui-separator-color: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 80%, transparent);
     --ui-separator-thickness: 1px;

package/dist/separator.esm.js

@@ -1,4 +1,4 @@
-import { E as n } from "./ElementBase-909688f3.mjs";
+import { E as n } from "./ElementBase-YlTLMsGk.mjs";
 const s = `
   :host {
     --ui-separator-color: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 80%, transparent);