@editora/ui-core 0.1.21 → 0.1.23

package/dist/input.cjs.js

@@ -1,8 +1,8 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const E=require("./ElementBase-EV6mVBUV.js"),$=`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const $=require("./ElementBase-DxbvhLJs.js"),S=require("./control-name-BmoI1m3a.js"),q=`
   <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>
-`,q=`
+`,N=`
   :host {
     --ui-input-padding: var(--ui-padding, 10px 12px);
     --ui-input-border-color: var(--ui-color-border, var(--ui-border-color, #cbd5e1));
@@ -14,12 +14,12 @@
     --ui-input-width: 100%;
     --ui-input-bg: var(--base-input-bg, var(--ui-color-surface, var(--ui-surface, #ffffff)));
     --ui-input-color: var(--ui-color-text, var(--ui-text, #0f172a));
-    --ui-label-color: var(--ui-color-muted, var(--ui-muted, #64748b));
-    --ui-description-color: var(--ui-color-muted, var(--ui-muted, #64748b));
+    --ui-label-color: var(--ui-color-muted, var(--ui-muted, #526175));
+    --ui-description-color: var(--ui-color-muted, var(--ui-muted, #526175));
     --ui-input-focus-ring: var(--ui-color-focus-ring, var(--ui-focus-ring, #2563eb));
     --ui-input-error: var(--ui-color-danger, var(--ui-error, #dc2626));
-    --ui-input-success: var(--ui-color-success, var(--ui-success, #16a34a));
-    --ui-input-warning: var(--ui-color-warning, var(--ui-warning, #d97706));
+    --ui-input-success: var(--ui-color-success, var(--ui-success, #15803d));
+    --ui-input-warning: var(--ui-color-warning, var(--ui-warning, #b45309));
     --ui-input-accent: var(--ui-color-primary, var(--ui-primary, #2563eb));
     --ui-input-shadow: none;
     --ui-input-gap: var(--ui-default-gap, 8px);
@@ -369,7 +369,7 @@
   }
 
   :host([tone="success"]) {
-    --ui-input-accent: var(--ui-color-success, var(--ui-success, #16a34a));
+    --ui-input-accent: var(--ui-color-success, var(--ui-success, #15803d));
   }
 
   :host([tone="warning"]) {
@@ -481,20 +481,20 @@
       box-shadow: none;
     }
   }
-`;function r(a){return a.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#39;")}function z(a){if(!a)return!1;const t=a.assignedNodes({flatten:!0});return t.length?t.some(e=>e.nodeType===Node.TEXT_NODE?!!e.textContent?.trim():e.nodeType===Node.ELEMENT_NODE):!1}function y(a,t){const e=a.getAttribute(t);if(e==null)return!1;const i=String(e).trim().toLowerCase();return i!=="false"&&i!=="0"}function T(a){return a==="none"||a==="large"||a==="full"}class S extends E.ElementBase{constructor(){super(),this._input=null,this._clearBtn=null,this._debounceTimer=null,this._formUnregister=null,this._uid=Math.random().toString(36).slice(2,9),this._autofocusApplied=!1,this._onNativeInput=this._onNativeInput.bind(this),this._onNativeChange=this._onNativeChange.bind(this),this._onClearClick=this._onClearClick.bind(this),this._onSlotChange=this._onSlotChange.bind(this)}static get observedAttributes(){return["value","placeholder","disabled","clearable","size","validation","debounce","maxlength","minlength","readonly","autofocus","counter","floating-label","headless","type","name","required","pattern","inputmode","autocomplete","min","max","step","spellcheck","variant","tone","density","shape","color","radius","label","description","data-error"]}connectedCallback(){super.connectedCallback(),this.root.addEventListener("slotchange",this._onSlotChange),this._registerWithForm()}disconnectedCallback(){this.root.removeEventListener("slotchange",this._onSlotChange),this._detachListeners(),this._debounceTimer&&(clearTimeout(this._debounceTimer),this._debounceTimer=null),this._formUnregister&&(this._formUnregister(),this._formUnregister=null),this._autofocusApplied=!1,super.disconnectedCallback()}_syncHostTokens(){const t=this.getAttribute("color");t?this.style.setProperty("--ui-input-accent",t):this.style.removeProperty("--ui-input-accent");const e=this.getAttribute("radius")||"";e&&!T(e)?this.style.setProperty("--ui-input-border-radius",e):this.style.removeProperty("--ui-input-border-radius")}_syncControlAttrs(){if(this._syncHostTokens(),!this._input)return;const t=this._input,e=this.getAttribute("type")||"text",i=this.getAttribute("placeholder")||"",n=this.getAttribute("name")||"",o=this.getAttribute("pattern")||"",s=this.getAttribute("inputmode")||"",m=this.getAttribute("autocomplete")||"",p=this.getAttribute("min")||"",u=this.getAttribute("max")||"",l=this.getAttribute("step")||"",c=this.getAttribute("spellcheck")||"",d=this.getAttribute("maxlength")||"",h=this.getAttribute("minlength")||"",b=y(this,"disabled"),f=this.hasAttribute("required"),g=this.hasAttribute("readonly");try{t.type=e}catch{t.type="text"}t.placeholder=i,t.disabled=b,t.required=f,t.readOnly=g,t.name=n,o?t.setAttribute("pattern",o):t.removeAttribute("pattern"),s?t.setAttribute("inputmode",s):t.removeAttribute("inputmode"),m?t.setAttribute("autocomplete",m):t.removeAttribute("autocomplete"),p?t.setAttribute("min",p):t.removeAttribute("min"),u?t.setAttribute("max",u):t.removeAttribute("max"),l?t.setAttribute("step",l):t.removeAttribute("step"),c?t.setAttribute("spellcheck",c):t.removeAttribute("spellcheck"),d&&Number.isFinite(Number(d))?t.setAttribute("maxlength",d):t.removeAttribute("maxlength"),h&&Number.isFinite(Number(h))?t.setAttribute("minlength",h):t.removeAttribute("minlength")}attributeChangedCallback(t,e,i){if(e===i)return;if(t==="value"){this._syncInputValue(i||"");return}if(t==="name"&&this._registerWithForm(),t==="autofocus"&&!this.hasAttribute("autofocus")&&(this._autofocusApplied=!1),new Set(["placeholder","disabled","clearable","size","validation","debounce","maxlength","minlength","readonly","autofocus","counter","headless","type","name","required","pattern","inputmode","autocomplete","min","max","step","spellcheck","variant","tone","density","shape","color","radius"]).has(t)){this._syncControlAttrs(),this._syncInputValue(this.value),this._syncDerivedState(),t==="autofocus"&&this.hasAttribute("autofocus")&&!this._autofocusApplied&&(this._autofocusApplied=!0,queueMicrotask(()=>{if(this.isConnected)try{this._input?.focus({preventScroll:!0})}catch{this._input?.focus()}}));return}this.isConnected&&this.requestRender()}get value(){return this.getAttribute("value")||""}set value(t){this.setAttribute("value",t||"")}focus(t){if(this._input){this._input.focus(t);return}super.focus(t)}blur(){this._input?.blur()}select(){this._input?.select()}_emitValueEvent(t,e){this.dispatchEvent(new CustomEvent(t,{detail:{value:e},bubbles:!0,composed:!0}))}_registerWithForm(){this._formUnregister&&(this._formUnregister(),this._formUnregister=null);try{const n=this.getRootNode().host?.closest?.("ui-form")||null||this.closest("ui-form"),o=this.getAttribute("name");n&&typeof n.registerField=="function"&&o&&(this._formUnregister=n.registerField(o,{name:o,getValue:()=>this.value,setValue:s=>{this.value=String(s??"")},validate:async()=>this._input?{valid:this._input.checkValidity(),message:this._input.validationMessage||void 0}:{valid:!0},setError:s=>{s?(this.setAttribute("validation","error"),this.setAttribute("data-error",s)):(this.removeAttribute("validation"),this.removeAttribute("data-error"))}}))}catch{}}_detachListeners(){this._input&&(this._input.removeEventListener("input",this._onNativeInput),this._input.removeEventListener("change",this._onNativeChange)),this._clearBtn&&this._clearBtn.removeEventListener("click",this._onClearClick),this._clearBtn=null}_syncInputValue(t){this._input&&this._input.value!==t&&(this._input.value=t),this._clearBtn&&(y(this,"clearable")&&t.length>0&&!y(this,"disabled")&&!this.hasAttribute("readonly")?this._clearBtn.removeAttribute("hidden"):this._clearBtn.setAttribute("hidden",""));const e=this.root.querySelector(".counter");if(e&&this.hasAttribute("counter")){const n=this.getAttribute("maxlength"),o=n?`${t.length}/${n}`:String(t.length);e.textContent=o}const i=this.root.querySelector(".shell");i&&i.setAttribute("data-has-value",t?"true":"false")}_onSlotChange(){this._syncDerivedState()}_syncDerivedState(){const t=this.root.querySelector('slot[name="label"]'),e=this.root.querySelector('slot[name="description"]'),i=this.root.querySelector('slot[name="error"]'),n=this.root.querySelector('slot[name="prefix"]'),o=this.root.querySelector('slot[name="suffix"]'),s=(this.getAttribute("label")||"").trim(),m=(this.getAttribute("description")||"").trim(),p=(this.getAttribute("data-error")||"").trim(),u=!!s||z(t),l=!!m||z(e),c=!!p||z(i),d=z(n),h=z(o),b=this.root.querySelector(".label"),f=this.root.querySelector(".description"),g=this.root.querySelector(".prefix"),v=this.root.querySelector(".suffix"),x=this.root.querySelector(".meta"),C=this.root.querySelector(".footer"),_=this.root.querySelector(".error"),w=this.root.querySelector(".counter");b&&(u?b.removeAttribute("hidden"):b.setAttribute("hidden","")),f&&(l?f.removeAttribute("hidden"):f.setAttribute("hidden","")),g&&(d?g.removeAttribute("hidden"):g.setAttribute("hidden","")),v&&(h?v.removeAttribute("hidden"):v.setAttribute("hidden","")),x&&(u||l?x.removeAttribute("hidden"):x.setAttribute("hidden",""));const k=this.hasAttribute("counter");if(w&&(k?w.removeAttribute("hidden"):w.setAttribute("hidden","")),_&&(c?_.removeAttribute("hidden"):_.setAttribute("hidden","")),C&&(c||k?C.removeAttribute("hidden"):C.setAttribute("hidden","")),this._input){u?this._input.setAttribute("aria-labelledby",`${this._uid}-label`):this._input.removeAttribute("aria-labelledby");const A=[];l&&A.push(`${this._uid}-description`),c&&A.push(`${this._uid}-error`),A.length?this._input.setAttribute("aria-describedby",A.join(" ")):this._input.removeAttribute("aria-describedby"),this.getAttribute("validation")==="error"||!!p?this._input.setAttribute("aria-invalid","true"):this._input.removeAttribute("aria-invalid"),this.hasAttribute("required")?this._input.setAttribute("aria-required","true"):this._input.removeAttribute("aria-required")}}_onNativeInput(t){const e=t.target.value;this.getAttribute("value")!==e?this.setAttribute("value",e):this._syncInputValue(e),this._emitValueEvent("input",e);const i=Number(this.getAttribute("debounce")||0);i>0?(this._debounceTimer&&clearTimeout(this._debounceTimer),this._debounceTimer=setTimeout(()=>{this._emitValueEvent("debounced-input",e),this._debounceTimer=null},i)):this._emitValueEvent("debounced-input",e)}_onNativeChange(t){const e=t.target.value;this._emitValueEvent("change",e)}_onClearClick(t){if(t.preventDefault(),!(y(this,"disabled")||this.hasAttribute("readonly"))&&this._input){this.value="",this._input.value="",this._input.dispatchEvent(new Event("input",{bubbles:!0})),this._input.dispatchEvent(new Event("change",{bubbles:!0})),this.dispatchEvent(new CustomEvent("clear",{bubbles:!0,composed:!0}));try{this._input.focus({preventScroll:!0})}catch{this._input.focus()}}}render(){const t=this.getAttribute("value")||"",e=this.getAttribute("placeholder")||"",i=y(this,"disabled"),n=y(this,"clearable"),o=this.getAttribute("type")||"text",s=this.getAttribute("name")||"",m=this.hasAttribute("required"),p=this.getAttribute("pattern")||"",u=this.getAttribute("inputmode")||"",l=this.getAttribute("autocomplete")||"",c=this.getAttribute("min")||"",d=this.getAttribute("max")||"",h=this.getAttribute("step")||"",b=this.getAttribute("spellcheck")||"",f=this.getAttribute("maxlength")||"",g=this.getAttribute("minlength")||"",v=this.hasAttribute("readonly"),x=this.getAttribute("label")||"",C=this.getAttribute("description")||"",_=this.getAttribute("data-error")||"",w=this.getAttribute("validation")||"",k=this.hasAttribute("floating-label"),A=m?'<span class="required" aria-hidden="true">*</span>':"";this._syncHostTokens(),this.setContent(`
-      <style>${q}</style>
+`;function r(a){return a.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#39;")}function z(a){if(!a)return!1;const t=a.assignedNodes({flatten:!0});return t.length?t.some(e=>e.nodeType===Node.TEXT_NODE?!!e.textContent?.trim():e.nodeType===Node.ELEMENT_NODE):!1}function A(a,t){const e=a.getAttribute(t);if(e==null)return!1;const i=String(e).trim().toLowerCase();return i!=="false"&&i!=="0"}function T(a){return a==="none"||a==="large"||a==="full"}class E extends $.ElementBase{constructor(){super(),this._input=null,this._clearBtn=null,this._debounceTimer=null,this._formUnregister=null,this._uid=Math.random().toString(36).slice(2,9),this._autofocusApplied=!1,this._onNativeInput=this._onNativeInput.bind(this),this._onNativeChange=this._onNativeChange.bind(this),this._onClearClick=this._onClearClick.bind(this),this._onSlotChange=this._onSlotChange.bind(this)}static get observedAttributes(){return["value","placeholder","disabled","clearable","size","validation","debounce","maxlength","minlength","readonly","autofocus","counter","floating-label","headless","type","name","required","pattern","inputmode","autocomplete","min","max","step","spellcheck","variant","tone","density","shape","color","radius","label","aria-label","aria-description","aria-describedby","description","data-error"]}connectedCallback(){super.connectedCallback(),this.root.addEventListener("slotchange",this._onSlotChange),this._registerWithForm()}disconnectedCallback(){this.root.removeEventListener("slotchange",this._onSlotChange),this._detachListeners(),this._debounceTimer&&(clearTimeout(this._debounceTimer),this._debounceTimer=null),this._formUnregister&&(this._formUnregister(),this._formUnregister=null),this._autofocusApplied=!1,super.disconnectedCallback()}_syncHostTokens(){const t=this.getAttribute("color");t?this.style.setProperty("--ui-input-accent",t):this.style.removeProperty("--ui-input-accent");const e=this.getAttribute("radius")||"";e&&!T(e)?this.style.setProperty("--ui-input-border-radius",e):this.style.removeProperty("--ui-input-border-radius")}_syncControlAttrs(){if(this._syncHostTokens(),!this._input)return;const t=this._input,e=this.getAttribute("type")||"text",i=this.getAttribute("placeholder")||"",n=this.getAttribute("name")||"",o=this.getAttribute("pattern")||"",s=this.getAttribute("inputmode")||"",m=this.getAttribute("autocomplete")||"",p=this.getAttribute("min")||"",u=this.getAttribute("max")||"",l=this.getAttribute("step")||"",c=this.getAttribute("spellcheck")||"",d=this.getAttribute("maxlength")||"",h=this.getAttribute("minlength")||"",b=A(this,"disabled"),f=this.hasAttribute("required"),g=this.hasAttribute("readonly");try{t.type=e}catch{t.type="text"}t.placeholder=i,t.disabled=b,t.required=f,t.readOnly=g,t.name=n,o?t.setAttribute("pattern",o):t.removeAttribute("pattern"),s?t.setAttribute("inputmode",s):t.removeAttribute("inputmode"),m?t.setAttribute("autocomplete",m):t.removeAttribute("autocomplete"),p?t.setAttribute("min",p):t.removeAttribute("min"),u?t.setAttribute("max",u):t.removeAttribute("max"),l?t.setAttribute("step",l):t.removeAttribute("step"),c?t.setAttribute("spellcheck",c):t.removeAttribute("spellcheck"),d&&Number.isFinite(Number(d))?t.setAttribute("maxlength",d):t.removeAttribute("maxlength"),h&&Number.isFinite(Number(h))?t.setAttribute("minlength",h):t.removeAttribute("minlength")}attributeChangedCallback(t,e,i){if(e===i)return;if(t==="value"){this._syncInputValue(i||"");return}if(t==="name"&&this._registerWithForm(),t==="autofocus"&&!this.hasAttribute("autofocus")&&(this._autofocusApplied=!1),new Set(["placeholder","disabled","clearable","size","validation","debounce","maxlength","minlength","readonly","autofocus","counter","headless","type","name","required","pattern","inputmode","autocomplete","min","max","step","spellcheck","variant","tone","density","shape","color","radius","aria-label","aria-description","aria-describedby"]).has(t)){this._syncControlAttrs(),this._syncInputValue(this.value),this._syncDerivedState(),t==="autofocus"&&this.hasAttribute("autofocus")&&!this._autofocusApplied&&(this._autofocusApplied=!0,queueMicrotask(()=>{if(this.isConnected)try{this._input?.focus({preventScroll:!0})}catch{this._input?.focus()}}));return}this.isConnected&&this.requestRender()}get value(){return this.getAttribute("value")||""}set value(t){this.setAttribute("value",t||"")}focus(t){if(this._input){this._input.focus(t);return}super.focus(t)}blur(){this._input?.blur()}select(){this._input?.select()}_emitValueEvent(t,e){this.dispatchEvent(new CustomEvent(t,{detail:{value:e},bubbles:!0,composed:!0}))}_registerWithForm(){this._formUnregister&&(this._formUnregister(),this._formUnregister=null);try{const n=this.getRootNode().host?.closest?.("ui-form")||null||this.closest("ui-form"),o=this.getAttribute("name");n&&typeof n.registerField=="function"&&o&&(this._formUnregister=n.registerField(o,{name:o,getValue:()=>this.value,setValue:s=>{this.value=String(s??"")},validate:async()=>this._input?{valid:this._input.checkValidity(),message:this._input.validationMessage||void 0}:{valid:!0},setError:s=>{s?(this.setAttribute("validation","error"),this.setAttribute("data-error",s)):(this.removeAttribute("validation"),this.removeAttribute("data-error"))}}))}catch{}}_detachListeners(){this._input&&(this._input.removeEventListener("input",this._onNativeInput),this._input.removeEventListener("change",this._onNativeChange)),this._clearBtn&&this._clearBtn.removeEventListener("click",this._onClearClick),this._clearBtn=null}_syncInputValue(t){this._input&&this._input.value!==t&&(this._input.value=t),this._clearBtn&&(A(this,"clearable")&&t.length>0&&!A(this,"disabled")&&!this.hasAttribute("readonly")?this._clearBtn.removeAttribute("hidden"):this._clearBtn.setAttribute("hidden",""));const e=this.root.querySelector(".counter");if(e&&this.hasAttribute("counter")){const n=this.getAttribute("maxlength"),o=n?`${t.length}/${n}`:String(t.length);e.textContent=o}const i=this.root.querySelector(".shell");i&&i.setAttribute("data-has-value",t?"true":"false")}_onSlotChange(){this._syncDerivedState()}_syncDerivedState(){const t=this.root.querySelector('slot[name="label"]'),e=this.root.querySelector('slot[name="description"]'),i=this.root.querySelector('slot[name="error"]'),n=this.root.querySelector('slot[name="prefix"]'),o=this.root.querySelector('slot[name="suffix"]'),s=(this.getAttribute("label")||"").trim(),m=(this.getAttribute("description")||"").trim(),p=(this.getAttribute("data-error")||"").trim(),u=!!s||z(t),l=!!m||z(e),c=!!p||z(i),d=z(n),h=z(o),b=this.root.querySelector(".label"),f=this.root.querySelector(".description"),g=this.root.querySelector(".prefix"),v=this.root.querySelector(".suffix"),x=this.root.querySelector(".meta"),y=this.root.querySelector(".footer"),_=this.root.querySelector(".error"),C=this.root.querySelector(".counter");b&&(u?b.removeAttribute("hidden"):b.setAttribute("hidden","")),f&&(l?f.removeAttribute("hidden"):f.setAttribute("hidden","")),g&&(d?g.removeAttribute("hidden"):g.setAttribute("hidden","")),v&&(h?v.removeAttribute("hidden"):v.setAttribute("hidden","")),x&&(u||l?x.removeAttribute("hidden"):x.setAttribute("hidden",""));const k=this.hasAttribute("counter");if(C&&(k?C.removeAttribute("hidden"):C.setAttribute("hidden","")),_&&(c?_.removeAttribute("hidden"):_.setAttribute("hidden","")),y&&(c||k?y.removeAttribute("hidden"):y.setAttribute("hidden","")),this._input){S.syncControlName(this._input,this,u?`${this._uid}-label`:null);const w=[];l&&w.push(`${this._uid}-description`),c&&w.push(`${this._uid}-error`),S.syncControlDescription(this._input,this,this._uid,w),this.getAttribute("validation")==="error"||!!p?this._input.setAttribute("aria-invalid","true"):this._input.removeAttribute("aria-invalid"),this.hasAttribute("required")?this._input.setAttribute("aria-required","true"):this._input.removeAttribute("aria-required")}}_onNativeInput(t){const e=t.target.value;this.getAttribute("value")!==e?this.setAttribute("value",e):this._syncInputValue(e),this._emitValueEvent("input",e);const i=Number(this.getAttribute("debounce")||0);i>0?(this._debounceTimer&&clearTimeout(this._debounceTimer),this._debounceTimer=setTimeout(()=>{this._emitValueEvent("debounced-input",e),this._debounceTimer=null},i)):this._emitValueEvent("debounced-input",e)}_onNativeChange(t){const e=t.target.value;this._emitValueEvent("change",e)}_onClearClick(t){if(t.preventDefault(),!(A(this,"disabled")||this.hasAttribute("readonly"))&&this._input){this.value="",this._input.value="",this._input.dispatchEvent(new Event("input",{bubbles:!0})),this._input.dispatchEvent(new Event("change",{bubbles:!0})),this.dispatchEvent(new CustomEvent("clear",{bubbles:!0,composed:!0}));try{this._input.focus({preventScroll:!0})}catch{this._input.focus()}}}render(){const t=this.getAttribute("value")||"",e=this.getAttribute("placeholder")||"",i=A(this,"disabled"),n=A(this,"clearable"),o=this.getAttribute("type")||"text",s=this.getAttribute("name")||"",m=this.hasAttribute("required"),p=this.getAttribute("pattern")||"",u=this.getAttribute("inputmode")||"",l=this.getAttribute("autocomplete")||"",c=this.getAttribute("min")||"",d=this.getAttribute("max")||"",h=this.getAttribute("step")||"",b=this.getAttribute("spellcheck")||"",f=this.getAttribute("maxlength")||"",g=this.getAttribute("minlength")||"",v=this.hasAttribute("readonly"),x=this.getAttribute("label")||"",y=this.getAttribute("description")||"",_=this.getAttribute("data-error")||"",C=this.getAttribute("validation")||"",k=this.hasAttribute("floating-label"),w=m?'<span class="required" aria-hidden="true">*</span>':"";this._syncHostTokens(),this.setContent(`
+      <style>${N}</style>
       <div class="root" part="root">
         <div class="meta" part="meta">
           <label class="label" id="${this._uid}-label" part="label">
             <slot name="label">${r(x)}</slot>
-            ${A}
+            ${w}
           </label>
           <p class="description" id="${this._uid}-description" part="description">
-            <slot name="description">${r(C)}</slot>
+            <slot name="description">${r(y)}</slot>
           </p>
         </div>
 
-        <div class="shell" part="shell" data-validation="${r(w||"none")}" data-has-value="${t?"true":"false"}">
+        <div class="shell" part="shell" data-validation="${r(C||"none")}" data-has-value="${t?"true":"false"}">
           <span class="prefix" part="prefix"><slot name="prefix"></slot></span>
 
           <div class="control" part="control">
@@ -520,7 +520,7 @@
             ${k?`<span class="floating-label" part="floating-label">${r(x||e||s||"Input")}</span>`:""}
           </div>
 
-          <button class="clear-btn" part="clear" aria-label="Clear" ${n&&t&&!i&&!v?"":"hidden"}>${$}</button>
+          <button class="clear-btn" part="clear" aria-label="Clear" ${n&&t&&!i&&!v?"":"hidden"}>${q}</button>
 
           <span class="suffix" part="suffix"><slot name="suffix"></slot></span>
         </div>
@@ -532,4 +532,4 @@
           <p class="counter" part="counter"></p>
         </div>
       </div>
-    `),this._detachListeners(),this._input=this.root.querySelector("input"),this._clearBtn=this.root.querySelector("button.clear-btn"),this._input&&(this._input.addEventListener("input",this._onNativeInput),this._input.addEventListener("change",this._onNativeChange)),this._clearBtn?.addEventListener("click",this._onClearClick),this._syncControlAttrs(),this._syncInputValue(t),this._syncDerivedState(),this.hasAttribute("autofocus")&&!this._autofocusApplied&&(this._autofocusApplied=!0,queueMicrotask(()=>{if(this.isConnected)try{this._input?.focus({preventScroll:!0})}catch{this._input?.focus()}}))}shouldRenderOnAttributeChange(t,e,i){return t==="label"||t==="description"||t==="data-error"||t==="floating-label"}}typeof customElements<"u"&&!customElements.get("ui-input")&&customElements.define("ui-input",S);exports.UIInput=S;
+    `),this._detachListeners(),this._input=this.root.querySelector("input"),this._clearBtn=this.root.querySelector("button.clear-btn"),this._input&&(this._input.addEventListener("input",this._onNativeInput),this._input.addEventListener("change",this._onNativeChange)),this._clearBtn?.addEventListener("click",this._onClearClick),this._syncControlAttrs(),this._syncInputValue(t),this._syncDerivedState(),this.hasAttribute("autofocus")&&!this._autofocusApplied&&(this._autofocusApplied=!0,queueMicrotask(()=>{if(this.isConnected)try{this._input?.focus({preventScroll:!0})}catch{this._input?.focus()}}))}shouldRenderOnAttributeChange(t,e,i){return t==="label"||t==="description"||t==="data-error"||t==="floating-label"}}typeof customElements<"u"&&!customElements.get("ui-input")&&customElements.define("ui-input",E);exports.UIInput=E;

package/dist/input.esm.js

@@ -1,9 +1,10 @@
-import { E as S } from "./ElementBase-YlTLMsGk.mjs";
-const E = `
+import { E as S } from "./ElementBase-BeZT54Hj.mjs";
+import { s as E, a as $ } from "./control-name-Bpj7F34X.mjs";
+const q = `
   <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>
-`, $ = `
+`, N = `
   :host {
     --ui-input-padding: var(--ui-padding, 10px 12px);
     --ui-input-border-color: var(--ui-color-border, var(--ui-border-color, #cbd5e1));
@@ -15,12 +16,12 @@ const E = `
     --ui-input-width: 100%;
     --ui-input-bg: var(--base-input-bg, var(--ui-color-surface, var(--ui-surface, #ffffff)));
     --ui-input-color: var(--ui-color-text, var(--ui-text, #0f172a));
-    --ui-label-color: var(--ui-color-muted, var(--ui-muted, #64748b));
-    --ui-description-color: var(--ui-color-muted, var(--ui-muted, #64748b));
+    --ui-label-color: var(--ui-color-muted, var(--ui-muted, #526175));
+    --ui-description-color: var(--ui-color-muted, var(--ui-muted, #526175));
     --ui-input-focus-ring: var(--ui-color-focus-ring, var(--ui-focus-ring, #2563eb));
     --ui-input-error: var(--ui-color-danger, var(--ui-error, #dc2626));
-    --ui-input-success: var(--ui-color-success, var(--ui-success, #16a34a));
-    --ui-input-warning: var(--ui-color-warning, var(--ui-warning, #d97706));
+    --ui-input-success: var(--ui-color-success, var(--ui-success, #15803d));
+    --ui-input-warning: var(--ui-color-warning, var(--ui-warning, #b45309));
     --ui-input-accent: var(--ui-color-primary, var(--ui-primary, #2563eb));
     --ui-input-shadow: none;
     --ui-input-gap: var(--ui-default-gap, 8px);
@@ -370,7 +371,7 @@ const E = `
   }
 
   :host([tone="success"]) {
-    --ui-input-accent: var(--ui-color-success, var(--ui-success, #16a34a));
+    --ui-input-accent: var(--ui-color-success, var(--ui-success, #15803d));
   }
 
   :host([tone="warning"]) {
@@ -491,16 +492,16 @@ function z(a) {
   const t = a.assignedNodes({ flatten: !0 });
   return t.length ? t.some((e) => e.nodeType === Node.TEXT_NODE ? !!e.textContent?.trim() : e.nodeType === Node.ELEMENT_NODE) : !1;
 }
-function y(a, t) {
+function A(a, t) {
   const e = a.getAttribute(t);
   if (e == null) return !1;
   const i = String(e).trim().toLowerCase();
   return i !== "false" && i !== "0";
 }
-function q(a) {
+function T(a) {
   return a === "none" || a === "large" || a === "full";
 }
-class T extends S {
+class L extends S {
   constructor() {
     super(), this._input = null, this._clearBtn = null, this._debounceTimer = null, this._formUnregister = null, this._uid = Math.random().toString(36).slice(2, 9), this._autofocusApplied = !1, this._onNativeInput = this._onNativeInput.bind(this), this._onNativeChange = this._onNativeChange.bind(this), this._onClearClick = this._onClearClick.bind(this), this._onSlotChange = this._onSlotChange.bind(this);
   }
@@ -537,6 +538,9 @@ class T extends S {
       "color",
       "radius",
       "label",
+      "aria-label",
+      "aria-description",
+      "aria-describedby",
       "description",
       "data-error"
     ];
@@ -551,17 +555,17 @@ class T extends S {
     const t = this.getAttribute("color");
     t ? this.style.setProperty("--ui-input-accent", t) : this.style.removeProperty("--ui-input-accent");
     const e = this.getAttribute("radius") || "";
-    e && !q(e) ? this.style.setProperty("--ui-input-border-radius", e) : this.style.removeProperty("--ui-input-border-radius");
+    e && !T(e) ? this.style.setProperty("--ui-input-border-radius", e) : this.style.removeProperty("--ui-input-border-radius");
   }
   _syncControlAttrs() {
     if (this._syncHostTokens(), !this._input) return;
-    const t = this._input, e = this.getAttribute("type") || "text", i = this.getAttribute("placeholder") || "", n = this.getAttribute("name") || "", o = this.getAttribute("pattern") || "", s = this.getAttribute("inputmode") || "", m = this.getAttribute("autocomplete") || "", p = this.getAttribute("min") || "", u = this.getAttribute("max") || "", l = this.getAttribute("step") || "", c = this.getAttribute("spellcheck") || "", d = this.getAttribute("maxlength") || "", h = this.getAttribute("minlength") || "", b = y(this, "disabled"), f = this.hasAttribute("required"), g = this.hasAttribute("readonly");
+    const t = this._input, e = this.getAttribute("type") || "text", i = this.getAttribute("placeholder") || "", n = this.getAttribute("name") || "", o = this.getAttribute("pattern") || "", s = this.getAttribute("inputmode") || "", g = this.getAttribute("autocomplete") || "", p = this.getAttribute("min") || "", u = this.getAttribute("max") || "", l = this.getAttribute("step") || "", c = this.getAttribute("spellcheck") || "", d = this.getAttribute("maxlength") || "", h = this.getAttribute("minlength") || "", b = A(this, "disabled"), f = this.hasAttribute("required"), m = this.hasAttribute("readonly");
     try {
       t.type = e;
     } catch {
       t.type = "text";
     }
-    t.placeholder = i, t.disabled = b, t.required = f, t.readOnly = g, t.name = n, o ? t.setAttribute("pattern", o) : t.removeAttribute("pattern"), s ? t.setAttribute("inputmode", s) : t.removeAttribute("inputmode"), m ? t.setAttribute("autocomplete", m) : t.removeAttribute("autocomplete"), p ? t.setAttribute("min", p) : t.removeAttribute("min"), u ? t.setAttribute("max", u) : t.removeAttribute("max"), l ? t.setAttribute("step", l) : t.removeAttribute("step"), c ? t.setAttribute("spellcheck", c) : t.removeAttribute("spellcheck"), d && Number.isFinite(Number(d)) ? t.setAttribute("maxlength", d) : t.removeAttribute("maxlength"), h && Number.isFinite(Number(h)) ? t.setAttribute("minlength", h) : t.removeAttribute("minlength");
+    t.placeholder = i, t.disabled = b, t.required = f, t.readOnly = m, t.name = n, o ? t.setAttribute("pattern", o) : t.removeAttribute("pattern"), s ? t.setAttribute("inputmode", s) : t.removeAttribute("inputmode"), g ? t.setAttribute("autocomplete", g) : t.removeAttribute("autocomplete"), p ? t.setAttribute("min", p) : t.removeAttribute("min"), u ? t.setAttribute("max", u) : t.removeAttribute("max"), l ? t.setAttribute("step", l) : t.removeAttribute("step"), c ? t.setAttribute("spellcheck", c) : t.removeAttribute("spellcheck"), d && Number.isFinite(Number(d)) ? t.setAttribute("maxlength", d) : t.removeAttribute("maxlength"), h && Number.isFinite(Number(h)) ? t.setAttribute("minlength", h) : t.removeAttribute("minlength");
   }
   attributeChangedCallback(t, e, i) {
     if (e === i) return;
@@ -597,7 +601,10 @@ class T extends S {
       "density",
       "shape",
       "color",
-      "radius"
+      "radius",
+      "aria-label",
+      "aria-description",
+      "aria-describedby"
     ])).has(t)) {
       this._syncControlAttrs(), this._syncInputValue(this.value), this._syncDerivedState(), t === "autofocus" && this.hasAttribute("autofocus") && !this._autofocusApplied && (this._autofocusApplied = !0, queueMicrotask(() => {
         if (this.isConnected)
@@ -661,7 +668,7 @@ class T extends S {
     this._input && (this._input.removeEventListener("input", this._onNativeInput), this._input.removeEventListener("change", this._onNativeChange)), this._clearBtn && this._clearBtn.removeEventListener("click", this._onClearClick), this._clearBtn = null;
   }
   _syncInputValue(t) {
-    this._input && this._input.value !== t && (this._input.value = t), this._clearBtn && (y(this, "clearable") && t.length > 0 && !y(this, "disabled") && !this.hasAttribute("readonly") ? this._clearBtn.removeAttribute("hidden") : this._clearBtn.setAttribute("hidden", ""));
+    this._input && this._input.value !== t && (this._input.value = t), this._clearBtn && (A(this, "clearable") && t.length > 0 && !A(this, "disabled") && !this.hasAttribute("readonly") ? this._clearBtn.removeAttribute("hidden") : this._clearBtn.setAttribute("hidden", ""));
     const e = this.root.querySelector(".counter");
     if (e && this.hasAttribute("counter")) {
       const n = this.getAttribute("maxlength"), o = n ? `${t.length}/${n}` : String(t.length);
@@ -674,13 +681,13 @@ class T extends S {
     this._syncDerivedState();
   }
   _syncDerivedState() {
-    const t = this.root.querySelector('slot[name="label"]'), e = this.root.querySelector('slot[name="description"]'), i = this.root.querySelector('slot[name="error"]'), n = this.root.querySelector('slot[name="prefix"]'), o = this.root.querySelector('slot[name="suffix"]'), s = (this.getAttribute("label") || "").trim(), m = (this.getAttribute("description") || "").trim(), p = (this.getAttribute("data-error") || "").trim(), u = !!s || z(t), l = !!m || z(e), c = !!p || z(i), d = z(n), h = z(o), b = this.root.querySelector(".label"), f = this.root.querySelector(".description"), g = this.root.querySelector(".prefix"), v = this.root.querySelector(".suffix"), x = this.root.querySelector(".meta"), C = this.root.querySelector(".footer"), _ = this.root.querySelector(".error"), w = this.root.querySelector(".counter");
-    b && (u ? b.removeAttribute("hidden") : b.setAttribute("hidden", "")), f && (l ? f.removeAttribute("hidden") : f.setAttribute("hidden", "")), g && (d ? g.removeAttribute("hidden") : g.setAttribute("hidden", "")), v && (h ? v.removeAttribute("hidden") : v.setAttribute("hidden", "")), x && (u || l ? x.removeAttribute("hidden") : x.setAttribute("hidden", ""));
+    const t = this.root.querySelector('slot[name="label"]'), e = this.root.querySelector('slot[name="description"]'), i = this.root.querySelector('slot[name="error"]'), n = this.root.querySelector('slot[name="prefix"]'), o = this.root.querySelector('slot[name="suffix"]'), s = (this.getAttribute("label") || "").trim(), g = (this.getAttribute("description") || "").trim(), p = (this.getAttribute("data-error") || "").trim(), u = !!s || z(t), l = !!g || z(e), c = !!p || z(i), d = z(n), h = z(o), b = this.root.querySelector(".label"), f = this.root.querySelector(".description"), m = this.root.querySelector(".prefix"), v = this.root.querySelector(".suffix"), x = this.root.querySelector(".meta"), y = this.root.querySelector(".footer"), _ = this.root.querySelector(".error"), C = this.root.querySelector(".counter");
+    b && (u ? b.removeAttribute("hidden") : b.setAttribute("hidden", "")), f && (l ? f.removeAttribute("hidden") : f.setAttribute("hidden", "")), m && (d ? m.removeAttribute("hidden") : m.setAttribute("hidden", "")), v && (h ? v.removeAttribute("hidden") : v.setAttribute("hidden", "")), x && (u || l ? x.removeAttribute("hidden") : x.setAttribute("hidden", ""));
     const k = this.hasAttribute("counter");
-    if (w && (k ? w.removeAttribute("hidden") : w.setAttribute("hidden", "")), _ && (c ? _.removeAttribute("hidden") : _.setAttribute("hidden", "")), C && (c || k ? C.removeAttribute("hidden") : C.setAttribute("hidden", "")), this._input) {
-      u ? this._input.setAttribute("aria-labelledby", `${this._uid}-label`) : this._input.removeAttribute("aria-labelledby");
-      const A = [];
-      l && A.push(`${this._uid}-description`), c && A.push(`${this._uid}-error`), A.length ? this._input.setAttribute("aria-describedby", A.join(" ")) : this._input.removeAttribute("aria-describedby"), this.getAttribute("validation") === "error" || !!p ? this._input.setAttribute("aria-invalid", "true") : this._input.removeAttribute("aria-invalid"), this.hasAttribute("required") ? this._input.setAttribute("aria-required", "true") : this._input.removeAttribute("aria-required");
+    if (C && (k ? C.removeAttribute("hidden") : C.setAttribute("hidden", "")), _ && (c ? _.removeAttribute("hidden") : _.setAttribute("hidden", "")), y && (c || k ? y.removeAttribute("hidden") : y.setAttribute("hidden", "")), this._input) {
+      E(this._input, this, u ? `${this._uid}-label` : null);
+      const w = [];
+      l && w.push(`${this._uid}-description`), c && w.push(`${this._uid}-error`), $(this._input, this, this._uid, w), this.getAttribute("validation") === "error" || !!p ? this._input.setAttribute("aria-invalid", "true") : this._input.removeAttribute("aria-invalid"), this.hasAttribute("required") ? this._input.setAttribute("aria-required", "true") : this._input.removeAttribute("aria-required");
     }
   }
   _onNativeInput(t) {
@@ -696,7 +703,7 @@ class T extends S {
     this._emitValueEvent("change", e);
   }
   _onClearClick(t) {
-    if (t.preventDefault(), !(y(this, "disabled") || this.hasAttribute("readonly")) && this._input) {
+    if (t.preventDefault(), !(A(this, "disabled") || this.hasAttribute("readonly")) && this._input) {
       this.value = "", this._input.value = "", this._input.dispatchEvent(new Event("input", { bubbles: !0 })), this._input.dispatchEvent(new Event("change", { bubbles: !0 })), this.dispatchEvent(new CustomEvent("clear", { bubbles: !0, composed: !0 }));
       try {
         this._input.focus({ preventScroll: !0 });
@@ -706,21 +713,21 @@ class T extends S {
     }
   }
   render() {
-    const t = this.getAttribute("value") || "", e = this.getAttribute("placeholder") || "", i = y(this, "disabled"), n = y(this, "clearable"), o = this.getAttribute("type") || "text", s = this.getAttribute("name") || "", m = this.hasAttribute("required"), p = this.getAttribute("pattern") || "", u = this.getAttribute("inputmode") || "", l = this.getAttribute("autocomplete") || "", c = this.getAttribute("min") || "", d = this.getAttribute("max") || "", h = this.getAttribute("step") || "", b = this.getAttribute("spellcheck") || "", f = this.getAttribute("maxlength") || "", g = this.getAttribute("minlength") || "", v = this.hasAttribute("readonly"), x = this.getAttribute("label") || "", C = this.getAttribute("description") || "", _ = this.getAttribute("data-error") || "", w = this.getAttribute("validation") || "", k = this.hasAttribute("floating-label"), A = m ? '<span class="required" aria-hidden="true">*</span>' : "";
+    const t = this.getAttribute("value") || "", e = this.getAttribute("placeholder") || "", i = A(this, "disabled"), n = A(this, "clearable"), o = this.getAttribute("type") || "text", s = this.getAttribute("name") || "", g = this.hasAttribute("required"), p = this.getAttribute("pattern") || "", u = this.getAttribute("inputmode") || "", l = this.getAttribute("autocomplete") || "", c = this.getAttribute("min") || "", d = this.getAttribute("max") || "", h = this.getAttribute("step") || "", b = this.getAttribute("spellcheck") || "", f = this.getAttribute("maxlength") || "", m = this.getAttribute("minlength") || "", v = this.hasAttribute("readonly"), x = this.getAttribute("label") || "", y = this.getAttribute("description") || "", _ = this.getAttribute("data-error") || "", C = this.getAttribute("validation") || "", k = this.hasAttribute("floating-label"), w = g ? '<span class="required" aria-hidden="true">*</span>' : "";
     this._syncHostTokens(), this.setContent(`
-      <style>${$}</style>
+      <style>${N}</style>
       <div class="root" part="root">
         <div class="meta" part="meta">
           <label class="label" id="${this._uid}-label" part="label">
             <slot name="label">${r(x)}</slot>
-            ${A}
+            ${w}
           </label>
           <p class="description" id="${this._uid}-description" part="description">
-            <slot name="description">${r(C)}</slot>
+            <slot name="description">${r(y)}</slot>
           </p>
         </div>
 
-        <div class="shell" part="shell" data-validation="${r(w || "none")}" data-has-value="${t ? "true" : "false"}">
+        <div class="shell" part="shell" data-validation="${r(C || "none")}" data-has-value="${t ? "true" : "false"}">
           <span class="prefix" part="prefix"><slot name="prefix"></slot></span>
 
           <div class="control" part="control">
@@ -730,7 +737,7 @@ class T extends S {
               name="${r(s)}"
               value="${r(t)}"
               placeholder="${r(e)}"
-              ${m ? "required" : ""}
+              ${g ? "required" : ""}
               ${p ? `pattern="${r(p)}"` : ""}
               ${u ? `inputmode="${r(u)}"` : ""}
               ${l ? `autocomplete="${r(l)}"` : ""}
@@ -739,14 +746,14 @@ class T extends S {
               ${h ? `step="${r(h)}"` : ""}
               ${b ? `spellcheck="${r(b)}"` : ""}
               ${f ? `maxlength="${r(f)}"` : ""}
-              ${g ? `minlength="${r(g)}"` : ""}
+              ${m ? `minlength="${r(m)}"` : ""}
               ${i ? "disabled" : ""}
               ${v ? "readonly" : ""}
             />
             ${k ? `<span class="floating-label" part="floating-label">${r(x || e || s || "Input")}</span>` : ""}
           </div>
 
-          <button class="clear-btn" part="clear" aria-label="Clear" ${n && t && !i && !v ? "" : "hidden"}>${E}</button>
+          <button class="clear-btn" part="clear" aria-label="Clear" ${n && t && !i && !v ? "" : "hidden"}>${q}</button>
 
           <span class="suffix" part="suffix"><slot name="suffix"></slot></span>
         </div>
@@ -771,7 +778,7 @@ class T extends S {
     return t === "label" || t === "description" || t === "data-error" || t === "floating-label";
   }
 }
-typeof customElements < "u" && !customElements.get("ui-input") && customElements.define("ui-input", T);
+typeof customElements < "u" && !customElements.get("ui-input") && customElements.define("ui-input", L);
 export {
-  T as UIInput
+  L as UIInput
 };

package/dist/label.cjs.js

@@ -1,7 +1,7 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("./ElementBase-EV6mVBUV.js"),u=`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("./ElementBase-DxbvhLJs.js"),u=`
   :host {
     --ui-label-color: var(--ui-color-text, var(--ui-text, #0f172a));
-    --ui-label-muted: var(--ui-color-muted, var(--ui-muted, #64748b));
+    --ui-label-muted: var(--ui-color-muted, var(--ui-muted, #526175));
     --ui-label-error: var(--ui-color-danger, var(--ui-error, #dc2626));
     --ui-label-bg: transparent;
     --ui-label-border: 1px solid transparent;
@@ -123,8 +123,8 @@
   }
 
   :host([tone="brand"]) { --ui-label-color: var(--ui-color-primary, var(--ui-primary, #2563eb)); }
-  :host([tone="success"]) { --ui-label-color: var(--ui-color-success, var(--ui-success, #16a34a)); }
-  :host([tone="warning"]) { --ui-label-color: var(--ui-color-warning, var(--ui-warning, #d97706)); }
+  :host([tone="success"]) { --ui-label-color: var(--ui-color-success, var(--ui-success, #15803d)); }
+  :host([tone="warning"]) { --ui-label-color: var(--ui-color-warning, var(--ui-warning, #b45309)); }
   :host([tone="danger"]) { --ui-label-color: var(--ui-color-danger, var(--ui-error, #dc2626)); }
 
   :host([shape="square"]) { --ui-label-radius: 4px; }

package/dist/label.esm.js

@@ -1,8 +1,8 @@
-import { E as s } from "./ElementBase-YlTLMsGk.mjs";
+import { E as s } from "./ElementBase-BeZT54Hj.mjs";
 const n = `
   :host {
     --ui-label-color: var(--ui-color-text, var(--ui-text, #0f172a));
-    --ui-label-muted: var(--ui-color-muted, var(--ui-muted, #64748b));
+    --ui-label-muted: var(--ui-color-muted, var(--ui-muted, #526175));
     --ui-label-error: var(--ui-color-danger, var(--ui-error, #dc2626));
     --ui-label-bg: transparent;
     --ui-label-border: 1px solid transparent;
@@ -124,8 +124,8 @@ const n = `
   }
 
   :host([tone="brand"]) { --ui-label-color: var(--ui-color-primary, var(--ui-primary, #2563eb)); }
-  :host([tone="success"]) { --ui-label-color: var(--ui-color-success, var(--ui-success, #16a34a)); }
-  :host([tone="warning"]) { --ui-label-color: var(--ui-color-warning, var(--ui-warning, #d97706)); }
+  :host([tone="success"]) { --ui-label-color: var(--ui-color-success, var(--ui-success, #15803d)); }
+  :host([tone="warning"]) { --ui-label-color: var(--ui-color-warning, var(--ui-warning, #b45309)); }
   :host([tone="danger"]) { --ui-label-color: var(--ui-color-danger, var(--ui-error, #dc2626)); }
 
   :host([shape="square"]) { --ui-label-radius: 4px; }

package/dist/layout.cjs.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const f=require("./ElementBase-EV6mVBUV.js"),x=`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const f=require("./ElementBase-DxbvhLJs.js"),x=`
   :host {
     --ui-layout-bg: var(--ui-color-background, #f8fafc);
     --ui-layout-surface: var(--ui-color-surface, #ffffff);

package/dist/layout.esm.js

@@ -1,4 +1,4 @@
-import { E as m } from "./ElementBase-YlTLMsGk.mjs";
+import { E as m } from "./ElementBase-BeZT54Hj.mjs";
 const f = `
   :host {
     --ui-layout-bg: var(--ui-color-background, #f8fafc);

package/dist/{listbox-B6QgECax.js → listbox-CTpRpuF7.js}

@@ -38,7 +38,7 @@
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
-    color: color-mix(in srgb, currentColor 58%, transparent);
+    color: color-mix(in srgb, currentColor 70%, transparent);
     font-size: 0.92em;
     line-height: 1.35;
     letter-spacing: inherit;

package/dist/{listbox-DJamVeFj.mjs → listbox-hMVOhKHC.mjs}

@@ -81,7 +81,7 @@ const h = "data-ui-listbox-base-style", y = `
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
-    color: color-mix(in srgb, currentColor 58%, transparent);
+    color: color-mix(in srgb, currentColor 70%, transparent);
     font-size: 0.92em;
     line-height: 1.35;
     letter-spacing: inherit;

package/dist/listbox.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./listbox-B6QgECax.js");exports.UIListbox=e.UIListbox;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./listbox-CTpRpuF7.js");exports.UIListbox=e.UIListbox;

package/dist/listbox.esm.js

@@ -1,4 +1,4 @@
-import { U as s } from "./listbox-DJamVeFj.mjs";
+import { U as s } from "./listbox-hMVOhKHC.mjs";
 export {
   s as UIListbox
 };

package/dist/marquee.cjs.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const p=require("./ElementBase-EV6mVBUV.js"),l="24px",f="48px",b=60,g=new Set(["none","sm","md","lg","full"]),v=new Set(["direction","speed","gap","size","padding"]),q=`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const p=require("./ElementBase-DxbvhLJs.js"),l="24px",f="48px",b=60,g=new Set(["none","sm","md","lg","full"]),v=new Set(["direction","speed","gap","size","padding"]),q=`
   :host {
     --ui-marquee-gap: ${l};
     --ui-marquee-fade-size: ${f};
@@ -110,7 +110,7 @@
   }
 
   :host([tone="neutral"]) {
-    --ui-marquee-accent: #64748b;
+    --ui-marquee-accent: #526175;
   }
 
   :host([tone="info"]) {
@@ -118,11 +118,11 @@
   }
 
   :host([tone="success"]) {
-    --ui-marquee-accent: var(--ui-color-success, #16a34a);
+    --ui-marquee-accent: var(--ui-color-success, #15803d);
   }
 
   :host([tone="warning"]) {
-    --ui-marquee-accent: var(--ui-color-warning, #d97706);
+    --ui-marquee-accent: var(--ui-color-warning, #b45309);
   }
 
   :host([tone="danger"]) {

package/dist/marquee.esm.js

@@ -1,4 +1,4 @@
-import { E as h } from "./ElementBase-YlTLMsGk.mjs";
+import { E as h } from "./ElementBase-BeZT54Hj.mjs";
 const l = "24px", p = "48px", f = 60, b = /* @__PURE__ */ new Set(["none", "sm", "md", "lg", "full"]), g = /* @__PURE__ */ new Set(["direction", "speed", "gap", "size", "padding"]), v = `
   :host {
     --ui-marquee-gap: ${l};
@@ -111,7 +111,7 @@ const l = "24px", p = "48px", f = 60, b = /* @__PURE__ */ new Set(["none", "sm",
   }
 
   :host([tone="neutral"]) {
-    --ui-marquee-accent: #64748b;
+    --ui-marquee-accent: #526175;
   }
 
   :host([tone="info"]) {
@@ -119,11 +119,11 @@ const l = "24px", p = "48px", f = 60, b = /* @__PURE__ */ new Set(["none", "sm",
   }
 
   :host([tone="success"]) {
-    --ui-marquee-accent: var(--ui-color-success, #16a34a);
+    --ui-marquee-accent: var(--ui-color-success, #15803d);
   }
 
   :host([tone="warning"]) {
-    --ui-marquee-accent: var(--ui-color-warning, #d97706);
+    --ui-marquee-accent: var(--ui-color-warning, #b45309);
   }
 
   :host([tone="danger"]) {

package/dist/masonry-grid.cjs.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const f=require("./ElementBase-EV6mVBUV.js"),b={sm:"var(--ui-breakpoint-sm, 640px)",md:"var(--ui-breakpoint-md, 768px)",lg:"var(--ui-breakpoint-lg, 1024px)",xl:"var(--ui-breakpoint-xl, 1280px)"},p=["display","columns","columnwidth","gap","columngap","itemgap","fill"],v={xs:"var(--ui-space-xs, 4px)",sm:"var(--ui-space-sm, 8px)",md:"var(--ui-space-md, 12px)",lg:"var(--ui-space-lg, 20px)",xl:"var(--ui-space-xl, 28px)"},x=`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const f=require("./ElementBase-DxbvhLJs.js"),b={sm:"var(--ui-breakpoint-sm, 640px)",md:"var(--ui-breakpoint-md, 768px)",lg:"var(--ui-breakpoint-lg, 1024px)",xl:"var(--ui-breakpoint-xl, 1280px)"},p=["display","columns","columnwidth","gap","columngap","itemgap","fill"],v={xs:"var(--ui-space-xs, 4px)",sm:"var(--ui-space-sm, 8px)",md:"var(--ui-space-md, 12px)",lg:"var(--ui-space-lg, 20px)",xl:"var(--ui-space-xl, 28px)"},x=`
   :host {
     --ui-masonry-display: block;
     --ui-masonry-columns: auto;

package/dist/masonry-grid.esm.js

@@ -1,4 +1,4 @@
-import { E as f } from "./ElementBase-YlTLMsGk.mjs";
+import { E as f } from "./ElementBase-BeZT54Hj.mjs";
 const g = {
   sm: "var(--ui-breakpoint-sm, 640px)",
   md: "var(--ui-breakpoint-md, 768px)",

package/dist/{menu-item-styles-CbNUEwP2.js → menu-item-styles-B4onAr4C.js}

@@ -125,7 +125,7 @@
   }
 
   ${$} {
-    color: color-mix(in srgb, currentColor 58%, transparent);
+    color: color-mix(in srgb, currentColor 70%, transparent);
     font-size: calc(var(${t}-item-font-size, 14px) - 1px);
     line-height: 1.35;
     letter-spacing: inherit;
@@ -136,7 +136,7 @@
     padding-left: 14px;
     flex: 0 0 auto;
     min-width: max-content;
-    color: color-mix(in srgb, currentColor 54%, transparent);
+    color: color-mix(in srgb, currentColor 70%, transparent);
     font-size: calc(var(${t}-item-font-size, 14px) - 1px);
     line-height: 1;
     letter-spacing: inherit;
@@ -146,7 +146,7 @@
   ${C} {
     margin-left: 6px;
     flex: 0 0 auto;
-    color: color-mix(in srgb, currentColor 54%, transparent);
+    color: color-mix(in srgb, currentColor 70%, transparent);
     font-size: 12px;
   }
 `}exports.createSharedMenuItemCss=T;

package/dist/{menu-item-styles-CZiPwPwl.mjs → menu-item-styles-IGSFLAHu.mjs}

@@ -150,7 +150,7 @@ function E(e) {
   }
 
   ${$} {
-    color: color-mix(in srgb, currentColor 58%, transparent);
+    color: color-mix(in srgb, currentColor 70%, transparent);
     font-size: calc(var(${t}-item-font-size, 14px) - 1px);
     line-height: 1.35;
     letter-spacing: inherit;
@@ -161,7 +161,7 @@ function E(e) {
     padding-left: 14px;
     flex: 0 0 auto;
     min-width: max-content;
-    color: color-mix(in srgb, currentColor 54%, transparent);
+    color: color-mix(in srgb, currentColor 70%, transparent);
     font-size: calc(var(${t}-item-font-size, 14px) - 1px);
     line-height: 1;
     letter-spacing: inherit;
@@ -171,7 +171,7 @@ function E(e) {
   ${C} {
     margin-left: 6px;
     flex: 0 0 auto;
-    color: color-mix(in srgb, currentColor 54%, transparent);
+    color: color-mix(in srgb, currentColor 70%, transparent);
     font-size: 12px;
   }
 `;