@aceshooting/lyra-ui 29.0.2 → 29.1.0

package/dist/components/forms/token-input/token-input.class.js

@@ -1,13 +1,13 @@
-import{__decorate}from"tslib";import{setNativeRangeText,nativeAutocorrectAttribute}from"../../../internal/native-text-control.js";import{installFormControlLabelSupport}from"../../../internal/form-control-labels.js";import{FormControlController,reflectFormName}from"../../../internal/form-control-controller.js";import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{LyraFormControlElement}from"../../../internal/form-control-element.js";import{shadowFocusTarget}from"../../../internal/active-element.js";import{acquireResolvedAriaRelationship}from"../../../internal/aria-controls.js";import{captureComposedFocusRepair,applyComposedFocusRepair}from"../../../internal/focus-navigation.js";import{VALIDITY_ANCHOR}from"../../../internal/anchored-validity.js";import{syncValidityStates}from"../../../internal/custom-states.js";import{SlotPresenceController}from"../../../internal/slot-presence-controller.js";import{nextId}from"../../../internal/a11y.js";import{closeIcon}from"../../../internal/icons.js";import{autocorrectConverter,normalizeAutocorrect,spellcheckConverter}from"../../../internal/converters.js";import{submitOnEnter}from"../../../internal/submit-on-enter.js";import{dispatchNativeEvent,dispatchNativeInputEvent,relayNativeEvent}from"../../../internal/native-event-relay.js";import{sizes}from"../../../internal/sizes.styles.js";import{styles}from"./token-input.styles.js";import{createStringArrayFormDataState,getFormOwner,isBarredFromValidation,readStringArrayFormDataState,setFormOwner}from"../../../internal/form-associated.js";import{LYRA_DEFAULT_tokenInputEditWithContext,LYRA_DEFAULT_tokenInputRequired}from"../../../internal/default-strings/forms.generated.js";import{LYRA_DEFAULT_fieldRequired,LYRA_DEFAULT_removeWithContext}from"../../../internal/default-strings/shared.generated.js";installFormControlLabelSupport();const delimiterConverter={fromAttribute:value=>value===null?",":value===""||value==="none"?null:value};function normalizeStringArray(value){if(!Array.isArray(value))return Object.freeze([]);try{const normalized=[];for(const entry of value)typeof entry=="string"&&normalized.push(entry);return Object.freeze(normalized)}catch{return Object.freeze([])}}const stringArrayConverter={fromAttribute:value=>{if(value===null)return null;try{const parsed=JSON.parse(value);return normalizeStringArray(parsed)}catch{return[]}},toAttribute:value=>value==null?null:JSON.stringify(value)};class LyraTokenInput extends LyraFormControlElement{static{this.defaultStrings={...super.defaultStrings,fieldRequired:LYRA_DEFAULT_fieldRequired,removeWithContext:LYRA_DEFAULT_removeWithContext,tokenInputEditWithContext:LYRA_DEFAULT_tokenInputEditWithContext,tokenInputRequired:LYRA_DEFAULT_tokenInputRequired}}static{this.formAssociated=!0}static{this.styles=[LyraElement.styles,sizes,styles]}static{this.properties={customError:{attribute:"custom-error",reflect:!0,noAccessor:!0},name:{reflect:!0,noAccessor:!0},required:{type:Boolean,reflect:!0,noAccessor:!0},disabled:{type:Boolean,reflect:!0,noAccessor:!0},readonly:{type:Boolean,reflect:!0,noAccessor:!0},defaultValue:{attribute:"value",reflect:!0,useDefault:!0,converter:stringArrayConverter,noAccessor:!0}}}get autocorrect(){return this.autocorrectValue}set autocorrect(next){this.autocorrectValue=normalizeAutocorrect(next),this.requestUpdate()}get editable(){return this._editable}set editable(next){const old=this._editable;this._editable=!!next,this._editable||this.discardTransientState(!1),this.requestUpdate("editable",old)}syncExternalDescription(){const target=this.isConnected?this.inputEl:void 0;if(!target){this.releaseExternalDescription();return}this.externalDescriptionLease?this.externalDescriptionLease.update(target):this.externalDescriptionLease=acquireResolvedAriaRelationship(this,target,"aria-describedby")}releaseExternalDescription(){this.externalDescriptionLease?.release(),this.externalDescriptionLease=void 0}get value(){return this._value}set value(next){const old=this._value;this.settingDefaultValue||(this._valueDirty=!0);const normalized=normalizeStringArray(next);this.captureTokenFocusRepair(normalized),this.editingIndex>=0&&normalized!==old&&(this.editingIndex=-1,this.editDraft="",this.focusEditorPending=!1),this._value=normalized,this.requestUpdate("value",old),this.internals&&this.syncValidity()}get defaultValue(){return this._defaultValue}set defaultValue(next){if(this.reflectingDefaultValue)return;const old=this._defaultValue;this._defaultValue=normalizeStringArray(next),this.reflectingDefaultValue=!0;try{next==null?this.removeAttribute("value"):this.setAttribute("value",JSON.stringify(this._defaultValue))}finally{this.reflectingDefaultValue=!1}this._valueDirty||this.restoreLiveValueFromDefault(),this.requestUpdate("defaultValue",old)}get name(){return this._name}set name(next){const old=this._name;this._name=next??"",reflectFormName(this,this._name),this.syncValidity(),this.requestUpdate("name",old)}get required(){return this._required}set required(next){const old=this._required;this._required=!!next,this.toggleAttribute("required",this._required),this.syncValidity(),this.requestUpdate("required",old)}get disabled(){return this._disabled}set disabled(next){const old=this._disabled,wasEffectivelyDisabled=this.effectiveDisabled;this._disabled=!!next,!wasEffectivelyDisabled&&this.effectiveDisabled&&this.retireDisabledInteraction(),this.toggleAttribute("disabled",this._disabled),this._fieldsetDisabled=this.validityController?.fieldsetDisabled(this._fieldsetDisabled)??this._fieldsetDisabled,this.syncValidity(),this.requestUpdate("disabled",old)}get readonly(){return this._readonly}set readonly(next){const old=this._readonly,nextValue=!!next;!old&&nextValue&&this.discardTransientState(!0),this._readonly=nextValue,this.toggleAttribute("readonly",this._readonly),this.syncValidity(),this.requestUpdate("readonly",old)}constructor(){super(),this.label="",this.hint="",this.errorText="",this.placeholder="",this.spellcheck=!0,this.autocapitalize="",this.autocorrectValue=!0,this.accessibleLabel="",this.size="m",this.pill=!1,this.allowDuplicates=!1,this._editable=!1,this.delimiter=",",this.draft="",this.touched=!1,this.editingIndex=-1,this.editDraft="",this.rovingIndex=0,this.focusEditorPending=!1,this.focusTokenPending=-1,this.editorBlurRelayed=!1,this.slotPresence=new SlotPresenceController(this),this.labelId=nextId("token-input-label"),this.hintId=nextId("token-input-hint"),this.errorId=nextId("token-input-error"),this._value=Object.freeze([]),this._defaultValue=Object.freeze([]),this._valueDirty=!1,this.settingDefaultValue=!1,this.reflectingDefaultValue=!1,this._fieldsetDisabled=!1,this._name="",this._required=!1,this._disabled=!1,this._readonly=!1,this.markInteracted=()=>{this.touched||(this.touched=!0,this.syncValidity())},this.onEditInput=event=>{event.stopPropagation(),!(this.liveDisabled||this.readonly)&&(this.editDraft=event.target.value)},this.onEditFocus=event=>{if(this.liveDisabled){event.stopPropagation();return}this.editorBlurRelayed=!1,relayNativeEvent(this,event)},this.onEditKeyDown=event=>{event.isComposing||event.keyCode===229||(event.key==="Enter"?(event.preventDefault(),this.commitEdit(!0)):event.key==="Escape"&&(event.preventDefault(),event.stopPropagation(),this.cancelEdit()))},this.onEditBlur=event=>{if(this.editorBlurRelayed){event.stopPropagation();return}this.editorBlurRelayed=!0,event.stopPropagation(),queueMicrotask(()=>{!this.isConnected||!this.editable||this.liveDisabled?this.discardTransientState(!1):this.commitEdit(!1),relayNativeEvent(this,event)})},this.onInput=event=>{event.stopPropagation(),!(this.liveDisabled||this.readonly)&&(this.draft=event.target.value)},this.onKeyDown=event=>{event.isComposing||event.keyCode===229||this.liveDisabled||(event.key==="Enter"||this.delimiter!==null&&event.key===this.delimiter?this.draft.trim()?(event.preventDefault(),this.addDraft()):event.key==="Enter"&&submitOnEnter(this,event):event.key==="Tab"?this.draft.trim()&&this.addDraft():event.key==="Backspace"&&!this.draft&&this.value.length&&this.editingIndex<0&&this.removeToken(this.value.length-1))},this.onBlur=event=>{this.liveDisabled||(this.draft.trim()&&this.addDraft(),this.touched=!0),this.syncValidity(),relayNativeEvent(this,event)},this.onFocus=event=>{if(this.liveDisabled){event.stopPropagation();return}relayNativeEvent(this,event)},this.validityController=new FormControlController(this,{invalid:init=>this.emit("lr-invalid",null,init),interacted:this.markInteracted,customError:()=>this.validityController.customValidityMessage}),this.internals=this.validityController.formInternals}connectedCallback(){super.connectedCallback(),this.hasUpdated&&this.syncExternalDescription(),this.syncValidity()}disconnectedCallback(){this.releaseExternalDescription(),this.tokenFocusRepairPending=void 0,this.discardTransientState(!0),super.disconnectedCallback()}adoptedCallback(){super.adoptedCallback(),this.releaseExternalDescription(),this.isConnected&&this.hasUpdated&&this.syncExternalDescription()}get form(){return getFormOwner(this.internals)}set form(owner){setFormOwner(this,owner)}get effectiveDisabled(){return this.disabled||this._fieldsetDisabled}formDisabledCallback(disabled){if(this.validityController?.reflectingDisabled)return;const wasEffectivelyDisabled=this.effectiveDisabled;this._fieldsetDisabled=disabled,!wasEffectivelyDisabled&&this.effectiveDisabled&&this.retireDisabledInteraction(),this.syncValidity(),this.requestUpdate()}[VALIDITY_ANCHOR](){return this.inputEl??this.renderRoot?.querySelector('[part="input-wrapper"]')??null}checkValidity(){return this.validityController.checkValidity()}reportValidity(){return this.validityController.syncConstraints(),this.touched=!0,this.syncValidity(),this.internals.reportValidity()}setCustomValidity(message){this.validityController.setCustomValidity(message??""),this.syncValidity()}get liveDisabled(){return this.effectiveDisabled||this.matches(":disabled")}focus(options){this.liveDisabled||this.inputEl?.focus(options)}blur(){const active=shadowFocusTarget(this);active&&typeof active.blur=="function"&&active.blur()}click(){this.liveDisabled||this.inputEl?.focus()}select(){this.inputEl?.select()}get selectionStart(){return this.inputEl?.selectionStart??null}set selectionStart(value){this.inputEl&&(this.inputEl.selectionStart=value??0)}get selectionEnd(){return this.inputEl?.selectionEnd??null}set selectionEnd(value){this.inputEl&&(this.inputEl.selectionEnd=value??0)}get selectionDirection(){return this.inputEl?.selectionDirection??null}set selectionDirection(value){this.inputEl&&(this.inputEl.selectionDirection=value??"none")}setSelectionRange(selectionStart,selectionEnd,selectionDirection="none"){this.inputEl?.setSelectionRange(selectionStart,selectionEnd,selectionDirection??"none")}setRangeText(replacement,start,end,selectMode="preserve"){const input=this.inputEl;input&&(setNativeRangeText(input,replacement,start,end,selectMode),this.draft=input.value)}get barredFromValidation(){return isBarredFromValidation(this,this.internals)}syncValidity(){const barred=this.barredFromValidation,missing=!barred&&this.required&&this.value.length===0;this.validityController.setValidity(missing?{valueMissing:!0}:{},missing?this.localize("tokenInputRequired"):""),this.toggleAttribute("data-invalid",!barred&&this.touched&&!this.internals.validity.valid),syncValidityStates(this.internals,{required:this.required,hasInteracted:this.touched,barred});const data=new FormData;this.name&&this.value.forEach(token=>data.append(this.name,token)),this.internals.setFormValue(this.name?data:null,createStringArrayFormDataState(this.name,this.value))}updateValue(next){const previousValue=Object.freeze([...this.value]);this.value=next,this.syncValidity();const detail=()=>Object.freeze({value:Object.freeze([...this.value]),previousValue});dispatchNativeInputEvent(this),this.emit("lr-input",detail()),dispatchNativeEvent(this,"change"),this.emit("lr-change",detail())}addDraft(){if(this.liveDisabled||this.readonly)return;const candidates=(this.delimiter?this.draft.split(this.delimiter):[this.draft]).map(token=>token.trim()).filter(Boolean),next=[...this.value],seen=this.allowDuplicates?null:new Set(next),added=[];for(const token of candidates)seen?.has(token)||(seen?.add(token),next.push(token),added.push(token));if(added.length===0){this.draft="";return}const addDetail=()=>Object.freeze({value:added[added.length-1],values:Object.freeze([...added])});this.emit("lr-token-add-request",addDetail(),{cancelable:!0}).defaultPrevented||(this.updateValue(next),this.draft="")}discardTransientState(clearDraft){this.editingIndex=-1,this.editDraft="",this.focusEditorPending=!1,this.focusTokenPending=-1,clearDraft&&(this.draft="",this.inputEl&&(this.inputEl.value=""))}retireDisabledInteraction(){this.tokenFocusRepairPending=void 0,this.discardTransientState(!0);const active=shadowFocusTarget(this);active&&typeof active.blur=="function"&&active.blur()}captureTokenFocusRepair(next){this.tokenFocusRepairPending=void 0;const tokens=[...this.renderRoot?.querySelectorAll('[part~="token"]')??[]];if(next.length>=tokens.length)return;const active=shadowFocusTarget(this),token=typeof active?.closest=="function"?active.closest('[part~="token"]'):null;if(!active||!token)return;const index=tokens.indexOf(token);if(index<0)return;const repair=captureComposedFocusRepair(this,active);if(!repair)return;const targetIndex=Math.min(index,Math.max(0,next.length-1));this.rovingIndex=targetIndex,this.tokenFocusRepairPending={index:targetIndex,surface:active.matches('[part~="remove"]')?"remove":"label",repair}}removeToken(index){if(this.liveDisabled||this.readonly)return;const removed=this.value[index];removed===void 0||this.emit("lr-token-remove-request",{value:removed,index},{cancelable:!0}).defaultPrevented||(this.editingIndex>=0&&(this.editingIndex=-1,this.editDraft=""),this.updateValue(this.value.filter((_token,i)=>i!==index)))}get activeTokenIndex(){return this.value.length?Math.min(Math.max(this.rovingIndex,0),this.value.length-1):-1}startEdit(index){this.liveDisabled||this.readonly||!this.editable||index<0||index>=this.value.length||(this.editingIndex=index,this.editDraft=this.value[index],this.rovingIndex=index,this.editorBlurRelayed=!1,this.focusEditorPending=!0)}cancelEdit(){this.editingIndex<0||(this.focusTokenPending=this.editingIndex,this.editingIndex=-1,this.editDraft="")}commitEdit(restoreFocus){if(this.liveDisabled||this.readonly){this.discardTransientState(!1);return}const index=this.editingIndex;if(index<0)return;const previousValue=this.value[index],next=this.editDraft.trim();if(previousValue===void 0||!next||next===previousValue||!this.allowDuplicates&&this.value.some((token,i)=>i!==index&&token===next)){restoreFocus&&(this.focusTokenPending=index),this.editingIndex=-1,this.editDraft="";return}this.emit("lr-token-edit-request",{value:next,previousValue,index},{cancelable:!0}).defaultPrevented||(restoreFocus&&(this.focusTokenPending=index),this.editingIndex=-1,this.editDraft="",this.updateValue(this.value.map((token,i)=>i===index?next:token)))}moveRovingFocus(index){if(!this.value.length)return;const clamped=Math.min(Math.max(index,0),this.value.length-1);this.rovingIndex=clamped,this.focusTokenPending=clamped}onTokenKeyDown(event,index){if(this.liveDisabled)return;const rtl=this.effectiveDirection==="rtl",forward=rtl?"ArrowLeft":"ArrowRight",backward=rtl?"ArrowRight":"ArrowLeft";event.key==="Enter"||event.key===" "||event.key==="F2"?(event.preventDefault(),this.startEdit(index)):event.key===forward?(event.preventDefault(),this.moveRovingFocus(index+1)):event.key===backward?(event.preventDefault(),this.moveRovingFocus(index-1)):event.key==="Home"?(event.preventDefault(),this.moveRovingFocus(0)):event.key==="End"&&(event.preventDefault(),this.moveRovingFocus(this.value.length-1))}stopInternalChange(event){event.stopPropagation()}formResetCallback(){this.restoreLiveValueFromDefault(),this.discardTransientState(!0),this.rovingIndex=0,this.touched=!1,this.syncValidity()}restoreLiveValueFromDefault(){this.settingDefaultValue=!0;try{this.value=[...this._defaultValue]}finally{this.settingDefaultValue=!1}this._valueDirty=!1}formStateRestoreCallback(state2,_mode){this.value=readStringArrayFormDataState(state2),this.discardTransientState(!0),this.rovingIndex=0,this.touched=!1,this.syncValidity()}updated(changed){if(super.updated(changed),this.syncExternalDescription(),this.focusEditorPending){this.focusEditorPending=!1;const editor=this.renderRoot?.querySelector('[part="token-editor"]');editor?.focus(),editor?.select()}if(this.focusTokenPending>=0){const index=this.focusTokenPending;this.focusTokenPending=-1;const label=this.renderRoot?.querySelectorAll('[part="token-label"]')?.[index];label?.focus(),label?.scrollIntoView({block:"nearest",inline:"nearest"})}const pending=this.tokenFocusRepairPending;if(this.tokenFocusRepairPending=void 0,pending){const token=[...this.renderRoot.querySelectorAll('[part~="token"]')][pending.index],target=(pending.surface==="remove"?token?.querySelector('[part~="remove"]'):token?.querySelector('[part~="token-label"]'))??token?.querySelector('[part~="remove"]')??this.inputEl??null;applyComposedFocusRepair(pending.repair,target)&&target?.scrollIntoView({block:"nearest",inline:"nearest"})}}renderRemoveButton(token,index){return html`<button
+import{__decorate}from"tslib";import{ref}from"lit/directives/ref.js";import{repeat}from"lit/directives/repeat.js";import{finiteCount}from"../../../internal/numbers.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{setNativeRangeText,nativeAutocorrectAttribute}from"../../../internal/native-text-control.js";import{installFormControlLabelSupport}from"../../../internal/form-control-labels.js";import{FormControlController,reflectFormName}from"../../../internal/form-control-controller.js";import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{LyraFormControlElement}from"../../../internal/form-control-element.js";import{shadowFocusTarget}from"../../../internal/active-element.js";import{acquireResolvedAriaRelationship}from"../../../internal/aria-controls.js";import{captureComposedFocusRepair,applyComposedFocusRepair}from"../../../internal/focus-navigation.js";import{VALIDITY_ANCHOR}from"../../../internal/anchored-validity.js";import{syncValidityStates}from"../../../internal/custom-states.js";import{SlotPresenceController}from"../../../internal/slot-presence-controller.js";import{nextId}from"../../../internal/a11y.js";import{closeIcon}from"../../../internal/icons.js";import{autocorrectConverter,normalizeAutocorrect,spellcheckConverter}from"../../../internal/converters.js";import{submitOnEnter}from"../../../internal/submit-on-enter.js";import{dispatchNativeEvent,dispatchNativeInputEvent,relayNativeEvent}from"../../../internal/native-event-relay.js";import{sizes}from"../../../internal/sizes.styles.js";import{styles}from"./token-input.styles.js";import{createStringArrayFormDataState,getFormOwner,isBarredFromValidation,readStringArrayFormDataState,setFormOwner}from"../../../internal/form-associated.js";import{LYRA_DEFAULT_selectSelectedOverflow,LYRA_DEFAULT_tokenInputEditWithContext,LYRA_DEFAULT_tokenInputRequired}from"../../../internal/default-strings/forms.generated.js";import{LYRA_DEFAULT_fieldRequired,LYRA_DEFAULT_removeWithContext}from"../../../internal/default-strings/shared.generated.js";installFormControlLabelSupport();const delimiterConverter={fromAttribute:value=>value===null?",":value===""||value==="none"?null:value};function normalizeStringArray(value){if(!Array.isArray(value))return Object.freeze([]);try{const normalized=[];for(const entry of value)typeof entry=="string"&&normalized.push(entry);return Object.freeze(normalized)}catch{return Object.freeze([])}}const stringArrayConverter={fromAttribute:value=>{if(value===null)return null;try{const parsed=JSON.parse(value);return normalizeStringArray(parsed)}catch{return[]}},toAttribute:value=>value==null?null:JSON.stringify(value)};class LyraTokenInput extends LyraFormControlElement{static{this.defaultStrings={...super.defaultStrings,fieldRequired:LYRA_DEFAULT_fieldRequired,removeWithContext:LYRA_DEFAULT_removeWithContext,selectSelectedOverflow:LYRA_DEFAULT_selectSelectedOverflow,tokenInputEditWithContext:LYRA_DEFAULT_tokenInputEditWithContext,tokenInputRequired:LYRA_DEFAULT_tokenInputRequired}}static{this.formAssociated=!0}static{this.styles=[LyraElement.styles,sizes,styles]}static{this.properties={customError:{attribute:"custom-error",reflect:!0,noAccessor:!0},name:{reflect:!0,noAccessor:!0},required:{type:Boolean,reflect:!0,noAccessor:!0},disabled:{type:Boolean,reflect:!0,noAccessor:!0},readonly:{type:Boolean,reflect:!0,noAccessor:!0},defaultValue:{attribute:"value",reflect:!0,useDefault:!0,converter:stringArrayConverter,noAccessor:!0}}}get autocorrect(){return this.autocorrectValue}set autocorrect(next){this.autocorrectValue=normalizeAutocorrect(next),this.requestUpdate()}get editable(){return this._editable}set editable(next){const old=this._editable;this._editable=!!next,this._editable||this.discardTransientState(!1),this.requestUpdate("editable",old)}tokenElement(index){return[...this.renderRoot.querySelectorAll('[part="token"]')].find(element=>this.tokenIndices.get(element)===index)}get visibleTokenEntries(){if(this.tokenEntriesFor!==this.value){this.tokenEntriesFor=this.value;const occurrences=new Map;this.tokenEntries=this.value.map((token,index)=>{const count=occurrences.get(token)??0;return occurrences.set(token,count+1),{token,index,key:`${token.length}:${token}:${count}`}})}const limit=finiteCount(this.maxTokensVisible,0);if(!limit||this.tokenEntries.length<=limit)return this.tokenEntries;const retained=new Set,focused=shadowFocusTarget(this)?.closest('[part="token"]'),focusedIndex=focused?this.tokenIndices.get(focused)??-1:-1;for(const index of[this.editingIndex,this.focusTokenPending,this.tokenFocusRepairPending?.index??-1,this.editable?this.activeTokenIndex:-1,focusedIndex])index>=0&&index<this.value.length&&retained.size<limit&&retained.add(index);for(let index=0;index<limit&&retained.size<limit;index++)retained.add(index);return[...retained].sort((a,b)=>a-b).map(index=>this.tokenEntries[index])}tokenEventIndex(event){const token=event.composedPath().find(target=>target.nodeType===1&&target.getAttribute("part")==="token");return token?this.tokenIndices.get(token)??-1:-1}syncExternalDescription(){const target=this.isConnected?this.inputEl:void 0;if(!target){this.releaseExternalDescription();return}this.externalDescriptionLease?this.externalDescriptionLease.update(target):this.externalDescriptionLease=acquireResolvedAriaRelationship(this,target,"aria-describedby")}releaseExternalDescription(){this.externalDescriptionLease?.release(),this.externalDescriptionLease=void 0}get value(){return this._value}set value(next){const old=this._value;this.settingDefaultValue||(this._valueDirty=!0);const normalized=normalizeStringArray(next);this.captureTokenFocusRepair(normalized),this.editingIndex>=0&&normalized!==old&&(this.editingIndex=-1,this.editDraft="",this.focusEditorPending=!1),this._value=normalized,this.requestUpdate("value",old),this.internals&&this.syncValidity()}get defaultValue(){return this._defaultValue}set defaultValue(next){if(this.reflectingDefaultValue)return;const old=this._defaultValue;this._defaultValue=normalizeStringArray(next),this.reflectingDefaultValue=!0;try{next==null?this.removeAttribute("value"):this.setAttribute("value",JSON.stringify(this._defaultValue))}finally{this.reflectingDefaultValue=!1}this._valueDirty||this.restoreLiveValueFromDefault(),this.requestUpdate("defaultValue",old)}get name(){return this._name}set name(next){const old=this._name;this._name=next??"",reflectFormName(this,this._name),this.syncValidity(),this.requestUpdate("name",old)}get required(){return this._required}set required(next){const old=this._required;this._required=!!next,this.toggleAttribute("required",this._required),this.syncValidity(),this.requestUpdate("required",old)}get disabled(){return this._disabled}set disabled(next){const old=this._disabled,wasEffectivelyDisabled=this.effectiveDisabled;this._disabled=!!next,!wasEffectivelyDisabled&&this.effectiveDisabled&&this.retireDisabledInteraction(),this.toggleAttribute("disabled",this._disabled),this._fieldsetDisabled=this.validityController?.fieldsetDisabled(this._fieldsetDisabled)??this._fieldsetDisabled,this.syncValidity(),this.requestUpdate("disabled",old)}get readonly(){return this._readonly}set readonly(next){const old=this._readonly,nextValue=!!next;!old&&nextValue&&this.discardTransientState(!0),this._readonly=nextValue,this.toggleAttribute("readonly",this._readonly),this.syncValidity(),this.requestUpdate("readonly",old)}constructor(){super(),this.label="",this.hint="",this.errorText="",this.placeholder="",this.spellcheck=!0,this.autocapitalize="",this.autocorrectValue=!0,this.accessibleLabel="",this.size="m",this.pill=!1,this.allowDuplicates=!1,this._editable=!1,this.delimiter=",",this.maxTokensVisible=0,this.tokenIndices=new WeakMap,this.tokenEntries=[],this.renderedTokenValues=[],this.onTokenClick=event=>{const index=this.tokenEventIndex(event);if(index<0)return;const target=event.composedPath().find(target2=>target2.nodeType===1&&(target2.getAttribute("part")==="remove"||target2.getAttribute("part")==="token-label"));target?.getAttribute("part")==="remove"?this.removeToken(index):target&&this.startEdit(index)},this.onTokenFocus=event=>{const index=this.tokenEventIndex(event);index>=0&&this.rovingIndex!==index&&(this.rovingIndex=index)},this.onTokenKey=event=>{if(event.target.getAttribute("part")!=="token-label")return;const index=this.tokenEventIndex(event);index>=0&&this.onTokenKeyDown(event,index)},this.draft="",this.touched=!1,this.editingIndex=-1,this.editDraft="",this.rovingIndex=0,this.focusEditorPending=!1,this.focusTokenPending=-1,this.editorBlurRelayed=!1,this.slotPresence=new SlotPresenceController(this),this.labelId=nextId("token-input-label"),this.hintId=nextId("token-input-hint"),this.errorId=nextId("token-input-error"),this._value=Object.freeze([]),this._defaultValue=Object.freeze([]),this._valueDirty=!1,this.settingDefaultValue=!1,this.reflectingDefaultValue=!1,this._fieldsetDisabled=!1,this._name="",this._required=!1,this._disabled=!1,this._readonly=!1,this.markInteracted=()=>{this.touched||(this.touched=!0,this.syncValidity())},this.onEditInput=event=>{event.stopPropagation(),!(this.liveDisabled||this.readonly)&&(this.editDraft=event.target.value)},this.onEditFocus=event=>{if(this.liveDisabled){event.stopPropagation();return}this.editorBlurRelayed=!1,relayNativeEvent(this,event)},this.onEditKeyDown=event=>{event.isComposing||event.keyCode===229||(event.key==="Enter"?(event.preventDefault(),this.commitEdit(!0)):event.key==="Escape"&&(event.preventDefault(),event.stopPropagation(),this.cancelEdit()))},this.onEditBlur=event=>{if(this.editorBlurRelayed){event.stopPropagation();return}this.editorBlurRelayed=!0,event.stopPropagation(),queueMicrotask(()=>{!this.isConnected||!this.editable||this.liveDisabled?this.discardTransientState(!1):this.commitEdit(!1),relayNativeEvent(this,event)})},this.onInput=event=>{event.stopPropagation(),!(this.liveDisabled||this.readonly)&&(this.draft=event.target.value)},this.onKeyDown=event=>{event.isComposing||event.keyCode===229||this.liveDisabled||(event.key==="Enter"||this.delimiter!==null&&event.key===this.delimiter?this.draft.trim()?(event.preventDefault(),this.addDraft()):event.key==="Enter"&&submitOnEnter(this,event):event.key==="Tab"?this.draft.trim()&&this.addDraft():event.key==="Backspace"&&!this.draft&&this.value.length&&this.editingIndex<0&&this.removeToken(this.value.length-1))},this.onBlur=event=>{this.liveDisabled||(this.draft.trim()&&this.addDraft(),this.touched=!0),this.syncValidity(),relayNativeEvent(this,event)},this.onFocus=event=>{if(this.liveDisabled){event.stopPropagation();return}relayNativeEvent(this,event)},this.validityController=new FormControlController(this,{invalid:init=>this.emit("lr-invalid",null,init),interacted:this.markInteracted,customError:()=>this.validityController.customValidityMessage}),this.internals=this.validityController.formInternals}connectedCallback(){super.connectedCallback(),this.hasUpdated&&this.syncExternalDescription(),this.syncValidity()}disconnectedCallback(){this.releaseExternalDescription(),this.tokenFocusRepairPending=void 0,this.discardTransientState(!0),super.disconnectedCallback()}adoptedCallback(){super.adoptedCallback(),this.releaseExternalDescription(),this.isConnected&&this.hasUpdated&&this.syncExternalDescription()}get form(){return getFormOwner(this.internals)}set form(owner){setFormOwner(this,owner)}get effectiveDisabled(){return this.disabled||this._fieldsetDisabled}formDisabledCallback(disabled){if(this.validityController?.reflectingDisabled)return;const wasEffectivelyDisabled=this.effectiveDisabled;this._fieldsetDisabled=disabled,!wasEffectivelyDisabled&&this.effectiveDisabled&&this.retireDisabledInteraction(),this.syncValidity(),this.requestUpdate()}[VALIDITY_ANCHOR](){return this.inputEl??this.renderRoot?.querySelector('[part="input-wrapper"]')??null}checkValidity(){return this.validityController.checkValidity()}reportValidity(){return this.validityController.syncConstraints(),this.touched=!0,this.syncValidity(),this.internals.reportValidity()}setCustomValidity(message){this.validityController.setCustomValidity(message??""),this.syncValidity()}get liveDisabled(){return this.effectiveDisabled||this.matches(":disabled")}focus(options){this.liveDisabled||this.inputEl?.focus(options)}blur(){const active=shadowFocusTarget(this);active&&typeof active.blur=="function"&&active.blur()}click(){this.liveDisabled||this.inputEl?.focus()}select(){this.inputEl?.select()}get selectionStart(){return this.inputEl?.selectionStart??null}set selectionStart(value){this.inputEl&&(this.inputEl.selectionStart=value??0)}get selectionEnd(){return this.inputEl?.selectionEnd??null}set selectionEnd(value){this.inputEl&&(this.inputEl.selectionEnd=value??0)}get selectionDirection(){return this.inputEl?.selectionDirection??null}set selectionDirection(value){this.inputEl&&(this.inputEl.selectionDirection=value??"none")}setSelectionRange(selectionStart,selectionEnd,selectionDirection="none"){this.inputEl?.setSelectionRange(selectionStart,selectionEnd,selectionDirection??"none")}setRangeText(replacement,start,end,selectMode="preserve"){const input=this.inputEl;input&&(setNativeRangeText(input,replacement,start,end,selectMode),this.draft=input.value)}get barredFromValidation(){return isBarredFromValidation(this,this.internals)}syncValidity(){const barred=this.barredFromValidation,missing=!barred&&this.required&&this.value.length===0;this.validityController.setValidity(missing?{valueMissing:!0}:{},missing?this.localize("tokenInputRequired"):""),this.toggleAttribute("data-invalid",!barred&&this.touched&&!this.internals.validity.valid),syncValidityStates(this.internals,{required:this.required,hasInteracted:this.touched,barred});const data=new FormData;this.name&&this.value.forEach(token=>data.append(this.name,token)),this.internals.setFormValue(this.name?data:null,createStringArrayFormDataState(this.name,this.value))}updateValue(next){const previousValue=Object.freeze([...this.value]);this.value=next,this.syncValidity();const detail=()=>Object.freeze({value:Object.freeze([...this.value]),previousValue});dispatchNativeInputEvent(this),this.emit("lr-input",detail()),dispatchNativeEvent(this,"change"),this.emit("lr-change",detail())}addDraft(){if(this.liveDisabled||this.readonly)return;const candidates=(this.delimiter?this.draft.split(this.delimiter):[this.draft]).map(token=>token.trim()).filter(Boolean),next=[...this.value],seen=this.allowDuplicates?null:new Set(next),added=[];for(const token of candidates)seen?.has(token)||(seen?.add(token),next.push(token),added.push(token));if(added.length===0){this.draft="";return}const addDetail=()=>Object.freeze({value:added[added.length-1],values:Object.freeze([...added])});this.emit("lr-token-add-request",addDetail(),{cancelable:!0}).defaultPrevented||(this.updateValue(next),this.draft="")}discardTransientState(clearDraft){this.editingIndex=-1,this.editDraft="",this.focusEditorPending=!1,this.focusTokenPending=-1,clearDraft&&(this.draft="",this.inputEl&&(this.inputEl.value=""))}retireDisabledInteraction(){this.tokenFocusRepairPending=void 0,this.discardTransientState(!0);const active=shadowFocusTarget(this);active&&typeof active.blur=="function"&&active.blur()}captureTokenFocusRepair(next){this.tokenFocusRepairPending=void 0;const active=shadowFocusTarget(this),token=typeof active?.closest=="function"?active.closest('[part~="token"]'):null;if(!active||!token)return;const index=this.tokenIndices.get(token)??-1;if(!Number.isInteger(index)||index<0||next.length>=this.renderedTokenValues.length&&next[index]===this.renderedTokenValues[index])return;const repair=captureComposedFocusRepair(this,active);if(!repair)return;const targetIndex=Math.min(index,Math.max(0,next.length-1));this.rovingIndex=targetIndex,this.tokenFocusRepairPending={index:targetIndex,surface:active.matches('[part~="remove"]')?"remove":"label",repair}}removeToken(index){if(this.liveDisabled||this.readonly)return;const removed=this.value[index];removed===void 0||this.emit("lr-token-remove-request",{value:removed,index},{cancelable:!0}).defaultPrevented||(this.editingIndex>=0&&(this.editingIndex=-1,this.editDraft=""),this.updateValue(this.value.filter((_token,i)=>i!==index)))}get activeTokenIndex(){return this.value.length?Math.min(Math.max(this.rovingIndex,0),this.value.length-1):-1}startEdit(index){this.liveDisabled||this.readonly||!this.editable||index<0||index>=this.value.length||(this.editingIndex=index,this.editDraft=this.value[index],this.rovingIndex=index,this.editorBlurRelayed=!1,this.focusEditorPending=!0)}cancelEdit(){this.editingIndex<0||(this.focusTokenPending=this.editingIndex,this.editingIndex=-1,this.editDraft="")}commitEdit(restoreFocus){if(this.liveDisabled||this.readonly){this.discardTransientState(!1);return}const index=this.editingIndex;if(index<0)return;const previousValue=this.value[index],next=this.editDraft.trim();if(previousValue===void 0||!next||next===previousValue||!this.allowDuplicates&&this.value.some((token,i)=>i!==index&&token===next)){restoreFocus&&(this.focusTokenPending=index),this.editingIndex=-1,this.editDraft="";return}this.emit("lr-token-edit-request",{value:next,previousValue,index},{cancelable:!0}).defaultPrevented||(restoreFocus&&(this.focusTokenPending=index),this.editingIndex=-1,this.editDraft="",this.updateValue(this.value.map((token,i)=>i===index?next:token)))}moveRovingFocus(index){if(!this.value.length)return;const clamped=Math.min(Math.max(index,0),this.value.length-1);this.rovingIndex=clamped,this.focusTokenPending=clamped}onTokenKeyDown(event,index){if(this.liveDisabled)return;const rtl=this.effectiveDirection==="rtl",forward=rtl?"ArrowLeft":"ArrowRight",backward=rtl?"ArrowRight":"ArrowLeft";event.key==="Enter"||event.key===" "||event.key==="F2"?(event.preventDefault(),this.startEdit(index)):event.key===forward?(event.preventDefault(),this.moveRovingFocus(index+1)):event.key===backward?(event.preventDefault(),this.moveRovingFocus(index-1)):event.key==="Home"?(event.preventDefault(),this.moveRovingFocus(0)):event.key==="End"&&(event.preventDefault(),this.moveRovingFocus(this.value.length-1))}stopInternalChange(event){event.stopPropagation()}formResetCallback(){this.restoreLiveValueFromDefault(),this.discardTransientState(!0),this.rovingIndex=0,this.touched=!1,this.syncValidity()}restoreLiveValueFromDefault(){this.settingDefaultValue=!0;try{this.value=[...this._defaultValue]}finally{this.settingDefaultValue=!1}this._valueDirty=!1}formStateRestoreCallback(state2,_mode){this.value=readStringArrayFormDataState(state2),this.discardTransientState(!0),this.rovingIndex=0,this.touched=!1,this.syncValidity()}updated(changed){if(super.updated(changed),this.syncExternalDescription(),this.focusEditorPending){this.focusEditorPending=!1;const editor=this.renderRoot?.querySelector('[part="token-editor"]');editor?.focus(),editor?.select()}if(this.focusTokenPending>=0){const index=this.focusTokenPending;this.focusTokenPending=-1;const label=this.tokenElement(index)?.querySelector('[part="token-label"]');label?.focus(),label?.scrollIntoView({block:"nearest",inline:"nearest"})}const pending=this.tokenFocusRepairPending;if(this.tokenFocusRepairPending=void 0,pending){const token=this.tokenElement(pending.index),target=(pending.surface==="remove"?token?.querySelector('[part~="remove"]'):token?.querySelector('[part~="token-label"]'))??token?.querySelector('[part~="remove"]')??this.inputEl??null;applyComposedFocusRepair(pending.repair,target)&&target?.scrollIntoView({block:"nearest",inline:"nearest"})}}renderRemoveButton(token){return html`<button
       part="remove"
       type="button"
       aria-label=${this.localize("removeWithContext",void 0,{label:token})}
       ?disabled=${this.effectiveDisabled}
       aria-disabled=${this.readonly?"true":nothing}
-      @click=${()=>this.removeToken(index)}
+
     >
       ${closeIcon()}
-    </button>`}renderEditableToken(token,index){return this.editingIndex===index?html`<span part="token"
+    </button>`}renderEditableToken(token,index){return this.editingIndex===index?html`<span part="token" ${ref(element=>{element&&this.tokenIndices.set(element,index)})}
         ><input
           part="token-editor"
           .value=${this.editDraft}
@@ -22,20 +22,18 @@ import{__decorate}from"tslib";import{setNativeRangeText,nativeAutocorrectAttribu
           @keydown=${this.onEditKeyDown}
           @focus=${this.onEditFocus}
           @blur=${this.onEditBlur}
-        />${this.renderRemoveButton(token,index)}</span
-      >`:html`<span part="token"
+        />${this.renderRemoveButton(token)}</span
+      >`:html`<span part="token" ${ref(element=>{element&&this.tokenIndices.set(element,index)})}
       ><span
         part="token-label"
         role="button"
         tabindex=${this.effectiveDisabled?nothing:index===this.activeTokenIndex?0:-1}
         aria-disabled=${String(this.effectiveDisabled)}
         aria-label=${this.localize("tokenInputEditWithContext",void 0,{label:token})}
-        @click=${()=>this.startEdit(index)}
-        @focus=${()=>{this.rovingIndex!==index&&(this.rovingIndex=index)}}
-        @keydown=${event=>this.onTokenKeyDown(event,index)}
+
         >${token}</span
-      >${this.renderRemoveButton(token,index)}</span
-    >`}render(){const hasLabel=this.slotPresence.has("label")||(this.label??"").length>0,hasAccessibleLabel=this.hasAttribute("aria-label")||!!this.accessibleLabel,hasHint=this.slotPresence.has("hint")||(this.hint??"").length>0,hasError=this.slotPresence.has("error")||(this.errorText??"").length>0,described=[hasHint?this.hintId:"",hasError?this.errorId:""].filter(Boolean).join(" ")||nothing;return html`<div part="form-control">
+      >${this.renderRemoveButton(token)}</span
+    >`}render(){const entries=this.visibleTokenEntries;this.renderedTokenValues=this.value;const overflow=this.value.length-entries.length,hasLabel=this.slotPresence.has("label")||(this.label??"").length>0,hasAccessibleLabel=this.hasAttribute("aria-label")||!!this.accessibleLabel,hasHint=this.slotPresence.has("hint")||(this.hint??"").length>0,hasError=this.slotPresence.has("error")||(this.errorText??"").length>0,described=[hasHint?this.hintId:"",hasError?this.errorId:""].filter(Boolean).join(" ")||nothing;return html`<div part="form-control">
       <label
         part="form-control-label"
         ?hidden=${!hasLabel}
@@ -45,6 +43,9 @@ import{__decorate}from"tslib";import{setNativeRangeText,nativeAutocorrectAttribu
       ></label>
       <div
         part="input-wrapper"
+        @click=${this.onTokenClick}
+        @focusin=${this.onTokenFocus}
+        @keydown=${this.onTokenKey}
         role="group"
         aria-labelledby=${!hasAccessibleLabel&&hasLabel?this.labelId:nothing}
         aria-label=${hasAccessibleLabel?this.accessibleLabel:nothing}
@@ -52,9 +53,10 @@ import{__decorate}from"tslib";import{setNativeRangeText,nativeAutocorrectAttribu
         <span part="start" ?hidden=${!this.slotPresence.has("start")}
           ><slot name="start"></slot
         ></span>
-        ${this.value.map((token,index)=>this.editable?this.renderEditableToken(token,index):html`<span part="token"
-                ><span>${token}</span>${this.renderRemoveButton(token,index)}</span
+        ${repeat(entries,entry=>entry.key,({token,index})=>this.editable?this.renderEditableToken(token,index):html`<span part="token" ${ref(element=>{element&&this.tokenIndices.set(element,index)})}
+                ><span>${token}</span>${this.renderRemoveButton(token)}</span
               >`)}
+        ${overflow>0?html`<span part="token-overflow">${this.localize("selectSelectedOverflow",void 0,{n:getNumberFormat(this.effectiveLocale).format(overflow)})}</span>`:nothing}
         <input
           id="input"
           part="input"
@@ -86,4 +88,4 @@ import{__decorate}from"tslib";import{setNativeRangeText,nativeAutocorrectAttribu
       <div part="error" id=${this.errorId} ?hidden=${!hasError}>
         ${this.errorText}<slot name="error"></slot>
       </div>
-    </div>`}}__decorate([property()],LyraTokenInput.prototype,"label",void 0),__decorate([property()],LyraTokenInput.prototype,"hint",void 0),__decorate([property({attribute:"error-text"})],LyraTokenInput.prototype,"errorText",void 0),__decorate([property()],LyraTokenInput.prototype,"placeholder",void 0),__decorate([property({converter:spellcheckConverter})],LyraTokenInput.prototype,"spellcheck",void 0),__decorate([property()],LyraTokenInput.prototype,"autocapitalize",void 0),__decorate([property({converter:autocorrectConverter})],LyraTokenInput.prototype,"autocorrect",null),__decorate([property({attribute:"aria-label"})],LyraTokenInput.prototype,"accessibleLabel",void 0),__decorate([property({reflect:!0})],LyraTokenInput.prototype,"size",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraTokenInput.prototype,"pill",void 0),__decorate([property({attribute:"allow-duplicates",type:Boolean})],LyraTokenInput.prototype,"allowDuplicates",void 0),__decorate([property({attribute:"editable",type:Boolean,reflect:!0})],LyraTokenInput.prototype,"editable",null),__decorate([property({attribute:"delimiter",converter:delimiterConverter})],LyraTokenInput.prototype,"delimiter",void 0),__decorate([state()],LyraTokenInput.prototype,"draft",void 0),__decorate([state()],LyraTokenInput.prototype,"touched",void 0),__decorate([state()],LyraTokenInput.prototype,"editingIndex",void 0),__decorate([state()],LyraTokenInput.prototype,"editDraft",void 0),__decorate([state()],LyraTokenInput.prototype,"rovingIndex",void 0),__decorate([query("#input")],LyraTokenInput.prototype,"inputEl",void 0),__decorate([property({attribute:!1})],LyraTokenInput.prototype,"value",null);export{LyraTokenInput};
+    </div>`}}__decorate([property()],LyraTokenInput.prototype,"label",void 0),__decorate([property()],LyraTokenInput.prototype,"hint",void 0),__decorate([property({attribute:"error-text"})],LyraTokenInput.prototype,"errorText",void 0),__decorate([property()],LyraTokenInput.prototype,"placeholder",void 0),__decorate([property({converter:spellcheckConverter})],LyraTokenInput.prototype,"spellcheck",void 0),__decorate([property()],LyraTokenInput.prototype,"autocapitalize",void 0),__decorate([property({converter:autocorrectConverter})],LyraTokenInput.prototype,"autocorrect",null),__decorate([property({attribute:"aria-label"})],LyraTokenInput.prototype,"accessibleLabel",void 0),__decorate([property({reflect:!0})],LyraTokenInput.prototype,"size",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraTokenInput.prototype,"pill",void 0),__decorate([property({attribute:"allow-duplicates",type:Boolean})],LyraTokenInput.prototype,"allowDuplicates",void 0),__decorate([property({attribute:"editable",type:Boolean,reflect:!0})],LyraTokenInput.prototype,"editable",null),__decorate([property({attribute:"delimiter",converter:delimiterConverter})],LyraTokenInput.prototype,"delimiter",void 0),__decorate([property({type:Number,attribute:"max-tokens-visible"})],LyraTokenInput.prototype,"maxTokensVisible",void 0),__decorate([state()],LyraTokenInput.prototype,"draft",void 0),__decorate([state()],LyraTokenInput.prototype,"touched",void 0),__decorate([state()],LyraTokenInput.prototype,"editingIndex",void 0),__decorate([state()],LyraTokenInput.prototype,"editDraft",void 0),__decorate([state()],LyraTokenInput.prototype,"rovingIndex",void 0),__decorate([query("#input")],LyraTokenInput.prototype,"inputEl",void 0),__decorate([property({attribute:!1})],LyraTokenInput.prototype,"value",null);export{LyraTokenInput};

package/dist/components/forms/unit-picker/unit-picker.class.d.ts

@@ -17,10 +17,12 @@ import{type SelectionCatalogRow}from'../../../internal/selection-catalog.js';imp
 * @csspart select-trigger - The visible trigger or filter frame.
 * @csspart select-display-input - The committed name or optional filter input.
 * @csspart select-listbox - The offered measurement units.
+* @csspart select-option-overflow - Count of rows outside the 1,000-option popup ceiling; searchable mode can filter to them.
 * @csspart select-option - A measurement-unit option.
 * @csspart select-option-sub - The unit identifier and symbol.
 * @csspart select-group-label - A caller-provided group heading.
 * @csspart select-clear-button - The optional clear action.
+* @csspart limit - Catalog input-loss notice, separate from the popup render-window overflow.
 * @csspart hint - Field guidance.
 * @csspart error - Validation guidance.
 * @event {Event} input - User selection changed the committed value and form state.

package/dist/components/forms/unit-picker/unit-picker.class.js

@@ -1 +1 @@
-import{__decorate}from"tslib";import{property}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{normalizeSelectionValue,snapshotSelectionCatalog}from"../../../internal/selection-catalog.js";import{UNIT_CODES,resolveUnitNames}from"../../../units.js";import{LyraCatalogPickerBase}from"../catalog-picker-base.js";import{styles}from"./unit-picker.styles.js";import{LYRA_DEFAULT_unitPickerLabel}from"../../../internal/default-strings/forms.generated.js";import{LYRA_DEFAULT_fieldRequired,LYRA_DEFAULT_notInCatalog,LYRA_DEFAULT_select}from"../../../internal/default-strings/shared.generated.js";const defaultEntries=Object.freeze(UNIT_CODES.map(code=>Object.freeze({code})));class LyraUnitPicker extends LyraCatalogPickerBase{static{this.defaultStrings={...super.defaultStrings,fieldRequired:LYRA_DEFAULT_fieldRequired,notInCatalog:LYRA_DEFAULT_notInCatalog,select:LYRA_DEFAULT_select,unitPickerLabel:LYRA_DEFAULT_unitPickerLabel}}static{this.styles=[LyraElement.styles,styles]}get units(){return this._units}set units(value){const previous=this._units;this._units=snapshotSelectionCatalog(value,normalizeSelectionValue),this.updateValidity(),this.requestUpdate("units",previous)}get entries(){return this._units??defaultEntries}get pickerLabel(){return this.localize("unitPickerLabel")}resolveRows(){return resolveUnitNames(this.entries,this.effectiveLocale)}}__decorate([property({attribute:!1})],LyraUnitPicker.prototype,"units",null);export{LyraUnitPicker};
+import{__decorate}from"tslib";import{property}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{normalizeSelectionValue,snapshotSelectionCatalog}from"../../../internal/selection-catalog.js";import{UNIT_CODES,resolveUnitNames}from"../../../units.js";import{LyraCatalogPickerBase}from"../catalog-picker-base.js";import{styles}from"./unit-picker.styles.js";import{LYRA_DEFAULT_unitPickerLabel}from"../../../internal/default-strings/forms.generated.js";import{LYRA_DEFAULT_catalogPickerInputLimit,LYRA_DEFAULT_fieldRequired,LYRA_DEFAULT_notInCatalog,LYRA_DEFAULT_select}from"../../../internal/default-strings/shared.generated.js";const defaultEntries=Object.freeze(UNIT_CODES.map(code=>Object.freeze({code})));class LyraUnitPicker extends LyraCatalogPickerBase{static{this.defaultStrings={...super.defaultStrings,catalogPickerInputLimit:LYRA_DEFAULT_catalogPickerInputLimit,fieldRequired:LYRA_DEFAULT_fieldRequired,notInCatalog:LYRA_DEFAULT_notInCatalog,select:LYRA_DEFAULT_select,unitPickerLabel:LYRA_DEFAULT_unitPickerLabel}}static{this.styles=[LyraElement.styles,styles]}get units(){return this._units}set units(value){const previous=this._units;this._units=snapshotSelectionCatalog(value,normalizeSelectionValue),this.updateValidity(),this.requestUpdate("units",previous)}get entries(){return this._units??defaultEntries}get pickerLabel(){return this.localize("unitPickerLabel")}resolveRows(){return resolveUnitNames(this.entries,this.effectiveLocale)}}__decorate([property({attribute:!1})],LyraUnitPicker.prototype,"units",null);export{LyraUnitPicker};

package/dist/components/layout/app-rail/app-rail.class.d.ts

@@ -542,4 +542,4 @@ get mode():LyraAppRailMode;private get safeMinRailWidthPx();private get safeMaxR
 toggleCollapse():void;
 /** Opens/closes the mobile overlay or toggles the inline full/icon-only preference.
 * Does nothing while disconnected. A pinned mode records the preference for later use. */
-toggle():void;private acceptsHotkey;private onHotkeyKeyDown;private get resolvedHotkeyShortcuts();private syncBuiltInKeyShortcuts;private onPanelTransition;private onCollapseToggleClick;private syncExternalTriggerA11y;private releaseExternalTriggerA11y;private onNavItemClick;private onHeaderSlotChange;private onFooterSlotChange;private onNavSlotChange;private onResizerPointerDown;private onResizerPointerMove;private onResizerPointerUp;private endResizerGesture;private requestRailResize;private onResizerKeyDown;private resizerPositionObserver?;private observedResizer?;private observeResizerPosition;private disconnectResizerPosition;private syncResizerPosition;private renderResizer;render():TemplateResult;}declare global{interface HTMLElementTagNameMap{'lr-app-rail':LyraAppRail;}}
+toggle():void;private hotkeyMemo?;private hotkeyPlatform?;private get parsedHotkey();private get hotkeyIsMac();private acceptsHotkey;private onHotkeyKeyDown;private get resolvedHotkeyShortcuts();private syncBuiltInKeyShortcuts;private onPanelTransition;private onCollapseToggleClick;private syncExternalTriggerA11y;private releaseExternalTriggerA11y;private onNavItemClick;private onHeaderSlotChange;private onFooterSlotChange;private onNavSlotChange;private onResizerPointerDown;private onResizerPointerMove;private onResizerPointerUp;private endResizerGesture;private requestRailResize;private onResizerKeyDown;private resizerPositionObserver?;private observedResizer?;private observeResizerPosition;private disconnectResizerPosition;private syncResizerPosition;private renderResizer;render():TemplateResult;}declare global{interface HTMLElementTagNameMap{'lr-app-rail':LyraAppRail;}}

package/dist/components/layout/app-rail/app-rail.class.js

@@ -1,4 +1,4 @@
-import{__decorate}from"tslib";import{NativeModalCarrier}from"../../../internal/native-modal-carrier.js";import{nativeModalCarrierStyles}from"../../../internal/native-modal-carrier.styles.js";import{GlassScrollLayer}from"../../../internal/glass-scroll-layer.js";import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{activateOverlay,collectFocusableElements,composedContains,deepActiveElement}from"../../../internal/overlay-manager.js";import{optionalLiteralSetConverter}from"../../../internal/converters.js";import{cancelDeferredFocusReturn}from"../../../internal/deferred-focus-return.js";import{resolveCssLength}from"../../../internal/css-length.js";import{focusFirstAvailable}from"../../../internal/focus-navigation.js";import{isHtmlElement}from"../../../internal/dom-guards.js";import{detectPlatform}from"../../../internal/platform.js";import{parseHotkey,hasNonShiftModifier,matchesHotkey,hotkeyAriaKeyShortcuts,isIgnorableKeyEvent,isEditableKeyEventTarget,registerHotkeyOwner,unregisterHotkeyOwner,resolveHotkeyOwner}from"../../../internal/hotkey.js";import{nextId,isAccessibilityVisible}from"../../../internal/a11y.js";import{acquireAriaOwnership}from"../../../internal/aria-ownership.js";import{chevronIcon,closeIcon,menuIcon,pinIcon}from"../../../internal/icons.js";import{tag}from"../../../internal/prefix.js";import{isRtl}from"../../../internal/rtl.js";import{prefersReducedMotion}from"../../../internal/motion.js";import{finiteDuration,finiteRange}from"../../../internal/numbers.js";import{isKeyboardFocusEvent}from"../../../internal/focus-modality.js";import{SeparatorDragController,separatorArrowDirection,separatorDelta}from"../../../internal/separator-drag.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{computeAppRailMode}from"./app-rail-mode.js";import{readPersistedState,writePersistedState}from"../../../internal/persisted-state.js";import{definePersistedProperty,isPersistedPropertyExplicitlySet}from"../../../internal/persisted-restore.js";import{styles}from"./app-rail.styles.js";import"./app-rail-item.class.js";import{LYRA_DEFAULT_appRailCollapse,LYRA_DEFAULT_appRailExpand,LYRA_DEFAULT_appRailPin,LYRA_DEFAULT_appRailUnpin,LYRA_DEFAULT_closeNavigation,LYRA_DEFAULT_openNavigation,LYRA_DEFAULT_resizeNavigation}from"../../../internal/default-strings/layout.generated.js";import{LYRA_DEFAULT_navigation,LYRA_DEFAULT_resizeValuePixels}from"../../../internal/default-strings/shared.generated.js";const NON_NAVIGATION_CLICK='[part~="toggle"], [part~="header-actions"], [part~="meta"], [part~="end"]',APP_RAIL_FRAME=optionalLiteralSetConverter(["card","plain"]),RAIL_WIDTH_CONVERTER={fromAttribute:value=>{if(value===null)return value;const number=Number(value);return Number.isNaN(number)?value:number}},APP_RAIL_PERSIST_FIELDS=new Set(["open","width","preferred-mode"]);import{computeAppRailMode as computeAppRailMode2}from"./app-rail-mode.js";class LyraAppRail extends LyraElement{static{this.defaultStrings={...super.defaultStrings,appRailCollapse:LYRA_DEFAULT_appRailCollapse,appRailExpand:LYRA_DEFAULT_appRailExpand,appRailPin:LYRA_DEFAULT_appRailPin,appRailUnpin:LYRA_DEFAULT_appRailUnpin,closeNavigation:LYRA_DEFAULT_closeNavigation,navigation:LYRA_DEFAULT_navigation,openNavigation:LYRA_DEFAULT_openNavigation,resizeNavigation:LYRA_DEFAULT_resizeNavigation,resizeValuePixels:LYRA_DEFAULT_resizeValuePixels}}constructor(){super(),this.iconOnlyBreakpoint="960px",this.mobileBreakpoint="600px",this.triggerCollapses=!1,this.hotkey="",this.accessibleLabel=null,this.withoutToggle=!1,this.autoHide=!1,this.peekOpenDelay=150,this.peekCloseDelay=300,this.collapsible=!1,this.topLayer=!1,this.trigger=null,this.for="",this.focusFallback=null,this.resizable=!1,this.persist="open width",this.minRailWidth=190,this.maxRailWidth=440,this._dragging=!1,this._peeking=!1,this.peekPointerInside=!1,this.peekKeyboardFocusInside=!1,this.peekDismissed=!1,this.peekAfterUnpin=!1,this.onPeekPointerEnter=event=>{event.pointerType!=="touch"&&(this.peekPointerInside=!0,this.peekPointerSeen={x:event.clientX,y:event.clientY},this.clearPeekClose())},this.onPeekPointerMove=event=>{if(event.pointerType==="touch")return;const seen=this.peekPointerSeen,moved=(event.movementX||0)!==0||(event.movementY||0)!==0||seen!==void 0&&(seen.x!==event.clientX||seen.y!==event.clientY);this.peekPointerSeen={x:event.clientX,y:event.clientY},this.peekPointerInside=!0,this.clearPeekClose(),moved&&this.startPeekOpen()},this.onPeekPointerLeave=event=>{event.pointerType!=="touch"&&(this.peekPointerInside=!1,this.peekPointerSeen=void 0,this.clearPeekOpen(),this.peekKeyboardFocusInside||(this.peekDismissed=!1),this.startPeekClose())},this.onPeekFocusIn=event=>{const keyboard=isKeyboardFocusEvent(event);this.peekKeyboardFocusInside=keyboard,keyboard&&(this.clearPeekClose(),this.startPeekOpen(!0))},this.onPeekFocusOut=event=>{const next=event.relatedTarget;isHtmlElement(next)&&composedContains(this,next)||(this.peekKeyboardFocusInside=!1,this.peekPointerInside||(this.peekDismissed=!1),this.startPeekClose())},this.onPinClick=()=>{this.peekAfterUnpin=this._mode==="full"&&(this.peekPointerInside||this.peekKeyboardFocusInside),this.toggleCollapse()},this.hasHeaderSlot=!1,this.hasFooterSlot=!1,this.persistReady=!1,this._mode="full",this.forced=!1,this.iconOnlyMatches=!1,this.mobileMatches=!1,this.overlayActive=!1,this.justOpened=!1,this.nativeModal=new NativeModalCarrier(this,{onCancel:()=>{this.overlayHandle?.isTopmost()&&this.setOpen(!1)},onUnexpectedClose:()=>{this.overlayHandle?.isTopmost()&&this.setOpen(!1),this.overlayActive&&this.nativeModal.show()}}),this.overlayReturnTarget=null,this.overlayOpener=null,this.overlayReturnIsExplicit=!1,this.recoverInlineFocusAfterResponsiveClose=!1,this.navId=nextId("app-rail-nav"),this.navRegionId=nextId("app-rail-nav-region"),this.resizeController=new SeparatorDragController(this,event=>this.onResizerPointerMove(event),event=>this.onResizerPointerUp(event)),this.resizeStartX=0,this.resizeRtl=!1,this.resizeStartWidth=0,this.resizeGestureChanged=!1,this.managedItems=new Set,this.deferredReturnPass=()=>{const candidates=[this.overlayReturnTarget,this.overlayOpener];return{candidates:()=>[...candidates,this.toggleEl],isCurrent:()=>!this.overlayActive,fallback:()=>{this.focusHostFallback()||focusFirstAvailable([this.resolveFocusFallback()])}}},this.onIconOnlyChange=e=>{this.iconOnlyMatches=e.matches,this.forced||this.applyComputedMode()},this.onMobileChange=e=>{this.mobileMatches=e.matches,this.forced||this.applyComputedMode()},this.onToggleClick=e=>{this.open||(this.explicitTrigger=e.currentTarget),this.setOpen(!this.open)},this.onBackdropClick=()=>{this.overlayHandle?.dismissBackdrop()},this.acceptsHotkey=event=>{const parsed=parseHotkey(this.hotkey);return this.isConnected&&!this.forced&&parsed!==null&&hasNonShiftModifier(parsed)&&matchesHotkey(parsed,event,detectPlatform(this.hotkeyWindow?.navigator)==="mac")&&!isEditableKeyEventTarget(event)&&isAccessibilityVisible(this)},this.onHotkeyKeyDown=event=>{if(event.defaultPrevented||isIgnorableKeyEvent(event)||!this.hotkeyWindow)return;const keyboard=event;!this.acceptsHotkey(keyboard)||resolveHotkeyOwner(this.hotkeyWindow,keyboard)!==this||(event.preventDefault(),this.toggle())},this.onPanelTransition=event=>{event.target===event.currentTarget&&event.propertyName==="transform"&&this.baseEl?.removeAttribute("data-sliding")},this.onCollapseToggleClick=()=>{this.toggleCollapse()},this.onNavItemClick=event=>{this.overlayActive&&(event.composedPath().some(node=>isHtmlElement(node)&&node.matches(NON_NAVIGATION_CLICK))||this.setOpen(!1))},this.onHeaderSlotChange=()=>{this.hasHeaderSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="header")},this.onFooterSlotChange=()=>{this.hasFooterSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="footer")},this.onNavSlotChange=()=>{this.syncSlottedItems()},this.onResizerPointerDown=e=>{if(!e.isPrimary||e.button!==0||!this.resizable||this._mode!=="full"||this.resizePointerId!==void 0)return;const resizer=e.currentTarget;this.resizeController.start(e,resizer)&&(this.resizePointerId=e.pointerId,this.resizeStartX=e.clientX,this.resizeRtl=isRtl(this),this.resizeStartWidth=this.effectiveRailWidthPx,this.resizeGestureChanged=!1,this.setDragging(!0))},this.onResizerPointerMove=e=>{if(e.pointerId!==this.resizePointerId)return;if(!this.resizable||this._mode!=="full"||isRtl(this)!==this.resizeRtl){this.endResizerGesture();return}const delta=separatorDelta(this.resizeStartX,e,"inline",this.resizeRtl),next=Math.min(this.safeMaxRailWidthPx,Math.max(this.safeMinRailWidthPx,this.resizeStartWidth+delta));this.requestRailResize(next,!1)},this.onResizerPointerUp=e=>{e.pointerId===this.resizePointerId&&this.endResizerGesture(e.type==="pointerup")},this.onResizerKeyDown=e=>{if(e.altKey||e.ctrlKey||e.metaKey||e.isComposing)return;const rtl=this.getAttribute("dir")==="rtl"||isRtl(this),direction=separatorArrowDirection(e,"inline",rtl),step=8,width=this.effectiveRailWidthPx,next=direction===1?Math.min(this.safeMaxRailWidthPx,width+step):direction===-1?Math.max(this.safeMinRailWidthPx,width-step):e.key==="Home"?this.safeMinRailWidthPx:e.key==="End"?this.safeMaxRailWidthPx:width;next!==width&&(e.preventDefault(),this.requestRailResize(next))},new GlassScrollLayer(this,'[part="base"], [part="panel"]')}static{this.knownUnobservedAttributes=["mode","dragging","peeking"]}static{this.styles=[LyraElement.styles,nativeModalCarrierStyles,styles]}get frame(){return this._frame}set frame(next){const value=APP_RAIL_FRAME.normalizeReflected(this,"frame",next),old=this._frame;value!==old&&(this._frame=value,this.requestUpdate("frame",old))}get forceMode(){return this._forceMode}set forceMode(next){if(next!=null&&next!=="auto"&&next!=="full"&&next!=="icon-only")return;const old=this._forceMode;if(this._forceMode=next??void 0,this.requestUpdate("forceMode",old),next==null||next==="auto"){if(!this.forced)return;this.forced=!1,this.applyComputedMode();return}this.forced=!0,this.setEffectiveMode(next)}static{definePersistedProperty(this.prototype,"open",{initial:!1,attribute:!0,type:Boolean,reflect:!0}),definePersistedProperty(this.prototype,"preferredMode",{initial:void 0,attribute:"preferred-mode"}),definePersistedProperty(this.prototype,"railWidth",{initial:void 0,attribute:"rail-width",converter:RAIL_WIDTH_CONVERTER})}pixelsOf(value){return typeof value=="number"?value:typeof value=="string"?resolveCssLength(value,{host:this}):void 0}get railWidthInPixels(){const width=this.railWidth;return typeof width=="string"?this.pixelsOf(width):width}get dragging(){return this._dragging}setDragging(next){this._dragging=next,this.toggleAttribute("dragging",next)}get peeking(){return this._peeking}get peekEligible(){return this.autoHide&&this._mode==="icon-only"&&this.isConnected}get modePreference(){return this.autoHide?this.preferredMode??"icon-only":this.preferredMode}clearPeekOpen(){this.peekOpenTimer!==void 0&&(clearTimeout(this.peekOpenTimer),this.peekOpenTimer=void 0)}clearPeekClose(){this.peekCloseTimer!==void 0&&(clearTimeout(this.peekCloseTimer),this.peekCloseTimer=void 0)}setPeeking(next,options){this._peeking===next||next&&!this.peekEligible||(this._peeking=next,this.toggleAttribute("peeking",next),next?this.peekHandle=activateOverlay({host:this,panel:()=>this.baseEl??null,modal:!1,trapFocus:!1,onEscape:()=>this.dismissPeek()}):(this.peekHandle?.deactivate({restoreFocus:!1}),this.peekHandle=void 0),options?.silent||this.emit("lr-peek-change",{peeking:next}))}resetPeek(options){this.clearPeekOpen(),this.clearPeekClose(),this.peekPointerInside=!1,this.peekKeyboardFocusInside=!1,this.peekPointerSeen=void 0,this.peekDismissed=!1,this.peekAfterUnpin=!1,this.setPeeking(!1,options)}dismissPeek(){this.peekDismissed=!0,this.clearPeekOpen(),this.clearPeekClose(),this.setPeeking(!1)}startPeekOpen(immediate=!1){if(this.clearPeekClose(),this._peeking||this.peekOpenTimer!==void 0||this.peekDismissed||!this.peekEligible)return;const delay=immediate?0:finiteDuration(this.peekOpenDelay,150),open=()=>{(this.peekPointerInside||this.peekKeyboardFocusInside)&&this.setPeeking(!0)};if(delay===0){open();return}this.peekOpenTimer=setTimeout(()=>{this.peekOpenTimer=void 0,open()},delay)}startPeekClose(){this.clearPeekOpen(),!(!this._peeking||this.peekCloseTimer!==void 0)&&(this.peekPointerInside||this.peekKeyboardFocusInside||(this.peekCloseTimer=setTimeout(()=>{this.peekCloseTimer=void 0,!this.peekPointerInside&&!this.peekKeyboardFocusInside&&this.setPeeking(!1)},finiteDuration(this.peekCloseDelay,300))))}syncSlottedItems(){const slot=this.shadowRoot?.querySelector('[part="nav"] > slot'),itemTag=tag("app-rail-item"),groupTag=tag("app-rail-group"),railTag=tag("app-rail"),next=new Set((slot?.assignedElements({flatten:!0})??[]).filter(item=>item.localName===itemTag||item.localName===groupTag));for(const item of this.managedItems){if(next.has(item))continue;const newOwner=item.closest(railTag);newOwner&&newOwner!==this&&item.parentElement===newOwner&&!item.hasAttribute("slot")?item.toggleAttribute("icon-only",newOwner.mode==="icon-only"):item.removeAttribute("icon-only")}for(const item of next)item.toggleAttribute("icon-only",this._mode==="icon-only"&&!this._peeking);this.managedItems=next}get mode(){return this._mode}get safeMinRailWidthPx(){return finiteRange(this.pixelsOf(this.minRailWidth)??Number.NaN,190,0)}get safeMaxRailWidthPx(){return Math.max(this.safeMinRailWidthPx,finiteRange(this.pixelsOf(this.maxRailWidth)??Number.NaN,440,0))}get effectiveRailWidthPx(){return this.railWidth!=null?finiteRange(this.railWidthInPixels??Number.NaN,this.safeMinRailWidthPx,this.safeMinRailWidthPx,this.safeMaxRailWidthPx):this.baseEl?.getBoundingClientRect().width??240}resizeValueText(widthPx){return this.localize("resizeValuePixels",void 0,{value:getNumberFormat(this.effectiveLocale).format(Math.round(widthPx))})}get storageFullKey(){return this.storageKey?`lr-app-rail:${this.storageKey}`:void 0}get persistFields(){const persist=typeof this.persist=="string"?this.persist:"";return new Set(persist.split(/\s+/).filter(field=>APP_RAIL_PERSIST_FIELDS.has(field)))}loadPersisted(){const restored={open:!1,preferredMode:!1},parsed=readPersistedState(this.storageFullKey,v=>typeof v=="object"&&v!==null);if(!parsed)return restored;const fields=this.persistFields;return fields.has("open")&&!isPersistedPropertyExplicitlySet(this,"open")&&typeof parsed.open=="boolean"&&(this.open=parsed.open,restored.open=!0),fields.has("width")&&!isPersistedPropertyExplicitlySet(this,"railWidth")&&typeof parsed.railWidthPx=="number"&&Number.isFinite(parsed.railWidthPx)&&(this.railWidth=parsed.railWidthPx),fields.has("preferred-mode")&&!isPersistedPropertyExplicitlySet(this,"preferredMode")&&(parsed.preferredMode==="full"||parsed.preferredMode==="icon-only")&&(this.preferredMode=parsed.preferredMode,restored.preferredMode=!0),restored}persistState(){const fields=this.persistFields;if(fields.size===0)return;const state2={};fields.has("open")&&(state2.open=this.open),fields.has("width")&&(state2.railWidthPx=this.railWidthInPixels),fields.has("preferred-mode")&&(state2.preferredMode=this.preferredMode??null),writePersistedState(this.storageFullKey,state2)}willUpdate(changed){if(super.willUpdate(changed),(changed.has("resizable")||changed.has("mode"))&&(!this.resizable||this._mode!=="full")&&this.endResizerGesture(),!this.hasUpdated){this.hasHeaderSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="header"),this.hasFooterSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="footer");const restored=this.loadPersisted();if(restored.preferredMode&&!this.forced){const restoredMode=computeAppRailMode(this.iconOnlyMatches,this.mobileMatches,this.modePreference);restoredMode!==this._mode&&(this._mode=restoredMode,this.pendingInitialModeAnnouncement=restoredMode)}restored.open&&this.open&&this._mode!=="mobile"&&(this.open=!1)}if(this.hasUpdated&&(changed.has("iconOnlyBreakpoint")||changed.has("mobileBreakpoint"))&&(this.teardownMediaQueries(),this.setupMediaQueries()),changed.has("autoHide")&&!this.forced&&(this.hasUpdated||this.autoHide)&&this.applyComputedMode(this.hasUpdated?void 0:{silent:!0}),this.hasUpdated&&changed.has("preferredMode")&&!this.forced&&this.applyComputedMode(),changed.has("autoHide")&&!this.autoHide&&this.resetPeek(),this.peekAfterUnpin&&(this.peekAfterUnpin=!1,changed.has("preferredMode")&&this.setPeeking(!0)),changed.has("open")||changed.has("mode")){const next=this._mode==="mobile"&&this.open;next!==this.overlayActive&&(this.hasUpdated&&this._mode==="mobile"&&!prefersReducedMotion(this)&&this.baseEl?.toggleAttribute("data-sliding",!0),this.overlayActive=next,this.placeToggle(next),next?(this.justOpened=!0,this.activateMobileOverlay()):this.deactivateMobileOverlay(this._mode==="mobile"))}}updated(changed){if(super.updated(changed),this.overlayActive&&this.nativeModal.show(),changed.has("topLayer"))for(const item of this.querySelectorAll(tag("app-rail-item")))item.syncRailTopLayer?.();if(this._lastReflectedMode!==this._mode&&(this._lastReflectedMode=this._mode,this.setAttribute("mode",this._mode)),this.pendingInitialModeAnnouncement!==void 0){const mode=this.pendingInitialModeAnnouncement;this.pendingInitialModeAnnouncement=void 0,this.emit("lr-mode-change",{mode})}if(this.syncSlottedItems(),this.placeToggle(this.overlayActive),this.syncExternalTriggerA11y(),this.syncBuiltInKeyShortcuts(),this.baseEl&&(this._mode!=="mobile"||!this.baseEl.getAnimations().some(animation=>"transitionProperty"in animation&&animation.transitionProperty==="transform"))&&this.baseEl.removeAttribute("data-sliding"),this.recoverInlineFocusAfterResponsiveClose){this.recoverInlineFocusAfterResponsiveClose=!1;const active=deepActiveElement(this.ownerDocument);this.baseEl&&!composedContains(this.baseEl,active)&&this.baseEl.focus()}this.justOpened&&(this.justOpened=!1,this.overlayHandle?.focusInitial()),this.persistReady&&(changed.has("open")||changed.has("railWidth")&&!this.dragging||changed.has("preferredMode")||changed.has("persist"))&&this.persistState(),this.persistReady=!0,this.baseEl&&(this.resizable&&this.railWidth!=null&&this._mode==="full"?this.baseEl.style.setProperty("inline-size",`${this.effectiveRailWidthPx}px`):this.baseEl.style.removeProperty("inline-size"),this._peeking&&this.resizable&&this.railWidth!=null?this.baseEl.style.setProperty("--_lr-app-rail-peek-width",`${this.effectiveRailWidthPx}px`):this.baseEl.style.removeProperty("--_lr-app-rail-peek-width")),this.observeResizerPosition(),this.syncResizerPosition()}connectedCallback(){super.connectedCallback(),this.hotkeyWindow=this.ownerDocument.defaultView??void 0,this.hotkeyWindow&&(registerHotkeyOwner(this.hotkeyWindow,this,this.acceptsHotkey),this.hotkeyWindow.addEventListener("keydown",this.onHotkeyKeyDown)),this.setupMediaQueries(),this.hasUpdated&&this._mode==="mobile"&&this.open&&(this.overlayHandle?.isActive()?this.overlayHandle.resume():this.activateMobileOverlay(),queueMicrotask(()=>{this.nativeModal.show(),this.overlayHandle?.focusInitial()})),this.hasUpdated&&queueMicrotask(()=>{this.isConnected&&(this.syncSlottedItems(),this.observeResizerPosition(),this.syncResizerPosition(),this.syncExternalTriggerA11y())})}disconnectedCallback(){this.resetPeek({silent:!0}),this.disconnectResizerPosition(),this.nativeModal.hide(),this.hotkeyWindow&&(this.hotkeyWindow.removeEventListener("keydown",this.onHotkeyKeyDown),unregisterHotkeyOwner(this.hotkeyWindow,this),this.hotkeyWindow=void 0),this.baseEl?.removeAttribute("data-sliding"),cancelDeferredFocusReturn(this),super.disconnectedCallback(),this.restoreFallbackTabIndex?.(),this.teardownMediaQueries(),this.overlayHandle?.suspend(),this.endResizerGesture(),this.releaseExternalTriggerA11y()}adoptedCallback(){this.resetPeek({silent:!0}),this.disconnectResizerPosition(),super.adoptedCallback(),this.teardownMediaQueries(),this.endResizerGesture()}resolveExternalTrigger(){if(this.trigger)return this.trigger;if(!this.for)return null;const found=this.getRootNode().getElementById?.(this.for);return found instanceof HTMLElement?found:null}resolveFocusFallback(){const value=this.focusFallback;if(!value)return null;const target=typeof value=="string"?this.getRootNode().getElementById?.(value)??null:value;return isHtmlElement(target)&&target.ownerDocument===this.ownerDocument?target:null}activateMobileOverlay(){this.nativeModal.prepare();const explicitTrigger=this.explicitTrigger;this.explicitTrigger=void 0;const restoreFocusTo=explicitTrigger??this.resolveExternalTrigger()??void 0;this.overlayReturnIsExplicit=explicitTrigger!==void 0;const active=deepActiveElement(this.ownerDocument);this.overlayOpener=active&&typeof active.focus=="function"&&!composedContains(this,active)?active:null,this.overlayReturnTarget=restoreFocusTo??this.overlayOpener,this.overlayHandle=activateOverlay({host:this,panel:()=>this.shadowRoot?.querySelector('[part="panel"]')??null,onEscape:()=>this.setOpen(!1),onBackdrop:()=>this.setOpen(!1),restoreFocusTo,preferredInitialFocus:()=>{const panel=this.shadowRoot?.querySelector('[part="panel"]')??null;if(!panel)return null;const toggle=this.toggleEl??null;return collectFocusableElements(panel).filter(stop=>stop!==toggle)[0]??panel},lockScroll:!0,suspendWhenUnrendered:!0,deferredReturn:this.deferredReturnPass})}deactivateMobileOverlay(restoreFocus=!0){this.nativeModal.hide(),this.nativeModal.prepare(!1);const handle=this.overlayHandle;if(this.overlayHandle=void 0,handle&&restoreFocus&&!this.overlayReturnIsExplicit){const external=this.resolveExternalTrigger();external&&external!==this.overlayReturnTarget&&(this.overlayReturnTarget=external,handle.updateRestoreFocusTo(external))}handle?.deactivate({restoreFocus})}focusHostFallback(){if(!this.hasAttribute("tabindex")){this.setAttribute("tabindex","-1");const view=this.ownerDocument.defaultView,onFocusChange=()=>{deepActiveElement(this.ownerDocument)!==this&&restore()},restore=()=>{this.removeEventListener("blur",onFocusChange),view?.removeEventListener("focus",onFocusChange),this.getAttribute("tabindex")==="-1"&&this.removeAttribute("tabindex"),this.restoreFallbackTabIndex=void 0};this.restoreFallbackTabIndex=restore,this.addEventListener("blur",onFocusChange),view?.addEventListener("focus",onFocusChange)}return focusFirstAvailable(this)?!0:(this.restoreFallbackTabIndex?.(),!1)}placeToggle(insidePanel){const toggle=this.toggleEl,panel=this.baseEl;if(!(!toggle||!panel)){if(insidePanel){panel.firstChild!==toggle&&panel.insertBefore(toggle,panel.firstChild);return}toggle.nextSibling!==panel&&panel.parentNode?.insertBefore(toggle,panel)}}setupMediaQueries(){if(!this.isConnected)return;const view=this.ownerDocument.defaultView;if(!view?.matchMedia)return;const iconOnlyQuery=view.matchMedia(`(max-width: ${this.iconOnlyBreakpoint})`),mobileQuery=view.matchMedia(`(max-width: ${this.mobileBreakpoint})`),iconOnlyListener=event=>{this.mqIconOnly!==iconOnlyQuery||!this.isConnected||this.ownerDocument.defaultView!==view||this.onIconOnlyChange(event)},mobileListener=event=>{this.mqMobile!==mobileQuery||!this.isConnected||this.ownerDocument.defaultView!==view||this.onMobileChange(event)};this.mqIconOnly=iconOnlyQuery,this.mqMobile=mobileQuery,this.mqIconOnlyListener=iconOnlyListener,this.mqMobileListener=mobileListener,iconOnlyQuery.addEventListener("change",iconOnlyListener),mobileQuery.addEventListener("change",mobileListener),this.iconOnlyMatches=iconOnlyQuery.matches,this.mobileMatches=mobileQuery.matches,!this.forced&&this.applyComputedMode(this.hasUpdated?void 0:{silent:!0})}teardownMediaQueries(){this.mqIconOnly&&this.mqIconOnlyListener&&this.mqIconOnly.removeEventListener("change",this.mqIconOnlyListener),this.mqMobile&&this.mqMobileListener&&this.mqMobile.removeEventListener("change",this.mqMobileListener),this.mqIconOnly=void 0,this.mqMobile=void 0,this.mqIconOnlyListener=void 0,this.mqMobileListener=void 0}applyComputedMode(options){this.setEffectiveMode(computeAppRailMode(this.iconOnlyMatches,this.mobileMatches,this.modePreference),options)}setEffectiveMode(next,options){if(this._mode===next)return;const old=this._mode,resizer=this.renderRoot?.querySelector('[part="resizer"]');old==="full"&&next==="icon-only"&&resizer&&composedContains(resizer,deepActiveElement(this.ownerDocument))&&(this.recoverInlineFocusAfterResponsiveClose=!0),next!=="mobile"&&this.baseEl?.removeAttribute("data-sliding"),old==="mobile"&&next!=="mobile"&&this.open&&(this.recoverInlineFocusAfterResponsiveClose=!0),this._mode=next,next!=="icon-only"&&(this.clearPeekOpen(),this.clearPeekClose(),this.setPeeking(!1)),this.baseEl&&(this.resizable&&this.railWidth!=null&&next==="full"||this.baseEl.style.removeProperty("inline-size")),this.requestUpdate("mode",old),options?.silent?this.pendingInitialModeAnnouncement=next:this.emit("lr-mode-change",{mode:next}),next!=="mobile"&&this.open&&this.setOpen(!1,{force:!0})}setOpen(next,options){if(this.open===next)return;if(options?.force){this.open=next,this.emit("lr-toggle",{expanded:next});return}const mode=this._mode,open=this.open;this.emit("lr-toggle-request",{expanded:next},{cancelable:!0}).defaultPrevented||this._mode!==mode||this.open!==open||(this.open=next,this.emit("lr-toggle",{expanded:next}))}toggleCollapse(){this._mode!=="mobile"&&(this.preferredMode=(this.preferredMode??this._mode)==="icon-only"?"full":"icon-only")}toggle(){this.isConnected&&(this._mode==="mobile"?this.setOpen(!this.open):this.toggleCollapse())}get resolvedHotkeyShortcuts(){const parsed=parseHotkey(this.hotkey);return hotkeyAriaKeyShortcuts(parsed&&hasNonShiftModifier(parsed)?parsed:null,detectPlatform(this.ownerDocument.defaultView?.navigator)==="mac")}syncBuiltInKeyShortcuts(){const value=this.resolvedHotkeyShortcuts;for(const control of[this.toggleEl,this.renderRoot.querySelector('[part="collapse-toggle"]'),this.renderRoot.querySelector('[part="pin-button"]')])!control||control.getAttribute("aria-keyshortcuts")===value||(value===null?control.removeAttribute("aria-keyshortcuts"):control.setAttribute("aria-keyshortcuts",value))}syncExternalTriggerA11y(){if(!this.isConnected){this.releaseExternalTriggerA11y();return}const mobile=this._mode==="mobile",trigger=mobile||this.triggerCollapses?this.resolveExternalTrigger():null;if(!trigger){this.releaseExternalTriggerA11y();return}const panel=this.baseEl??null,contribution={attributes:{"aria-expanded":(mobile?this.open:this._mode==="full")?"true":"false","aria-keyshortcuts":this.resolvedHotkeyShortcuts},controls:panel?[panel]:[]};this.triggerAria?this.triggerAria.update(trigger,contribution):this.triggerAria=acquireAriaOwnership(trigger,contribution)}releaseExternalTriggerA11y(){this.triggerAria?.release(),this.triggerAria=void 0}endResizerGesture(commit=!1){const pointerId=this.resizePointerId,changed=this.resizeGestureChanged,widthPx=this.effectiveRailWidthPx;this.resizePointerId=void 0,this.resizeGestureChanged=!1,this.setDragging(!1),pointerId!==void 0&&this.resizeController.end(pointerId),commit&&changed&&(this.emit("lr-rail-resize",{widthPx}),this.persistReady&&this.persistState())}requestRailResize(next,commit=!0){if(!this.resizable||this._mode!=="full"||!this.isConnected||next===this.effectiveRailWidthPx)return!1;const event=this.emit("lr-rail-resize-request",{widthPx:next},{cancelable:!0});return!this.resizable||this._mode!=="full"||!this.isConnected?(this.endResizerGesture(),!1):event.defaultPrevented?!1:(this.railWidth=next,commit?this.emit("lr-rail-resize",{widthPx:next}):this.resizeGestureChanged=!0,!0)}observeResizerPosition(){const resizer=this.renderRoot.querySelector('[part="resizer"]');if(!this.isConnected||!resizer||!this.baseEl||this._mode!=="full"||!this.resizable){this.disconnectResizerPosition();return}if(this.observedResizer===resizer)return;this.disconnectResizerPosition();const ResizeObserverConstructor=this.ownerDocument.defaultView?.ResizeObserver;ResizeObserverConstructor&&(this.resizerPositionObserver=new ResizeObserverConstructor(()=>this.syncResizerPosition()),this.resizerPositionObserver.observe(this,{box:"border-box"}),this.resizerPositionObserver.observe(this.baseEl,{box:"border-box"}),this.resizerPositionObserver.observe(resizer,{box:"border-box"}),this.observedResizer=resizer)}disconnectResizerPosition(){this.resizerPositionObserver?.disconnect(),this.resizerPositionObserver=void 0,this.observedResizer=void 0}syncResizerPosition(){const resizer=this.renderRoot.querySelector('[part="resizer"]');if(!resizer||!this.baseEl||this._mode!=="full"||!this.resizable)return;const hostRect=this.getBoundingClientRect(),baseRect=this.baseEl.getBoundingClientRect(),half=resizer.getBoundingClientRect().width/2,offset=this.getAttribute("dir")==="rtl"||isRtl(this)?hostRect.right-baseRect.left:baseRect.right-hostRect.left;resizer.style.setProperty("inset-inline-start",`${offset-half}px`),resizer.style.setProperty("inset-inline-end","auto")}renderResizer(){const railWidthPx=this.effectiveRailWidthPx;return html`<div
+import{__decorate}from"tslib";import{NativeModalCarrier}from"../../../internal/native-modal-carrier.js";import{nativeModalCarrierStyles}from"../../../internal/native-modal-carrier.styles.js";import{GlassScrollLayer}from"../../../internal/glass-scroll-layer.js";import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{activateOverlay,collectFocusableElements,composedContains,deepActiveElement}from"../../../internal/overlay-manager.js";import{optionalLiteralSetConverter}from"../../../internal/converters.js";import{cancelDeferredFocusReturn}from"../../../internal/deferred-focus-return.js";import{resolveCssLength}from"../../../internal/css-length.js";import{focusFirstAvailable}from"../../../internal/focus-navigation.js";import{isHtmlElement}from"../../../internal/dom-guards.js";import{detectPlatform}from"../../../internal/platform.js";import{parseHotkey,hasNonShiftModifier,matchesHotkey,hotkeyAriaKeyShortcuts,isIgnorableKeyEvent,isEditableKeyEventTarget,registerHotkeyOwner,unregisterHotkeyOwner,resolveHotkeyOwner}from"../../../internal/hotkey.js";import{nextId,isAccessibilityVisible}from"../../../internal/a11y.js";import{acquireAriaOwnership}from"../../../internal/aria-ownership.js";import{chevronIcon,closeIcon,menuIcon,pinIcon}from"../../../internal/icons.js";import{tag}from"../../../internal/prefix.js";import{isRtl}from"../../../internal/rtl.js";import{prefersReducedMotion}from"../../../internal/motion.js";import{finiteDuration,finiteRange}from"../../../internal/numbers.js";import{isKeyboardFocusEvent}from"../../../internal/focus-modality.js";import{SeparatorDragController,separatorArrowDirection,separatorDelta}from"../../../internal/separator-drag.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{computeAppRailMode}from"./app-rail-mode.js";import{readPersistedState,writePersistedState}from"../../../internal/persisted-state.js";import{definePersistedProperty,isPersistedPropertyExplicitlySet}from"../../../internal/persisted-restore.js";import{styles}from"./app-rail.styles.js";import"./app-rail-item.class.js";import{LYRA_DEFAULT_appRailCollapse,LYRA_DEFAULT_appRailExpand,LYRA_DEFAULT_appRailPin,LYRA_DEFAULT_appRailUnpin,LYRA_DEFAULT_closeNavigation,LYRA_DEFAULT_openNavigation,LYRA_DEFAULT_resizeNavigation}from"../../../internal/default-strings/layout.generated.js";import{LYRA_DEFAULT_navigation,LYRA_DEFAULT_resizeValuePixels}from"../../../internal/default-strings/shared.generated.js";const NON_NAVIGATION_CLICK='[part~="toggle"], [part~="header-actions"], [part~="meta"], [part~="end"]',APP_RAIL_FRAME=optionalLiteralSetConverter(["card","plain"]),RAIL_WIDTH_CONVERTER={fromAttribute:value=>{if(value===null)return value;const number=Number(value);return Number.isNaN(number)?value:number}},APP_RAIL_PERSIST_FIELDS=new Set(["open","width","preferred-mode"]);import{computeAppRailMode as computeAppRailMode2}from"./app-rail-mode.js";class LyraAppRail extends LyraElement{static{this.defaultStrings={...super.defaultStrings,appRailCollapse:LYRA_DEFAULT_appRailCollapse,appRailExpand:LYRA_DEFAULT_appRailExpand,appRailPin:LYRA_DEFAULT_appRailPin,appRailUnpin:LYRA_DEFAULT_appRailUnpin,closeNavigation:LYRA_DEFAULT_closeNavigation,navigation:LYRA_DEFAULT_navigation,openNavigation:LYRA_DEFAULT_openNavigation,resizeNavigation:LYRA_DEFAULT_resizeNavigation,resizeValuePixels:LYRA_DEFAULT_resizeValuePixels}}constructor(){super(),this.iconOnlyBreakpoint="960px",this.mobileBreakpoint="600px",this.triggerCollapses=!1,this.hotkey="",this.accessibleLabel=null,this.withoutToggle=!1,this.autoHide=!1,this.peekOpenDelay=150,this.peekCloseDelay=300,this.collapsible=!1,this.topLayer=!1,this.trigger=null,this.for="",this.focusFallback=null,this.resizable=!1,this.persist="open width",this.minRailWidth=190,this.maxRailWidth=440,this._dragging=!1,this._peeking=!1,this.peekPointerInside=!1,this.peekKeyboardFocusInside=!1,this.peekDismissed=!1,this.peekAfterUnpin=!1,this.onPeekPointerEnter=event=>{event.pointerType!=="touch"&&(this.peekPointerInside=!0,this.peekPointerSeen={x:event.clientX,y:event.clientY},this.clearPeekClose())},this.onPeekPointerMove=event=>{if(event.pointerType==="touch")return;const seen=this.peekPointerSeen,moved=(event.movementX||0)!==0||(event.movementY||0)!==0||seen!==void 0&&(seen.x!==event.clientX||seen.y!==event.clientY);this.peekPointerSeen={x:event.clientX,y:event.clientY},this.peekPointerInside=!0,this.clearPeekClose(),moved&&this.startPeekOpen()},this.onPeekPointerLeave=event=>{event.pointerType!=="touch"&&(this.peekPointerInside=!1,this.peekPointerSeen=void 0,this.clearPeekOpen(),this.peekKeyboardFocusInside||(this.peekDismissed=!1),this.startPeekClose())},this.onPeekFocusIn=event=>{const keyboard=isKeyboardFocusEvent(event);this.peekKeyboardFocusInside=keyboard,keyboard&&(this.clearPeekClose(),this.startPeekOpen(!0))},this.onPeekFocusOut=event=>{const next=event.relatedTarget;isHtmlElement(next)&&composedContains(this,next)||(this.peekKeyboardFocusInside=!1,this.peekPointerInside||(this.peekDismissed=!1),this.startPeekClose())},this.onPinClick=()=>{this.peekAfterUnpin=this._mode==="full"&&(this.peekPointerInside||this.peekKeyboardFocusInside),this.toggleCollapse()},this.hasHeaderSlot=!1,this.hasFooterSlot=!1,this.persistReady=!1,this._mode="full",this.forced=!1,this.iconOnlyMatches=!1,this.mobileMatches=!1,this.overlayActive=!1,this.justOpened=!1,this.nativeModal=new NativeModalCarrier(this,{onCancel:()=>{this.overlayHandle?.isTopmost()&&this.setOpen(!1)},onUnexpectedClose:()=>{this.overlayHandle?.isTopmost()&&this.setOpen(!1),this.overlayActive&&this.nativeModal.show()}}),this.overlayReturnTarget=null,this.overlayOpener=null,this.overlayReturnIsExplicit=!1,this.recoverInlineFocusAfterResponsiveClose=!1,this.navId=nextId("app-rail-nav"),this.navRegionId=nextId("app-rail-nav-region"),this.resizeController=new SeparatorDragController(this,event=>this.onResizerPointerMove(event),event=>this.onResizerPointerUp(event)),this.resizeStartX=0,this.resizeRtl=!1,this.resizeStartWidth=0,this.resizeGestureChanged=!1,this.managedItems=new Set,this.deferredReturnPass=()=>{const candidates=[this.overlayReturnTarget,this.overlayOpener];return{candidates:()=>[...candidates,this.toggleEl],isCurrent:()=>!this.overlayActive,fallback:()=>{this.focusHostFallback()||focusFirstAvailable([this.resolveFocusFallback()])}}},this.onIconOnlyChange=e=>{this.iconOnlyMatches=e.matches,this.forced||this.applyComputedMode()},this.onMobileChange=e=>{this.mobileMatches=e.matches,this.forced||this.applyComputedMode()},this.onToggleClick=e=>{this.open||(this.explicitTrigger=e.currentTarget),this.setOpen(!this.open)},this.onBackdropClick=()=>{this.overlayHandle?.dismissBackdrop()},this.acceptsHotkey=event=>{const parsed=this.parsedHotkey;return this.isConnected&&!this.forced&&parsed!==null&&hasNonShiftModifier(parsed)&&matchesHotkey(parsed,event,this.hotkeyIsMac)&&!isEditableKeyEventTarget(event)&&isAccessibilityVisible(this)},this.onHotkeyKeyDown=event=>{if(event.defaultPrevented||isIgnorableKeyEvent(event)||!this.hotkeyWindow)return;const keyboard=event;!this.acceptsHotkey(keyboard)||resolveHotkeyOwner(this.hotkeyWindow,keyboard)!==this||(event.preventDefault(),this.toggle())},this.onPanelTransition=event=>{event.target===event.currentTarget&&event.propertyName==="transform"&&this.baseEl?.removeAttribute("data-sliding")},this.onCollapseToggleClick=()=>{this.toggleCollapse()},this.onNavItemClick=event=>{this.overlayActive&&(event.composedPath().some(node=>isHtmlElement(node)&&node.matches(NON_NAVIGATION_CLICK))||this.setOpen(!1))},this.onHeaderSlotChange=()=>{this.hasHeaderSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="header")},this.onFooterSlotChange=()=>{this.hasFooterSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="footer")},this.onNavSlotChange=()=>{this.syncSlottedItems()},this.onResizerPointerDown=e=>{if(!e.isPrimary||e.button!==0||!this.resizable||this._mode!=="full"||this.resizePointerId!==void 0)return;const resizer=e.currentTarget;this.resizeController.start(e,resizer)&&(this.resizePointerId=e.pointerId,this.resizeStartX=e.clientX,this.resizeRtl=isRtl(this),this.resizeStartWidth=this.effectiveRailWidthPx,this.resizeGestureChanged=!1,this.setDragging(!0))},this.onResizerPointerMove=e=>{if(e.pointerId!==this.resizePointerId)return;if(!this.resizable||this._mode!=="full"||isRtl(this)!==this.resizeRtl){this.endResizerGesture();return}const delta=separatorDelta(this.resizeStartX,e,"inline",this.resizeRtl),next=Math.min(this.safeMaxRailWidthPx,Math.max(this.safeMinRailWidthPx,this.resizeStartWidth+delta));this.requestRailResize(next,!1)},this.onResizerPointerUp=e=>{e.pointerId===this.resizePointerId&&this.endResizerGesture(e.type==="pointerup")},this.onResizerKeyDown=e=>{if(e.altKey||e.ctrlKey||e.metaKey||e.isComposing)return;const rtl=this.getAttribute("dir")==="rtl"||isRtl(this),direction=separatorArrowDirection(e,"inline",rtl),step=8,width=this.effectiveRailWidthPx,next=direction===1?Math.min(this.safeMaxRailWidthPx,width+step):direction===-1?Math.max(this.safeMinRailWidthPx,width-step):e.key==="Home"?this.safeMinRailWidthPx:e.key==="End"?this.safeMaxRailWidthPx:width;next!==width&&(e.preventDefault(),this.requestRailResize(next))},new GlassScrollLayer(this,'[part="base"], [part="panel"]')}static{this.knownUnobservedAttributes=["mode","dragging","peeking"]}static{this.styles=[LyraElement.styles,nativeModalCarrierStyles,styles]}get frame(){return this._frame}set frame(next){const value=APP_RAIL_FRAME.normalizeReflected(this,"frame",next),old=this._frame;value!==old&&(this._frame=value,this.requestUpdate("frame",old))}get forceMode(){return this._forceMode}set forceMode(next){if(next!=null&&next!=="auto"&&next!=="full"&&next!=="icon-only")return;const old=this._forceMode;if(this._forceMode=next??void 0,this.requestUpdate("forceMode",old),next==null||next==="auto"){if(!this.forced)return;this.forced=!1,this.applyComputedMode();return}this.forced=!0,this.setEffectiveMode(next)}static{definePersistedProperty(this.prototype,"open",{initial:!1,attribute:!0,type:Boolean,reflect:!0}),definePersistedProperty(this.prototype,"preferredMode",{initial:void 0,attribute:"preferred-mode"}),definePersistedProperty(this.prototype,"railWidth",{initial:void 0,attribute:"rail-width",converter:RAIL_WIDTH_CONVERTER})}pixelsOf(value){return typeof value=="number"?value:typeof value=="string"?resolveCssLength(value,{host:this}):void 0}get railWidthInPixels(){const width=this.railWidth;return typeof width=="string"?this.pixelsOf(width):width}get dragging(){return this._dragging}setDragging(next){this._dragging=next,this.toggleAttribute("dragging",next)}get peeking(){return this._peeking}get peekEligible(){return this.autoHide&&this._mode==="icon-only"&&this.isConnected}get modePreference(){return this.autoHide?this.preferredMode??"icon-only":this.preferredMode}clearPeekOpen(){this.peekOpenTimer!==void 0&&(clearTimeout(this.peekOpenTimer),this.peekOpenTimer=void 0)}clearPeekClose(){this.peekCloseTimer!==void 0&&(clearTimeout(this.peekCloseTimer),this.peekCloseTimer=void 0)}setPeeking(next,options){this._peeking===next||next&&!this.peekEligible||(this._peeking=next,this.toggleAttribute("peeking",next),next?this.peekHandle=activateOverlay({host:this,panel:()=>this.baseEl??null,modal:!1,trapFocus:!1,onEscape:()=>this.dismissPeek()}):(this.peekHandle?.deactivate({restoreFocus:!1}),this.peekHandle=void 0),options?.silent||this.emit("lr-peek-change",{peeking:next}))}resetPeek(options){this.clearPeekOpen(),this.clearPeekClose(),this.peekPointerInside=!1,this.peekKeyboardFocusInside=!1,this.peekPointerSeen=void 0,this.peekDismissed=!1,this.peekAfterUnpin=!1,this.setPeeking(!1,options)}dismissPeek(){this.peekDismissed=!0,this.clearPeekOpen(),this.clearPeekClose(),this.setPeeking(!1)}startPeekOpen(immediate=!1){if(this.clearPeekClose(),this._peeking||this.peekOpenTimer!==void 0||this.peekDismissed||!this.peekEligible)return;const delay=immediate?0:finiteDuration(this.peekOpenDelay,150),open=()=>{(this.peekPointerInside||this.peekKeyboardFocusInside)&&this.setPeeking(!0)};if(delay===0){open();return}this.peekOpenTimer=setTimeout(()=>{this.peekOpenTimer=void 0,open()},delay)}startPeekClose(){this.clearPeekOpen(),!(!this._peeking||this.peekCloseTimer!==void 0)&&(this.peekPointerInside||this.peekKeyboardFocusInside||(this.peekCloseTimer=setTimeout(()=>{this.peekCloseTimer=void 0,!this.peekPointerInside&&!this.peekKeyboardFocusInside&&this.setPeeking(!1)},finiteDuration(this.peekCloseDelay,300))))}syncSlottedItems(){const slot=this.shadowRoot?.querySelector('[part="nav"] > slot'),itemTag=tag("app-rail-item"),groupTag=tag("app-rail-group"),railTag=tag("app-rail"),next=new Set((slot?.assignedElements({flatten:!0})??[]).filter(item=>item.localName===itemTag||item.localName===groupTag));for(const item of this.managedItems){if(next.has(item))continue;const newOwner=item.closest(railTag);newOwner&&newOwner!==this&&item.parentElement===newOwner&&!item.hasAttribute("slot")?item.toggleAttribute("icon-only",newOwner.mode==="icon-only"):item.removeAttribute("icon-only")}for(const item of next)item.toggleAttribute("icon-only",this._mode==="icon-only"&&!this._peeking);this.managedItems=next}get mode(){return this._mode}get safeMinRailWidthPx(){return finiteRange(this.pixelsOf(this.minRailWidth)??Number.NaN,190,0)}get safeMaxRailWidthPx(){return Math.max(this.safeMinRailWidthPx,finiteRange(this.pixelsOf(this.maxRailWidth)??Number.NaN,440,0))}get effectiveRailWidthPx(){return this.railWidth!=null?finiteRange(this.railWidthInPixels??Number.NaN,this.safeMinRailWidthPx,this.safeMinRailWidthPx,this.safeMaxRailWidthPx):this.baseEl?.getBoundingClientRect().width??240}resizeValueText(widthPx){return this.localize("resizeValuePixels",void 0,{value:getNumberFormat(this.effectiveLocale).format(Math.round(widthPx))})}get storageFullKey(){return this.storageKey?`lr-app-rail:${this.storageKey}`:void 0}get persistFields(){const persist=typeof this.persist=="string"?this.persist:"";return new Set(persist.split(/\s+/).filter(field=>APP_RAIL_PERSIST_FIELDS.has(field)))}loadPersisted(){const restored={open:!1,preferredMode:!1},parsed=readPersistedState(this.storageFullKey,v=>typeof v=="object"&&v!==null);if(!parsed)return restored;const fields=this.persistFields;return fields.has("open")&&!isPersistedPropertyExplicitlySet(this,"open")&&typeof parsed.open=="boolean"&&(this.open=parsed.open,restored.open=!0),fields.has("width")&&!isPersistedPropertyExplicitlySet(this,"railWidth")&&typeof parsed.railWidthPx=="number"&&Number.isFinite(parsed.railWidthPx)&&(this.railWidth=parsed.railWidthPx),fields.has("preferred-mode")&&!isPersistedPropertyExplicitlySet(this,"preferredMode")&&(parsed.preferredMode==="full"||parsed.preferredMode==="icon-only")&&(this.preferredMode=parsed.preferredMode,restored.preferredMode=!0),restored}persistState(){const fields=this.persistFields;if(fields.size===0)return;const state2={};fields.has("open")&&(state2.open=this.open),fields.has("width")&&(state2.railWidthPx=this.railWidthInPixels),fields.has("preferred-mode")&&(state2.preferredMode=this.preferredMode??null),writePersistedState(this.storageFullKey,state2)}willUpdate(changed){if(super.willUpdate(changed),(changed.has("resizable")||changed.has("mode"))&&(!this.resizable||this._mode!=="full")&&this.endResizerGesture(),!this.hasUpdated){this.hasHeaderSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="header"),this.hasFooterSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="footer");const restored=this.loadPersisted();if(restored.preferredMode&&!this.forced){const restoredMode=computeAppRailMode(this.iconOnlyMatches,this.mobileMatches,this.modePreference);restoredMode!==this._mode&&(this._mode=restoredMode,this.pendingInitialModeAnnouncement=restoredMode)}restored.open&&this.open&&this._mode!=="mobile"&&(this.open=!1)}if(this.hasUpdated&&(changed.has("iconOnlyBreakpoint")||changed.has("mobileBreakpoint"))&&(this.teardownMediaQueries(),this.setupMediaQueries()),changed.has("autoHide")&&!this.forced&&(this.hasUpdated||this.autoHide)&&this.applyComputedMode(this.hasUpdated?void 0:{silent:!0}),this.hasUpdated&&changed.has("preferredMode")&&!this.forced&&this.applyComputedMode(),changed.has("autoHide")&&!this.autoHide&&this.resetPeek(),this.peekAfterUnpin&&(this.peekAfterUnpin=!1,changed.has("preferredMode")&&this.setPeeking(!0)),changed.has("open")||changed.has("mode")){const next=this._mode==="mobile"&&this.open;next!==this.overlayActive&&(this.hasUpdated&&this._mode==="mobile"&&!prefersReducedMotion(this)&&this.baseEl?.toggleAttribute("data-sliding",!0),this.overlayActive=next,this.placeToggle(next),next?(this.justOpened=!0,this.activateMobileOverlay()):this.deactivateMobileOverlay(this._mode==="mobile"))}}updated(changed){if(super.updated(changed),this.overlayActive&&this.nativeModal.show(),changed.has("topLayer"))for(const item of this.querySelectorAll(tag("app-rail-item")))item.syncRailTopLayer?.();if(this._lastReflectedMode!==this._mode&&(this._lastReflectedMode=this._mode,this.setAttribute("mode",this._mode)),this.pendingInitialModeAnnouncement!==void 0){const mode=this.pendingInitialModeAnnouncement;this.pendingInitialModeAnnouncement=void 0,this.emit("lr-mode-change",{mode})}if(this.syncSlottedItems(),this.placeToggle(this.overlayActive),this.syncExternalTriggerA11y(),this.syncBuiltInKeyShortcuts(),this.baseEl&&(this._mode!=="mobile"||!this.baseEl.getAnimations().some(animation=>"transitionProperty"in animation&&animation.transitionProperty==="transform"))&&this.baseEl.removeAttribute("data-sliding"),this.recoverInlineFocusAfterResponsiveClose){this.recoverInlineFocusAfterResponsiveClose=!1;const active=deepActiveElement(this.ownerDocument);this.baseEl&&!composedContains(this.baseEl,active)&&this.baseEl.focus()}this.justOpened&&(this.justOpened=!1,this.overlayHandle?.focusInitial()),this.persistReady&&(changed.has("open")||changed.has("railWidth")&&!this.dragging||changed.has("preferredMode")||changed.has("persist"))&&this.persistState(),this.persistReady=!0,this.baseEl&&(this.resizable&&this.railWidth!=null&&this._mode==="full"?this.baseEl.style.setProperty("inline-size",`${this.effectiveRailWidthPx}px`):this.baseEl.style.removeProperty("inline-size"),this._peeking&&this.resizable&&this.railWidth!=null?this.baseEl.style.setProperty("--_lr-app-rail-peek-width",`${this.effectiveRailWidthPx}px`):this.baseEl.style.removeProperty("--_lr-app-rail-peek-width")),this.observeResizerPosition(),this.syncResizerPosition()}connectedCallback(){super.connectedCallback(),this.hotkeyPlatform=void 0,this.hotkeyWindow=this.ownerDocument.defaultView??void 0,this.hotkeyWindow&&(registerHotkeyOwner(this.hotkeyWindow,this,this.acceptsHotkey),this.hotkeyWindow.addEventListener("keydown",this.onHotkeyKeyDown)),this.setupMediaQueries(),this.hasUpdated&&this._mode==="mobile"&&this.open&&(this.overlayHandle?.isActive()?this.overlayHandle.resume():this.activateMobileOverlay(),queueMicrotask(()=>{this.nativeModal.show(),this.overlayHandle?.focusInitial()})),this.hasUpdated&&queueMicrotask(()=>{this.isConnected&&(this.syncSlottedItems(),this.observeResizerPosition(),this.syncResizerPosition(),this.syncExternalTriggerA11y())})}disconnectedCallback(){this.resetPeek({silent:!0}),this.disconnectResizerPosition(),this.nativeModal.hide(),this.hotkeyWindow&&(this.hotkeyWindow.removeEventListener("keydown",this.onHotkeyKeyDown),unregisterHotkeyOwner(this.hotkeyWindow,this),this.hotkeyWindow=void 0),this.baseEl?.removeAttribute("data-sliding"),cancelDeferredFocusReturn(this),super.disconnectedCallback(),this.restoreFallbackTabIndex?.(),this.teardownMediaQueries(),this.overlayHandle?.suspend(),this.endResizerGesture(),this.releaseExternalTriggerA11y()}adoptedCallback(){this.resetPeek({silent:!0}),this.disconnectResizerPosition(),super.adoptedCallback(),this.teardownMediaQueries(),this.endResizerGesture()}resolveExternalTrigger(){if(this.trigger)return this.trigger;if(!this.for)return null;const found=this.getRootNode().getElementById?.(this.for);return found instanceof HTMLElement?found:null}resolveFocusFallback(){const value=this.focusFallback;if(!value)return null;const target=typeof value=="string"?this.getRootNode().getElementById?.(value)??null:value;return isHtmlElement(target)&&target.ownerDocument===this.ownerDocument?target:null}activateMobileOverlay(){this.nativeModal.prepare();const explicitTrigger=this.explicitTrigger;this.explicitTrigger=void 0;const restoreFocusTo=explicitTrigger??this.resolveExternalTrigger()??void 0;this.overlayReturnIsExplicit=explicitTrigger!==void 0;const active=deepActiveElement(this.ownerDocument);this.overlayOpener=active&&typeof active.focus=="function"&&!composedContains(this,active)?active:null,this.overlayReturnTarget=restoreFocusTo??this.overlayOpener,this.overlayHandle=activateOverlay({host:this,panel:()=>this.shadowRoot?.querySelector('[part="panel"]')??null,onEscape:()=>this.setOpen(!1),onBackdrop:()=>this.setOpen(!1),restoreFocusTo,preferredInitialFocus:()=>{const panel=this.shadowRoot?.querySelector('[part="panel"]')??null;if(!panel)return null;const toggle=this.toggleEl??null;return collectFocusableElements(panel).filter(stop=>stop!==toggle)[0]??panel},lockScroll:!0,suspendWhenUnrendered:!0,deferredReturn:this.deferredReturnPass})}deactivateMobileOverlay(restoreFocus=!0){this.nativeModal.hide(),this.nativeModal.prepare(!1);const handle=this.overlayHandle;if(this.overlayHandle=void 0,handle&&restoreFocus&&!this.overlayReturnIsExplicit){const external=this.resolveExternalTrigger();external&&external!==this.overlayReturnTarget&&(this.overlayReturnTarget=external,handle.updateRestoreFocusTo(external))}handle?.deactivate({restoreFocus})}focusHostFallback(){if(!this.hasAttribute("tabindex")){this.setAttribute("tabindex","-1");const view=this.ownerDocument.defaultView,onFocusChange=()=>{deepActiveElement(this.ownerDocument)!==this&&restore()},restore=()=>{this.removeEventListener("blur",onFocusChange),view?.removeEventListener("focus",onFocusChange),this.getAttribute("tabindex")==="-1"&&this.removeAttribute("tabindex"),this.restoreFallbackTabIndex=void 0};this.restoreFallbackTabIndex=restore,this.addEventListener("blur",onFocusChange),view?.addEventListener("focus",onFocusChange)}return focusFirstAvailable(this)?!0:(this.restoreFallbackTabIndex?.(),!1)}placeToggle(insidePanel){const toggle=this.toggleEl,panel=this.baseEl;if(!(!toggle||!panel)){if(insidePanel){panel.firstChild!==toggle&&panel.insertBefore(toggle,panel.firstChild);return}toggle.nextSibling!==panel&&panel.parentNode?.insertBefore(toggle,panel)}}setupMediaQueries(){if(!this.isConnected)return;const view=this.ownerDocument.defaultView;if(!view?.matchMedia)return;const iconOnlyQuery=view.matchMedia(`(max-width: ${this.iconOnlyBreakpoint})`),mobileQuery=view.matchMedia(`(max-width: ${this.mobileBreakpoint})`),iconOnlyListener=event=>{this.mqIconOnly!==iconOnlyQuery||!this.isConnected||this.ownerDocument.defaultView!==view||this.onIconOnlyChange(event)},mobileListener=event=>{this.mqMobile!==mobileQuery||!this.isConnected||this.ownerDocument.defaultView!==view||this.onMobileChange(event)};this.mqIconOnly=iconOnlyQuery,this.mqMobile=mobileQuery,this.mqIconOnlyListener=iconOnlyListener,this.mqMobileListener=mobileListener,iconOnlyQuery.addEventListener("change",iconOnlyListener),mobileQuery.addEventListener("change",mobileListener),this.iconOnlyMatches=iconOnlyQuery.matches,this.mobileMatches=mobileQuery.matches,!this.forced&&this.applyComputedMode(this.hasUpdated?void 0:{silent:!0})}teardownMediaQueries(){this.mqIconOnly&&this.mqIconOnlyListener&&this.mqIconOnly.removeEventListener("change",this.mqIconOnlyListener),this.mqMobile&&this.mqMobileListener&&this.mqMobile.removeEventListener("change",this.mqMobileListener),this.mqIconOnly=void 0,this.mqMobile=void 0,this.mqIconOnlyListener=void 0,this.mqMobileListener=void 0}applyComputedMode(options){this.setEffectiveMode(computeAppRailMode(this.iconOnlyMatches,this.mobileMatches,this.modePreference),options)}setEffectiveMode(next,options){if(this._mode===next)return;const old=this._mode,resizer=this.renderRoot?.querySelector('[part="resizer"]');old==="full"&&next==="icon-only"&&resizer&&composedContains(resizer,deepActiveElement(this.ownerDocument))&&(this.recoverInlineFocusAfterResponsiveClose=!0),next!=="mobile"&&this.baseEl?.removeAttribute("data-sliding"),old==="mobile"&&next!=="mobile"&&this.open&&(this.recoverInlineFocusAfterResponsiveClose=!0),this._mode=next,next!=="icon-only"&&(this.clearPeekOpen(),this.clearPeekClose(),this.setPeeking(!1)),this.baseEl&&(this.resizable&&this.railWidth!=null&&next==="full"||this.baseEl.style.removeProperty("inline-size")),this.requestUpdate("mode",old),options?.silent?this.pendingInitialModeAnnouncement=next:this.emit("lr-mode-change",{mode:next}),next!=="mobile"&&this.open&&this.setOpen(!1,{force:!0})}setOpen(next,options){if(this.open===next)return;if(options?.force){this.open=next,this.emit("lr-toggle",{expanded:next});return}const mode=this._mode,open=this.open;this.emit("lr-toggle-request",{expanded:next},{cancelable:!0}).defaultPrevented||this._mode!==mode||this.open!==open||(this.open=next,this.emit("lr-toggle",{expanded:next}))}toggleCollapse(){this._mode!=="mobile"&&(this.preferredMode=(this.preferredMode??this._mode)==="icon-only"?"full":"icon-only")}toggle(){this.isConnected&&(this._mode==="mobile"?this.setOpen(!this.open):this.toggleCollapse())}get parsedHotkey(){const value=this.hotkey;if(this.hotkeyMemo&&this.hotkeyMemo.value===value)return this.hotkeyMemo.parsed;const parsed=parseHotkey(value);return this.hotkeyMemo={value,parsed},parsed}get hotkeyIsMac(){const view=this.ownerDocument.defaultView;if(this.hotkeyPlatform&&this.hotkeyPlatform.view===view)return this.hotkeyPlatform.mac;const mac=detectPlatform(view?.navigator)==="mac";return this.hotkeyPlatform={view,mac},mac}get resolvedHotkeyShortcuts(){const parsed=this.parsedHotkey;return hotkeyAriaKeyShortcuts(parsed&&hasNonShiftModifier(parsed)?parsed:null,this.hotkeyIsMac)}syncBuiltInKeyShortcuts(){const value=this.resolvedHotkeyShortcuts;for(const control of[this.toggleEl,this.renderRoot.querySelector('[part="collapse-toggle"]'),this.renderRoot.querySelector('[part="pin-button"]')])!control||control.getAttribute("aria-keyshortcuts")===value||(value===null?control.removeAttribute("aria-keyshortcuts"):control.setAttribute("aria-keyshortcuts",value))}syncExternalTriggerA11y(){if(!this.isConnected){this.releaseExternalTriggerA11y();return}const mobile=this._mode==="mobile",trigger=mobile||this.triggerCollapses?this.resolveExternalTrigger():null;if(!trigger){this.releaseExternalTriggerA11y();return}const panel=this.baseEl??null,contribution={attributes:{"aria-expanded":(mobile?this.open:this._mode==="full")?"true":"false","aria-keyshortcuts":this.resolvedHotkeyShortcuts},controls:panel?[panel]:[]};this.triggerAria?this.triggerAria.update(trigger,contribution):this.triggerAria=acquireAriaOwnership(trigger,contribution)}releaseExternalTriggerA11y(){this.triggerAria?.release(),this.triggerAria=void 0}endResizerGesture(commit=!1){const pointerId=this.resizePointerId,changed=this.resizeGestureChanged,widthPx=this.effectiveRailWidthPx;this.resizePointerId=void 0,this.resizeGestureChanged=!1,this.setDragging(!1),pointerId!==void 0&&this.resizeController.end(pointerId),commit&&changed&&(this.emit("lr-rail-resize",{widthPx}),this.persistReady&&this.persistState())}requestRailResize(next,commit=!0){if(!this.resizable||this._mode!=="full"||!this.isConnected||next===this.effectiveRailWidthPx)return!1;const event=this.emit("lr-rail-resize-request",{widthPx:next},{cancelable:!0});return!this.resizable||this._mode!=="full"||!this.isConnected?(this.endResizerGesture(),!1):event.defaultPrevented?!1:(this.railWidth=next,commit?this.emit("lr-rail-resize",{widthPx:next}):this.resizeGestureChanged=!0,!0)}observeResizerPosition(){const resizer=this.renderRoot.querySelector('[part="resizer"]');if(!this.isConnected||!resizer||!this.baseEl||this._mode!=="full"||!this.resizable){this.disconnectResizerPosition();return}if(this.observedResizer===resizer)return;this.disconnectResizerPosition();const ResizeObserverConstructor=this.ownerDocument.defaultView?.ResizeObserver;ResizeObserverConstructor&&(this.resizerPositionObserver=new ResizeObserverConstructor(()=>this.syncResizerPosition()),this.resizerPositionObserver.observe(this,{box:"border-box"}),this.resizerPositionObserver.observe(this.baseEl,{box:"border-box"}),this.resizerPositionObserver.observe(resizer,{box:"border-box"}),this.observedResizer=resizer)}disconnectResizerPosition(){this.resizerPositionObserver?.disconnect(),this.resizerPositionObserver=void 0,this.observedResizer=void 0}syncResizerPosition(){const resizer=this.renderRoot.querySelector('[part="resizer"]');if(!resizer||!this.baseEl||this._mode!=="full"||!this.resizable)return;const hostRect=this.getBoundingClientRect(),baseRect=this.baseEl.getBoundingClientRect(),half=resizer.getBoundingClientRect().width/2,offset=this.getAttribute("dir")==="rtl"||isRtl(this)?hostRect.right-baseRect.left:baseRect.right-hostRect.left;resizer.style.setProperty("inset-inline-start",`${offset-half}px`),resizer.style.setProperty("inset-inline-end","auto")}renderResizer(){const railWidthPx=this.effectiveRailWidthPx;return html`<div
       part="resizer"
       role="separator"
       aria-orientation="vertical"

package/dist/components/layout/command-palette/command-palette.class.d.ts

@@ -45,6 +45,7 @@ export interface LyraCommandPaletteCloseDetail{reason:LyraCommandPaletteCloseRea
 * @csspart clear-button - The button that clears the search field, replacing the native
 *   search-cancel glyph suppressed by this field's own reset; rendered only while it has a value.
 * @csspart list - Command list.
+* @csspart limit - Original command input-loss notice.
 * @csspart list-spacer - Virtual result extent inside the scrolling list.
 * @csspart command-group - A labeled ARIA group containing visible command options.
 * @csspart group - A group heading, rendered before the first command of each `group`.
@@ -99,8 +100,10 @@ commands:readonly LyraCommand[];
 hotkey:string;
 /** Accessible name for the dialog. Omitted falls back to the localized `commandPaletteLabel`
 *  default. An explicitly empty `aria-label` is used as-is. */
-accessibleLabel?:string;private queryText;private activeIndex;private listScrollTop;private listViewportHeight;private rowPitch;private groupPitch;private listId;private overlay?;private readonly nativeModal;private readonly modalSurface;private activeCommandId?;private listResizeObserver?;private observedList?;private observedRow?;private observedGroup?;private rowPitchFrame?;private listScrollFrame?;private runtimeWindow?;private haystacksFor?;private haystacksLocale;private haystacks;private filteredForCommands?;private filteredForQuery;private filteredForLocale;private filteredRows;private normalizedForCommands?;private normalizedRows;private resultModelFor?;private resultModelRowPitch?;private resultModelGroupPitch?;private resultModelCache?;private openRequestTarget?;private panelPressed;private readonly announcements;private announcedResultText?;private completedInitialUpdate;private get effectiveCommands();private get searchHaystacks();protected willUpdate(changed:PropertyValues):void;protected updated(changed:PropertyValues):void;private observeList;private observePitchSentinels;private clearPitchSentinels;private measureRowPitch;private scheduleRowPitchMeasurement;connectedCallback():void;disconnectedCallback():void;private releaseResultsSink;adoptedCallback():void;private enterTopLayer;private activateOverlay;openPalette():void;close(reason?:LyraCommandPaletteCloseReason):void;
+accessibleLabel?:string;private queryText;private activeIndex;private listScrollTop;private listViewportHeight;private rowPitch;private groupPitch;private listId;private overlay?;private readonly nativeModal;private readonly modalSurface;private activeCommandId?;private listResizeObserver?;private observedList?;private observedRow?;private observedGroup?;private rowPitchFrame?;private listScrollFrame?;private runtimeWindow?;private haystacksFor?;private haystacksLocale;private haystacks;private filteredForCommands?;private filteredForQuery;private filteredForLocale;private filteredRows;private normalizedForCommands?;private normalizedRows;private resultModelFor?;private resultModelRowPitch?;private resultModelGroupPitch?;private resultModelCache?;private openRequestTarget?;private panelPressed;private readonly announcements;private readonly inputLimitAnnouncements;private get inputLimitMessage();private syncInputLimitAnnouncement;private announcedResultText?;private completedInitialUpdate;private get effectiveCommands();private get searchHaystacks();private activeLookup?;protected willUpdate(changed:PropertyValues):void;protected updated(changed:PropertyValues):void;private observeList;private observePitchSentinels;private clearPitchSentinels;private measureRowPitch;private scheduleRowPitchMeasurement;connectedCallback():void;disconnectedCallback():void;private releaseResultsSink;adoptedCallback():void;private enterTopLayer;private activateOverlay;openPalette():void;close(reason?:LyraCommandPaletteCloseReason):void;
 /** Same as `openPalette()`, for the `show()`/`hide()` surface every Lyra overlay exposes. */
 show():void;
 /** Same as `close('api')`. */
-hide():void;private requestOpen;private resetOpeningState;private commitOpen;registerCommand(command:LyraCommand):()=>void;private matchesShortcut;private onGlobalKeyDown;private get filtered();private select;private seekEnabled;private setActiveIndex;private onKeyDown;private onInput;private onClearSearch;private onSearchFocus;private onSearchBlur;private get resultModel();private visibleGroups;private optionId;private scrollActiveIntoView;private onListScroll;private renderCommand;render():TemplateResult;}declare global{interface HTMLElementTagNameMap{'lr-command-palette':LyraCommandPalette;}}
+hide():void;private requestOpen;private resetOpeningState;private commitOpen;private pendingRegistrations;private registrationBase?;private registrationQueued;
+/** Adds commands in one microtask batch; assign commands directly for an immediate bulk update. */
+registerCommand(command:LyraCommand):()=>void;private shortcutIsMac;private shortcutMemo?;private matchesShortcut;private onGlobalKeyDown;private get filtered();private select;private seekEnabled;private setActiveIndex;private onKeyDown;private onInput;private onClearSearch;private onSearchFocus;private onSearchBlur;private get resultModel();private visibleGroups;private optionId;private scrollActiveIntoView;private onListScroll;private renderCommand;render():TemplateResult;}declare global{interface HTMLElementTagNameMap{'lr-command-palette':LyraCommandPalette;}}

package/dist/components/layout/command-palette/command-palette.class.js

@@ -1,4 +1,4 @@
-import{__decorate}from"tslib";import{relayNativeEvent}from"../../../internal/native-event-relay.js";import{NativeModalCarrier}from"../../../internal/native-modal-carrier.js";import{nativeModalCarrierStyles}from"../../../internal/native-modal-carrier.styles.js";import{ModalSurfaceController}from"../../../internal/modal-surface-controller.js";import{AnnouncementSinkController}from"../../../internal/announcer.js";import{collectionSupport}from"../../../internal/collection-snapshot.js";import{html,nothing,svg}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{parseHotkey,matchesHotkey,isIgnorableKeyEvent,registerHotkeyOwner,unregisterHotkeyOwner,resolveHotkeyOwner}from"../../../internal/hotkey.js";import{detectPlatform}from"../../../internal/platform.js";import{nextId}from"../../../internal/a11y.js";import{activateOverlay}from"../../../internal/overlay-manager.js";import{getOwnDataDescriptor,MISSING_OWN_DATA_DESCRIPTOR,UNSAFE_OWN_DATA_DESCRIPTOR}from"../../../internal/data-descriptors.js";import{styles}from"./command-palette.styles.js";import{resolveCssTokenLength}from"../../../internal/css-token-length.js";import{closeIcon}from"../../../internal/icons.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{LYRA_DEFAULT_commandPaletteEmpty,LYRA_DEFAULT_commandPaletteLabel,LYRA_DEFAULT_commandPalettePlaceholder,LYRA_DEFAULT_commandPaletteResultCount,LYRA_DEFAULT_commandPaletteResults}from"../../../internal/default-strings/layout.generated.js";import{LYRA_DEFAULT_clear}from"../../../internal/default-strings/shared.generated.js";const SEARCH_ICON=svg`<svg width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="m21 21-4.35-4.35M10.5 18a7.5 7.5 0 1 1 0-15 7.5 7.5 0 0 1 0 15Z"></path></svg>`,COMMAND_ROW_HEIGHT=48,GROUP_ROW_HEIGHT=32,RESULT_OVERSCAN_ROWS=6,MAX_COMMAND_PALETTE_COMMANDS=1e4,MAX_COMMAND_PALETTE_KEYWORDS=1e4,EMPTY_CANONICAL_COMMANDS=Object.freeze([]),EMPTY_COMMAND_KEYWORDS=Object.freeze([]);function projectCommandKeywords(value){try{if(!Array.isArray(value))return EMPTY_COMMAND_KEYWORDS;const length=getOwnDataDescriptor(value,"length");if(length===MISSING_OWN_DATA_DESCRIPTOR||length===UNSAFE_OWN_DATA_DESCRIPTOR||typeof length.value!="number"||!Number.isSafeInteger(length.value)||length.value<0)return EMPTY_COMMAND_KEYWORDS;const keywords=[];for(let index=0;index<Math.min(length.value,MAX_COMMAND_PALETTE_KEYWORDS);index+=1){const entry=getOwnDataDescriptor(value,String(index));entry===MISSING_OWN_DATA_DESCRIPTOR||entry===UNSAFE_OWN_DATA_DESCRIPTOR||typeof entry.value!="string"||keywords.push(entry.value)}return Object.freeze(keywords)}catch{return EMPTY_COMMAND_KEYWORDS}}function projectCommand(candidate){try{if(candidate===null||typeof candidate!="object"||Array.isArray(candidate))return;const commandId=getOwnDataDescriptor(candidate,"commandId"),label=getOwnDataDescriptor(candidate,"label"),description=getOwnDataDescriptor(candidate,"description"),group=getOwnDataDescriptor(candidate,"group"),shortcut=getOwnDataDescriptor(candidate,"shortcut"),keywords=getOwnDataDescriptor(candidate,"keywords"),disabled=getOwnDataDescriptor(candidate,"disabled"),icon=getOwnDataDescriptor(candidate,"icon"),onSelect=getOwnDataDescriptor(candidate,"onSelect");if(commandId===MISSING_OWN_DATA_DESCRIPTOR||commandId===UNSAFE_OWN_DATA_DESCRIPTOR||label===MISSING_OWN_DATA_DESCRIPTOR||label===UNSAFE_OWN_DATA_DESCRIPTOR||description===UNSAFE_OWN_DATA_DESCRIPTOR||group===UNSAFE_OWN_DATA_DESCRIPTOR||shortcut===UNSAFE_OWN_DATA_DESCRIPTOR||keywords===UNSAFE_OWN_DATA_DESCRIPTOR||disabled===UNSAFE_OWN_DATA_DESCRIPTOR||icon===UNSAFE_OWN_DATA_DESCRIPTOR||onSelect===UNSAFE_OWN_DATA_DESCRIPTOR||typeof commandId.value!="string"||commandId.value.trim()===""||typeof label.value!="string"||label.value.trim()==="")return;const descriptionValue=description===MISSING_OWN_DATA_DESCRIPTOR?void 0:description.value,groupValue=group===MISSING_OWN_DATA_DESCRIPTOR?void 0:group.value,shortcutValue=shortcut===MISSING_OWN_DATA_DESCRIPTOR?void 0:shortcut.value,keywordsValue=keywords===MISSING_OWN_DATA_DESCRIPTOR?void 0:keywords.value,disabledValue=disabled===MISSING_OWN_DATA_DESCRIPTOR?void 0:disabled.value,iconValue=icon===MISSING_OWN_DATA_DESCRIPTOR?void 0:icon.value,onSelectValue=onSelect===MISSING_OWN_DATA_DESCRIPTOR?void 0:onSelect.value;if(descriptionValue!==void 0&&typeof descriptionValue!="string"||groupValue!==void 0&&typeof groupValue!="string"||shortcutValue!==void 0&&typeof shortcutValue!="string"||disabledValue!==void 0&&typeof disabledValue!="boolean"||onSelectValue!==void 0&&typeof onSelectValue!="function")return;const keywordValues=projectCommandKeywords(keywordsValue);return Object.freeze({source:candidate,commandId:commandId.value,label:label.value,...descriptionValue===void 0?{}:{description:descriptionValue},...groupValue===void 0?{}:{group:groupValue},...shortcutValue===void 0?{}:{shortcut:shortcutValue},keywords:keywordValues,disabled:disabledValue??!1,...iconValue===void 0?{}:{icon:iconValue},...onSelectValue===void 0?{}:{onSelect:onSelectValue}})}catch{return}}function projectCommands(value){try{if(!Array.isArray(value))return EMPTY_CANONICAL_COMMANDS;const length=getOwnDataDescriptor(value,"length");if(length===MISSING_OWN_DATA_DESCRIPTOR||length===UNSAFE_OWN_DATA_DESCRIPTOR||typeof length.value!="number"||!Number.isSafeInteger(length.value)||length.value<0)return EMPTY_CANONICAL_COMMANDS;const commands=[],seen=new Set;for(let index=0;index<Math.min(length.value,MAX_COMMAND_PALETTE_COMMANDS);index+=1){const entry=getOwnDataDescriptor(value,String(index));if(entry===MISSING_OWN_DATA_DESCRIPTOR||entry===UNSAFE_OWN_DATA_DESCRIPTOR)continue;const command=projectCommand(entry.value);!command||seen.has(command.commandId)||(seen.add(command.commandId),commands.push(command))}return Object.freeze(commands)}catch{return EMPTY_CANONICAL_COMMANDS}}class LyraCommandPalette extends LyraElement{constructor(){super(...arguments),this._open=!1,this.hasShown=!1,this.commands=[],this.hotkey="mod+k",this.queryText="",this.activeIndex=0,this.listScrollTop=0,this.listViewportHeight=COMMAND_ROW_HEIGHT*10,this.rowPitch=COMMAND_ROW_HEIGHT,this.groupPitch=GROUP_ROW_HEIGHT,this.listId=nextId("command-list"),this.nativeModal=new NativeModalCarrier(this,{onCancel:()=>{this.overlay?.isTopmost()&&this.close("escape")},onUnexpectedClose:()=>{this.close("escape"),this.open&&this.modalSurface.show()}}),this.modalSurface=new ModalSurfaceController(this,this.nativeModal,()=>this.renderRoot.querySelector('[part="backdrop"]')),this.haystacksLocale="",this.haystacks=[],this.filteredForQuery="",this.filteredForLocale="",this.filteredRows=[],this.normalizedRows=EMPTY_CANONICAL_COMMANDS,this.panelPressed=!1,this.announcements=new AnnouncementSinkController(this),this.completedInitialUpdate=!1,this.onGlobalKeyDown=event=>{if(isIgnorableKeyEvent(event))return;const view=this.runtimeWindow;!view||!this.matchesShortcut(event)||resolveHotkeyOwner(view,event)!==this||(event.preventDefault(),this.openPalette())},this.onKeyDown=event=>{if(event.isComposing||event.keyCode===229)return;const rows=this.filtered;if(event.key==="ArrowDown"){event.preventDefault();const next=this.seekEnabled(rows,this.activeIndex+1,1);next!==-1&&this.setActiveIndex(rows,next)}else if(event.key==="ArrowUp"){event.preventDefault();const previous=this.seekEnabled(rows,this.activeIndex-1,-1);previous!==-1&&this.setActiveIndex(rows,previous)}else if(event.key==="Enter"){const active=rows[this.activeIndex];active&&(event.preventDefault(),this.select(active))}else if(rows.length&&["Home","End","PageUp","PageDown"].includes(event.key)){event.preventDefault();const step=event.key==="Home"||event.key==="PageDown"?1:-1,page=Math.max(1,Math.floor(this.listViewportHeight/this.rowPitch)),from=event.key==="Home"?0:event.key==="End"?rows.length-1:Math.min(rows.length-1,Math.max(0,this.activeIndex+step*page)),next=this.seekEnabled(rows,from,step);next!==-1&&this.setActiveIndex(rows,next)}},this.onInput=event=>{event.stopPropagation(),this.queryText=event.target.value,this.listScrollTop=0;const list=this.renderRoot.querySelector('[part="list"]');list&&(list.scrollTop=0);const rows=this.filtered;this.setActiveIndex(rows,this.seekEnabled(rows,0,1))},this.onClearSearch=()=>{if(this.queryText==="")return;this.queryText="",this.listScrollTop=0;const list=this.renderRoot.querySelector('[part="list"]');list&&(list.scrollTop=0);const rows=this.filtered;this.setActiveIndex(rows,this.seekEnabled(rows,0,1)),this.renderRoot.querySelector('[part="input"]')?.focus()},this.onSearchFocus=event=>{relayNativeEvent(this,event)},this.onSearchBlur=event=>{relayNativeEvent(this,event)},this.onListScroll=event=>{const list=event.currentTarget;if(this.listScrollFrame!==void 0)return;const view=this.runtimeWindow??this.ownerDocument.defaultView;if(!view){this.listScrollTop=list.scrollTop;return}this.listScrollFrame=view.requestAnimationFrame(()=>{this.listScrollFrame=void 0,this.listScrollTop=list.scrollTop})}}static{this.defaultStrings={...super.defaultStrings,clear:LYRA_DEFAULT_clear,commandPaletteEmpty:LYRA_DEFAULT_commandPaletteEmpty,commandPaletteLabel:LYRA_DEFAULT_commandPaletteLabel,commandPalettePlaceholder:LYRA_DEFAULT_commandPalettePlaceholder,commandPaletteResultCount:LYRA_DEFAULT_commandPaletteResultCount,commandPaletteResults:LYRA_DEFAULT_commandPaletteResults}}static{this.collectionSupport=collectionSupport}static{this.ownedCollectionProperties=Object.freeze(["commands"])}static{this.identityCollectionProperties=Object.freeze(["commands"])}static{this.identityEventDetailProperties=Object.freeze({"lr-select":Object.freeze(["command"])})}static{this.styles=[LyraElement.styles,nativeModalCarrierStyles,styles]}static{this.immutableEventDetails=Object.freeze(["lr-select"])}get open(){return this._open}set open(next){const normalized=!!next;if(normalized!==this._open){if(!this.hasUpdated){this.commitOpen(normalized);return}this.requestOpen(normalized)}}get effectiveCommands(){return this.normalizedForCommands!==this.commands&&(this.normalizedForCommands=this.commands,this.normalizedRows=projectCommands(this.commands)),this.normalizedRows}get searchHaystacks(){const locale=this.effectiveLocale,commands=this.effectiveCommands;return(this.haystacksFor!==commands||this.haystacksLocale!==locale)&&(this.haystacksFor=commands,this.haystacksLocale=locale,this.haystacks=commands.map(command=>[command.label,command.description??"",command.group??"",...command.keywords].join(" ").toLocaleLowerCase(locale))),this.haystacks}willUpdate(changed){if(super.willUpdate(changed),changed.has("open"))if(this.open)this.modalSurface.open(()=>this.activateOverlay());else{const hadOverlay=this.overlay!==void 0;this.releaseResultsSink(),this.modalSurface.close(hadOverlay,()=>{this.overlay?.deactivate(),this.overlay=void 0},()=>!this.open)}const rows=this.filtered;let nextIndex=this.activeCommandId?rows.findIndex(command=>command.commandId===this.activeCommandId):-1;if(nextIndex<0||rows[nextIndex]?.disabled){const start=Math.min(Math.max(this.activeIndex,0),Math.max(0,rows.length-1));nextIndex=this.seekEnabled(rows,start,1),nextIndex===-1&&(nextIndex=this.seekEnabled(rows,start-1,-1))}this.activeIndex=nextIndex,this.activeCommandId=nextIndex>=0?rows[nextIndex].commandId:void 0}updated(changed){if(super.updated(changed),changed.has("open")&&this.open&&(this.enterTopLayer(),this.overlay?.focusInitial()),changed.has("open")&&(this.open||this.hasShown)&&(this.hasShown=this.open,this.emit(this.open?"lr-after-show":"lr-after-hide")),changed.has("activeIndex")&&this.scrollActiveIntoView(),this.open&&this.queryText.trim()!==""){const count=this.filtered.length,resultText=count===0?this.localize("commandPaletteEmpty"):this.localize("commandPaletteResultCount",void 0,{count:getNumberFormat(this.effectiveLocale).format(count),pluralCount:count});this.completedInitialUpdate&&resultText!==this.announcedResultText&&this.announcements.announcePolite(resultText),this.announcedResultText=resultText}else this.queryText.trim()===""&&(this.announcedResultText=void 0);this.completedInitialUpdate=!0;const list=this.renderRoot.querySelector('[part="list"]');this.observeList(list??void 0)}observeList(list){list!==this.observedList&&(this.observedList&&this.listResizeObserver?.unobserve(this.observedList),this.clearPitchSentinels(),this.observedList=list,list&&(this.listResizeObserver?.observe(list),queueMicrotask(()=>{this.isConnected&&this.observedList===list&&this.measureRowPitch()}))),this.observePitchSentinels()}observePitchSentinels(){const row=this.renderRoot.querySelector('[part="command"]')??void 0,group=this.renderRoot.querySelector('[part="group"]')??void 0;row!==this.observedRow&&(this.observedRow&&this.listResizeObserver?.unobserve(this.observedRow),this.observedRow=row,row&&this.listResizeObserver?.observe(row)),group!==this.observedGroup&&(this.observedGroup&&this.listResizeObserver?.unobserve(this.observedGroup),this.observedGroup=group,group&&this.listResizeObserver?.observe(group))}clearPitchSentinels(){this.observedRow&&this.listResizeObserver?.unobserve(this.observedRow),this.observedGroup&&this.listResizeObserver?.unobserve(this.observedGroup),this.observedRow=void 0,this.observedGroup=void 0}measureRowPitch(){const style=this.ownerDocument.defaultView?.getComputedStyle(this);if(!style)return;const row=resolveCssTokenLength(style.getPropertyValue("--lr-command-palette-row-height").trim()||style.getPropertyValue("--_lr-command-palette-row-height").trim(),{host:this}),group=resolveCssTokenLength(style.getPropertyValue("--lr-command-palette-group-height").trim()||style.getPropertyValue("--_lr-command-palette-group-height").trim(),{host:this});row!==void 0&&row>0&&row!==this.rowPitch&&(this.rowPitch=row),group!==void 0&&group>0&&group!==this.groupPitch&&(this.groupPitch=group)}scheduleRowPitchMeasurement(){if(this.rowPitchFrame!==void 0)return;const view=this.runtimeWindow??this.ownerDocument.defaultView;if(!view){this.measureRowPitch();return}this.rowPitchFrame=view.requestAnimationFrame(()=>{this.rowPitchFrame=void 0,this.isConnected&&this.measureRowPitch()})}connectedCallback(){super.connectedCallback();const view=this.ownerDocument.defaultView;this.runtimeWindow=view??void 0,view&&(registerHotkeyOwner(view,this,event=>this.isConnected&&this.matchesShortcut(event)),view.addEventListener("keydown",this.onGlobalKeyDown));const ResizeObserverCtor=view?.ResizeObserver;if(ResizeObserverCtor&&view){let observer;observer=new ResizeObserverCtor(entries=>{if(this.listResizeObserver!==observer||this.runtimeWindow!==view)return;this.scheduleRowPitchMeasurement();const entry=entries.find(candidate=>candidate.target===this.observedList);if(!entry)return;const height=entry.borderBoxSize?.[0]?.blockSize??entry.contentRect.height;height>0&&this.listViewportHeight!==height&&(this.listViewportHeight=height)}),this.listResizeObserver=observer}else this.listResizeObserver=void 0;this.hasUpdated&&this.observeList(this.renderRoot.querySelector('[part="list"]')??void 0),this.hasUpdated&&this.open&&(this.activateOverlay(),queueMicrotask(()=>{!this.isConnected||!this.open||(this.enterTopLayer(),this.overlay?.focusInitial())}))}disconnectedCallback(){super.disconnectedCallback();const view=this.runtimeWindow;view&&(unregisterHotkeyOwner(view,this),view.removeEventListener("keydown",this.onGlobalKeyDown)),this.modalSurface.disconnect(),this.overlay?.suspend(),this.releaseResultsSink(),this.listResizeObserver?.disconnect(),this.listResizeObserver=void 0,this.observedList=void 0,this.observedRow=void 0,this.observedGroup=void 0,this.listScrollFrame!==void 0&&(view?.cancelAnimationFrame(this.listScrollFrame),this.listScrollFrame=void 0),this.rowPitchFrame!==void 0&&(view?.cancelAnimationFrame(this.rowPitchFrame),this.rowPitchFrame=void 0),this.runtimeWindow=void 0}releaseResultsSink(){this.announcements.releaseChannel("polite"),this.announcedResultText=void 0}adoptedCallback(){super.adoptedCallback(),this.announcements.adopted()}enterTopLayer(){this.modalSurface.show()}activateOverlay(){if(this.overlay?.isActive()){this.overlay.resume();return}this.overlay=activateOverlay({host:this,panel:()=>this.shadowRoot?.querySelector('[part="dialog"]')??null,onEscape:()=>this.close("escape"),onBackdrop:()=>this.close("backdrop"),lockScroll:!0,suspendWhenUnrendered:!0})}openPalette(){this.requestOpen(!0)}close(reason="api"){this.requestOpen(!1,reason)}show(){this.openPalette()}hide(){this.close()}requestOpen(next,reason="api"){if(next===this._open||this.openRequestTarget===next)return!1;this.openRequestTarget=next;let prevented;return next?prevented=this.emit("lr-show",null,{cancelable:!0}).defaultPrevented:prevented=this.emit("lr-close-request",{reason},{cancelable:!0}).defaultPrevented,this.openRequestTarget=void 0,prevented?(this.toggleAttribute("open",this._open),!1):(next?this.resetOpeningState():this.emit("lr-hide",{reason}),this.commitOpen(next),next||this.emit("lr-close",{reason}),!0)}resetOpeningState(){this.queryText="",this.listScrollTop=0;const rows=this.filtered;this.setActiveIndex(rows,this.seekEnabled(rows,0,1))}commitOpen(next){if(next===this._open)return;const old=this._open;this._open=next,this.requestUpdate("open",old)}registerCommand(command){return this.commands=[...this.commands,command],()=>{this.commands=this.commands.filter(item=>item!==command)}}matchesShortcut(event){return matchesHotkey(parseHotkey(this.hotkey),event,detectPlatform((this.runtimeWindow??this.ownerDocument.defaultView)?.navigator)==="mac")}get filtered(){const locale=this.effectiveLocale,query=this.queryText.trim().toLocaleLowerCase(locale),commands=this.effectiveCommands;if(this.filteredForCommands!==commands||this.filteredForQuery!==query||this.filteredForLocale!==locale)if(this.filteredForCommands=commands,this.filteredForQuery=query,this.filteredForLocale=locale,!query)this.filteredRows=[...commands];else{const haystacks=this.searchHaystacks;this.filteredRows=commands.filter((_,index)=>haystacks[index].includes(query))}return this.filteredRows}select(command){command.disabled||(this.emit("lr-select",{command:command.source}),command.onSelect?.(),this.close("select"))}seekEnabled(rows,from,step){for(let index=from;index>=0&&index<rows.length;index+=step)if(!rows[index].disabled)return index;return-1}setActiveIndex(rows,index){this.activeIndex=index,this.activeCommandId=index>=0?rows[index].commandId:void 0}get resultModel(){const rows=this.filtered;if(this.resultModelFor===rows&&this.resultModelRowPitch===this.rowPitch&&this.resultModelGroupPitch===this.groupPitch&&this.resultModelCache)return this.resultModelCache;const resultRows=[],groups=[];let top=0,previousGroup,group;for(let index=0;index<rows.length;index++){const command=rows[index],label=command.group??"";(!group||label!==previousGroup)&&(group={index:groups.length,label,headingTop:label?top:void 0,rows:[]},groups.push(group),previousGroup=label,label&&(top+=this.groupPitch));const row={command,index,top,groupIndex:group.index};group.rows.push(row),resultRows.push(row),top+=this.rowPitch}return this.resultModelFor=rows,this.resultModelRowPitch=this.rowPitch,this.resultModelGroupPitch=this.groupPitch,this.resultModelCache={rows:resultRows,groups,totalHeight:top},this.resultModelCache}visibleGroups(model){if(model.rows.length===0)return[];const minimum=Math.max(0,this.listScrollTop-this.rowPitch*RESULT_OVERSCAN_ROWS),maximum=this.listScrollTop+this.listViewportHeight+this.rowPitch*RESULT_OVERSCAN_ROWS;let low=0,high=model.rows.length-1;for(;low<high;){const middle=low+high>>1;model.rows[middle].top+this.rowPitch<minimum?low=middle+1:high=middle}const groups=[];let group;const appendRow=row=>{group?.index!==row.groupIndex&&(group={...model.groups[row.groupIndex],rows:[]},groups.push(group)),group.rows.push(row)},active=model.rows[this.activeIndex];active&&this.activeIndex<low&&appendRow(active);let index=low;for(;index<model.rows.length;index++){const row=model.rows[index];if(row.top>maximum)break;appendRow(row)}return active&&this.activeIndex>=index&&appendRow(active),groups}optionId(index){return`${this.listId}-opt-${index}`}scrollActiveIntoView(){if(this.activeIndex<0)return;const list=this.renderRoot.querySelector('[part="list"]'),row=this.resultModel.rows[this.activeIndex];if(!list||!row)return;const top=row.top+(list.firstElementChild?.offsetTop??0),bottom=top+this.rowPitch;top<list.scrollTop?list.scrollTop=top:bottom>list.scrollTop+list.clientHeight&&(list.scrollTop=Math.max(0,bottom-list.clientHeight))}renderCommand(row,total){const command=row.command,active=row.index===this.activeIndex;return html`<button
+import{__decorate}from"tslib";import{relayNativeEvent}from"../../../internal/native-event-relay.js";import{NativeModalCarrier}from"../../../internal/native-modal-carrier.js";import{nativeModalCarrierStyles}from"../../../internal/native-modal-carrier.styles.js";import{ModalSurfaceController}from"../../../internal/modal-surface-controller.js";import{AnnouncementSinkController}from"../../../internal/announcer.js";import{collectionSupport,publicCollectionTruncation}from"../../../internal/collection-snapshot.js";import{html,nothing,svg}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{parseHotkey,matchesHotkey,isIgnorableKeyEvent,registerHotkeyOwner,unregisterHotkeyOwner,resolveHotkeyOwner}from"../../../internal/hotkey.js";import{detectPlatform}from"../../../internal/platform.js";import{nextId}from"../../../internal/a11y.js";import{activateOverlay}from"../../../internal/overlay-manager.js";import{getOwnDataDescriptor,MISSING_OWN_DATA_DESCRIPTOR,UNSAFE_OWN_DATA_DESCRIPTOR}from"../../../internal/data-descriptors.js";import{styles}from"./command-palette.styles.js";import{resolveCssTokenLength}from"../../../internal/css-token-length.js";import{closeIcon}from"../../../internal/icons.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{LYRA_DEFAULT_commandPaletteEmpty,LYRA_DEFAULT_commandPaletteInputLimit,LYRA_DEFAULT_commandPaletteLabel,LYRA_DEFAULT_commandPalettePlaceholder,LYRA_DEFAULT_commandPaletteResultCount,LYRA_DEFAULT_commandPaletteResults}from"../../../internal/default-strings/layout.generated.js";import{LYRA_DEFAULT_clear}from"../../../internal/default-strings/shared.generated.js";const SEARCH_ICON=svg`<svg width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="m21 21-4.35-4.35M10.5 18a7.5 7.5 0 1 1 0-15 7.5 7.5 0 0 1 0 15Z"></path></svg>`,COMMAND_ROW_HEIGHT=48,GROUP_ROW_HEIGHT=32,RESULT_OVERSCAN_ROWS=6,MAX_COMMAND_PALETTE_COMMANDS=1e4,MAX_COMMAND_PALETTE_KEYWORDS=1e4,EMPTY_CANONICAL_COMMANDS=Object.freeze([]),EMPTY_COMMAND_KEYWORDS=Object.freeze([]);function projectCommandKeywords(value){try{if(!Array.isArray(value))return EMPTY_COMMAND_KEYWORDS;const length=getOwnDataDescriptor(value,"length");if(length===MISSING_OWN_DATA_DESCRIPTOR||length===UNSAFE_OWN_DATA_DESCRIPTOR||typeof length.value!="number"||!Number.isSafeInteger(length.value)||length.value<0)return EMPTY_COMMAND_KEYWORDS;const keywords=[];for(let index=0;index<Math.min(length.value,MAX_COMMAND_PALETTE_KEYWORDS);index+=1){const entry=getOwnDataDescriptor(value,String(index));entry===MISSING_OWN_DATA_DESCRIPTOR||entry===UNSAFE_OWN_DATA_DESCRIPTOR||typeof entry.value!="string"||keywords.push(entry.value)}return Object.freeze(keywords)}catch{return EMPTY_COMMAND_KEYWORDS}}function projectCommand(candidate){try{if(candidate===null||typeof candidate!="object"||Array.isArray(candidate))return;const commandId=getOwnDataDescriptor(candidate,"commandId"),label=getOwnDataDescriptor(candidate,"label"),description=getOwnDataDescriptor(candidate,"description"),group=getOwnDataDescriptor(candidate,"group"),shortcut=getOwnDataDescriptor(candidate,"shortcut"),keywords=getOwnDataDescriptor(candidate,"keywords"),disabled=getOwnDataDescriptor(candidate,"disabled"),icon=getOwnDataDescriptor(candidate,"icon"),onSelect=getOwnDataDescriptor(candidate,"onSelect");if(commandId===MISSING_OWN_DATA_DESCRIPTOR||commandId===UNSAFE_OWN_DATA_DESCRIPTOR||label===MISSING_OWN_DATA_DESCRIPTOR||label===UNSAFE_OWN_DATA_DESCRIPTOR||description===UNSAFE_OWN_DATA_DESCRIPTOR||group===UNSAFE_OWN_DATA_DESCRIPTOR||shortcut===UNSAFE_OWN_DATA_DESCRIPTOR||keywords===UNSAFE_OWN_DATA_DESCRIPTOR||disabled===UNSAFE_OWN_DATA_DESCRIPTOR||icon===UNSAFE_OWN_DATA_DESCRIPTOR||onSelect===UNSAFE_OWN_DATA_DESCRIPTOR||typeof commandId.value!="string"||commandId.value.trim()===""||typeof label.value!="string"||label.value.trim()==="")return;const descriptionValue=description===MISSING_OWN_DATA_DESCRIPTOR?void 0:description.value,groupValue=group===MISSING_OWN_DATA_DESCRIPTOR?void 0:group.value,shortcutValue=shortcut===MISSING_OWN_DATA_DESCRIPTOR?void 0:shortcut.value,keywordsValue=keywords===MISSING_OWN_DATA_DESCRIPTOR?void 0:keywords.value,disabledValue=disabled===MISSING_OWN_DATA_DESCRIPTOR?void 0:disabled.value,iconValue=icon===MISSING_OWN_DATA_DESCRIPTOR?void 0:icon.value,onSelectValue=onSelect===MISSING_OWN_DATA_DESCRIPTOR?void 0:onSelect.value;if(descriptionValue!==void 0&&typeof descriptionValue!="string"||groupValue!==void 0&&typeof groupValue!="string"||shortcutValue!==void 0&&typeof shortcutValue!="string"||disabledValue!==void 0&&typeof disabledValue!="boolean"||onSelectValue!==void 0&&typeof onSelectValue!="function")return;const keywordValues=projectCommandKeywords(keywordsValue);return Object.freeze({source:candidate,commandId:commandId.value,label:label.value,...descriptionValue===void 0?{}:{description:descriptionValue},...groupValue===void 0?{}:{group:groupValue},...shortcutValue===void 0?{}:{shortcut:shortcutValue},keywords:keywordValues,disabled:disabledValue??!1,...iconValue===void 0?{}:{icon:iconValue},...onSelectValue===void 0?{}:{onSelect:onSelectValue}})}catch{return}}function projectCommands(value){try{if(!Array.isArray(value))return EMPTY_CANONICAL_COMMANDS;const length=getOwnDataDescriptor(value,"length");if(length===MISSING_OWN_DATA_DESCRIPTOR||length===UNSAFE_OWN_DATA_DESCRIPTOR||typeof length.value!="number"||!Number.isSafeInteger(length.value)||length.value<0)return EMPTY_CANONICAL_COMMANDS;const commands=[],seen=new Set;for(let index=0;index<Math.min(length.value,MAX_COMMAND_PALETTE_COMMANDS);index+=1){const entry=getOwnDataDescriptor(value,String(index));if(entry===MISSING_OWN_DATA_DESCRIPTOR||entry===UNSAFE_OWN_DATA_DESCRIPTOR)continue;const command=projectCommand(entry.value);!command||seen.has(command.commandId)||(seen.add(command.commandId),commands.push(command))}return Object.freeze(commands)}catch{return EMPTY_CANONICAL_COMMANDS}}class LyraCommandPalette extends LyraElement{constructor(){super(...arguments),this._open=!1,this.hasShown=!1,this.commands=[],this.hotkey="mod+k",this.queryText="",this.activeIndex=0,this.listScrollTop=0,this.listViewportHeight=COMMAND_ROW_HEIGHT*10,this.rowPitch=COMMAND_ROW_HEIGHT,this.groupPitch=GROUP_ROW_HEIGHT,this.listId=nextId("command-list"),this.nativeModal=new NativeModalCarrier(this,{onCancel:()=>{this.overlay?.isTopmost()&&this.close("escape")},onUnexpectedClose:()=>{this.close("escape"),this.open&&this.modalSurface.show()}}),this.modalSurface=new ModalSurfaceController(this,this.nativeModal,()=>this.renderRoot.querySelector('[part="backdrop"]')),this.haystacksLocale="",this.haystacks=[],this.filteredForQuery="",this.filteredForLocale="",this.filteredRows=[],this.normalizedRows=EMPTY_CANONICAL_COMMANDS,this.panelPressed=!1,this.announcements=new AnnouncementSinkController(this),this.inputLimitAnnouncements=new AnnouncementSinkController(this),this.completedInitialUpdate=!1,this.pendingRegistrations=[],this.registrationQueued=!1,this.shortcutIsMac=!1,this.onGlobalKeyDown=event=>{if(isIgnorableKeyEvent(event))return;const view=this.runtimeWindow;!view||!this.matchesShortcut(event)||resolveHotkeyOwner(view,event)!==this||(event.preventDefault(),this.openPalette())},this.onKeyDown=event=>{if(event.isComposing||event.keyCode===229)return;const rows=this.filtered;if(event.key==="ArrowDown"){event.preventDefault();const next=this.seekEnabled(rows,this.activeIndex+1,1);next!==-1&&this.setActiveIndex(rows,next)}else if(event.key==="ArrowUp"){event.preventDefault();const previous=this.seekEnabled(rows,this.activeIndex-1,-1);previous!==-1&&this.setActiveIndex(rows,previous)}else if(event.key==="Enter"){const active=rows[this.activeIndex];active&&(event.preventDefault(),this.select(active))}else if(rows.length&&["Home","End","PageUp","PageDown"].includes(event.key)){event.preventDefault();const step=event.key==="Home"||event.key==="PageDown"?1:-1,page=Math.max(1,Math.floor(this.listViewportHeight/this.rowPitch)),from=event.key==="Home"?0:event.key==="End"?rows.length-1:Math.min(rows.length-1,Math.max(0,this.activeIndex+step*page)),next=this.seekEnabled(rows,from,step);next!==-1&&this.setActiveIndex(rows,next)}},this.onInput=event=>{event.stopPropagation(),this.queryText=event.target.value,this.listScrollTop=0;const list=this.renderRoot.querySelector('[part="list"]');list&&(list.scrollTop=0);const rows=this.filtered;this.setActiveIndex(rows,this.seekEnabled(rows,0,1))},this.onClearSearch=()=>{if(this.queryText==="")return;this.queryText="",this.listScrollTop=0;const list=this.renderRoot.querySelector('[part="list"]');list&&(list.scrollTop=0);const rows=this.filtered;this.setActiveIndex(rows,this.seekEnabled(rows,0,1)),this.renderRoot.querySelector('[part="input"]')?.focus()},this.onSearchFocus=event=>{relayNativeEvent(this,event)},this.onSearchBlur=event=>{relayNativeEvent(this,event)},this.onListScroll=event=>{const list=event.currentTarget;if(this.listScrollFrame!==void 0)return;const view=this.runtimeWindow??this.ownerDocument.defaultView;if(!view){this.listScrollTop=list.scrollTop;return}this.listScrollFrame=view.requestAnimationFrame(()=>{this.listScrollFrame=void 0,this.listScrollTop=list.scrollTop})}}static{this.defaultStrings={...super.defaultStrings,clear:LYRA_DEFAULT_clear,commandPaletteEmpty:LYRA_DEFAULT_commandPaletteEmpty,commandPaletteInputLimit:LYRA_DEFAULT_commandPaletteInputLimit,commandPaletteLabel:LYRA_DEFAULT_commandPaletteLabel,commandPalettePlaceholder:LYRA_DEFAULT_commandPalettePlaceholder,commandPaletteResultCount:LYRA_DEFAULT_commandPaletteResultCount,commandPaletteResults:LYRA_DEFAULT_commandPaletteResults}}static{this.collectionSupport=collectionSupport}static{this.ownedCollectionProperties=Object.freeze(["commands"])}static{this.identityCollectionProperties=Object.freeze(["commands"])}static{this.identityEventDetailProperties=Object.freeze({"lr-select":Object.freeze(["command"])})}static{this.styles=[LyraElement.styles,nativeModalCarrierStyles,styles]}static{this.immutableEventDetails=Object.freeze(["lr-select"])}get open(){return this._open}set open(next){const normalized=!!next;if(normalized!==this._open){if(!this.hasUpdated){this.commitOpen(normalized);return}this.requestOpen(normalized)}}get inputLimitMessage(){return publicCollectionTruncation(this,"commands")?this.localize("commandPaletteInputLimit"):""}syncInputLimitAnnouncement(){const loss=publicCollectionTruncation(this,"commands");this.inputLimitAnnouncements.transition("input-limit",loss?`${loss.source}:${loss.retained}:${loss.kept}`:"",this.inputLimitMessage,this.open?"polite":void 0)}get effectiveCommands(){return this.normalizedForCommands!==this.commands&&(this.normalizedForCommands=this.commands,this.normalizedRows=projectCommands(this.commands)),this.normalizedRows}get searchHaystacks(){const locale=this.effectiveLocale,commands=this.effectiveCommands;return(this.haystacksFor!==commands||this.haystacksLocale!==locale)&&(this.haystacksFor=commands,this.haystacksLocale=locale,this.haystacks=commands.map(command=>[command.label,command.description??"",command.group??"",...command.keywords].join(" ").toLocaleLowerCase(locale))),this.haystacks}willUpdate(changed){if(super.willUpdate(changed),changed.has("open"))if(this.open)this.modalSurface.open(()=>this.activateOverlay());else{const hadOverlay=this.overlay!==void 0;this.releaseResultsSink(),this.modalSurface.close(hadOverlay,()=>{this.overlay?.deactivate(),this.overlay=void 0},()=>!this.open)}const rows=this.filtered;this.activeLookup?.rows!==rows&&(this.activeLookup={rows,indexes:new Map(rows.map((command,index)=>[command.commandId,index]))});let nextIndex=this.activeCommandId?this.activeLookup.indexes.get(this.activeCommandId)??-1:-1;if(nextIndex<0||rows[nextIndex]?.disabled){const start=Math.min(Math.max(this.activeIndex,0),Math.max(0,rows.length-1));nextIndex=this.seekEnabled(rows,start,1),nextIndex===-1&&(nextIndex=this.seekEnabled(rows,start-1,-1))}this.activeIndex=nextIndex,this.activeCommandId=nextIndex>=0?rows[nextIndex].commandId:void 0}updated(changed){if(super.updated(changed),this.syncInputLimitAnnouncement(),changed.has("open")&&this.open&&(this.enterTopLayer(),this.overlay?.focusInitial()),changed.has("open")&&(this.open||this.hasShown)&&(this.hasShown=this.open,this.emit(this.open?"lr-after-show":"lr-after-hide")),changed.has("activeIndex")&&this.scrollActiveIntoView(),this.open&&this.queryText.trim()!==""){const count=this.filtered.length,resultText=count===0?this.localize("commandPaletteEmpty"):this.localize("commandPaletteResultCount",void 0,{count:getNumberFormat(this.effectiveLocale).format(count),pluralCount:count});this.completedInitialUpdate&&resultText!==this.announcedResultText&&this.announcements.announcePolite(resultText),this.announcedResultText=resultText}else this.queryText.trim()===""&&(this.announcedResultText=void 0);this.completedInitialUpdate=!0;const list=this.renderRoot.querySelector('[part="list"]');this.observeList(list??void 0)}observeList(list){list!==this.observedList&&(this.observedList&&this.listResizeObserver?.unobserve(this.observedList),this.clearPitchSentinels(),this.observedList=list,list&&(this.listResizeObserver?.observe(list),queueMicrotask(()=>{this.isConnected&&this.observedList===list&&this.measureRowPitch()}))),this.observePitchSentinels()}observePitchSentinels(){const row=this.renderRoot.querySelector('[part="command"]')??void 0,group=this.renderRoot.querySelector('[part="group"]')??void 0;row!==this.observedRow&&(this.observedRow&&this.listResizeObserver?.unobserve(this.observedRow),this.observedRow=row,row&&this.listResizeObserver?.observe(row)),group!==this.observedGroup&&(this.observedGroup&&this.listResizeObserver?.unobserve(this.observedGroup),this.observedGroup=group,group&&this.listResizeObserver?.observe(group))}clearPitchSentinels(){this.observedRow&&this.listResizeObserver?.unobserve(this.observedRow),this.observedGroup&&this.listResizeObserver?.unobserve(this.observedGroup),this.observedRow=void 0,this.observedGroup=void 0}measureRowPitch(){const style=this.ownerDocument.defaultView?.getComputedStyle(this);if(!style)return;const row=resolveCssTokenLength(style.getPropertyValue("--lr-command-palette-row-height").trim()||style.getPropertyValue("--_lr-command-palette-row-height").trim(),{host:this}),group=resolveCssTokenLength(style.getPropertyValue("--lr-command-palette-group-height").trim()||style.getPropertyValue("--_lr-command-palette-group-height").trim(),{host:this});row!==void 0&&row>0&&row!==this.rowPitch&&(this.rowPitch=row),group!==void 0&&group>0&&group!==this.groupPitch&&(this.groupPitch=group)}scheduleRowPitchMeasurement(){if(this.rowPitchFrame!==void 0)return;const view=this.runtimeWindow??this.ownerDocument.defaultView;if(!view){this.measureRowPitch();return}this.rowPitchFrame=view.requestAnimationFrame(()=>{this.rowPitchFrame=void 0,this.isConnected&&this.measureRowPitch()})}connectedCallback(){super.connectedCallback();const view=this.ownerDocument.defaultView;this.runtimeWindow=view??void 0,this.shortcutIsMac=detectPlatform(view?.navigator)==="mac",view&&(registerHotkeyOwner(view,this,event=>this.isConnected&&this.matchesShortcut(event)),view.addEventListener("keydown",this.onGlobalKeyDown));const ResizeObserverCtor=view?.ResizeObserver;if(ResizeObserverCtor&&view){let observer;observer=new ResizeObserverCtor(entries=>{if(this.listResizeObserver!==observer||this.runtimeWindow!==view)return;this.scheduleRowPitchMeasurement();const entry=entries.find(candidate=>candidate.target===this.observedList);if(!entry)return;const height=entry.borderBoxSize?.[0]?.blockSize??entry.contentRect.height;height>0&&this.listViewportHeight!==height&&(this.listViewportHeight=height)}),this.listResizeObserver=observer}else this.listResizeObserver=void 0;this.hasUpdated&&(this.syncInputLimitAnnouncement(),this.observeList(this.renderRoot.querySelector('[part="list"]')??void 0)),this.hasUpdated&&this.open&&(this.activateOverlay(),queueMicrotask(()=>{!this.isConnected||!this.open||(this.enterTopLayer(),this.overlay?.focusInitial())}))}disconnectedCallback(){super.disconnectedCallback();const view=this.runtimeWindow;view&&(unregisterHotkeyOwner(view,this),view.removeEventListener("keydown",this.onGlobalKeyDown)),this.modalSurface.disconnect(),this.overlay?.suspend(),this.releaseResultsSink(),this.listResizeObserver?.disconnect(),this.listResizeObserver=void 0,this.observedList=void 0,this.observedRow=void 0,this.observedGroup=void 0,this.listScrollFrame!==void 0&&(view?.cancelAnimationFrame(this.listScrollFrame),this.listScrollFrame=void 0),this.rowPitchFrame!==void 0&&(view?.cancelAnimationFrame(this.rowPitchFrame),this.rowPitchFrame=void 0),this.runtimeWindow=void 0}releaseResultsSink(){this.announcements.releaseChannel("polite"),this.announcedResultText=void 0}adoptedCallback(){super.adoptedCallback(),this.announcements.adopted(),this.inputLimitAnnouncements.adopted()}enterTopLayer(){this.modalSurface.show()}activateOverlay(){if(this.overlay?.isActive()){this.overlay.resume();return}this.overlay=activateOverlay({host:this,panel:()=>this.shadowRoot?.querySelector('[part="dialog"]')??null,onEscape:()=>this.close("escape"),onBackdrop:()=>this.close("backdrop"),lockScroll:!0,suspendWhenUnrendered:!0})}openPalette(){this.requestOpen(!0)}close(reason="api"){this.requestOpen(!1,reason)}show(){this.openPalette()}hide(){this.close()}requestOpen(next,reason="api"){if(next===this._open||this.openRequestTarget===next)return!1;this.openRequestTarget=next;let prevented;return next?prevented=this.emit("lr-show",null,{cancelable:!0}).defaultPrevented:prevented=this.emit("lr-close-request",{reason},{cancelable:!0}).defaultPrevented,this.openRequestTarget=void 0,prevented?(this.toggleAttribute("open",this._open),!1):(next?this.resetOpeningState():this.emit("lr-hide",{reason}),this.commitOpen(next),next||this.emit("lr-close",{reason}),!0)}resetOpeningState(){this.queryText="",this.listScrollTop=0;const rows=this.filtered;this.setActiveIndex(rows,this.seekEnabled(rows,0,1))}commitOpen(next){if(next===this._open)return;const old=this._open;this._open=next,this.requestUpdate("open",old)}registerCommand(command){return this.registrationBase!==this.commands&&(this.pendingRegistrations=[],this.registrationBase=this.commands),this.pendingRegistrations.push(command),this.registrationQueued||(this.registrationQueued=!0,queueMicrotask(()=>{this.registrationQueued=!1;const pending=this.pendingRegistrations;this.pendingRegistrations=[],this.commands===this.registrationBase&&pending.length&&(this.commands=[...this.commands,...pending]),this.registrationBase=void 0})),()=>{if(this.pendingRegistrations=this.pendingRegistrations.filter(item=>item!==command),this.commands.includes(command)){const pendingTargetsCurrent=this.registrationBase===this.commands;this.commands=this.commands.filter(item=>item!==command),pendingTargetsCurrent&&(this.registrationBase=this.commands)}}}matchesShortcut(event){return(!this.shortcutMemo||this.shortcutMemo.source!==this.hotkey)&&(this.shortcutMemo={source:this.hotkey,parsed:parseHotkey(this.hotkey)}),matchesHotkey(this.shortcutMemo.parsed,event,this.shortcutIsMac)}get filtered(){const locale=this.effectiveLocale,query=this.queryText.trim().toLocaleLowerCase(locale),commands=this.effectiveCommands;if(this.filteredForCommands!==commands||this.filteredForQuery!==query||this.filteredForLocale!==locale)if(this.filteredForCommands=commands,this.filteredForQuery=query,this.filteredForLocale=locale,!query)this.filteredRows=[...commands];else{const haystacks=this.searchHaystacks;this.filteredRows=commands.filter((_,index)=>haystacks[index].includes(query))}return this.filteredRows}select(command){command.disabled||(this.emit("lr-select",{command:command.source}),command.onSelect?.(),this.close("select"))}seekEnabled(rows,from,step){for(let index=from;index>=0&&index<rows.length;index+=step)if(!rows[index].disabled)return index;return-1}setActiveIndex(rows,index){this.activeIndex=index,this.activeCommandId=index>=0?rows[index].commandId:void 0}get resultModel(){const rows=this.filtered;if(this.resultModelFor===rows&&this.resultModelRowPitch===this.rowPitch&&this.resultModelGroupPitch===this.groupPitch&&this.resultModelCache)return this.resultModelCache;const resultRows=[],groups=[];let top=0,previousGroup,group;for(let index=0;index<rows.length;index++){const command=rows[index],label=command.group??"";(!group||label!==previousGroup)&&(group={index:groups.length,label,headingTop:label?top:void 0,rows:[]},groups.push(group),previousGroup=label,label&&(top+=this.groupPitch));const row={command,index,top,groupIndex:group.index};group.rows.push(row),resultRows.push(row),top+=this.rowPitch}return this.resultModelFor=rows,this.resultModelRowPitch=this.rowPitch,this.resultModelGroupPitch=this.groupPitch,this.resultModelCache={rows:resultRows,groups,totalHeight:top},this.resultModelCache}visibleGroups(model){if(model.rows.length===0)return[];const minimum=Math.max(0,this.listScrollTop-this.rowPitch*RESULT_OVERSCAN_ROWS),maximum=this.listScrollTop+this.listViewportHeight+this.rowPitch*RESULT_OVERSCAN_ROWS;let low=0,high=model.rows.length-1;for(;low<high;){const middle=low+high>>1;model.rows[middle].top+this.rowPitch<minimum?low=middle+1:high=middle}const groups=[];let group;const appendRow=row=>{group?.index!==row.groupIndex&&(group={...model.groups[row.groupIndex],rows:[]},groups.push(group)),group.rows.push(row)},active=model.rows[this.activeIndex];active&&this.activeIndex<low&&appendRow(active);let index=low;for(;index<model.rows.length;index++){const row=model.rows[index];if(row.top>maximum)break;appendRow(row)}return active&&this.activeIndex>=index&&appendRow(active),groups}optionId(index){return`${this.listId}-opt-${index}`}scrollActiveIntoView(){if(this.activeIndex<0)return;const list=this.renderRoot.querySelector('[part="list"]'),row=this.resultModel.rows[this.activeIndex];if(!list||!row)return;const top=row.top+(list.firstElementChild?.offsetTop??0),bottom=top+this.rowPitch;top<list.scrollTop?list.scrollTop=top:bottom>list.scrollTop+list.clientHeight&&(list.scrollTop=Math.max(0,bottom-list.clientHeight))}renderCommand(row,total){const command=row.command,active=row.index===this.activeIndex;return html`<button
       id=${this.optionId(row.index)}
       part="command"
       role="option"
@@ -52,6 +52,7 @@ import{__decorate}from"tslib";import{relayNativeEvent}from"../../../internal/nat
                 <span aria-hidden="true" inert>${closeIcon()}</span>
               </button>`:nothing}
         </div>
+        ${this.inputLimitMessage?html`<p part="limit">${this.inputLimitMessage}</p>`:nothing}
         <div
           part="list"
           id=${this.listId}

package/dist/components/layout/command-palette/command-palette.styles.js

@@ -1 +1 @@
-import{iconHitTarget,focusRing}from"../../../internal/interactive-control.styles.js";import{css}from"lit";import{overlaySurface}from"../../../internal/overlay-surface.styles.js";const styles=css` :host { display: contents; --_lr-command-palette-z-index: var( --lr-overlay-stack-index, var(--lr-layer-modal) ); --_lr-command-palette-max-inline-size: var(--lr-size-48rem); --_lr-command-palette-max-block-size: 70vh; --_lr-command-palette-list-max-block-size: 50vh; --_lr-command-palette-offset-block-start: 12vh; --_lr-command-palette-row-height: var(--lr-size-3rem); --_lr-command-palette-group-height: var(--lr-size-2rem); } [part="backdrop"] { position: fixed; inset: 0; z-index: var( --lr-command-palette-z-index, var(--_lr-command-palette-z-index) ); display: grid; place-items: start center; padding-block-start: var( --lr-command-palette-offset-block-start, var(--_lr-command-palette-offset-block-start) ); background: var(--lr-color-overlay); } [part="dialog"] { inline-size: min( var( --lr-command-palette-max-inline-size, var(--_lr-command-palette-max-inline-size) ), calc(100vw - 2 * var(--lr-space-l)) ); min-inline-size: 0; max-block-size: var( --lr-command-palette-max-block-size, var(--_lr-command-palette-max-block-size) ); overflow: hidden; --_lr-overlay-surface: var(--lr-color-surface-container-highest); ${overlaySurface} box-shadow: var(--lr-overlay-shadow-modal, var(--lr-shadow-xl)); color: var(--lr-color-text); } [part="search"] { display: flex; align-items: center; min-inline-size: 0; gap: var(--lr-command-palette-search-gap, var(--lr-space-s)); padding: var(--lr-command-palette-search-padding, var(--lr-space-m)); border-block-end: var(--lr-border-width-thin) solid var(--lr-color-border); } [part="input"] { flex: 1; min-inline-size: 0; min-block-size: var(--lr-command-palette-search-min-height, auto); border: 0; outline: 0; background: transparent; color: inherit; font: inherit; font-size: var(--lr-command-palette-search-font-size, inherit); } [part="input"]:focus-visible { ${focusRing} border-radius: var(--lr-radius-xs); } [part="input"]::placeholder { color: var(--lr-color-text-quiet); opacity: 1; } [part="input"]::-webkit-search-cancel-button, [part="input"]::-webkit-search-decoration { -webkit-appearance: none; appearance: none; display: none; } [part="clear-button"] { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; ${iconHitTarget} border: 0; border-radius: var(--lr-radius-xs); background: transparent; cursor: pointer; color: var(--lr-color-text-quiet); padding: var(--lr-space-xs); font: inherit; transition: background-color var(--lr-transition-fast), color var(--lr-transition-fast); } [part="clear-button"]:hover { color: var(--lr-color-text); } [part="clear-button"]:active { color: var(--lr-color-text); background: color-mix( in oklab, var(--lr-color-surface), var(--lr-color-mix-partner) var(--lr-color-mix-active) ); } [part="clear-button"]:focus-visible { outline: var(--lr-focus-ring-width) solid var(--lr-focus-ring-color); outline-offset: calc(-1 * var(--lr-focus-ring-width)); } [part="list"] { position: relative; max-block-size: var( --lr-command-palette-list-max-block-size, var(--_lr-command-palette-list-max-block-size) ); overflow-x: hidden; overflow-y: auto; padding: var(--lr-space-xs); } [part="list-spacer"] { position: relative; min-inline-size: 0; } [part="command-group"] { display: contents; } [part="group"] { position: absolute; inset-inline: 0; block-size: var( --lr-command-palette-group-height, var(--_lr-command-palette-group-height) ); box-sizing: border-box; overflow: hidden; padding: var(--lr-space-xs) var(--lr-space-s); color: var(--lr-color-text-quiet); font-size: var(--lr-font-size-sm); font-weight: var(--lr-font-weight-semibold); text-overflow: ellipsis; white-space: nowrap; } [part="command"] { position: absolute; inset-inline: 0; display: flex; align-items: center; min-inline-size: 0; block-size: var( --lr-command-palette-row-height, var(--_lr-command-palette-row-height) ); box-sizing: border-box; gap: var(--lr-space-s); inline-size: 100%; overflow: hidden; padding: var(--lr-space-s); border: 0; border-radius: var(--lr-radius); background: transparent; color: inherit; font: inherit; text-align: start; cursor: pointer; transition: background-color var(--lr-transition-fast); } :where([part="command"]):hover:where(:not(:disabled)) { background: var( --lr-command-palette-active-bg, var(--lr-color-brand-quiet) ); } :where([part="command"]):active:where(:not(:disabled)) { background: color-mix( in oklab, var(--lr-command-palette-active-bg, var(--lr-color-brand-quiet)), var(--lr-color-mix-partner) var(--lr-color-mix-active) ); } [part="command"][data-active="true"] { background: var( --lr-command-palette-active-bg, var(--lr-color-brand-quiet) ); } [part="command"][data-active="true"]:active:where(:not(:disabled)) { background: color-mix( in oklab, var(--lr-command-palette-active-bg, var(--lr-color-brand-quiet)), var(--lr-color-mix-partner) var(--lr-color-mix-active) ); } [part="command"]:disabled { opacity: var(--lr-opacity-disabled); cursor: not-allowed; } [part="icon"] { display: inline-flex; align-items: center; flex: none; block-size: var(--lr-size-1em); max-inline-size: var(--lr-size-1-25rem); } [part="label"], [part="description"], [part="shortcut"] { min-inline-size: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } [part="label"] { flex: 0 1000 auto; } [part="description"] { flex: 1 1000 auto; color: inherit; font-size: var(--lr-font-size-sm); } [part="shortcut"] { flex: 0 1 auto; max-inline-size: 40%; color: inherit; font-family: var(--lr-font-mono); font-size: var(--lr-font-size-sm); } [part="empty"] { padding: var(--lr-space-l); color: var(--lr-color-text-quiet); text-align: center; } @media (forced-colors: active) { [part="command"][data-active="true"] { outline: var(--lr-border-width-medium) solid currentColor; outline-offset: calc(-1 * var(--lr-border-width-medium)); font-weight: var(--lr-font-weight-semibold); } } `;export{styles};
+import{iconHitTarget,focusRing}from"../../../internal/interactive-control.styles.js";import{css}from"lit";import{overlaySurface}from"../../../internal/overlay-surface.styles.js";const styles=css` :host { display: contents; --_lr-command-palette-z-index: var( --lr-overlay-stack-index, var(--lr-layer-modal) ); --_lr-command-palette-max-inline-size: var(--lr-size-48rem); --_lr-command-palette-max-block-size: 70vh; --_lr-command-palette-list-max-block-size: 50vh; --_lr-command-palette-offset-block-start: 12vh; --_lr-command-palette-row-height: var(--lr-size-3rem); --_lr-command-palette-group-height: var(--lr-size-2rem); } [part="backdrop"] { position: fixed; inset: 0; z-index: var( --lr-command-palette-z-index, var(--_lr-command-palette-z-index) ); display: grid; place-items: start center; padding-block-start: var( --lr-command-palette-offset-block-start, var(--_lr-command-palette-offset-block-start) ); background: var(--lr-color-overlay); } [part="dialog"] { inline-size: min( var( --lr-command-palette-max-inline-size, var(--_lr-command-palette-max-inline-size) ), calc(100vw - 2 * var(--lr-space-l)) ); min-inline-size: 0; max-block-size: var( --lr-command-palette-max-block-size, var(--_lr-command-palette-max-block-size) ); overflow: hidden; --_lr-overlay-surface: var(--lr-color-surface-container-highest); ${overlaySurface} box-shadow: var(--lr-overlay-shadow-modal, var(--lr-shadow-xl)); color: var(--lr-color-text); } [part="search"] { display: flex; align-items: center; min-inline-size: 0; gap: var(--lr-command-palette-search-gap, var(--lr-space-s)); padding: var(--lr-command-palette-search-padding, var(--lr-space-m)); border-block-end: var(--lr-border-width-thin) solid var(--lr-color-border); } [part="input"] { flex: 1; min-inline-size: 0; min-block-size: var(--lr-command-palette-search-min-height, auto); border: 0; outline: 0; background: transparent; color: inherit; font: inherit; font-size: var(--lr-command-palette-search-font-size, inherit); } [part="input"]:focus-visible { ${focusRing} border-radius: var(--lr-radius-xs); } [part="input"]::placeholder { color: var(--lr-color-text-quiet); opacity: 1; } [part="input"]::-webkit-search-cancel-button, [part="input"]::-webkit-search-decoration { -webkit-appearance: none; appearance: none; display: none; } [part="clear-button"] { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; ${iconHitTarget} border: 0; border-radius: var(--lr-radius-xs); background: transparent; cursor: pointer; color: var(--lr-color-text-quiet); padding: var(--lr-space-xs); font: inherit; transition: background-color var(--lr-transition-fast), color var(--lr-transition-fast); } [part="clear-button"]:hover { color: var(--lr-color-text); } [part="clear-button"]:active { color: var(--lr-color-text); background: color-mix( in oklab, var(--lr-color-surface), var(--lr-color-mix-partner) var(--lr-color-mix-active) ); } [part="clear-button"]:focus-visible { outline: var(--lr-focus-ring-width) solid var(--lr-focus-ring-color); outline-offset: calc(-1 * var(--lr-focus-ring-width)); } [part="list"] { position: relative; max-block-size: var( --lr-command-palette-list-max-block-size, var(--_lr-command-palette-list-max-block-size) ); overflow-x: hidden; overflow-y: auto; padding: var(--lr-space-xs); } [part="list-spacer"] { position: relative; min-inline-size: 0; } [part="command-group"] { display: contents; } [part="group"] { position: absolute; inset-inline: 0; block-size: var( --lr-command-palette-group-height, var(--_lr-command-palette-group-height) ); box-sizing: border-box; overflow: hidden; padding: var(--lr-space-xs) var(--lr-space-s); color: var(--lr-color-text-quiet); font-size: var(--lr-font-size-sm); font-weight: var(--lr-font-weight-semibold); text-overflow: ellipsis; white-space: nowrap; } [part="command"] { position: absolute; inset-inline: 0; display: flex; align-items: center; min-inline-size: 0; block-size: var( --lr-command-palette-row-height, var(--_lr-command-palette-row-height) ); box-sizing: border-box; gap: var(--lr-space-s); inline-size: 100%; overflow: hidden; padding: var(--lr-space-s); border: 0; border-radius: var(--lr-radius); background: transparent; color: inherit; font: inherit; text-align: start; cursor: pointer; transition: background-color var(--lr-transition-fast); } :where([part="command"]):hover:where(:not(:disabled)) { background: var( --lr-command-palette-active-bg, var(--lr-color-brand-quiet) ); } :where([part="command"]):active:where(:not(:disabled)) { background: color-mix( in oklab, var(--lr-command-palette-active-bg, var(--lr-color-brand-quiet)), var(--lr-color-mix-partner) var(--lr-color-mix-active) ); } [part="command"][data-active="true"] { background: var( --lr-command-palette-active-bg, var(--lr-color-brand-quiet) ); } [part="command"][data-active="true"]:active:where(:not(:disabled)) { background: color-mix( in oklab, var(--lr-command-palette-active-bg, var(--lr-color-brand-quiet)), var(--lr-color-mix-partner) var(--lr-color-mix-active) ); } [part="command"]:disabled { opacity: var(--lr-opacity-disabled); cursor: not-allowed; } [part="icon"] { display: inline-flex; align-items: center; flex: none; block-size: var(--lr-size-1em); max-inline-size: var(--lr-size-1-25rem); } [part="label"], [part="description"], [part="shortcut"] { min-inline-size: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } [part="label"] { flex: 0 1000 auto; } [part="description"] { flex: 1 1000 auto; color: inherit; font-size: var(--lr-font-size-sm); } [part="shortcut"] { flex: 0 1 auto; max-inline-size: 40%; color: inherit; font-family: var(--lr-font-mono); font-size: var(--lr-font-size-sm); } [part="empty"] { padding: var(--lr-space-l); color: var(--lr-color-text-quiet); text-align: center; } @media (forced-colors: active) { [part="command"][data-active="true"] { outline: var(--lr-border-width-medium) solid currentColor; outline-offset: calc(-1 * var(--lr-border-width-medium)); font-weight: var(--lr-font-weight-semibold); } } [part='limit'] { margin: 0; padding: var(--lr-space-xs) var(--lr-space-s); color: var(--lr-color-text-quiet); font-size: var(--lr-font-size-sm); overflow-wrap: anywhere; } `;export{styles};

package/dist/components/layout/menu/menu-item.class.d.ts

@@ -224,13 +224,13 @@ rel?:string;
 /** Native anchor `download` attribute, used only while `href` resolves to a link. Narrows the
 *  safe-URL allowlist to `safeDownloadHref`'s, which drops `mailto:` — a mail handoff names no
 *  retrievable bytes, so it cannot be a download target. */
-download?:string;private get resolvedRel();private get resolvedHref();private hasIconSlot;private hasDetailsSlot;private hasSuffixSlot;private detailsSlot?;private submenuAssigned;private submenuExpanded;private submenuKind;private slottedLabel;private submenuPanel;private submenuPanelAttached;private submenuPanelGeneration;private nativeStateObserver?;private readonly labelTextObserver;private labelObservationGeneration;private announcedNativeState;private owningMenu;private readonly ownedName;private panelName;
+download?:string;private get resolvedRel();private get resolvedHref();private hasIconSlot;private hasDetailsSlot;private hasSuffixSlot;private detailsSlot?;private submenuAssigned;private submenuExpanded;private submenuKind;private slottedLabel;private submenuPanel;private submenuPanelAttached;private submenuPanelGeneration;private nativeStateObserver?;private readonly labelTextObserver;private labelObservationGeneration;private announcedNativeState;private owningMenu;private readonly ownedName;private writingComputedName;private panelName;
 /** Whether a nested `<lr-menu>` or direct mapped items are assigned to this item's `submenu`
 * slot, making it a submenu parent. */
 get hasSubmenu():boolean;
 /** Whether this item's submenu is currently open. Tracks the panel's own state, however it
 *  changed — the parent menu's keyboard/pointer handling, a dismissal, or a direct write. */
-get submenuOpen():boolean;set submenuOpen(next:boolean);constructor();connectedCallback():void;disconnectedCallback():void;adoptedCallback():void;private nativeStateSignature;private onNativeStateMutation;private emitStateChange;protected willUpdate(changed:PropertyValues):void;
+get submenuOpen():boolean;set submenuOpen(next:boolean);constructor();connectedCallback():void;attributeChangedCallback(name:string,oldValue:string|null,value:string|null):void;disconnectedCallback():void;adoptedCallback():void;private nativeStateSignature;private onNativeStateMutation;private emitStateChange;protected willUpdate(changed:PropertyValues):void;
 /** Activates the visual row, matching a consumer click on this focusable host. This preserves the
 *  row's native click event path and its normal, checkbox, radio, and submenu branches. Disabled
 *  and loading items remain inert. */