@editora/ui-core 0.1.20 → 0.1.22

package/dist/dropdown.esm.js

@@ -1,12 +1,13 @@
 import { E as _ } from "./ElementBase-YlTLMsGk.mjs";
-import { c as x } from "./menu-item-styles-CZiPwPwl.mjs";
+import { r as x } from "./trigger-BjnxLCeQ.mjs";
+import { c as y } from "./menu-item-styles-IGSFLAHu.mjs";
 const l = [
   '[role="menuitem"]',
   '[role="menuitemcheckbox"]',
   '[role="menuitemradio"]',
   ".item",
   "[data-menu-item]"
-].join(", "), y = `
+].join(", "), k = `
   :host {
     --ui-dropdown-bg: var(
       --ui-dropdown-menu-bg,
@@ -251,7 +252,7 @@ const l = [
   }
 
   .menu[data-tone='neutral'] {
-    --ui-dropdown-ring: color-mix(in srgb, var(--ui-color-muted, #64748b) 60%, var(--ui-dropdown-color));
+    --ui-dropdown-ring: color-mix(in srgb, var(--ui-color-muted, #526175) 60%, var(--ui-dropdown-color));
   }
 
   .menu[data-tone='danger'] {
@@ -262,20 +263,20 @@ const l = [
   }
 
   .menu[data-tone='success'] {
-    --ui-dropdown-ring: var(--ui-color-success, #16a34a);
-    --ui-dropdown-item-hover-bg: color-mix(in srgb, var(--ui-color-success, #16a34a) 12%, transparent);
-    --ui-dropdown-item-active-bg: color-mix(in srgb, var(--ui-color-success, #16a34a) 18%, transparent);
-    --ui-dropdown-item-checked-bg: color-mix(in srgb, var(--ui-color-success, #16a34a) 16%, transparent);
+    --ui-dropdown-ring: var(--ui-color-success, #15803d);
+    --ui-dropdown-item-hover-bg: color-mix(in srgb, var(--ui-color-success, #15803d) 12%, transparent);
+    --ui-dropdown-item-active-bg: color-mix(in srgb, var(--ui-color-success, #15803d) 18%, transparent);
+    --ui-dropdown-item-checked-bg: color-mix(in srgb, var(--ui-color-success, #15803d) 16%, transparent);
   }
 
   .menu[data-tone='warning'] {
-    --ui-dropdown-ring: var(--ui-color-warning, #d97706);
-    --ui-dropdown-item-hover-bg: color-mix(in srgb, var(--ui-color-warning, #d97706) 15%, transparent);
-    --ui-dropdown-item-active-bg: color-mix(in srgb, var(--ui-color-warning, #d97706) 20%, transparent);
-    --ui-dropdown-item-checked-bg: color-mix(in srgb, var(--ui-color-warning, #d97706) 17%, transparent);
+    --ui-dropdown-ring: var(--ui-color-warning, #b45309);
+    --ui-dropdown-item-hover-bg: color-mix(in srgb, var(--ui-color-warning, #b45309) 15%, transparent);
+    --ui-dropdown-item-active-bg: color-mix(in srgb, var(--ui-color-warning, #b45309) 20%, transparent);
+    --ui-dropdown-item-checked-bg: color-mix(in srgb, var(--ui-color-warning, #b45309) 17%, transparent);
   }
 
-  ${x({
+  ${y({
   scopes: [".menu"],
   prefix: "--ui-dropdown",
   shortcutSelectors: [".shortcut", ".meta"],
@@ -508,18 +509,18 @@ const l = [
     }
   }
 `;
-function k(i) {
+function A(i) {
   return i === "top" || i === "left" || i === "right" ? i : "bottom";
 }
-function A(i) {
+function S(i) {
   const e = (i || "").trim().toLowerCase();
   return e === "sm" || e === "1" || e === "compact" ? "sm" : e === "lg" || e === "3" || e === "comfortable" ? "lg" : "md";
 }
-function S(i) {
+function C(i) {
   const e = (i || "").trim().toLowerCase();
   return !e || e === "default" ? null : e === "none" ? "0px" : e === "sm" ? "8px" : e === "md" ? "12px" : e === "lg" || e === "large" ? "16px" : e === "full" || e === "pill" ? "999px" : e === "square" ? "6px" : e === "soft" || e === "rounded" ? "14px" : /^\d+(\.\d+)?$/.test(e) ? `${e}px` : /^\d+(\.\d+)?(px|rem|em|%)$/.test(e) ? e : i;
 }
-function h(i, e) {
+function p(i, e) {
   return i.getAttribute(e) || "";
 }
 function f(i, e) {
@@ -527,13 +528,13 @@ function f(i, e) {
   const t = i.trim().toLowerCase();
   return t !== "false" && t !== "0" && t !== "off";
 }
-function p() {
+function h() {
   return typeof window < "u" && typeof document < "u";
 }
 function b(i) {
   return i.hasAttribute("disabled") || i.getAttribute("aria-disabled") === "true" || i.disabled === !0;
 }
-function C(i) {
+function E(i) {
   return (i.getAttribute("aria-label") || i.textContent || "").trim();
 }
 function g(i) {
@@ -544,7 +545,7 @@ function g(i) {
       i.focus();
     }
 }
-function E(i, e) {
+function I(i, e) {
   const t = i.offsetTop, r = t + i.offsetHeight, o = e.scrollTop, a = o + e.clientHeight;
   if (t < o) {
     e.scrollTop = t;
@@ -552,7 +553,7 @@ function E(i, e) {
   }
   r > a && (e.scrollTop = Math.max(0, r - e.clientHeight));
 }
-function I(i) {
+function T(i) {
   return w(i);
 }
 function w(i) {
@@ -567,23 +568,23 @@ function w(i) {
     t.appendChild(w(r));
   }), t;
 }
-function T(i, e, t) {
+function M(i, e, t) {
   for (let r = e + t; r >= 0 && r < i.length; r += t)
     if (!b(i[r])) return r;
   return -1;
 }
-function M(i, e, t) {
+function O(i, e, t) {
   if (!e) return null;
   const r = i.filter((a) => !b(a));
   if (!r.length) return null;
   const o = t ? r.indexOf(t) : -1;
   for (let a = 1; a <= r.length; a += 1) {
     const n = r[(o + a + r.length) % r.length];
-    if (C(n).toLowerCase().startsWith(e)) return n;
+    if (E(n).toLowerCase().startsWith(e)) return n;
   }
   return null;
 }
-const O = /* @__PURE__ */ new Set(["variant", "density", "shape", "elevation", "tone", "size", "radius"]), P = /* @__PURE__ */ new Set(["aria-label", "aria-labelledby", "aria-describedby"]), F = [
+const P = /* @__PURE__ */ new Set(["variant", "density", "shape", "elevation", "tone", "size", "radius"]), F = /* @__PURE__ */ new Set(["aria-label", "aria-labelledby", "aria-describedby"]), D = [
   "--ui-dropdown-bg",
   "--ui-dropdown-color",
   "--ui-dropdown-muted",
@@ -605,7 +606,7 @@ const O = /* @__PURE__ */ new Set(["variant", "density", "shape", "elevation", "
   "--ui-dropdown-duration",
   "--ui-dropdown-easing"
 ];
-class D extends _ {
+class L extends _ {
   constructor() {
     super(), this._isOpen = !1, this._panelEl = null, this._portalEl = null, this._restoreFocusEl = null, this._typeaheadBuffer = "", this._typeaheadTimer = null, this._placement = "bottom", this._openListenersBound = !1, this._openFrame = 0, this._checkboxState = /* @__PURE__ */ new Map(), this._radioState = /* @__PURE__ */ new Map(), this._menuId = `ui-dropdown-menu-${Math.random().toString(36).slice(2, 10)}`, this._triggerId = `ui-dropdown-trigger-${Math.random().toString(36).slice(2, 10)}`, this._onHostClick = this._onHostClick.bind(this), this._onHostKeyDown = this._onHostKeyDown.bind(this), this._onDocumentPointerDown = this._onDocumentPointerDown.bind(this), this._onSlotChange = this._onSlotChange.bind(this);
   }
@@ -646,11 +647,11 @@ class D extends _ {
           this.hasAttribute("disabled") && this._isOpen && this.close("disabled"), this._syncTriggerA11y();
           return;
         }
-        if (this._isOpen && (e === "placement" || O.has(e))) {
+        if (this._isOpen && (e === "placement" || P.has(e))) {
           this._syncMenuPresentation(), this._schedulePanelSync();
           return;
         }
-        this._isOpen && P.has(e) && this._syncMenuA11y();
+        this._isOpen && F.has(e) && this._syncMenuA11y();
       }
     }
   }
@@ -705,7 +706,7 @@ class D extends _ {
   }
   _isFocusable(e) {
     if (!e || !e.isConnected || e.disabled || e.getAttribute("aria-hidden") === "true") return !1;
-    if (!p()) return !0;
+    if (!h()) return !0;
     const t = window.getComputedStyle(e);
     return t.display !== "none" && t.visibility !== "hidden";
   }
@@ -781,20 +782,20 @@ class D extends _ {
   }
   _syncTriggerA11y() {
     const e = this._getTrigger();
-    if (e) {
-      if (e.id || (e.id = this._triggerId), e.setAttribute("aria-haspopup", "menu"), e.setAttribute("aria-expanded", this._isOpen ? "true" : "false"), this._isOpen ? e.setAttribute("aria-controls", this._menuId) : e.removeAttribute("aria-controls"), this.hasAttribute("disabled")) {
-        e.setAttribute("aria-disabled", "true"), e.setAttribute("tabindex", "-1");
-        return;
-      }
-      e.getAttribute("aria-disabled") === "true" && e.removeAttribute("aria-disabled"), e.getAttribute("tabindex") === "-1" && e.removeAttribute("tabindex");
+    if (!e) return;
+    const t = x(e);
+    if (t.id || (t.id = this._triggerId), t.setAttribute("aria-haspopup", "menu"), t.setAttribute("aria-expanded", this._isOpen ? "true" : "false"), this._isOpen ? t.setAttribute("aria-controls", this._menuId) : t.removeAttribute("aria-controls"), this.hasAttribute("disabled")) {
+      t.setAttribute("aria-disabled", "true"), t.setAttribute("tabindex", "-1");
+      return;
     }
+    t.getAttribute("aria-disabled") === "true" && t.removeAttribute("aria-disabled"), t.getAttribute("tabindex") === "-1" && t.removeAttribute("tabindex");
   }
   _renderMenuContent() {
     const e = this._getMenu();
     if (!e) return;
     e.replaceChildren();
     const t = this._getContentSource();
-    if (t && e.appendChild(I(t)), !e.querySelector(l)) {
+    if (t && e.appendChild(T(t)), !e.querySelector(l)) {
       const r = document.createElement("div");
       r.className = "empty-state", r.textContent = "No items", e.appendChild(r);
     }
@@ -828,12 +829,12 @@ class D extends _ {
   _syncMenuPresentation() {
     const e = this._getMenu();
     if (!e) return;
-    const t = p() ? window.getComputedStyle(this) : null;
-    t && F.forEach((c) => {
+    const t = h() ? window.getComputedStyle(this) : null;
+    t && D.forEach((c) => {
       const m = t.getPropertyValue(c).trim();
       m ? e.style.setProperty(c, m) : e.style.removeProperty(c);
     });
-    const r = h(this, "variant"), o = A(this.getAttribute("size") || this.getAttribute("density")), a = h(this, "density"), n = h(this, "shape"), u = h(this, "elevation"), s = h(this, "tone"), d = S(this.getAttribute("radius") || n || null);
+    const r = p(this, "variant"), o = S(this.getAttribute("size") || this.getAttribute("density")), a = p(this, "density"), n = p(this, "shape"), u = p(this, "elevation"), s = p(this, "tone"), d = C(this.getAttribute("radius") || n || null);
     if (r && r !== "default" ? e.setAttribute("data-variant", r) : e.removeAttribute("data-variant"), o !== "md" ? e.setAttribute("data-size", o) : e.removeAttribute("data-size"), a && a !== "default" ? e.setAttribute("data-density", a) : e.removeAttribute("data-density"), n && n !== "default" ? e.setAttribute("data-shape", n) : e.removeAttribute("data-shape"), u && u !== "default" ? e.setAttribute("data-elevation", u) : e.removeAttribute("data-elevation"), s && s !== "default" && s !== "brand" ? e.setAttribute("data-tone", s) : e.removeAttribute("data-tone"), d) {
       e.style.setProperty("--ui-dropdown-radius", d), e.style.setProperty("--ui-dropdown-item-radius", d === "999px" ? "999px" : `max(0px, calc(${d} - 2px))`);
       return;
@@ -861,19 +862,19 @@ class D extends _ {
   }
   _availableWidth(e) {
     const t = this._getTrigger();
-    if (!t || !p()) return 380;
+    if (!t || !h()) return 380;
     const r = t.getBoundingClientRect(), o = window.innerWidth || document.documentElement.clientWidth || 0;
     return e === "left" ? r.left - 12 : e === "right" ? o - r.right - 12 : o - r.left - 12;
   }
   _availableHeight(e) {
     const t = this._getTrigger();
-    if (!t || !p()) return 440;
+    if (!t || !h()) return 440;
     const r = t.getBoundingClientRect(), o = window.innerHeight || document.documentElement.clientHeight || 0;
     return e === "top" ? r.top - 12 : o - r.bottom - 12;
   }
   _resolvePlacement() {
-    const e = k(this.getAttribute("placement")), t = this._getTrigger(), r = this._getMenu();
-    if (!t || !r || !p()) return e;
+    const e = A(this.getAttribute("placement")), t = this._getTrigger(), r = this._getMenu();
+    if (!t || !r || !h()) return e;
     const o = t.getBoundingClientRect(), a = window.innerWidth || document.documentElement.clientWidth || 0, n = window.innerHeight || document.documentElement.clientHeight || 0, u = Math.max(0, n - o.bottom - 12), s = Math.max(0, o.top - 12), d = Math.max(0, a - o.right - 12), c = Math.max(0, o.left - 12), m = Math.min(Math.max(r.scrollHeight, r.offsetHeight) + 4, 320), v = Math.min(Math.max(r.scrollWidth, r.offsetWidth) + 4, 360);
     return e === "top" ? s >= m || s > u ? "top" : "bottom" : e === "left" ? c >= v || c > d ? "left" : "right" : e === "right" ? d >= v || d >= c ? "right" : "left" : u >= m || u >= s ? "bottom" : "top";
   }
@@ -883,7 +884,7 @@ class D extends _ {
   _setActiveItem(e, t = {}) {
     if (this._clearActiveItem(), !!e && (e.setAttribute("data-active", "true"), t.focus && g(e), t.scroll)) {
       const r = this._getMenu();
-      r && E(e, r);
+      r && I(e, r);
     }
   }
   _focusFirstItem() {
@@ -897,7 +898,7 @@ class D extends _ {
   _moveFocus(e) {
     const t = this._queryItems(!0);
     if (!t.length) return;
-    const r = this._currentFocusedItem() || this._queryItems(!0).find((n) => n.getAttribute("data-active") === "true") || null, o = r ? t.indexOf(r) : e > 0 ? -1 : t.length, a = T(t, o, e);
+    const r = this._currentFocusedItem() || this._queryItems(!0).find((n) => n.getAttribute("data-active") === "true") || null, o = r ? t.indexOf(r) : e > 0 ? -1 : t.length, a = M(t, o, e);
     if (a >= 0) {
       this._setActiveItem(t[a], { focus: !0, scroll: !0 });
       return;
@@ -914,7 +915,7 @@ class D extends _ {
     if (!this.typeahead || !this._isTypeaheadKey(e)) return !1;
     const t = e.key.toLowerCase();
     this._typeaheadBuffer = `${this._typeaheadBuffer}${t}`.slice(0, 24), this._typeaheadTimer != null && window.clearTimeout(this._typeaheadTimer), this._typeaheadTimer = window.setTimeout(() => this._resetTypeahead(), 460);
-    const r = M(this._queryItems(!0), this._typeaheadBuffer, this._currentFocusedItem());
+    const r = O(this._queryItems(!0), this._typeaheadBuffer, this._currentFocusedItem());
     return r ? (this._setActiveItem(r, { focus: !0, scroll: !0 }), e.preventDefault(), !0) : !1;
   }
   _querySourceItems() {
@@ -1023,7 +1024,7 @@ class D extends _ {
   }
   render() {
     this.setContent(`
-      <style>${y}</style>
+      <style>${k}</style>
       <div class="root" part="root">
         <div class="trigger" part="trigger">
           <slot name="trigger"></slot>
@@ -1048,7 +1049,7 @@ class D extends _ {
     return !1;
   }
 }
-typeof customElements < "u" && !customElements.get("ui-dropdown") && customElements.define("ui-dropdown", D);
+typeof customElements < "u" && !customElements.get("ui-dropdown") && customElements.define("ui-dropdown", L);
 export {
-  D as UIDropdown
+  L as UIDropdown
 };

package/dist/empty-state.cjs.js

@@ -6,8 +6,8 @@
     --ui-empty-radius: 16px;
     --ui-empty-padding: 28px;
     --ui-empty-title: var(--ui-color-text, #0f172a);
-    --ui-empty-description: var(--ui-color-muted, #64748b);
-    --ui-empty-icon-bg: color-mix(in srgb, var(--ui-color-muted, #64748b) 18%, transparent);
+    --ui-empty-description: var(--ui-color-muted, #526175);
+    --ui-empty-icon-bg: color-mix(in srgb, var(--ui-color-muted, #526175) 18%, transparent);
     --ui-empty-icon-color: color-mix(in srgb, var(--ui-color-text, #334155) 82%, transparent);
     --ui-empty-shadow: none;
     --ui-empty-action-bg: color-mix(in srgb, var(--ui-color-primary, #2563eb) 14%, transparent);
@@ -100,7 +100,7 @@
 
   :host([tone="success"]) {
     --ui-empty-icon-color: var(--ui-color-success, #166534);
-    --ui-empty-icon-bg: color-mix(in srgb, var(--ui-color-success, #16a34a) 20%, transparent);
+    --ui-empty-icon-bg: color-mix(in srgb, var(--ui-color-success, #15803d) 20%, transparent);
   }
 
   :host([tone="warning"]) {

package/dist/empty-state.esm.js

@@ -7,8 +7,8 @@ const a = `
     --ui-empty-radius: 16px;
     --ui-empty-padding: 28px;
     --ui-empty-title: var(--ui-color-text, #0f172a);
-    --ui-empty-description: var(--ui-color-muted, #64748b);
-    --ui-empty-icon-bg: color-mix(in srgb, var(--ui-color-muted, #64748b) 18%, transparent);
+    --ui-empty-description: var(--ui-color-muted, #526175);
+    --ui-empty-icon-bg: color-mix(in srgb, var(--ui-color-muted, #526175) 18%, transparent);
     --ui-empty-icon-color: color-mix(in srgb, var(--ui-color-text, #334155) 82%, transparent);
     --ui-empty-shadow: none;
     --ui-empty-action-bg: color-mix(in srgb, var(--ui-color-primary, #2563eb) 14%, transparent);
@@ -101,7 +101,7 @@ const a = `
 
   :host([tone="success"]) {
     --ui-empty-icon-color: var(--ui-color-success, #166534);
-    --ui-empty-icon-bg: color-mix(in srgb, var(--ui-color-success, #16a34a) 20%, transparent);
+    --ui-empty-icon-bg: color-mix(in srgb, var(--ui-color-success, #15803d) 20%, transparent);
   }
 
   :host([tone="warning"]) {

package/dist/field-error.cjs.js

@@ -1,6 +1,6 @@
 "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=require("./ElementBase-EV6mVBUV.js"),u=`
   :host {
-    --ui-field-error-color: var(--ui-color-danger, var(--ui-error, #dc2626));
+    --ui-field-error-color: var(--ui-color-danger, var(--ui-error, #c81e1e));
     --ui-field-error-size: 12px;
     --ui-field-error-weight: 600;
     --ui-field-error-line-height: 1.45;

package/dist/field-error.esm.js

@@ -1,7 +1,7 @@
 import { E as d } from "./ElementBase-YlTLMsGk.mjs";
 const l = `
   :host {
-    --ui-field-error-color: var(--ui-color-danger, var(--ui-error, #dc2626));
+    --ui-field-error-color: var(--ui-color-danger, var(--ui-error, #c81e1e));
     --ui-field-error-size: 12px;
     --ui-field-error-weight: 600;
     --ui-field-error-line-height: 1.45;

package/dist/field.cjs.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const E=require("./ElementBase-EV6mVBUV.js"),q=`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const M=require("./ElementBase-EV6mVBUV.js"),N=`
   :host {
     --ui-field-gap: 8px;
     --ui-field-label-width: 192px;
@@ -6,8 +6,8 @@
     --ui-field-bg: var(--ui-color-surface, var(--ui-surface, #ffffff));
     --ui-field-color: var(--ui-color-text, var(--ui-text, #0f172a));
     --ui-field-label-color: var(--ui-color-text, var(--ui-text, #0f172a));
-    --ui-field-description-color: var(--ui-color-muted, var(--ui-muted, #64748b));
-    --ui-field-error-color: var(--ui-color-danger, var(--ui-error, #dc2626));
+    --ui-field-description-color: var(--ui-color-muted, var(--ui-muted, #526175));
+    --ui-field-error-color: var(--ui-color-danger, var(--ui-error, #c81e1e));
     --ui-field-border-color: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 72%, transparent);
     --ui-field-border: 1px solid var(--ui-field-border-color);
     --ui-field-shadow:
@@ -216,7 +216,7 @@
 
   :host([tone="danger"]) {
     --ui-field-accent: #dc2626;
-    --ui-field-error-color: #dc2626;
+    --ui-field-error-color: #c81e1e;
   }
 
   :host([density="compact"]) {
@@ -370,19 +370,19 @@
       box-shadow: none;
     }
   }
-`;function b(o){return o.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#39;")}function p(o){if(!o)return!1;const e=o.assignedNodes({flatten:!0});return e.length?e.some(r=>r.nodeType===Node.TEXT_NODE?!!r.textContent?.trim():r.nodeType===Node.ELEMENT_NODE):!1}function f(o){if(o.hasAttribute("disabled")||o.getAttribute("aria-disabled")==="true"||o.getAttribute("tabindex")==="-1")return!1;const e=window.getComputedStyle(o);return!(e.display==="none"||e.visibility==="hidden")}function k(o){return!!o.closest('button, a, input, select, textarea, summary, [contenteditable=""], [contenteditable="true"], [role="button"]')}function _(o){return Array.from(new Set(o.filter(Boolean)))}const S='ui-input, ui-textarea, ui-select, ui-combobox, input, textarea, select, button, [tabindex]:not([tabindex="-1"])';class A extends E.ElementBase{constructor(){super(),this._uid=Math.random().toString(36).slice(2,9),this._controlCache=null,this._stateSyncQueued=!1,this._onRootClick=this._onRootClick.bind(this),this._onSlotChange=this._onSlotChange.bind(this)}static get observedAttributes(){return["label","description","error","for","required","invalid","orientation","headless","variant","tone","density","shape","shell","label-width"]}connectedCallback(){super.connectedCallback(),this.root.addEventListener("click",this._onRootClick),this.root.addEventListener("slotchange",this._onSlotChange),this._scheduleDerivedStateSync()}disconnectedCallback(){this.root.removeEventListener("click",this._onRootClick),this.root.removeEventListener("slotchange",this._onSlotChange),super.disconnectedCallback()}attributeChangedCallback(e,r,l){if(r!==l){if(e==="for"&&this._invalidateControlCache(),e==="label-width"){const i=this.getAttribute("label-width");i?this.style.setProperty("--ui-field-label-width",i):this.style.removeProperty("--ui-field-label-width")}if(e==="label"||e==="description"||e==="error"||e==="required"||e==="for"){this.isConnected&&this.requestRender();return}e==="invalid"&&this._scheduleDerivedStateSync()}}_onSlotChange(){this._invalidateControlCache(),this._scheduleDerivedStateSync()}_onRootClick(e){const r=e.target;r&&r.closest(".label")&&(k(r)||this._focusControl())}_invalidateControlCache(){this._controlCache=null}_scheduleDerivedStateSync(){this._stateSyncQueued||(this._stateSyncQueued=!0,queueMicrotask(()=>{this._stateSyncQueued=!1,this.isConnected&&this._syncDerivedState()}))}_focusControl(){const e=this._resolveControlElement();if(e)try{e.focus({preventScroll:!0})}catch{e.focus()}}_resolveControlElement(){if(this._controlCache&&this._controlCache.isConnected&&f(this._controlCache))return this._controlCache;const e=this.getAttribute("for");if(e){const t=document.getElementById(e);if(t instanceof HTMLElement&&f(t))return this._controlCache=t,t}const l=this.root.querySelector("slot:not([name])")?.assignedElements({flatten:!0})||[];for(const t of l){if(!(t instanceof HTMLElement))continue;if(f(t))return this._controlCache=t,t;const s=t.querySelector(S);if(s&&f(s))return this._controlCache=s,s}const i=this.querySelector(S);return i&&f(i)?(this._controlCache=i,i):null}_syncDerivedState(){const e=this.root.querySelector('slot[name="label"]'),r=this.root.querySelector('slot[name="actions"]'),l=this.root.querySelector('slot[name="description"]'),i=this.root.querySelector('slot[name="error"]'),t=(this.getAttribute("label")||"").trim(),s=(this.getAttribute("description")||"").trim(),h=(this.getAttribute("error")||"").trim(),n=!!t||p(e),c=p(r),d=!!s||p(l),u=!!h||p(i),C=n||c||d,a=n||c,g=this.root.querySelector(".meta"),v=this.root.querySelector(".label-row"),m=this.root.querySelector(".label"),x=this.root.querySelector(".actions"),y=this.root.querySelector(".description"),w=this.root.querySelector(".error");g&&(C?g.removeAttribute("hidden"):g.setAttribute("hidden","")),v&&(a?v.removeAttribute("hidden"):v.setAttribute("hidden","")),m&&(n?m.removeAttribute("hidden"):m.setAttribute("hidden","")),x&&(c?x.removeAttribute("hidden"):x.setAttribute("hidden","")),y&&(d?y.removeAttribute("hidden"):y.setAttribute("hidden","")),w&&(u?w.removeAttribute("hidden"):w.setAttribute("hidden","")),this._syncControlA11y(n,d,u)}_syncControlA11y(e,r,l){const i=this._resolveControlElement();if(!i)return;const t=`${this._uid}-label`,s=`${this._uid}-description`,h=`${this._uid}-error`,n=(i.getAttribute("aria-labelledby")||"").split(/\s+/).filter(a=>a&&a!==t);!i.hasAttribute("aria-label")&&e&&n.push(t);const c=_(n);c.length?i.setAttribute("aria-labelledby",c.join(" ")):i.removeAttribute("aria-labelledby");const d=(i.getAttribute("aria-describedby")||"").split(/\s+/).filter(a=>a&&a!==s&&a!==h);r&&d.push(s),l&&d.push(h);const u=_(d);u.length?i.setAttribute("aria-describedby",u.join(" ")):i.removeAttribute("aria-describedby"),this.hasAttribute("invalid")||l?i.setAttribute("aria-invalid","true"):i.removeAttribute("aria-invalid"),this.hasAttribute("required")?i.setAttribute("aria-required","true"):i.removeAttribute("aria-required")}render(){const e=this.getAttribute("label")||"",r=this.getAttribute("description")||"",l=this.getAttribute("error")||"",i=this.hasAttribute("required"),t=this.getAttribute("for")||"";this.setContent(`
-      <style>${q}</style>
+`;function C(r){return r.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#39;")}function A(r){if(!r)return!1;const t=r.assignedNodes({flatten:!0});return t.length?t.some(i=>i.nodeType===Node.TEXT_NODE?!!i.textContent?.trim():i.nodeType===Node.ELEMENT_NODE):!1}function x(r){if(r.hasAttribute("disabled")||r.getAttribute("aria-disabled")==="true"||r.getAttribute("tabindex")==="-1")return!1;const t=window.getComputedStyle(r);return!(t.display==="none"||t.visibility==="hidden")}function D(r){return!!r.closest('button, a, input, select, textarea, summary, [contenteditable=""], [contenteditable="true"], [role="button"]')}function k(r){return Array.from(new Set(r.filter(Boolean)))}const _="data-ui-field-label",S="data-ui-field-description",I='ui-input, ui-textarea, ui-select, ui-combobox, input, textarea, select, button, [tabindex]:not([tabindex="-1"])';class L extends M.ElementBase{constructor(){super(),this._uid=Math.random().toString(36).slice(2,9),this._controlCache=null,this._stateSyncQueued=!1,this._onRootClick=this._onRootClick.bind(this),this._onSlotChange=this._onSlotChange.bind(this)}static get observedAttributes(){return["label","description","error","for","required","invalid","orientation","headless","variant","tone","density","shape","shell","label-width"]}connectedCallback(){super.connectedCallback(),this.root.addEventListener("click",this._onRootClick),this.root.addEventListener("slotchange",this._onSlotChange),this._scheduleDerivedStateSync()}disconnectedCallback(){this.root.removeEventListener("click",this._onRootClick),this.root.removeEventListener("slotchange",this._onSlotChange),super.disconnectedCallback()}attributeChangedCallback(t,i,l){if(i!==l){if(t==="for"&&this._invalidateControlCache(),t==="label-width"){const o=this.getAttribute("label-width");o?this.style.setProperty("--ui-field-label-width",o):this.style.removeProperty("--ui-field-label-width")}if(t==="label"||t==="description"||t==="error"||t==="required"||t==="for"){this.isConnected&&this.requestRender();return}t==="invalid"&&this._scheduleDerivedStateSync()}}_onSlotChange(){this._invalidateControlCache(),this._scheduleDerivedStateSync()}_onRootClick(t){const i=t.target;i&&i.closest(".label")&&(D(i)||this._focusControl())}_invalidateControlCache(){this._controlCache=null}_scheduleDerivedStateSync(){this._stateSyncQueued||(this._stateSyncQueued=!0,queueMicrotask(()=>{this._stateSyncQueued=!1,this.isConnected&&this._syncDerivedState()}))}_focusControl(){const t=this._resolveControlElement();if(t)try{t.focus({preventScroll:!0})}catch{t.focus()}}_resolveControlElement(){if(this._controlCache&&this._controlCache.isConnected&&x(this._controlCache))return this._controlCache;const t=this.getAttribute("for");if(t){const e=document.getElementById(t);if(e instanceof HTMLElement&&x(e))return this._controlCache=e,e}const l=this.root.querySelector("slot:not([name])")?.assignedElements({flatten:!0})||[];for(const e of l){if(!(e instanceof HTMLElement))continue;if(x(e))return this._controlCache=e,e;const a=e.querySelector(I);if(a&&x(a))return this._controlCache=a,a}const o=this.querySelector(I);return o&&x(o)?(this._controlCache=o,o):null}_syncDerivedState(){const t=this.root.querySelector('slot[name="label"]'),i=this.root.querySelector('slot[name="actions"]'),l=this.root.querySelector('slot[name="description"]'),o=this.root.querySelector('slot[name="error"]'),e=(this.getAttribute("label")||"").trim(),a=(this.getAttribute("description")||"").trim(),y=(this.getAttribute("error")||"").trim(),n=!!e||A(t),d=A(i),h=!!a||A(l),b=!!y||A(o),w=n||d||h,E=n||d,c=this.root.querySelector(".meta"),p=this.root.querySelector(".label-row"),g=this.root.querySelector(".label"),m=this.root.querySelector(".actions"),u=this.root.querySelector(".description"),v=this.root.querySelector(".error");c&&(w?c.removeAttribute("hidden"):c.setAttribute("hidden","")),p&&(E?p.removeAttribute("hidden"):p.setAttribute("hidden","")),g&&(n?g.removeAttribute("hidden"):g.setAttribute("hidden","")),m&&(d?m.removeAttribute("hidden"):m.setAttribute("hidden","")),u&&(h?u.removeAttribute("hidden"):u.setAttribute("hidden","")),v&&(b?v.removeAttribute("hidden"):v.setAttribute("hidden",""));const q=t?t.assignedNodes({flatten:!0}).map(f=>f.textContent||"").join(" "):"",s=f=>f.replace(/\s+/g," ").trim(),T=f=>f?f.assignedNodes({flatten:!0}).map($=>$.textContent||"").join(" "):"",B=h?s(a||T(l)):"",R=b?s(y||T(o)):"";this._syncControlA11y(n,s(e||q),[B,R].filter(Boolean).join(" "),b)}_syncControlA11y(t,i,l,o){const e=this._resolveControlElement();if(!e)return;const a=`${this._uid}-label`,y=`${this._uid}-description`,n=`${this._uid}-error`,d=(e.getAttribute("aria-labelledby")||"").split(/\s+/).filter(s=>s&&s!==a),h=e.getRootNode(),b=d.some(s=>!!h.getElementById?.(s)),w=k(d);w.length?e.setAttribute("aria-labelledby",w.join(" ")):e.removeAttribute("aria-labelledby");const E=e.hasAttribute("aria-label")&&!e.hasAttribute(_),c=e.labels,p=(e.getAttribute("label")||"").trim().length>0,g=(e.textContent||"").trim().length>0,m=b||E||p||g||!!(c&&c.length>0);t&&i&&!m?(e.setAttribute("aria-label",i),e.setAttribute(_,"")):e.hasAttribute(_)&&(e.removeAttribute("aria-label"),e.removeAttribute(_));const u=k((e.getAttribute("aria-describedby")||"").split(/\s+/).filter(s=>s&&s!==y&&s!==n));u.length?e.setAttribute("aria-describedby",u.join(" ")):e.removeAttribute("aria-describedby");const v=e.hasAttribute("aria-description")&&!e.hasAttribute(S);l&&!v?(e.setAttribute("aria-description",l),e.setAttribute(S,"")):e.hasAttribute(S)&&(e.removeAttribute("aria-description"),e.removeAttribute(S)),this.hasAttribute("invalid")||o?e.setAttribute("aria-invalid","true"):e.removeAttribute("aria-invalid"),this.hasAttribute("required")?e.setAttribute("aria-required","true"):e.removeAttribute("aria-required")}render(){const t=this.getAttribute("label")||"",i=this.getAttribute("description")||"",l=this.getAttribute("error")||"",o=this.hasAttribute("required"),e=this.getAttribute("for")||"";this.setContent(`
+      <style>${N}</style>
       <div class="frame" part="field">
         <div class="meta" part="meta">
           <div class="label-row" part="top">
-            <label class="label" id="${this._uid}-label" ${t?`for="${b(t)}"`:""}>
-              <slot name="label">${b(e)}</slot>
-              ${i?'<span class="required" aria-hidden="true">*</span>':""}
+            <label class="label" id="${this._uid}-label" ${e?`for="${C(e)}"`:""}>
+              <slot name="label">${C(t)}</slot>
+              ${o?'<span class="required" aria-hidden="true">*</span>':""}
             </label>
             <div class="actions" part="actions"><slot name="actions"></slot></div>
           </div>
           <p class="description" id="${this._uid}-description" part="description">
-            <slot name="description">${b(r)}</slot>
+            <slot name="description">${C(i)}</slot>
           </p>
         </div>
 
@@ -391,8 +391,8 @@
             <div class="control" part="control"><slot></slot></div>
           </div>
           <p class="error" id="${this._uid}-error" part="error" aria-live="polite">
-            <slot name="error">${b(l)}</slot>
+            <slot name="error">${C(l)}</slot>
           </p>
         </div>
       </div>
-    `),this._invalidateControlCache(),this._scheduleDerivedStateSync()}shouldRenderOnAttributeChange(e,r,l){return e==="label"||e==="description"||e==="error"||e==="required"||e==="for"}}typeof customElements<"u"&&!customElements.get("ui-field")&&customElements.define("ui-field",A);exports.UIField=A;
+    `),this._invalidateControlCache(),this._scheduleDerivedStateSync()}shouldRenderOnAttributeChange(t,i,l){return t==="label"||t==="description"||t==="error"||t==="required"||t==="for"}}typeof customElements<"u"&&!customElements.get("ui-field")&&customElements.define("ui-field",L);exports.UIField=L;