@taprootio/espalier 4.20.2 → 6.0.0

package/dist/form-item/esp-form-item.js

@@ -1,18 +1,18 @@
-var l=function(c,e,t,i){var n=arguments.length,r=n<3?e:i===null?i=Object.getOwnPropertyDescriptor(e,t):i,h;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(c,e,t,i);else for(var d=c.length-1;d>=0;d--)(h=c[d])&&(r=(n<3?h(r):n>3?h(e,t,r):h(e,t))||r);return n>3&&r&&Object.defineProperty(e,t,r),r};import{LitElement as H,css as w,html as p,nothing as m}from"lit";import{customElement as k,property as o}from"lit/decorators.js";import{classMap as N}from"lit/directives/class-map.js";import{createRef as F,ref as _}from"lit/directives/ref.js";import{VALIDITY_CHANGED_EVENT as g}from"../shared/validation.js";import"../help/esp-help-button.js";import{resolveHelpTarget as T}from"../help/help-document.js";import{describedByTokens as v,setDescribedByTokens as b}from"../shared/aria-describedby.js";let y=0;const a=new WeakMap,E=new WeakMap;let s=class extends H{constructor(){super(...arguments),this.fieldSlot=F(),this.fieldReconcileQueued=!1,this.pendingNativeError=null,this.pendingNativeErrorTimer=null,this.handleValidityChanged=e=>{const t=this.fieldElement;if(!t||!e.composedPath().includes(t))return;const i=e.detail;E.set(t,{valid:i.valid}),!(this._errorSource==="pool"&&this._error.length>0)&&(i.valid?this._errorSource==="native"&&this._setError("","manual"):this._setError(i.message,"native"))},this.handleFieldInvalid=e=>{if(e.preventDefault(),this._errorSource==="pool"&&this._error.length>0)return;const t=e.currentTarget;t===this.fieldElement&&"validationMessage"in t&&this._setError(t.validationMessage,"native")},this._errorSource="manual",this.label="",this.autofocus=!1,this.hint="",this.hintPlacement="below",this.hintId=`esp-form-item-hint-${++y}`,this.managedHintEl=null,this.managedHintMutationInProgress=!1,this.managedHintRecoveryQueued=!1,this.appliedHintTokens=[],this.hintContentObserver=new MutationObserver(()=>{this.syncFieldDescribedBy()}),this._error="",this._warning="",this.fieldName="",this.helpUrl="",this.helpTitleSource="field",this._errorPool=[],this.handleFieldSlotChange=()=>{this.fieldReconcileQueued||(this.fieldReconcileQueued=!0,queueMicrotask(()=>{this.fieldReconcileQueued=!1,this.isConnected&&this.reconcileFieldSlot()}))},this.handleHintSlotChange=()=>{if(!this.managedHintMutationInProgress){if(this.hint&&this.consumerHintElements().length===0&&this.managedHintEl&&this.managedHintEl.parentElement!==this){this.managedHintRecoveryQueued||(this.managedHintRecoveryQueued=!0,queueMicrotask(()=>{this.managedHintRecoveryQueued=!1,this.syncManagedHint(),this.observeConsumerHintContent(),this.requestUpdate(),this.syncFieldDescribedBy()}));return}this.syncManagedHint(),this.observeConsumerHintContent(),this.requestUpdate(),this.syncFieldDescribedBy()}}}get hasHint(){return!!this.hint||this.consumerHintElements().length>0}consumerHintElements(){return[...this.children].filter(e=>e.slot==="hint"&&!e.hasAttribute("data-esp-managed-hint"))}get error(){return this._error}set error(e){this._setError(e,"manual")}_setError(e,t){t!=="native"&&this.clearPendingNativeError();const i=this._error;this._error=e,this._errorSource=t,this.requestUpdate("error",i)}get warning(){return this._warning}set warning(e){const t=this._warning;this._warning=e,this.requestUpdate("warning",t)}get errorPool(){return this._errorPool}set errorPool(e){const t=this._errorPool;this._errorPool=e,this.requestUpdate("errorPool",t);const i=e.filter(n=>n.fieldName===this.fieldName);if(i.length===0){this._errorSource==="pool"&&this._setError("","pool");return}this._setError(i[0].errorMessage,"pool")}firstUpdated(){this.reconcileFieldSlot(),this.autofocus&&this.focus()}updated(e){super.updated(e),(e.has("hint")||e.has("hintPlacement"))&&(this.syncManagedHint(),this.syncFieldDescribedBy()),e.has("label")&&this.syncFieldLabel(),e.has("fieldName")&&this.syncFieldName()}reconcileFieldSlot(){const e=this.fieldSlot.value?.assignedElements()??[];if(e.length!==1||!(e[0]instanceof HTMLElement))throw(!this.fieldElement||!e.includes(this.fieldElement))&&this.unbindField(),new Error("esp-form-item requires exactly one slotted element.");this.bindField(e[0])}bindField(e){if(this.syncManagedHint(),this.fieldElement!==e||a.get(e)?.owner!==this){const i=a.get(e)?.owner;i&&i!==this&&i.unbindField(e),this.unbindField(),this.fieldElement=e,a.set(e,{owner:this,originalName:e.getAttribute("name"),appliedName:null});const n=this.pendingNativeError;if(this.clearPendingNativeError(),n?.field===e){const r=e;r.validate?.();const h=typeof r.checkValidity=="function",d=r.checkValidity?.(),u=e.validity?.valid,f=E.get(e);(h?d===!1:u!==void 0?u===!1:f===void 0||f.valid===!1)&&this._errorSource!=="native"&&this._setError(n.message,"native")}e.addEventListener("invalid",this.handleFieldInvalid)}this.syncFieldName(),this.syncFieldDescribedBy(),this.syncFieldLabel(),this.syncHelpPlacementTarget();const t=e.localName;t.includes("-")&&!window.customElements.get(t)&&window.customElements.whenDefined(t).then(()=>{this.fieldElement!==e||a.get(e)?.owner!==this||this.fieldSlot.value?.assignedElements()[0]!==e||(this.syncFieldDescribedBy(),this.syncFieldLabel())})}unbindField(e=this.fieldElement){if(!e)return;e.removeEventListener("invalid",this.handleFieldInvalid);const t=a.get(e);if(t?.owner===this&&(this.removeFieldDescription(e),e.setFormItemLabel?.(null),this.restoreFieldName(e,t),a.delete(e)),this.fieldElement===e){if(this._errorSource==="native"){const i={field:e,message:this._error};this._setError("","manual"),this.pendingNativeError=i,this.pendingNativeErrorTimer=setTimeout(()=>{this.pendingNativeError===i&&this.clearPendingNativeError()})}this.fieldElement=void 0,this.appliedHintTokens=[],this.syncHelpPlacementTarget()}}clearPendingNativeError(){this.pendingNativeErrorTimer!==null&&(clearTimeout(this.pendingNativeErrorTimer),this.pendingNativeErrorTimer=null),this.pendingNativeError=null}restoreFieldName(e,t){if(t.appliedName!==null){if(e.getAttribute("name")!==t.appliedName){t.appliedName=null;return}t.originalName===null?e.removeAttribute("name"):e.setAttribute("name",t.originalName),t.appliedName=null}}syncFieldName(){const e=this.fieldElement;if(!e)return;const t=a.get(e);if(t?.owner===this){if(!this.fieldName){this.restoreFieldName(e,t);return}t.appliedName!==null&&e.getAttribute("name")!==t.appliedName&&(t.appliedName=null),t.appliedName===null&&(t.originalName=e.getAttribute("name")),e.setAttribute("name",this.fieldName),t.appliedName=this.fieldName}}syncHelpPlacementTarget(){const e=this.shadowRoot?.querySelector("esp-help-button");e&&(e.placementTarget=this.fieldElement)}connectedCallback(){super.connectedCallback(),this.addEventListener(g,this.handleValidityChanged),this.observeConsumerHintContent(),this.hasUpdated&&this.handleFieldSlotChange()}disconnectedCallback(){this.removeEventListener(g,this.handleValidityChanged),this.unbindField(),this.hintContentObserver.disconnect(),super.disconnectedCallback()}observeConsumerHintContent(){this.hintContentObserver.disconnect();for(const e of this.consumerHintElements())this.hintContentObserver.observe(e,{attributes:!0,attributeFilter:["id"],characterData:!0,childList:!0,subtree:!0})}syncManagedHint(){if(!(!!this.hint&&this.consumerHintElements().length===0)){this.managedHintMutationInProgress=!0;try{this.managedHintEl?.remove()}finally{this.managedHintMutationInProgress=!1}this.managedHintEl=null;return}if(!this.managedHintEl){const t=document.createElement("span");t.slot="hint",t.id=this.hintId,t.toggleAttribute("data-esp-managed-hint",!0),this.managedHintEl=t}if(this.managedHintEl.parentElement!==this){this.managedHintMutationInProgress=!0;try{this.appendChild(this.managedHintEl)}finally{this.managedHintMutationInProgress=!1}}this.managedHintEl.textContent=this.hint}hintDescriptionIds(){return this.managedHintEl?[this.managedHintEl.id]:this.consumerHintElements().map(e=>(e.id||(e.id=`esp-form-item-hint-${++y}`),e.id))}hintDescriptionText(){if(!this.hasHint)return null;if(this.managedHintEl)return this.managedHintEl.textContent??"";const e=this.consumerHintElements();return e.length===0?this.hint:e.map(t=>t.textContent?.trim()??"").filter(Boolean).join(" ")}syncFieldDescribedBy(){const e=this.fieldElement;if(!e)return;const t=this.hasHint?this.hintDescriptionIds():[],n=v(e).filter(r=>!this.appliedHintTokens.includes(r));this.appliedHintTokens=t.filter(r=>!n.includes(r)),b(e,[...n,...t],{deduplicate:!0}),e.setFormItemDescription?.(this.hintDescriptionText())}removeFieldDescription(e){const t=v(e).filter(i=>!this.appliedHintTokens.includes(i));b(e,t,{deduplicate:!0}),this.appliedHintTokens=[],e.setFormItemDescription?.(null)}syncFieldLabel(){this.fieldElement?.setFormItemLabel?.(this.label.trim()||null)}focus(e){const t=this.fieldSlot.value?.assignedElements()??[];(t.length===1&&t[0]instanceof HTMLElement?t[0]:this.fieldElement)?.focus(e)}renderHint(){return p`
-      <div class="hint" aria-hidden=${this.hintPlacement==="above"?"true":m}>
+var l=function(m,e,t,i){var r=arguments.length,s=r<3?e:i===null?i=Object.getOwnPropertyDescriptor(e,t):i,a;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")s=Reflect.decorate(m,e,t,i);else for(var d=m.length-1;d>=0;d--)(a=m[d])&&(s=(r<3?a(s):r>3?a(e,t,s):a(e,t))||s);return r>3&&s&&Object.defineProperty(e,t,s),s};import{LitElement as H,css as F,html as u,nothing as c}from"lit";import{customElement as k,property as o}from"lit/decorators.js";import{classMap as C}from"lit/directives/class-map.js";import{createRef as N,ref as _}from"lit/directives/ref.js";import{VALIDITY_CHANGED_EVENT as v}from"../shared/validation.js";import"../help/esp-help-button.js";import{resolveHelpTarget as M}from"../help/help-document.js";import{describedByTokens as b,setDescribedByTokens as y}from"../shared/aria-describedby.js";import{srOnly as I}from"../shared/style-fragments.js";import{ESP_EVENTS as p}from"../shared/events.js";let E=0,T=0;const h=new WeakMap,w=new WeakMap;let n=class extends H{constructor(){super(...arguments),this.fieldSlot=N(),this.fieldReconcileQueued=!1,this.pendingNativeError=null,this.pendingNativeErrorTimer=null,this.handleValidityChanged=e=>{const t=this.fieldElement;if(!t||!e.composedPath().includes(t))return;const i=e.detail;w.set(t,{valid:i.valid}),!(this._errorSource==="pool"&&this._error.length>0)&&(i.valid?this._errorSource==="native"&&this._setError("","manual"):this._setError(i.message,"native"))},this.handleFieldValueChanged=e=>{const t=this.fieldElement;if(!t||e.target!==t)return;const i=this.errorAssignmentsAtChange!==this.errorAssignments;if(this.errorAssignmentsAtChange=-1,i)return;t.constructor.clearsFormItemErrorOnChange&&this._error&&this._errorSource!=="native"&&(this._setError("","manual"),t.validate?.())},this.errorAssignments=0,this.errorAssignmentsAtChange=-1,this.captureFieldValueChanged=e=>{e.target===this.fieldElement&&(this.errorAssignmentsAtChange=this.errorAssignments)},this.handleFieldInvalid=e=>{if(e.preventDefault(),this._errorSource==="pool"&&this._error.length>0)return;const t=e.currentTarget;t===this.fieldElement&&"validationMessage"in t&&this._setError(t.validationMessage,"native")},this._errorSource="manual",this.label="",this.autofocus=!1,this.hint="",this.hintPlacement="below",this.hintId=`esp-form-item-hint-${++E}`,this.managedHintEl=null,this.managedHintMutationInProgress=!1,this.managedHintRecoveryQueued=!1,this.appliedHintTokens=[],this.messageId=`esp-form-item-message-${++T}`,this.managedMessageEl=null,this.invalidField=null,this.announcement="",this.silentRestoreMessage=null,this.hintContentObserver=new MutationObserver(()=>{this.syncFieldDescribedBy()}),this._error="",this._warning="",this.fieldName="",this.helpUrl="",this.helpTitleSource="field",this._errorPool=[],this.handleFieldSlotChange=()=>{this.fieldReconcileQueued||(this.fieldReconcileQueued=!0,queueMicrotask(()=>{this.fieldReconcileQueued=!1,this.isConnected&&this.reconcileFieldSlot()}))},this.handleHintSlotChange=()=>{if(!this.managedHintMutationInProgress){if(this.hint&&this.consumerHintElements().length===0&&this.managedHintEl&&this.managedHintEl.parentElement!==this){this.managedHintRecoveryQueued||(this.managedHintRecoveryQueued=!0,queueMicrotask(()=>{this.managedHintRecoveryQueued=!1,this.syncManagedHint(),this.observeConsumerHintContent(),this.requestUpdate(),this.syncFieldDescribedBy()}));return}this.syncManagedHint(),this.observeConsumerHintContent(),this.requestUpdate(),this.syncFieldDescribedBy()}}}get hasHint(){return!!this.hint||this.consumerHintElements().length>0}consumerHintElements(){return[...this.children].filter(e=>e.slot==="hint"&&!e.hasAttribute("data-esp-managed-hint"))}get error(){return this._error}set error(e){e&&this.errorAssignments++,this._setError(e??"","manual")}_setError(e,t){t!=="native"&&this.clearPendingNativeError();const i=this._error;this._error=e,this._errorSource=t,this.requestUpdate("error",i)}get warning(){return this._warning}set warning(e){const t=this._warning;this._warning=e??"",this.requestUpdate("warning",t)}get errorPool(){return this._errorPool}set errorPool(e){const t=this._errorPool;this._errorPool=e,this.requestUpdate("errorPool",t);const i=e.filter(r=>r.fieldName===this.fieldName);if(i.length===0){this._errorSource==="pool"&&this._setError("","pool");return}this.errorAssignments++,this._setError(i[0].errorMessage,"pool")}firstUpdated(){this.reconcileFieldSlot(),this.autofocus&&this.focus()}willUpdate(e){if(super.willUpdate(e),this.label??="",e.has("error")){const t=e.get("error")??"",i=this.silentRestoreMessage!==null&&this.error===this.silentRestoreMessage;if(this.silentRestoreMessage=null,!this.error)this.announcement="";else if(this.error!==t&&!i){const r=this.label.trim();this.announcement=r?`${r}: ${this.error}`:this.error}}}updated(e){super.updated(e),(e.has("error")||e.has("warning"))&&(this.syncFieldDescribedBy(),this.syncFieldInvalid()),(e.has("hint")||e.has("hintPlacement"))&&(this.syncManagedHint(),this.syncFieldDescribedBy()),e.has("label")&&this.syncFieldLabel(),e.has("fieldName")&&this.syncFieldName()}reconcileFieldSlot(){const e=this.fieldSlot.value?.assignedElements()??[];if(e.length!==1||!(e[0]instanceof HTMLElement))throw(!this.fieldElement||!e.includes(this.fieldElement))&&this.unbindField(),new Error("esp-form-item requires exactly one slotted element.");this.bindField(e[0])}bindField(e){if(this.syncManagedHint(),this.fieldElement!==e||h.get(e)?.owner!==this){const i=h.get(e)?.owner;i&&i!==this&&i.unbindField(e),this.unbindField(),this.fieldElement=e,h.set(e,{owner:this,originalName:e.getAttribute("name"),appliedName:null});const r=this.pendingNativeError;if(this.clearPendingNativeError(),r?.field===e){const s=e;this.silentRestoreMessage=r.message,s.validate?.();const a=typeof s.checkValidity=="function",d=s.checkValidity?.(),g=e.validity?.valid,f=w.get(e);(a?d===!1:g!==void 0?g===!1:f===void 0||f.valid===!1)&&this._errorSource!=="native"&&this._setError(r.message,"native"),this._error!==r.message&&(this.silentRestoreMessage=null)}e.addEventListener("invalid",this.handleFieldInvalid)}this.syncFieldName(),this.syncFieldDescribedBy(),this.syncFieldLabel(),this.syncFieldInvalid(),this.syncHelpPlacementTarget();const t=e.localName;t.includes("-")&&!window.customElements.get(t)&&window.customElements.whenDefined(t).then(()=>{this.fieldElement!==e||h.get(e)?.owner!==this||this.fieldSlot.value?.assignedElements()[0]!==e||(this.syncFieldDescribedBy(),this.syncFieldLabel(),this.syncFieldInvalid())})}unbindField(e=this.fieldElement){if(!e)return;e.removeEventListener("invalid",this.handleFieldInvalid);const t=h.get(e);if(t?.owner===this&&(this.removeFieldDescription(e),this.removeFieldInvalid(e),e.setFormItemLabel?.(null),this.restoreFieldName(e,t),h.delete(e)),this.fieldElement===e){if(this._errorSource==="native"){const i={field:e,message:this._error};this._setError("","manual"),this.pendingNativeError=i,this.pendingNativeErrorTimer=setTimeout(()=>{this.pendingNativeError===i&&this.clearPendingNativeError()})}this.fieldElement=void 0,this.appliedHintTokens=[],this.syncHelpPlacementTarget()}}clearPendingNativeError(){this.pendingNativeErrorTimer!==null&&(clearTimeout(this.pendingNativeErrorTimer),this.pendingNativeErrorTimer=null),this.pendingNativeError=null}restoreFieldName(e,t){if(t.appliedName!==null){if(e.getAttribute("name")!==t.appliedName){t.appliedName=null;return}t.originalName===null?e.removeAttribute("name"):e.setAttribute("name",t.originalName),t.appliedName=null}}syncFieldName(){const e=this.fieldElement;if(!e)return;const t=h.get(e);if(t?.owner===this){if(!this.fieldName){this.restoreFieldName(e,t);return}t.appliedName!==null&&e.getAttribute("name")!==t.appliedName&&(t.appliedName=null),t.appliedName===null&&(t.originalName=e.getAttribute("name")),e.setAttribute("name",this.fieldName),t.appliedName=this.fieldName}}syncHelpPlacementTarget(){const e=this.shadowRoot?.querySelector("esp-help-button");e&&(e.placementTarget=this.fieldElement)}connectedCallback(){super.connectedCallback(),this.addEventListener(v,this.handleValidityChanged),this.addEventListener(p.VALUE_CHANGED,this.captureFieldValueChanged,!0),this.addEventListener(p.VALUE_CHANGED,this.handleFieldValueChanged),this.observeConsumerHintContent(),this.hasUpdated&&this.handleFieldSlotChange()}disconnectedCallback(){this.removeEventListener(v,this.handleValidityChanged),this.removeEventListener(p.VALUE_CHANGED,this.captureFieldValueChanged,!0),this.removeEventListener(p.VALUE_CHANGED,this.handleFieldValueChanged),this.unbindField(),this.hintContentObserver.disconnect(),super.disconnectedCallback()}observeConsumerHintContent(){this.hintContentObserver.disconnect();for(const e of this.consumerHintElements())this.hintContentObserver.observe(e,{attributes:!0,attributeFilter:["id"],characterData:!0,childList:!0,subtree:!0})}syncManagedHint(){if(!(!!this.hint&&this.consumerHintElements().length===0)){this.managedHintMutationInProgress=!0;try{this.managedHintEl?.remove()}finally{this.managedHintMutationInProgress=!1}this.managedHintEl=null;return}if(!this.managedHintEl){const t=document.createElement("span");t.slot="hint",t.id=this.hintId,t.toggleAttribute("data-esp-managed-hint",!0),this.managedHintEl=t}if(this.managedHintEl.parentElement!==this){this.managedHintMutationInProgress=!0;try{this.appendChild(this.managedHintEl)}finally{this.managedHintMutationInProgress=!1}}this.managedHintEl.textContent=this.hint}hintDescriptionIds(){return this.managedHintEl?[this.managedHintEl.id]:this.consumerHintElements().map(e=>(e.id||(e.id=`esp-form-item-hint-${++E}`),e.id))}hintDescriptionText(){if(!this.hasHint)return null;if(this.managedHintEl)return this.managedHintEl.textContent??"";const e=this.consumerHintElements();return e.length===0?this.hint:e.map(t=>t.textContent?.trim()??"").filter(Boolean).join(" ")}syncFieldDescribedBy(){const e=this.fieldElement;if(!e)return;const i=[...this.hasHint?this.hintDescriptionIds():[],...this.syncManagedMessage()],s=b(e).filter(a=>!this.appliedHintTokens.includes(a));this.appliedHintTokens=i.filter(a=>!s.includes(a)),y(e,[...s,...i],{deduplicate:!0}),e.setFormItemDescription?.(this.fieldDescriptionText())}get message(){return this.error||this.warning}fieldDescriptionText(){const e=[this.hintDescriptionText(),this.message].filter(t=>!!t);return e.length>0?e.join(" "):null}syncManagedMessage(){if(!this.message)return this.managedMessageEl?.remove(),this.managedMessageEl=null,[];if(!this.managedMessageEl){const e=document.createElement("span");e.id=this.messageId,e.slot="esp-form-item-message",e.hidden=!0,e.toggleAttribute("data-esp-managed-message",!0),this.managedMessageEl=e}return this.managedMessageEl.parentElement!==this&&this.appendChild(this.managedMessageEl),this.managedMessageEl.textContent=this.message,[this.messageId]}syncFieldInvalid(){const e=this.fieldElement;if(!e||h.get(e)?.owner!==this)return;const t=this.error.length>0,i=e;if(typeof i.setFormItemInvalid=="function"){this.invalidField===e&&(e.getAttribute("aria-invalid")==="true"&&e.removeAttribute("aria-invalid"),this.invalidField=null),i.setFormItemInvalid(t);return}t?this.invalidField!==e&&!e.hasAttribute("aria-invalid")&&(e.setAttribute("aria-invalid","true"),this.invalidField=e):this.removeFieldInvalid(e)}removeFieldInvalid(e){e.setFormItemInvalid?.(!1),this.invalidField===e&&(e.getAttribute("aria-invalid")==="true"&&e.removeAttribute("aria-invalid"),this.invalidField=null)}removeFieldDescription(e){const t=b(e).filter(i=>!this.appliedHintTokens.includes(i));y(e,t,{deduplicate:!0}),this.appliedHintTokens=[],e.setFormItemDescription?.(null)}syncFieldLabel(){this.fieldElement?.setFormItemLabel?.(this.label.trim()||null)}focus(e){const t=this.fieldSlot.value?.assignedElements()??[];(t.length===1&&t[0]instanceof HTMLElement?t[0]:this.fieldElement)?.focus(e)}renderHint(){return u`
+      <div class="hint" aria-hidden=${this.hintPlacement==="above"?"true":c}>
         <slot name="hint" @slotchange=${this.handleHintSlotChange}></slot>
       </div>
-    `}render(){const e=T(this,{helpUrl:this.helpUrl,fallbackAnchor:this.fieldName}),t=!!e?.anchor,i={"form-item":!0,"has-hint":this.hasHint,"has-help":t,"hint-above":this.hasHint&&this.hintPlacement==="above","has-error":this.error.length>0,"has-warning":this.warning.length>0&&this.error.length===0};return p`
-      <div class=${N(i)}>
+    `}render(){const e=M(this,{helpUrl:this.helpUrl,fallbackAnchor:this.fieldName}),t=!!e?.anchor,i={"form-item":!0,"has-hint":this.hasHint,"has-help":t,"hint-above":this.hasHint&&this.hintPlacement==="above","has-error":this.error.length>0,"has-warning":this.warning.length>0&&this.error.length===0};return u`
+      <div class=${C(i)}>
         <div class="field-shell">
           <label
-            @click=${n=>{this.focus(),n.stopPropagation()}}
+            @click=${r=>{this.focus(),r.stopPropagation()}}
           >
             <span class="field-label">${this.label}</span>
-            ${this.hintPlacement==="above"?this.renderHint():m}
+            ${this.hintPlacement==="above"?this.renderHint():c}
             <slot ${_(this.fieldSlot)} @slotchange=${this.handleFieldSlotChange}></slot>
           </label>
-          ${e?.anchor?p`
+          ${e?.anchor?u`
                 <esp-help-button
                   class="field-help"
                   help-url=${e.href}
@@ -20,9 +20,9 @@ var l=function(c,e,t,i){var n=arguments.length,r=n<3?e:i===null?i=Object.getOwnP
                   .helpTitle=${this.helpTitleSource==="document"?"":this.label.trim()}
                   .placementTarget=${this.fieldElement}
                 ></esp-help-button>
-              `:m}
+              `:c}
         </div>
-        ${this.hintPlacement!=="above"?this.renderHint():m}
+        ${this.hintPlacement!=="above"?this.renderHint():c}
         <div class="error-message">
           <span>${this.error}</span>
         </div>
@@ -30,7 +30,12 @@ var l=function(c,e,t,i){var n=arguments.length,r=n<3?e:i===null?i=Object.getOwnP
           <span>${this.warning}</span>
         </div>
       </div>
-    `}};s.styles=w`
+      <div class="sr-only" role="status">${this.announcement}</div>
+      
+      <slot class="sr-only" name="esp-form-item-message"></slot>
+    `}};n.styles=F`
+    ${I}
+
     .form-item {
       font-family: var(
         --esp-form-item-font,
@@ -197,4 +202,4 @@ var l=function(c,e,t,i){var n=arguments.length,r=n<3?e:i===null?i=Object.getOwnP
         }
       }
     }
-  `,l([o({type:String})],s.prototype,"label",void 0),l([o({type:Boolean,reflect:!0})],s.prototype,"autofocus",void 0),l([o({type:String})],s.prototype,"hint",void 0),l([o({attribute:"hint-placement",type:String})],s.prototype,"hintPlacement",void 0),l([o({type:String})],s.prototype,"error",null),l([o({type:String})],s.prototype,"warning",null),l([o({attribute:"field-name",type:String})],s.prototype,"fieldName",void 0),l([o({attribute:"help-url",type:String})],s.prototype,"helpUrl",void 0),l([o({attribute:"help-title-source",type:String})],s.prototype,"helpTitleSource",void 0),l([o({attribute:"error-pool",type:Array})],s.prototype,"errorPool",null),s=l([k("esp-form-item")],s);export{s as EspalierFormItem};
+  `,l([o({type:String})],n.prototype,"label",void 0),l([o({type:Boolean,reflect:!0})],n.prototype,"autofocus",void 0),l([o({type:String})],n.prototype,"hint",void 0),l([o({attribute:"hint-placement",type:String})],n.prototype,"hintPlacement",void 0),l([o({type:String})],n.prototype,"error",null),l([o({type:String})],n.prototype,"warning",null),l([o({attribute:"field-name",type:String})],n.prototype,"fieldName",void 0),l([o({attribute:"help-url",type:String})],n.prototype,"helpUrl",void 0),l([o({attribute:"help-title-source",type:String})],n.prototype,"helpTitleSource",void 0),l([o({attribute:"error-pool",type:Array})],n.prototype,"errorPool",null),n=l([k("esp-form-item")],n);export{n as EspalierFormItem};

package/dist/image/esp-image.d.ts

@@ -1,6 +1,7 @@
 import { type PropertyValues } from "lit";
 import { EspalierElementBase } from "../shared/esp-element-base.js";
 import { type FocusPoint } from "./image-focus.js";
+import { parseImageRatio } from "./image-ratio.js";
 import "./esp-image-option.js";
 export type ImageScrim = "auto" | "none" | "flat" | "top" | "bottom" | "left" | "right" | "radial";
 export type ImageScrimStrength = "soft" | "medium" | "strong";
@@ -9,8 +10,7 @@ export type ImageTexture = "none" | "dots" | "halftone" | "paper" | "grain" | "g
 export type ImageTextureScale = "fine" | "medium" | "coarse";
 export type ImageBannerScheme = "auto" | "light" | "dark";
 export type ImageContentPosition = "bottom-start" | "bottom" | "bottom-end" | "center" | "top-start" | "top" | "top-end";
-/** Resolve a supported CSS aspect-ratio string, or null when it is invalid. */
-export declare function parseImageRatio(value: string): string | null;
+export { parseImageRatio };
 /**
  * A responsive image with a native `<picture>` and an optional
  * focal-point-aware banner mode.

package/dist/image/esp-image.js

@@ -1,4 +1,4 @@
-var n=function(l,e,t,r){var i=arguments.length,a=i<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,o;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")a=Reflect.decorate(l,e,t,r);else for(var m=l.length-1;m>=0;m--)(o=l[m])&&(a=(i<3?o(a):i>3?o(e,t,a):o(e,t))||a);return i>3&&a&&Object.defineProperty(e,t,a),a},p;import{css as I,html as h,nothing as P}from"lit";import{customElement as E,property as c,state as u}from"lit/decorators.js";import{EspalierElementBase as v}from"../shared/esp-element-base.js";import{slotHasContent as y}from"../shared/slot-content.js";import{renderVisualOverlay as $,visualOverlayStyles as A}from"../shared/visual-overlay.js";import{focusConverter as N,normalizeFocus as W}from"./image-focus.js";import{ensureImageTextureFilters as D,imageTextureFilterId as M}from"./image-texture-filters.js";import{getImageTexture as b,isBuiltInImageTexture as x,subscribeToImageTextureRegistry as B}from"../shared/image-texture-registry.js";import{validImageDimensions as _}from"./image-dimensions.js";import{isMeasuredScrim as q,scrimReach as H,unionScrimBox as U}from"./scrim-reach.js";import"./esp-image-option.js";const k=new Set(["auto","none","flat","top","bottom","left","right","radial"]),w=new Set(["soft","medium","strong"]),S=new Set(["none","flush"]),z=new Set(["fine","medium","coarse"]),O=new Set(["auto","light","dark"]),j=new Set(["bottom-start","bottom","bottom-end","center","top-start","top","top-end"]);function d(l,e){return{fromAttribute(t){return t&&l.has(t)?t:e},toAttribute(t){return l.has(t)?t:e}}}function R(l){const e=l.trim();if(!e)return null;const t=e.split("/").map(i=>i.trim());if(t.length>2||t.some(i=>i.length===0))return null;const r=t.map(Number);return r.some(i=>!Number.isFinite(i)||i<=0)?null:r.length===1?String(r[0]):`${r[0]} / ${r[1]}`}function T(l){const e=[];for(const t of l)getComputedStyle(t).display==="contents"?e.push(...T(t.children)):e.push(t);return e}function F(l){const e=l.getBoundingClientRect();if(e.width>0||e.height>0)return e;const t=l.ownerDocument.createRange();t.selectNodeContents(l);const r=t.getBoundingClientRect();return r.width>0||r.height>0?r:null}let s=p=class extends v{constructor(){super(...arguments),this.originalHeight=0,this.originalWidth=0,this.imageUrl="",this.localImage="",this.caption="",this.sizes="100vw",this.loading="eager",this.deferOffscreen=!1,this.banner=!1,this.bannerScheme="auto",this.scrim="auto",this.scrimStrength="medium",this.scrimEdge="none",this.texture="none",this.textureScale="medium",this.contentPosition="bottom-start",this.focusPoint={x:.5,y:.5},this.ratio="",this.compactRatio="",this.renderedWidth=0,this.measuredWidth=0,this.compact=!1,this.overlayHasContent=!1,this.resizeObserver=null,this.scrimObserver=null,this.appliedScrimReach=0,this.offscreenObserver=null,this.offscreenAdmitted=!1,this.deferredProjectedImage=null,this.unsubscribeTextures=null,this.handleSlotChange=e=>{if(e.target instanceof HTMLSlotElement){if(e.target.name==="overlay"){const t=y(e.target);t!==this.overlayHasContent&&(this.overlayHasContent=t),this.observeScrimTargets();return}this.requestUpdate()}}}get isPortrait(){const e=_(this.originalWidth,this.originalHeight);return e!==null&&e.height>e.width}findProjected(){for(const e of this.children)if(e.tagName==="PICTURE"||e.tagName==="IMG")return e;return null}findProjectedImage(e=this.findProjected()){return e?e.tagName==="IMG"?e:e.querySelector("img"):null}requiresOffscreenDeferral(e=this.findProjectedImage()){return this.deferOffscreen&&e?.getAttribute("loading")?.toLowerCase()==="lazy"}shouldDeferProjectedSizes(){return this.requiresOffscreenDeferral()&&!this.offscreenAdmitted}applyMeasuredWidth(){this.measuredWidth>0&&this.measuredWidth!==this.renderedWidth&&(this.renderedWidth=this.measuredWidth)}syncOffscreenDeferral(){const e=this.findProjectedImage();if(e!==this.deferredProjectedImage&&(this.offscreenAdmitted=!1,this.offscreenObserver?.disconnect(),this.offscreenObserver=null,this.deferredProjectedImage=e),!this.requiresOffscreenDeferral(e)){this.offscreenObserver?.disconnect(),this.offscreenObserver=null,this.offscreenAdmitted=!1,this.deferredProjectedImage=null,this.applyMeasuredWidth();return}if(!this.offscreenAdmitted){if(typeof IntersectionObserver>"u"){this.offscreenAdmitted=!0,this.applyMeasuredWidth();return}if(!this.offscreenObserver){const t=e,r=new IntersectionObserver(i=>{if(this.offscreenObserver===r){if(this.findProjectedImage()!==t){this.syncOffscreenDeferral();return}i.some(a=>a.isIntersecting)&&(this.offscreenAdmitted=!0,this.offscreenObserver?.disconnect(),this.offscreenObserver=null,this.applyMeasuredWidth(),this.requestUpdate())}},{rootMargin:"200px"});this.offscreenObserver=r}this.offscreenObserver.observe(this)}}connectedCallback(){super.connectedCallback(),p.ensureProjectionStyles(this.getRootNode()),this.unsubscribeTextures??=B(()=>this.requestUpdate()),this.resizeObserver??=new ResizeObserver(e=>{const t=e[0]?.contentBoxSize?.[0],r=Math.round(t?t.inlineSize:e[0]?.contentRect.width??0);r<=0||(this.measuredWidth=r,this.syncOffscreenDeferral(),this.applyMeasuredWidth())}),this.resizeObserver.observe(this),this.syncOffscreenDeferral(),this.hasUpdated&&this.observeScrimTargets()}disconnectedCallback(){super.disconnectedCallback(),this.unsubscribeTextures?.(),this.unsubscribeTextures=null,this.resizeObserver?.disconnect(),this.resizeObserver=null,this.scrimObserver?.disconnect(),this.scrimObserver=null,this.offscreenObserver?.disconnect(),this.offscreenObserver=null,this.offscreenAdmitted=!1,this.deferredProjectedImage=null}observeScrimTargets(){if(!this.shadowRoot)return;this.scrimObserver??=new ResizeObserver(()=>this.measureScrimReach()),this.scrimObserver.disconnect();const e=this.shadowRoot?.querySelector(".overlay");e&&this.scrimObserver.observe(e);const t=this.shadowRoot?.querySelector('[part="scrim"]');t&&this.scrimObserver.observe(t);for(const r of T(this.overlayElements()))this.scrimObserver.observe(r,{box:"border-box"})}overlayElements(){return this.shadowRoot?.querySelector('slot[name="overlay"]')?.assignedElements({flatten:!0})??[]}measureScrimReach(){const e=this.shadowRoot?.querySelector(".frame");if(!e)return;const t=this.resolvedScrim();let r=0;const i=this.shadowRoot?.querySelector('[part="scrim"]');if(this.banner&&this.overlayHasContent&&i&&q(t)){const a=i.getBoundingClientRect();if(a.width<=0||a.height<=0)return;const o=U(this.overlayElements().map(F));r=H(t,a,o)}r!==this.appliedScrimReach&&(this.appliedScrimReach=r,r>0?e.style.setProperty("--_esp-image-scrim-reach",`${r}%`):e.style.removeProperty("--_esp-image-scrim-reach"))}effectiveSizes(){return this.renderedWidth>0?`${this.renderedWidth}px`:this.sizes}buildSources(){const e=new Map;for(const t of this.querySelectorAll("esp-image-option")){const r=t.getAttribute("url"),i=Number(t.getAttribute("width"));if(!r||!Number.isFinite(i)||i<=0)continue;const a=t.getAttribute("type")??"",o=e.get(a)??[];o.push({url:r,width:i}),e.set(a,o)}return Array.from(e,([t,r])=>({type:t,srcset:r.sort((i,a)=>i.width-a.width).map(i=>`${i.url} ${i.width}w`).join(", ")})).filter(t=>t.srcset.length>0)}resolvedBannerScheme(){return this.bannerScheme!=="auto"?this.bannerScheme:this.scheme==="dark"?"dark":"light"}resolvedTexture(){return x(this.texture)?this.texture:b(this.texture)?this.texture:"none"}resolvedScrim(){return this.scrim!=="auto"?this.scrim:this.overlayHasContent?this.contentPosition.startsWith("top")?"top":this.contentPosition.startsWith("bottom")?"bottom":"radial":"none"}resolvedAspectRatio(){const e=_(this.originalWidth,this.originalHeight);if(!this.banner)return e?`${e.width} / ${e.height}`:null;const t=R(this.ratio);return(this.compact?R(this.compactRatio):null)??t??(e?`${e.width} / ${e.height}`:null)}normalizeEnums(e){e.has("scrim")&&!k.has(this.scrim)&&(this.scrim="auto"),e.has("bannerScheme")&&!O.has(this.bannerScheme)&&(this.bannerScheme="auto"),e.has("scrimStrength")&&!w.has(this.scrimStrength)&&(this.scrimStrength="medium"),e.has("scrimEdge")&&!S.has(this.scrimEdge)&&(this.scrimEdge="none"),e.has("textureScale")&&!z.has(this.textureScale)&&(this.textureScale="medium"),e.has("contentPosition")&&!j.has(this.contentPosition)&&(this.contentPosition="bottom-start")}willUpdate(e){super.willUpdate(e),this.normalizeEnums(e);const t=W(this.focusPoint),r=Number((t.x*100).toFixed(4)),i=Number((t.y*100).toFixed(4));this.style.setProperty("--_esp-image-object-position",`${r}% ${i}%`);const a=this.resolvedAspectRatio();a?this.style.setProperty("--_esp-image-aspect-ratio",a):this.style.removeProperty("--_esp-image-aspect-ratio");const o=this.resolvedTexture();if(["paper","grain","grunge"].includes(o)){const g=o==="grunge"&&this.resolvedBannerScheme()==="light"?"grunge-light":o;this.style.setProperty("--_esp-image-texture-filter",`url(#${M(g,this.textureScale)})`)}else this.style.removeProperty("--_esp-image-texture-filter");const m=x(o)?void 0:b(o),C=[["--_esp-image-registered-image",m?.image],["--_esp-image-registered-size",m?.size],["--_esp-image-registered-repeat",m?.repeat],["--_esp-image-registered-position",m?.position],["--_esp-image-registered-opacity",m?.opacity?.toString()],["--_esp-image-registered-blend-mode",m?.blendMode]];for(const[g,f]of C)f===void 0?this.style.removeProperty(g):this.style.setProperty(g,f)}firstUpdated(e){super.firstUpdated(e);const t=this.shadowRoot?.querySelector('slot[name="overlay"]');t&&(this.overlayHasContent=y(t)),this.observeScrimTargets()}updated(e){if(super.updated(e),this.syncOffscreenDeferral(),(e.has("banner")||e.has("scrim")||e.has("contentPosition")||e.has("overlayHasContent")||e.has("compact"))&&this.observeScrimTargets(),["paper","grain","grunge"].includes(this.resolvedTexture())&&this.renderRoot&&D(this.renderRoot),this.renderedWidth>0){const o=this.shadowRoot?.querySelector(".compact-sentinel")?.getBoundingClientRect().width??0,m=o>0&&this.renderedWidth<o;m!==this.compact&&(this.compact=m)}if(this.renderedWidth<=0||this.shouldDeferProjectedSizes())return;const t=this.findProjected();if(!t)return;const r=this.effectiveSizes();if(t.tagName==="PICTURE")for(const a of t.querySelectorAll("source"))a.setAttribute("sizes",r);const i=this.findProjectedImage(t);i?.hasAttribute("srcset")&&i.setAttribute("sizes",r)}renderMedia(){if(this.localImage)return h`<img
+var n=function(m,e,t,r){var s=arguments.length,a=s<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,o;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")a=Reflect.decorate(m,e,t,r);else for(var l=m.length-1;l>=0;l--)(o=m[l])&&(a=(s<3?o(a):s>3?o(e,t,a):o(e,t))||a);return s>3&&a&&Object.defineProperty(e,t,a),a},p;import{css as I,html as h,nothing as P}from"lit";import{customElement as E,property as c,state as u}from"lit/decorators.js";import{EspalierElementBase as y}from"../shared/esp-element-base.js";import{slotHasContent as b}from"../shared/slot-content.js";import{renderVisualOverlay as $,visualOverlayStyles as A}from"../shared/visual-overlay.js";import{focusConverter as N,normalizeFocus as W}from"./image-focus.js";import{ensureImageTextureFilters as D,imageTextureFilterId as M}from"./image-texture-filters.js";import{getImageTexture as x,isBuiltInImageTexture as _,subscribeToImageTextureRegistry as B}from"../shared/image-texture-registry.js";import{validImageDimensions as k}from"./image-dimensions.js";import{parseImageRatio as f}from"./image-ratio.js";import{isMeasuredScrim as q,scrimReach as H,unionScrimBox as U}from"./scrim-reach.js";import"./esp-image-option.js";import{enumConverter as d}from"../shared/enum-converter.js";const w=new Set(["auto","none","flat","top","bottom","left","right","radial"]),S=new Set(["soft","medium","strong"]),z=new Set(["none","flush"]),O=new Set(["fine","medium","coarse"]),j=new Set(["auto","light","dark"]),R=new Set(["bottom-start","bottom","bottom-end","center","top-start","top","top-end"]);function T(m){const e=[];for(const t of m)getComputedStyle(t).display==="contents"?e.push(...T(t.children)):e.push(t);return e}function F(m){const e=m.getBoundingClientRect();if(e.width>0||e.height>0)return e;const t=m.ownerDocument.createRange();t.selectNodeContents(m);const r=t.getBoundingClientRect();return r.width>0||r.height>0?r:null}let i=p=class extends y{constructor(){super(...arguments),this.originalHeight=0,this.originalWidth=0,this.imageUrl="",this.localImage="",this.caption="",this.sizes="100vw",this.loading="eager",this.deferOffscreen=!1,this.banner=!1,this.bannerScheme="auto",this.scrim="auto",this.scrimStrength="medium",this.scrimEdge="none",this.texture="none",this.textureScale="medium",this.contentPosition="bottom-start",this.focusPoint={x:.5,y:.5},this.ratio="",this.compactRatio="",this.renderedWidth=0,this.measuredWidth=0,this.compact=!1,this.overlayHasContent=!1,this.resizeObserver=null,this.scrimObserver=null,this.appliedScrimReach=0,this.offscreenObserver=null,this.offscreenAdmitted=!1,this.deferredProjectedImage=null,this.unsubscribeTextures=null,this.handleSlotChange=e=>{if(e.target instanceof HTMLSlotElement){if(e.target.name==="overlay"){const t=b(e.target);t!==this.overlayHasContent&&(this.overlayHasContent=t),this.observeScrimTargets();return}this.requestUpdate()}}}get isPortrait(){const e=k(this.originalWidth,this.originalHeight);return e!==null&&e.height>e.width}findProjected(){for(const e of this.children)if(e.tagName==="PICTURE"||e.tagName==="IMG")return e;return null}findProjectedImage(e=this.findProjected()){return e?e.tagName==="IMG"?e:e.querySelector("img"):null}requiresOffscreenDeferral(e=this.findProjectedImage()){return this.deferOffscreen&&e?.getAttribute("loading")?.toLowerCase()==="lazy"}shouldDeferProjectedSizes(){return this.requiresOffscreenDeferral()&&!this.offscreenAdmitted}applyMeasuredWidth(){this.measuredWidth>0&&this.measuredWidth!==this.renderedWidth&&(this.renderedWidth=this.measuredWidth)}syncOffscreenDeferral(){const e=this.findProjectedImage();if(e!==this.deferredProjectedImage&&(this.offscreenAdmitted=!1,this.offscreenObserver?.disconnect(),this.offscreenObserver=null,this.deferredProjectedImage=e),!this.requiresOffscreenDeferral(e)){this.offscreenObserver?.disconnect(),this.offscreenObserver=null,this.offscreenAdmitted=!1,this.deferredProjectedImage=null,this.applyMeasuredWidth();return}if(!this.offscreenAdmitted){if(typeof IntersectionObserver>"u"){this.offscreenAdmitted=!0,this.applyMeasuredWidth();return}if(!this.offscreenObserver){const t=e,r=new IntersectionObserver(s=>{if(this.offscreenObserver===r){if(this.findProjectedImage()!==t){this.syncOffscreenDeferral();return}s.some(a=>a.isIntersecting)&&(this.offscreenAdmitted=!0,this.offscreenObserver?.disconnect(),this.offscreenObserver=null,this.applyMeasuredWidth(),this.requestUpdate())}},{rootMargin:"200px"});this.offscreenObserver=r}this.offscreenObserver.observe(this)}}connectedCallback(){super.connectedCallback(),p.ensureProjectionStyles(this.getRootNode()),this.unsubscribeTextures??=B(()=>this.requestUpdate()),this.resizeObserver??=new ResizeObserver(e=>{const t=e[0]?.contentBoxSize?.[0],r=Math.round(t?t.inlineSize:e[0]?.contentRect.width??0);r<=0||(this.measuredWidth=r,this.syncOffscreenDeferral(),this.applyMeasuredWidth())}),this.resizeObserver.observe(this),this.syncOffscreenDeferral(),this.hasUpdated&&this.observeScrimTargets()}disconnectedCallback(){super.disconnectedCallback(),this.unsubscribeTextures?.(),this.unsubscribeTextures=null,this.resizeObserver?.disconnect(),this.resizeObserver=null,this.scrimObserver?.disconnect(),this.scrimObserver=null,this.offscreenObserver?.disconnect(),this.offscreenObserver=null,this.offscreenAdmitted=!1,this.deferredProjectedImage=null}observeScrimTargets(){if(!this.shadowRoot)return;this.scrimObserver??=new ResizeObserver(()=>this.measureScrimReach()),this.scrimObserver.disconnect();const e=this.shadowRoot?.querySelector(".overlay");e&&this.scrimObserver.observe(e);const t=this.shadowRoot?.querySelector('[part="scrim"]');t&&this.scrimObserver.observe(t);for(const r of T(this.overlayElements()))this.scrimObserver.observe(r,{box:"border-box"})}overlayElements(){return this.shadowRoot?.querySelector('slot[name="overlay"]')?.assignedElements({flatten:!0})??[]}measureScrimReach(){const e=this.shadowRoot?.querySelector(".frame");if(!e)return;const t=this.resolvedScrim();let r=0;const s=this.shadowRoot?.querySelector('[part="scrim"]');if(this.banner&&this.overlayHasContent&&s&&q(t)){const a=s.getBoundingClientRect();if(a.width<=0||a.height<=0)return;const o=U(this.overlayElements().map(F));r=H(t,a,o)}r!==this.appliedScrimReach&&(this.appliedScrimReach=r,r>0?e.style.setProperty("--_esp-image-scrim-reach",`${r}%`):e.style.removeProperty("--_esp-image-scrim-reach"))}effectiveSizes(){return this.renderedWidth>0?`${this.renderedWidth}px`:this.sizes}buildSources(){const e=new Map;for(const t of this.querySelectorAll("esp-image-option")){const r=t.getAttribute("url"),s=Number(t.getAttribute("width"));if(!r||!Number.isFinite(s)||s<=0)continue;const a=t.getAttribute("type")??"",o=e.get(a)??[];o.push({url:r,width:s}),e.set(a,o)}return Array.from(e,([t,r])=>({type:t,srcset:r.sort((s,a)=>s.width-a.width).map(s=>`${s.url} ${s.width}w`).join(", ")})).filter(t=>t.srcset.length>0)}resolvedBannerScheme(){return this.bannerScheme!=="auto"?this.bannerScheme:this.scheme==="dark"?"dark":"light"}resolvedTexture(){return _(this.texture)?this.texture:x(this.texture)?this.texture:"none"}resolvedScrim(){return this.scrim!=="auto"?this.scrim:this.overlayHasContent?this.contentPosition.startsWith("top")?"top":this.contentPosition.startsWith("bottom")?"bottom":"radial":"none"}resolvedAspectRatio(){const e=k(this.originalWidth,this.originalHeight);if(!this.banner)return e?`${e.width} / ${e.height}`:null;const t=f(this.ratio);return(this.compact?f(this.compactRatio):null)??t??(e?`${e.width} / ${e.height}`:null)}normalizeEnums(e){e.has("scrim")&&!w.has(this.scrim)&&(this.scrim="auto"),e.has("bannerScheme")&&!j.has(this.bannerScheme)&&(this.bannerScheme="auto"),e.has("scrimStrength")&&!S.has(this.scrimStrength)&&(this.scrimStrength="medium"),e.has("scrimEdge")&&!z.has(this.scrimEdge)&&(this.scrimEdge="none"),e.has("textureScale")&&!O.has(this.textureScale)&&(this.textureScale="medium"),e.has("contentPosition")&&!R.has(this.contentPosition)&&(this.contentPosition="bottom-start")}willUpdate(e){super.willUpdate(e),this.normalizeEnums(e);const t=W(this.focusPoint),r=Number((t.x*100).toFixed(4)),s=Number((t.y*100).toFixed(4));this.style.setProperty("--_esp-image-object-position",`${r}% ${s}%`);const a=this.resolvedAspectRatio();a?this.style.setProperty("--_esp-image-aspect-ratio",a):this.style.removeProperty("--_esp-image-aspect-ratio");const o=this.resolvedTexture();if(["paper","grain","grunge"].includes(o)){const g=o==="grunge"&&this.resolvedBannerScheme()==="light"?"grunge-light":o;this.style.setProperty("--_esp-image-texture-filter",`url(#${M(g,this.textureScale)})`)}else this.style.removeProperty("--_esp-image-texture-filter");const l=_(o)?void 0:x(o),C=[["--_esp-image-registered-image",l?.image],["--_esp-image-registered-size",l?.size],["--_esp-image-registered-repeat",l?.repeat],["--_esp-image-registered-position",l?.position],["--_esp-image-registered-opacity",l?.opacity?.toString()],["--_esp-image-registered-blend-mode",l?.blendMode]];for(const[g,v]of C)v===void 0?this.style.removeProperty(g):this.style.setProperty(g,v)}firstUpdated(e){super.firstUpdated(e);const t=this.shadowRoot?.querySelector('slot[name="overlay"]');t&&(this.overlayHasContent=b(t)),this.observeScrimTargets()}updated(e){if(super.updated(e),this.syncOffscreenDeferral(),(e.has("banner")||e.has("scrim")||e.has("contentPosition")||e.has("overlayHasContent")||e.has("compact"))&&this.observeScrimTargets(),["paper","grain","grunge"].includes(this.resolvedTexture())&&this.renderRoot&&D(this.renderRoot),this.renderedWidth>0){const o=this.shadowRoot?.querySelector(".compact-sentinel")?.getBoundingClientRect().width??0,l=o>0&&this.renderedWidth<o;l!==this.compact&&(this.compact=l)}if(this.renderedWidth<=0||this.shouldDeferProjectedSizes())return;const t=this.findProjected();if(!t)return;const r=this.effectiveSizes();if(t.tagName==="PICTURE")for(const a of t.querySelectorAll("source"))a.setAttribute("sizes",r);const s=this.findProjectedImage(t);s?.hasAttribute("srcset")&&s.setAttribute("sizes",r)}renderMedia(){if(this.localImage)return h`<img
         src=${this.localImage}
         alt=${this.caption}
         decoding="async"
@@ -34,7 +34,7 @@ var n=function(l,e,t,r){var i=arguments.length,a=i<3?e:r===null?r=Object.getOwnP
         </div>
         <span class="compact-sentinel" aria-hidden="true"></span>
       </div>
-    `}static ensureProjectionStyles(e){const t=e.nodeType===Node.DOCUMENT_FRAGMENT_NODE&&"host"in e?e:e.nodeType===Node.DOCUMENT_NODE?e.head:e.ownerDocument?.head??document.head,r=Array.from(t.querySelectorAll("style[data-esp-image-projection-styles]")),i=r.find(o=>o.textContent===p.projectionStyles);if(i){for(const o of r)o!==i&&o.remove();return}for(const o of r)o.remove();const a=t.ownerDocument.createElement("style");a.dataset.espImageProjectionStyles="",a.textContent=p.projectionStyles,t.append(a)}};s.projectionStyles=`
+    `}static ensureProjectionStyles(e){const t=e.nodeType===Node.DOCUMENT_FRAGMENT_NODE&&"host"in e?e:e.nodeType===Node.DOCUMENT_NODE?e.head:e.ownerDocument?.head??document.head,r=Array.from(t.querySelectorAll("style[data-esp-image-projection-styles]")),s=r.find(o=>o.textContent===p.projectionStyles);if(s){for(const o of r)o!==s&&o.remove();return}for(const o of r)o.remove();const a=t.ownerDocument.createElement("style");a.dataset.espImageProjectionStyles="",a.textContent=p.projectionStyles,t.append(a)}};i.projectionStyles=`
     esp-image > picture,
     esp-image > img {
       display: block;
@@ -50,7 +50,7 @@ var n=function(l,e,t,r){var i=arguments.length,a=i<3?e:r===null?r=Object.getOwnP
       object-fit: var(--_esp-image-object-fit, cover);
       object-position: var(--esp-image-object-position, var(--_esp-image-object-position, center));
     }
-  `,s.styles=[...v.styles,I`
+  `,i.styles=[...y.styles,I`
       :host {
         display: block;
         aspect-ratio: var(--_esp-image-aspect-ratio, auto);
@@ -529,4 +529,4 @@ var n=function(l,e,t,r){var i=arguments.length,a=i<3?e:r===null?r=Object.getOwnP
           transition: none !important;
         }
       }
-    `,A],n([c({attribute:"original-height",type:Number})],s.prototype,"originalHeight",void 0),n([c({attribute:"original-width",type:Number})],s.prototype,"originalWidth",void 0),n([c({attribute:"low-res",type:String})],s.prototype,"imageUrl",void 0),n([c({attribute:"local-image",type:String})],s.prototype,"localImage",void 0),n([c({type:String})],s.prototype,"caption",void 0),n([c({attribute:"sizes",type:String})],s.prototype,"sizes",void 0),n([c({attribute:"loading",type:String})],s.prototype,"loading",void 0),n([c({attribute:"defer-offscreen",type:Boolean})],s.prototype,"deferOffscreen",void 0),n([c({type:Boolean,reflect:!0})],s.prototype,"banner",void 0),n([c({attribute:"banner-scheme",converter:d(O,"auto"),reflect:!0})],s.prototype,"bannerScheme",void 0),n([c({converter:d(k,"auto"),reflect:!0})],s.prototype,"scrim",void 0),n([c({attribute:"scrim-strength",converter:d(w,"medium"),reflect:!0})],s.prototype,"scrimStrength",void 0),n([c({attribute:"scrim-edge",converter:d(S,"none"),reflect:!0})],s.prototype,"scrimEdge",void 0),n([c({type:String,reflect:!0})],s.prototype,"texture",void 0),n([c({attribute:"texture-scale",converter:d(z,"medium"),reflect:!0})],s.prototype,"textureScale",void 0),n([c({attribute:"content-position",converter:d(j,"bottom-start"),reflect:!0})],s.prototype,"contentPosition",void 0),n([c({attribute:"focus",converter:N,reflect:!0})],s.prototype,"focusPoint",void 0),n([c({type:String})],s.prototype,"ratio",void 0),n([c({attribute:"compact-ratio",type:String})],s.prototype,"compactRatio",void 0),n([u()],s.prototype,"renderedWidth",void 0),n([u()],s.prototype,"compact",void 0),n([u()],s.prototype,"overlayHasContent",void 0),s=p=n([E("esp-image")],s);export{s as EspalierImage,R as parseImageRatio};
+    `,A],n([c({attribute:"original-height",type:Number})],i.prototype,"originalHeight",void 0),n([c({attribute:"original-width",type:Number})],i.prototype,"originalWidth",void 0),n([c({attribute:"low-res",type:String})],i.prototype,"imageUrl",void 0),n([c({attribute:"local-image",type:String})],i.prototype,"localImage",void 0),n([c({type:String})],i.prototype,"caption",void 0),n([c({attribute:"sizes",type:String})],i.prototype,"sizes",void 0),n([c({attribute:"loading",type:String})],i.prototype,"loading",void 0),n([c({attribute:"defer-offscreen",type:Boolean})],i.prototype,"deferOffscreen",void 0),n([c({type:Boolean,reflect:!0})],i.prototype,"banner",void 0),n([c({attribute:"banner-scheme",converter:d(j,"auto"),reflect:!0})],i.prototype,"bannerScheme",void 0),n([c({converter:d(w,"auto"),reflect:!0})],i.prototype,"scrim",void 0),n([c({attribute:"scrim-strength",converter:d(S,"medium"),reflect:!0})],i.prototype,"scrimStrength",void 0),n([c({attribute:"scrim-edge",converter:d(z,"none"),reflect:!0})],i.prototype,"scrimEdge",void 0),n([c({type:String,reflect:!0})],i.prototype,"texture",void 0),n([c({attribute:"texture-scale",converter:d(O,"medium"),reflect:!0})],i.prototype,"textureScale",void 0),n([c({attribute:"content-position",converter:d(R,"bottom-start"),reflect:!0})],i.prototype,"contentPosition",void 0),n([c({attribute:"focus",converter:N,reflect:!0})],i.prototype,"focusPoint",void 0),n([c({type:String})],i.prototype,"ratio",void 0),n([c({attribute:"compact-ratio",type:String})],i.prototype,"compactRatio",void 0),n([u()],i.prototype,"renderedWidth",void 0),n([u()],i.prototype,"compact",void 0),n([u()],i.prototype,"overlayHasContent",void 0),i=p=n([E("esp-image")],i);export{i as EspalierImage,f as parseImageRatio};

package/dist/image/image-ratio.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Resolve a supported CSS aspect-ratio string, or null when it is invalid.
+ * A removed attribute arrives as `null` and is invalid like an empty one.
+ */
+export declare function parseImageRatio(value: string | null | undefined): string | null;

package/dist/image/image-ratio.js

@@ -0,0 +1 @@
+function s(i){const r=(i??"").trim();if(!r)return null;const n=r.split("/").map(e=>e.trim());if(n.length>2||n.some(e=>e.length===0))return null;const t=n.map(Number);return t.some(e=>!Number.isFinite(e)||e<=0)?null:t.length===1?String(t[0]):`${t[0]} / ${t[1]}`}export{s as parseImageRatio};

package/dist/image-picker/esp-image-picker.js

@@ -1,4 +1,4 @@
-var a=function(o,e,i,t){var n=arguments.length,r=n<3?e:t===null?t=Object.getOwnPropertyDescriptor(e,i):t,c;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(o,e,i,t);else for(var p=o.length-1;p>=0;p--)(c=o[p])&&(r=(n<3?c(r):n>3?c(e,i,r):c(e,i))||r);return n>3&&r&&Object.defineProperty(e,i,r),r};import{css as d,html as m}from"lit";import{customElement as u,property as l}from"lit/decorators.js";import"../pickers/esp-pick-one.js";import{EspalierElementBase as h}from"../shared/esp-element-base.js";import{FormFieldController as v}from"../shared/form-field-controller.js";let s=class extends h{constructor(){super(...arguments),this.internals=this.attachInternals(),this.formCtrl=new v({host:this,internals:this.internals,getFormValue:()=>this.selectedImage?this.value:null,getValidity:()=>null,onReset:()=>{this.value=""},onRestore:e=>{this.value=e},onDisabled:e=>{this.disabled=e}}),this.formItemDescription=null,this.formItemLabel=null,this.synchronizingPicker=!0,this.pickerSyncGeneration=0,this.images=[],this.value="",this.previewPlacement="above",this.disabled=!1,this.loading=!1,this.emptyMessage="No images available.",this.automaticLabel="Automatic",this.name="",this.handlePickerValueChanged=e=>{if(e.stopPropagation(),this.synchronizingPicker)return;const i=e.detail?.value??this.value;if(i===this.value){this.picker.value=this.value;return}this.value=i,this.formCtrl.syncValue(),this.emitValueChanged(i)}}focus(e){this.focusResolvedElementAfterUpdate(()=>this.picker,e)}setFormItemDescription(e){this.formItemDescription=e,this.syncFormItemDescription()}setFormItemLabel(e){this.formItemLabel=e,this.syncFormItemDescription()}validate(){this.formCtrl.validate()}checkValidity(){return this.formCtrl.checkValidity()}formResetCallback(){this.formCtrl.handleFormReset()}formStateRestoreCallback(e){this.formCtrl.handleFormStateRestore(e)}formDisabledCallback(e){this.formCtrl.handleFormDisabled(e)}get picker(){return this.shadowRoot?.querySelector("esp-pick-one")}get selectedImage(){return this.images.find(e=>e.id===this.value)}imageLabel(e,i){return e.label?.trim()||e.alt?.trim()||`Image ${i+1}`}get pickerItems(){return this.images.length===0?[]:[{text:this.automaticLabel,value:"",selected:this.value===""},...this.images.map((e,i)=>({text:this.imageLabel(e,i),value:e.id,selected:e.id===this.value,slotNodes:[this.thumbnailNode(e,"")]}))]}thumbnailNode(e,i){const t=document.createElement("img");return t.src=e.src,t.alt=i,t.className="thumbnail",t.style.width="var(--esp-image-picker-option-width, 12rem)",t.style.maxWidth="40vw",t.style.height="var(--esp-image-picker-option-height, 8rem)",t.style.objectFit="contain",t.loading="lazy",t.decoding="async",t}syncFormItemDescription(){const e=this.picker;e?.setFormItemDescription?.(this.formItemDescription),e?.setFormItemLabel?.(this.formItemLabel)}willUpdate(e){super.willUpdate(e),(e.has("images")||e.has("value")||e.has("automaticLabel")||e.has("disabled")||e.has("loading"))&&(this.synchronizingPicker=!0,this.pickerSyncGeneration+=1)}updated(e){super.updated(e),this.syncFormItemDescription(),(e.has("value")||e.has("images"))&&this.formCtrl.syncValueSilently();const i=this.pickerSyncGeneration,t=this.picker;if(!t){this.synchronizingPicker=!1;return}(e.has("images")||e.has("automaticLabel"))&&(t.value=this.value),t.updateComplete.then(()=>{i===this.pickerSyncGeneration&&(this.synchronizingPicker=!1)})}render(){const e=this.selectedImage,i=this.loading||this.images.length===0,t=this.loading?"Loading images\u2026":this.emptyMessage;return m`
+var a=function(o,e,i,t){var n=arguments.length,r=n<3?e:t===null?t=Object.getOwnPropertyDescriptor(e,i):t,c;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(o,e,i,t);else for(var p=o.length-1;p>=0;p--)(c=o[p])&&(r=(n<3?c(r):n>3?c(e,i,r):c(e,i))||r);return n>3&&r&&Object.defineProperty(e,i,r),r};import{css as d,html as m}from"lit";import{customElement as u,property as l}from"lit/decorators.js";import"../pickers/esp-pick-one.js";import{EspalierElementBase as h}from"../shared/esp-element-base.js";import{FormFieldController as v}from"../shared/form-field-controller.js";import{FormItemRelay as g}from"../shared/form-item-relay.js";let s=class extends h{constructor(){super(...arguments),this.internals=this.attachInternals(),this.formCtrl=new v({host:this,internals:this.internals,getFormValue:()=>this.selectedImage?this.value:null,getValidity:()=>null,onReset:()=>{this.value=""},onRestore:e=>{this.value=e},onDisabled:e=>{this.disabled=e}}),this.formItemRelay=new g(()=>this.picker),this.synchronizingPicker=!0,this.pickerSyncGeneration=0,this.images=[],this.value="",this.previewPlacement="above",this.disabled=!1,this.loading=!1,this.emptyMessage="No images available.",this.automaticLabel="Automatic",this.name="",this.handlePickerValueChanged=e=>{if(e.stopPropagation(),this.synchronizingPicker)return;const i=e.detail?.value??this.value;if(i===this.value){this.picker.value=this.value;return}this.value=i,this.formCtrl.syncValue(),this.emitValueChanged(i)}}focus(e){this.focusResolvedElementAfterUpdate(()=>this.picker,e)}setFormItemDescription(e){this.formItemRelay.setDescription(e)}setFormItemLabel(e){this.formItemRelay.setLabel(e)}setFormItemInvalid(e){this.formItemRelay.setInvalid(e)}validate(){this.formCtrl.validate()}checkValidity(){return this.formCtrl.checkValidity()}formResetCallback(){this.formCtrl.handleFormReset()}formStateRestoreCallback(e){this.formCtrl.handleFormStateRestore(e)}formDisabledCallback(e){this.formCtrl.handleFormDisabled(e)}get picker(){return this.shadowRoot?.querySelector("esp-pick-one")}get selectedImage(){return this.images.find(e=>e.id===this.value)}imageLabel(e,i){return e.label?.trim()||e.alt?.trim()||`Image ${i+1}`}get pickerItems(){return this.images.length===0?[]:[{text:this.automaticLabel,value:"",selected:this.value===""},...this.images.map((e,i)=>({text:this.imageLabel(e,i),value:e.id,selected:e.id===this.value,slotNodes:[this.thumbnailNode(e,"")]}))]}thumbnailNode(e,i){const t=document.createElement("img");return t.src=e.src,t.alt=i,t.className="thumbnail",t.style.width="var(--esp-image-picker-option-width, 12rem)",t.style.maxWidth="40vw",t.style.height="var(--esp-image-picker-option-height, 8rem)",t.style.objectFit="contain",t.loading="lazy",t.decoding="async",t}willUpdate(e){super.willUpdate(e),(e.has("images")||e.has("value")||e.has("automaticLabel")||e.has("disabled")||e.has("loading"))&&(this.synchronizingPicker=!0,this.pickerSyncGeneration+=1)}updated(e){super.updated(e),this.formItemRelay.apply(),(e.has("value")||e.has("images"))&&this.formCtrl.syncValueSilently();const i=this.pickerSyncGeneration,t=this.picker;if(!t){this.synchronizingPicker=!1;return}(e.has("images")||e.has("automaticLabel"))&&(t.value=this.value),t.updateComplete.then(()=>{i===this.pickerSyncGeneration&&(this.synchronizingPicker=!1)})}render(){const e=this.selectedImage,i=this.loading||this.images.length===0,t=this.loading?"Loading images\u2026":this.emptyMessage;return m`
       <div class="image-picker">
         <div class="preview" aria-live="polite">
           ${e?m`<img src=${e.src} alt=${e.alt??this.imageLabel(e,this.images.indexOf(e))} />`:m`<span>${this.automaticLabel}</span>`}
@@ -14,7 +14,7 @@ var a=function(o,e,i,t){var n=arguments.length,r=n<3?e:t===null?t=Object.getOwnP
           ${i?m`<p class="status" role="status">${t}</p>`:""}
         </div>
       </div>
-    `}};s.formAssociated=!0,s.styles=[...h.styles,d`
+    `}};s.clearsFormItemErrorOnChange=!0,s.formAssociated=!0,s.styles=[...h.styles,d`
       :host {
         display: block;
       }

package/dist/index.d.ts

@@ -36,6 +36,7 @@ export * from "./footer/index.js";
 export * from "./grid/esp-grid.js";
 export * from "./image/esp-image.js";
 export * from "./image/image-focus.js";
+export * from "./video/esp-video.js";
 export * from "./lightbox/esp-lightbox.js";
 export * from "./info/esp-info.js";
 export * from "./input/esp-input.js";
@@ -72,7 +73,7 @@ export { requestHelp, type HelpRequest, type HelpState } from "./shared/help-eve
 export { getEspBus, type EspBusEventMap, type SchemeEvents, type ToastEvents, type FlyoutEvents, type HelpEvents, type PopoverEvents, type SizeEvents, type PageEventMap, type SeedColorRoot, } from "./shared/bus-events.js";
 export * from "./shared/events.js";
 export { getImageDetails, releasePreviewUrl, type EspalierUploadImage, type ImageDetailsOptions, type SelectedUploadImage, type ExistingUploadImage, type ExistingImage, type ResponsiveImageUrl, type UploadCallbacks, type UploadEventDetail, } from "./image-upload/image-helpers.js";
-export { calculateAlbumLayout, calculatePhotoLayout, DEFAULT_ALBUM_MAX_ROW_HEIGHT_VH, normalizeAlbumMaxRowHeightVh, normalizeMaxImagesPerRow, type AlbumLayoutItem, type AlbumLayoutOptions, type AlbumLayoutRow, type LayoutImage, type PhotoRow, } from "./shared/justified-layout.js";
+export { calculateAlbumLayout, DEFAULT_ALBUM_MAX_ROW_HEIGHT_VH, normalizeAlbumMaxRowHeightVh, normalizeMaxImagesPerRow, type AlbumLayoutItem, type AlbumLayoutOptions, type AlbumLayoutRow, type LayoutImage, } from "./shared/justified-layout.js";
 export { type TypeaheadFetchItems } from "./pickers/types.js";
 export { type EspalierTheme, type LightnessKey, type LightnessReference, type PartialTheme, type PartialThemeContexts, type PartialThemeTones, type ThemeContext, type ThemeContexts, type ThemeTones, type ToneReference, type VariantColorSource, encodeTheme, parseTheme, mergePartials, layerThemes, validateThemePair, resolveContextTheme, isObjectRecord, isSemanticColorName, buildTaprootLightTheme, buildTaprootDarkTheme, NESTED_THEME_KEYS, } from "./shared/theme.js";
 export { auditDataPalette, describePaletteCollision, generateSequentialRamp, generateDivergingRamp, COLOR_VISION_SIMULATIONS, DATA_SERIES_KEYS, DEFAULT_DATA_PALETTE, DEFAULT_DATA_RAMP_STEPS, DEFAULT_DIVERGING_NEUTRAL, MAX_DATA_RAMP_STEPS, MIN_DATA_COLOR_DISTANCE, MIN_DATA_RAMP_LIGHTNESS_STEP, MIN_DATA_RAMP_STEPS, type ColorVisionSimulation, type DataPalette, type DataPaletteIssue, type DataRamp, type DataRamps, type DataSeriesKey, type DivergingDataRamp, type DivergingRampOptions, type PartialDataRamp, type PartialDataRamps, type SequentialDataRamp, type SequentialRampOptions, } from "./shared/data-colors.js";

package/dist/index.js

@@ -1 +1 @@
-export*from"./box/esp-box.js";export*from"./action-menu/esp-action-menu.js";export*from"./action-menu/esp-action-menu-item.js";export*from"./avatar/esp-avatar.js";export*from"./avatar/esp-profile-chip.js";export*from"./badge/esp-badge.js";export*from"./checkbox/esp-checkbox.js";export*from"./checkbox/esp-checkbox-group.js";export*from"./data-cell/esp-data-cell.js";export*from"./radio-button/esp-radio-button.js";export*from"./radio-button/esp-radio-button-group.js";export*from"./repeater/esp-repeater.js";export*from"./breadcrumbs/esp-breadcrumbs.js";export*from"./button/esp-button.js";export*from"./button/esp-button-group.js";export*from"./color-picker/esp-color-picker.js";export*from"./flyout/esp-flyout.js";export*from"./form/esp-form.js";export*from"./form-item/esp-form-item.js";export*from"./help/esp-help-button.js";export*from"./help/esp-help-provider.js";export*from"./header/index.js";export*from"./page/esp-page.js";export*from"./section/esp-section.js";export*from"./stack/esp-stack.js";export*from"./row/esp-row.js";export*from"./popover/esp-popover.js";export*from"./dialog/esp-dialog.js";export*from"./empty-state/esp-empty-state.js";export*from"./image-upload/esp-image-upload.js";export*from"./image-picker/esp-image-picker.js";export*from"./file-upload/esp-file-upload.js";export*from"./font-picker/esp-font-picker.js";export*from"./focus-picker/esp-focus-picker.js";export*from"./footer/index.js";export*from"./grid/esp-grid.js";export*from"./image/esp-image.js";export*from"./image/image-focus.js";export*from"./lightbox/esp-lightbox.js";export*from"./info/esp-info.js";export*from"./input/esp-input.js";export*from"./textarea/esp-textarea.js";export*from"./pickers/esp-pick-one.js";export*from"./pickers/esp-pick-some.js";export*from"./pickers/esp-picker-menu.js";export*from"./pickers/esp-picker-item.js";export*from"./root/esp-root.js";export*from"./menu/index.js";export*from"./burger/esp-burger.js";export*from"./date-picker/esp-date-picker.js";export*from"./details/esp-details.js";export*from"./details/esp-details-group.js";export*from"./tabs/esp-tab.js";export*from"./tabs/esp-tab-group.js";export*from"./slider/esp-slider.js";export*from"./switch/esp-switch.js";export*from"./toaster/esp-toaster.js";export*from"./tooltip/esp-tooltip.js";export*from"./progress/esp-progress.js";export*from"./search/esp-search.js";export*from"./status-indicator/esp-status-indicator.js";export*from"./tree/esp-tree.js";export*from"./tree/esp-tree-item.js";import{DEFAULT_ICON_SPRITE_URL as ao,DEFAULT_ICON_VIEW_BOX as Io,INTENT_VARIANTS as io,normalizeIntentVariant as lo,getIconHrefForHost as Fo,getIconSpriteUrl as no,getIconSpriteReference as Ao}from"./shared/intent-values.js";import{EspalierElementBase as so}from"./shared/esp-element-base.js";import{VALIDITY_CHANGED_EVENT as Ro}from"./shared/validation.js";import{FormFieldController as Do}from"./shared/form-field-controller.js";import{traverseToClosest as go}from"./shared/utilities.js";import{showToast as Mo}from"./shared/toast-events.js";import{showFlyout as Ho,closeFlyout as Oo}from"./shared/flyout-events.js";import{requestHelp as Uo}from"./shared/help-events.js";import{getEspBus as bo}from"./shared/bus-events.js";export*from"./shared/events.js";import{getImageDetails as ko,releasePreviewUrl as yo}from"./image-upload/image-helpers.js";import{calculateAlbumLayout as vo,calculatePhotoLayout as wo,DEFAULT_ALBUM_MAX_ROW_HEIGHT_VH as Bo,normalizeAlbumMaxRowHeightVh as zo,normalizeMaxImagesPerRow as Ko}from"./shared/justified-layout.js";import{encodeTheme as qo,parseTheme as Yo,mergePartials as jo,layerThemes as Jo,validateThemePair as Qo,resolveContextTheme as Zo,isObjectRecord as $o,isSemanticColorName as oe,buildTaprootLightTheme as ee,buildTaprootDarkTheme as re,NESTED_THEME_KEYS as te}from"./shared/theme.js";import{auditDataPalette as pe,describePaletteCollision as fe,generateSequentialRamp as Te,generateDivergingRamp as xe,COLOR_VISION_SIMULATIONS as _e,DATA_SERIES_KEYS as Ee,DEFAULT_DATA_PALETTE as ae,DEFAULT_DATA_RAMP_STEPS as Ie,DEFAULT_DIVERGING_NEUTRAL as ie,MAX_DATA_RAMP_STEPS as le,MIN_DATA_COLOR_DISTANCE as Fe,MIN_DATA_RAMP_LIGHTNESS_STEP as ne,MIN_DATA_RAMP_STEPS as Ae}from"./shared/data-colors.js";import{canonicalFontStack as se,classifyFontStack as Le,customWebSafeFont as Re,isDeviceFontStack as ce,matchWebSafeFont as De,parseFontStack as Ne,webSafeFontWeights as ge}from"./shared/font-stacks.js";import{WEIGHT_LABELS as Me,extractWeights as Pe,normalizeWeight as He,bestAvailableWeight as Oe,extractFamily as ue,getFallbackFont as Ue,googleFontStylesheetUrl as Ce,isLocalFontFamily as be,normalizeFontFaceWeight as Ge,removeRuntimeGoogleFontLink as Ve,removeRuntimeGoogleFontLinks as ke,syncRuntimeGoogleFontLink as ye,RUNTIME_GOOGLE_FONT_OWNER_ATTR as We}from"./shared/font-helpers.js";import{compileFontPlan as ve,fontFallbackAliases as we,fontFallbackBaseIndexes as Be,fontFaceRequestKey as ze}from"./shared/font-plan.js";import{getGoogleFonts as Xe}from"./font-picker/esp-font-picker.js";import{ROOT_SURFACE as Ye,THEME_FIT_ANCHOR_FIELDS as je,THEME_FIT_APCA_FIELDS as Je,THEME_FIT_DATA_PALETTE_LINT_FIELDS as Qe,THEME_FIT_DATA_PALETTE_LINT_IDS as Ze,THEME_FIT_EXPLICIT_VALUES as $e,THEME_FIT_LINT_FIELDS as or,THEME_FIT_LINT_IDS as er,THEME_FIT_LINT_SEVERITIES as rr,THEME_FIT_PAIRING_VALUES as tr,THEME_FIT_REPORT_FIELDS as mr,THEME_FIT_SUITE_FIELDS as pr,THEME_FIT_TOKEN_FIELDS as fr,themeFitReport as Tr,themeFitRows as xr,themeFitLints as _r,themeFitReportSuite as Er,printThemeFitReport as ar}from"./shared/theme-fit-report.js";import{ICON_SPRITE as ir,ICON_SPRITE_ID as lr,installIconSprite as Fr}from"./icons/index.js";import{deriveLightnessRamp as Ar,themeFromSwatches as Sr}from"./shared/theme-swatches.js";export{_e as COLOR_VISION_SIMULATIONS,Ee as DATA_SERIES_KEYS,Bo as DEFAULT_ALBUM_MAX_ROW_HEIGHT_VH,ae as DEFAULT_DATA_PALETTE,Ie as DEFAULT_DATA_RAMP_STEPS,ie as DEFAULT_DIVERGING_NEUTRAL,ao as DEFAULT_ICON_SPRITE_URL,Io as DEFAULT_ICON_VIEW_BOX,so as EspalierElementBase,Do as FormFieldController,ir as ICON_SPRITE,lr as ICON_SPRITE_ID,io as INTENT_VARIANTS,le as MAX_DATA_RAMP_STEPS,Fe as MIN_DATA_COLOR_DISTANCE,ne as MIN_DATA_RAMP_LIGHTNESS_STEP,Ae as MIN_DATA_RAMP_STEPS,te as NESTED_THEME_KEYS,Ye as ROOT_SURFACE,We as RUNTIME_GOOGLE_FONT_OWNER_ATTR,je as THEME_FIT_ANCHOR_FIELDS,Je as THEME_FIT_APCA_FIELDS,Qe as THEME_FIT_DATA_PALETTE_LINT_FIELDS,Ze as THEME_FIT_DATA_PALETTE_LINT_IDS,$e as THEME_FIT_EXPLICIT_VALUES,or as THEME_FIT_LINT_FIELDS,er as THEME_FIT_LINT_IDS,rr as THEME_FIT_LINT_SEVERITIES,tr as THEME_FIT_PAIRING_VALUES,mr as THEME_FIT_REPORT_FIELDS,pr as THEME_FIT_SUITE_FIELDS,fr as THEME_FIT_TOKEN_FIELDS,Ro as VALIDITY_CHANGED_EVENT,Me as WEIGHT_LABELS,pe as auditDataPalette,Oe as bestAvailableWeight,re as buildTaprootDarkTheme,ee as buildTaprootLightTheme,vo as calculateAlbumLayout,wo as calculatePhotoLayout,se as canonicalFontStack,Le as classifyFontStack,Oo as closeFlyout,ve as compileFontPlan,Re as customWebSafeFont,Ar as deriveLightnessRamp,fe as describePaletteCollision,qo as encodeTheme,ue as extractFamily,Pe as extractWeights,ze as fontFaceRequestKey,we as fontFallbackAliases,Be as fontFallbackBaseIndexes,xe as generateDivergingRamp,Te as generateSequentialRamp,bo as getEspBus,Ue as getFallbackFont,Xe as getGoogleFonts,Fo as getIconHrefForHost,Ao as getIconSpriteReference,no as getIconSpriteUrl,ko as getImageDetails,Ce as googleFontStylesheetUrl,Fr as installIconSprite,ce as isDeviceFontStack,be as isLocalFontFamily,$o as isObjectRecord,oe as isSemanticColorName,Jo as layerThemes,De as matchWebSafeFont,jo as mergePartials,zo as normalizeAlbumMaxRowHeightVh,Ge as normalizeFontFaceWeight,lo as normalizeIntentVariant,Ko as normalizeMaxImagesPerRow,He as normalizeWeight,Ne as parseFontStack,Yo as parseTheme,ar as printThemeFitReport,yo as releasePreviewUrl,Ve as removeRuntimeGoogleFontLink,ke as removeRuntimeGoogleFontLinks,Uo as requestHelp,Zo as resolveContextTheme,Ho as showFlyout,Mo as showToast,ye as syncRuntimeGoogleFontLink,_r as themeFitLints,Tr as themeFitReport,Er as themeFitReportSuite,xr as themeFitRows,Sr as themeFromSwatches,go as traverseToClosest,Qo as validateThemePair,ge as webSafeFontWeights};
+export*from"./box/esp-box.js";export*from"./action-menu/esp-action-menu.js";export*from"./action-menu/esp-action-menu-item.js";export*from"./avatar/esp-avatar.js";export*from"./avatar/esp-profile-chip.js";export*from"./badge/esp-badge.js";export*from"./checkbox/esp-checkbox.js";export*from"./checkbox/esp-checkbox-group.js";export*from"./data-cell/esp-data-cell.js";export*from"./radio-button/esp-radio-button.js";export*from"./radio-button/esp-radio-button-group.js";export*from"./repeater/esp-repeater.js";export*from"./breadcrumbs/esp-breadcrumbs.js";export*from"./button/esp-button.js";export*from"./button/esp-button-group.js";export*from"./color-picker/esp-color-picker.js";export*from"./flyout/esp-flyout.js";export*from"./form/esp-form.js";export*from"./form-item/esp-form-item.js";export*from"./help/esp-help-button.js";export*from"./help/esp-help-provider.js";export*from"./header/index.js";export*from"./page/esp-page.js";export*from"./section/esp-section.js";export*from"./stack/esp-stack.js";export*from"./row/esp-row.js";export*from"./popover/esp-popover.js";export*from"./dialog/esp-dialog.js";export*from"./empty-state/esp-empty-state.js";export*from"./image-upload/esp-image-upload.js";export*from"./image-picker/esp-image-picker.js";export*from"./file-upload/esp-file-upload.js";export*from"./font-picker/esp-font-picker.js";export*from"./focus-picker/esp-focus-picker.js";export*from"./footer/index.js";export*from"./grid/esp-grid.js";export*from"./image/esp-image.js";export*from"./image/image-focus.js";export*from"./video/esp-video.js";export*from"./lightbox/esp-lightbox.js";export*from"./info/esp-info.js";export*from"./input/esp-input.js";export*from"./textarea/esp-textarea.js";export*from"./pickers/esp-pick-one.js";export*from"./pickers/esp-pick-some.js";export*from"./pickers/esp-picker-menu.js";export*from"./pickers/esp-picker-item.js";export*from"./root/esp-root.js";export*from"./menu/index.js";export*from"./burger/esp-burger.js";export*from"./date-picker/esp-date-picker.js";export*from"./details/esp-details.js";export*from"./details/esp-details-group.js";export*from"./tabs/esp-tab.js";export*from"./tabs/esp-tab-group.js";export*from"./slider/esp-slider.js";export*from"./switch/esp-switch.js";export*from"./toaster/esp-toaster.js";export*from"./tooltip/esp-tooltip.js";export*from"./progress/esp-progress.js";export*from"./search/esp-search.js";export*from"./status-indicator/esp-status-indicator.js";export*from"./tree/esp-tree.js";export*from"./tree/esp-tree-item.js";import{DEFAULT_ICON_SPRITE_URL as Io,DEFAULT_ICON_VIEW_BOX as io,INTENT_VARIANTS as Fo,normalizeIntentVariant as lo,getIconHrefForHost as no,getIconSpriteUrl as Ao,getIconSpriteReference as So}from"./shared/intent-values.js";import{EspalierElementBase as Lo}from"./shared/esp-element-base.js";import{VALIDITY_CHANGED_EVENT as Do}from"./shared/validation.js";import{FormFieldController as No}from"./shared/form-field-controller.js";import{traverseToClosest as ho}from"./shared/utilities.js";import{showToast as Po}from"./shared/toast-events.js";import{showFlyout as Oo,closeFlyout as uo}from"./shared/flyout-events.js";import{requestHelp as Co}from"./shared/help-events.js";import{getEspBus as Go}from"./shared/bus-events.js";export*from"./shared/events.js";import{getImageDetails as Wo,releasePreviewUrl as vo}from"./image-upload/image-helpers.js";import{calculateAlbumLayout as wo,DEFAULT_ALBUM_MAX_ROW_HEIGHT_VH as Bo,normalizeAlbumMaxRowHeightVh as zo,normalizeMaxImagesPerRow as Ko}from"./shared/justified-layout.js";import{encodeTheme as qo,parseTheme as Yo,mergePartials as jo,layerThemes as Jo,validateThemePair as Qo,resolveContextTheme as Zo,isObjectRecord as $o,isSemanticColorName as oe,buildTaprootLightTheme as ee,buildTaprootDarkTheme as re,NESTED_THEME_KEYS as te}from"./shared/theme.js";import{auditDataPalette as pe,describePaletteCollision as fe,generateSequentialRamp as Te,generateDivergingRamp as xe,COLOR_VISION_SIMULATIONS as _e,DATA_SERIES_KEYS as Ee,DEFAULT_DATA_PALETTE as ae,DEFAULT_DATA_RAMP_STEPS as Ie,DEFAULT_DIVERGING_NEUTRAL as ie,MAX_DATA_RAMP_STEPS as Fe,MIN_DATA_COLOR_DISTANCE as le,MIN_DATA_RAMP_LIGHTNESS_STEP as ne,MIN_DATA_RAMP_STEPS as Ae}from"./shared/data-colors.js";import{canonicalFontStack as se,classifyFontStack as Le,customWebSafeFont as Re,isDeviceFontStack as De,matchWebSafeFont as ce,parseFontStack as Ne,webSafeFontWeights as ge}from"./shared/font-stacks.js";import{WEIGHT_LABELS as Me,extractWeights as Pe,normalizeWeight as He,bestAvailableWeight as Oe,extractFamily as ue,getFallbackFont as Ue,googleFontStylesheetUrl as Ce,isLocalFontFamily as be,normalizeFontFaceWeight as Ge,removeRuntimeGoogleFontLink as Ve,removeRuntimeGoogleFontLinks as ke,syncRuntimeGoogleFontLink as We,RUNTIME_GOOGLE_FONT_OWNER_ATTR as de}from"./shared/font-helpers.js";import{compileFontPlan as ye,fontFallbackAliases as we,fontFallbackBaseIndexes as Be,fontFaceRequestKey as ze}from"./shared/font-plan.js";import{getGoogleFonts as Xe}from"./font-picker/esp-font-picker.js";import{ROOT_SURFACE as Ye,THEME_FIT_ANCHOR_FIELDS as je,THEME_FIT_APCA_FIELDS as Je,THEME_FIT_DATA_PALETTE_LINT_FIELDS as Qe,THEME_FIT_DATA_PALETTE_LINT_IDS as Ze,THEME_FIT_EXPLICIT_VALUES as $e,THEME_FIT_LINT_FIELDS as or,THEME_FIT_LINT_IDS as er,THEME_FIT_LINT_SEVERITIES as rr,THEME_FIT_PAIRING_VALUES as tr,THEME_FIT_REPORT_FIELDS as mr,THEME_FIT_SUITE_FIELDS as pr,THEME_FIT_TOKEN_FIELDS as fr,themeFitReport as Tr,themeFitRows as xr,themeFitLints as _r,themeFitReportSuite as Er,printThemeFitReport as ar}from"./shared/theme-fit-report.js";import{ICON_SPRITE as ir,ICON_SPRITE_ID as Fr,installIconSprite as lr}from"./icons/index.js";import{deriveLightnessRamp as Ar,themeFromSwatches as Sr}from"./shared/theme-swatches.js";export{_e as COLOR_VISION_SIMULATIONS,Ee as DATA_SERIES_KEYS,Bo as DEFAULT_ALBUM_MAX_ROW_HEIGHT_VH,ae as DEFAULT_DATA_PALETTE,Ie as DEFAULT_DATA_RAMP_STEPS,ie as DEFAULT_DIVERGING_NEUTRAL,Io as DEFAULT_ICON_SPRITE_URL,io as DEFAULT_ICON_VIEW_BOX,Lo as EspalierElementBase,No as FormFieldController,ir as ICON_SPRITE,Fr as ICON_SPRITE_ID,Fo as INTENT_VARIANTS,Fe as MAX_DATA_RAMP_STEPS,le as MIN_DATA_COLOR_DISTANCE,ne as MIN_DATA_RAMP_LIGHTNESS_STEP,Ae as MIN_DATA_RAMP_STEPS,te as NESTED_THEME_KEYS,Ye as ROOT_SURFACE,de as RUNTIME_GOOGLE_FONT_OWNER_ATTR,je as THEME_FIT_ANCHOR_FIELDS,Je as THEME_FIT_APCA_FIELDS,Qe as THEME_FIT_DATA_PALETTE_LINT_FIELDS,Ze as THEME_FIT_DATA_PALETTE_LINT_IDS,$e as THEME_FIT_EXPLICIT_VALUES,or as THEME_FIT_LINT_FIELDS,er as THEME_FIT_LINT_IDS,rr as THEME_FIT_LINT_SEVERITIES,tr as THEME_FIT_PAIRING_VALUES,mr as THEME_FIT_REPORT_FIELDS,pr as THEME_FIT_SUITE_FIELDS,fr as THEME_FIT_TOKEN_FIELDS,Do as VALIDITY_CHANGED_EVENT,Me as WEIGHT_LABELS,pe as auditDataPalette,Oe as bestAvailableWeight,re as buildTaprootDarkTheme,ee as buildTaprootLightTheme,wo as calculateAlbumLayout,se as canonicalFontStack,Le as classifyFontStack,uo as closeFlyout,ye as compileFontPlan,Re as customWebSafeFont,Ar as deriveLightnessRamp,fe as describePaletteCollision,qo as encodeTheme,ue as extractFamily,Pe as extractWeights,ze as fontFaceRequestKey,we as fontFallbackAliases,Be as fontFallbackBaseIndexes,xe as generateDivergingRamp,Te as generateSequentialRamp,Go as getEspBus,Ue as getFallbackFont,Xe as getGoogleFonts,no as getIconHrefForHost,So as getIconSpriteReference,Ao as getIconSpriteUrl,Wo as getImageDetails,Ce as googleFontStylesheetUrl,lr as installIconSprite,De as isDeviceFontStack,be as isLocalFontFamily,$o as isObjectRecord,oe as isSemanticColorName,Jo as layerThemes,ce as matchWebSafeFont,jo as mergePartials,zo as normalizeAlbumMaxRowHeightVh,Ge as normalizeFontFaceWeight,lo as normalizeIntentVariant,Ko as normalizeMaxImagesPerRow,He as normalizeWeight,Ne as parseFontStack,Yo as parseTheme,ar as printThemeFitReport,vo as releasePreviewUrl,Ve as removeRuntimeGoogleFontLink,ke as removeRuntimeGoogleFontLinks,Co as requestHelp,Zo as resolveContextTheme,Oo as showFlyout,Po as showToast,We as syncRuntimeGoogleFontLink,_r as themeFitLints,Tr as themeFitReport,Er as themeFitReportSuite,xr as themeFitRows,Sr as themeFromSwatches,ho as traverseToClosest,Qo as validateThemePair,ge as webSafeFontWeights};

package/dist/input/esp-input.d.ts

@@ -63,6 +63,23 @@ import { EspalierElementBase } from "../shared/esp-element-base.js";
  * </esp-box>
  * ```
  *
+ * ### Decimal numbers
+ *
+ * A number input's native step defaults to `1`, which rejects every decimal.
+ * Set `step="any"` to accept any decimal, or a numeric step such as `0.01`
+ * to limit precision.
+ *
+ * ```html
+ * <esp-box>
+ *   <esp-form-item label="Weight (kg)" hint="Any decimal, such as 2.75.">
+ *     <esp-input input-type="number" step="any" min="0"></esp-input>
+ *   </esp-form-item>
+ *   <esp-form-item label="Price" hint="To the cent.">
+ *     <esp-input input-type="number" step="0.01" min="0"></esp-input>
+ *   </esp-form-item>
+ * </esp-box>
+ * ```
+ *
  * ### Telephone with locale-aware formatting
  *
  * The `tel` type uses phone localities to parse and format phone
@@ -368,11 +385,20 @@ export declare class EspalierInput extends EspalierElementBase implements Espali
      */
     max: string | undefined;
     /**
-     * Step value for `input-type="number"`.
+     * Step value for `input-type="number"`. `"any"` (as an attribute or the
+     * property) allows any decimal: without it the native default step of `1`
+     * flags every decimal as a step mismatch. Numeric steps are passed through
+     * unchanged.
      *
-     * @type {number | undefined}
+     * ```html
+     * <esp-form-item label="Weight (kg)">
+     *   <esp-input input-type="number" step="any" min="0"></esp-input>
+     * </esp-form-item>
+     * ```
+     *
+     * @type {number | "any" | undefined}
      */
-    step: number | undefined;
+    step: number | "any" | undefined;
     /**
      * Hint the browser about which virtual keyboard to show.
      * When not set, a sensible default is chosen based on

package/dist/input/esp-input.js

@@ -1,25 +1,25 @@
-var r=function(p,e,t,i){var a=arguments.length,l=a<3?e:i===null?i=Object.getOwnPropertyDescriptor(e,t):i,o;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")l=Reflect.decorate(p,e,t,i);else for(var u=p.length-1;u>=0;u--)(o=p[u])&&(l=(a<3?o(l):a>3?o(e,t,l):o(e,t))||l);return a>3&&l&&Object.defineProperty(e,t,l),l};import{css as _,html as c,nothing as b}from"lit";import{customElement as D,property as n,state as g}from"lit/decorators.js";import{ifDefined as h}from"lit/directives/if-defined.js";import{createRef as T,ref as f}from"lit/directives/ref.js";import{EspalierElementBase as y}from"../shared/esp-element-base.js";import{FormFieldController as x}from"../shared/form-field-controller.js";import{ESP_EVENTS as I}from"../shared/events.js";import{FormFieldDescriptionController as M}from"../shared/form-field-description-controller.js";import{getIconHrefForHost as v}from"../shared/intent-values.js";import{SlottedIconController as C}from"../shared/slotted-icon-controller.js";import{renderSpriteIcon as P}from"../shared/svgs/render-sprite-icon.js";import{detectDatePattern as S,parseDateInput as L,formatDateForLocale as d}from"./date-locale.js";import{getPhoneLocalities as $,parsePhoneInput as V,formatPhoneForLocale as w}from"./tel-locale.js";let s=class extends y{constructor(){super(...arguments),this.internals=this.attachInternals(),this.theInput=T(),this.iconSlot=new C(this),this.formCtrl=new x({host:this,internals:this.internals,getFormValue:()=>this.value||null,getValidity:()=>this._getValidity(),getValidationAnchor:()=>this.theInput.value??this,onReset:()=>{this.value="",this._dateDisplayText="",this._dateManaged=!1,this._telDisplayText="",this._telManaged=!1,this._hasVisibleError=!1},onRestore:e=>{this.value=e,this.inputType==="date"&&e&&this._restoreDateDisplay(e),this.inputType==="tel"&&e&&this._restoreTelDisplay(e)},onDisabled:e=>{this.disabled=e}}),this.formItemDescription=new M({host:this,getTarget:()=>this.theInput.value}),this._hasVisibleError=!1,this._datePattern=null,this._dateDisplayText="",this._dateManaged=!1,this._phoneLocalitiesCache=null,this._telDisplayText="",this._telManaged=!1,this.fieldName="",this.icon="",this.iconLabel="",this.inputType="text",this.forceLowercase=!1,this.value="",this.name="",this.required=!1,this.requiredMessage="",this.validationMessage="",this.disabled=!1,this.readonly=!1,this._trackVisibleError=e=>{const t=e.detail;this._hasVisibleError=!t.valid}}_getDatePattern(){return this._datePattern||(this._datePattern=S()),this._datePattern}_getPhoneLocalities(){if(!this._phoneLocalitiesCache){const e=this.telLocalities?this.telLocalities.trim().split(/\s+/):void 0;this._phoneLocalitiesCache=$(e)}return this._phoneLocalitiesCache}get _nativeInputType(){return this.inputType==="date"?"text":this.inputType}get _effectiveInputmode(){if(this.inputmode)return this.inputmode;switch(this.inputType){case"email":return"email";case"url":return"url";case"tel":return"tel";case"number":return"decimal";case"date":return"numeric";default:return}}get _displayValue(){return this.inputType==="date"?this._dateDisplayText:this.inputType==="tel"?this._telDisplayText:this.value}get _effectivePlaceholder(){if(this.placeholder!==void 0)return this.placeholder;if(this.inputType==="date")return this._getDatePattern().placeholder;if(this.inputType==="tel"){const e=this._getPhoneLocalities();return e.length>0?e[0].placeholder:void 0}}handleInput(e){const t=e.target;if(this.readonly){t.value=this._displayValue;return}let i=t.value;if(this.inputType==="date"){const a=i.replace(/[^\d/\-.\s]/g,"");if(a!==i){const l=i.length-a.length,o=Math.max(0,(t.selectionStart??a.length)-l);t.value=a,t.setSelectionRange(o,o),i=a}this._dateDisplayText=i,this._dateManaged=!0,i||(this.value="",this._syncInput());return}if(this.inputType==="tel"){const a=i.replace(/[^\d+\-.()\s]/g,"");if(a!==i){const l=i.length-a.length,o=Math.max(0,(t.selectionStart??a.length)-l);t.value=a,t.setSelectionRange(o,o),i=a}this._telDisplayText=i,this._telManaged=!0,i||(this.value="",this._syncInput());return}this.forceLowercase&&(i=i.toLowerCase()),this.value=t.value=i,this._syncInput()}_syncInput(){this._hasVisibleError?this.formCtrl.syncValue():this.formCtrl.syncValueSilently(),this.emitValueChanged(this.value)}_handleBlur(){this.inputType==="date"&&this._finalizeDateValue(),this.inputType==="tel"&&this._finalizeTelValue(),this.formCtrl.syncValue()}_finalizeDateValue(){const e=this._dateDisplayText;if(!e.trim()){this.value="",this._dateDisplayText="",this._dateManaged=!1,this.emitValueChanged(this.value);return}const t=this._getDatePattern(),i=L(e,t);i?(this._dateDisplayText=d(i,t),this.value=i.toString()):this.value=e,this._dateManaged=!0,this.requestUpdate(),this.emitValueChanged(this.value)}_finalizeTelValue(){const e=this._telDisplayText;if(!e.trim()){this.value="",this._telDisplayText="",this._telManaged=!1,this.emitValueChanged(this.value);return}const t=this._getPhoneLocalities(),i=V(e,t);i?(this._telDisplayText=i.displayText,this.value=i.e164):this.value=e,this._telManaged=!0,this.requestUpdate(),this.emitValueChanged(this.value)}_getValidity(){if(this.inputType==="date")return this._getDateValidity();if(this.inputType==="tel")return this._getTelValidity();const e=this.theInput.value;if(e&&!e.validity.valid){const t=e.validity,i={valueMissing:t.valueMissing,typeMismatch:t.typeMismatch,patternMismatch:t.patternMismatch,tooLong:t.tooLong,tooShort:t.tooShort,rangeUnderflow:t.rangeUnderflow,rangeOverflow:t.rangeOverflow,stepMismatch:t.stepMismatch,badInput:t.badInput};return{flags:i,message:this._getFriendlyMessage(i)}}return this.required&&!this.value?{flags:{valueMissing:!0},message:this.requiredMessage||"Please fill out this field."}:null}_getFriendlyMessage(e){if(e.valueMissing)return this.requiredMessage||"Please fill out this field.";if(e.typeMismatch){if(this.validationMessage)return this.validationMessage;switch(this.inputType){case"email":return"Please enter a valid email address.";case"url":return"Please enter a valid URL.";case"number":return"Please enter a valid number.";case"tel":return"Please enter a valid phone number.";default:return"Please enter a valid value."}}return e.patternMismatch?this.validationMessage||"Please match the requested format.":e.tooShort?`Must be at least ${this.minlength} characters.`:e.tooLong?`Must be no more than ${this.maxlength} characters.`:e.rangeUnderflow?`Value must be ${this.min} or greater.`:e.rangeOverflow?`Value must be ${this.max} or less.`:(e.stepMismatch||e.badInput,"Please enter a valid value.")}_getDateValidity(){if(this.required&&!this.value)return{flags:{valueMissing:!0},message:this.requiredMessage||"Please fill out this field."};if(!this.value)return null;let e;try{e=Temporal.PlainDate.from(this.value)}catch{return{flags:{typeMismatch:!0},message:this.validationMessage||"Please enter a valid date."}}if(this.min)try{const t=Temporal.PlainDate.from(this.min);if(Temporal.PlainDate.compare(e,t)<0){const i=this._getDatePattern(),a=d(t,i);return{flags:{rangeUnderflow:!0},message:`Date must be ${a} or later.`}}}catch{}if(this.max)try{const t=Temporal.PlainDate.from(this.max);if(Temporal.PlainDate.compare(e,t)>0){const i=this._getDatePattern(),a=d(t,i);return{flags:{rangeOverflow:!0},message:`Date must be ${a} or earlier.`}}}catch{}return null}_getTelValidity(){return this.required&&!this.value?{flags:{valueMissing:!0},message:this.requiredMessage||"Please fill out this field."}:this.value?/^\+\d+$/.test(this.value)?null:{flags:{typeMismatch:!0},message:this.validationMessage||"Please enter a valid phone number."}:null}focus(e){this.focusResolvedElementAfterUpdate(()=>this.theInput.value,e)}setFormItemDescription(e){this.formItemDescription.setDescription(e)}setFormItemLabel(e){this.formItemDescription.setLabel(e)}validate(){this.formCtrl.validate()}checkValidity(){return this.formCtrl.checkValidity()}formResetCallback(){this.formCtrl.handleFormReset()}formStateRestoreCallback(e){this.formCtrl.handleFormStateRestore(e)}formDisabledCallback(e){this.formCtrl.handleFormDisabled(e)}connectedCallback(){super.connectedCallback(),this.addEventListener("esp-validity-changed",this._trackVisibleError),this.inputType==="date"&&this.value&&this._restoreDateDisplay(this.value),this.inputType==="tel"&&this.value&&this._restoreTelDisplay(this.value)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("esp-validity-changed",this._trackVisibleError)}updated(e){super.updated(e),e.has("value")&&this.inputType==="date"&&!this._dateManaged&&this._restoreDateDisplay(this.value),e.has("value")&&this.inputType==="tel"&&!this._telManaged&&this._restoreTelDisplay(this.value),e.has("telLocalities")&&(this._phoneLocalitiesCache=null),this._dateManaged=!1,this._telManaged=!1}_restoreDateDisplay(e){if(!e){this._dateDisplayText="";return}try{const t=Temporal.PlainDate.from(e),i=this._getDatePattern();this._dateDisplayText=d(t,i)}catch{this._dateDisplayText=e}}_restoreTelDisplay(e){if(!e){this._telDisplayText="";return}const t=this._getPhoneLocalities();this._telDisplayText=w(e,t)}_handleIconClick(){this.disabled||!(this.hasIconSlotContent||v(this.icon,this).length>0)||this.dispatchEvent(new CustomEvent(I.INPUT_ICON_CLICKED,{bubbles:!0,composed:!0}))}get hasIconSlotContent(){return this.iconSlot.hasSlottedIcon(":scope > :not([slot]), :scope > [slot='']")}_getIconButtonLabel(){const e=this.iconLabel.trim();if(e)return e;const t=this.icon.trim();return t?`${this._humanizeIconName(t)} action`:"Input icon action"}_humanizeIconName(e){const t=e.replace(/[-_]+/gu," ").trim();return t?t.charAt(0).toUpperCase()+t.slice(1):"Icon"}render(){const e=this.inputType==="date",t=this.inputType==="number",i=this.inputType==="tel",a=e||t||i,l=v(this.icon,this),o=this.hasIconSlotContent,u=o||l.length>0,m=this._getIconButtonLabel();return c`
+var r=function(h,e,t,i){var a=arguments.length,l=a<3?e:i===null?i=Object.getOwnPropertyDescriptor(e,t):i,o;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")l=Reflect.decorate(h,e,t,i);else for(var p=h.length-1;p>=0;p--)(o=h[p])&&(l=(a<3?o(l):a>3?o(e,t,l):o(e,t))||l);return a>3&&l&&Object.defineProperty(e,t,l),l};import{css as _,html as c,nothing as b}from"lit";import{customElement as D,property as n,state as y}from"lit/decorators.js";import{ifDefined as u}from"lit/directives/if-defined.js";import{live as T}from"lit/directives/live.js";import{createRef as I,ref as f}from"lit/directives/ref.js";import{EspalierElementBase as v}from"../shared/esp-element-base.js";import{FormFieldController as x}from"../shared/form-field-controller.js";import{ESP_EVENTS as C}from"../shared/events.js";import{FormFieldDescriptionController as w}from"../shared/form-field-description-controller.js";import{getIconHrefForHost as g}from"../shared/intent-values.js";import{SlottedIconController as P}from"../shared/slotted-icon-controller.js";import{renderSpriteIcon as V}from"../shared/svgs/render-sprite-icon.js";import{detectDatePattern as S,parseDateInput as L,formatDateForLocale as d}from"./date-locale.js";import{getPhoneLocalities as M,parsePhoneInput as $,formatPhoneForLocale as E}from"./tel-locale.js";const q={fromAttribute(h){if(h!==null)return h.trim().toLowerCase()==="any"?"any":Number(h)},toAttribute(h){return h===void 0?void 0:String(h)}};let s=class extends v{constructor(){super(...arguments),this.internals=this.attachInternals(),this.theInput=I(),this.iconSlot=new P(this),this.formCtrl=new x({host:this,internals:this.internals,getFormValue:()=>this.value||null,getValidity:()=>this._getValidity(),getValidationAnchor:()=>this.theInput.value??this,onReset:()=>{this.value="",this._dateDisplayText="",this._telDisplayText="",this._hasVisibleError=!1},onRestore:e=>{this.value=e,this.inputType==="date"&&e&&this._restoreDateDisplay(e),this.inputType==="tel"&&e&&this._restoreTelDisplay(e)},onDisabled:e=>{this.disabled=e}}),this.formItemDescription=new w({host:this,getTarget:()=>this.theInput.value}),this._hasVisibleError=!1,this._datePattern=null,this._dateDisplayText="",this._ownValue=null,this._phoneLocalitiesCache=null,this._telDisplayText="",this.fieldName="",this.icon="",this.iconLabel="",this.inputType="text",this.forceLowercase=!1,this.value="",this.name="",this.required=!1,this.requiredMessage="",this.validationMessage="",this.disabled=!1,this.readonly=!1,this._trackVisibleError=e=>{const t=e.detail;this._hasVisibleError=!t.valid}}_getDatePattern(){return this._datePattern||(this._datePattern=S()),this._datePattern}_getPhoneLocalities(){if(!this._phoneLocalitiesCache){const e=this.telLocalities?this.telLocalities.trim().split(/\s+/):void 0;this._phoneLocalitiesCache=M(e)}return this._phoneLocalitiesCache}get _nativeInputType(){return this.inputType==="date"?"text":this.inputType}get _effectiveInputmode(){if(this.inputmode)return this.inputmode;switch(this.inputType){case"email":return"email";case"url":return"url";case"tel":return"tel";case"number":return"decimal";case"date":return"numeric";default:return}}get _displayValue(){return this.inputType==="date"?this._dateDisplayText:this.inputType==="tel"?this._telDisplayText:this.value}get _effectivePlaceholder(){if(this.placeholder!==void 0)return this.placeholder;if(this.inputType==="date")return this._getDatePattern().placeholder;if(this.inputType==="tel"){const e=this._getPhoneLocalities();return e.length>0?e[0].placeholder:void 0}}handleInput(e){const t=e.target;if(this.readonly){t.value=this._displayValue;return}let i=t.value;if(this.inputType==="date"){const a=i.replace(/[^\d/\-.\s]/g,"");if(a!==i){const l=i.length-a.length,o=Math.max(0,(t.selectionStart??a.length)-l);t.value=a,t.setSelectionRange(o,o),i=a}this._dateDisplayText=i,i||(this.value=this._ownValue="",this._syncInput());return}if(this.inputType==="tel"){const a=i.replace(/[^\d+\-.()\s]/g,"");if(a!==i){const l=i.length-a.length,o=Math.max(0,(t.selectionStart??a.length)-l);t.value=a,t.setSelectionRange(o,o),i=a}this._telDisplayText=i,i||(this.value=this._ownValue="",this._syncInput());return}this.forceLowercase&&(i=i.toLowerCase()),t.value!==i&&(t.value=i),this.value=i,this._syncInput()}_syncInput(){this._hasVisibleError?this.formCtrl.syncValue():this.formCtrl.syncValueSilently(),this.emitValueChanged(this.value)}_handleBlur(){this.inputType==="date"&&this._finalizeDateValue(),this.inputType==="tel"&&this._finalizeTelValue(),this.formCtrl.syncValue()}_finalizeDateValue(){const e=this._dateDisplayText;if(!e.trim()){this.value=this._ownValue="",this._dateDisplayText="",this.emitValueChanged(this.value);return}const t=this._getDatePattern(),i=L(e,t);i?(this._dateDisplayText=d(i,t),this.value=i.toString()):this.value=e,this._ownValue=this.value,this.requestUpdate(),this.emitValueChanged(this.value)}_finalizeTelValue(){const e=this._telDisplayText;if(!e.trim()){this.value=this._ownValue="",this._telDisplayText="",this.emitValueChanged(this.value);return}const t=this._getPhoneLocalities(),i=$(e,t);i?(this._telDisplayText=i.displayText,this.value=i.e164):this.value=e,this._ownValue=this.value,this.requestUpdate(),this.emitValueChanged(this.value)}_getValidity(){if(this.inputType==="date")return this._getDateValidity();if(this.inputType==="tel")return this._getTelValidity();const e=this.theInput.value;if(e&&!e.validity.valid){const t=e.validity,i={valueMissing:t.valueMissing,typeMismatch:t.typeMismatch,patternMismatch:t.patternMismatch,tooLong:t.tooLong,tooShort:t.tooShort,rangeUnderflow:t.rangeUnderflow,rangeOverflow:t.rangeOverflow,stepMismatch:t.stepMismatch,badInput:t.badInput};return{flags:i,message:this._getFriendlyMessage(i)}}return this.required&&!this.value?{flags:{valueMissing:!0},message:this.requiredMessage||"Please fill out this field."}:null}_getFriendlyMessage(e){if(e.valueMissing)return this.requiredMessage||"Please fill out this field.";if(e.typeMismatch){if(this.validationMessage)return this.validationMessage;switch(this.inputType){case"email":return"Please enter a valid email address.";case"url":return"Please enter a valid URL.";case"number":return"Please enter a valid number.";case"tel":return"Please enter a valid phone number.";default:return"Please enter a valid value."}}return e.patternMismatch?this.validationMessage||"Please match the requested format.":e.tooShort?`Must be at least ${this.minlength} characters.`:e.tooLong?`Must be no more than ${this.maxlength} characters.`:e.rangeUnderflow?`Value must be ${this.min} or greater.`:e.rangeOverflow?`Value must be ${this.max} or less.`:(e.stepMismatch||e.badInput,"Please enter a valid value.")}_getDateValidity(){if(this.required&&!this.value)return{flags:{valueMissing:!0},message:this.requiredMessage||"Please fill out this field."};if(!this.value)return null;let e;try{e=Temporal.PlainDate.from(this.value)}catch{return{flags:{typeMismatch:!0},message:this.validationMessage||"Please enter a valid date."}}if(this.min)try{const t=Temporal.PlainDate.from(this.min);if(Temporal.PlainDate.compare(e,t)<0){const i=this._getDatePattern(),a=d(t,i);return{flags:{rangeUnderflow:!0},message:`Date must be ${a} or later.`}}}catch{}if(this.max)try{const t=Temporal.PlainDate.from(this.max);if(Temporal.PlainDate.compare(e,t)>0){const i=this._getDatePattern(),a=d(t,i);return{flags:{rangeOverflow:!0},message:`Date must be ${a} or earlier.`}}}catch{}return null}_getTelValidity(){return this.required&&!this.value?{flags:{valueMissing:!0},message:this.requiredMessage||"Please fill out this field."}:this.value?/^\+\d+$/.test(this.value)?null:{flags:{typeMismatch:!0},message:this.validationMessage||"Please enter a valid phone number."}:null}focus(e){this.focusResolvedElementAfterUpdate(()=>this.theInput.value,e)}setFormItemDescription(e){this.formItemDescription.setDescription(e)}setFormItemInvalid(e){this.formItemDescription.setInvalid(e)}setFormItemLabel(e){this.formItemDescription.setLabel(e)}validate(){this.formCtrl.validate()}checkValidity(){return this.formCtrl.checkValidity()}formResetCallback(){this.formCtrl.handleFormReset()}formStateRestoreCallback(e){this.formCtrl.handleFormStateRestore(e)}formDisabledCallback(e){this.formCtrl.handleFormDisabled(e)}connectedCallback(){super.connectedCallback(),this.addEventListener("esp-validity-changed",this._trackVisibleError),this.inputType==="date"&&this.value&&this._restoreDateDisplay(this.value),this.inputType==="tel"&&this.value&&this._restoreTelDisplay(this.value)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("esp-validity-changed",this._trackVisibleError)}updated(e){super.updated(e);const t=this._ownValue;this._ownValue=null,e.has("value")&&this.value!==t&&(this.inputType==="date"&&this._restoreDateDisplay(this.value),this.inputType==="tel"&&this._restoreTelDisplay(this.value)),e.has("telLocalities")&&(this._phoneLocalitiesCache=null)}_restoreDateDisplay(e){if(!e){this._dateDisplayText="";return}try{const t=Temporal.PlainDate.from(e),i=this._getDatePattern();this._dateDisplayText=d(t,i)}catch{this._dateDisplayText=e}}_restoreTelDisplay(e){if(!e){this._telDisplayText="";return}const t=this._getPhoneLocalities();this._telDisplayText=E(e,t)}_handleIconClick(){this.disabled||!(this.hasIconSlotContent||g(this.icon,this).length>0)||this.dispatchEvent(new CustomEvent(C.INPUT_ICON_CLICKED,{bubbles:!0,composed:!0}))}get hasIconSlotContent(){return this.iconSlot.hasSlottedIcon(":scope > :not([slot]), :scope > [slot='']")}_getIconButtonLabel(){const e=this.iconLabel.trim();if(e)return e;const t=this.icon.trim();return t?`${this._humanizeIconName(t)} action`:"Input icon action"}_humanizeIconName(e){const t=e.replace(/[-_]+/gu," ").trim();return t?t.charAt(0).toUpperCase()+t.slice(1):"Icon"}render(){const e=this.inputType==="date",t=this.inputType==="number",i=this.inputType==="tel",a=e||t||i,l=g(this.icon,this),o=this.hasIconSlotContent,p=o||l.length>0,m=this._getIconButtonLabel();return c`
       <div class="esp-field">
         <input
           id=${this.fieldName}
           ${f(this.theInput)}
-          .value=${this._displayValue}
+          .value=${T(this._displayValue)}
           @input=${this.handleInput}
           @blur=${this._handleBlur}
           type=${this._nativeInputType}
-          placeholder=${h(this._effectivePlaceholder)}
-          inputmode=${h(this._effectiveInputmode)}
-          pattern=${h(a?void 0:this.pattern)}
-          minlength=${h(a?void 0:this.minlength)}
-          maxlength=${h(a?void 0:this.maxlength)}
-          min=${h(e||i?void 0:this.min)}
-          max=${h(e||i?void 0:this.max)}
-          step=${h(e||i?void 0:this.step)}
+          placeholder=${u(this._effectivePlaceholder)}
+          inputmode=${u(this._effectiveInputmode)}
+          pattern=${u(a?void 0:this.pattern)}
+          minlength=${u(a?void 0:this.minlength)}
+          maxlength=${u(a?void 0:this.maxlength)}
+          min=${u(e||i?void 0:this.min)}
+          max=${u(e||i?void 0:this.max)}
+          step=${u(e||i?void 0:this.step)}
           ?required=${this.required}
           ?disabled=${this.disabled}
           ?readonly=${this.readonly}
         />
-        ${u?c`
+        ${p?c`
               <button
                 class="icon-action"
                 type="button"
@@ -32,7 +32,7 @@ var r=function(p,e,t,i){var a=arguments.length,l=a<3?e:i===null?i=Object.getOwnP
                   ${f(this.iconSlot.slotRef)}
                   @slotchange=${this.iconSlot.handleSlotChange}
                 ></slot>
-                ${!o&&l?P(l):b}
+                ${!o&&l?V(l):b}
               </button>
             `:c`
               <span class="icon-slot-probe" hidden>
@@ -43,7 +43,7 @@ var r=function(p,e,t,i){var a=arguments.length,l=a<3?e:i===null?i=Object.getOwnP
               </span>
             `}
       </div>
-    `}};s.formAssociated=!0,s.styles=[...y.styles,_`
+    `}};s.formAssociated=!0,s.styles=[...v.styles,_`
       .esp-field {
         margin: 1px;
         display: grid;
@@ -88,4 +88,4 @@ var r=function(p,e,t,i){var a=arguments.length,l=a<3?e:i===null?i=Object.getOwnP
           }
         }
       }
-    `],r([g()],s.prototype,"_dateDisplayText",void 0),r([g()],s.prototype,"_telDisplayText",void 0),r([n({attribute:"field-name",type:String})],s.prototype,"fieldName",void 0),r([n({type:String})],s.prototype,"icon",void 0),r([n({attribute:"icon-label",type:String})],s.prototype,"iconLabel",void 0),r([n({attribute:"input-type",type:String})],s.prototype,"inputType",void 0),r([n({type:String})],s.prototype,"placeholder",void 0),r([n({attribute:"force-lowercase",type:Boolean})],s.prototype,"forceLowercase",void 0),r([n({type:String})],s.prototype,"value",void 0),r([n({type:String,reflect:!0})],s.prototype,"name",void 0),r([n({type:Boolean,reflect:!0})],s.prototype,"required",void 0),r([n({attribute:"required-message"})],s.prototype,"requiredMessage",void 0),r([n({attribute:"validation-message"})],s.prototype,"validationMessage",void 0),r([n({type:Boolean,reflect:!0})],s.prototype,"disabled",void 0),r([n({type:Boolean,reflect:!0})],s.prototype,"readonly",void 0),r([n({type:String})],s.prototype,"pattern",void 0),r([n({type:Number})],s.prototype,"minlength",void 0),r([n({type:Number})],s.prototype,"maxlength",void 0),r([n({type:String})],s.prototype,"min",void 0),r([n({type:String})],s.prototype,"max",void 0),r([n({type:Number})],s.prototype,"step",void 0),r([n({type:String})],s.prototype,"inputmode",void 0),r([n({attribute:"tel-localities",type:String})],s.prototype,"telLocalities",void 0),s=r([D("esp-input")],s);export{s as EspalierInput};
+    `],r([y()],s.prototype,"_dateDisplayText",void 0),r([y()],s.prototype,"_telDisplayText",void 0),r([n({attribute:"field-name",type:String})],s.prototype,"fieldName",void 0),r([n({type:String})],s.prototype,"icon",void 0),r([n({attribute:"icon-label",type:String})],s.prototype,"iconLabel",void 0),r([n({attribute:"input-type",type:String})],s.prototype,"inputType",void 0),r([n({type:String})],s.prototype,"placeholder",void 0),r([n({attribute:"force-lowercase",type:Boolean})],s.prototype,"forceLowercase",void 0),r([n({type:String})],s.prototype,"value",void 0),r([n({type:String,reflect:!0})],s.prototype,"name",void 0),r([n({type:Boolean,reflect:!0})],s.prototype,"required",void 0),r([n({attribute:"required-message"})],s.prototype,"requiredMessage",void 0),r([n({attribute:"validation-message"})],s.prototype,"validationMessage",void 0),r([n({type:Boolean,reflect:!0})],s.prototype,"disabled",void 0),r([n({type:Boolean,reflect:!0})],s.prototype,"readonly",void 0),r([n({type:String})],s.prototype,"pattern",void 0),r([n({type:Number})],s.prototype,"minlength",void 0),r([n({type:Number})],s.prototype,"maxlength",void 0),r([n({type:String})],s.prototype,"min",void 0),r([n({type:String})],s.prototype,"max",void 0),r([n({converter:q})],s.prototype,"step",void 0),r([n({type:String})],s.prototype,"inputmode",void 0),r([n({attribute:"tel-localities",type:String})],s.prototype,"telLocalities",void 0),s=r([D("esp-input")],s);export{s as EspalierInput};

package/dist/menu/esp-menu.d.ts

@@ -173,9 +173,6 @@ export declare class EspalierMenu extends EspalierElementBase {
      */
     get sliding(): boolean;
     set sliding(value: boolean);
-    /** Compatibility alias for the old vertical menu drawer state. */
-    get collapsed(): boolean;
-    set collapsed(value: boolean);
     connectedCallback(): void;
     disconnectedCallback(): void;
     protected firstUpdated(props: PropertyValues): void;
@@ -191,8 +188,6 @@ export declare class EspalierMenu extends EspalierElementBase {
     closeDrawer(): void;
     /** Toggle the drawer overlay open or closed. */
     toggleDrawer(trigger?: HTMLElement | null): void;
-    /** Compatibility alias used by the old header menu integration. */
-    toggleOpened(): void;
     /** Whether the drawer is currently open. */
     get isDrawerOpen(): boolean;
     /** Width needed by the inline rail, used by `esp-header`. */