@editora/ui-core 0.1.18 → 0.1.20

package/dist/tabs.esm.js

@@ -1,5 +1,5 @@
-import { E as m } from "./ElementBase-909688f3.mjs";
-import { s as v, r as y, f as _, g as p, m as w } from "./roving-focus-group-4350c9a7.mjs";
+import { E as m } from "./ElementBase-YlTLMsGk.mjs";
+import { s as v, r as y, f as _, g as p, m as w } from "./roving-focus-group-Dbm1Jko_.mjs";
 const A = `
   :host {
     --ui-tabs-nav-bg: var(--ui-color-surface, #ffffff);
@@ -490,8 +490,7 @@ function f(u) {
   return String(u).replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
 }
 function g(u) {
-  if (u == null)
-    return !1;
+  if (u == null) return !1;
   const t = String(u).toLowerCase();
   return t !== "false" && t !== "0" && t !== "off";
 }
@@ -568,24 +567,19 @@ class S extends m {
   }
   _tabsModel() {
     return this._sourceTabs().map((t, e) => {
-      var b;
-      const i = t.getAttribute("data-value") || t.getAttribute("value") || String(e), a = t.getAttribute("data-label") || ((b = t.textContent) == null ? void 0 : b.trim()) || `Tab ${e + 1}`, r = t.getAttribute("data-icon") || "", s = t.hasAttribute("disabled") || g(t.getAttribute("data-disabled")), n = `${this._uid}-tab-${e}`, o = `${this._uid}-panel-${e}`;
+      const i = t.getAttribute("data-value") || t.getAttribute("value") || String(e), a = t.getAttribute("data-label") || t.textContent?.trim() || `Tab ${e + 1}`, r = t.getAttribute("data-icon") || "", s = t.hasAttribute("disabled") || g(t.getAttribute("data-disabled")), n = `${this._uid}-tab-${e}`, o = `${this._uid}-panel-${e}`;
       return { index: e, value: i, label: a, icon: r, disabled: s, tabId: n, panelId: o };
     });
   }
   _resolveSelectedIndex(t) {
-    if (!t.length)
-      return -1;
+    if (!t.length) return -1;
     const e = this.getAttribute("selected"), i = this.getAttribute("value"), a = this._sourceTabs();
     let r = -1;
     if (e != null && e !== "") {
       const s = Number(e);
       Number.isFinite(s) ? r = Math.trunc(s) : r = t.findIndex((n) => n.value === e);
     }
-    return r < 0 && i && (r = t.findIndex((s) => s.value === i)), r < 0 && (r = t.findIndex((s, n) => {
-      var o;
-      return !!((o = a[n]) != null && o.hasAttribute("data-active")) && !s.disabled;
-    })), (r < 0 || !t[r] || t[r].disabled) && (r = t.findIndex((s) => !s.disabled)), r;
+    return r < 0 && i && (r = t.findIndex((s) => s.value === i)), r < 0 && (r = t.findIndex((s, n) => !!a[n]?.hasAttribute("data-active") && !s.disabled)), (r < 0 || !t[r] || t[r].disabled) && (r = t.findIndex((s) => !s.disabled)), r;
   }
   _syncSelectedAttributes(t, e) {
     const i = t[e];
@@ -602,8 +596,7 @@ class S extends m {
   }
   _emit(t, e, i) {
     const a = e[i];
-    if (!a)
-      return;
+    if (!a) return;
     const r = {
       selected: i,
       index: i,
@@ -616,8 +609,7 @@ class S extends m {
   }
   _setSelectedByIndex(t, e, i) {
     const a = t[e];
-    if (!a || a.disabled)
-      return;
+    if (!a || a.disabled) return;
     if (this._resolveSelectedIndex(t) === e) {
       this._focusTab(e);
       return;
@@ -625,32 +617,28 @@ class S extends m {
     this._focusIndex = e, this.setAttribute("selected", String(e)), this.setAttribute("value", a.value), i && (this._emit("change", t, e), this._emit("select", t, e));
   }
   _syncSelectionUi() {
-    if (!this.isConnected)
-      return;
+    if (!this.isConnected) return;
     if (!this.root.querySelector(".nav")) {
       this.requestRender();
       return;
     }
     const t = this._tabsModel();
-    if (!t.length)
-      return;
+    if (!t.length) return;
     const e = this._resolveSelectedIndex(t), i = this._resolveFocusIndex(t, e);
     this._syncSelectedAttributes(t, e);
     const a = Array.from(this.root.querySelectorAll(".tab"));
     a.forEach((s, n) => {
       const o = t[n];
-      if (!o)
-        return;
-      const b = n === e;
-      s.setAttribute("aria-selected", b ? "true" : "false"), s.setAttribute("aria-controls", o.panelId), s.setAttribute("aria-disabled", o.disabled ? "true" : "false"), o.disabled ? s.setAttribute("disabled", "") : s.removeAttribute("disabled");
+      if (!o) return;
+      const l = n === e;
+      s.setAttribute("aria-selected", l ? "true" : "false"), s.setAttribute("aria-controls", o.panelId), s.setAttribute("aria-disabled", o.disabled ? "true" : "false"), o.disabled ? s.setAttribute("disabled", "") : s.removeAttribute("disabled");
     }), v(a, a[i] || null, { activeAttribute: null });
     const r = t[e];
     this._syncIndicator(e), r ? (this.setAttribute("aria-activedescendant", r.tabId), this.setAttribute("aria-controls", r.panelId), this._scrollSelectedTabIntoView(e)) : (this.removeAttribute("aria-activedescendant"), this.removeAttribute("aria-controls")), this._syncPanels(t, e);
   }
   _syncIndicator(t) {
     const e = this.root.querySelector(".nav");
-    if (!e)
-      return;
+    if (!e) return;
     const i = this.getAttribute("variant") || "default", a = i === "indicator";
     if (!a && !(i === "indicator-line")) {
       e.removeAttribute("data-indicator-ready"), e.style.removeProperty("--ui-tabs-indicator-x"), e.style.removeProperty("--ui-tabs-indicator-y"), e.style.removeProperty("--ui-tabs-indicator-w"), e.style.removeProperty("--ui-tabs-indicator-h");
@@ -662,8 +650,8 @@ class S extends m {
       return;
     }
     const n = this.getAttribute("orientation") === "vertical" ? "vertical" : "horizontal", o = getComputedStyle(this).direction === "rtl";
-    let b = s.offsetLeft, d = s.offsetTop, c = s.offsetWidth, l = s.offsetHeight;
-    a ? (b += 2, d += 2, c = Math.max(0, c - 2 * 2), l = Math.max(0, l - 2 * 2)) : n === "vertical" ? (d += 5, l = Math.max(8, l - 5 * 2), c = 3, b += o ? s.offsetWidth - 3 - 2 : 2) : (b += 8, c = Math.max(12, c - 8 * 2), l = 2, d += s.offsetHeight - 2 - 2), e.style.setProperty("--ui-tabs-indicator-x", `${b}px`), e.style.setProperty("--ui-tabs-indicator-y", `${d}px`), e.style.setProperty("--ui-tabs-indicator-w", `${c}px`), e.style.setProperty("--ui-tabs-indicator-h", `${l}px`), e.setAttribute("data-indicator-ready", "true");
+    let l = s.offsetLeft, d = s.offsetTop, c = s.offsetWidth, b = s.offsetHeight;
+    a ? (l += 2, d += 2, c = Math.max(0, c - 4), b = Math.max(0, b - 4)) : n === "vertical" ? (d += 5, b = Math.max(8, b - 10), c = 3, l += o ? s.offsetWidth - 3 - 2 : 2) : (l += 8, c = Math.max(12, c - 16), b = 2, d += s.offsetHeight - 2 - 2), e.style.setProperty("--ui-tabs-indicator-x", `${l}px`), e.style.setProperty("--ui-tabs-indicator-y", `${d}px`), e.style.setProperty("--ui-tabs-indicator-w", `${c}px`), e.style.setProperty("--ui-tabs-indicator-h", `${b}px`), e.setAttribute("data-indicator-ready", "true");
   }
   _syncPanels(t, e) {
     const i = this._sourcePanels(), a = this.root.querySelector(".panel-wrap");
@@ -671,7 +659,7 @@ class S extends m {
     try {
       i.forEach((r, s) => {
         const n = t[s], o = s === e;
-        r.id = (n == null ? void 0 : n.panelId) || `${this._uid}-panel-${s}`, r.setAttribute("role", "tabpanel"), r.setAttribute("tabindex", o ? "0" : "-1"), r.setAttribute("aria-hidden", o ? "false" : "true"), n && r.setAttribute("aria-labelledby", n.tabId), o ? r.removeAttribute("hidden") : r.setAttribute("hidden", "");
+        r.id = n?.panelId || `${this._uid}-panel-${s}`, r.setAttribute("role", "tabpanel"), r.setAttribute("tabindex", o ? "0" : "-1"), r.setAttribute("aria-hidden", o ? "false" : "true"), n && r.setAttribute("aria-labelledby", n.tabId), o ? r.removeAttribute("hidden") : r.setAttribute("hidden", "");
       });
     } finally {
       this._isSyncing = !1;
@@ -698,8 +686,7 @@ class S extends m {
   }
   _scrollSelectedTabIntoView(t) {
     const e = this.root.querySelector(".nav"), i = this.root.querySelector(`.tab[data-index="${t}"]`);
-    if (!e || !i)
-      return;
+    if (!e || !i) return;
     const a = this.getAttribute("orientation") !== "vertical", r = typeof window < "u" && typeof window.matchMedia == "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
     typeof i.scrollIntoView == "function" && i.scrollIntoView({
       behavior: r ? "auto" : "smooth",
@@ -708,32 +695,27 @@ class S extends m {
     });
   }
   _onClick(t) {
-    const e = t.target, i = e == null ? void 0 : e.closest(".tab");
-    if (!i || i.disabled)
-      return;
+    const i = t.target?.closest(".tab");
+    if (!i || i.disabled) return;
     const a = Number(i.getAttribute("data-index"));
-    if (!Number.isFinite(a))
-      return;
+    if (!Number.isFinite(a)) return;
     const r = this._tabsModel();
     this._setSelectedByIndex(r, a, !0);
   }
   _onKeyDown(t) {
-    const e = t.target, i = e == null ? void 0 : e.closest(".tab");
-    if (!i)
-      return;
+    const i = t.target?.closest(".tab");
+    if (!i) return;
     const a = this._tabsModel();
-    if (!a.length)
-      return;
-    const r = this.getAttribute("orientation") === "vertical" ? "vertical" : "horizontal", s = this.getAttribute("activation") === "manual" ? "manual" : "auto", n = !this.hasAttribute("loop") || g(this.getAttribute("loop")), o = getComputedStyle(this).direction === "rtl", b = Number(i.getAttribute("data-index"));
-    if (!Number.isFinite(b))
-      return;
+    if (!a.length) return;
+    const r = this.getAttribute("orientation") === "vertical" ? "vertical" : "horizontal", s = this.getAttribute("activation") === "manual" ? "manual" : "auto", n = !this.hasAttribute("loop") || g(this.getAttribute("loop")), o = getComputedStyle(this).direction === "rtl", l = Number(i.getAttribute("data-index"));
+    if (!Number.isFinite(l)) return;
     const d = (c) => {
-      const l = w(a, b, c, {
+      const b = w(a, l, c, {
         wrap: n,
         fallbackIndex: this._resolveFocusIndex(a, this._resolveSelectedIndex(a)),
         getDisabled: (h) => h.disabled
       });
-      l != null && (this._focusTab(l), s === "auto" ? this._setSelectedByIndex(a, l, !0) : this._emit("focus", a, l));
+      b != null && (this._focusTab(b), s === "auto" ? this._setSelectedByIndex(a, b, !0) : this._emit("focus", a, b));
     };
     if (r === "horizontal" && (t.key === "ArrowRight" && !o || t.key === "ArrowLeft" && o) || r === "vertical" && t.key === "ArrowDown") {
       t.preventDefault(), d(1);
@@ -745,27 +727,25 @@ class S extends m {
     }
     if (t.key === "Home") {
       t.preventDefault();
-      const c = p(a, "first", (l) => l.disabled);
-      if (c < 0)
-        return;
+      const c = p(a, "first", (b) => b.disabled);
+      if (c < 0) return;
       this._focusTab(c), s === "auto" ? this._setSelectedByIndex(a, c, !0) : this._emit("focus", a, c);
       return;
     }
     if (t.key === "End") {
       t.preventDefault();
-      const c = p(a, "last", (l) => l.disabled);
-      if (c < 0)
-        return;
+      const c = p(a, "last", (b) => b.disabled);
+      if (c < 0) return;
       this._focusTab(c), s === "auto" ? this._setSelectedByIndex(a, c, !0) : this._emit("focus", a, c);
       return;
     }
-    (t.key === "Enter" || t.key === " ") && (t.preventDefault(), this._setSelectedByIndex(a, b, !0));
+    (t.key === "Enter" || t.key === " ") && (t.preventDefault(), this._setSelectedByIndex(a, l, !0));
   }
   render() {
     const t = this._tabsModel(), e = this._resolveSelectedIndex(t), i = this._resolveFocusIndex(t, e);
     this._syncSelectedAttributes(t, e);
     const a = this.getAttribute("orientation") === "vertical" ? "vertical" : "horizontal", r = t.map((n) => {
-      const o = n.index === e, b = n.icon ? `<span class="tab-icon" aria-hidden="true">${f(n.icon)}</span>` : "";
+      const o = n.index === e, l = n.icon ? `<span class="tab-icon" aria-hidden="true">${f(n.icon)}</span>` : "";
       return `
           <button
             type="button"
@@ -780,7 +760,7 @@ class S extends m {
             tabindex="${n.index === i && !n.disabled ? "0" : "-1"}"
             ${n.disabled ? "disabled" : ""}
           >
-            ${b}
+            ${l}
             <span class="tab-label">${f(n.label)}</span>
           </button>
         `;

package/dist/tags-input.cjs.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const E=require("./ElementBase-1b301e7f.js"),A=`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const E=require("./ElementBase-EV6mVBUV.js"),A=`
   :host {
     --ui-tags-input-padding: 10px 12px;
     --ui-tags-input-border-color: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 78%, transparent);
@@ -181,8 +181,8 @@
   :host([readonly]) .chip-remove {
     pointer-events: none;
   }
-`;function m(a,t){return a.length===t.length&&a.every((i,e)=>i===t[e])}function d(a){if(!a)return[];const t=a.trim();if(!t)return[];if(t.startsWith("["))try{const i=JSON.parse(t);if(Array.isArray(i))return i.map(e=>String(e).trim()).filter(Boolean)}catch{}return t.split(",").map(i=>i.trim()).filter(Boolean)}function S(a){return a.length?a.some(t=>t.includes(",")||t.includes(`
-`))?JSON.stringify(a):a.join(", "):""}function c(a){return a.replace(/\s+/g," ").trim()}class f extends E.ElementBase{constructor(){super(),this._tags=[],this._draft="",this._suppressValueAttr=!1,this._formUnregister=null,this._rootEl=null,this._shellEl=null,this._chipsEl=null,this._inputEl=null,this._labelEl=null,this._descriptionEl=null,this._errorEl=null,this._assistEl=null,this._counterEl=null,this._focused=!1,this._onInput=this._onInput.bind(this),this._onKeyDown=this._onKeyDown.bind(this),this._onFocusIn=this._onFocusIn.bind(this),this._onFocusOut=this._onFocusOut.bind(this),this._onPaste=this._onPaste.bind(this),this._onShellClick=this._onShellClick.bind(this),this._onChipClick=this._onChipClick.bind(this)}static get observedAttributes(){return["value","label","description","placeholder","data-error","required","disabled","readonly","name","max-tags","counter"]}get value(){return[...this._tags]}set value(t){const i=Array.isArray(t)?t.map(e=>c(String(e))).filter(Boolean):d(String(t??""));this._applyTags(i,"api")}addTag(t){return this._addTag(t,"api")}removeTag(t){if(typeof t=="number"){if(t<0||t>=this._tags.length)return;this._removeTagAt(t,"api");return}const i=this._tags.indexOf(t);i>=0&&this._removeTagAt(i,"api")}clearTags(){this._applyTags([],"api")}focusInput(){var t;(t=this._inputEl)==null||t.focus()}connectedCallback(){super.connectedCallback(),this._registerWithForm()}disconnectedCallback(){this._formUnregister&&(this._formUnregister(),this._formUnregister=null),super.disconnectedCallback()}attributeChangedCallback(t,i,e){if(i!==e){if(t==="name"&&this.isConnected&&this._registerWithForm(),t==="value"&&!this._suppressValueAttr){const s=d(e);m(s,this._tags)||(this._tags=s)}this._rootEl&&this._syncUi()}}shouldRenderOnAttributeChange(){return!1}render(){var t,i,e,s,r,l;this.setContent(`
+`;function m(r,t){return r.length===t.length&&r.every((i,e)=>i===t[e])}function d(r){if(!r)return[];const t=r.trim();if(!t)return[];if(t.startsWith("["))try{const i=JSON.parse(t);if(Array.isArray(i))return i.map(e=>String(e).trim()).filter(Boolean)}catch{}return t.split(",").map(i=>i.trim()).filter(Boolean)}function S(r){return r.length?r.some(t=>t.includes(",")||t.includes(`
+`))?JSON.stringify(r):r.join(", "):""}function c(r){return r.replace(/\s+/g," ").trim()}class f extends E.ElementBase{constructor(){super(),this._tags=[],this._draft="",this._suppressValueAttr=!1,this._formUnregister=null,this._rootEl=null,this._shellEl=null,this._chipsEl=null,this._inputEl=null,this._labelEl=null,this._descriptionEl=null,this._errorEl=null,this._assistEl=null,this._counterEl=null,this._focused=!1,this._onInput=this._onInput.bind(this),this._onKeyDown=this._onKeyDown.bind(this),this._onFocusIn=this._onFocusIn.bind(this),this._onFocusOut=this._onFocusOut.bind(this),this._onPaste=this._onPaste.bind(this),this._onShellClick=this._onShellClick.bind(this),this._onChipClick=this._onChipClick.bind(this)}static get observedAttributes(){return["value","label","description","placeholder","data-error","required","disabled","readonly","name","max-tags","counter"]}get value(){return[...this._tags]}set value(t){const i=Array.isArray(t)?t.map(e=>c(String(e))).filter(Boolean):d(String(t??""));this._applyTags(i,"api")}addTag(t){return this._addTag(t,"api")}removeTag(t){if(typeof t=="number"){if(t<0||t>=this._tags.length)return;this._removeTagAt(t,"api");return}const i=this._tags.indexOf(t);i>=0&&this._removeTagAt(i,"api")}clearTags(){this._applyTags([],"api")}focusInput(){this._inputEl?.focus()}connectedCallback(){super.connectedCallback(),this._registerWithForm()}disconnectedCallback(){this._formUnregister&&(this._formUnregister(),this._formUnregister=null),super.disconnectedCallback()}attributeChangedCallback(t,i,e){if(i!==e){if(t==="name"&&this.isConnected&&this._registerWithForm(),t==="value"&&!this._suppressValueAttr){const s=d(e);m(s,this._tags)||(this._tags=s)}this._rootEl&&this._syncUi()}}shouldRenderOnAttributeChange(){return!1}render(){this.setContent(`
       <style>${A}</style>
       <div class="root">
         <div class="meta" hidden>
@@ -199,4 +199,4 @@
           <div class="counter"></div>
         </div>
       </div>
-    `),this._rootEl=this.root.querySelector(".root"),this._shellEl=this.root.querySelector(".shell"),this._chipsEl=this.root.querySelector(".chips"),this._inputEl=this.root.querySelector(".input"),this._labelEl=this.root.querySelector(".label"),this._descriptionEl=this.root.querySelector(".description"),this._errorEl=this.root.querySelector(".error"),this._assistEl=this.root.querySelector(".assist"),this._counterEl=this.root.querySelector(".counter"),(t=this._inputEl)==null||t.addEventListener("input",this._onInput),(i=this._inputEl)==null||i.addEventListener("keydown",this._onKeyDown),(e=this._inputEl)==null||e.addEventListener("focus",this._onFocusIn),(s=this._inputEl)==null||s.addEventListener("blur",this._onFocusOut),(r=this._inputEl)==null||r.addEventListener("paste",this._onPaste),(l=this._shellEl)==null||l.addEventListener("click",this._onShellClick),this.root.addEventListener("click",this._onChipClick),this._tags=d(this.getAttribute("value")),this._syncUi()}_readOnly(){return this.hasAttribute("readonly")}_disabled(){return this.hasAttribute("disabled")&&this.getAttribute("disabled")!=="false"}_allowDuplicates(){return this.hasAttribute("allow-duplicates")}_maxTags(){const t=this.getAttribute("max-tags");if(!t)return null;const i=Number(t);return Number.isFinite(i)&&i>0?Math.floor(i):null}_emit(t,i){this.dispatchEvent(new CustomEvent(t,{detail:i,bubbles:!0,composed:!0}))}_setValueAttr(t){const i=S(t);this._suppressValueAttr=!0;try{i?this.getAttribute("value")!==i&&this.setAttribute("value",i):this.removeAttribute("value")}finally{this._suppressValueAttr=!1}}_applyTags(t,i){const e=t.map(n=>c(n)).filter(Boolean),s=this._allowDuplicates()?e:e.filter((n,o)=>e.indexOf(n)===o),r=this._maxTags()!=null?s.slice(0,this._maxTags()):s;if(m(r,this._tags))return this._syncUi(),!1;const l=[...this._tags];return this._tags=[...r],this._setValueAttr(this._tags),this._syncUi(),this._emit("change",{value:[...this._tags],previousValue:l,source:i}),!0}_addTag(t,i){if(this._disabled()||this._readOnly())return!1;const e=c(t);if(!e)return!1;if(!this._allowDuplicates()&&this._tags.includes(e))return this._syncUi("Duplicate tag"),!1;const s=this._maxTags();if(s!=null&&this._tags.length>=s)return this._syncUi(`Maximum ${s} tags`),!1;const r=this._applyTags([...this._tags,e],i);return r&&this._emit("tag-add",{tag:e,value:[...this._tags],source:i}),r}_removeTagAt(t,i){if(this._disabled()||this._readOnly())return;const e=this._tags[t];if(!e)return;const s=this._tags.filter((l,n)=>n!==t);this._applyTags(s,i)&&this._emit("tag-remove",{tag:e,index:t,value:[...this._tags],source:i})}_commitDraft(t){const i=this._draft;this._draft="",this._inputEl&&(this._inputEl.value=""),this._addTag(i,t),this._syncUi()}_syncUi(t){if(!this._shellEl||!this._chipsEl||!this._inputEl||!this._labelEl||!this._descriptionEl||!this._errorEl||!this._assistEl||!this._counterEl)return;const i=(this.getAttribute("label")||"").trim(),e=(this.getAttribute("description")||"").trim(),s=(this.getAttribute("data-error")||"").trim(),r=this.hasAttribute("required"),l=this._disabled(),n=this._readOnly(),o=this._maxTags(),b=this.hasAttribute("counter")||o!=null,v=!!s||!!t||r&&this._tags.length===0&&this.hasAttribute("invalid");this._labelEl.hidden=!i,this._labelEl.querySelector(".label-text").textContent=i,this._labelEl.querySelector(".required").hidden=!r,this._descriptionEl.hidden=!e,this._descriptionEl.textContent=e,this.root.querySelector(".meta").hidden=!i&&!e,this._shellEl.setAttribute("data-focused",this._focused?"true":"false"),this._shellEl.setAttribute("data-invalid",v?"true":"false"),this._inputEl.disabled=l,this._inputEl.readOnly=n,this._inputEl.placeholder=this._tags.length===0?this.getAttribute("placeholder")||"Add tags":"",this._inputEl.value=this._draft;const y=l||o!=null&&this._tags.length>=o;this._inputEl.setAttribute("aria-disabled",y?"true":"false"),this._chipsEl.replaceChildren(...this._tags.map((_,x)=>{const h=document.createElement("span");h.className="chip",h.setAttribute("part","chip");const p=document.createElement("span");p.className="chip-label",p.textContent=_;const u=document.createElement("button");return u.type="button",u.className="chip-remove",u.setAttribute("data-index",String(x)),u.setAttribute("aria-label",`Remove ${_}`),u.textContent="×",u.disabled=l||n,h.append(p,u),h}));const g=t||s;this._errorEl.hidden=!g,this._errorEl.textContent=g,this._assistEl.hidden=!b,this._counterEl.textContent=o!=null?`${this._tags.length}/${o}`:String(this._tags.length)}_registerWithForm(){var t;this._formUnregister&&(this._formUnregister(),this._formUnregister=null);try{const e=this.getRootNode().host,r=((t=e==null?void 0:e.closest)==null?void 0:t.call(e,"ui-form"))||null||this.closest("ui-form"),l=this.getAttribute("name");r&&typeof r.registerField=="function"&&l&&(this._formUnregister=r.registerField(l,{name:l,getValue:()=>[...this._tags],setValue:n=>{Array.isArray(n)?this._applyTags(n.map(o=>String(o)),"form"):this._applyTags(d(String(n??"")),"form")},validate:async()=>this.hasAttribute("required")&&this._tags.length===0?{valid:!1,message:"At least one tag is required"}:{valid:!0},setError:n=>{n?this.setAttribute("data-error",n):this.removeAttribute("data-error"),this._syncUi()}}))}catch{}}_onInput(t){const i=t.target;this._draft=(i==null?void 0:i.value)||"",this._emit("input",{draft:this._draft,value:[...this._tags]}),this._syncUi()}_onKeyDown(t){if(t.key==="Enter"||t.key===","){t.preventDefault(),this._commitDraft("keyboard");return}t.key==="Backspace"&&!this._draft&&this._removeTagAt(this._tags.length-1,"keyboard")}_onPaste(t){var s;const i=((s=t.clipboardData)==null?void 0:s.getData("text"))||"";if(!/[,\n]/.test(i))return;t.preventDefault();const e=i.split(/[,\n]+/).map(c).filter(Boolean);e.length&&(this._draft="",this._inputEl&&(this._inputEl.value=""),this._applyTags([...this._tags,...e],"paste"))}_onFocusIn(){this._focused=!0,this._syncUi()}_onFocusOut(){this._focused=!1,this.hasAttribute("add-on-blur")&&this._draft?this._commitDraft("blur"):this._syncUi()}_onShellClick(t){var e;const i=t.target;i!=null&&i.closest(".chip-remove")||(e=this._inputEl)==null||e.focus()}_onChipClick(t){const i=t.target,e=i==null?void 0:i.closest(".chip-remove");if(!e)return;const s=Number(e.getAttribute("data-index"));Number.isFinite(s)&&this._removeTagAt(s,"remove-button")}}typeof customElements<"u"&&!customElements.get("ui-tags-input")&&customElements.define("ui-tags-input",f);exports.UITagsInput=f;
+    `),this._rootEl=this.root.querySelector(".root"),this._shellEl=this.root.querySelector(".shell"),this._chipsEl=this.root.querySelector(".chips"),this._inputEl=this.root.querySelector(".input"),this._labelEl=this.root.querySelector(".label"),this._descriptionEl=this.root.querySelector(".description"),this._errorEl=this.root.querySelector(".error"),this._assistEl=this.root.querySelector(".assist"),this._counterEl=this.root.querySelector(".counter"),this._inputEl?.addEventListener("input",this._onInput),this._inputEl?.addEventListener("keydown",this._onKeyDown),this._inputEl?.addEventListener("focus",this._onFocusIn),this._inputEl?.addEventListener("blur",this._onFocusOut),this._inputEl?.addEventListener("paste",this._onPaste),this._shellEl?.addEventListener("click",this._onShellClick),this.root.addEventListener("click",this._onChipClick),this._tags=d(this.getAttribute("value")),this._syncUi()}_readOnly(){return this.hasAttribute("readonly")}_disabled(){return this.hasAttribute("disabled")&&this.getAttribute("disabled")!=="false"}_allowDuplicates(){return this.hasAttribute("allow-duplicates")}_maxTags(){const t=this.getAttribute("max-tags");if(!t)return null;const i=Number(t);return Number.isFinite(i)&&i>0?Math.floor(i):null}_emit(t,i){this.dispatchEvent(new CustomEvent(t,{detail:i,bubbles:!0,composed:!0}))}_setValueAttr(t){const i=S(t);this._suppressValueAttr=!0;try{i?this.getAttribute("value")!==i&&this.setAttribute("value",i):this.removeAttribute("value")}finally{this._suppressValueAttr=!1}}_applyTags(t,i){const e=t.map(l=>c(l)).filter(Boolean),s=this._allowDuplicates()?e:e.filter((l,o)=>e.indexOf(l)===o),n=this._maxTags()!=null?s.slice(0,this._maxTags()):s;if(m(n,this._tags))return this._syncUi(),!1;const a=[...this._tags];return this._tags=[...n],this._setValueAttr(this._tags),this._syncUi(),this._emit("change",{value:[...this._tags],previousValue:a,source:i}),!0}_addTag(t,i){if(this._disabled()||this._readOnly())return!1;const e=c(t);if(!e)return!1;if(!this._allowDuplicates()&&this._tags.includes(e))return this._syncUi("Duplicate tag"),!1;const s=this._maxTags();if(s!=null&&this._tags.length>=s)return this._syncUi(`Maximum ${s} tags`),!1;const n=this._applyTags([...this._tags,e],i);return n&&this._emit("tag-add",{tag:e,value:[...this._tags],source:i}),n}_removeTagAt(t,i){if(this._disabled()||this._readOnly())return;const e=this._tags[t];if(!e)return;const s=this._tags.filter((a,l)=>l!==t);this._applyTags(s,i)&&this._emit("tag-remove",{tag:e,index:t,value:[...this._tags],source:i})}_commitDraft(t){const i=this._draft;this._draft="",this._inputEl&&(this._inputEl.value=""),this._addTag(i,t),this._syncUi()}_syncUi(t){if(!this._shellEl||!this._chipsEl||!this._inputEl||!this._labelEl||!this._descriptionEl||!this._errorEl||!this._assistEl||!this._counterEl)return;const i=(this.getAttribute("label")||"").trim(),e=(this.getAttribute("description")||"").trim(),s=(this.getAttribute("data-error")||"").trim(),n=this.hasAttribute("required"),a=this._disabled(),l=this._readOnly(),o=this._maxTags(),b=this.hasAttribute("counter")||o!=null,v=!!s||!!t||n&&this._tags.length===0&&this.hasAttribute("invalid");this._labelEl.hidden=!i,this._labelEl.querySelector(".label-text").textContent=i,this._labelEl.querySelector(".required").hidden=!n,this._descriptionEl.hidden=!e,this._descriptionEl.textContent=e,this.root.querySelector(".meta").hidden=!i&&!e,this._shellEl.setAttribute("data-focused",this._focused?"true":"false"),this._shellEl.setAttribute("data-invalid",v?"true":"false"),this._inputEl.disabled=a,this._inputEl.readOnly=l,this._inputEl.placeholder=this._tags.length===0?this.getAttribute("placeholder")||"Add tags":"",this._inputEl.value=this._draft;const y=a||o!=null&&this._tags.length>=o;this._inputEl.setAttribute("aria-disabled",y?"true":"false"),this._chipsEl.replaceChildren(...this._tags.map((_,x)=>{const h=document.createElement("span");h.className="chip",h.setAttribute("part","chip");const p=document.createElement("span");p.className="chip-label",p.textContent=_;const u=document.createElement("button");return u.type="button",u.className="chip-remove",u.setAttribute("data-index",String(x)),u.setAttribute("aria-label",`Remove ${_}`),u.textContent="×",u.disabled=a||l,h.append(p,u),h}));const g=t||s;this._errorEl.hidden=!g,this._errorEl.textContent=g,this._assistEl.hidden=!b,this._counterEl.textContent=o!=null?`${this._tags.length}/${o}`:String(this._tags.length)}_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._tags],setValue:a=>{Array.isArray(a)?this._applyTags(a.map(l=>String(l)),"form"):this._applyTags(d(String(a??"")),"form")},validate:async()=>this.hasAttribute("required")&&this._tags.length===0?{valid:!1,message:"At least one tag is required"}:{valid:!0},setError:a=>{a?this.setAttribute("data-error",a):this.removeAttribute("data-error"),this._syncUi()}}))}catch{}}_onInput(t){const i=t.target;this._draft=i?.value||"",this._emit("input",{draft:this._draft,value:[...this._tags]}),this._syncUi()}_onKeyDown(t){if(t.key==="Enter"||t.key===","){t.preventDefault(),this._commitDraft("keyboard");return}t.key==="Backspace"&&!this._draft&&this._removeTagAt(this._tags.length-1,"keyboard")}_onPaste(t){const i=t.clipboardData?.getData("text")||"";if(!/[,\n]/.test(i))return;t.preventDefault();const e=i.split(/[,\n]+/).map(c).filter(Boolean);e.length&&(this._draft="",this._inputEl&&(this._inputEl.value=""),this._applyTags([...this._tags,...e],"paste"))}_onFocusIn(){this._focused=!0,this._syncUi()}_onFocusOut(){this._focused=!1,this.hasAttribute("add-on-blur")&&this._draft?this._commitDraft("blur"):this._syncUi()}_onShellClick(t){t.target?.closest(".chip-remove")||this._inputEl?.focus()}_onChipClick(t){const e=t.target?.closest(".chip-remove");if(!e)return;const s=Number(e.getAttribute("data-index"));Number.isFinite(s)&&this._removeTagAt(s,"remove-button")}}typeof customElements<"u"&&!customElements.get("ui-tags-input")&&customElements.define("ui-tags-input",f);exports.UITagsInput=f;

package/dist/tags-input.esm.js

@@ -1,4 +1,4 @@
-import { E as x } from "./ElementBase-909688f3.mjs";
+import { E as x } from "./ElementBase-YlTLMsGk.mjs";
 const E = `
   :host {
     --ui-tags-input-padding: 10px 12px;
@@ -183,15 +183,13 @@ const E = `
     pointer-events: none;
   }
 `;
-function m(a, t) {
-  return a.length === t.length && a.every((i, e) => i === t[e]);
+function m(r, t) {
+  return r.length === t.length && r.every((i, e) => i === t[e]);
 }
-function d(a) {
-  if (!a)
-    return [];
-  const t = a.trim();
-  if (!t)
-    return [];
+function d(r) {
+  if (!r) return [];
+  const t = r.trim();
+  if (!t) return [];
   if (t.startsWith("["))
     try {
       const i = JSON.parse(t);
@@ -201,12 +199,12 @@ function d(a) {
     }
   return t.split(",").map((i) => i.trim()).filter(Boolean);
 }
-function A(a) {
-  return a.length ? a.some((t) => t.includes(",") || t.includes(`
-`)) ? JSON.stringify(a) : a.join(", ") : "";
+function A(r) {
+  return r.length ? r.some((t) => t.includes(",") || t.includes(`
+`)) ? JSON.stringify(r) : r.join(", ") : "";
 }
-function c(a) {
-  return a.replace(/\s+/g, " ").trim();
+function c(r) {
+  return r.replace(/\s+/g, " ").trim();
 }
 class S extends x {
   constructor() {
@@ -239,8 +237,7 @@ class S extends x {
   }
   removeTag(t) {
     if (typeof t == "number") {
-      if (t < 0 || t >= this._tags.length)
-        return;
+      if (t < 0 || t >= this._tags.length) return;
       this._removeTagAt(t, "api");
       return;
     }
@@ -251,8 +248,7 @@ class S extends x {
     this._applyTags([], "api");
   }
   focusInput() {
-    var t;
-    (t = this._inputEl) == null || t.focus();
+    this._inputEl?.focus();
   }
   connectedCallback() {
     super.connectedCallback(), this._registerWithForm();
@@ -273,7 +269,6 @@ class S extends x {
     return !1;
   }
   render() {
-    var t, i, e, s, r, l;
     this.setContent(`
       <style>${E}</style>
       <div class="root">
@@ -291,7 +286,7 @@ class S extends x {
           <div class="counter"></div>
         </div>
       </div>
-    `), this._rootEl = this.root.querySelector(".root"), this._shellEl = this.root.querySelector(".shell"), this._chipsEl = this.root.querySelector(".chips"), this._inputEl = this.root.querySelector(".input"), this._labelEl = this.root.querySelector(".label"), this._descriptionEl = this.root.querySelector(".description"), this._errorEl = this.root.querySelector(".error"), this._assistEl = this.root.querySelector(".assist"), this._counterEl = this.root.querySelector(".counter"), (t = this._inputEl) == null || t.addEventListener("input", this._onInput), (i = this._inputEl) == null || i.addEventListener("keydown", this._onKeyDown), (e = this._inputEl) == null || e.addEventListener("focus", this._onFocusIn), (s = this._inputEl) == null || s.addEventListener("blur", this._onFocusOut), (r = this._inputEl) == null || r.addEventListener("paste", this._onPaste), (l = this._shellEl) == null || l.addEventListener("click", this._onShellClick), this.root.addEventListener("click", this._onChipClick), this._tags = d(this.getAttribute("value")), this._syncUi();
+    `), this._rootEl = this.root.querySelector(".root"), this._shellEl = this.root.querySelector(".shell"), this._chipsEl = this.root.querySelector(".chips"), this._inputEl = this.root.querySelector(".input"), this._labelEl = this.root.querySelector(".label"), this._descriptionEl = this.root.querySelector(".description"), this._errorEl = this.root.querySelector(".error"), this._assistEl = this.root.querySelector(".assist"), this._counterEl = this.root.querySelector(".counter"), this._inputEl?.addEventListener("input", this._onInput), this._inputEl?.addEventListener("keydown", this._onKeyDown), this._inputEl?.addEventListener("focus", this._onFocusIn), this._inputEl?.addEventListener("blur", this._onFocusOut), this._inputEl?.addEventListener("paste", this._onPaste), this._shellEl?.addEventListener("click", this._onShellClick), this.root.addEventListener("click", this._onChipClick), this._tags = d(this.getAttribute("value")), this._syncUi();
   }
   _readOnly() {
     return this.hasAttribute("readonly");
@@ -304,8 +299,7 @@ class S extends x {
   }
   _maxTags() {
     const t = this.getAttribute("max-tags");
-    if (!t)
-      return null;
+    if (!t) return null;
     const i = Number(t);
     return Number.isFinite(i) && i > 0 ? Math.floor(i) : null;
   }
@@ -322,33 +316,29 @@ class S extends x {
     }
   }
   _applyTags(t, i) {
-    const e = t.map((n) => c(n)).filter(Boolean), s = this._allowDuplicates() ? e : e.filter((n, o) => e.indexOf(n) === o), r = this._maxTags() != null ? s.slice(0, this._maxTags()) : s;
-    if (m(r, this._tags))
+    const e = t.map((l) => c(l)).filter(Boolean), s = this._allowDuplicates() ? e : e.filter((l, o) => e.indexOf(l) === o), n = this._maxTags() != null ? s.slice(0, this._maxTags()) : s;
+    if (m(n, this._tags))
       return this._syncUi(), !1;
-    const l = [...this._tags];
-    return this._tags = [...r], this._setValueAttr(this._tags), this._syncUi(), this._emit("change", { value: [...this._tags], previousValue: l, source: i }), !0;
+    const a = [...this._tags];
+    return this._tags = [...n], this._setValueAttr(this._tags), this._syncUi(), this._emit("change", { value: [...this._tags], previousValue: a, source: i }), !0;
   }
   _addTag(t, i) {
-    if (this._disabled() || this._readOnly())
-      return !1;
+    if (this._disabled() || this._readOnly()) return !1;
     const e = c(t);
-    if (!e)
-      return !1;
+    if (!e) return !1;
     if (!this._allowDuplicates() && this._tags.includes(e))
       return this._syncUi("Duplicate tag"), !1;
     const s = this._maxTags();
     if (s != null && this._tags.length >= s)
       return this._syncUi(`Maximum ${s} tags`), !1;
-    const r = this._applyTags([...this._tags, e], i);
-    return r && this._emit("tag-add", { tag: e, value: [...this._tags], source: i }), r;
+    const n = this._applyTags([...this._tags, e], i);
+    return n && this._emit("tag-add", { tag: e, value: [...this._tags], source: i }), n;
   }
   _removeTagAt(t, i) {
-    if (this._disabled() || this._readOnly())
-      return;
+    if (this._disabled() || this._readOnly()) return;
     const e = this._tags[t];
-    if (!e)
-      return;
-    const s = this._tags.filter((l, n) => n !== t);
+    if (!e) return;
+    const s = this._tags.filter((a, l) => l !== t);
     this._applyTags(s, i) && this._emit("tag-remove", { tag: e, index: t, value: [...this._tags], source: i });
   }
   _commitDraft(t) {
@@ -356,36 +346,34 @@ class S extends x {
     this._draft = "", this._inputEl && (this._inputEl.value = ""), this._addTag(i, t), this._syncUi();
   }
   _syncUi(t) {
-    if (!this._shellEl || !this._chipsEl || !this._inputEl || !this._labelEl || !this._descriptionEl || !this._errorEl || !this._assistEl || !this._counterEl)
-      return;
-    const i = (this.getAttribute("label") || "").trim(), e = (this.getAttribute("description") || "").trim(), s = (this.getAttribute("data-error") || "").trim(), r = this.hasAttribute("required"), l = this._disabled(), n = this._readOnly(), o = this._maxTags(), f = this.hasAttribute("counter") || o != null, b = !!s || !!t || r && this._tags.length === 0 && this.hasAttribute("invalid");
-    this._labelEl.hidden = !i, this._labelEl.querySelector(".label-text").textContent = i, this._labelEl.querySelector(".required").hidden = !r, this._descriptionEl.hidden = !e, this._descriptionEl.textContent = e, this.root.querySelector(".meta").hidden = !i && !e, this._shellEl.setAttribute("data-focused", this._focused ? "true" : "false"), this._shellEl.setAttribute("data-invalid", b ? "true" : "false"), this._inputEl.disabled = l, this._inputEl.readOnly = n, this._inputEl.placeholder = this._tags.length === 0 ? this.getAttribute("placeholder") || "Add tags" : "", this._inputEl.value = this._draft;
-    const v = l || o != null && this._tags.length >= o;
+    if (!this._shellEl || !this._chipsEl || !this._inputEl || !this._labelEl || !this._descriptionEl || !this._errorEl || !this._assistEl || !this._counterEl) return;
+    const i = (this.getAttribute("label") || "").trim(), e = (this.getAttribute("description") || "").trim(), s = (this.getAttribute("data-error") || "").trim(), n = this.hasAttribute("required"), a = this._disabled(), l = this._readOnly(), o = this._maxTags(), f = this.hasAttribute("counter") || o != null, b = !!s || !!t || n && this._tags.length === 0 && this.hasAttribute("invalid");
+    this._labelEl.hidden = !i, this._labelEl.querySelector(".label-text").textContent = i, this._labelEl.querySelector(".required").hidden = !n, this._descriptionEl.hidden = !e, this._descriptionEl.textContent = e, this.root.querySelector(".meta").hidden = !i && !e, this._shellEl.setAttribute("data-focused", this._focused ? "true" : "false"), this._shellEl.setAttribute("data-invalid", b ? "true" : "false"), this._inputEl.disabled = a, this._inputEl.readOnly = l, this._inputEl.placeholder = this._tags.length === 0 ? this.getAttribute("placeholder") || "Add tags" : "", this._inputEl.value = this._draft;
+    const v = a || o != null && this._tags.length >= o;
     this._inputEl.setAttribute("aria-disabled", v ? "true" : "false"), this._chipsEl.replaceChildren(...this._tags.map((_, y) => {
       const h = document.createElement("span");
       h.className = "chip", h.setAttribute("part", "chip");
       const p = document.createElement("span");
       p.className = "chip-label", p.textContent = _;
       const u = document.createElement("button");
-      return u.type = "button", u.className = "chip-remove", u.setAttribute("data-index", String(y)), u.setAttribute("aria-label", `Remove ${_}`), u.textContent = "×", u.disabled = l || n, h.append(p, u), h;
+      return u.type = "button", u.className = "chip-remove", u.setAttribute("data-index", String(y)), u.setAttribute("aria-label", `Remove ${_}`), u.textContent = "×", u.disabled = a || l, h.append(p, u), h;
     }));
     const g = t || s;
     this._errorEl.hidden = !g, this._errorEl.textContent = g, this._assistEl.hidden = !f, this._counterEl.textContent = o != null ? `${this._tags.length}/${o}` : String(this._tags.length);
   }
   _registerWithForm() {
-    var t;
     this._formUnregister && (this._formUnregister(), this._formUnregister = null);
     try {
-      const e = this.getRootNode().host, r = ((t = e == null ? void 0 : e.closest) == null ? void 0 : t.call(e, "ui-form")) || null || this.closest("ui-form"), l = this.getAttribute("name");
-      r && typeof r.registerField == "function" && l && (this._formUnregister = r.registerField(l, {
-        name: l,
+      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._tags],
-        setValue: (n) => {
-          Array.isArray(n) ? this._applyTags(n.map((o) => String(o)), "form") : this._applyTags(d(String(n ?? "")), "form");
+        setValue: (a) => {
+          Array.isArray(a) ? this._applyTags(a.map((l) => String(l)), "form") : this._applyTags(d(String(a ?? "")), "form");
         },
         validate: async () => this.hasAttribute("required") && this._tags.length === 0 ? { valid: !1, message: "At least one tag is required" } : { valid: !0 },
-        setError: (n) => {
-          n ? this.setAttribute("data-error", n) : this.removeAttribute("data-error"), this._syncUi();
+        setError: (a) => {
+          a ? this.setAttribute("data-error", a) : this.removeAttribute("data-error"), this._syncUi();
         }
       }));
     } catch {
@@ -393,7 +381,7 @@ class S extends x {
   }
   _onInput(t) {
     const i = t.target;
-    this._draft = (i == null ? void 0 : i.value) || "", this._emit("input", { draft: this._draft, value: [...this._tags] }), this._syncUi();
+    this._draft = i?.value || "", this._emit("input", { draft: this._draft, value: [...this._tags] }), this._syncUi();
   }
   _onKeyDown(t) {
     if (t.key === "Enter" || t.key === ",") {
@@ -403,10 +391,8 @@ class S extends x {
     t.key === "Backspace" && !this._draft && this._removeTagAt(this._tags.length - 1, "keyboard");
   }
   _onPaste(t) {
-    var s;
-    const i = ((s = t.clipboardData) == null ? void 0 : s.getData("text")) || "";
-    if (!/[,\n]/.test(i))
-      return;
+    const i = t.clipboardData?.getData("text") || "";
+    if (!/[,\n]/.test(i)) return;
     t.preventDefault();
     const e = i.split(/[,\n]+/).map(c).filter(Boolean);
     e.length && (this._draft = "", this._inputEl && (this._inputEl.value = ""), this._applyTags([...this._tags, ...e], "paste"));
@@ -418,14 +404,11 @@ class S extends x {
     this._focused = !1, this.hasAttribute("add-on-blur") && this._draft ? this._commitDraft("blur") : this._syncUi();
   }
   _onShellClick(t) {
-    var e;
-    const i = t.target;
-    i != null && i.closest(".chip-remove") || (e = this._inputEl) == null || e.focus();
+    t.target?.closest(".chip-remove") || this._inputEl?.focus();
   }
   _onChipClick(t) {
-    const i = t.target, e = i == null ? void 0 : i.closest(".chip-remove");
-    if (!e)
-      return;
+    const e = t.target?.closest(".chip-remove");
+    if (!e) return;
     const s = Number(e.getAttribute("data-index"));
     Number.isFinite(s) && this._removeTagAt(s, "remove-button");
   }

package/dist/textarea.cjs.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const v=require("./ElementBase-1b301e7f.js"),_=`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const v=require("./ElementBase-EV6mVBUV.js"),_=`
   <svg viewBox="0 0 20 20" aria-hidden="true" focusable="false">
     <path d="m6 6 8 8M14 6l-8 8" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/>
   </svg>
@@ -308,22 +308,22 @@
       color: CanvasText;
     }
   }
-`;function d(h){return h.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#39;")}function x(h,t){const e=Number(h);return Number.isFinite(e)?e:t}class p extends v.ElementBase{constructor(){super(),this._uid=`ui-textarea-${Math.random().toString(36).slice(2,9)}`,this._textarea=null,this._clearBtn=null,this._countEl=null,this._debounceTimer=null,this._formUnregister=null,this._onInput=this._onInput.bind(this),this._onChange=this._onChange.bind(this),this._onClear=this._onClear.bind(this)}static get observedAttributes(){return["value","placeholder","disabled","clearable","size","validation","debounce","maxlength","minlength","rows","readonly","autofocus","resize","name","required","variant","color","radius","label","description","autosize","max-rows","show-count","density","tone","headless","data-error"]}connectedCallback(){super.connectedCallback(),this._tryRegisterWithForm()}disconnectedCallback(){this._detachListeners(),this._debounceTimer&&(clearTimeout(this._debounceTimer),this._debounceTimer=null),this._formUnregister&&(this._formUnregister(),this._formUnregister=null),super.disconnectedCallback()}attributeChangedCallback(t,e,i){if(e===i)return;if(t==="name"&&this._tryRegisterWithForm(),t==="value"&&this._textarea){const r=i||"";this._textarea.value!==r&&(this._textarea.value=r),this._syncDynamicUi(),this._applyAutosize();return}if(new Set(["placeholder","disabled","maxlength","minlength","rows","readonly","required","resize","name","validation","show-count","clearable","autosize","max-rows","variant","size","density","tone","headless","color","radius","autofocus"]).has(t)){this._syncControlAttrs(),this._syncDynamicUi(),this._applyAutosize(),t==="autofocus"&&this.hasAttribute("autofocus")&&queueMicrotask(()=>{var r;(r=this._textarea)==null||r.focus()});return}this.isConnected&&this.requestRender()}get value(){return this.getAttribute("value")||""}set value(t){this.setAttribute("value",t||"")}_tryRegisterWithForm(){var t;try{const e=(t=this.closest)==null?void 0:t.call(this,"ui-form"),i=this.getAttribute("name");if(!e||typeof e.registerField!="function"||!i)return;this._formUnregister=e.registerField(i,{name:i,getValue:()=>this.value,setValue:a=>{this.value=a},validate:async()=>this._textarea?{valid:this._textarea.checkValidity(),message:this._textarea.validationMessage||void 0}:{valid:!0},setError:a=>{a?(this.setAttribute("validation","error"),this.setAttribute("data-error",a)):(this.removeAttribute("validation"),this.removeAttribute("data-error"))}})}catch{}}_detachListeners(){this._textarea&&(this._textarea.removeEventListener("input",this._onInput),this._textarea.removeEventListener("change",this._onChange)),this._clearBtn&&this._clearBtn.removeEventListener("click",this._onClear),this._clearBtn=null}_syncControlAttrs(){if(!this._textarea)return;const t=this.getAttribute("placeholder")||"",e=this.getAttribute("maxlength"),i=this.getAttribute("minlength"),a=x(this.getAttribute("rows"),4),r=this.hasAttribute("disabled"),c=this.hasAttribute("readonly"),n=this.hasAttribute("required"),o=this.getAttribute("name")||"",s=this.getAttribute("resize")||"vertical",g=this.getAttribute("validation"),b=this.getAttribute("color"),l=this.getAttribute("radius");this._textarea.placeholder=t,this._textarea.disabled=r,this._textarea.readOnly=c,this._textarea.required=n,this._textarea.rows=Math.max(1,a),this._textarea.name=o,this._textarea.style.resize=s,e&&Number.isFinite(Number(e))?this._textarea.maxLength=Number(e):this._textarea.removeAttribute("maxlength"),i&&Number.isFinite(Number(i))?this._textarea.minLength=Number(i):this._textarea.removeAttribute("minlength"),g==="error"?this._textarea.setAttribute("aria-invalid","true"):this._textarea.removeAttribute("aria-invalid"),b?this.style.setProperty("--ui-textarea-accent",b):this.style.removeProperty("--ui-textarea-accent"),l&&l!=="none"&&l!=="large"&&l!=="full"?this.style.setProperty("--ui-textarea-radius",l):this.style.removeProperty("--ui-textarea-radius");const u=[],m=!!(this.getAttribute("description")||this.querySelector('[slot="description"]')),f=!!(this.getAttribute("data-error")||this.querySelector('[slot="error"]'));m&&u.push(`${this._uid}-description`),f&&u.push(`${this._uid}-error`),(this.hasAttribute("show-count")||this.hasAttribute("maxlength"))&&u.push(`${this._uid}-count`),!!(this.getAttribute("label")||this.querySelector('[slot="label"]'))?this._textarea.setAttribute("aria-labelledby",`${this._uid}-label`):this._textarea.removeAttribute("aria-labelledby"),u.length?this._textarea.setAttribute("aria-describedby",u.join(" ")):this._textarea.removeAttribute("aria-describedby")}_syncDynamicUi(){var a;const t=((a=this._textarea)==null?void 0:a.value)||this.getAttribute("value")||"",e=this.getAttribute("maxlength"),i=this.hasAttribute("clearable");this._clearBtn&&(i&&t&&!this.hasAttribute("disabled")&&!this.hasAttribute("readonly")?this._clearBtn.removeAttribute("hidden"):this._clearBtn.setAttribute("hidden","")),this._countEl&&(this.hasAttribute("show-count")||!!e?(this._countEl.removeAttribute("hidden"),e&&Number.isFinite(Number(e))?this._countEl.textContent=`${t.length} / ${Number(e)}`:this._countEl.textContent=`${t.length}`):this._countEl.setAttribute("hidden",""))}_applyAutosize(){if(!this._textarea)return;if(!this.hasAttribute("autosize")){this._textarea.style.height="",this._textarea.style.overflowY="";return}this._textarea.style.height="auto";const t=this._textarea.scrollHeight,e=x(this.getAttribute("max-rows"),0);if(e>0){const i=getComputedStyle(this._textarea),a=parseFloat(i.lineHeight||"20")||20,r=parseFloat(i.borderTopWidth||"0")||0,c=parseFloat(i.borderBottomWidth||"0")||0,n=parseFloat(i.paddingTop||"0")||0,o=parseFloat(i.paddingBottom||"0")||0,s=a*e+r+c+n+o;this._textarea.style.height=`${Math.min(t,s)}px`,this._textarea.style.overflowY=t>s?"auto":"hidden";return}this._textarea.style.height=`${t}px`,this._textarea.style.overflowY="hidden"}_emit(t,e){this.dispatchEvent(new CustomEvent(t,{detail:{value:e,length:e.length,name:this.getAttribute("name")||""},bubbles:!0,composed:!0}))}_onInput(t){const e=t.target.value;this.getAttribute("value")!==e&&this.setAttribute("value",e),this._syncDynamicUi(),this._applyAutosize(),this._emit("input",e);const i=x(this.getAttribute("debounce"),0);i>0?(this._debounceTimer&&clearTimeout(this._debounceTimer),this._debounceTimer=setTimeout(()=>{this._emit("debounced-input",e),this._debounceTimer=null},i)):this._emit("debounced-input",e)}_onChange(t){const e=t.target.value;this._emit("change",e)}_onClear(t){t.preventDefault(),!(this.hasAttribute("disabled")||this.hasAttribute("readonly"))&&(this.value="",this._textarea&&(this._textarea.value="",this._textarea.focus()),this._syncDynamicUi(),this._applyAutosize(),this._emit("input",""),this._emit("change",""),this.dispatchEvent(new CustomEvent("clear",{bubbles:!0,composed:!0})))}render(){var o;const t=this.getAttribute("value")||"",e=this.getAttribute("label")||"",i=this.getAttribute("description")||"",a=this.getAttribute("data-error")||"",r=!!(e||i||this.querySelector('[slot="label"]')||this.querySelector('[slot="description"]')),n=this.hasAttribute("clearable")&&!!t&&!this.hasAttribute("disabled")&&!this.hasAttribute("readonly");this.setContent(`
+`;function d(l){return l.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#39;")}function x(l,t){const e=Number(l);return Number.isFinite(e)?e:t}class p extends v.ElementBase{constructor(){super(),this._uid=`ui-textarea-${Math.random().toString(36).slice(2,9)}`,this._textarea=null,this._clearBtn=null,this._countEl=null,this._debounceTimer=null,this._formUnregister=null,this._onInput=this._onInput.bind(this),this._onChange=this._onChange.bind(this),this._onClear=this._onClear.bind(this)}static get observedAttributes(){return["value","placeholder","disabled","clearable","size","validation","debounce","maxlength","minlength","rows","readonly","autofocus","resize","name","required","variant","color","radius","label","description","autosize","max-rows","show-count","density","tone","headless","data-error"]}connectedCallback(){super.connectedCallback(),this._tryRegisterWithForm()}disconnectedCallback(){this._detachListeners(),this._debounceTimer&&(clearTimeout(this._debounceTimer),this._debounceTimer=null),this._formUnregister&&(this._formUnregister(),this._formUnregister=null),super.disconnectedCallback()}attributeChangedCallback(t,e,i){if(e===i)return;if(t==="name"&&this._tryRegisterWithForm(),t==="value"&&this._textarea){const a=i||"";this._textarea.value!==a&&(this._textarea.value=a),this._syncDynamicUi(),this._applyAutosize();return}if(new Set(["placeholder","disabled","maxlength","minlength","rows","readonly","required","resize","name","validation","show-count","clearable","autosize","max-rows","variant","size","density","tone","headless","color","radius","autofocus"]).has(t)){this._syncControlAttrs(),this._syncDynamicUi(),this._applyAutosize(),t==="autofocus"&&this.hasAttribute("autofocus")&&queueMicrotask(()=>{this._textarea?.focus()});return}this.isConnected&&this.requestRender()}get value(){return this.getAttribute("value")||""}set value(t){this.setAttribute("value",t||"")}_tryRegisterWithForm(){try{const t=this.closest?.("ui-form"),e=this.getAttribute("name");if(!t||typeof t.registerField!="function"||!e)return;this._formUnregister=t.registerField(e,{name:e,getValue:()=>this.value,setValue:i=>{this.value=i},validate:async()=>this._textarea?{valid:this._textarea.checkValidity(),message:this._textarea.validationMessage||void 0}:{valid:!0},setError:i=>{i?(this.setAttribute("validation","error"),this.setAttribute("data-error",i)):(this.removeAttribute("validation"),this.removeAttribute("data-error"))}})}catch{}}_detachListeners(){this._textarea&&(this._textarea.removeEventListener("input",this._onInput),this._textarea.removeEventListener("change",this._onChange)),this._clearBtn&&this._clearBtn.removeEventListener("click",this._onClear),this._clearBtn=null}_syncControlAttrs(){if(!this._textarea)return;const t=this.getAttribute("placeholder")||"",e=this.getAttribute("maxlength"),i=this.getAttribute("minlength"),r=x(this.getAttribute("rows"),4),a=this.hasAttribute("disabled"),u=this.hasAttribute("readonly"),s=this.hasAttribute("required"),c=this.getAttribute("name")||"",h=this.getAttribute("resize")||"vertical",g=this.getAttribute("validation"),b=this.getAttribute("color"),o=this.getAttribute("radius");this._textarea.placeholder=t,this._textarea.disabled=a,this._textarea.readOnly=u,this._textarea.required=s,this._textarea.rows=Math.max(1,r),this._textarea.name=c,this._textarea.style.resize=h,e&&Number.isFinite(Number(e))?this._textarea.maxLength=Number(e):this._textarea.removeAttribute("maxlength"),i&&Number.isFinite(Number(i))?this._textarea.minLength=Number(i):this._textarea.removeAttribute("minlength"),g==="error"?this._textarea.setAttribute("aria-invalid","true"):this._textarea.removeAttribute("aria-invalid"),b?this.style.setProperty("--ui-textarea-accent",b):this.style.removeProperty("--ui-textarea-accent"),o&&o!=="none"&&o!=="large"&&o!=="full"?this.style.setProperty("--ui-textarea-radius",o):this.style.removeProperty("--ui-textarea-radius");const n=[],m=!!(this.getAttribute("description")||this.querySelector('[slot="description"]')),f=!!(this.getAttribute("data-error")||this.querySelector('[slot="error"]'));m&&n.push(`${this._uid}-description`),f&&n.push(`${this._uid}-error`),(this.hasAttribute("show-count")||this.hasAttribute("maxlength"))&&n.push(`${this._uid}-count`),!!(this.getAttribute("label")||this.querySelector('[slot="label"]'))?this._textarea.setAttribute("aria-labelledby",`${this._uid}-label`):this._textarea.removeAttribute("aria-labelledby"),n.length?this._textarea.setAttribute("aria-describedby",n.join(" ")):this._textarea.removeAttribute("aria-describedby")}_syncDynamicUi(){const t=this._textarea?.value||this.getAttribute("value")||"",e=this.getAttribute("maxlength"),i=this.hasAttribute("clearable");this._clearBtn&&(i&&t&&!this.hasAttribute("disabled")&&!this.hasAttribute("readonly")?this._clearBtn.removeAttribute("hidden"):this._clearBtn.setAttribute("hidden","")),this._countEl&&(this.hasAttribute("show-count")||!!e?(this._countEl.removeAttribute("hidden"),e&&Number.isFinite(Number(e))?this._countEl.textContent=`${t.length} / ${Number(e)}`:this._countEl.textContent=`${t.length}`):this._countEl.setAttribute("hidden",""))}_applyAutosize(){if(!this._textarea)return;if(!this.hasAttribute("autosize")){this._textarea.style.height="",this._textarea.style.overflowY="";return}this._textarea.style.height="auto";const t=this._textarea.scrollHeight,e=x(this.getAttribute("max-rows"),0);if(e>0){const i=getComputedStyle(this._textarea),r=parseFloat(i.lineHeight||"20")||20,a=parseFloat(i.borderTopWidth||"0")||0,u=parseFloat(i.borderBottomWidth||"0")||0,s=parseFloat(i.paddingTop||"0")||0,c=parseFloat(i.paddingBottom||"0")||0,h=r*e+a+u+s+c;this._textarea.style.height=`${Math.min(t,h)}px`,this._textarea.style.overflowY=t>h?"auto":"hidden";return}this._textarea.style.height=`${t}px`,this._textarea.style.overflowY="hidden"}_emit(t,e){this.dispatchEvent(new CustomEvent(t,{detail:{value:e,length:e.length,name:this.getAttribute("name")||""},bubbles:!0,composed:!0}))}_onInput(t){const e=t.target.value;this.getAttribute("value")!==e&&this.setAttribute("value",e),this._syncDynamicUi(),this._applyAutosize(),this._emit("input",e);const i=x(this.getAttribute("debounce"),0);i>0?(this._debounceTimer&&clearTimeout(this._debounceTimer),this._debounceTimer=setTimeout(()=>{this._emit("debounced-input",e),this._debounceTimer=null},i)):this._emit("debounced-input",e)}_onChange(t){const e=t.target.value;this._emit("change",e)}_onClear(t){t.preventDefault(),!(this.hasAttribute("disabled")||this.hasAttribute("readonly"))&&(this.value="",this._textarea&&(this._textarea.value="",this._textarea.focus()),this._syncDynamicUi(),this._applyAutosize(),this._emit("input",""),this._emit("change",""),this.dispatchEvent(new CustomEvent("clear",{bubbles:!0,composed:!0})))}render(){const t=this.getAttribute("value")||"",e=this.getAttribute("label")||"",i=this.getAttribute("description")||"",r=this.getAttribute("data-error")||"",a=!!(e||i||this.querySelector('[slot="label"]')||this.querySelector('[slot="description"]')),s=this.hasAttribute("clearable")&&!!t&&!this.hasAttribute("disabled")&&!this.hasAttribute("readonly");this.setContent(`
       <style>${y}</style>
       <div class="shell" part="shell">
-        <div class="meta" part="meta" ${r?"":"hidden"}>
+        <div class="meta" part="meta" ${a?"":"hidden"}>
           <label id="${this._uid}-label" class="label" part="label"><slot name="label">${d(e)}</slot></label>
           <div id="${this._uid}-description" class="description" part="description"><slot name="description">${d(i)}</slot></div>
         </div>
 
         <div class="field" part="field">
           <textarea part="textarea"></textarea>
-          <button type="button" part="clear" class="clear-btn" aria-label="Clear text" ${n?"":"hidden"}>${_}</button>
+          <button type="button" part="clear" class="clear-btn" aria-label="Clear text" ${s?"":"hidden"}>${_}</button>
         </div>
 
         <div class="footer" part="footer">
-          <div id="${this._uid}-error" class="error" part="error"><slot name="error">${d(a)}</slot></div>
+          <div id="${this._uid}-error" class="error" part="error"><slot name="error">${d(r)}</slot></div>
           <div id="${this._uid}-count" class="count" part="count" hidden></div>
         </div>
       </div>
-    `),this._detachListeners(),this._textarea=this.root.querySelector("textarea"),this._clearBtn=this.root.querySelector(".clear-btn"),this._countEl=this.root.querySelector(".count"),this._textarea&&(this._textarea.value=t,this._syncControlAttrs(),this._syncDynamicUi(),this._applyAutosize(),this._textarea.addEventListener("input",this._onInput),this._textarea.addEventListener("change",this._onChange),(o=this._clearBtn)==null||o.addEventListener("click",this._onClear),this.hasAttribute("autofocus")&&queueMicrotask(()=>{var s;(s=this._textarea)==null||s.focus()}))}shouldRenderOnAttributeChange(t,e,i){return t==="label"||t==="description"||t==="data-error"}}typeof customElements<"u"&&!customElements.get("ui-textarea")&&customElements.define("ui-textarea",p);exports.UITextarea=p;
+    `),this._detachListeners(),this._textarea=this.root.querySelector("textarea"),this._clearBtn=this.root.querySelector(".clear-btn"),this._countEl=this.root.querySelector(".count"),this._textarea&&(this._textarea.value=t,this._syncControlAttrs(),this._syncDynamicUi(),this._applyAutosize(),this._textarea.addEventListener("input",this._onInput),this._textarea.addEventListener("change",this._onChange),this._clearBtn?.addEventListener("click",this._onClear),this.hasAttribute("autofocus")&&queueMicrotask(()=>{this._textarea?.focus()}))}shouldRenderOnAttributeChange(t,e,i){return t==="label"||t==="description"||t==="data-error"}}typeof customElements<"u"&&!customElements.get("ui-textarea")&&customElements.define("ui-textarea",p);exports.UITextarea=p;