@editora/ui-core 0.1.20 → 0.1.22

package/dist/multi-select.esm.js

@@ -1,15 +1,16 @@
 import { E as T } from "./ElementBase-YlTLMsGk.mjs";
-import { n as w } from "./collection-C7URGjEI.mjs";
-import "./listbox-DJamVeFj.mjs";
-let R = 0;
-const K = `
+import { a as R } from "./control-name-Bpj7F34X.mjs";
+import { n as z } from "./collection-C7URGjEI.mjs";
+import "./listbox-hMVOhKHC.mjs";
+let K = 0;
+const W = `
   :host {
     --ui-multi-select-border-color: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 82%, transparent);
     --ui-multi-select-border: var(--base-multi-select-border, 1px solid var(--ui-multi-select-border-color));
     --ui-multi-select-radius: var(--base-multi-select-radius, var(--ui-radius, 4px));
     --ui-multi-select-bg: var(--base-multi-select-bg, var(--color-panel-solid, var(--ui-color-surface, #ffffff)));
     --ui-multi-select-text: var(--ui-color-text, var(--ui-text, #0f172a));
-    --ui-multi-select-muted: var(--ui-color-muted, var(--ui-muted, #64748b));
+    --ui-multi-select-muted: var(--ui-color-muted, var(--ui-muted, #526175));
     --ui-multi-select-focus: var(--ui-color-focus-ring, #2563eb);
     --ui-multi-select-danger: var(--ui-color-danger, #dc2626);
     --ui-multi-select-accent: var(--ui-color-primary, #2563eb);
@@ -495,9 +496,9 @@ const K = `
   }
 
   :host([tone="neutral"]) {
-    --ui-multi-select-accent: color-mix(in srgb, var(--ui-color-muted, #64748b) 62%, var(--ui-color-text, #0f172a));
-    --ui-multi-select-focus: color-mix(in srgb, var(--ui-color-muted, #64748b) 62%, var(--ui-color-text, #0f172a));
-    --ui-multi-select-chip-bg: color-mix(in srgb, var(--ui-color-muted, #64748b) 12%, transparent);
+    --ui-multi-select-accent: color-mix(in srgb, var(--ui-color-muted, #526175) 62%, var(--ui-color-text, #0f172a));
+    --ui-multi-select-focus: color-mix(in srgb, var(--ui-color-muted, #526175) 62%, var(--ui-color-text, #0f172a));
+    --ui-multi-select-chip-bg: color-mix(in srgb, var(--ui-color-muted, #526175) 12%, transparent);
     --ui-multi-select-chip-text: var(--ui-multi-select-text);
   }
 
@@ -507,17 +508,17 @@ const K = `
   }
 
   :host([tone="success"]) {
-    --ui-multi-select-accent: var(--ui-color-success, #16a34a);
-    --ui-multi-select-focus: var(--ui-color-success, #16a34a);
-    --ui-multi-select-chip-bg: color-mix(in srgb, var(--ui-color-success, #16a34a) 12%, transparent);
-    --ui-multi-select-chip-text: color-mix(in srgb, var(--ui-color-success, #16a34a) 82%, #0f172a 18%);
+    --ui-multi-select-accent: var(--ui-color-success, #15803d);
+    --ui-multi-select-focus: var(--ui-color-success, #15803d);
+    --ui-multi-select-chip-bg: color-mix(in srgb, var(--ui-color-success, #15803d) 12%, transparent);
+    --ui-multi-select-chip-text: color-mix(in srgb, var(--ui-color-success, #15803d) 82%, #0f172a 18%);
   }
 
   :host([tone="warning"]) {
-    --ui-multi-select-accent: var(--ui-color-warning, #d97706);
-    --ui-multi-select-focus: var(--ui-color-warning, #d97706);
-    --ui-multi-select-chip-bg: color-mix(in srgb, var(--ui-color-warning, #d97706) 12%, transparent);
-    --ui-multi-select-chip-text: color-mix(in srgb, var(--ui-color-warning, #d97706) 82%, #0f172a 18%);
+    --ui-multi-select-accent: var(--ui-color-warning, #b45309);
+    --ui-multi-select-focus: var(--ui-color-warning, #b45309);
+    --ui-multi-select-chip-bg: color-mix(in srgb, var(--ui-color-warning, #b45309) 12%, transparent);
+    --ui-multi-select-chip-text: color-mix(in srgb, var(--ui-color-warning, #b45309) 82%, #0f172a 18%);
   }
 
   :host([tone="danger"]) {
@@ -547,8 +548,8 @@ function I(r) {
       const n = l;
       if (Array.isArray(n.options)) {
         const a = String(n.label ?? "").trim();
-        n.options.forEach((u) => {
-          !u || typeof u != "object" || s(u, a || void 0);
+        n.options.forEach((c) => {
+          !c || typeof c != "object" || s(c, a || void 0);
         });
         return;
       }
@@ -558,7 +559,7 @@ function I(r) {
     return [];
   }
 }
-function x(r) {
+function v(r) {
   if (!r) return [];
   const e = r.trim();
   if (!e) return [];
@@ -573,12 +574,12 @@ function x(r) {
 function L(r) {
   return !r || r === "default" ? null : r === "none" || r === "square" ? "0px" : r === "sm" ? "8px" : r === "md" || r === "soft" ? "12px" : r === "lg" ? "16px" : r === "full" ? "999px" : /^\d+(\.\d+)?$/.test(r) ? `${r}px` : /^\d+(\.\d+)?(px|rem|em|%)$/.test(r) ? r : null;
 }
-function W(r) {
+function H(r) {
   return r === "sm" || r === "1" ? "sm" : r === "lg" || r === "3" ? "lg" : "md";
 }
-class H extends T {
+class M extends T {
   constructor() {
-    super(), this._options = [], this._selected = [], this._query = "", this._inputEl = null, this._shellEl = null, this._panelEl = null, this._formUnregister = null, this._outsidePointerDown = null, this._activeValue = null, this._uid = `ui-multi-select-${++R}`, this._isSyncingUi = !1, this._needsSyncUi = !1, this._onInput = this._onInput.bind(this), this._onKeyDown = this._onKeyDown.bind(this), this._onToggle = this._onToggle.bind(this), this._onFocusIn = this._onFocusIn.bind(this), this._onFocusOut = this._onFocusOut.bind(this);
+    super(), this._options = [], this._selected = [], this._query = "", this._inputEl = null, this._shellEl = null, this._panelEl = null, this._formUnregister = null, this._outsidePointerDown = null, this._activeValue = null, this._uid = `ui-multi-select-${++K}`, this._isSyncingUi = !1, this._needsSyncUi = !1, this._onInput = this._onInput.bind(this), this._onKeyDown = this._onKeyDown.bind(this), this._onToggle = this._onToggle.bind(this), this._onFocusIn = this._onFocusIn.bind(this), this._onFocusOut = this._onFocusOut.bind(this);
   }
   static get observedAttributes() {
     return [
@@ -586,6 +587,9 @@ class H extends T {
       "value",
       "placeholder",
       "label",
+      "aria-label",
+      "aria-description",
+      "aria-describedby",
       "description",
       "data-error",
       "name",
@@ -614,7 +618,7 @@ class H extends T {
     return [...this._selected];
   }
   set value(e) {
-    const t = Array.isArray(e) ? e.map((s) => String(s)).filter(Boolean) : x(String(e ?? ""));
+    const t = Array.isArray(e) ? e.map((s) => String(s)).filter(Boolean) : v(String(e ?? ""));
     this._setSelected(t, "api");
   }
   get open() {
@@ -630,7 +634,7 @@ class H extends T {
     this._detachOutsideListener(), this._formUnregister && (this._formUnregister(), this._formUnregister = null), super.disconnectedCallback();
   }
   attributeChangedCallback(e, t, s) {
-    if (t !== s && (e === "options" && (this._options = I(s)), e === "value" && (this._selected = x(s)), e === "name" && this.isConnected && this._registerWithForm(), !!this._shellEl)) {
+    if (t !== s && (e === "options" && (this._options = I(s)), e === "value" && (this._selected = v(s)), e === "name" && this.isConnected && this._registerWithForm(), !!this._shellEl)) {
       if (e === "variant" || e === "tone" || e === "density" || e === "shape" || e === "size" || e === "radius" || e === "option-radius" || e === "elevation") {
         this._syncVisualState(), e === "size" && this._syncUi();
         return;
@@ -643,11 +647,11 @@ class H extends T {
   }
   render() {
     this.setContent(`
-      <style>${K}</style>
+      <style>${W}</style>
       <div class="root">
         <div class="meta" hidden>
-          <div class="label" hidden><span class="label-text"></span><span class="required" hidden>*</span></div>
-          <div class="description" hidden></div>
+          <div class="label" hidden><span class="label-text" id="${this._uid}-label"></span><span class="required" hidden>*</span></div>
+          <div class="description" id="${this._uid}-description" hidden></div>
         </div>
         <div class="shell" part="shell" data-open="false" data-invalid="false">
           <div class="value-area" part="value-area">
@@ -666,14 +670,14 @@ class H extends T {
         </div>
         <div class="error" part="error" hidden></div>
       </div>
-    `), this._options = I(this.getAttribute("options")), this._selected = x(this.getAttribute("value")), this._shellEl = this.root.querySelector(".shell"), this._inputEl = this.root.querySelector(".input"), this._panelEl = this.root.querySelector(".panel"), this._inputEl?.addEventListener("input", this._onInput), this._inputEl?.addEventListener("keydown", this._onKeyDown), this.root.querySelector(".toggle")?.addEventListener("click", this._onToggle), this.root.querySelector(".clear")?.addEventListener("click", () => this._clearSelection("clear-button")), this._shellEl?.addEventListener("focusin", this._onFocusIn), this._shellEl?.addEventListener("focusout", this._onFocusOut), this._syncVisualState(), this._syncUi();
+    `), this._options = I(this.getAttribute("options")), this._selected = v(this.getAttribute("value")), this._shellEl = this.root.querySelector(".shell"), this._inputEl = this.root.querySelector(".input"), this._panelEl = this.root.querySelector(".panel"), this._inputEl?.addEventListener("input", this._onInput), this._inputEl?.addEventListener("keydown", this._onKeyDown), this.root.querySelector(".toggle")?.addEventListener("click", this._onToggle), this.root.querySelector(".clear")?.addEventListener("click", () => this._clearSelection("clear-button")), this._shellEl?.addEventListener("focusin", this._onFocusIn), this._shellEl?.addEventListener("focusout", this._onFocusOut), this._syncVisualState(), this._syncUi();
   }
   _syncVisualState() {
     const e = L(this.getAttribute("radius") || this.getAttribute("shape"));
     e ? this.style.setProperty("--ui-multi-select-radius", e) : this.style.removeProperty("--ui-multi-select-radius");
     const t = L(this.getAttribute("option-radius"));
     t ? this.style.setProperty("--ui-multi-select-option-radius", t) : this.style.removeProperty("--ui-multi-select-option-radius");
-    const s = W(this.getAttribute("size"));
+    const s = H(this.getAttribute("size"));
     this.setAttribute("data-size", s);
   }
   _selectionIndicator() {
@@ -693,8 +697,8 @@ class H extends T {
     !this._outsidePointerDown || typeof document > "u" || (document.removeEventListener("pointerdown", this._outsidePointerDown), this._outsidePointerDown = null);
   }
   _filteredOptions() {
-    const e = w(this._query);
-    return e ? this._options.filter((t) => w(t.label).includes(e) || w(t.value).includes(e)) : this._options;
+    const e = z(this._query);
+    return e ? this._options.filter((t) => z(t.label).includes(e) || z(t.value).includes(e)) : this._options;
   }
   _renderLimit() {
     const e = Number(this.getAttribute("render-limit"));
@@ -722,13 +726,13 @@ class H extends T {
   }
   _setSelected(e, t) {
     const s = Number(this.getAttribute("max-selections")), l = [];
-    e.forEach((u) => {
-      if (!u) return;
-      const p = l.indexOf(u);
-      p >= 0 && l.splice(p, 1), l.push(u);
+    e.forEach((c) => {
+      if (!c) return;
+      const p = l.indexOf(c);
+      p >= 0 && l.splice(p, 1), l.push(c);
     });
     const n = Number.isFinite(s) && s > 0 ? l.slice(-s) : l, a = [...this._selected];
-    if (a.length === n.length && a.every((u, p) => u === n[p])) {
+    if (a.length === n.length && a.every((c, p) => c === n[p])) {
       this._syncUi();
       return;
     }
@@ -760,7 +764,7 @@ class H extends T {
         name: n,
         getValue: () => [...this._selected],
         setValue: (a) => {
-          Array.isArray(a) ? this._setSelected(a.map((u) => String(u)), "form") : this._setSelected(x(String(a ?? "")), "form");
+          Array.isArray(a) ? this._setSelected(a.map((c) => String(c)), "form") : this._setSelected(v(String(a ?? "")), "form");
         },
         validate: async () => this.hasAttribute("required") && this._selected.length === 0 ? { valid: !1, message: "At least one option is required" } : { valid: !0 },
         setError: (a) => {
@@ -828,8 +832,20 @@ class H extends T {
     if (!(!this._shellEl || !this._inputEl || !this._panelEl)) {
       this._isSyncingUi = !0;
       try {
-        const e = (this.getAttribute("label") || "").trim(), t = (this.getAttribute("description") || "").trim(), s = (this.getAttribute("data-error") || "").trim(), l = this.root.querySelector(".meta"), n = this.root.querySelector(".label"), a = this.root.querySelector(".label-text"), u = this.root.querySelector(".required"), p = this.root.querySelector(".description"), N = this.root.querySelector(".chips"), z = this.root.querySelector(".toggle"), S = this.root.querySelector(".clear"), U = this.root.querySelector(".error"), C = this._selectionIndicator(), q = this.hasAttribute("loading"), O = (this.getAttribute("loading-text") || "Loading options...").trim(), g = this.hasAttribute("disabled"), m = this.hasAttribute("readonly"), D = this.hasAttribute("clearable");
-        l.hidden = !e && !t, n.hidden = !e, a.textContent = e, u.hidden = !this.hasAttribute("required"), p.hidden = !t, p.textContent = t, U.hidden = !s, U.textContent = s, this._shellEl.setAttribute("data-open", this.open ? "true" : "false"), this._shellEl.setAttribute("data-invalid", s ? "true" : "false"), this._shellEl.setAttribute("data-readonly", m ? "true" : "false"), z.setAttribute("data-open", this.open ? "true" : "false"), z.disabled = g || m, S.hidden = !D || this._selected.length === 0, S.disabled = g || m, this._inputEl.setAttribute("aria-expanded", this.open ? "true" : "false"), this._inputEl.setAttribute("aria-busy", q ? "true" : "false"), this._inputEl.placeholder = this._selected.length ? "" : this.getAttribute("placeholder") || "Select options", this._inputEl.disabled = g, this._inputEl.readOnly = m, this._inputEl.value !== this._query && (this._inputEl.value = this._query), this.open ? this._attachOutsideListener() : this._detachOutsideListener(), N.replaceChildren(...this._selectedOptionRecords().map((i) => {
+        const e = (this.getAttribute("label") || "").trim(), t = (this.getAttribute("description") || "").trim(), s = (this.getAttribute("data-error") || "").trim(), l = this.root.querySelector(".meta"), n = this.root.querySelector(".label"), a = this.root.querySelector(".label-text"), c = this.root.querySelector(".required"), p = this.root.querySelector(".description"), N = this.root.querySelector(".chips"), S = this.root.querySelector(".toggle"), U = this.root.querySelector(".clear"), x = this.root.querySelector(".error"), C = this._selectionIndicator(), q = this.hasAttribute("loading"), O = (this.getAttribute("loading-text") || "Loading options...").trim(), m = this.hasAttribute("disabled"), b = this.hasAttribute("readonly"), D = this.hasAttribute("clearable");
+        if (l.hidden = !e && !t, n.hidden = !e, a.textContent = e, e)
+          this._inputEl.setAttribute("aria-labelledby", `${this._uid}-label`), this._inputEl.removeAttribute("aria-label");
+        else {
+          this._inputEl.removeAttribute("aria-labelledby");
+          const i = (this.getAttribute("aria-label") || "").trim();
+          i ? this._inputEl.setAttribute("aria-label", i) : this._inputEl.removeAttribute("aria-label");
+        }
+        c.hidden = !this.hasAttribute("required"), p.hidden = !t, p.textContent = t, x.hidden = !s, x.textContent = s, x.id = `${this._uid}-error`, R(
+          this._inputEl,
+          this,
+          this._uid,
+          [t ? `${this._uid}-description` : "", s ? `${this._uid}-error` : ""].filter(Boolean)
+        ), this._shellEl.setAttribute("data-open", this.open ? "true" : "false"), this._shellEl.setAttribute("data-invalid", s ? "true" : "false"), this._shellEl.setAttribute("data-readonly", b ? "true" : "false"), m ? this._shellEl.setAttribute("aria-disabled", "true") : this._shellEl.removeAttribute("aria-disabled"), S.setAttribute("data-open", this.open ? "true" : "false"), S.disabled = m || b, U.hidden = !D || this._selected.length === 0, U.disabled = m || b, this._inputEl.setAttribute("aria-expanded", this.open ? "true" : "false"), this._inputEl.setAttribute("aria-busy", q ? "true" : "false"), this._inputEl.placeholder = this._selected.length ? "" : this.getAttribute("placeholder") || "Select options", this._inputEl.disabled = m, this._inputEl.readOnly = b, this._inputEl.value !== this._query && (this._inputEl.value = this._query), this.open ? this._attachOutsideListener() : this._detachOutsideListener(), N.replaceChildren(...this._selectedOptionRecords().map((i) => {
           const h = document.createElement("span");
           h.className = "chip", h.textContent = i.label;
           const d = document.createElement("button");
@@ -839,56 +855,56 @@ class H extends T {
             o.preventDefault(), o.stopPropagation(), this._removeChip(i.value), this._inputEl?.focus();
           }), h.append(d), h;
         }));
-        const v = this._filteredOptions(), F = this._renderLimit(), _ = v.slice(0, F), V = v.length > _.length;
+        const _ = this._filteredOptions(), F = this._renderLimit(), y = _.slice(0, F), V = _.length > y.length;
         if (this._panelEl.hidden = !this.open, q) {
           const i = document.createElement("div");
           i.className = "status", i.textContent = O, this._panelEl.replaceChildren(i), this._inputEl.removeAttribute("aria-activedescendant");
           return;
         }
-        if (!v.length) {
+        if (!_.length) {
           const i = document.createElement("div");
           i.className = "status", i.textContent = "No matching options", this._panelEl.replaceChildren(i), this._inputEl.removeAttribute("aria-activedescendant");
           return;
         }
-        const B = new Set(this._selected), P = this._panelEl.getActiveItem()?.getAttribute("data-value"), b = [];
-        let y = null;
-        if (_.forEach((i, h) => {
-          if (i.group && i.group !== y) {
-            const c = document.createElement("div");
-            c.className = "group", c.setAttribute("role", "presentation"), c.textContent = i.group, b.push(c), y = i.group;
-          } else i.group || (y = null);
-          const d = B.has(i.value), o = document.createElement("button");
-          o.className = "option", o.type = "button", o.id = `${this._uid}-option-${h}`, o.setAttribute("role", "option"), o.setAttribute("data-value", i.value), o.setAttribute("data-selected", String(d)), o.setAttribute("data-indicator", C), o.setAttribute("aria-selected", d ? "true" : "false"), (i.disabled || g || m) && (o.disabled = !0), o.addEventListener("pointerdown", (c) => {
-            c.preventDefault();
-          }), o.addEventListener("click", (c) => {
-            c.preventDefault(), !i.disabled && (this._activeValue = i.value, this._toggleValue(i.value, "option"), this._query = "", this._inputEl && (this._inputEl.value = ""), this._inputEl?.focus());
+        const $ = new Set(this._selected), B = this._panelEl.getActiveItem()?.getAttribute("data-value"), g = [];
+        let E = null;
+        if (y.forEach((i, h) => {
+          if (i.group && i.group !== E) {
+            const u = document.createElement("div");
+            u.className = "group", u.setAttribute("role", "presentation"), u.textContent = i.group, g.push(u), E = i.group;
+          } else i.group || (E = null);
+          const d = $.has(i.value), o = document.createElement("button");
+          o.className = "option", o.type = "button", o.id = `${this._uid}-option-${h}`, o.setAttribute("role", "option"), o.setAttribute("data-value", i.value), o.setAttribute("data-selected", String(d)), o.setAttribute("data-indicator", C), o.setAttribute("aria-selected", d ? "true" : "false"), (i.disabled || m || b) && (o.disabled = !0), o.addEventListener("pointerdown", (u) => {
+            u.preventDefault();
+          }), o.addEventListener("click", (u) => {
+            u.preventDefault(), !i.disabled && (this._activeValue = i.value, this._toggleValue(i.value, "option"), this._query = "", this._inputEl && (this._inputEl.value = ""), this._inputEl?.focus());
           });
           const f = document.createElement("div");
           f.className = "option-text";
-          const k = document.createElement("span");
-          if (k.className = "option-label", k.textContent = i.label, f.append(k), i.description) {
-            const c = document.createElement("span");
-            c.className = "option-description", c.textContent = i.description, f.append(c);
+          const w = document.createElement("span");
+          if (w.className = "option-label", w.textContent = i.label, f.append(w), i.description) {
+            const u = document.createElement("span");
+            u.className = "option-description", u.textContent = i.description, f.append(u);
           }
           if (C !== "none") {
-            const c = document.createElement("span");
-            c.className = "check", c.textContent = d ? "✓" : "", o.append(c);
+            const u = document.createElement("span");
+            u.className = "check", u.textContent = d ? "✓" : "", o.append(u);
           }
-          o.append(f), b.push(o);
+          o.append(f), g.push(o);
         }), V) {
           const i = document.createElement("div");
-          i.className = "status", i.textContent = `Showing first ${_.length} results. Keep typing to narrow the list.`, b.push(i);
+          i.className = "status", i.textContent = `Showing first ${y.length} results. Keep typing to narrow the list.`, g.push(i);
         }
-        this._panelEl.replaceChildren(...b);
-        const $ = P || this._activeValue || this._selected[this._selected.length - 1] || null, E = this._findOptionNode($), A = E && !E.hasAttribute("disabled") ? this._panelEl.setActiveItem(E, { focus: !1, owner: this._inputEl, scroll: !1 }) : (this._panelEl.clearActive(), null);
-        this._activeValue = A?.getAttribute("data-value") || null, A?.id ? this._inputEl.setAttribute("aria-activedescendant", A.id) : this._inputEl.removeAttribute("aria-activedescendant");
+        this._panelEl.replaceChildren(...g);
+        const P = B || this._activeValue || this._selected[this._selected.length - 1] || null, A = this._findOptionNode(P), k = A && !A.hasAttribute("disabled") ? this._panelEl.setActiveItem(A, { focus: !1, owner: this._inputEl, scroll: !1 }) : (this._panelEl.clearActive(), null);
+        this._activeValue = k?.getAttribute("data-value") || null, k?.id ? this._inputEl.setAttribute("aria-activedescendant", k.id) : this._inputEl.removeAttribute("aria-activedescendant");
       } finally {
         this._isSyncingUi = !1, this._needsSyncUi && (this._needsSyncUi = !1, this._syncUi());
       }
     }
   }
 }
-typeof customElements < "u" && !customElements.get("ui-multi-select") && customElements.define("ui-multi-select", H);
+typeof customElements < "u" && !customElements.get("ui-multi-select") && customElements.define("ui-multi-select", M);
 export {
-  H as UIMultiSelect
+  M as UIMultiSelect
 };

package/dist/navigation-menu.cjs.js

@@ -297,7 +297,7 @@
   }
 
   :host([tone="neutral"]) {
-    --ui-nav-ring: color-mix(in srgb, var(--ui-color-muted, #64748b) 60%, var(--ui-color-text, #0f172a));
+    --ui-nav-ring: color-mix(in srgb, var(--ui-color-muted, #526175) 60%, var(--ui-color-text, #0f172a));
   }
 
   :host([tone="info"]) {

package/dist/navigation-menu.esm.js

@@ -298,7 +298,7 @@ const _ = `
   }
 
   :host([tone="neutral"]) {
-    --ui-nav-ring: color-mix(in srgb, var(--ui-color-muted, #64748b) 60%, var(--ui-color-text, #0f172a));
+    --ui-nav-ring: color-mix(in srgb, var(--ui-color-muted, #526175) 60%, var(--ui-color-text, #0f172a));
   }
 
   :host([tone="info"]) {

package/dist/number-field.cjs.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const D=require("./ElementBase-EV6mVBUV.js"),z=`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const z=require("./ElementBase-EV6mVBUV.js"),A=require("./control-name-BmoI1m3a.js"),N=`
   :host {
     --ui-number-field-padding: var(--ui-padding, 10px 12px);
     --ui-number-field-border-color: var(--ui-color-border, var(--ui-border-color, #cbd5e1));
@@ -11,7 +11,7 @@
     --ui-number-field-width: 100%;
     --ui-number-field-bg: var(--ui-color-surface, var(--ui-surface, #ffffff));
     --ui-number-field-color: var(--ui-color-text, var(--ui-text, #0f172a));
-    --ui-number-field-muted: var(--ui-color-muted, var(--ui-muted, #64748b));
+    --ui-number-field-muted: var(--ui-color-muted, var(--ui-muted, #526175));
     --ui-number-field-focus: var(--ui-color-focus-ring, var(--ui-focus-ring, #2563eb));
     --ui-number-field-danger: var(--ui-color-danger, var(--ui-error, #dc2626));
     --ui-number-field-shadow: none;
@@ -148,13 +148,15 @@
     color: var(--ui-number-field-placeholder);
   }
 
+  /* Side by side, not stacked: stacked, each button was about 20px tall (under the 24px target size of
+     WCAG 2.5.8). Each one is now at least 24px wide and as tall as the field. */
   .steppers {
     flex: 0 0 auto;
     display: grid;
-    grid-template-rows: 1fr 1fr;
+    grid-template-columns: 1fr 1fr;
     align-self: stretch;
     align-items: stretch;
-    inline-size: 28px;
+    inline-size: 56px;
     min-block-size: calc(var(--ui-number-field-min-height) - 6px);
     margin-inline-start: auto;
     border-inline-start: 1px solid color-mix(in srgb, var(--ui-number-field-border-color) 82%, transparent);
@@ -221,10 +223,6 @@
     display: block;
   }
 
-  .stepper-slot:last-child .stepper-icon {
-    transform: translateY(0.5px);
-  }
-
   .footer {
     min-inline-size: 0;
     display: flex;
@@ -263,7 +261,7 @@
   }
 
   :host([size="sm"]) .steppers {
-    inline-size: 24px;
+    inline-size: 48px;
   }
 
   :host([size="sm"]) .stepper-icon {
@@ -278,7 +276,7 @@
   }
 
   :host([size="lg"]) .steppers {
-    inline-size: 32px;
+    inline-size: 64px;
   }
 
   :host([size="lg"]) .stepper-icon {
@@ -311,8 +309,8 @@
       transition: none !important;
     }
   }
-`;function f(r){return r.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#39;")}function d(r){if(!r)return!1;const e=r.assignedNodes({flatten:!0});return e.length?e.some(t=>t.nodeType===Node.TEXT_NODE?!!t.textContent?.trim():t.nodeType===Node.ELEMENT_NODE):!1}function p(r,e){const t=r.getAttribute(e);if(t==null)return!1;const i=String(t).trim().toLowerCase();return i!=="false"&&i!=="0"}function g(r){if(r==null||r.trim()==="")return null;const e=Number(r);return Number.isFinite(e)?e:null}function N(r){const e=String(r),t=e.match(/e-(\d+)$/i);if(t)return Number(t[1]);const i=e.split(".")[1];return i?i.length:0}function m(r,e){if(e==null||e<0)return r;const t=10**e;return Math.round((r+Number.EPSILON)*t)/t}function A(r,e,t){return e!=null&&r<e?e:t!=null&&r>t?t:r}function B(r){return r??0}function C(r,e,t,i){if(e==null||e<=0)return!0;const s=m((r-t)/e,i!=null?i+2:8);return Math.abs(s-Math.round(s))<1e-7}function F(r){const e=new Intl.NumberFormat(r).formatToParts(12345.6);return{group:e.find(t=>t.type==="group")?.value||",",decimal:e.find(t=>t.type==="decimal")?.value||"."}}function _(r,e){const t=r.trim();if(!t)return null;const{group:i,decimal:s}=F(e);let n=t.replace(/[\s\u00a0\u202f]/g,"");if(n=n.split(i).join(""),s!=="."&&(n=n.split(s).join(".")),n=n.replace(/[−–]/g,"-"),!/^[+-]?(?:\d+\.?\d*|\.\d+)$/.test(n))return null;const l=Number(n);return Number.isFinite(l)?l:null}function L(r,e){return e!=null&&e>=0?r.toFixed(e):String(r)}class w extends D.ElementBase{constructor(){super(),this._input=null,this._formUnregister=null,this._uid=Math.random().toString(36).slice(2,9),this._rawValue="",this._isEditing=!1,this._internalInvalidReason=null,this._onInput=this._onInput.bind(this),this._onBlur=this._onBlur.bind(this),this._onFocus=this._onFocus.bind(this),this._onKeyDown=this._onKeyDown.bind(this),this._onWheel=this._onWheel.bind(this),this._onSlotChange=this._onSlotChange.bind(this),this._onClick=this._onClick.bind(this)}static get observedAttributes(){return["value","min","max","step","precision","locale","format","name","placeholder","disabled","readonly","required","invalid","allow-wheel","show-steppers","clamp-on-blur","autocomplete","inputmode","label","description","data-error","size","variant"]}connectedCallback(){super.connectedCallback(),this.root.addEventListener("slotchange",this._onSlotChange),this.addEventListener("click",this._onClick),this._registerWithForm()}disconnectedCallback(){this.root.removeEventListener("slotchange",this._onSlotChange),this.removeEventListener("click",this._onClick),this._detachListeners(),this._formUnregister&&(this._formUnregister(),this._formUnregister=null),super.disconnectedCallback()}shouldRenderOnAttributeChange(e){return e==="label"||e==="description"||e==="data-error"}attributeChangedCallback(e,t,i){if(t!==i){if(e==="value"){this._rawValue=i||"",this._clearInternalInvalid(),this._syncDisplayValue(),this._syncAria();return}if(e==="name"&&this._registerWithForm(),e==="min"||e==="max"||e==="step"||e==="precision"||e==="locale"||e==="format"||e==="placeholder"||e==="disabled"||e==="readonly"||e==="required"||e==="allow-wheel"||e==="show-steppers"||e==="clamp-on-blur"||e==="autocomplete"||e==="inputmode"||e==="size"||e==="variant"||e==="invalid"){this._syncControlAttrs(),this._syncDisplayValue(),this._syncDerivedState(),this._syncAria();return}super.attributeChangedCallback(e,t,i)}}get value(){return this.getAttribute("value")||""}set value(e){e?this.setAttribute("value",e):this.removeAttribute("value")}get valueAsNumber(){return g(this.getAttribute("value"))}get rawValue(){return this._rawValue}set rawValue(e){this._rawValue=String(e??""),this._input&&(this._input.value=this._rawValue),this._syncAria()}focus(e){if(this._input){this._input.focus(e);return}super.focus(e)}blur(){this._input?.blur()}select(){this._input?.select()}stepUp(e=1){this._stepBy(Math.max(1,Number(e)||1),"step")}stepDown(e=1){this._stepBy(-Math.max(1,Number(e)||1),"step")}_locale(){return this.getAttribute("locale")||Intl.NumberFormat().resolvedOptions().locale||"en-US"}_precision(){const e=this.getAttribute("precision");if(e==null||e.trim()==="")return null;const t=Number(e);return Number.isInteger(t)&&t>=0?t:null}_step(){const e=this.getAttribute("step");if(e==null||e===""||e==="any")return null;const t=Number(e);return Number.isFinite(t)&&t>0?t:null}_effectivePrecision(){const e=this._precision();if(e!=null)return e;const t=this._step();return t!=null?N(t):null}_min(){return g(this.getAttribute("min"))}_max(){return g(this.getAttribute("max"))}_formatNumber(e){const t=this._effectivePrecision(),i=this.getAttribute("format")!=="plain";return new Intl.NumberFormat(this._locale(),{useGrouping:i,minimumFractionDigits:t??0,maximumFractionDigits:t??20}).format(e)}_displayStringForValue(){if(this._isEditing)return this._rawValue;const e=this.valueAsNumber;return e==null?this._rawValue:this._formatNumber(e)}_syncDisplayValue(){if(!this._input)return;const e=this._displayStringForValue();this._input.value!==e&&(this._input.value=e);const t=this.root.querySelector(".shell");t&&t.setAttribute("data-has-value",e?"true":"false")}_syncControlAttrs(){if(!this._input)return;this._input.placeholder=this.getAttribute("placeholder")||"",this._input.disabled=p(this,"disabled"),this._input.readOnly=this.hasAttribute("readonly"),this._input.required=this.hasAttribute("required"),this._input.name=this.getAttribute("name")||"",this._input.setAttribute("inputmode",this.getAttribute("inputmode")||"decimal");const e=this.getAttribute("autocomplete");e?this._input.setAttribute("autocomplete",e):this._input.removeAttribute("autocomplete")}_syncAria(){if(!this._input)return;const e=this.valueAsNumber;this._input.setAttribute("role","spinbutton"),this._input.setAttribute("aria-valuetext",this._input.value||"");const t=this._min(),i=this._max();t!=null?this._input.setAttribute("aria-valuemin",String(t)):this._input.removeAttribute("aria-valuemin"),i!=null?this._input.setAttribute("aria-valuemax",String(i)):this._input.removeAttribute("aria-valuemax"),e!=null?this._input.setAttribute("aria-valuenow",String(e)):this._input.removeAttribute("aria-valuenow");const s=this.root.querySelector('slot[name="label"]'),n=this.root.querySelector('slot[name="description"]'),l=this.root.querySelector('slot[name="error"]'),u=!!(this.getAttribute("label")||"").trim()||d(s),a=!!(this.getAttribute("description")||"").trim()||d(n),o=!!(this.getAttribute("data-error")||"").trim()||d(l);u?this._input.setAttribute("aria-labelledby",`${this._uid}-label`):this._input.removeAttribute("aria-labelledby");const c=[];a&&c.push(`${this._uid}-description`),o&&c.push(`${this._uid}-error`),c.length?this._input.setAttribute("aria-describedby",c.join(" ")):this._input.removeAttribute("aria-describedby"),this.hasAttribute("required")?this._input.setAttribute("aria-required","true"):this._input.removeAttribute("aria-required"),this.hasAttribute("invalid")||this._internalInvalidReason!=null||o?this._input.setAttribute("aria-invalid","true"):this._input.removeAttribute("aria-invalid")}_syncDerivedState(){const e=this.root.querySelector('slot[name="label"]'),t=this.root.querySelector('slot[name="description"]'),i=this.root.querySelector('slot[name="error"]'),s=this.root.querySelector('slot[name="prefix"]'),n=this.root.querySelector('slot[name="suffix"]'),l=this.root.querySelector('slot[name="increment-trigger"]'),u=this.root.querySelector('slot[name="decrement-trigger"]'),a=!!(this.getAttribute("label")||"").trim()||d(e),o=!!(this.getAttribute("description")||"").trim()||d(t),c=!!(this.getAttribute("data-error")||"").trim()||d(i),v=d(s),S=d(n),V=d(l),k=d(u),y=p(this,"show-steppers")||V||k,h=(E,I)=>{const b=this.root.querySelector(E);b&&(I?b.removeAttribute("hidden"):b.setAttribute("hidden",""))};h(".meta",a||o),h(".label",a),h(".description",o),h(".prefix",v),h(".suffix",S),h(".footer",c),h(".error",c),h(".steppers",y);const x=this.root.querySelector(".shell");x&&x.setAttribute("data-show-steppers",y?"true":"false")}_emitValueEvent(e,t,i,s){this.dispatchEvent(new CustomEvent(e,{detail:{value:t,previousValue:i,source:s},bubbles:!0,composed:!0}))}_emitInvalid(e){this._internalInvalidReason=e,this.setAttribute("data-internal-invalid",e),this._syncAria(),this.dispatchEvent(new CustomEvent("invalid",{detail:{reason:e},bubbles:!0,composed:!0}))}_clearInternalInvalid(){this._internalInvalidReason=null,this.removeAttribute("data-internal-invalid"),this._syncAria()}_commitValue(e,t){const i=this.valueAsNumber;if(e==null){if(i==null&&!this.value){this._rawValue="",this._syncDisplayValue();return}this._emitValueEvent("before-value-change",null,i,t),this.removeAttribute("value"),this._rawValue="",this._clearInternalInvalid(),this._syncDisplayValue(),this._syncAria(),this._emitValueEvent("value-change",null,i,t);return}const s=this._effectivePrecision(),n=L(m(e,s),s),l=Number(n);if(i!=null&&l===i&&this.value===n){this._rawValue=n,this._clearInternalInvalid(),this._syncDisplayValue();return}this._emitValueEvent("before-value-change",l,i,t),this.setAttribute("value",n),this._rawValue=n,this._clearInternalInvalid(),this._syncDisplayValue(),this._syncAria(),this._emitValueEvent("value-change",l,i,t)}_commitRaw(e){const t=this._rawValue.trim();if(!t){this._commitValue(null,e);return}const i=_(t,this._locale());if(i==null){this._emitInvalid("parse"),this._syncDisplayValue();return}const s=this._min(),n=this._max(),l=this._effectivePrecision(),u=m(i,l),a=p(this,"clamp-on-blur"),o=a?A(u,s,n):u;if(!a&&s!=null&&o<s){this._emitInvalid("min"),this._syncDisplayValue();return}if(!a&&n!=null&&o>n){this._emitInvalid("max"),this._syncDisplayValue();return}const c=this._step();if(!C(o,c,B(s),l)){this._emitInvalid("step"),this._syncDisplayValue();return}this._commitValue(o,e)}_stepBy(e,t){if(p(this,"disabled")||this.hasAttribute("readonly"))return;const i=this._step()??1,s=this._effectivePrecision(),n=this._min(),l=this._max(),a=(this._isEditing?_(this._rawValue,this._locale()):this.valueAsNumber)??n??0,o=A(m(a+i*e,s),n,l);this._commitValue(o,t),this._isEditing&&this._input&&(this._input.value=this._rawValue)}_registerWithForm(){this._formUnregister&&(this._formUnregister(),this._formUnregister=null);try{const s=this.getRootNode().host?.closest?.("ui-form")||null||this.closest("ui-form"),n=this.getAttribute("name");s&&typeof s.registerField=="function"&&n&&(this._formUnregister=s.registerField(n,{name:n,getValue:()=>this.value,setValue:l=>{l==null||l===""?this.removeAttribute("value"):this.setAttribute("value",String(l))},validate:async()=>{const l=this.valueAsNumber,u=this._min(),a=this._max();return this.hasAttribute("required")&&l==null?{valid:!1,message:"A value is required."}:l!=null&&u!=null&&l<u?{valid:!1,message:`Value must be at least ${u}.`}:l!=null&&a!=null&&l>a?{valid:!1,message:`Value must be at most ${a}.`}:{valid:this._internalInvalidReason==null,message:void 0}},setError:l=>{l?(this.setAttribute("data-error",l),this.toggleAttribute("invalid",!0)):(this.removeAttribute("data-error"),this._internalInvalidReason==null&&this.removeAttribute("invalid")),this._syncDerivedState(),this._syncAria()}}))}catch{}}_detachListeners(){this._input&&(this._input.removeEventListener("input",this._onInput),this._input.removeEventListener("focus",this._onFocus),this._input.removeEventListener("blur",this._onBlur),this._input.removeEventListener("keydown",this._onKeyDown),this._input.removeEventListener("wheel",this._onWheel))}_bindInput(){this._input&&(this._detachListeners(),this._input.addEventListener("input",this._onInput),this._input.addEventListener("focus",this._onFocus),this._input.addEventListener("blur",this._onBlur),this._input.addEventListener("keydown",this._onKeyDown),this._input.addEventListener("wheel",this._onWheel,{passive:!1}))}_onInput(e){this._rawValue=e.target.value,this._syncDisplayValue(),this._syncAria();const t=_(this._rawValue,this._locale());this.dispatchEvent(new CustomEvent("input",{detail:{rawValue:this._rawValue,value:t,source:"input"},bubbles:!0,composed:!0}))}_onFocus(){this._isEditing=!0,this._rawValue=this.value||this._rawValue,this._syncDisplayValue(),this._syncAria()}_onBlur(){this._isEditing=!1,this._commitRaw("blur")}_onKeyDown(e){if(e.key==="ArrowUp"){e.preventDefault(),this._stepBy(1,"keyboard");return}if(e.key==="ArrowDown"){e.preventDefault(),this._stepBy(-1,"keyboard");return}if(e.key==="PageUp"){e.preventDefault(),this._stepBy(10,"keyboard");return}if(e.key==="PageDown"){e.preventDefault(),this._stepBy(-10,"keyboard");return}if(e.key==="Home"){const t=this._min();if(t==null)return;e.preventDefault(),this._commitValue(t,"keyboard");return}if(e.key==="End"){const t=this._max();if(t==null)return;e.preventDefault(),this._commitValue(t,"keyboard");return}if(e.key==="Enter"){e.preventDefault(),this._isEditing=!1,this._commitRaw("keyboard");return}e.key==="Escape"&&(this._isEditing=!1,this._rawValue=this.value,this._clearInternalInvalid(),this._syncDisplayValue())}_onWheel(e){p(this,"allow-wheel")&&(!this._input||this.root.activeElement!==this._input||(e.preventDefault(),this._stepBy(e.deltaY<0?1:-1,"wheel")))}_onClick(e){const i=e.composedPath().find(s=>s instanceof HTMLElement?s.dataset.stepAction==="up"||s.dataset.stepAction==="down"||s.getAttribute("slot")==="increment-trigger"||s.getAttribute("slot")==="decrement-trigger":!1);if(i){if(i.dataset.stepAction==="up"||i.getAttribute("slot")==="increment-trigger"){e.preventDefault(),this._stepBy(1,"step");return}(i.dataset.stepAction==="down"||i.getAttribute("slot")==="decrement-trigger")&&(e.preventDefault(),this._stepBy(-1,"step"))}}_onSlotChange(){this._syncDerivedState(),this._syncAria()}render(){const e=this.getAttribute("label")||"",t=this.getAttribute("description")||"",i=this.getAttribute("data-error")||"";this.setContent(`
-      <style>${z}</style>
+`;function f(r){return r.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#39;")}function d(r){if(!r)return!1;const e=r.assignedNodes({flatten:!0});return e.length?e.some(t=>t.nodeType===Node.TEXT_NODE?!!t.textContent?.trim():t.nodeType===Node.ELEMENT_NODE):!1}function p(r,e){const t=r.getAttribute(e);if(t==null)return!1;const i=String(t).trim().toLowerCase();return i!=="false"&&i!=="0"}function g(r){if(r==null||r.trim()==="")return null;const e=Number(r);return Number.isFinite(e)?e:null}function B(r){const e=String(r),t=e.match(/e-(\d+)$/i);if(t)return Number(t[1]);const i=e.split(".")[1];return i?i.length:0}function m(r,e){if(e==null||e<0)return r;const t=10**e;return Math.round((r+Number.EPSILON)*t)/t}function w(r,e,t){return e!=null&&r<e?e:t!=null&&r>t?t:r}function C(r){return r??0}function q(r,e,t,i){if(e==null||e<=0)return!0;const s=m((r-t)/e,i!=null?i+2:8);return Math.abs(s-Math.round(s))<1e-7}function F(r){const e=new Intl.NumberFormat(r).formatToParts(12345.6);return{group:e.find(t=>t.type==="group")?.value||",",decimal:e.find(t=>t.type==="decimal")?.value||"."}}function _(r,e){const t=r.trim();if(!t)return null;const{group:i,decimal:s}=F(e);let n=t.replace(/[\s\u00a0\u202f]/g,"");if(n=n.split(i).join(""),s!=="."&&(n=n.split(s).join(".")),n=n.replace(/[−–]/g,"-"),!/^[+-]?(?:\d+\.?\d*|\.\d+)$/.test(n))return null;const l=Number(n);return Number.isFinite(l)?l:null}function L(r,e){return e!=null&&e>=0?r.toFixed(e):String(r)}class S extends z.ElementBase{constructor(){super(),this._input=null,this._formUnregister=null,this._uid=Math.random().toString(36).slice(2,9),this._rawValue="",this._isEditing=!1,this._internalInvalidReason=null,this._onInput=this._onInput.bind(this),this._onBlur=this._onBlur.bind(this),this._onFocus=this._onFocus.bind(this),this._onKeyDown=this._onKeyDown.bind(this),this._onWheel=this._onWheel.bind(this),this._onSlotChange=this._onSlotChange.bind(this),this._onClick=this._onClick.bind(this)}static get observedAttributes(){return["value","min","max","step","precision","locale","format","name","placeholder","disabled","readonly","required","invalid","allow-wheel","show-steppers","clamp-on-blur","autocomplete","inputmode","label","aria-label","aria-description","aria-describedby","description","data-error","size","variant"]}connectedCallback(){super.connectedCallback(),this.root.addEventListener("slotchange",this._onSlotChange),this.addEventListener("click",this._onClick),this._registerWithForm()}disconnectedCallback(){this.root.removeEventListener("slotchange",this._onSlotChange),this.removeEventListener("click",this._onClick),this._detachListeners(),this._formUnregister&&(this._formUnregister(),this._formUnregister=null),super.disconnectedCallback()}shouldRenderOnAttributeChange(e){return e==="label"||e==="description"||e==="data-error"}attributeChangedCallback(e,t,i){if(t!==i){if(e==="value"){this._rawValue=i||"",this._clearInternalInvalid(),this._syncDisplayValue(),this._syncAria();return}if(e==="name"&&this._registerWithForm(),e==="min"||e==="max"||e==="step"||e==="precision"||e==="locale"||e==="format"||e==="placeholder"||e==="disabled"||e==="readonly"||e==="required"||e==="allow-wheel"||e==="show-steppers"||e==="clamp-on-blur"||e==="autocomplete"||e==="inputmode"||e==="size"||e==="variant"||e==="invalid"||e==="aria-label"||e==="aria-description"||e==="aria-describedby"){this._syncControlAttrs(),this._syncDisplayValue(),this._syncDerivedState(),this._syncAria();return}super.attributeChangedCallback(e,t,i)}}get value(){return this.getAttribute("value")||""}set value(e){e?this.setAttribute("value",e):this.removeAttribute("value")}get valueAsNumber(){return g(this.getAttribute("value"))}get rawValue(){return this._rawValue}set rawValue(e){this._rawValue=String(e??""),this._input&&(this._input.value=this._rawValue),this._syncAria()}focus(e){if(this._input){this._input.focus(e);return}super.focus(e)}blur(){this._input?.blur()}select(){this._input?.select()}stepUp(e=1){this._stepBy(Math.max(1,Number(e)||1),"step")}stepDown(e=1){this._stepBy(-Math.max(1,Number(e)||1),"step")}_locale(){return this.getAttribute("locale")||Intl.NumberFormat().resolvedOptions().locale||"en-US"}_precision(){const e=this.getAttribute("precision");if(e==null||e.trim()==="")return null;const t=Number(e);return Number.isInteger(t)&&t>=0?t:null}_step(){const e=this.getAttribute("step");if(e==null||e===""||e==="any")return null;const t=Number(e);return Number.isFinite(t)&&t>0?t:null}_effectivePrecision(){const e=this._precision();if(e!=null)return e;const t=this._step();return t!=null?B(t):null}_min(){return g(this.getAttribute("min"))}_max(){return g(this.getAttribute("max"))}_formatNumber(e){const t=this._effectivePrecision(),i=this.getAttribute("format")!=="plain";return new Intl.NumberFormat(this._locale(),{useGrouping:i,minimumFractionDigits:t??0,maximumFractionDigits:t??20}).format(e)}_displayStringForValue(){if(this._isEditing)return this._rawValue;const e=this.valueAsNumber;return e==null?this._rawValue:this._formatNumber(e)}_syncDisplayValue(){if(!this._input)return;const e=this._displayStringForValue();this._input.value!==e&&(this._input.value=e);const t=this.root.querySelector(".shell");t&&t.setAttribute("data-has-value",e?"true":"false")}_syncControlAttrs(){if(!this._input)return;this._input.placeholder=this.getAttribute("placeholder")||"",this._input.disabled=p(this,"disabled"),this._input.disabled?this.root.querySelector(".shell")?.setAttribute("aria-disabled","true"):this.root.querySelector(".shell")?.removeAttribute("aria-disabled"),this._input.readOnly=this.hasAttribute("readonly"),this._input.required=this.hasAttribute("required"),this._input.name=this.getAttribute("name")||"",this._input.setAttribute("inputmode",this.getAttribute("inputmode")||"decimal");const e=this.getAttribute("autocomplete");e?this._input.setAttribute("autocomplete",e):this._input.removeAttribute("autocomplete")}_syncAria(){if(!this._input)return;const e=this.valueAsNumber;this._input.setAttribute("role","spinbutton"),this._input.setAttribute("aria-valuetext",this._input.value||"");const t=this._min(),i=this._max();t!=null?this._input.setAttribute("aria-valuemin",String(t)):this._input.removeAttribute("aria-valuemin"),i!=null?this._input.setAttribute("aria-valuemax",String(i)):this._input.removeAttribute("aria-valuemax"),e!=null?this._input.setAttribute("aria-valuenow",String(e)):this._input.removeAttribute("aria-valuenow");const s=this.root.querySelector('slot[name="label"]'),n=this.root.querySelector('slot[name="description"]'),l=this.root.querySelector('slot[name="error"]'),u=!!(this.getAttribute("label")||"").trim()||d(s),a=!!(this.getAttribute("description")||"").trim()||d(n),o=!!(this.getAttribute("data-error")||"").trim()||d(l);A.syncControlName(this._input,this,u?`${this._uid}-label`:null);const c=[];a&&c.push(`${this._uid}-description`),o&&c.push(`${this._uid}-error`),A.syncControlDescription(this._input,this,this._uid,c),this.hasAttribute("required")?this._input.setAttribute("aria-required","true"):this._input.removeAttribute("aria-required"),this.hasAttribute("invalid")||this._internalInvalidReason!=null||o?this._input.setAttribute("aria-invalid","true"):this._input.removeAttribute("aria-invalid")}_syncDerivedState(){const e=this.root.querySelector('slot[name="label"]'),t=this.root.querySelector('slot[name="description"]'),i=this.root.querySelector('slot[name="error"]'),s=this.root.querySelector('slot[name="prefix"]'),n=this.root.querySelector('slot[name="suffix"]'),l=this.root.querySelector('slot[name="increment-trigger"]'),u=this.root.querySelector('slot[name="decrement-trigger"]'),a=!!(this.getAttribute("label")||"").trim()||d(e),o=!!(this.getAttribute("description")||"").trim()||d(t),c=!!(this.getAttribute("data-error")||"").trim()||d(i),v=d(s),V=d(n),k=d(l),E=d(u),y=p(this,"show-steppers")||k||E,h=(I,D)=>{const b=this.root.querySelector(I);b&&(D?b.removeAttribute("hidden"):b.setAttribute("hidden",""))};h(".meta",a||o),h(".label",a),h(".description",o),h(".prefix",v),h(".suffix",V),h(".footer",c),h(".error",c),h(".steppers",y);const x=this.root.querySelector(".shell");x&&x.setAttribute("data-show-steppers",y?"true":"false")}_emitValueEvent(e,t,i,s){this.dispatchEvent(new CustomEvent(e,{detail:{value:t,previousValue:i,source:s},bubbles:!0,composed:!0}))}_emitInvalid(e){this._internalInvalidReason=e,this.setAttribute("data-internal-invalid",e),this._syncAria(),this.dispatchEvent(new CustomEvent("invalid",{detail:{reason:e},bubbles:!0,composed:!0}))}_clearInternalInvalid(){this._internalInvalidReason=null,this.removeAttribute("data-internal-invalid"),this._syncAria()}_commitValue(e,t){const i=this.valueAsNumber;if(e==null){if(i==null&&!this.value){this._rawValue="",this._syncDisplayValue();return}this._emitValueEvent("before-value-change",null,i,t),this.removeAttribute("value"),this._rawValue="",this._clearInternalInvalid(),this._syncDisplayValue(),this._syncAria(),this._emitValueEvent("value-change",null,i,t);return}const s=this._effectivePrecision(),n=L(m(e,s),s),l=Number(n);if(i!=null&&l===i&&this.value===n){this._rawValue=n,this._clearInternalInvalid(),this._syncDisplayValue();return}this._emitValueEvent("before-value-change",l,i,t),this.setAttribute("value",n),this._rawValue=n,this._clearInternalInvalid(),this._syncDisplayValue(),this._syncAria(),this._emitValueEvent("value-change",l,i,t)}_commitRaw(e){const t=this._rawValue.trim();if(!t){this._commitValue(null,e);return}const i=_(t,this._locale());if(i==null){this._emitInvalid("parse"),this._syncDisplayValue();return}const s=this._min(),n=this._max(),l=this._effectivePrecision(),u=m(i,l),a=p(this,"clamp-on-blur"),o=a?w(u,s,n):u;if(!a&&s!=null&&o<s){this._emitInvalid("min"),this._syncDisplayValue();return}if(!a&&n!=null&&o>n){this._emitInvalid("max"),this._syncDisplayValue();return}const c=this._step();if(!q(o,c,C(s),l)){this._emitInvalid("step"),this._syncDisplayValue();return}this._commitValue(o,e)}_stepBy(e,t){if(p(this,"disabled")||this.hasAttribute("readonly"))return;const i=this._step()??1,s=this._effectivePrecision(),n=this._min(),l=this._max(),a=(this._isEditing?_(this._rawValue,this._locale()):this.valueAsNumber)??n??0,o=w(m(a+i*e,s),n,l);this._commitValue(o,t),this._isEditing&&this._input&&(this._input.value=this._rawValue)}_registerWithForm(){this._formUnregister&&(this._formUnregister(),this._formUnregister=null);try{const s=this.getRootNode().host?.closest?.("ui-form")||null||this.closest("ui-form"),n=this.getAttribute("name");s&&typeof s.registerField=="function"&&n&&(this._formUnregister=s.registerField(n,{name:n,getValue:()=>this.value,setValue:l=>{l==null||l===""?this.removeAttribute("value"):this.setAttribute("value",String(l))},validate:async()=>{const l=this.valueAsNumber,u=this._min(),a=this._max();return this.hasAttribute("required")&&l==null?{valid:!1,message:"A value is required."}:l!=null&&u!=null&&l<u?{valid:!1,message:`Value must be at least ${u}.`}:l!=null&&a!=null&&l>a?{valid:!1,message:`Value must be at most ${a}.`}:{valid:this._internalInvalidReason==null,message:void 0}},setError:l=>{l?(this.setAttribute("data-error",l),this.toggleAttribute("invalid",!0)):(this.removeAttribute("data-error"),this._internalInvalidReason==null&&this.removeAttribute("invalid")),this._syncDerivedState(),this._syncAria()}}))}catch{}}_detachListeners(){this._input&&(this._input.removeEventListener("input",this._onInput),this._input.removeEventListener("focus",this._onFocus),this._input.removeEventListener("blur",this._onBlur),this._input.removeEventListener("keydown",this._onKeyDown),this._input.removeEventListener("wheel",this._onWheel))}_bindInput(){this._input&&(this._detachListeners(),this._input.addEventListener("input",this._onInput),this._input.addEventListener("focus",this._onFocus),this._input.addEventListener("blur",this._onBlur),this._input.addEventListener("keydown",this._onKeyDown),this._input.addEventListener("wheel",this._onWheel,{passive:!1}))}_onInput(e){this._rawValue=e.target.value,this._syncDisplayValue(),this._syncAria();const t=_(this._rawValue,this._locale());this.dispatchEvent(new CustomEvent("input",{detail:{rawValue:this._rawValue,value:t,source:"input"},bubbles:!0,composed:!0}))}_onFocus(){this._isEditing=!0,this._rawValue=this.value||this._rawValue,this._syncDisplayValue(),this._syncAria()}_onBlur(){this._isEditing=!1,this._commitRaw("blur")}_onKeyDown(e){if(e.key==="ArrowUp"){e.preventDefault(),this._stepBy(1,"keyboard");return}if(e.key==="ArrowDown"){e.preventDefault(),this._stepBy(-1,"keyboard");return}if(e.key==="PageUp"){e.preventDefault(),this._stepBy(10,"keyboard");return}if(e.key==="PageDown"){e.preventDefault(),this._stepBy(-10,"keyboard");return}if(e.key==="Home"){const t=this._min();if(t==null)return;e.preventDefault(),this._commitValue(t,"keyboard");return}if(e.key==="End"){const t=this._max();if(t==null)return;e.preventDefault(),this._commitValue(t,"keyboard");return}if(e.key==="Enter"){e.preventDefault(),this._isEditing=!1,this._commitRaw("keyboard");return}e.key==="Escape"&&(this._isEditing=!1,this._rawValue=this.value,this._clearInternalInvalid(),this._syncDisplayValue())}_onWheel(e){p(this,"allow-wheel")&&(!this._input||this.root.activeElement!==this._input||(e.preventDefault(),this._stepBy(e.deltaY<0?1:-1,"wheel")))}_onClick(e){const i=e.composedPath().find(s=>s instanceof HTMLElement?s.dataset.stepAction==="up"||s.dataset.stepAction==="down"||s.getAttribute("slot")==="increment-trigger"||s.getAttribute("slot")==="decrement-trigger":!1);if(i){if(i.dataset.stepAction==="up"||i.getAttribute("slot")==="increment-trigger"){e.preventDefault(),this._stepBy(1,"step");return}(i.dataset.stepAction==="down"||i.getAttribute("slot")==="decrement-trigger")&&(e.preventDefault(),this._stepBy(-1,"step"))}}_onSlotChange(){this._syncDerivedState(),this._syncAria()}render(){const e=this.getAttribute("label")||"",t=this.getAttribute("description")||"",i=this.getAttribute("data-error")||"";this.setContent(`
+      <style>${N}</style>
       <div class="root">
         <div class="meta">
           <label class="label" id="${this._uid}-label">
@@ -348,4 +346,4 @@
           </p>
         </div>
       </div>
-    `),this._input=this.root.querySelector("input"),this._rawValue=this.value||this._rawValue,this._bindInput(),this._syncControlAttrs(),this._syncDerivedState(),this._syncDisplayValue(),this._syncAria()}}customElements.get("ui-number-field")||customElements.define("ui-number-field",w);exports.UINumberField=w;
+    `),this._input=this.root.querySelector("input"),this._rawValue=this.value||this._rawValue,this._bindInput(),this._syncControlAttrs(),this._syncDerivedState(),this._syncDisplayValue(),this._syncAria()}}customElements.get("ui-number-field")||customElements.define("ui-number-field",S);exports.UINumberField=S;