@taprootio/espalier 4.20.2 → 6.0.0

package/dist/pickers/esp-picker-base.js

@@ -1,11 +1,11 @@
-var l=function(m,e,t,r){var o=arguments.length,i=o<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,n;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(m,e,t,r);else for(var h=m.length-1;h>=0;h--)(n=m[h])&&(i=(o<3?n(i):o>3?n(e,t,i):n(e,t))||i);return o>3&&i&&Object.defineProperty(e,t,i),i};import{createRef as d}from"lit/directives/ref.js";import{EspalierElementBase as w}from"../shared/esp-element-base.js";import{property as a,state as u}from"lit/decorators.js";import{EspalierPickerItem as I}from"./esp-picker-item.js";import{css as P,html as C,unsafeCSS as R}from"lit";import{findContainingPopovers as F,PopoverController as A}from"../shared/popover-controller.js";import{scrollToContainAnchoredSurface as S,viewportSize as y}from"../shared/viewport.js";import{FormFieldController as O}from"../shared/form-field-controller.js";import{FormFieldDescriptionController as _}from"../shared/form-field-description-controller.js";import{TypeaheadController as M}from"./typeahead-controller.js";import{COMPACT_VIEWPORT_MEDIA_QUERY as z}from"../shared/responsive.js";import{cancelSVG as x}from"../shared/svgs/cancel.js";import{quietCloseButton as E}from"../shared/style-fragments.js";import{ScrollLock as g}from"../shared/overlay-controller.js";class s extends w{constructor(){super(...arguments),this.internals=this.attachInternals(),this.formCtrl=new O({host:this,internals:this.internals,getFormValue:()=>this.getPickerFormValue(),getValidity:()=>this.getPickerValidity(),onReset:()=>this.handlePickerReset(),onRestore:e=>this.handlePickerRestore(e),onDisabled:e=>{this.disabled=e}}),this.formItemDescription=new _({host:this,getTarget:()=>this.theInput.value}),this._showOptions=!1,this.itemsSlot=d(),this.pickerMenu=d(),this.theInput=d(),this.pickerField=d(),this._lastViewportHeight=0,this._containRepositionFrame=null,this.fullscreenPlaceholderInlineSize=0,this.fullscreenPlaceholderViewportWidth=0,this.fullscreenPlaceholderFieldHeight=0,this.fullscreenPlaceholderEntryInlineSize=0,this.fullscreenPlaceholderContentSized=!1,this.popoverCtrl=new A({host:this,closeStrategy:"source-identity",isOpen:()=>this._showOptions,onShouldClose:()=>{this.showOptions=!1},onPositionUpdate:()=>{this.pickerMenu.value?.updatePosition(this);const{height:e}=y();if(this.pickerMenu.value?.hasAttribute("data-fullscreen")){this._lastViewportHeight=e;return}if(this._lastViewportHeight!==0&&e!==this._lastViewportHeight){const t=this._lastViewportHeight-e;t>=s.KEYBOARD_THRESHOLD?(this._scrollToContainPopover(),this._lastViewportHeight=e):t<0&&(this._lastViewportHeight=e)}},getPositionElements:()=>this.hasAttribute("data-picker-menu-fullscreen")?[this.pickerField.value]:[this.pickerMenu.value],getInsideElements:()=>[this.pickerMenu.value??null],onOutsideClick:()=>{this.closeAndResetTypeahead(),requestAnimationFrame(()=>{const e=document.activeElement;!this.showOptions&&(e===null||e===document.body||e===this)&&this.theInput.value?.focus()})}}),this.typeaheadLoading=!1,this.filteredItems=[],this.inputFocused=!1,this.typeaheadCtrl=new M({host:this,onFilteredItemsChanged:e=>{this.filteredItems=this.decorateFilteredItems(e)},onLoadingChanged:e=>{this.typeaheadLoading=e}}),this.typeahead=!1,this.fetchItems=null,this.debounceMs=void 0,this.handleTypeaheadInput=e=>{this.typeahead&&(this.typeaheadCtrl.setQuery(e.target.value),this.showOptions||(this.showOptions=!0))},this.handleInputBlur=e=>{this.inputFocused=!1;const t=e.relatedTarget;if(!(t&&(this.contains(t)||this.shadowRoot?.contains(t)))){if(t&&this.showOptions){requestAnimationFrame(()=>{this.showOptions&&this.closeAndResetTypeahead()});return}if(!t&&this.showOptions){requestAnimationFrame(()=>{this.showOptions&&this.shadowRoot?.activeElement!==this.theInput.value&&this.closeAndResetTypeahead()});return}this.closeAndResetTypeahead()}},this.handleMenuDismissRequested=e=>{e.preventDefault(),e.stopPropagation(),this.dismissMenu()},this.name="",this.required=!1,this.requiredMessage="",this.disabled=!1,this.pickerItems=[],this.placeholder="Choose...",this.width="",this._slotExtractPending=!1}getPickerFormValue(){return null}getPickerValidity(){return null}handlePickerReset(){}handlePickerRestore(e){}formResetCallback(){this.formCtrl.handleFormReset()}formStateRestoreCallback(e){this.formCtrl.handleFormStateRestore(e)}formDisabledCallback(e){this.formCtrl.handleFormDisabled(e)}get showOptions(){return this._showOptions}set showOptions(e){if(e&&this.disabled)return;const t=this._showOptions;this._showOptions=e;const r=this.theInput.value;r&&(r.ariaExpanded=String(e)),e&&this.pickerMenu.value?(this.popoverCtrl.publishCloseOthers(F(this)),this.pickerMenu.value.positionSelf(this),this._lastViewportHeight=y().height,this.clearActiveDescendant(),this.popoverCtrl.startTracking(),this.popoverCtrl.startOutsideClick()):!e&&this.pickerMenu.value&&(this._containRepositionFrame!==null&&(cancelAnimationFrame(this._containRepositionFrame),this._containRepositionFrame=null),this.popoverCtrl.stopTracking(),this.popoverCtrl.stopOutsideClick(),this.pickerMenu.value.hideMenu(),this.clearActiveDescendant(),this._lastViewportHeight=0),e&&!t&&this.typeahead&&this.typeaheadCtrl.isRemote&&this.filteredItems.length===0&&this.typeaheadCtrl.fetchInitial()}get preservesRemoteResultsOnReset(){return this.typeaheadIsRemote}get typeaheadIsRemote(){return this.typeaheadCtrl.isRemote}refreshTypeaheadItems(){this.typeaheadCtrl.setAllItems(this.pickerItems)}fetchInitialTypeaheadItems(){this.typeaheadCtrl.fetchInitial()}resetTypeaheadInput(){const e=this.theInput.value;e&&(e.value=this.typeaheadRestoreText),this.preservesRemoteResultsOnReset?this.typeaheadCtrl.resetQuery():this.typeaheadCtrl.clearQuery()}closeAndResetTypeahead(){this.showOptions=!1,this.typeahead&&this.resetTypeaheadInput()}dismissMenu(){this.closeAndResetTypeahead(),this.theInput.value?.focus()}renderPickerMenuDismissButton(){return C`<button
+var l=function(y,e,t,i){var n=arguments.length,s=n<3?e:i===null?i=Object.getOwnPropertyDescriptor(e,t):i,r;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")s=Reflect.decorate(y,e,t,i);else for(var h=y.length-1;h>=0;h--)(r=y[h])&&(s=(n<3?r(s):n>3?r(e,t,s):r(e,t))||s);return n>3&&s&&Object.defineProperty(e,t,s),s};import{createRef as m}from"lit/directives/ref.js";import{EspalierElementBase as P}from"../shared/esp-element-base.js";import{property as a,state as f}from"lit/decorators.js";import{adoptPickerItem as C,EspalierPickerItem as R,pickerItemDisplay as g,pickerItemValue as b,samePickerItemDisplay as F}from"./esp-picker-item.js";import{css as O,html as S,unsafeCSS as A}from"lit";import{findContainingPopovers as M,PopoverController as x}from"../shared/popover-controller.js";import{scrollToContainAnchoredSurface as E,viewportSize as v}from"../shared/viewport.js";import{FormFieldController as _}from"../shared/form-field-controller.js";import{FormFieldDescriptionController as z}from"../shared/form-field-description-controller.js";import{TypeaheadController as D}from"./typeahead-controller.js";import{COMPACT_VIEWPORT_MEDIA_QUERY as T}from"../shared/responsive.js";import{cancelSVG as V}from"../shared/svgs/cancel.js";import{quietCloseButton as H}from"../shared/style-fragments.js";import{ScrollLock as I}from"../shared/overlay-controller.js";class o extends P{constructor(){super(...arguments),this.internals=this.attachInternals(),this.formCtrl=new _({host:this,internals:this.internals,getFormValue:()=>this.getPickerFormValue(),getValidity:()=>this.getPickerValidity(),onReset:()=>this.handlePickerReset(),onRestore:e=>this.handlePickerRestore(e),onDisabled:e=>{this.disabled=e}}),this.formItemDescription=new z({host:this,getTarget:()=>this.theInput.value}),this._showOptions=!1,this.itemsSlot=m(),this.pickerMenu=m(),this.theInput=m(),this.pickerField=m(),this._lastViewportHeight=0,this._containRepositionFrame=null,this.fullscreenPlaceholderInlineSize=0,this.fullscreenPlaceholderViewportWidth=0,this.fullscreenPlaceholderFieldHeight=0,this.fullscreenPlaceholderEntryInlineSize=0,this.fullscreenPlaceholderContentSized=!1,this.popoverCtrl=new x({host:this,closeStrategy:"source-identity",isOpen:()=>this._showOptions,onShouldClose:()=>{this.showOptions=!1},onPositionUpdate:()=>{this.pickerMenu.value?.updatePosition(this);const{height:e}=v();if(this.pickerMenu.value?.hasAttribute("data-fullscreen")){this._lastViewportHeight=e;return}if(this._lastViewportHeight!==0&&e!==this._lastViewportHeight){const t=this._lastViewportHeight-e;t>=o.KEYBOARD_THRESHOLD?(this._scrollToContainPopover(),this._lastViewportHeight=e):t<0&&(this._lastViewportHeight=e)}},getPositionElements:()=>this.hasAttribute("data-picker-menu-fullscreen")?[this.pickerField.value]:[this.pickerMenu.value],getInsideElements:()=>[this.pickerMenu.value??null],onOutsideClick:()=>{this.closeAndResetTypeahead(),requestAnimationFrame(()=>{const e=document.activeElement;!this.showOptions&&(e===null||e===document.body||e===this)&&this.theInput.value?.focus()})}}),this.typeaheadLoading=!1,this.filteredItems=[],this.inputFocused=!1,this.typeaheadCtrl=new D({host:this,onFilteredItemsChanged:e=>{this.filteredItems=this.decorateFilteredItems(e)},onLoadingChanged:e=>{this.typeaheadLoading=e}}),this.typeahead=!1,this.fetchItems=null,this.debounceMs=void 0,this.handleTypeaheadInput=e=>{this.typeahead&&(this.typeaheadCtrl.setQuery(e.target.value),this.showOptions||(this.showOptions=!0))},this.handleInputBlur=e=>{this.inputFocused=!1;const t=e.relatedTarget;if(!(t&&(this.contains(t)||this.shadowRoot?.contains(t)))){if(t&&this.showOptions){requestAnimationFrame(()=>{this.showOptions&&this.closeAndResetTypeahead()});return}if(!t&&this.showOptions){requestAnimationFrame(()=>{this.showOptions&&this.shadowRoot?.activeElement!==this.theInput.value&&this.closeAndResetTypeahead()});return}this.closeAndResetTypeahead()}},this.handleMenuDismissRequested=e=>{e.preventDefault(),e.stopPropagation(),this.dismissMenu()},this.name="",this.required=!1,this.requiredMessage="",this.disabled=!1,this.pickerItems=[],this.placeholder="Choose...",this.width="",this._slotExtractPending=!1,this.extractedElements=new WeakMap,this.recordElements=new WeakMap}getPickerFormValue(){return null}getPickerValidity(){return null}handlePickerReset(){}handlePickerRestore(e){}formResetCallback(){this.formCtrl.handleFormReset()}formStateRestoreCallback(e){this.formCtrl.handleFormStateRestore(e)}formDisabledCallback(e){this.formCtrl.handleFormDisabled(e)}get showOptions(){return this._showOptions}set showOptions(e){if(e&&this.disabled)return;const t=this._showOptions;this._showOptions=e;const i=this.theInput.value;i&&(i.ariaExpanded=String(e)),e&&this.pickerMenu.value?(this.popoverCtrl.publishCloseOthers(M(this)),this.pickerMenu.value.positionSelf(this),this._lastViewportHeight=v().height,this.clearActiveDescendant(),this.popoverCtrl.startTracking(),this.popoverCtrl.startOutsideClick()):!e&&this.pickerMenu.value&&(this._containRepositionFrame!==null&&(cancelAnimationFrame(this._containRepositionFrame),this._containRepositionFrame=null),this.popoverCtrl.stopTracking(),this.popoverCtrl.stopOutsideClick(),this.pickerMenu.value.hideMenu(),this.clearActiveDescendant(),this._lastViewportHeight=0),e&&!t&&this.typeahead&&this.typeaheadCtrl.isRemote&&this.filteredItems.length===0&&this.typeaheadCtrl.fetchInitial()}get preservesRemoteResultsOnReset(){return this.typeaheadIsRemote}get typeaheadIsRemote(){return this.typeaheadCtrl.isRemote}refreshTypeaheadItems(){this.typeaheadCtrl.setAllItems(this.pickerItems)}fetchInitialTypeaheadItems(){this.typeaheadCtrl.fetchInitial()}resetTypeaheadInput(){const e=this.theInput.value;e&&(e.value=this.typeaheadRestoreText),this.preservesRemoteResultsOnReset?this.typeaheadCtrl.resetQuery():this.typeaheadCtrl.clearQuery()}closeAndResetTypeahead(){this.showOptions=!1,this.typeahead&&this.resetTypeaheadInput()}dismissMenu(){this.closeAndResetTypeahead(),this.theInput.value?.focus()}renderPickerMenuDismissButton(){return S`<button
       class="picker-mobile-dismiss"
       type="button"
       aria-label="Close options"
       @click=${e=>{e.preventDefault(),e.stopPropagation(),this.pickerMenu.value?.requestDismiss()}}
     >
-      ${x}
-    </button>`}enterPickerMenuFullscreen(){const e=this.pickerField.value;if(!e)return null;const t=y().width;if(!this.hasAttribute("data-picker-menu-fullscreen")){const p=this.getBoundingClientRect(),f=Number.isFinite(p.width)?p.width:0;this.fullscreenPlaceholderEntryInlineSize=Math.max(f,0),this.setAttribute("data-picker-menu-fullscreen",""),e.setAttribute("data-picker-menu-fullscreen-surface",""),e.setAttribute("popover","manual");try{e.matches(":popover-open")||e.showPopover()}catch{return e.removeAttribute("popover"),e.removeAttribute("data-picker-menu-fullscreen-surface"),this.removeAttribute("data-picker-menu-fullscreen"),this.fullscreenPlaceholderEntryInlineSize=0,null}this.fullscreenPlaceholderContentSized=!(this.getBoundingClientRect().width>0),g.lock(this,{preserveScrollPosition:!0}),this.popoverCtrl.refreshPositionElements()}const o=e.getBoundingClientRect(),i=o.height;let n;if(this.fullscreenPlaceholderContentSized)n=Math.min(this.fullscreenPlaceholderEntryInlineSize,t);else{const p=this.getBoundingClientRect().width;n=Number.isFinite(p)?Math.min(Math.max(p,0),t):this.fullscreenPlaceholderInlineSize}const h=n!==this.fullscreenPlaceholderInlineSize||t!==this.fullscreenPlaceholderViewportWidth||i!==this.fullscreenPlaceholderFieldHeight;if(h){const f=["inline-size","box-sizing","padding","margin","overflow"].map(c=>({name:c,value:e.style.getPropertyValue(c),priority:e.style.getPropertyPriority(c)}));this.removeAttribute("data-picker-menu-fullscreen"),e.style.setProperty("inline-size",`${n}px`),e.style.setProperty("box-sizing","border-box"),e.style.setProperty("padding","0"),e.style.setProperty("margin","0"),e.style.setProperty("overflow","visible");const b=e.getBoundingClientRect().height;this.setAttribute("data-picker-menu-fullscreen","");for(const{name:c,value:v,priority:k}of f)v?e.style.setProperty(c,v,k):e.style.removeProperty(c);this.fullscreenPlaceholderInlineSize=n,this.fullscreenPlaceholderViewportWidth=t,this.fullscreenPlaceholderFieldHeight=i,this.style.setProperty("--_esp-picker-fullscreen-placeholder-block-size",`${b}px`),this.fullscreenPlaceholderContentSized?this.style.setProperty("--_esp-picker-fullscreen-placeholder-inline-size",`${n}px`):this.style.removeProperty("--_esp-picker-fullscreen-placeholder-inline-size")}return h?e.getBoundingClientRect():o}exitPickerMenuFullscreen(){const e=this.hasAttribute("data-picker-menu-fullscreen"),t=this.pickerField.value;if(t?.matches(":popover-open"))try{t.hidePopover()}catch{}t?.removeAttribute("popover"),t?.removeAttribute("data-picker-menu-fullscreen-surface"),this.removeAttribute("data-picker-menu-fullscreen"),this.style.removeProperty("--_esp-picker-fullscreen-placeholder-block-size"),this.style.removeProperty("--_esp-picker-fullscreen-placeholder-inline-size"),this.fullscreenPlaceholderInlineSize=0,this.fullscreenPlaceholderViewportWidth=0,this.fullscreenPlaceholderFieldHeight=0,this.fullscreenPlaceholderEntryInlineSize=0,this.fullscreenPlaceholderContentSized=!1,g.unlock(this),e&&this.popoverCtrl.refreshPositionElements()}pickerMenuIsOpen(){return this.showOptions}disconnectedCallback(){this.showOptions=!1,this.exitPickerMenuFullscreen(),super.disconnectedCallback()}handleSharedPickerKeydown(e){switch(e.key){case" ":return this.typeahead||(this.showOptions=!this.showOptions),!0;case"Tab":return this.showOptions&&(this.showOptions=!1),this.typeahead&&this.resetTypeaheadInput(),!0;case"Escape":return this.closeAndResetTypeahead(),!0;default:return!1}}handleMenuNavigationKey(e,t){if(t.preventDefault(),!this.showOptions){this.showOptions=!0;return}this.pickerMenu.value?.doKeyboardNav(e),this.updateActiveDescendant()}get menuItems(){return this.typeahead?this.filteredItems:this.pickerItems}focus(){this.theInput.value?.focus()}setFormItemDescription(e){this.formItemDescription.setDescription(e)}setFormItemLabel(e){this.formItemDescription.setLabel(e)}validate(){this.formCtrl.validate()}checkValidity(){return this.formCtrl.checkValidity()}updateActiveDescendant(){const e=this.theInput.value;if(!e||!this.pickerMenu.value)return;const t=this.pickerMenu.value.getHighlightedElement();e.ariaActiveDescendantElement=t}clearActiveDescendant(){const e=this.theInput.value;e&&(e.ariaActiveDescendantElement=null)}_scrollToContainPopover(){const e=this.pickerMenu.value;e&&(this._containRepositionFrame!==null&&cancelAnimationFrame(this._containRepositionFrame),this._containRepositionFrame=S(this,e,()=>{this._containRepositionFrame=null,this.showOptions&&this.pickerMenu.value?.updatePosition(this)}))}syncSelectionFromItems(e){}willUpdate(e){super.willUpdate(e),this.syncSelectionFromItems(e),this.typeahead&&((e.has("pickerItems")||e.has("typeahead"))&&this.typeaheadCtrl.setAllItems(this.pickerItems),(e.has("fetchItems")||e.has("typeahead"))&&this.typeaheadCtrl.setFetchItems(this.fetchItems),(e.has("debounceMs")||e.has("typeahead"))&&this.debounceMs!==void 0&&this.typeaheadCtrl.setDebounceMs(this.debounceMs))}updated(e){super.updated(e),e.has("disabled")&&this.disabled&&this.showOptions&&(this.showOptions=!1),e.has("width")&&(this.width?this.style.width=this.width:this.style.removeProperty("width"))}firstUpdated(e){super.firstUpdated(e);const t=this.theInput.value;if(t&&(t.role="combobox",t.ariaHasPopup="listbox",t.ariaExpanded="false",t.ariaAutoComplete=this.typeahead?"list":"none",this.pickerMenu.value)){const o=t;o.ariaControlsElements=[this.pickerMenu.value]}const r=this.itemsSlot.value;r&&(this.extractSlotItems(r),r.addEventListener("slotchange",()=>this.extractSlotItems(r)))}extractSlotItems(e){this._slotExtractPending||(this._slotExtractPending=!0,queueMicrotask(()=>{this._slotExtractPending=!1;const t=e.assignedElements();if(t.length===0)return;const r=[];for(const o of t){if(!(o instanceof I))throw new Error(`Picker items must be of type esp-picker-item, but got <${o.tagName.toLowerCase()}>`);const i=o,n=Array.from(i.childNodes),h=n.length>0?n.map(p=>p.cloneNode(!0)):void 0;r.push({text:i.text||i.getAttribute("text")||i.textContent?.trim()||"",value:i.value||i.getAttribute("value")||"",selected:i.selected||i.hasAttribute("selected"),icon:i.icon||i.getAttribute("icon")||"",styles:i.styles,slotNodes:h})}this.pickerItems=r;for(const o of t)o.remove()}))}}s.formAssociated=!0,s.KEYBOARD_THRESHOLD=150,s.pickerFieldStyles=[...E(".esp-field > .picker-mobile-dismiss"),P`
+      ${V}
+    </button>`}enterPickerMenuFullscreen(){const e=this.pickerField.value;if(!e)return null;const t=v().width;if(!this.hasAttribute("data-picker-menu-fullscreen")){const c=this.getBoundingClientRect(),d=Number.isFinite(c.width)?c.width:0;this.fullscreenPlaceholderEntryInlineSize=Math.max(d,0),this.setAttribute("data-picker-menu-fullscreen",""),e.setAttribute("data-picker-menu-fullscreen-surface",""),e.setAttribute("popover","manual");try{e.matches(":popover-open")||e.showPopover()}catch{return e.removeAttribute("popover"),e.removeAttribute("data-picker-menu-fullscreen-surface"),this.removeAttribute("data-picker-menu-fullscreen"),this.fullscreenPlaceholderEntryInlineSize=0,null}this.fullscreenPlaceholderContentSized=!(this.getBoundingClientRect().width>0),I.lock(this,{preserveScrollPosition:!0}),this.popoverCtrl.refreshPositionElements()}const n=e.getBoundingClientRect(),s=n.height;let r;if(this.fullscreenPlaceholderContentSized)r=Math.min(this.fullscreenPlaceholderEntryInlineSize,t);else{const c=this.getBoundingClientRect().width;r=Number.isFinite(c)?Math.min(Math.max(c,0),t):this.fullscreenPlaceholderInlineSize}const h=r!==this.fullscreenPlaceholderInlineSize||t!==this.fullscreenPlaceholderViewportWidth||s!==this.fullscreenPlaceholderFieldHeight;if(h){const d=["inline-size","box-sizing","padding","margin","overflow"].map(p=>({name:p,value:e.style.getPropertyValue(p),priority:e.style.getPropertyPriority(p)}));this.removeAttribute("data-picker-menu-fullscreen"),e.style.setProperty("inline-size",`${r}px`),e.style.setProperty("box-sizing","border-box"),e.style.setProperty("padding","0"),e.style.setProperty("margin","0"),e.style.setProperty("overflow","visible");const u=e.getBoundingClientRect().height;this.setAttribute("data-picker-menu-fullscreen","");for(const{name:p,value:k,priority:w}of d)k?e.style.setProperty(p,k,w):e.style.removeProperty(p);this.fullscreenPlaceholderInlineSize=r,this.fullscreenPlaceholderViewportWidth=t,this.fullscreenPlaceholderFieldHeight=s,this.style.setProperty("--_esp-picker-fullscreen-placeholder-block-size",`${u}px`),this.fullscreenPlaceholderContentSized?this.style.setProperty("--_esp-picker-fullscreen-placeholder-inline-size",`${r}px`):this.style.removeProperty("--_esp-picker-fullscreen-placeholder-inline-size")}return h?e.getBoundingClientRect():n}exitPickerMenuFullscreen(){const e=this.hasAttribute("data-picker-menu-fullscreen"),t=this.pickerField.value;if(t?.matches(":popover-open"))try{t.hidePopover()}catch{}t?.removeAttribute("popover"),t?.removeAttribute("data-picker-menu-fullscreen-surface"),this.removeAttribute("data-picker-menu-fullscreen"),this.style.removeProperty("--_esp-picker-fullscreen-placeholder-block-size"),this.style.removeProperty("--_esp-picker-fullscreen-placeholder-inline-size"),this.fullscreenPlaceholderInlineSize=0,this.fullscreenPlaceholderViewportWidth=0,this.fullscreenPlaceholderFieldHeight=0,this.fullscreenPlaceholderEntryInlineSize=0,this.fullscreenPlaceholderContentSized=!1,I.unlock(this),e&&this.popoverCtrl.refreshPositionElements()}pickerMenuIsOpen(){return this.showOptions}disconnectedCallback(){this.showOptions=!1,this.exitPickerMenuFullscreen(),super.disconnectedCallback()}handleSharedPickerKeydown(e){switch(e.key){case" ":return this.typeahead||(this.showOptions=!this.showOptions),!0;case"Tab":return this.showOptions&&(this.showOptions=!1),this.typeahead&&this.resetTypeaheadInput(),!0;case"Escape":return this.closeAndResetTypeahead(),!0;default:return!1}}handleMenuNavigationKey(e,t){if(t.preventDefault(),!this.showOptions){this.showOptions=!0;return}this.pickerMenu.value?.doKeyboardNav(e),this.updateActiveDescendant()}get menuItems(){return this.typeahead?this.filteredItems:this.pickerItems}focus(){this.theInput.value?.focus()}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()}updateActiveDescendant(){const e=this.theInput.value;if(!e||!this.pickerMenu.value)return;const t=this.pickerMenu.value.getHighlightedElement();e.ariaActiveDescendantElement=t}clearActiveDescendant(){const e=this.theInput.value;e&&(e.ariaActiveDescendantElement=null)}_scrollToContainPopover(){const e=this.pickerMenu.value;e&&(this._containRepositionFrame!==null&&cancelAnimationFrame(this._containRepositionFrame),this._containRepositionFrame=E(this,e,()=>{this._containRepositionFrame=null,this.showOptions&&this.pickerMenu.value?.updatePosition(this)}))}syncSelectionFromItems(e){}willUpdate(e){super.willUpdate(e),this.syncSelectionFromItems(e),this.typeahead&&((e.has("fetchItems")||e.has("typeahead"))&&this.typeaheadCtrl.setFetchItems(this.fetchItems),(e.has("pickerItems")||e.has("typeahead")||e.has("fetchItems")&&this.fetchItems===null)&&(this.typeaheadCtrl.showingRemoteResults&&(this.filteredItems=this.decorateFilteredItems(this.filteredItems)),this.typeaheadCtrl.setAllItems(this.pickerItems)),(e.has("debounceMs")||e.has("typeahead"))&&this.debounceMs!==void 0&&this.typeaheadCtrl.setDebounceMs(this.debounceMs))}updated(e){super.updated(e),e.has("disabled")&&this.disabled&&this.showOptions&&(this.showOptions=!1),e.has("width")&&(this.width?this.style.width=this.width:this.style.removeProperty("width"))}firstUpdated(e){super.firstUpdated(e);const t=this.theInput.value;if(t&&(t.role="combobox",t.ariaHasPopup="listbox",t.ariaExpanded="false",t.ariaAutoComplete=this.typeahead?"list":"none",this.pickerMenu.value)){const n=t;n.ariaControlsElements=[this.pickerMenu.value]}const i=this.itemsSlot.value;i&&(this.extractSlotItems(i),i.addEventListener("slotchange",()=>this.extractSlotItems(i)))}copyPickerItem(e,t){const i={...e,...t},n=this.recordElements.get(e);return n&&this.recordElements.set(i,n),i}extractSlotItems(e){this._slotExtractPending||(this._slotExtractPending=!0,queueMicrotask(()=>{this._slotExtractPending=!1;const t=e.assignedElements();if(t.length===0)return;const i=[],n=new WeakMap;for(const s of t){if(!(s instanceof R))throw new Error(`Picker items must be of type esp-picker-item, but got <${s.tagName.toLowerCase()}>`);const r=s,h=Array.from(r.childNodes),c=h.length>0?h.map(p=>p.cloneNode(!0)):void 0,d=b(r);n.set(r,{index:i.length,value:d});const u={...g(r),value:d,selected:r.selected||r.hasAttribute("selected"),slotNodes:c};this.recordElements.set(u,r),i.push(u),C(r,this)}this.extractedElements=n,this.pickerItems=i;for(const s of t)s.remove()}))}pickerItemChanged(e){const t=this.extractedElements.get(e);if(!t||b(e)!==t.value)return;const i=this.pickerItems[t.index];if(!i||i.value!==t.value||this.recordElements.get(i)!==e)return;const n=g(e);if(F(n,i))return;const s=[...this.pickerItems];s[t.index]=this.copyPickerItem(i,n),this.pickerItems=s}}o.clearsFormItemErrorOnChange=!0,o.formAssociated=!0,o.KEYBOARD_THRESHOLD=150,o.pickerFieldStyles=[...H(".esp-field > .picker-mobile-dismiss"),O`
       :host([disabled]) {
         pointer-events: none;
         opacity: 0.5;
@@ -42,7 +42,7 @@ var l=function(m,e,t,r){var o=arguments.length,i=o<3?e:r===null?r=Object.getOwnP
         display: none;
       }
 
-      @media ${R(z)} {
+      @media ${A(T)} {
         
         :host([data-picker-menu-fullscreen]) {
           min-block-size: var(--_esp-picker-fullscreen-placeholder-block-size, 2.75rem);
@@ -86,4 +86,4 @@ var l=function(m,e,t,r){var o=arguments.length,i=o<3?e:r===null?r=Object.getOwnP
           box-shadow: inset 0 0 0 3px var(--esp-color-link, var(--esp-color-shadow));
         }
       }
-    `],l([u()],s.prototype,"showOptions",null),l([u()],s.prototype,"typeaheadLoading",void 0),l([u()],s.prototype,"filteredItems",void 0),l([u()],s.prototype,"inputFocused",void 0),l([a({type:Boolean,reflect:!0})],s.prototype,"typeahead",void 0),l([a({attribute:!1})],s.prototype,"fetchItems",void 0),l([a({type:Number,attribute:"debounce-ms"})],s.prototype,"debounceMs",void 0),l([a({type:String,reflect:!0})],s.prototype,"name",void 0),l([a({type:Boolean,reflect:!0})],s.prototype,"required",void 0),l([a({attribute:"required-message"})],s.prototype,"requiredMessage",void 0),l([a({type:Boolean,reflect:!0})],s.prototype,"disabled",void 0),l([a({type:Array})],s.prototype,"pickerItems",void 0),l([a({type:String})],s.prototype,"placeholder",void 0),l([a({type:String})],s.prototype,"width",void 0);export{s as EspalierPickerBase};
+    `],l([f()],o.prototype,"showOptions",null),l([f()],o.prototype,"typeaheadLoading",void 0),l([f()],o.prototype,"filteredItems",void 0),l([f()],o.prototype,"inputFocused",void 0),l([a({type:Boolean,reflect:!0})],o.prototype,"typeahead",void 0),l([a({attribute:!1})],o.prototype,"fetchItems",void 0),l([a({type:Number,attribute:"debounce-ms"})],o.prototype,"debounceMs",void 0),l([a({type:String,reflect:!0})],o.prototype,"name",void 0),l([a({type:Boolean,reflect:!0})],o.prototype,"required",void 0),l([a({attribute:"required-message"})],o.prototype,"requiredMessage",void 0),l([a({type:Boolean,reflect:!0})],o.prototype,"disabled",void 0),l([a({type:Array})],o.prototype,"pickerItems",void 0),l([a({type:String})],o.prototype,"placeholder",void 0),l([a({type:String})],o.prototype,"width",void 0);export{o as EspalierPickerBase};

package/dist/pickers/esp-picker-item.js

@@ -1,7 +1,7 @@
-var l=function(p,t,i,s){var o=arguments.length,e=o<3?t:s===null?s=Object.getOwnPropertyDescriptor(t,i):s,n;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")e=Reflect.decorate(p,t,i,s);else for(var h=p.length-1;h>=0;h--)(n=p[h])&&(e=(o<3?n(e):o>3?n(t,i,e):n(t,i))||e);return o>3&&e&&Object.defineProperty(t,i,e),e};import{LitElement as d,nothing as g,css as u,html as a}from"lit";import{customElement as v,property as c}from"lit/decorators.js";import{ref as m}from"lit/directives/ref.js";import{getIconHrefForHost as f}from"../shared/intent-values.js";import{SlottedIconController as y}from"../shared/slotted-icon-controller.js";import{renderSpriteIcon as b}from"../shared/svgs/render-sprite-icon.js";import{DocumentSpriteController as k}from"../shared/document-sprite.js";let r=class extends d{constructor(){super(),this.internals=this.attachInternals(),this.iconSlot=new y(this),this.text="",this.icon="",this.value="",this.selected=!1,new k(this,{reactToSpriteChanges:!0}),this.internals.role="option"}connectedCallback(){super.connectedCallback(),this.hasAttribute("role")||this.setAttribute("role","option")}updated(t){super.updated(t),t.has("selected")&&(this.internals.ariaSelected=String(this.selected),this.setAttribute("aria-selected",String(this.selected)))}renderHighlightedText(){const t=this.highlightRanges;if(!t||t.length===0)return this.text;const i=[...t].sort((e,n)=>e[0]-n[0]),s=[];let o=0;for(const[e,n]of i)e>o&&s.push(a`${this.text.slice(o,e)}`),s.push(a`<mark>${this.text.slice(e,n)}</mark>`),o=n;return o<this.text.length&&s.push(a`${this.text.slice(o)}`),s}render(){const t=f(this.icon,this),i=this.iconSlot.hasSlottedIcon(":scope > *");return a`<div>
+var c=function(e,t,r,n){var i=arguments.length,o=i<3?t:n===null?n=Object.getOwnPropertyDescriptor(t,r):n,l;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")o=Reflect.decorate(e,t,r,n);else for(var h=e.length-1;h>=0;h--)(l=e[h])&&(o=(i<3?l(o):i>3?l(t,r,o):l(t,r))||o);return i>3&&o&&Object.defineProperty(t,r,o),o};import{LitElement as g,nothing as u,css as v,html as a}from"lit";import{customElement as m,property as p}from"lit/decorators.js";import{ref as f}from"lit/directives/ref.js";import{getIconHrefForHost as y}from"../shared/intent-values.js";import{SlottedIconController as x}from"../shared/slotted-icon-controller.js";import{renderSpriteIcon as b}from"../shared/svgs/render-sprite-icon.js";import{DocumentSpriteController as k}from"../shared/document-sprite.js";const S=["text","icon","styles"],d=new WeakMap;function P(e,t){d.set(e,t)}function E(e){return{text:e.text||e.getAttribute("text")||e.textContent?.trim()||"",icon:e.icon||e.getAttribute("icon")||"",styles:e.styles}}function H(e,t){return e.text===t.text&&(e.icon??"")===(t.icon??"")&&e.styles===t.styles}function j(e){return e.value||e.getAttribute("value")||""}let s=class extends g{constructor(){super(),this.internals=this.attachInternals(),this.iconSlot=new x(this),this.text="",this.icon="",this.value="",this.selected=!1,new k(this,{reactToSpriteChanges:!0}),this.internals.role="option"}connectedCallback(){super.connectedCallback(),this.hasAttribute("role")||this.setAttribute("role","option")}updated(t){super.updated(t),S.some(r=>t.has(r))&&d.get(this)?.pickerItemChanged(this),t.has("selected")&&(this.internals.ariaSelected=String(this.selected),this.setAttribute("aria-selected",String(this.selected)))}renderHighlightedText(){const t=this.highlightRanges;if(!t||t.length===0)return this.text;const r=[...t].sort((o,l)=>o[0]-l[0]),n=[];let i=0;for(const[o,l]of r)o>i&&n.push(a`${this.text.slice(i,o)}`),n.push(a`<mark>${this.text.slice(o,l)}</mark>`),i=l;return i<this.text.length&&n.push(a`${this.text.slice(i)}`),n}render(){const t=y(this.icon,this),r=this.iconSlot.hasSlottedIcon(":scope > *");return a`<div>
       <span class="icon">
-        <slot ${m(this.iconSlot.slotRef)} @slotchange=${this.iconSlot.handleSlotChange}></slot>
-        ${!i&&t?b(t):g}
+        <slot ${f(this.iconSlot.slotRef)} @slotchange=${this.iconSlot.handleSlotChange}></slot>
+        ${!r&&t?b(t):u}
       </span>
       <span class="text">${this.renderHighlightedText()}</span>
       ${this.selected?a`<svg
@@ -19,7 +19,7 @@ var l=function(p,t,i,s){var o=arguments.length,e=o<3?t:s===null?s=Object.getOwnP
             />
             <path d="M9 12l2 2l4 -4" />
           </svg>`:a``}
-    </div>`}};r.styles=u`
+    </div>`}};s.styles=v`
     :host(:hover),
     :host(.highlighted) {
       div {
@@ -77,4 +77,4 @@ var l=function(p,t,i,s){var o=arguments.length,e=o<3?t:s===null?s=Object.getOwnP
         margin: var(--esp-size-tiny);
       }
     }
-  `,l([c({type:Object})],r.prototype,"styles",void 0),l([c({type:String})],r.prototype,"text",void 0),l([c({type:String})],r.prototype,"icon",void 0),l([c({type:String})],r.prototype,"value",void 0),l([c({type:Boolean})],r.prototype,"selected",void 0),l([c({attribute:"highlight-ranges",type:Array})],r.prototype,"highlightRanges",void 0),r=l([v("esp-picker-item")],r);export{r as EspalierPickerItem};
+  `,c([p({type:Object})],s.prototype,"styles",void 0),c([p({type:String})],s.prototype,"text",void 0),c([p({type:String})],s.prototype,"icon",void 0),c([p({type:String})],s.prototype,"value",void 0),c([p({type:Boolean})],s.prototype,"selected",void 0),c([p({attribute:"highlight-ranges",type:Array})],s.prototype,"highlightRanges",void 0),s=c([m("esp-picker-item")],s);export{s as EspalierPickerItem,P as adoptPickerItem,E as pickerItemDisplay,j as pickerItemValue,H as samePickerItemDisplay};

package/dist/pickers/esp-picker-menu.js

@@ -1,4 +1,4 @@
-var u=function(a,e,t,r){var s=arguments.length,i=s<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,l;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(a,e,t,r);else for(var n=a.length-1;n>=0;n--)(l=a[n])&&(i=(s<3?l(i):s>3?l(e,t,i):l(e,t))||i);return s>3&&i&&Object.defineProperty(e,t,i),i};import{LitElement as C,css as T,html as f,unsafeCSS as E}from"lit";import{customElement as H,property as b,state as S}from"lit/decorators.js";import{createRef as A,ref as R}from"lit/directives/ref.js";import{styleMap as M}from"lit/directives/style-map.js";import"../shared/virtualizer/lit-virtualizer.js";import{spaceAroundRect as x,viewportSize as g}from"../shared/viewport.js";import{ESP_EVENTS as y}from"../shared/events.js";import{COMPACT_VIEWPORT_MEDIA_QUERY as z,compactViewportMatches as F}from"../shared/responsive.js";import{findContainingPopovers as $}from"../shared/popover-controller.js";const v="highlighted",D=44;function w(a){if(!a)return null;const e=a;return typeof e.enterPickerMenuFullscreen=="function"&&typeof e.exitPickerMenuFullscreen=="function"&&typeof e.pickerMenuIsOpen=="function"?a:null}function _(a){if($(a).some(t=>[...t.shadowRoot?.querySelectorAll("[popover]")??[]].some(r=>r.matches(":popover-open"))))return!0;let e=a;for(;e;){const t=e.getRootNode();if(e=e.assignedSlot??e.parentElement??(t instanceof ShadowRoot?t.host:null),!e)return!1;if(e.matches(":popover-open")||e.matches("dialog[open], esp-dialog[is-open], esp-flyout[open]"))return!0}return!1}let c=class extends C{get fullscreenPresentation(){return this.hasAttribute("data-fullscreen")}constructor(){super(),this.internals=this.attachInternals(),this.virtualizerRef=A(),this.internalPoolClone=null,this.internalPoolFingerprint=null,this.internalPickScrollTop=null,this.lastPoolFingerprint=null,this.preRenderScrollTop=null,this.openSessionGeneration=0,this.maxAvailableHeight=0,this.lastViewportHeight=0,this.positionTarget=null,this.label="",this.virtualizedItemsPool=[],this.highlightIndex=-1,this.multiSelect=!1,this.loading=!1,this.emptyMessage="",this.handleItemPointerDown=e=>{this.selectItemFromPointerEvent(e)},this.menuDirty=!1,this.settlerActive=!1,this.pendingItemsChanged=!1,this.retargetingSequence=!1,this.renderPickerItem=(e,t)=>{const r={display:"block",cursor:"pointer",width:"100%",...e.styles};return f`<esp-picker-item
+var u=function(a,e,t,r){var s=arguments.length,i=s<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,l;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(a,e,t,r);else for(var n=a.length-1;n>=0;n--)(l=a[n])&&(i=(s<3?l(i):s>3?l(e,t,i):l(e,t))||i);return s>3&&i&&Object.defineProperty(e,t,i),i};import{LitElement as C,css as T,html as f,unsafeCSS as E}from"lit";import{customElement as H,property as b,state as S}from"lit/decorators.js";import{createRef as A,ref as R}from"lit/directives/ref.js";import{styleMap as M}from"lit/directives/style-map.js";import"../shared/virtualizer/lit-virtualizer.js";import{spaceAroundRect as x,viewportSize as g}from"../shared/viewport.js";import{ESP_EVENTS as y}from"../shared/events.js";import{COMPACT_VIEWPORT_MEDIA_QUERY as z,compactViewportMatches as F}from"../shared/responsive.js";import{findContainingPopovers as $}from"../shared/popover-controller.js";const v="highlighted",D=44;function w(a){if(!a)return null;const e=a;return typeof e.enterPickerMenuFullscreen=="function"&&typeof e.exitPickerMenuFullscreen=="function"&&typeof e.pickerMenuIsOpen=="function"?a:null}function _(a){if($(a).some(t=>[...t.shadowRoot?.querySelectorAll("[popover]")??[]].some(r=>r.matches(":popover-open"))))return!0;let e=a;for(;e;){const t=e.getRootNode();if(e=e.assignedSlot??e.parentElement??(t instanceof ShadowRoot?t.host:null),!e)return!1;if(e.matches(":popover-open")||e.matches("dialog[open], esp-dialog[is-open], esp-flyout[open]"))return!0}return!1}let c=class extends C{get isVisitorPick(){return this.visitorPicking}get fullscreenPresentation(){return this.hasAttribute("data-fullscreen")}constructor(){super(),this.internals=this.attachInternals(),this.virtualizerRef=A(),this.internalPoolClone=null,this.internalPoolFingerprint=null,this.internalPickScrollTop=null,this.visitorPicking=!1,this.lastPoolFingerprint=null,this.preRenderScrollTop=null,this.openSessionGeneration=0,this.maxAvailableHeight=0,this.lastViewportHeight=0,this.positionTarget=null,this.label="",this.virtualizedItemsPool=[],this.highlightIndex=-1,this.multiSelect=!1,this.loading=!1,this.emptyMessage="",this.handleItemPointerDown=e=>{this.selectItemFromPointerEvent(e)},this.menuDirty=!1,this.settlerActive=!1,this.pendingItemsChanged=!1,this.retargetingSequence=!1,this.renderPickerItem=(e,t)=>{const r={display:"block",cursor:"pointer",width:"100%",...e.styles};return f`<esp-picker-item
       class="picker-item"
       data-picker-index=${t}
       .text=${e.text}
@@ -9,7 +9,7 @@ var u=function(a,e,t,r){var s=arguments.length,i=s<3?e:r===null?r=Object.getOwnP
       style=${M(r)}
     >
       ${e.slotNodes?.map(s=>s.cloneNode(!0))}
-    </esp-picker-item>`},this.internals.role="listbox"}connectedCallback(){super.connectedCallback(),this.setAttribute("popover","manual"),this.hasAttribute("role")||this.setAttribute("role","listbox")}willUpdate(e){if(super.willUpdate(e),e.has("virtualizedItemsPool")&&this.preRenderScrollTop===null&&!this.retargetingSequence&&this.matches(":popover-open")){const t=this.virtualizerRef.value?.scrollTop??0;t>0&&(this.preRenderScrollTop=t)}}updated(e){super.updated(e),e.has("multiSelect")&&(this.internals.ariaMultiSelectable=String(this.multiSelect),this.setAttribute("aria-multiselectable",String(this.multiSelect))),e.has("label")&&(this.internals.ariaLabel=this.label,this.label?this.setAttribute("aria-label",this.label):this.removeAttribute("aria-label"));const t=e.has("virtualizedItemsPool");let r=!1;if(t){const s=this.virtualizedItemsPool.map(l=>`${l.value}\0${l.text}\0${l.selected===!0}`),i=this.virtualizedItemsPool===this.internalPoolClone||this.internalPoolFingerprint!==null&&this.internalPoolFingerprint.length===s.length&&this.internalPoolFingerprint.every((l,n)=>l===s[n]);this.internalPoolClone=null,i||(this.internalPoolFingerprint=null,this.internalPickScrollTop=null),r=!i&&(this.lastPoolFingerprint===null||this.lastPoolFingerprint.length!==s.length||this.lastPoolFingerprint.some((l,n)=>l!==s[n])),this.lastPoolFingerprint=s}(t||e.has("loading"))&&this.maxAvailableHeight>0&&this.matches(":popover-open")&&(this.pendingItemsChanged||=r,this.menuDirty=!0,this.settleMenuAfterUpdate())}get pickerItems(){return this.virtualizedItemsPool}set pickerItems(e){const t=this.virtualizedItemsPool.filter(i=>i.selected).map(i=>i.value);this.virtualizedItemsPool=e;const r=e.filter(i=>i.selected),s=r.map(i=>i.value);(t.length!==s.length||t.some((i,l)=>i!==s[l]))&&this.dispatchEvent(new CustomEvent(y.PICKER_MENU_SELECTION_CHANGED,{detail:r,bubbles:!0,composed:!0}))}setHighlight(e){const t=this.virtualizedItemsPool;if(t.length===0)return;(this.highlightIndex<0||this.highlightIndex>t.length-1)&&(this.highlightIndex=e);const r=this.virtualizerRef.value;r&&r.scrollToIndex(this.highlightIndex,"nearest"),this.applyHighlightClass()}async setHighlightAsync(e){const t=this.openSessionGeneration,r=()=>t!==this.openSessionGeneration||!this.isConnected,s=this.virtualizedItemsPool;if(s.length===0)return;(this.highlightIndex<0||this.highlightIndex>s.length-1)&&(this.highlightIndex=e);const i=this.virtualizerRef.value;if(i){if(await this.stableLayout(i),r())return;const l=i.scrollTop;for(let n=0;n<3;n+=1)try{i.scrollToIndex(this.highlightIndex,"nearest");break}catch{if(await this.stableLayout(i),r()||i.scrollTop!==l)return}if(await this.stableLayout(i),r())return}this.applyHighlightWithRetry(3)}applyHighlightClass(){const e=this.getHighlightedElement();e&&(this.clearHighlight(),e.classList.add(v))}clearHighlight(){const e=this.virtualizerRef.value;if(e)for(const t of e.querySelectorAll(`esp-picker-item.${v}`))t.classList.remove(v)}resetHighlight(){this.clearHighlight();const e=this.virtualizedItemsPool.find(t=>t.selected);this.highlightIndex=e?this.virtualizedItemsPool.indexOf(e):-1}applyHighlightWithRetry(e){if(!this.isConnected||!this.matches(":popover-open"))return;const t=this.getHighlightedElement();if(t){this.clearHighlight(),t.classList.add(v);return}e>0&&requestAnimationFrame(()=>this.applyHighlightWithRetry(e-1))}getHighlightedElement(){if(this.highlightIndex<0)return null;const e=this.virtualizerRef.value;if(!e)return null;const t=e.querySelectorAll("esp-picker-item");for(const r of t)if(this.virtualizedItemsPool.findIndex(i=>i.value===r.value&&i.text===r.text)===this.highlightIndex)return r;return null}pickItem(e){const t=this.virtualizerRef.value?.scrollTop??0;this.preRenderScrollTop===null&&t>0&&(this.preRenderScrollTop=t),t>0&&(this.internalPickScrollTop=t);for(const i of this.pickerItems)i===e?i.selected=!i.selected:this.multiSelect||(i.selected=!1);const r=this.virtualizedItemsPool.indexOf(e);if(r!==-1){this.highlightIndex=r;const i=this.getHighlightedElement();i&&(this.clearHighlight(),i.classList.add(v))}const s=[...this.pickerItems];this.internalPoolClone=s,this.internalPoolFingerprint=s.map(i=>`${i.value}\0${i.text}\0${i.selected===!0}`),this.pickerItems=s,this.dispatchEvent(new CustomEvent(y.PICKER_MENU_SELECTION_CHANGED,{detail:this.pickerItems.filter(i=>i.selected),bubbles:!0,composed:!0})),this.multiSelect||this.dispatchEvent(new CustomEvent(y.PICKER_MENU_CLOSE_REQUESTED,{detail:this.pickerItems.filter(i=>i.selected),bubbles:!0,composed:!0}))}selectItemByIndex(e){const t=Number.isInteger(e)?this.virtualizedItemsPool[e]:void 0;return t?(this.pickItem(t),!0):!1}getPickerItemElementAtPoint(e,t){const r=this.shadowRoot?.querySelectorAll("esp-picker-item[data-picker-index]");if(!r)return null;for(const s of r){const i=s.getBoundingClientRect();if(e>=i.left&&e<=i.right&&t>=i.top&&t<=i.bottom)return s}return null}selectPickerItemElement(e){return e?this.selectItemByIndex(Number(e.dataset.pickerIndex)):!1}selectItemAtPoint(e,t){return this.selectPickerItemElement(this.getPickerItemElementAtPoint(e,t))}selectItemFromPointerEvent(e){const t=e.composedPath().find(s=>s instanceof HTMLElement&&s.matches("esp-picker-item[data-picker-index]"));return this.selectPickerItemElement(t??this.getPickerItemElementAtPoint(e.clientX,e.clientY))?(e.preventDefault(),e.stopPropagation(),!0):!1}requestDismiss(){this.dispatchEvent(new CustomEvent(y.PICKER_MENU_DISMISS_REQUESTED,{bubbles:!0,composed:!0,cancelable:!0}))&&this.hideMenu()}clearFullscreenTarget(e=this.positionTarget){w(e)?.exitPickerMenuFullscreen()}syncPresentation(e){const t=this.positionTarget;t&&t!==e&&this.clearFullscreenTarget(t),this.positionTarget=e;const r=w(e),s=F()&&r!==null&&!_(e);if(!s)return this.clearFullscreenTarget(e),this.toggleAttribute("data-fullscreen",!1),{fullscreen:s,rect:e.getBoundingClientRect()};const i=r.enterPickerMenuFullscreen();return i?(this.toggleAttribute("data-fullscreen",!0),{fullscreen:s,rect:i}):(this.clearFullscreenTarget(e),this.toggleAttribute("data-fullscreen",!1),{fullscreen:!1,rect:e.getBoundingClientRect()})}applyFullscreenGeometry(e){const{height:t,width:r}=g(),s=Math.min(Math.max(e.bottom,D),t);this.maxAvailableHeight=Math.max(t-s,0),this.lastViewportHeight=t;const i={viewportWidth:r,viewportHeight:t,inputBottom:s};this.lastFullscreenGeometry?.viewportWidth===i.viewportWidth&&this.lastFullscreenGeometry.viewportHeight===i.viewportHeight&&this.lastFullscreenGeometry.inputBottom===i.inputBottom||(this.lastFullscreenGeometry=i,this.style.setProperty("height",`${t}px`),this.style.setProperty("width",`${r}px`),this.style.setProperty("min-width",`${r}px`),this.style.setProperty("left","0px"),this.style.setProperty("top","0px"),this.style.removeProperty("bottom"),this.style.setProperty("--_esp-picker-menu-input-bottom",`${s}px`))}clearFullscreenGeometry(){this.lastFullscreenGeometry=void 0,this.style.removeProperty("height"),this.style.removeProperty("width"),this.style.removeProperty("min-width"),this.style.removeProperty("left"),this.style.removeProperty("top"),this.style.removeProperty("bottom"),this.style.removeProperty("--_esp-picker-menu-input-bottom")}positionSelf(e){this.resetSettleState();const{fullscreen:t,rect:r}=this.syncPresentation(e),{height:s}=g();let i;if(t)this.applyFullscreenGeometry(r),i=this.maxAvailableHeight;else{this.clearFullscreenGeometry();const{spaceAbove:o,spaceBelow:h}=x(r,s);i=Math.max(Math.max(o,h)-75,0),this.maxAvailableHeight=i,this.lastViewportHeight=s,this.style.setProperty("height",`${i}px`),this.style.setProperty("min-width",`${r.width}px`),this.style.setProperty("left",`${r.left}px`),this.style.removeProperty("top"),this.style.removeProperty("bottom"),o>h?this.style.setProperty("bottom",`${s-r.top}px`):this.style.setProperty("top",`${r.bottom}px`)}this.classList.remove("visible"),this.matches(":popover-open")||this.showPopover();const l=this.pickerItems.find(o=>o.selected);this.highlightIndex=l?this.pickerItems.indexOf(l):0,this.openSessionGeneration+=1;const n=this.openSessionGeneration;this.setHighlightAsync(0).then(()=>{requestAnimationFrame(()=>{n!==this.openSessionGeneration||!this.isConnected||(this.fullscreenPresentation||(this.shrinkToFit(i),this.widenToFitContent(r)),this.classList.add("visible"))})})}async stableLayout(e){for(let t=0;t<20;t+=1){const r=e.layoutComplete;if(!r)return;const s=await Promise.race([r.then(()=>"settled",()=>"superseded"),new Promise(i=>setTimeout(()=>i("deadline"),250))]);if(s==="settled"||s==="deadline"||e.layoutComplete===r)return}}async settleMenuAfterUpdate(){if(this.settlerActive)return;this.settlerActive=!0;const e=this.openSessionGeneration,t=()=>e!==this.openSessionGeneration?!0:!this.isConnected||!this.matches(":popover-open")?(this.menuDirty=!1,this.preRenderScrollTop=null,this.pendingItemsChanged=!1,this.retargetingSequence=!1,this.internalPickScrollTop=null,!0):!1;try{for(let r=0;r<10&&this.menuDirty;r+=1){this.menuDirty=!1;try{await this.updateComplete}catch{this.menuDirty=!1;return}if(t())return;const s=this.virtualizerRef.value;if(!s){requestAnimationFrame(()=>{if(t()||this.fullscreenPresentation)return;const h=this.shadowRoot?.querySelector(".status-message");if(h){const m=Math.min(h.scrollHeight,this.maxAvailableHeight);this.style.setProperty("height",`${m}px`)}});continue}if(await this.stableLayout(s),t())return;if(this.menuDirty)continue;const i=this.preRenderScrollTop??0,l=i>0&&!this.pendingItemsChanged&&!this.retargetingSequence;if(s.scrollTop=0,this.sizeToContent(this.maxAvailableHeight),l&&s.scrollTop<i){if(s.scrollTop=i,await this.stableLayout(s),t())return;if(this.menuDirty)continue}const n=this.virtualizedItemsPool;if(n.length===0)continue;if(this.pendingItemsChanged){this.pendingItemsChanged=!1,this.retargetingSequence=!0,this.preRenderScrollTop=null;const h=n.findIndex(m=>m.selected);h>=0?this.highlightIndex=h:this.highlightIndex>=n.length?this.highlightIndex=n.length-1:this.highlightIndex<0&&(this.highlightIndex=0)}if(this.retargetingSequence){try{s.scrollToIndex(this.highlightIndex,"nearest")}catch{}if(await this.stableLayout(s),t())return;if(this.menuDirty)continue}this.applyHighlightWithRetry(3);const o=Math.max(l?i:0,this.internalPickScrollTop??0);if(o>0){if(s.scrollTop<o&&(s.scrollTop=o),await this.stableLayout(s),t())return;if(this.menuDirty)continue;if(await new Promise(h=>requestAnimationFrame(()=>h())),t())return;if(this.menuDirty)continue;s.scrollTop<o&&(s.scrollTop=o)}this.internalPickScrollTop=null,this.preRenderScrollTop=null,this.retargetingSequence=!1}}finally{this.settlerActive=!1,this.menuDirty&&this.settleMenuAfterUpdate()}}sizeToContent(e){if(this.fullscreenPresentation)return;const t=this.measureContentHeight();t>0&&this.style.setProperty("height",`${Math.min(t,e)}px`)}shrinkToFit(e){if(this.fullscreenPresentation)return;const t=this.measureContentHeight();t>2&&t<e&&this.style.setProperty("height",`${t}px`)}measureContentHeight(){const e=this.virtualizerRef.value;if(!e)return 0;const t=e.querySelectorAll("esp-picker-item");if(t.length===0)return 0;const r=getComputedStyle(this),s=(parseFloat(r.borderTopWidth)||0)+(parseFloat(r.borderBottomWidth)||0),i=this.virtualizedItemsPool.length;if(t.length<i)return e.scrollHeight+s;const l=e.scrollTop;e.scrollTop=0;const n=e.getBoundingClientRect(),o=t[t.length-1].getBoundingClientRect();return l>0&&(e.scrollTop=l),o.bottom-n.top+s}widenToFitContent(e){if(this.fullscreenPresentation)return;const t=this.virtualizerRef.value;if(!t)return;const r=t.querySelectorAll("esp-picker-item");let s=e.width;for(const i of r)s=Math.max(s,i.scrollWidth);if(s+=2,s>e.width){const{width:i}=g(),l=Math.min(s,i);this.style.setProperty("width",`${l}px`),this.style.setProperty("left",`${Math.max(0,Math.min(e.left,i-l))}px`)}}updatePosition(e){const t=w(e);if(t&&!t.pickerMenuIsOpen())return;const r=this.fullscreenPresentation,{fullscreen:s,rect:i}=this.syncPresentation(e),l=r!==s;if(l){const p=this.virtualizerRef.value?.scrollTop??0;p>0&&this.preRenderScrollTop===null&&!this.pendingItemsChanged&&!this.retargetingSequence&&(this.preRenderScrollTop=p),this.openSessionGeneration+=1,this.menuDirty=!0}if(!this.matches(":popover-open")){if(!t?.pickerMenuIsOpen())return;try{this.showPopover()}catch{this.menuDirty=!1,this.clearFullscreenTarget(e),this.removeAttribute("data-fullscreen"),this.clearFullscreenGeometry(),this.requestDismiss();return}this.classList.add("visible")}if(l&&this.settleMenuAfterUpdate(),s){this.applyFullscreenGeometry(i),l&&this.classList.add("visible");return}if(r){this.clearFullscreenGeometry(),this.style.setProperty("min-width",`${i.width}px`);const{height:p}=g(),{spaceAbove:I,spaceBelow:d}=x(i,p),P=Math.max(Math.max(I,d)-75,0);this.maxAvailableHeight=P,this.lastViewportHeight=p,this.style.setProperty("height",`${P}px`),this.sizeToContent(P)}const{height:n}=g();if(n!==this.lastViewportHeight){const{spaceAbove:p,spaceBelow:I}=x(i,n),d=Math.max(Math.max(p,I)-75,0);this.maxAvailableHeight=d,this.lastViewportHeight=n,(parseFloat(this.style.getPropertyValue("height"))||0)>d&&this.style.setProperty("height",`${d}px`),this.sizeToContent(d)}const{width:o}=g(),h=this.getBoundingClientRect().width;this.style.setProperty("left",`${Math.max(0,Math.min(i.left,o-h))}px`);const m=i.top,k=n-i.bottom;m>k?(this.style.removeProperty("top"),this.style.setProperty("bottom",`${n-i.top}px`)):(this.style.removeProperty("bottom"),this.style.setProperty("top",`${i.bottom}px`)),l&&this.classList.add("visible")}hideMenu(){this.openSessionGeneration+=1,this.classList.remove("visible"),this.resetSettleState(),this.clearFullscreenTarget(),this.positionTarget=null,this.removeAttribute("data-fullscreen"),this.clearFullscreenGeometry();try{this.hidePopover()}catch{}}resetSettleState(){this.preRenderScrollTop=null,this.pendingItemsChanged=!1,this.retargetingSequence=!1,this.internalPickScrollTop=null,this.menuDirty=!1}disconnectedCallback(){this.hideMenu(),super.disconnectedCallback()}doKeyboardNav(e){const t=this.virtualizedItemsPool;if(t.length!==0)switch(e){case"ArrowDown":this.highlightIndex+=1,this.setHighlight(0);break;case"ArrowUp":this.highlightIndex-=1,this.setHighlight(t.length-1);break;case"Home":this.highlightIndex=0,this.setHighlight(0);break;case"End":this.highlightIndex=t.length-1,this.setHighlight(t.length-1);break;case"Enter":if(this.highlightIndex===-1)return;this.pickItem(t[this.highlightIndex]);break}}render(){let e;return this.loading?e=f`<div class="status-message">Searching…</div>`:this.virtualizedItemsPool.length===0&&this.emptyMessage?e=f`<div class="status-message">${this.emptyMessage}</div>`:e=f`<lit-virtualizer
+    </esp-picker-item>`},this.internals.role="listbox"}connectedCallback(){super.connectedCallback(),this.setAttribute("popover","manual"),this.hasAttribute("role")||this.setAttribute("role","listbox")}willUpdate(e){if(super.willUpdate(e),e.has("virtualizedItemsPool")&&this.preRenderScrollTop===null&&!this.retargetingSequence&&this.matches(":popover-open")){const t=this.virtualizerRef.value?.scrollTop??0;t>0&&(this.preRenderScrollTop=t)}}updated(e){super.updated(e),e.has("multiSelect")&&(this.internals.ariaMultiSelectable=String(this.multiSelect),this.setAttribute("aria-multiselectable",String(this.multiSelect))),e.has("label")&&(this.internals.ariaLabel=this.label,this.label?this.setAttribute("aria-label",this.label):this.removeAttribute("aria-label"));const t=e.has("virtualizedItemsPool");let r=!1;if(t){const s=this.virtualizedItemsPool.map(l=>`${l.value}\0${l.text}\0${l.selected===!0}`),i=this.virtualizedItemsPool===this.internalPoolClone||this.internalPoolFingerprint!==null&&this.internalPoolFingerprint.length===s.length&&this.internalPoolFingerprint.every((l,n)=>l===s[n]);this.internalPoolClone=null,i||(this.internalPoolFingerprint=null,this.internalPickScrollTop=null),r=!i&&(this.lastPoolFingerprint===null||this.lastPoolFingerprint.length!==s.length||this.lastPoolFingerprint.some((l,n)=>l!==s[n])),this.lastPoolFingerprint=s}(t||e.has("loading"))&&this.maxAvailableHeight>0&&this.matches(":popover-open")&&(this.pendingItemsChanged||=r,this.menuDirty=!0,this.settleMenuAfterUpdate())}get pickerItems(){return this.virtualizedItemsPool}set pickerItems(e){const t=this.virtualizedItemsPool.filter(i=>i.selected).map(i=>i.value);this.virtualizedItemsPool=e;const r=e.filter(i=>i.selected),s=r.map(i=>i.value);(t.length!==s.length||t.some((i,l)=>i!==s[l]))&&this.dispatchEvent(new CustomEvent(y.PICKER_MENU_SELECTION_CHANGED,{detail:r,bubbles:!0,composed:!0}))}setHighlight(e){const t=this.virtualizedItemsPool;if(t.length===0)return;(this.highlightIndex<0||this.highlightIndex>t.length-1)&&(this.highlightIndex=e);const r=this.virtualizerRef.value;r&&r.scrollToIndex(this.highlightIndex,"nearest"),this.applyHighlightClass()}async setHighlightAsync(e){const t=this.openSessionGeneration,r=()=>t!==this.openSessionGeneration||!this.isConnected,s=this.virtualizedItemsPool;if(s.length===0)return;(this.highlightIndex<0||this.highlightIndex>s.length-1)&&(this.highlightIndex=e);const i=this.virtualizerRef.value;if(i){if(await this.stableLayout(i),r())return;const l=i.scrollTop;for(let n=0;n<3;n+=1)try{i.scrollToIndex(this.highlightIndex,"nearest");break}catch{if(await this.stableLayout(i),r()||i.scrollTop!==l)return}if(await this.stableLayout(i),r())return}this.applyHighlightWithRetry(3)}applyHighlightClass(){const e=this.getHighlightedElement();e&&(this.clearHighlight(),e.classList.add(v))}clearHighlight(){const e=this.virtualizerRef.value;if(e)for(const t of e.querySelectorAll(`esp-picker-item.${v}`))t.classList.remove(v)}resetHighlight(){this.clearHighlight();const e=this.virtualizedItemsPool.find(t=>t.selected);this.highlightIndex=e?this.virtualizedItemsPool.indexOf(e):-1}applyHighlightWithRetry(e){if(!this.isConnected||!this.matches(":popover-open"))return;const t=this.getHighlightedElement();if(t){this.clearHighlight(),t.classList.add(v);return}e>0&&requestAnimationFrame(()=>this.applyHighlightWithRetry(e-1))}getHighlightedElement(){if(this.highlightIndex<0)return null;const e=this.virtualizerRef.value;if(!e)return null;const t=e.querySelectorAll("esp-picker-item");for(const r of t)if(this.virtualizedItemsPool.findIndex(i=>i.value===r.value&&i.text===r.text)===this.highlightIndex)return r;return null}pickItem(e){this.visitorPicking=!0;try{this.applyPick(e)}finally{this.visitorPicking=!1}}applyPick(e){const t=this.virtualizerRef.value?.scrollTop??0;this.preRenderScrollTop===null&&t>0&&(this.preRenderScrollTop=t),t>0&&(this.internalPickScrollTop=t);for(const i of this.pickerItems)i===e?i.selected=!i.selected:this.multiSelect||(i.selected=!1);const r=this.virtualizedItemsPool.indexOf(e);if(r!==-1){this.highlightIndex=r;const i=this.getHighlightedElement();i&&(this.clearHighlight(),i.classList.add(v))}const s=[...this.pickerItems];this.internalPoolClone=s,this.internalPoolFingerprint=s.map(i=>`${i.value}\0${i.text}\0${i.selected===!0}`),this.pickerItems=s,this.dispatchEvent(new CustomEvent(y.PICKER_MENU_SELECTION_CHANGED,{detail:this.pickerItems.filter(i=>i.selected),bubbles:!0,composed:!0})),this.multiSelect||this.dispatchEvent(new CustomEvent(y.PICKER_MENU_CLOSE_REQUESTED,{detail:this.pickerItems.filter(i=>i.selected),bubbles:!0,composed:!0}))}selectItemByIndex(e){const t=Number.isInteger(e)?this.virtualizedItemsPool[e]:void 0;return t?(this.pickItem(t),!0):!1}getPickerItemElementAtPoint(e,t){const r=this.shadowRoot?.querySelectorAll("esp-picker-item[data-picker-index]");if(!r)return null;for(const s of r){const i=s.getBoundingClientRect();if(e>=i.left&&e<=i.right&&t>=i.top&&t<=i.bottom)return s}return null}selectPickerItemElement(e){return e?this.selectItemByIndex(Number(e.dataset.pickerIndex)):!1}selectItemAtPoint(e,t){return this.selectPickerItemElement(this.getPickerItemElementAtPoint(e,t))}selectItemFromPointerEvent(e){const t=e.composedPath().find(s=>s instanceof HTMLElement&&s.matches("esp-picker-item[data-picker-index]"));return this.selectPickerItemElement(t??this.getPickerItemElementAtPoint(e.clientX,e.clientY))?(e.preventDefault(),e.stopPropagation(),!0):!1}requestDismiss(){this.dispatchEvent(new CustomEvent(y.PICKER_MENU_DISMISS_REQUESTED,{bubbles:!0,composed:!0,cancelable:!0}))&&this.hideMenu()}clearFullscreenTarget(e=this.positionTarget){w(e)?.exitPickerMenuFullscreen()}syncPresentation(e){const t=this.positionTarget;t&&t!==e&&this.clearFullscreenTarget(t),this.positionTarget=e;const r=w(e),s=F()&&r!==null&&!_(e);if(!s)return this.clearFullscreenTarget(e),this.toggleAttribute("data-fullscreen",!1),{fullscreen:s,rect:e.getBoundingClientRect()};const i=r.enterPickerMenuFullscreen();return i?(this.toggleAttribute("data-fullscreen",!0),{fullscreen:s,rect:i}):(this.clearFullscreenTarget(e),this.toggleAttribute("data-fullscreen",!1),{fullscreen:!1,rect:e.getBoundingClientRect()})}applyFullscreenGeometry(e){const{height:t,width:r}=g(),s=Math.min(Math.max(e.bottom,D),t);this.maxAvailableHeight=Math.max(t-s,0),this.lastViewportHeight=t;const i={viewportWidth:r,viewportHeight:t,inputBottom:s};this.lastFullscreenGeometry?.viewportWidth===i.viewportWidth&&this.lastFullscreenGeometry.viewportHeight===i.viewportHeight&&this.lastFullscreenGeometry.inputBottom===i.inputBottom||(this.lastFullscreenGeometry=i,this.style.setProperty("height",`${t}px`),this.style.setProperty("width",`${r}px`),this.style.setProperty("min-width",`${r}px`),this.style.setProperty("left","0px"),this.style.setProperty("top","0px"),this.style.removeProperty("bottom"),this.style.setProperty("--_esp-picker-menu-input-bottom",`${s}px`))}clearFullscreenGeometry(){this.lastFullscreenGeometry=void 0,this.style.removeProperty("height"),this.style.removeProperty("width"),this.style.removeProperty("min-width"),this.style.removeProperty("left"),this.style.removeProperty("top"),this.style.removeProperty("bottom"),this.style.removeProperty("--_esp-picker-menu-input-bottom")}positionSelf(e){this.resetSettleState();const{fullscreen:t,rect:r}=this.syncPresentation(e),{height:s}=g();let i;if(t)this.applyFullscreenGeometry(r),i=this.maxAvailableHeight;else{this.clearFullscreenGeometry();const{spaceAbove:o,spaceBelow:h}=x(r,s);i=Math.max(Math.max(o,h)-75,0),this.maxAvailableHeight=i,this.lastViewportHeight=s,this.style.setProperty("height",`${i}px`),this.style.setProperty("min-width",`${r.width}px`),this.style.setProperty("left",`${r.left}px`),this.style.removeProperty("top"),this.style.removeProperty("bottom"),o>h?this.style.setProperty("bottom",`${s-r.top}px`):this.style.setProperty("top",`${r.bottom}px`)}this.classList.remove("visible"),this.matches(":popover-open")||this.showPopover();const l=this.pickerItems.find(o=>o.selected);this.highlightIndex=l?this.pickerItems.indexOf(l):0,this.openSessionGeneration+=1;const n=this.openSessionGeneration;this.setHighlightAsync(0).then(()=>{requestAnimationFrame(()=>{n!==this.openSessionGeneration||!this.isConnected||(this.fullscreenPresentation||(this.shrinkToFit(i),this.widenToFitContent(r)),this.classList.add("visible"))})})}async stableLayout(e){for(let t=0;t<20;t+=1){const r=e.layoutComplete;if(!r)return;const s=await Promise.race([r.then(()=>"settled",()=>"superseded"),new Promise(i=>setTimeout(()=>i("deadline"),250))]);if(s==="settled"||s==="deadline"||e.layoutComplete===r)return}}async settleMenuAfterUpdate(){if(this.settlerActive)return;this.settlerActive=!0;const e=this.openSessionGeneration,t=()=>e!==this.openSessionGeneration?!0:!this.isConnected||!this.matches(":popover-open")?(this.menuDirty=!1,this.preRenderScrollTop=null,this.pendingItemsChanged=!1,this.retargetingSequence=!1,this.internalPickScrollTop=null,!0):!1;try{for(let r=0;r<10&&this.menuDirty;r+=1){this.menuDirty=!1;try{await this.updateComplete}catch{this.menuDirty=!1;return}if(t())return;const s=this.virtualizerRef.value;if(!s){requestAnimationFrame(()=>{if(t()||this.fullscreenPresentation)return;const h=this.shadowRoot?.querySelector(".status-message");if(h){const m=Math.min(h.scrollHeight,this.maxAvailableHeight);this.style.setProperty("height",`${m}px`)}});continue}if(await this.stableLayout(s),t())return;if(this.menuDirty)continue;const i=this.preRenderScrollTop??0,l=i>0&&!this.pendingItemsChanged&&!this.retargetingSequence;if(s.scrollTop=0,this.sizeToContent(this.maxAvailableHeight),l&&s.scrollTop<i){if(s.scrollTop=i,await this.stableLayout(s),t())return;if(this.menuDirty)continue}const n=this.virtualizedItemsPool;if(n.length===0)continue;if(this.pendingItemsChanged){this.pendingItemsChanged=!1,this.retargetingSequence=!0,this.preRenderScrollTop=null;const h=n.findIndex(m=>m.selected);h>=0?this.highlightIndex=h:this.highlightIndex>=n.length?this.highlightIndex=n.length-1:this.highlightIndex<0&&(this.highlightIndex=0)}if(this.retargetingSequence){try{s.scrollToIndex(this.highlightIndex,"nearest")}catch{}if(await this.stableLayout(s),t())return;if(this.menuDirty)continue}this.applyHighlightWithRetry(3);const o=Math.max(l?i:0,this.internalPickScrollTop??0);if(o>0){if(s.scrollTop<o&&(s.scrollTop=o),await this.stableLayout(s),t())return;if(this.menuDirty)continue;if(await new Promise(h=>requestAnimationFrame(()=>h())),t())return;if(this.menuDirty)continue;s.scrollTop<o&&(s.scrollTop=o)}this.internalPickScrollTop=null,this.preRenderScrollTop=null,this.retargetingSequence=!1}}finally{this.settlerActive=!1,this.menuDirty&&this.settleMenuAfterUpdate()}}sizeToContent(e){if(this.fullscreenPresentation)return;const t=this.measureContentHeight();t>0&&this.style.setProperty("height",`${Math.min(t,e)}px`)}shrinkToFit(e){if(this.fullscreenPresentation)return;const t=this.measureContentHeight();t>2&&t<e&&this.style.setProperty("height",`${t}px`)}measureContentHeight(){const e=this.virtualizerRef.value;if(!e)return 0;const t=e.querySelectorAll("esp-picker-item");if(t.length===0)return 0;const r=getComputedStyle(this),s=(parseFloat(r.borderTopWidth)||0)+(parseFloat(r.borderBottomWidth)||0),i=this.virtualizedItemsPool.length;if(t.length<i)return e.scrollHeight+s;const l=e.scrollTop;e.scrollTop=0;const n=e.getBoundingClientRect(),o=t[t.length-1].getBoundingClientRect();return l>0&&(e.scrollTop=l),o.bottom-n.top+s}widenToFitContent(e){if(this.fullscreenPresentation)return;const t=this.virtualizerRef.value;if(!t)return;const r=t.querySelectorAll("esp-picker-item");let s=e.width;for(const i of r)s=Math.max(s,i.scrollWidth);if(s+=2,s>e.width){const{width:i}=g(),l=Math.min(s,i);this.style.setProperty("width",`${l}px`),this.style.setProperty("left",`${Math.max(0,Math.min(e.left,i-l))}px`)}}updatePosition(e){const t=w(e);if(t&&!t.pickerMenuIsOpen())return;const r=this.fullscreenPresentation,{fullscreen:s,rect:i}=this.syncPresentation(e),l=r!==s;if(l){const p=this.virtualizerRef.value?.scrollTop??0;p>0&&this.preRenderScrollTop===null&&!this.pendingItemsChanged&&!this.retargetingSequence&&(this.preRenderScrollTop=p),this.openSessionGeneration+=1,this.menuDirty=!0}if(!this.matches(":popover-open")){if(!t?.pickerMenuIsOpen())return;try{this.showPopover()}catch{this.menuDirty=!1,this.clearFullscreenTarget(e),this.removeAttribute("data-fullscreen"),this.clearFullscreenGeometry(),this.requestDismiss();return}this.classList.add("visible")}if(l&&this.settleMenuAfterUpdate(),s){this.applyFullscreenGeometry(i),l&&this.classList.add("visible");return}if(r){this.clearFullscreenGeometry(),this.style.setProperty("min-width",`${i.width}px`);const{height:p}=g(),{spaceAbove:I,spaceBelow:d}=x(i,p),P=Math.max(Math.max(I,d)-75,0);this.maxAvailableHeight=P,this.lastViewportHeight=p,this.style.setProperty("height",`${P}px`),this.sizeToContent(P)}const{height:n}=g();if(n!==this.lastViewportHeight){const{spaceAbove:p,spaceBelow:I}=x(i,n),d=Math.max(Math.max(p,I)-75,0);this.maxAvailableHeight=d,this.lastViewportHeight=n,(parseFloat(this.style.getPropertyValue("height"))||0)>d&&this.style.setProperty("height",`${d}px`),this.sizeToContent(d)}const{width:o}=g(),h=this.getBoundingClientRect().width;this.style.setProperty("left",`${Math.max(0,Math.min(i.left,o-h))}px`);const m=i.top,k=n-i.bottom;m>k?(this.style.removeProperty("top"),this.style.setProperty("bottom",`${n-i.top}px`)):(this.style.removeProperty("bottom"),this.style.setProperty("top",`${i.bottom}px`)),l&&this.classList.add("visible")}hideMenu(){this.openSessionGeneration+=1,this.classList.remove("visible"),this.resetSettleState(),this.clearFullscreenTarget(),this.positionTarget=null,this.removeAttribute("data-fullscreen"),this.clearFullscreenGeometry();try{this.hidePopover()}catch{}}resetSettleState(){this.preRenderScrollTop=null,this.pendingItemsChanged=!1,this.retargetingSequence=!1,this.internalPickScrollTop=null,this.menuDirty=!1}disconnectedCallback(){this.hideMenu(),super.disconnectedCallback()}doKeyboardNav(e){const t=this.virtualizedItemsPool;if(t.length!==0)switch(e){case"ArrowDown":this.highlightIndex+=1,this.setHighlight(0);break;case"ArrowUp":this.highlightIndex-=1,this.setHighlight(t.length-1);break;case"Home":this.highlightIndex=0,this.setHighlight(0);break;case"End":this.highlightIndex=t.length-1,this.setHighlight(t.length-1);break;case"Enter":if(this.highlightIndex===-1)return;this.pickItem(t[this.highlightIndex]);break}}render(){let e;return this.loading?e=f`<div class="status-message">Searching…</div>`:this.virtualizedItemsPool.length===0&&this.emptyMessage?e=f`<div class="status-message">${this.emptyMessage}</div>`:e=f`<lit-virtualizer
         ${R(this.virtualizerRef)}
         scroller
         .items=${this.virtualizedItemsPool}

package/dist/pickers/typeahead-controller.js

@@ -1 +1 @@
-function o(h,e){if(!e)return[];const t=[],s=h.toLowerCase(),n=e.toLowerCase();let r=0;for(;r<=s.length-n.length;){const i=s.indexOf(n,r);if(i===-1)break;t.push([i,i+n.length]),r=i+1}return t}class l{constructor(e){this.allItems=[],this.query="",this.abortController=null,this.fetchItemsFn=null,this.opts=e,e.host.addController(this)}hostConnected(){}hostDisconnected(){this.cancelPending()}setAllItems(e){this.allItems=e,this.query?this.runLocalFilter():this.opts.onFilteredItemsChanged(this.allItems)}setFetchItems(e){this.fetchItemsFn=e}setDebounceMs(e){this._debounceMs=e}setQuery(e){if(this.query=e,!e){this.cancelPending(),this.opts.onLoadingChanged(!1),this.opts.onFilteredItemsChanged(this.allItems);return}const t=this.resolvedDebounceMs;t===0?(this.cancelPending(),this.runFilterOrFetch()):(this.cancelDebounce(),this.debounceTimer=setTimeout(()=>{this.debounceTimer=void 0,this.runFilterOrFetch()},t))}clearQuery(){this.query="",this.cancelPending(),this.opts.onLoadingChanged(!1),this.opts.onFilteredItemsChanged(this.allItems)}resetQuery(){this.query="",this.cancelPending(),this.opts.onLoadingChanged(!1)}get currentQuery(){return this.query}get isRemote(){return this.fetchItemsFn!==null}fetchInitial(){this.fetchItemsFn&&(this.query="",this.runRemoteFetch())}get resolvedDebounceMs(){return this._debounceMs!==void 0?this._debounceMs:this.fetchItemsFn?300:0}runFilterOrFetch(){this.fetchItemsFn?this.runRemoteFetch():this.runLocalFilter()}runLocalFilter(){const e=this.query;if(!e){this.opts.onFilteredItemsChanged(this.allItems);return}const t=this.allItems.filter(s=>s.text.toLowerCase().includes(e.toLowerCase())).map(s=>({...s,highlightRanges:o(s.text,e)}));this.opts.onFilteredItemsChanged(t)}async runRemoteFetch(){if(!this.fetchItemsFn)return;this.abortController?.abort();const e=new AbortController;this.abortController=e,this.opts.onLoadingChanged(!0);try{const t=await this.fetchItemsFn(this.query,e.signal);if(e.signal.aborted)return;const s=t.map(n=>({...n,highlightRanges:o(n.text,this.query)}));this.opts.onFilteredItemsChanged(s)}catch(t){if(t instanceof DOMException&&t.name==="AbortError")return;this.opts.onFilteredItemsChanged([])}finally{e.signal.aborted||this.opts.onLoadingChanged(!1)}}cancelDebounce(){this.debounceTimer!==void 0&&(clearTimeout(this.debounceTimer),this.debounceTimer=void 0)}cancelPending(){this.cancelDebounce(),this.abortController?.abort(),this.abortController=null}}export{l as TypeaheadController,o as computeHighlightRanges};
+function o(r,e){if(!e)return[];const t=[],s=r.toLowerCase(),i=e.toLowerCase();let h=0;for(;h<=s.length-i.length;){const n=s.indexOf(i,h);if(n===-1)break;t.push([n,n+i.length]),h=n+1}return t}class l{constructor(e){this.allItems=[],this.query="",this.abortController=null,this.fetchItemsFn=null,this._showingRemoteResults=!1,this.opts=e,e.host.addController(this)}hostConnected(){}hostDisconnected(){this.cancelPending()}setAllItems(e){this.allItems=e,!(this._showingRemoteResults&&this.fetchItemsFn)&&(this.query?this.runLocalFilter():this.emit(this.allItems))}setFetchItems(e){e!==this.fetchItemsFn&&(this.fetchItemsFn=e,this.cancelPending(),this.opts.onLoadingChanged(!1),e&&this.query&&this.runRemoteFetch())}setDebounceMs(e){this._debounceMs=e}setQuery(e){if(this.query=e,!e){this.cancelPending(),this.opts.onLoadingChanged(!1),this.emit(this.allItems);return}const t=this.resolvedDebounceMs;t===0?(this.cancelPending(),this.runFilterOrFetch()):(this.cancelDebounce(),this.debounceTimer=setTimeout(()=>{this.debounceTimer=void 0,this.runFilterOrFetch()},t))}clearQuery(){this.query="",this.cancelPending(),this.opts.onLoadingChanged(!1),this.emit(this.allItems)}resetQuery(){this.query="",this.cancelPending(),this.opts.onLoadingChanged(!1)}get currentQuery(){return this.query}get showingRemoteResults(){return this._showingRemoteResults&&this.fetchItemsFn!==null}get isRemote(){return this.fetchItemsFn!==null}fetchInitial(){this.fetchItemsFn&&(this.query="",this.runRemoteFetch())}get resolvedDebounceMs(){return this._debounceMs!==void 0?this._debounceMs:this.fetchItemsFn?300:0}runFilterOrFetch(){this.fetchItemsFn?this.runRemoteFetch():this.runLocalFilter()}runLocalFilter(){const e=this.query;if(!e){this.emit(this.allItems);return}const t=this.allItems.filter(s=>s.text.toLowerCase().includes(e.toLowerCase())).map(s=>({...s,highlightRanges:o(s.text,e)}));this.emit(t)}emit(e){this._showingRemoteResults=!1,this.opts.onFilteredItemsChanged(e)}async runRemoteFetch(){if(!this.fetchItemsFn)return;this.abortController?.abort();const e=new AbortController;this.abortController=e,this.opts.onLoadingChanged(!0);try{const t=await this.fetchItemsFn(this.query,e.signal);if(e.signal.aborted)return;const s=t.map(i=>({...i,highlightRanges:o(i.text,this.query)}));this._showingRemoteResults=!0,this.opts.onFilteredItemsChanged(s)}catch(t){if(e.signal.aborted||t instanceof DOMException&&t.name==="AbortError")return;this._showingRemoteResults=!0,this.opts.onFilteredItemsChanged([])}finally{e.signal.aborted||this.opts.onLoadingChanged(!1)}}cancelDebounce(){this.debounceTimer!==void 0&&(clearTimeout(this.debounceTimer),this.debounceTimer=void 0)}cancelPending(){this.cancelDebounce(),this.abortController?.abort(),this.abortController=null}}export{l as TypeaheadController,o as computeHighlightRanges};

package/dist/radio-button/esp-radio-button-group.d.ts

@@ -31,6 +31,12 @@ import { type EspalierFormField } from "../form-item/esp-form-item.js";
  * </esp-box>
  * ```
  *
+ * Inside an `esp-form-item`, the group's `radiogroup` element takes the form
+ * item's `label` as its accessible name and its hint as its description.
+ * While the form item shows an error, that element is `aria-invalid="true"`
+ * and the error joins its description after the hint. Each option keeps its
+ * own label and is not described separately.
+ *
  * @slot - Place `esp-radio-button` elements in the default slot.
  *
  * @event {CustomEvent<string>} esp-value-changed - Fired when the

package/dist/radio-button/esp-radio-button-group.js

@@ -1,15 +1,16 @@
-var l=function(n,e,t,i){var a=arguments.length,s=a<3?e:i===null?i=Object.getOwnPropertyDescriptor(e,t):i,o;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")s=Reflect.decorate(n,e,t,i);else for(var h=n.length-1;h>=0;h--)(o=n[h])&&(s=(a<3?o(s):a>3?o(e,t,s):o(e,t))||s);return a>3&&s&&Object.defineProperty(e,t,s),s};import{css as f,html as c}from"lit";import{customElement as p,property as d}from"lit/decorators.js";import{EspalierElementBase as u}from"../shared/esp-element-base.js";import{createRef as m,ref as g}from"lit/directives/ref.js";import{EspalierRadioButton as y}from"./esp-radio-button.js";import{FormFieldController as b}from"../shared/form-field-controller.js";let r=class extends u{constructor(){super(...arguments),this.internals=this.attachInternals(),this.formCtrl=new b({host:this,internals:this.internals,getFormValue:()=>this.value||null,getValidity:()=>this.required&&!this.value?{flags:{valueMissing:!0},message:this.requiredMessage||"Please select an option."}:null,onReset:()=>{for(const e of this.getRadioButtons())e.checked=!1},onRestore:e=>{for(const t of this.getRadioButtons())t.checked=t.value===e},onDisabled:e=>{this.disabled=e}}),this.itemsSlot=m(),this.formItemDescription=null,this.describedRadios=new Set,this.name="",this.required=!1,this.requiredMessage="",this.disabled=!1,this.handleItemsSlotChange=()=>{this.applyDisabledState(),this.applyFormItemDescription()}}get value(){return this.getRadioButtons().find(e=>e.checked)?.value??""}focus(e){this.focusResolvedElementAfterUpdate(()=>{const t=this.getRadioButtons();return t.find(i=>i.checked&&!i.disabled)??t.find(i=>!i.disabled)},e)}setFormItemDescription(e){this.formItemDescription=e,this.applyFormItemDescription()}validate(){this.formCtrl.validate()}checkValidity(){return this.formCtrl.checkValidity()}getRadioButtons(){return this.itemsSlot.value?Array.from(this.itemsSlot.value.assignedElements()).filter(e=>e instanceof y):[]}applyDisabledState(){for(const e of this.getRadioButtons())e.disabled=this.disabled}applyFormItemDescription(){const e=new Set(this.getRadioButtons());for(const t of this.describedRadios)e.has(t)||t.setFormItemDescription(null);for(const t of e)t.setFormItemDescription(this.formItemDescription);this.describedRadios=e}handleChildChanged(e){e.stopPropagation();const t=e.detail;if(t.checked){for(const i of this.getRadioButtons())i.value!==t.value&&(i.checked=!1);this.formCtrl.syncValue(),this.emitValueChanged(t.value)}}handleKeyDown(e){if(!["ArrowDown","ArrowRight","ArrowUp","ArrowLeft"].includes(e.key))return;e.preventDefault();const t=this.getRadioButtons().filter(o=>!o.disabled);if(t.length===0)return;const i=t.findIndex(o=>o.checked),a=e.key==="ArrowDown"||e.key==="ArrowRight";let s;i===-1?s=0:a?s=(i+1)%t.length:s=(i-1+t.length)%t.length,i!==-1&&(t[i].checked=!1),t[s].checked=!0,t[s].focus(),this.formCtrl.syncValue(),this.emitValueChanged(t[s].value)}formResetCallback(){this.formCtrl.handleFormReset()}formStateRestoreCallback(e){this.formCtrl.handleFormStateRestore(e)}formDisabledCallback(e){this.formCtrl.handleFormDisabled(e)}firstUpdated(e){super.firstUpdated(e),this.applyDisabledState(),this.applyFormItemDescription()}updated(e){super.updated(e),e.has("disabled")&&this.applyDisabledState()}render(){return c`
+var l=function(n,e,t,r){var a=arguments.length,i=a<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,o;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(n,e,t,r);else for(var h=n.length-1;h>=0;h--)(o=n[h])&&(i=(a<3?o(i):a>3?o(e,t,i):o(e,t))||i);return a>3&&i&&Object.defineProperty(e,t,i),i};import{css as m,html as p}from"lit";import{customElement as g,property as d}from"lit/decorators.js";import{EspalierElementBase as u}from"../shared/esp-element-base.js";import{createRef as f,ref as c}from"lit/directives/ref.js";import{EspalierRadioButton as b}from"./esp-radio-button.js";import{FormFieldController as y}from"../shared/form-field-controller.js";import{FormFieldDescriptionController as v}from"../shared/form-field-description-controller.js";let s=class extends u{constructor(){super(...arguments),this.internals=this.attachInternals(),this.formCtrl=new y({host:this,internals:this.internals,getFormValue:()=>this.value||null,getValidity:()=>this.required&&!this.value?{flags:{valueMissing:!0},message:this.requiredMessage||"Please select an option."}:null,onReset:()=>{for(const e of this.getRadioButtons())e.checked=!1},onRestore:e=>{for(const t of this.getRadioButtons())t.checked=t.value===e},onDisabled:e=>{this.disabled=e}}),this.itemsSlot=f(),this.groupElement=f(),this.formItemDescription=new v({host:this,getTarget:()=>this.groupElement.value}),this.name="",this.required=!1,this.requiredMessage="",this.disabled=!1,this.handleItemsSlotChange=()=>{this.applyDisabledState()}}get value(){return this.getRadioButtons().find(e=>e.checked)?.value??""}focus(e){this.focusResolvedElementAfterUpdate(()=>{const t=this.getRadioButtons();return t.find(r=>r.checked&&!r.disabled)??t.find(r=>!r.disabled)},e)}setFormItemDescription(e){this.formItemDescription.setDescription(e)}setFormItemLabel(e){this.formItemDescription.setLabel(e)}setFormItemInvalid(e){this.formItemDescription.setInvalid(e)}validate(){this.formCtrl.validate()}checkValidity(){return this.formCtrl.checkValidity()}getRadioButtons(){return this.itemsSlot.value?Array.from(this.itemsSlot.value.assignedElements()).filter(e=>e instanceof b):[]}applyDisabledState(){for(const e of this.getRadioButtons())e.disabled=this.disabled}handleChildChanged(e){e.stopPropagation();const t=e.detail;if(t.checked){for(const r of this.getRadioButtons())r.value!==t.value&&(r.checked=!1);this.formCtrl.syncValue(),this.emitValueChanged(t.value)}}handleKeyDown(e){if(!["ArrowDown","ArrowRight","ArrowUp","ArrowLeft"].includes(e.key))return;e.preventDefault();const t=this.getRadioButtons().filter(o=>!o.disabled);if(t.length===0)return;const r=t.findIndex(o=>o.checked),a=e.key==="ArrowDown"||e.key==="ArrowRight";let i;r===-1?i=0:a?i=(r+1)%t.length:i=(r-1+t.length)%t.length,r!==-1&&(t[r].checked=!1),t[i].checked=!0,t[i].focus(),this.formCtrl.syncValue(),this.emitValueChanged(t[i].value)}formResetCallback(){this.formCtrl.handleFormReset()}formStateRestoreCallback(e){this.formCtrl.handleFormStateRestore(e)}formDisabledCallback(e){this.formCtrl.handleFormDisabled(e)}firstUpdated(e){super.firstUpdated(e),this.applyDisabledState()}updated(e){super.updated(e),e.has("disabled")&&this.applyDisabledState()}render(){return p`
       <div
         class="radio-group"
         role="radiogroup"
+        ${c(this.groupElement)}
         @esp-value-changed=${this.handleChildChanged}
         @keydown=${this.handleKeyDown}
       >
-        <slot ${g(this.itemsSlot)} @slotchange=${this.handleItemsSlotChange}></slot>
+        <slot ${c(this.itemsSlot)} @slotchange=${this.handleItemsSlotChange}></slot>
       </div>
-    `}};r.formAssociated=!0,r.styles=[...u.styles,f`
+    `}};s.clearsFormItemErrorOnChange=!0,s.formAssociated=!0,s.styles=[...u.styles,m`
       .radio-group {
         display: grid;
         gap: var(--esp-size-tiny);
       }
-    `],l([d({type:String,reflect:!0})],r.prototype,"name",void 0),l([d({type:Boolean,reflect:!0})],r.prototype,"required",void 0),l([d({attribute:"required-message"})],r.prototype,"requiredMessage",void 0),l([d({type:Boolean,reflect:!0})],r.prototype,"disabled",void 0),r=l([p("esp-radio-button-group")],r);export{r as EspalierRadioButtonGroup};
+    `],l([d({type:String,reflect:!0})],s.prototype,"name",void 0),l([d({type:Boolean,reflect:!0})],s.prototype,"required",void 0),l([d({attribute:"required-message"})],s.prototype,"requiredMessage",void 0),l([d({type:Boolean,reflect:!0})],s.prototype,"disabled",void 0),s=l([g("esp-radio-button-group")],s);export{s as EspalierRadioButtonGroup};

package/dist/radio-button/esp-radio-button.d.ts

@@ -29,6 +29,28 @@ import { type EspalierFormField } from "../form-item/esp-form-item.js";
  * </esp-box>
  * ```
  *
+ * ### Group name and errors
+ *
+ * Inside an `esp-form-item`, the group's `radiogroup` takes the form item's
+ * `label` as its accessible name and its hint as its description, so no
+ * wrapper `role="group"` or `aria-labelledby` is needed. While the form item
+ * shows an error, the `radiogroup` is `aria-invalid="true"`, the error joins
+ * its description after the hint, and the error is announced once. Each
+ * radio button keeps its own label. A choice clears an error set through the
+ * form item's `error` or `errorPool`, since a radio choice cannot be undone;
+ * pick an option below to see it.
+ *
+ * ```html
+ * <esp-box>
+ *   <esp-form-item label="Delivery speed" hint="Express ships the same day." error="Choose a delivery speed.">
+ *     <esp-radio-button-group required>
+ *       <esp-radio-button value="standard">Standard</esp-radio-button>
+ *       <esp-radio-button value="express">Express</esp-radio-button>
+ *     </esp-radio-button-group>
+ *   </esp-form-item>
+ * </esp-box>
+ * ```
+ *
  * @slot - The label text for the radio button.
  *
  * @event {CustomEvent<{ checked: boolean; value: string }>} esp-value-changed -

package/dist/radio-button/esp-radio-button.js

@@ -1,4 +1,4 @@
-var l=function(r,e,i,s){var a=arguments.length,t=a<3?e:s===null?s=Object.getOwnPropertyDescriptor(e,i):s,n;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")t=Reflect.decorate(r,e,i,s);else for(var c=r.length-1;c>=0;c--)(n=r[c])&&(t=(a<3?n(t):a>3?n(e,i,t):n(e,i))||t);return a>3&&t&&Object.defineProperty(e,i,t),t};import{css as h,html as f}from"lit";import{customElement as u,property as d}from"lit/decorators.js";import{EspalierElementBase as p}from"../shared/esp-element-base.js";import{FormFieldDescriptionController as m}from"../shared/form-field-description-controller.js";import{radioSelected as v}from"../shared/svgs/radio-selected.js";import{radioUnselected as b}from"../shared/svgs/radio-unselected.js";import{disabledControl as y,focusRing as g}from"../shared/style-fragments.js";let o=class extends p{constructor(){super(...arguments),this.formItemDescription=new m({host:this,getTarget:()=>this.shadowRoot?.querySelector(".radio-control")}),this.checked=!1,this.value="",this.disabled=!1}focus(e){this.focusShadowElementAfterUpdate(".radio-control",e)}setFormItemDescription(e){this.formItemDescription.setDescription(e)}select(){this.disabled||this.checked||(this.checked=!0,this.emitValueChanged({checked:this.checked,value:this.value}))}handleKeyDown(e){e.key===" "&&(e.preventDefault(),this.select())}render(){return f`
+var l=function(r,e,i,s){var a=arguments.length,t=a<3?e:s===null?s=Object.getOwnPropertyDescriptor(e,i):s,n;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")t=Reflect.decorate(r,e,i,s);else for(var c=r.length-1;c>=0;c--)(n=r[c])&&(t=(a<3?n(t):a>3?n(e,i,t):n(e,i))||t);return a>3&&t&&Object.defineProperty(e,i,t),t};import{css as h,html as f}from"lit";import{customElement as m,property as d}from"lit/decorators.js";import{EspalierElementBase as p}from"../shared/esp-element-base.js";import{FormFieldDescriptionController as u}from"../shared/form-field-description-controller.js";import{radioSelected as v}from"../shared/svgs/radio-selected.js";import{radioUnselected as b}from"../shared/svgs/radio-unselected.js";import{disabledControl as y,focusRing as g}from"../shared/style-fragments.js";let o=class extends p{constructor(){super(...arguments),this.formItemDescription=new u({host:this,getTarget:()=>this.shadowRoot?.querySelector(".radio-control")}),this.checked=!1,this.value="",this.disabled=!1}focus(e){this.focusShadowElementAfterUpdate(".radio-control",e)}setFormItemDescription(e){this.formItemDescription.setDescription(e)}setFormItemInvalid(e){this.formItemDescription.setInvalid(e)}select(){this.disabled||this.checked||(this.checked=!0,this.emitValueChanged({checked:this.checked,value:this.value}))}handleKeyDown(e){e.key===" "&&(e.preventDefault(),this.select())}render(){return f`
       <div
         class="radio-control"
         role="radio"
@@ -47,4 +47,4 @@ var l=function(r,e,i,s){var a=arguments.length,t=a<3?e:s===null?s=Object.getOwnP
           line-height: 1.3;
         }
       }
-    `],l([d({type:Boolean,reflect:!0})],o.prototype,"checked",void 0),l([d({type:String})],o.prototype,"value",void 0),l([d({type:Boolean,reflect:!0})],o.prototype,"disabled",void 0),o=l([u("esp-radio-button")],o);export{o as EspalierRadioButton};
+    `],l([d({type:Boolean,reflect:!0})],o.prototype,"checked",void 0),l([d({type:String})],o.prototype,"value",void 0),l([d({type:Boolean,reflect:!0})],o.prototype,"disabled",void 0),o=l([m("esp-radio-button")],o);export{o as EspalierRadioButton};

package/dist/root/esp-root.js

@@ -1,4 +1,4 @@
-var r=function(c,e,t,s){var n=arguments.length,i=n<3?e:s===null?s=Object.getOwnPropertyDescriptor(e,t):s,m;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(c,e,t,s);else for(var l=c.length-1;l>=0;l--)(m=c[l])&&(i=(n<3?m(i):n>3?m(e,t,i):m(e,t))||i);return n>3&&i&&Object.defineProperty(e,t,i),i},a;import{css as b,html as w,LitElement as E}from"lit";import{customElement as C,property as h,state as R}from"lit/decorators.js";import{getEspBus as d}from"../shared/bus-events.js";import{subscribeToRootEvent as x}from"../shared/root-event-subscription.js";import{DEFAULT_LIGHT_THEME as f,DEFAULT_DARK_THEME as g,encodeTheme as y,parseTheme as u,mergeTheme as v}from"../shared/theme.js";import{extractFamily as p,isLocalFontFamily as L,removeRuntimeGoogleFontLinks as S,syncRuntimeGoogleFontLink as A}from"../shared/font-helpers.js";import{computeThemeProperties as D}from"./helpers/compute-theme-properties.js";import{registerImageTexture as I,registeredImageTextures as F}from"../shared/image-texture-registry.js";import{registerImageTexture as $,registeredImageTextures as Q,BUILT_IN_IMAGE_TEXTURES as q}from"../shared/image-texture-registry.js";const T=1e3;let o=a=class extends E{constructor(){super(...arguments),this.schemeBacker="",this.schemeExplicitlySet=!1,this.resolvingDefaultScheme=!1,this.themeEventsReady=!1,this.systemSchemeQuery=null,this.lastSeedColor="",this.resolvedLightTheme={...f},this.resolvedDarkTheme={...g},this.appliedThemeProperties=new Set,this.documentClickRegistrationActive=!1,this.correlationId=globalThis.crypto?.randomUUID?.()??Math.random().toString(36),this.lightThemeAttr="",this.darkThemeAttr="",this.fontCSSRoot="/css/fonts/",this.fontDefinitionsUrl="",this.googleFontLoading="auto",this.iconSpriteUrl="/assets/icons.svg",this.themePending=!1,this.themeReadyState=!1,this.themeSettleWaiters=[],this.warnedThemeSettleTimeout=!1,this.defaultScheme="light",this.resizeObserver=new ResizeObserver(()=>{d().publish("window-resized",{emWidth:window.innerWidth/parseFloat(getComputedStyle(document.documentElement).fontSize),emHeight:window.innerHeight/parseFloat(getComputedStyle(document.documentElement).fontSize),pxWidth:window.innerWidth,pxHeight:window.innerHeight})}),this.handleSystemSchemeChange=e=>{this.schemeExplicitlySet||this.defaultScheme!=="system"||(this.resolvingDefaultScheme=!0,this.scheme=e.matches?"dark":"light",this.resolvingDefaultScheme=!1)}}static registerTexture(e,t){I(e,t)}static registeredTextures(){return F()}subscribeScoped(e,t){return x(this,e,t)}get lightTheme(){return this.lightThemeAttr?u(this.lightThemeAttr):null}set lightTheme(e){this.lightThemeAttr=e?y(e):""}get darkTheme(){return this.darkThemeAttr?u(this.darkThemeAttr):null}set darkTheme(e){this.darkThemeAttr=e?y(e):""}get themeSettled(){return this.themeReadyState}whenThemeSettled(){return this.themeReadyState?Promise.resolve():new Promise(e=>{this.themeSettleWaiters.push(e)})}get hasAuthorTheme(){return!!(this.scheme==="dark"?this.darkThemeAttr:this.lightThemeAttr)}settleTheme(){if(this.themeSettleTimer!==void 0&&(clearTimeout(this.themeSettleTimer),this.themeSettleTimer=void 0),this.themeReadyState)return;this.themeReadyState=!0;const e=this.themeSettleWaiters;this.themeSettleWaiters=[];for(const t of e)t()}get scheme(){return this.schemeBacker}set scheme(e){const t=e==="dark"?"dark":e==="light"?"light":"",s=this.schemeBacker,n=this.schemeExplicitlySet;this.resolvingDefaultScheme||(this.schemeExplicitlySet=t.length>0);const i=t||this.resolveDefaultScheme();n!==this.schemeExplicitlySet&&this.isConnected&&this.syncSystemSchemeListener(),i!==s&&(this.schemeBacker=i,this.requestUpdate("scheme",s),this.themeEventsReady&&d().publish("scheme-changed",{scheme:i,correlationId:this.correlationId}))}get seedColor(){return this.activeTheme.seedColor}injectGoogleFontLink(e,t,s){const n=`${this.correlationId}-${e}`,i=L(t)?"":t;A({owner:`root:${n}`,family:i,weight:s,enabled:this.googleFontLoading!=="none",attributes:{"data-esp-font":n}})}syncGoogleFontLinks(){this.googleFontLoading==="none"&&this.removeRuntimeGoogleFontLinks();const e=this.activeTheme;this.injectGoogleFontLink("body",p(e.fontBody),e.fontWeightBody),this.injectGoogleFontLink("headings",p(e.fontHeadings),e.fontWeightHeadings),this.injectGoogleFontLink("brand",p(e.fontBrand),e.fontWeightBrand),this.injectGoogleFontLink("menu",p(e.fontMenu),e.fontWeightMenu),this.injectGoogleFontLink("monospace",p(e.fontMonospace),e.fontWeightMonospace)}removeRuntimeGoogleFontLinks(){S(`root:${this.correlationId}-`),S(`picker:${this.correlationId}:`);for(const e of document.head.querySelectorAll(`link[data-esp-font^="${this.correlationId}-"]`))e.remove();for(const e of document.head.querySelectorAll(`link[data-esp-font-picker-root="${CSS.escape(this.correlationId)}"]`))e.remove()}get activeTheme(){return this.scheme==="dark"?this.resolvedDarkTheme:this.resolvedLightTheme}resolveThemes(){const e=this.lightThemeAttr?u(this.lightThemeAttr):null;this.resolvedLightTheme=e?v(f,e):{...f};const t=this.darkThemeAttr?u(this.darkThemeAttr):null;this.resolvedDarkTheme=t?v(g,t):{...g}}connectedCallback(){super.connectedCallback(),this.registerDocumentClickBridge(),this.resizeObserver.observe(this),this.hasUpdated&&(this.applyDefaultScheme(),this.syncGoogleFontLinks(),this.hasAuthorTheme||this.startThemeSettleTimer())}willUpdate(e){const t=["lightThemeAttr","darkThemeAttr"];(!this.lastSeedColor||t.some(l=>e.has(l)))&&(this.resolveThemes(),this.themeEventsReady&&d().publish("theme-changed",{correlationId:this.correlationId})),this.hasAuthorTheme&&this.settleTheme();const n=D(this.activeTheme,this.scheme==="dark"?"dark":"light"),i=new Set(Object.keys(n));for(const l of this.appliedThemeProperties)i.has(l)||this.style.removeProperty(l);for(const[l,k]of Object.entries(n))this.style.setProperty(l,k);this.appliedThemeProperties=i;const m=this.activeTheme.seedColor;this.themeEventsReady&&this.lastSeedColor&&this.lastSeedColor!==m&&d().publish("seed-color-changed",{seedColor:m,correlationId:this.correlationId}),this.lastSeedColor=m,this.themeEventsReady&&e.has("iconSpriteUrl")&&d().publish("icon-sprite-url-changed",{iconSpriteUrl:this.iconSpriteUrl,correlationId:this.correlationId}),this.syncGoogleFontLinks()}firstUpdated(){const e=this.activeTheme.stylesheets;if(e.length)for(const t of e){const s=document.createElement("link");s.rel="stylesheet",s.href=t,document.head.appendChild(s)}if(!document.getElementById("esp-root-base-styles")){const t=document.createElement("style");t.id="esp-root-base-styles",t.textContent=a.lightDomStyles,document.head.appendChild(t)}this.applyDefaultScheme(),this.lastSeedColor=this.activeTheme.seedColor,this.themeEventsReady=!0,this.startThemeSettleTimer()}startThemeSettleTimer(){if(this.themeReadyState||this.themeSettleTimer!==void 0)return;this.themeSettleDeadline??=performance.now()+T;const e=Math.max(0,this.themeSettleDeadline-performance.now());if(e===0){this.closeThemeWindow();return}this.themeSettleTimer=setTimeout(()=>this.closeThemeWindow(),e)}closeThemeWindow(){this.themeSettleTimer=void 0,this.themePending&&!this.warnedThemeSettleTimeout&&(this.warnedThemeSettleTimeout=!0,console.warn(`Espalier root: theme-pending was declared but no ${this.scheme} theme arrived within ${T}ms, so the default palette is rendering. Assign ${this.scheme==="dark"?"darkTheme":"lightTheme"} (or remove theme-pending).`)),this.settleTheme()}updated(e){this.toggleAttribute("data-theme-ready",this.themeReadyState),(e.has("defaultScheme")||e.has("scheme"))&&!this.schemeExplicitlySet&&this.applyDefaultScheme()}disconnectedCallback(){this.themeSettleTimer!==void 0&&(clearTimeout(this.themeSettleTimer),this.themeSettleTimer=void 0),this.unregisterDocumentClickBridge(),this.systemSchemeQuery?.removeEventListener("change",this.handleSystemSchemeChange),this.systemSchemeQuery=null,this.resizeObserver.disconnect(),this.removeRuntimeGoogleFontLinks(),super.disconnectedCallback()}registerDocumentClickBridge(){this.documentClickRegistrationActive||(this.documentClickRegistrationActive=!0,a.connectedRootCount+=1,a.connectedRootCount===1&&document.addEventListener("click",a.handleDocumentClick))}unregisterDocumentClickBridge(){this.documentClickRegistrationActive&&(this.documentClickRegistrationActive=!1,a.connectedRootCount=Math.max(0,a.connectedRootCount-1),a.connectedRootCount===0&&document.removeEventListener("click",a.handleDocumentClick))}applyDefaultScheme(){this.schemeExplicitlySet||(this.resolvingDefaultScheme=!0,this.scheme=this.resolveDefaultScheme(),this.resolvingDefaultScheme=!1,this.syncSystemSchemeListener())}resolveDefaultScheme(){return this.defaultScheme==="dark"||this.defaultScheme==="system"&&window.matchMedia?.("(prefers-color-scheme: dark)").matches?"dark":"light"}syncSystemSchemeListener(){if(this.schemeExplicitlySet||this.defaultScheme!=="system"||!window.matchMedia){this.systemSchemeQuery?.removeEventListener("change",this.handleSystemSchemeChange),this.systemSchemeQuery=null;return}this.systemSchemeQuery||(this.systemSchemeQuery=window.matchMedia("(prefers-color-scheme: dark)"),this.systemSchemeQuery.addEventListener("change",this.handleSystemSchemeChange))}render(){return w`<slot></slot>`}};o.connectedRootCount=0,o.handleDocumentClick=c=>{const e=c.composedPath().filter(t=>t instanceof HTMLElement&&t.tagName==="ESP-POPOVER");d().publish("close-popovers",{source:c.target??void 0,skipPopovers:e})},o.lightDomStyles=`
+var r=function(c,e,t,s){var h=arguments.length,i=h<3?e:s===null?s=Object.getOwnPropertyDescriptor(e,t):s,m;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(c,e,t,s);else for(var l=c.length-1;l>=0;l--)(m=c[l])&&(i=(h<3?m(i):h>3?m(e,t,i):m(e,t))||i);return h>3&&i&&Object.defineProperty(e,t,i),i},a;import{css as b,html as w,LitElement as E}from"lit";import{customElement as C,property as n,state as R}from"lit/decorators.js";import{getEspBus as d}from"../shared/bus-events.js";import{subscribeToRootEvent as x}from"../shared/root-event-subscription.js";import{DEFAULT_LIGHT_THEME as f,DEFAULT_DARK_THEME as g,encodeTheme as y,parseTheme as u,mergeTheme as v}from"../shared/theme.js";import{extractFamily as p,isLocalFontFamily as L,removeRuntimeGoogleFontLinks as S,syncRuntimeGoogleFontLink as D}from"../shared/font-helpers.js";import{computeThemeProperties as A}from"./helpers/compute-theme-properties.js";import{registerImageTexture as F,registeredImageTextures as I}from"../shared/image-texture-registry.js";import{registerImageTexture as Q,registeredImageTextures as $,BUILT_IN_IMAGE_TEXTURES as N}from"../shared/image-texture-registry.js";const T=1e3;let o=a=class extends E{constructor(){super(...arguments),this.schemeBacker="",this.schemeExplicitlySet=!1,this.resolvingDefaultScheme=!1,this.themeEventsReady=!1,this.systemSchemeQuery=null,this.lastSeedColor="",this.resolvedLightTheme={...f},this.resolvedDarkTheme={...g},this.appliedThemeProperties=new Set,this.documentClickRegistrationActive=!1,this.correlationId=globalThis.crypto?.randomUUID?.()??Math.random().toString(36),this.lightThemeAttr="",this.darkThemeAttr="",this.fontCSSRoot="/css/fonts/",this.fontDefinitionsUrl="",this.googleFontLoading="auto",this.iconSpriteUrl="/assets/icons.svg",this.themePending=!1,this.themeReadyState=!1,this.themeSettleWaiters=[],this.warnedThemeSettleTimeout=!1,this.defaultScheme="light",this.resizeObserver=new ResizeObserver(()=>{d().publish("window-resized",{emWidth:window.innerWidth/parseFloat(getComputedStyle(document.documentElement).fontSize),emHeight:window.innerHeight/parseFloat(getComputedStyle(document.documentElement).fontSize),pxWidth:window.innerWidth,pxHeight:window.innerHeight})}),this.handleSystemSchemeChange=e=>{this.schemeExplicitlySet||this.defaultScheme!=="system"||(this.resolvingDefaultScheme=!0,this.scheme=e.matches?"dark":"light",this.resolvingDefaultScheme=!1)}}static registerTexture(e,t){F(e,t)}static registeredTextures(){return I()}subscribeScoped(e,t){return x(this,e,t)}get lightTheme(){return this.lightThemeAttr?u(this.lightThemeAttr):null}set lightTheme(e){this.lightThemeAttr=e?y(e):""}get darkTheme(){return this.darkThemeAttr?u(this.darkThemeAttr):null}set darkTheme(e){this.darkThemeAttr=e?y(e):""}get themeSettled(){return this.themeReadyState}whenThemeSettled(){return this.themeReadyState?Promise.resolve():new Promise(e=>{this.themeSettleWaiters.push(e)})}get hasAuthorTheme(){return!!(this.scheme==="dark"?this.darkThemeAttr:this.lightThemeAttr)}settleTheme(){if(this.themeSettleTimer!==void 0&&(clearTimeout(this.themeSettleTimer),this.themeSettleTimer=void 0),this.themeReadyState)return;this.themeReadyState=!0;const e=this.themeSettleWaiters;this.themeSettleWaiters=[];for(const t of e)t()}get scheme(){return this.schemeBacker}set scheme(e){const t=e==="dark"?"dark":e==="light"?"light":"",s=this.schemeBacker,h=this.schemeExplicitlySet;this.resolvingDefaultScheme||(this.schemeExplicitlySet=t.length>0);const i=t||this.resolveDefaultScheme();h!==this.schemeExplicitlySet&&this.isConnected&&this.syncSystemSchemeListener(),i!==s&&(this.schemeBacker=i,this.requestUpdate("scheme",s),this.themeEventsReady&&d().publish("scheme-changed",{scheme:i,correlationId:this.correlationId}))}get seedColor(){return this.activeTheme.seedColor}injectGoogleFontLink(e,t,s){const h=`${this.correlationId}-${e}`,i=L(t)?"":t;D({owner:`root:${h}`,family:i,weight:s,enabled:this.googleFontLoading!=="none"})}syncGoogleFontLinks(){this.googleFontLoading==="none"&&this.removeRuntimeGoogleFontLinks();const e=this.activeTheme;this.injectGoogleFontLink("body",p(e.fontBody),e.fontWeightBody),this.injectGoogleFontLink("headings",p(e.fontHeadings),e.fontWeightHeadings),this.injectGoogleFontLink("brand",p(e.fontBrand),e.fontWeightBrand),this.injectGoogleFontLink("menu",p(e.fontMenu),e.fontWeightMenu),this.injectGoogleFontLink("monospace",p(e.fontMonospace),e.fontWeightMonospace)}removeRuntimeGoogleFontLinks(){S(`root:${this.correlationId}-`),S(`picker:${this.correlationId}:`)}get activeTheme(){return this.scheme==="dark"?this.resolvedDarkTheme:this.resolvedLightTheme}resolveThemes(){const e=this.lightThemeAttr?u(this.lightThemeAttr):null;this.resolvedLightTheme=e?v(f,e):{...f};const t=this.darkThemeAttr?u(this.darkThemeAttr):null;this.resolvedDarkTheme=t?v(g,t):{...g}}connectedCallback(){super.connectedCallback(),this.registerDocumentClickBridge(),this.resizeObserver.observe(this),this.hasUpdated&&(this.applyDefaultScheme(),this.syncGoogleFontLinks(),this.hasAuthorTheme||this.startThemeSettleTimer())}willUpdate(e){const t=["lightThemeAttr","darkThemeAttr"];(!this.lastSeedColor||t.some(l=>e.has(l)))&&(this.resolveThemes(),this.themeEventsReady&&d().publish("theme-changed",{correlationId:this.correlationId})),this.hasAuthorTheme&&this.settleTheme();const h=A(this.activeTheme,this.scheme==="dark"?"dark":"light"),i=new Set(Object.keys(h));for(const l of this.appliedThemeProperties)i.has(l)||this.style.removeProperty(l);for(const[l,k]of Object.entries(h))this.style.setProperty(l,k);this.appliedThemeProperties=i;const m=this.activeTheme.seedColor;this.themeEventsReady&&this.lastSeedColor&&this.lastSeedColor!==m&&d().publish("seed-color-changed",{seedColor:m,correlationId:this.correlationId}),this.lastSeedColor=m,this.themeEventsReady&&e.has("iconSpriteUrl")&&d().publish("icon-sprite-url-changed",{iconSpriteUrl:this.iconSpriteUrl,correlationId:this.correlationId}),this.syncGoogleFontLinks()}firstUpdated(){const e=this.activeTheme.stylesheets;if(e.length)for(const t of e){const s=document.createElement("link");s.rel="stylesheet",s.href=t,document.head.appendChild(s)}if(!document.getElementById("esp-root-base-styles")){const t=document.createElement("style");t.id="esp-root-base-styles",t.textContent=a.lightDomStyles,document.head.appendChild(t)}this.applyDefaultScheme(),this.lastSeedColor=this.activeTheme.seedColor,this.themeEventsReady=!0,this.startThemeSettleTimer()}startThemeSettleTimer(){if(this.themeReadyState||this.themeSettleTimer!==void 0)return;this.themeSettleDeadline??=performance.now()+T;const e=Math.max(0,this.themeSettleDeadline-performance.now());if(e===0){this.closeThemeWindow();return}this.themeSettleTimer=setTimeout(()=>this.closeThemeWindow(),e)}closeThemeWindow(){this.themeSettleTimer=void 0,this.themePending&&!this.warnedThemeSettleTimeout&&(this.warnedThemeSettleTimeout=!0,console.warn(`Espalier root: theme-pending was declared but no ${this.scheme} theme arrived within ${T}ms, so the default palette is rendering. Assign ${this.scheme==="dark"?"darkTheme":"lightTheme"} (or remove theme-pending).`)),this.settleTheme()}updated(e){this.toggleAttribute("data-theme-ready",this.themeReadyState),(e.has("defaultScheme")||e.has("scheme"))&&!this.schemeExplicitlySet&&this.applyDefaultScheme()}disconnectedCallback(){this.themeSettleTimer!==void 0&&(clearTimeout(this.themeSettleTimer),this.themeSettleTimer=void 0),this.unregisterDocumentClickBridge(),this.systemSchemeQuery?.removeEventListener("change",this.handleSystemSchemeChange),this.systemSchemeQuery=null,this.resizeObserver.disconnect(),this.removeRuntimeGoogleFontLinks(),super.disconnectedCallback()}registerDocumentClickBridge(){this.documentClickRegistrationActive||(this.documentClickRegistrationActive=!0,a.connectedRootCount+=1,a.connectedRootCount===1&&document.addEventListener("click",a.handleDocumentClick))}unregisterDocumentClickBridge(){this.documentClickRegistrationActive&&(this.documentClickRegistrationActive=!1,a.connectedRootCount=Math.max(0,a.connectedRootCount-1),a.connectedRootCount===0&&document.removeEventListener("click",a.handleDocumentClick))}applyDefaultScheme(){this.schemeExplicitlySet||(this.resolvingDefaultScheme=!0,this.scheme=this.resolveDefaultScheme(),this.resolvingDefaultScheme=!1,this.syncSystemSchemeListener())}resolveDefaultScheme(){return this.defaultScheme==="dark"||this.defaultScheme==="system"&&window.matchMedia?.("(prefers-color-scheme: dark)").matches?"dark":"light"}syncSystemSchemeListener(){if(this.schemeExplicitlySet||this.defaultScheme!=="system"||!window.matchMedia){this.systemSchemeQuery?.removeEventListener("change",this.handleSystemSchemeChange),this.systemSchemeQuery=null;return}this.systemSchemeQuery||(this.systemSchemeQuery=window.matchMedia("(prefers-color-scheme: dark)"),this.systemSchemeQuery.addEventListener("change",this.handleSystemSchemeChange))}render(){return w`<slot></slot>`}};o.connectedRootCount=0,o.handleDocumentClick=c=>{const e=c.composedPath().filter(t=>t instanceof HTMLElement&&t.tagName==="ESP-POPOVER");d().publish("close-popovers",{source:c.target??void 0,skipPopovers:e})},o.lightDomStyles=`
     
     esp-root {
       font-family: var(--_esp-font-body-effective, var(--esp-font-body, system-ui, sans-serif));
@@ -136,4 +136,4 @@ var r=function(c,e,t,s){var n=arguments.length,i=n<3?e:s===null?s=Object.getOwnP
     :host([theme-pending]:not([data-theme-ready])) {
       visibility: hidden;
     }
-  `,r([h({attribute:!1})],o.prototype,"correlationId",void 0),r([h({attribute:"light-theme"})],o.prototype,"lightThemeAttr",void 0),r([h({attribute:"dark-theme"})],o.prototype,"darkThemeAttr",void 0),r([h({attribute:!1})],o.prototype,"lightTheme",null),r([h({attribute:!1})],o.prototype,"darkTheme",null),r([h({attribute:"font-css-root",type:String})],o.prototype,"fontCSSRoot",void 0),r([h({attribute:"font-definitions-url",type:String})],o.prototype,"fontDefinitionsUrl",void 0),r([h({attribute:"google-font-loading",type:String})],o.prototype,"googleFontLoading",void 0),r([h({attribute:"icon-sprite-url",type:String})],o.prototype,"iconSpriteUrl",void 0),r([h({attribute:"theme-pending",reflect:!0,type:Boolean})],o.prototype,"themePending",void 0),r([R()],o.prototype,"themeReadyState",void 0),r([h({attribute:"default-scheme",type:String,reflect:!0})],o.prototype,"defaultScheme",void 0),r([h({attribute:"scheme",type:String,reflect:!0})],o.prototype,"scheme",null),o=a=r([C("esp-root")],o);export{q as BUILT_IN_IMAGE_TEXTURES,o as EspalierRoot,$ as registerImageTexture,Q as registeredImageTextures};
+  `,r([n({attribute:!1})],o.prototype,"correlationId",void 0),r([n({attribute:"light-theme"})],o.prototype,"lightThemeAttr",void 0),r([n({attribute:"dark-theme"})],o.prototype,"darkThemeAttr",void 0),r([n({attribute:!1})],o.prototype,"lightTheme",null),r([n({attribute:!1})],o.prototype,"darkTheme",null),r([n({attribute:"font-css-root",type:String})],o.prototype,"fontCSSRoot",void 0),r([n({attribute:"font-definitions-url",type:String})],o.prototype,"fontDefinitionsUrl",void 0),r([n({attribute:"google-font-loading",type:String})],o.prototype,"googleFontLoading",void 0),r([n({attribute:"icon-sprite-url",type:String})],o.prototype,"iconSpriteUrl",void 0),r([n({attribute:"theme-pending",reflect:!0,type:Boolean})],o.prototype,"themePending",void 0),r([R()],o.prototype,"themeReadyState",void 0),r([n({attribute:"default-scheme",type:String,reflect:!0})],o.prototype,"defaultScheme",void 0),r([n({attribute:"scheme",type:String,reflect:!0})],o.prototype,"scheme",null),o=a=r([C("esp-root")],o);export{N as BUILT_IN_IMAGE_TEXTURES,o as EspalierRoot,Q as registerImageTexture,$ as registeredImageTextures};

package/dist/shared/enum-converter.js

@@ -0,0 +1 @@
+function e(r,n){return{fromAttribute(t){return t!==null&&r.has(t)?t:n},toAttribute(t){return r.has(t)?t:n}}}export{e as enumConverter};

package/dist/shared/events.d.ts

@@ -32,6 +32,7 @@ export { type PickerItem } from "../pickers/esp-picker-item.js";
 export { type EspalierUploadImage } from "../image-upload/image-helpers.js";
 export { type FontPickerValueChangedDetail, type GoogleFont, type WebSafeFont, } from "../font-picker/esp-font-picker.js";
 export { type EspThemeToggleEventDetail } from "../header/esp-header.js";
+export { type VideoErrorDetail, type VideoErrorReason, type VideoPlayDetail, type VideoReadyDetail, type VideoSourceMode, } from "../video/esp-video.js";
 export { type PageWorkspaceResizeDetail, type PageWorkspaceResizeSource, type PageWorkspaceSeparator, } from "../page/esp-page.js";
 import type { EspalierDetails } from "../details/esp-details.js";
 import type { ActionMenuSelectDetail } from "../action-menu/esp-action-menu.js";
@@ -40,6 +41,7 @@ import type { FlyoutCloseReason } from "./flyout-events.js";
 import { type ValidityChangedDetail } from "./validation.js";
 import type { GridClickedEvent, GridItemsChangedEventDetail, GridLoadErrorEventDetail, GridLoadStartEventDetail, GridLoadSuccessEventDetail } from "../grid/esp-grid.js";
 import type { DestroyEspalierInfo } from "../info/esp-info.js";
+import type { VideoErrorDetail, VideoPlayDetail, VideoReadyDetail } from "../video/esp-video.js";
 import type { PickerItem } from "../pickers/esp-picker-item.js";
 import type { EspalierUploadImage, UploadEventDetail } from "../image-upload/image-helpers.js";
 export type { UploadEventDetail } from "../image-upload/image-helpers.js";
@@ -121,6 +123,9 @@ export declare const ESP_EVENTS: {
     readonly TREE_CUT: "esp-tree-cut";
     readonly TREE_PASTE_CHILD: "esp-tree-paste-child";
     readonly TREE_GRAFT_INPUT: "esp-tree-graft-input";
+    readonly VIDEO_READY: "esp-video-ready";
+    readonly VIDEO_PLAY: "esp-video-play";
+    readonly VIDEO_ERROR: "esp-video-error";
 };
 /**
  * Detail for `esp-value-changed` on toggle controls
@@ -477,3 +482,9 @@ export interface EspalierTreeEventMap {
     [ESP_EVENTS.TREE_PASTE_CHILD]: CustomEvent<EspTreeNodeActionDetail>;
     [ESP_EVENTS.TREE_GRAFT_INPUT]: CustomEvent<EspTreeGraftInputDetail>;
 }
+/** Events fired by `<esp-video>`. */
+export interface EspalierVideoEventMap {
+    [ESP_EVENTS.VIDEO_READY]: CustomEvent<VideoReadyDetail>;
+    [ESP_EVENTS.VIDEO_PLAY]: CustomEvent<VideoPlayDetail>;
+    [ESP_EVENTS.VIDEO_ERROR]: CustomEvent<VideoErrorDetail>;
+}

package/dist/shared/events.js

@@ -1 +1 @@
-import{VALIDITY_CHANGED_EVENT as r}from"./validation.js";import{VALIDITY_CHANGED_EVENT as e}from"./validation.js";const s={VALUE_CHANGED:"esp-value-changed",VALIDITY_CHANGED:e,CLICKED:"esp-clicked",ACTION_MENU_SELECT:"esp-action-menu-select",BURGER_OPENED:"esp-burger-opened",BURGER_CLOSED:"esp-burger-closed",DETAILS_TOGGLE:"esp-details-toggle",DETAILS_GROUP_CHANGE:"esp-details-group-change",DIALOG_OPENED:"esp-dialog-opened",DIALOG_CLOSING:"esp-dialog-closing",DIALOG_CLOSED:"esp-dialog-closed",FILE_UPLOAD_FILES_SELECTED:"esp-file-upload-files-selected",FLYOUT_OPENED:"esp-flyout-opened",FLYOUT_CLOSED:"esp-flyout-closed",FLYOUT_STATE_CHANGED:"esp-flyout-state-changed",FOCUS_PICKER_CHANGED:"esp-focus-picker-changed",FORM_DIALOG_CLOSE_REQUESTED:"esp-form-dialog-close-requested",FORM_SUBMIT:"esp-form-submit",FORM_SUBMIT_RESPONSE:"esp-form-submit-response",FORM_SUBMIT_ERROR:"esp-form-submit-error",GRID_EVENT:"esp-grid-event",GRID_LOAD_START:"esp-grid-load-start",GRID_LOAD_SUCCESS:"esp-grid-load-success",GRID_LOAD_ERROR:"esp-grid-load-error",GRID_ITEMS_CHANGED:"esp-grid-items-changed",HEADER_THEME_TOGGLE:"esp-header-theme-toggle",IMAGE_UPLOAD_FILE_SELECTED:"esp-image-upload-file-selected",IMAGE_UPLOAD_FILE_REMOVED:"esp-image-upload-file-removed",IMAGE_UPLOAD_FILES_REJECTED:"esp-image-upload-files-rejected",IMAGE_UPLOAD_RETRY:"esp-image-upload-retry",IMAGE_UPLOAD_IMAGES_REORDERED:"esp-image-upload-images-reordered",INFO_DESTROY:"esp-info-destroy",INPUT_ICON_CLICKED:"esp-input-icon-clicked",LIGHTBOX_CHANGED:"esp-lightbox-changed",MENU_GROUP_TOGGLE:"esp-menu-group-toggle",MENU_DRAWER_OPENED:"esp-menu-drawer-opened",MENU_DRAWER_CLOSED:"esp-menu-drawer-closed",MENU_DRAWER_PRESENTED:"esp-menu-drawer-presented",PAGE_WORKSPACE_RESIZE:"esp-page-workspace-resize",PICKER_MENU_SELECTION_CHANGED:"esp-picker-menu-selection-changed",PICKER_MENU_CLOSE_REQUESTED:"esp-picker-menu-close-requested",PICKER_MENU_DISMISS_REQUESTED:"esp-picker-menu-dismiss-requested",PICKER_MENU_RANGE_CHANGED:"esp-picker-menu-range-changed",POPOVER_OPENED:"esp-popover-opened",POPOVER_CLOSED:"esp-popover-closed",SEARCH_REQUESTED:"esp-search-requested",SEARCH_RESULT_SELECTED:"esp-search-result-selected",SEARCH_CLOSED:"esp-search-closed",TAB_GROUP_CHANGED:"esp-tab-group-changed",TREE_SELECT:"esp-tree-select",TREE_TOGGLE:"esp-tree-toggle",TREE_GRAFT_REQUEST:"esp-tree-graft-request",TREE_GRAFT:"esp-tree-graft",TREE_EDIT:"esp-tree-edit",TREE_DELETE:"esp-tree-delete",TREE_MOVE_UP:"esp-tree-move-up",TREE_MOVE_DOWN:"esp-tree-move-down",TREE_CUT:"esp-tree-cut",TREE_PASTE_CHILD:"esp-tree-paste-child",TREE_GRAFT_INPUT:"esp-tree-graft-input"};export{s as ESP_EVENTS,r as VALIDITY_CHANGED_EVENT};
+import{VALIDITY_CHANGED_EVENT as r}from"./validation.js";import{VALIDITY_CHANGED_EVENT as e}from"./validation.js";const s={VALUE_CHANGED:"esp-value-changed",VALIDITY_CHANGED:e,CLICKED:"esp-clicked",ACTION_MENU_SELECT:"esp-action-menu-select",BURGER_OPENED:"esp-burger-opened",BURGER_CLOSED:"esp-burger-closed",DETAILS_TOGGLE:"esp-details-toggle",DETAILS_GROUP_CHANGE:"esp-details-group-change",DIALOG_OPENED:"esp-dialog-opened",DIALOG_CLOSING:"esp-dialog-closing",DIALOG_CLOSED:"esp-dialog-closed",FILE_UPLOAD_FILES_SELECTED:"esp-file-upload-files-selected",FLYOUT_OPENED:"esp-flyout-opened",FLYOUT_CLOSED:"esp-flyout-closed",FLYOUT_STATE_CHANGED:"esp-flyout-state-changed",FOCUS_PICKER_CHANGED:"esp-focus-picker-changed",FORM_DIALOG_CLOSE_REQUESTED:"esp-form-dialog-close-requested",FORM_SUBMIT:"esp-form-submit",FORM_SUBMIT_RESPONSE:"esp-form-submit-response",FORM_SUBMIT_ERROR:"esp-form-submit-error",GRID_EVENT:"esp-grid-event",GRID_LOAD_START:"esp-grid-load-start",GRID_LOAD_SUCCESS:"esp-grid-load-success",GRID_LOAD_ERROR:"esp-grid-load-error",GRID_ITEMS_CHANGED:"esp-grid-items-changed",HEADER_THEME_TOGGLE:"esp-header-theme-toggle",IMAGE_UPLOAD_FILE_SELECTED:"esp-image-upload-file-selected",IMAGE_UPLOAD_FILE_REMOVED:"esp-image-upload-file-removed",IMAGE_UPLOAD_FILES_REJECTED:"esp-image-upload-files-rejected",IMAGE_UPLOAD_RETRY:"esp-image-upload-retry",IMAGE_UPLOAD_IMAGES_REORDERED:"esp-image-upload-images-reordered",INFO_DESTROY:"esp-info-destroy",INPUT_ICON_CLICKED:"esp-input-icon-clicked",LIGHTBOX_CHANGED:"esp-lightbox-changed",MENU_GROUP_TOGGLE:"esp-menu-group-toggle",MENU_DRAWER_OPENED:"esp-menu-drawer-opened",MENU_DRAWER_CLOSED:"esp-menu-drawer-closed",MENU_DRAWER_PRESENTED:"esp-menu-drawer-presented",PAGE_WORKSPACE_RESIZE:"esp-page-workspace-resize",PICKER_MENU_SELECTION_CHANGED:"esp-picker-menu-selection-changed",PICKER_MENU_CLOSE_REQUESTED:"esp-picker-menu-close-requested",PICKER_MENU_DISMISS_REQUESTED:"esp-picker-menu-dismiss-requested",PICKER_MENU_RANGE_CHANGED:"esp-picker-menu-range-changed",POPOVER_OPENED:"esp-popover-opened",POPOVER_CLOSED:"esp-popover-closed",SEARCH_REQUESTED:"esp-search-requested",SEARCH_RESULT_SELECTED:"esp-search-result-selected",SEARCH_CLOSED:"esp-search-closed",TAB_GROUP_CHANGED:"esp-tab-group-changed",TREE_SELECT:"esp-tree-select",TREE_TOGGLE:"esp-tree-toggle",TREE_GRAFT_REQUEST:"esp-tree-graft-request",TREE_GRAFT:"esp-tree-graft",TREE_EDIT:"esp-tree-edit",TREE_DELETE:"esp-tree-delete",TREE_MOVE_UP:"esp-tree-move-up",TREE_MOVE_DOWN:"esp-tree-move-down",TREE_CUT:"esp-tree-cut",TREE_PASTE_CHILD:"esp-tree-paste-child",TREE_GRAFT_INPUT:"esp-tree-graft-input",VIDEO_READY:"esp-video-ready",VIDEO_PLAY:"esp-video-play",VIDEO_ERROR:"esp-video-error"};export{s as ESP_EVENTS,r as VALIDITY_CHANGED_EVENT};

package/dist/shared/font-helpers.d.ts

@@ -98,8 +98,6 @@ export type RuntimeGoogleFontLinkOptions = {
     family: string;
     weight?: string;
     enabled?: boolean;
-    /** Compatibility/debug attributes retained on the generated link. */
-    attributes?: Readonly<Record<string, string>>;
 };
 /** Build the canonical Google Fonts CSS2 URL used by roots and pickers. */
 export declare function googleFontStylesheetUrl(family: string, weight?: string): string;

package/dist/shared/font-helpers.js

@@ -1 +1 @@
-import{webSafeFontWeights as l}from"./font-stacks.js";const g={100:"100 Thin",200:"200 Extra Light",300:"300 Light",400:"400 Regular",500:"500 Medium",600:"600 Semi Bold",700:"700 Bold",800:"800 Extra Bold",900:"900 Black"},f=e=>e.kind==="web-safe";function p(e){if(!e)return["400"];if(f(e))return l(e);const t=new Set;for(const r of e.variants)r.includes("italic")||t.add(r==="regular"?"400":r);const n=[...t].sort((r,i)=>Number(r)-Number(i));return n.length>0?n:["400"]}function b(e,t){return e?e==="bold"?"700":e==="normal"?"400":e:t}function u(e,t){const n=e===void 0||e===""?t:e;if(n===void 0)return null;if(typeof n=="number")return Number.isInteger(n)&&n>=1&&n<=1e3?n:null;const r=n.trim().toLowerCase();if(r==="normal")return 400;if(r==="bold")return 700;if(!/^\d{1,4}$/.test(r))return null;const i=Number(r);return Number.isInteger(i)&&i>=1&&i<=1e3?i:null}function x(e,t){if(t.length===0)return"400";if(t.includes(e))return e;const n=Number(e);let r=t[0],i=Math.abs(Number(r)-n);for(const s of t){const o=Math.abs(Number(s)-n);o<i&&(r=s,i=o)}return r}function y(e){let t="",n="",r=!1,i=0;for(const o of e.trim()){if(r){t+=o,r=!1;continue}if(o==="\\"){t+=o,r=!0;continue}if(n){t+=o,o===n&&(n="");continue}if(o==='"'||o==="'"){t+=o,n=o;continue}if(o==="("&&(i+=1),o===")"&&(i=Math.max(0,i-1)),o===","&&i===0)break;t+=o}const s=t.trim();return s.length>=2&&(s.startsWith('"')&&s.endsWith('"')||s.startsWith("'")&&s.endsWith("'"))?s.slice(1,-1).replace(/\\([\\"'])/g,"$1"):s}const m=new Set(["serif","sans-serif","monospace","cursive","fantasy","system-ui","ui-serif","ui-sans-serif","ui-monospace","ui-rounded","math","fangsong","-apple-system","blinkmacsystemfont","arial","helvetica","helvetica neue","liberation sans","liberation serif","liberation mono","verdana","tahoma","trebuchet ms","georgia","times new roman","courier new","segoe ui"].map(e=>e.toLowerCase()));function F(e){return m.has(e.trim().toLowerCase())}function W(e){switch(e){case"serif":return"serif";case"monospace":return"monospace";case"handwriting":return"cursive";default:return"sans-serif"}}const a="data-esp-google-font-owner";function d(e,t){const n=u(t,400)??400,r=n!==400?`:wght@${n}`:"";return`https://fonts.googleapis.com/css2?family=${encodeURIComponent(e)}${r}&display=swap`}function c(e){return document.head.querySelector(`link[${a}="${CSS.escape(e)}"]`)}function w(e){const t=c(e.owner),n=e.family.trim(),r=String(u(e.weight,400)??400);if(e.enabled===!1||!n)return t?.remove(),null;if(t?.dataset.espFamily===n&&t.dataset.espWeight===r)return t;t?.remove();const i=document.createElement("link");i.rel="stylesheet",i.href=d(n,r),i.setAttribute(a,e.owner),i.dataset.espFamily=n,i.dataset.espWeight=r;for(const[s,o]of Object.entries(e.attributes??{}))i.setAttribute(s,o);return document.head.appendChild(i),i}function L(e){c(e)?.remove()}function k(e){for(const t of document.head.querySelectorAll(`link[${a}]`))t.getAttribute(a)?.startsWith(e)&&t.remove()}export{a as RUNTIME_GOOGLE_FONT_OWNER_ATTR,g as WEIGHT_LABELS,x as bestAvailableWeight,y as extractFamily,p as extractWeights,W as getFallbackFont,d as googleFontStylesheetUrl,F as isLocalFontFamily,u as normalizeFontFaceWeight,b as normalizeWeight,L as removeRuntimeGoogleFontLink,k as removeRuntimeGoogleFontLinks,w as syncRuntimeGoogleFontLink};
+import{webSafeFontWeights as l}from"./font-stacks.js";const g={100:"100 Thin",200:"200 Extra Light",300:"300 Light",400:"400 Regular",500:"500 Medium",600:"600 Semi Bold",700:"700 Bold",800:"800 Extra Bold",900:"900 Black"},f=e=>e.kind==="web-safe";function p(e){if(!e)return["400"];if(f(e))return l(e);const t=new Set;for(const r of e.variants)r.includes("italic")||t.add(r==="regular"?"400":r);const n=[...t].sort((r,i)=>Number(r)-Number(i));return n.length>0?n:["400"]}function b(e,t){return e?e==="bold"?"700":e==="normal"?"400":e:t}function u(e,t){const n=e===void 0||e===""?t:e;if(n===void 0)return null;if(typeof n=="number")return Number.isInteger(n)&&n>=1&&n<=1e3?n:null;const r=n.trim().toLowerCase();if(r==="normal")return 400;if(r==="bold")return 700;if(!/^\d{1,4}$/.test(r))return null;const i=Number(r);return Number.isInteger(i)&&i>=1&&i<=1e3?i:null}function x(e,t){if(t.length===0)return"400";if(t.includes(e))return e;const n=Number(e);let r=t[0],i=Math.abs(Number(r)-n);for(const s of t){const o=Math.abs(Number(s)-n);o<i&&(r=s,i=o)}return r}function y(e){let t="",n="",r=!1,i=0;for(const o of e.trim()){if(r){t+=o,r=!1;continue}if(o==="\\"){t+=o,r=!0;continue}if(n){t+=o,o===n&&(n="");continue}if(o==='"'||o==="'"){t+=o,n=o;continue}if(o==="("&&(i+=1),o===")"&&(i=Math.max(0,i-1)),o===","&&i===0)break;t+=o}const s=t.trim();return s.length>=2&&(s.startsWith('"')&&s.endsWith('"')||s.startsWith("'")&&s.endsWith("'"))?s.slice(1,-1).replace(/\\([\\"'])/g,"$1"):s}const m=new Set(["serif","sans-serif","monospace","cursive","fantasy","system-ui","ui-serif","ui-sans-serif","ui-monospace","ui-rounded","math","fangsong","-apple-system","blinkmacsystemfont","arial","helvetica","helvetica neue","liberation sans","liberation serif","liberation mono","verdana","tahoma","trebuchet ms","georgia","times new roman","courier new","segoe ui"].map(e=>e.toLowerCase()));function F(e){return m.has(e.trim().toLowerCase())}function W(e){switch(e){case"serif":return"serif";case"monospace":return"monospace";case"handwriting":return"cursive";default:return"sans-serif"}}const a="data-esp-google-font-owner";function d(e,t){const n=u(t,400)??400,r=n!==400?`:wght@${n}`:"";return`https://fonts.googleapis.com/css2?family=${encodeURIComponent(e)}${r}&display=swap`}function c(e){return document.head.querySelector(`link[${a}="${CSS.escape(e)}"]`)}function w(e){const t=c(e.owner),n=e.family.trim(),r=String(u(e.weight,400)??400);if(e.enabled===!1||!n)return t?.remove(),null;if(t?.dataset.espFamily===n&&t.dataset.espWeight===r)return t;t?.remove();const i=document.createElement("link");return i.rel="stylesheet",i.href=d(n,r),i.setAttribute(a,e.owner),i.dataset.espFamily=n,i.dataset.espWeight=r,document.head.appendChild(i),i}function L(e){c(e)?.remove()}function k(e){for(const t of document.head.querySelectorAll(`link[${a}]`))t.getAttribute(a)?.startsWith(e)&&t.remove()}export{a as RUNTIME_GOOGLE_FONT_OWNER_ATTR,g as WEIGHT_LABELS,x as bestAvailableWeight,y as extractFamily,p as extractWeights,W as getFallbackFont,d as googleFontStylesheetUrl,F as isLocalFontFamily,u as normalizeFontFaceWeight,b as normalizeWeight,L as removeRuntimeGoogleFontLink,k as removeRuntimeGoogleFontLinks,w as syncRuntimeGoogleFontLink};

package/dist/shared/form-field-description-controller.js

@@ -1 +1 @@
-import{syncDescribedByTokens as i}from"./aria-describedby.js";let s=0;class o{constructor(t){this.options=t,this.descriptionId=`esp-form-field-description-${++s}`,this.description=null,this.descriptionElement=null,this.formItemLabel=null,this.appliedLabel=null,this.target=null,t.host.addController(this)}hostConnected(){this.sync()}hostUpdated(){this.sync()}hostDisconnected(){this.removeDescriptionToken(this.target),this.removeAppliedLabel(this.target),this.descriptionElement?.remove(),this.descriptionElement=null,this.target=null}setDescription(t){this.description=t,this.sync()}setLabel(t){const e=t?.trim()??"";this.formItemLabel=e.length>0?e:null,this.sync()}sync(){const t=this.options.getTarget()??null;this.target&&this.target!==t&&(this.removeDescriptionToken(this.target),this.removeAppliedLabel(this.target)),this.target=t,this.syncDescription(),this.syncLabel()}syncDescription(){if(!this.target||this.description===null){this.removeDescriptionToken(this.target),this.descriptionElement?.remove(),this.descriptionElement=null;return}const t=this.target.getRootNode();if(t instanceof ShadowRoot){if(!this.descriptionElement||this.descriptionElement.getRootNode()!==t){this.descriptionElement?.remove();const e=document.createElement("span");e.id=this.descriptionId,e.hidden=!0,e.toggleAttribute("data-esp-form-item-description",!0),t.appendChild(e),this.descriptionElement=e}this.descriptionElement.textContent=this.description,this.addDescriptionToken(this.target)}}syncLabel(){if(!this.target){this.appliedLabel=null;return}if(this.formItemLabel===null){this.removeAppliedLabel(this.target);return}const t=this.target.getAttribute("aria-label");t!==null&&t!==this.appliedLabel||(t!==this.formItemLabel&&this.target.setAttribute("aria-label",this.formItemLabel),this.appliedLabel=this.formItemLabel)}removeAppliedLabel(t){t&&this.appliedLabel!==null&&t.getAttribute("aria-label")===this.appliedLabel&&t.removeAttribute("aria-label"),this.appliedLabel=null}addDescriptionToken(t){i(t,{add:[this.descriptionId]})}removeDescriptionToken(t){t&&i(t,{remove:[this.descriptionId]})}}export{o as FormFieldDescriptionController};
+import{syncDescribedByTokens as e}from"./aria-describedby.js";let s=0;class l{constructor(t){this.options=t,this.descriptionId=`esp-form-field-description-${++s}`,this.description=null,this.descriptionElement=null,this.formItemLabel=null,this.appliedLabel=null,this.invalid=!1,this.invalidTarget=null,this.target=null,t.host.addController(this)}hostConnected(){this.sync()}hostUpdated(){this.sync()}hostDisconnected(){this.removeDescriptionToken(this.target),this.removeAppliedLabel(this.target),this.removeAppliedInvalid(),this.descriptionElement?.remove(),this.descriptionElement=null,this.target=null}setDescription(t){this.description=t,this.sync()}setLabel(t){const i=t?.trim()??"";this.formItemLabel=i.length>0?i:null,this.sync()}setInvalid(t){this.invalid=t,this.sync()}sync(){const t=this.options.getTarget()??null;this.target&&this.target!==t&&(this.removeDescriptionToken(this.target),this.removeAppliedLabel(this.target)),this.target=t,this.syncDescription(),this.syncLabel(),this.syncInvalid()}syncInvalid(){this.invalidTarget&&(!this.invalid||this.invalidTarget!==this.target)&&this.removeAppliedInvalid(),!(!this.invalid||!this.target||this.invalidTarget===this.target)&&(this.target.hasAttribute("aria-invalid")||(this.target.setAttribute("aria-invalid","true"),this.invalidTarget=this.target))}removeAppliedInvalid(){this.invalidTarget?.getAttribute("aria-invalid")==="true"&&this.invalidTarget.removeAttribute("aria-invalid"),this.invalidTarget=null}syncDescription(){if(!this.target||this.description===null){this.removeDescriptionToken(this.target),this.descriptionElement?.remove(),this.descriptionElement=null;return}const t=this.target.getRootNode();if(t instanceof ShadowRoot){if(!this.descriptionElement||this.descriptionElement.getRootNode()!==t){this.descriptionElement?.remove();const i=document.createElement("span");i.id=this.descriptionId,i.hidden=!0,i.toggleAttribute("data-esp-form-item-description",!0),t.appendChild(i),this.descriptionElement=i}this.descriptionElement.textContent=this.description,this.addDescriptionToken(this.target)}}syncLabel(){if(!this.target){this.appliedLabel=null;return}if(this.formItemLabel===null){this.removeAppliedLabel(this.target);return}const t=this.target.getAttribute("aria-label");t!==null&&t!==this.appliedLabel||(t!==this.formItemLabel&&this.target.setAttribute("aria-label",this.formItemLabel),this.appliedLabel=this.formItemLabel)}removeAppliedLabel(t){t&&this.appliedLabel!==null&&t.getAttribute("aria-label")===this.appliedLabel&&t.removeAttribute("aria-label"),this.appliedLabel=null}addDescriptionToken(t){e(t,{add:[this.descriptionId]})}removeDescriptionToken(t){t&&e(t,{remove:[this.descriptionId]})}}export{l as FormFieldDescriptionController};

package/dist/shared/form-item-relay.js

@@ -0,0 +1 @@
+class s{constructor(t){this.getTarget=t,this.description=null,this.label=null,this.invalid=!1}setDescription(t){this.description=t,this.apply()}setLabel(t){this.label=t,this.apply()}setInvalid(t){this.invalid=t,this.apply()}apply(){const t=this.getTarget();t?.setFormItemDescription?.(this.description),t?.setFormItemLabel?.(this.label),t?.setFormItemInvalid?.(this.invalid)}}export{s as FormItemRelay};