@aceshooting/lyra-ui 25.1.0 → 25.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +28 -0
- package/custom-elements.json +1 -1
- package/dist/components/data/table/table.class.d.ts +2 -2
- package/dist/components/data/table/table.class.js +1 -1
- package/dist/components/forms/combobox/combobox.class.d.ts +1 -1
- package/dist/components/forms/combobox/combobox.class.js +8 -3
- package/dist/components/forms/locale-picker/locale-picker.styles.js +1 -1
- package/dist/components/layout/card/card.class.d.ts +1 -1
- package/dist/components/layout/card/card.class.js +1 -1
- package/dist/components/media/map/map.class.d.ts +9 -1
- package/dist/components/media/map/map.class.js +2 -2
- package/dist/components/overlays/overlay/popover.class.d.ts +14 -2
- package/dist/components/overlays/overlay/popover.class.js +2 -2
- package/dist/components/utility/json-viewer/json-viewer.class.js +1 -1
- package/dist/framework-types.d.ts +1 -1
- package/dist/internal/package-metadata.d.ts +1 -1
- package/dist/internal/package-metadata.js +1 -1
- package/llms/components/lr-combobox.md +4 -2
- package/llms/components/lr-locale-picker.md +12 -2
- package/llms/components/lr-map.md +17 -3
- package/llms/components/lr-popover.md +10 -0
- package/llms/components/lr-table.md +2 -1
- package/llms/shared/imports-and-registration.md +3 -1
- package/llms/shared/localization-and-rtl.md +7 -2
- package/llms/shared/styles-and-tokens.md +5 -2
- package/llms/shared.md +15 -5
- package/package.json +1 -1
- package/web-types.json +1 -1
|
@@ -507,8 +507,8 @@ export interface LyraTableEventMap<T=unknown,K extends string|number=string|numb
|
|
|
507
507
|
* @csspart sort-icon-active - The active direction chevron; also carries sort-icon.
|
|
508
508
|
* @csspart sort-icon-inactive - The muted bidirectional indicator when sortIndicators is all; also carries sort-icon.
|
|
509
509
|
* @csspart reveal-columns-button - The button that toggles `priority`-hidden columns back into view.
|
|
510
|
-
* @csspart expand-toggle-cell - Each row's
|
|
511
|
-
*
|
|
510
|
+
* @csspart expand-toggle-cell - Each body row's leading chevron-toggle cell, rendered only
|
|
511
|
+
* when `expandedContent` is set. Its column header uses `header-cell` and a localized name.
|
|
512
512
|
* @csspart row-expand-toggle - The `<button>` inside `expand-toggle-cell`,
|
|
513
513
|
* absent for a row that fails `canExpand`; it inherits the table's typography.
|
|
514
514
|
* @csspart row-expand-icon - The 1em chevron icon inside `row-expand-toggle`.
|
|
@@ -113,7 +113,7 @@ import{__decorate}from"tslib";import{html,nothing}from"lit";import{property,stat
|
|
|
113
113
|
</colgroup>
|
|
114
114
|
<thead part="head">
|
|
115
115
|
<tr role="row">
|
|
116
|
-
${hasExpand?html`<th part="header-cell" data-row-expand-toggle
|
|
116
|
+
${hasExpand?html`<th part="header-cell" data-row-expand-toggle scope="col"><span class="sr-only">${this.localize("details")}</span></th>`:nothing}
|
|
117
117
|
${this.columns.map(col=>{const active=!!col.sortable&&this.sortKey===col.key,ariaSort=active?this.sortDir==="asc"?"ascending":"descending":"none",headerAriaLabel=col.ariaLabel??(typeof col.label=="string"&&col.label.trim().length===0?col.key:void 0);return html`<th
|
|
118
118
|
part="header-cell"
|
|
119
119
|
role="columnheader"
|
|
@@ -859,6 +859,6 @@ refresh():void;private runSource;
|
|
|
859
859
|
* result from overwriting a newer one: it is re-checked here and again in every continuation
|
|
860
860
|
* below, because each `await` is another chance for a newer query, a re-parent, or a disconnect
|
|
861
861
|
* to have superseded this request while it was in flight. */
|
|
862
|
-
private runSourceRequest;private clearSourceTimer;private onInputBlur;private onInputFocus;private onKeyDown;private onComboMouseDown;private onListboxMouseDown;private onListboxClick;private renderRows;
|
|
862
|
+
private runSourceRequest;private clearSourceTimer;private onInputBlur;private onComboFocusOut;private onInputFocus;private onKeyDown;private onComboMouseDown;private onListboxMouseDown;private onListboxClick;private renderRows;
|
|
863
863
|
/** One built-in selected chip, or the consumer's safe Lit/DOM/text replacement. */
|
|
864
864
|
private renderTag;private statusText;render():TemplateResult;}declare global{interface HTMLElementTagNameMap{'lr-combobox':LyraCombobox;}}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{__decorate}from"tslib";import{GlassScrollLayer}from"../../../internal/glass-scroll-layer.js";import{collectionSupport}from"../../../internal/collection-snapshot.js";import{acquireNativeControlDescription}from"../../../internal/native-control-description.js";import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{styleMap}from"lit/directives/style-map.js";import{LyraElement}from"../../../internal/lyra-element.js";import{installFormControlLabelSupport}from"../../../internal/form-control-labels.js";installFormControlLabelSupport();import{loadAnchoredOverlayRuntime,syncTopLayerRelease,topLayerPlacement}from"../../../internal/anchored-overlay-runtime.js";import{hostAriaLabel,nextId}from"../../../internal/a11y.js";import{chevronIcon,closeIcon}from"../../../internal/icons.js";import{AnchoredValidityController,VALIDITY_ANCHOR}from"../../../internal/anchored-validity.js";import{setCustomState,syncValidityStates}from"../../../internal/custom-states.js";import{submitOnEnter}from"../../../internal/submit-on-enter.js";import{finiteCount,finiteDuration}from"../../../internal/numbers.js";import{DebounceController}from"../../../internal/debounce-controller.js";import{sizes}from"../../../internal/sizes.styles.js";import{styles}from"./combobox.styles.js";import"./option.class.js";import{autocorrectConverter,literalSetConverter,omittedEmptyStringConverter,optionalLiteralSetConverter,spellcheckConverter}from"../../../internal/converters.js";import{resolveEffectivePositioningStrategy}from"../../../internal/positioning-strategy.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{sanitizeCssColor}from"../../../internal/safe-css.js";import{attachInternalsSafely,getFormOwner,installCustomErrorProperty,isBarredFromValidation,setFormOwner}from"../../../internal/form-associated.js";import{installInteractionOnInvalid,installInvalidEventAlias,withStaticValidityCheck}from"../../../internal/invalid-event-alias.js";import{tag}from"../../../internal/prefix.js";import{renderInertPresentation}from"../../../internal/inert-presentation.js";import{collectInitialSlotAssignment}from"../../../internal/initial-slot-collection.js";import{renderDataState}from"../../../internal/data-state-renderer.js";import{SlotPresenceController}from"../../../internal/slot-presence-controller.js";import{acquireAnnouncementSink}from"../../../internal/announcer.js";import{activateNonmodalOverlay}from"../../../internal/nonmodal-overlay-manager.js";import{isOptionSelectedDirty,isOptionSelectedWrite,wasOptionInitiallySelected,RESET_OPTION_SELECTED_FROM_OWNER,SET_OPTION_SELECTED_FROM_OWNER}from"../../../internal/option-selection.js";import{isHtmlElement}from"../../../internal/dom-guards.js";import{relayNativeEvent}from"../../../internal/native-event-relay.js";import{LYRA_DEFAULT_clear,LYRA_DEFAULT_collapse,LYRA_DEFAULT_comboboxCreate,LYRA_DEFAULT_comboboxLabel,LYRA_DEFAULT_comboboxLoadError,LYRA_DEFAULT_comboboxOverflow,LYRA_DEFAULT_comboboxRequired,LYRA_DEFAULT_comboboxSelectedOverflow,LYRA_DEFAULT_date,LYRA_DEFAULT_details,LYRA_DEFAULT_fieldRequired,LYRA_DEFAULT_loading,LYRA_DEFAULT_map,LYRA_DEFAULT_navigation,LYRA_DEFAULT_noData,LYRA_DEFAULT_noMatches,LYRA_DEFAULT_notInCatalog,LYRA_DEFAULT_open,LYRA_DEFAULT_progress,LYRA_DEFAULT_removeWithContext,LYRA_DEFAULT_restore,LYRA_DEFAULT_retry,LYRA_DEFAULT_search,LYRA_DEFAULT_select,LYRA_DEFAULT_tableLoadFailed,LYRA_DEFAULT_valueInvalid}from"../../../internal/default-strings.generated.js";function isLyraOptionElement(value){return isHtmlElement(value)&&value.localName===tag("option")}function normalizeSelectionValues(next){return Array.isArray(next)?next.filter(value=>typeof value=="string"):typeof next=="string"?[next]:[]}const POSITIONING_STRATEGY=optionalLiteralSetConverter(["absolute","fixed"]),APPEARANCE=literalSetConverter(["accent","filled","outlined","filled-outlined","plain"],"outlined"),VALIDITY_FLAG_KEYS=new Set(["badInput","customError","patternMismatch","rangeOverflow","rangeUnderflow","stepMismatch","tooLong","tooShort","typeMismatch","valueMissing"]),comboboxSpellcheckConverter={...spellcheckConverter,fromAttribute:(value,type)=>value===null?void 0:spellcheckConverter.fromAttribute?.(value,type)};function adornmentContent(value){return typeof value=="string"||typeof value=="number"?html`<span>${value}</span>`:value}function isValidityFlagKey(value){return typeof value=="string"&&VALIDITY_FLAG_KEYS.has(value)}const MAX_SOURCE_ROWS=2e3,MAX_SOURCE_TEXT_UNITS=25e4,MAX_SOURCE_FIELD_UNITS=4096,MAX_RENDER_ROWS=1e3;function normalizeSourceResult(input){let candidateRows,candidateTotal;try{Array.isArray(input)?candidateRows=input:typeof input=="object"&&input!==null&&(candidateRows=input.rows,candidateTotal=input.total)}catch{throw new TypeError("Invalid combobox source result")}if(!Array.isArray(candidateRows))throw new TypeError("Invalid combobox source result");const providerTotal=typeof candidateTotal=="number"&&Number.isFinite(candidateTotal)&&candidateTotal>=0?Math.trunc(candidateTotal):candidateRows.length,rows=[];let textUnits=0;const limit=Math.min(candidateRows.length,MAX_SOURCE_ROWS);for(let index=0;index<limit;index++)try{const value=candidateRows[index]?.value,label=candidateRows[index]?.label;if(typeof value!="string"||typeof label!="string"||value.length>MAX_SOURCE_FIELD_UNITS||label.length>MAX_SOURCE_FIELD_UNITS)continue;const source=candidateRows[index],optionalText=key=>{const candidate=source[key];return typeof candidate=="string"&&candidate.length<=MAX_SOURCE_FIELD_UNITS?candidate:void 0},sub=optionalText("sub"),accessibleLabel=optionalText("accessibleLabel"),dotColor=optionalText("dotColor"),group=optionalText("group"),badgeCandidate=source.badge,badge=typeof badgeCandidate=="string"&&badgeCandidate.length<=MAX_SOURCE_FIELD_UNITS||typeof badgeCandidate=="number"&&Number.isFinite(badgeCandidate)?badgeCandidate:void 0,units=value.length+label.length+(sub?.length??0)+(accessibleLabel?.length??0)+(dotColor?.length??0)+(group?.length??0)+(typeof badge=="string"?badge.length:0);if(textUnits+units>MAX_SOURCE_TEXT_UNITS)break;textUnits+=units,rows.push({value,label,...sub===void 0?{}:{sub},...source.icon===void 0?{}:{icon:source.icon},...source.start===void 0?{}:{start:source.start},...source.end===void 0?{}:{end:source.end},...badge===void 0?{}:{badge},...accessibleLabel===void 0?{}:{accessibleLabel},...source.data===void 0?{}:{data:source.data},...dotColor===void 0?{}:{dotColor},...group===void 0?{}:{group},...typeof source.disabled=="boolean"?{disabled:source.disabled}:{}})}catch{}const total=Math.max(providerTotal,candidateRows.length);return{rows,total,truncated:total>rows.length}}class LyraCombobox extends LyraElement{static{this.defaultStrings={...super.defaultStrings,clear:LYRA_DEFAULT_clear,collapse:LYRA_DEFAULT_collapse,comboboxCreate:LYRA_DEFAULT_comboboxCreate,comboboxLabel:LYRA_DEFAULT_comboboxLabel,comboboxLoadError:LYRA_DEFAULT_comboboxLoadError,comboboxOverflow:LYRA_DEFAULT_comboboxOverflow,comboboxRequired:LYRA_DEFAULT_comboboxRequired,comboboxSelectedOverflow:LYRA_DEFAULT_comboboxSelectedOverflow,date:LYRA_DEFAULT_date,details:LYRA_DEFAULT_details,fieldRequired:LYRA_DEFAULT_fieldRequired,loading:LYRA_DEFAULT_loading,map:LYRA_DEFAULT_map,navigation:LYRA_DEFAULT_navigation,noData:LYRA_DEFAULT_noData,noMatches:LYRA_DEFAULT_noMatches,notInCatalog:LYRA_DEFAULT_notInCatalog,open:LYRA_DEFAULT_open,progress:LYRA_DEFAULT_progress,removeWithContext:LYRA_DEFAULT_removeWithContext,restore:LYRA_DEFAULT_restore,retry:LYRA_DEFAULT_retry,search:LYRA_DEFAULT_search,select:LYRA_DEFAULT_select,tableLoadFailed:LYRA_DEFAULT_tableLoadFailed,valueInvalid:LYRA_DEFAULT_valueInvalid}}static{this.collectionSupport=collectionSupport}static{this.immutableEventDetails=Object.freeze(["lr-change","input","change"])}static{this.identityEventDetailCollectionItems=Object.freeze({"lr-change":Object.freeze(["data"]),input:Object.freeze(["data"]),change:Object.freeze(["data"])})}static{this.formAssociated=!0}static{this.styles=[LyraElement.styles,sizes,styles]}static{this.properties={customError:{attribute:"custom-error",reflect:!0,noAccessor:!0},multiple:{type:Boolean,reflect:!0,noAccessor:!0},disabled:{type:Boolean,reflect:!0,noAccessor:!0},required:{type:Boolean,reflect:!0,noAccessor:!0},readonly:{type:Boolean,reflect:!0,noAccessor:!0},value:{noAccessor:!0},name:{reflect:!0,noAccessor:!0,converter:omittedEmptyStringConverter},maxOptionsVisible:{type:Number,attribute:"max-options-visible",noAccessor:!0},maxRender:{type:Number,attribute:"max-render",noAccessor:!0},sourceDelay:{type:Number,attribute:"source-delay",noAccessor:!0}}}get open(){return this._open}set open(next){const old=this._open,liveDisabled=this.effectiveDisabled||typeof this.matches=="function"&&this.matches(":disabled");if(this._open=!!next&&!this.readonly&&!liveDisabled,this._open===old){next&&!this._open&&this.hasAttribute("open")&&this.removeAttribute("open");return}this.requestUpdate("open",old)}get appearance(){return this._appearance}set appearance(next){const normalized=APPEARANCE.normalizeReflected(this,"appearance",next),old=this._appearance;this._appearance=normalized,normalized!==old&&this.requestUpdate("appearance",old)}get positioningStrategy(){return this._positioningStrategy??"fixed"}set positioningStrategy(next){const normalized=POSITIONING_STRATEGY.normalize(next)??"fixed",old=this.positioningStrategy;this._positioningStrategy=normalized,normalized!==old&&this.requestUpdate("positioningStrategy",old)}get autocorrect(){return this.autocorrectValue}set autocorrect(next){this.autocorrectValue=!!next,this.requestUpdate()}get inputmode(){return this.inputMode}set inputmode(next){this.inputMode=next??""}get enterkeyhint(){return this.enterKeyHint}set enterkeyhint(next){this.enterKeyHint=next??""}get inputValue(){return this.query}set inputValue(next){this.explicitInputValue=!0,this.query=next??"",this.activeIndex=-1,this.source&&this.runSource(this.query),this.requestUpdate()}constructor(){super(),this.placeholder="",this.label="",this.hint="",this.errorText="",this.allowCreate=!1,this.allowCustomValue=!1,this.withUnknownOption=!1,this.loading=!1,this._appearance="outlined",this.placement="bottom",this.topLayer=!1,this.size="m",this.pill=!1,this.clearable=!1,this.withClear=!1,this.withLabel=!1,this.withHint=!1,this.validators=[],this.autocomplete="off",this.inputMode="",this.enterKeyHint="",this.spellcheck=!1,this.autocapitalize="",this.autocorrectValue=!0,this.filter=null,this.source=null,this.query="",this.explicitInputValue=!1,this.activeIndex=-1,this.options=[],this.touched=!1,this.validityRevision=0,this.slotPresence=new SlotPresenceController(this),this.sourceLoading=!1,this.sourceFailed=!1,this.sourceEverSettled=!1,this.asyncRows=[],this._sourceTotal=0,this._sourceTruncated=!1,this.sourceDebounce=new DebounceController(0,request=>this.runSourceRequest(request),()=>this.ownerDocument.defaultView),this.sourceToken=0,this.refreshQueued=!1,this._sourceWarmed=!1,this._selectedLabelCache=new Map,this._selectedRowCache=new Map,this._rowsByValue=new Map,this._open=!1,this._fieldsetDisabled=!1,this.listId=nextId("combobox-list"),this.inputId=nextId("combobox-input"),this.listboxPositioned=!1,this.positioningGeneration=0,this.positioningReady=Promise.resolve(!1),this.restoreFocusOnClose=!0,this.restoringOverlayFocus=!1,this.listboxHidden=!0,this._isFirstUpdate=!0,this.openVetoed=!1,this.closeAfterPositioningFailure=!1,this.closeCleanupPending=!1,this.transitionToken=0,this.transitionWaiters=new Map,this._selected=[],this.sourceOptionsByRow=new WeakMap,this._valueDirty=!1,this._multiple=!1,this._disabled=!1,this._required=!1,this._readonly=!1,this._defaultSelected=[],this._defaultCaptured=!1,this._restoredStateActive=!1,this._name="",this._maxOptionsVisible=3,this._maxRender=200,this._sourceDelay=200,this.localDescriptionIds="",this.markInteracted=()=>{this.touched||(this.touched=!0,this.updateValidity(),this.syncCustomStates())},this.collectOptions=e=>{this.collectOptionsFromSlot(e.target)},this.optionRefreshPending=!1,this.onOptionChange=e=>{e.stopPropagation();const option=e.composedPath().find(isLyraOptionElement);if(isLyraOptionElement(option)&&this.options.includes(option)&&isOptionSelectedWrite(e)){if(this.multiple){const next=option.selected?this._selected.includes(option.value)?this._selected:[...this._selected,option.value]:this._selected.filter(value=>value!==option.value);this.assignValue(next)}else{if(this._valueDirty=!0,this._restoredStateActive=!1,!option.selected&&this.singleSelectedOption!==option)return;this.setValue(option.selected?option.value:[],!0,option.selected?option:void 0)}return}isLyraOptionElement(option)&&this.adornmentClones.get(option)?.markup!==this.adornmentMarkup(option)&&this.adornmentClones.delete(option),!this.optionRefreshPending&&(this.optionRefreshPending=!0,queueMicrotask(()=>{this.optionRefreshPending=!1,this.refreshOptionDefaults(),this.reflectSelected(),this.options=[...this.options],this.normalizeActiveIndex()}))},this.adornmentClones=new WeakMap,this.onDocPointer=e=>{if(!e.composedPath().includes(this)){if(this.overlayHandle?.isActive()){this.overlayHandle.dismissBackdrop();return}this.restoreFocusOnClose=!1,this.hide()}},this.onInput=e=>{this.liveDisabled||this.readonly||(this.explicitInputValue=!1,this.query=e.target.value,this.activeIndex=-1,this.show(),this.source&&this.runSource(this.query),this.emit("lr-filter",{value:this.query}))},this.onInputBlur=event=>{this.liveDisabled||(this.touched=!0),this.syncCustomStates(),this.restoreFocusOnClose=!1,this.hide(),relayNativeEvent(this,event)},this.onInputFocus=event=>{if(this.liveDisabled){event.stopPropagation();return}this.restoringOverlayFocus||this.show(),relayNativeEvent(this,event)},this.onKeyDown=e=>{if(e.isComposing||e.keyCode===229||this.liveDisabled||this.readonly)return;const navigable=this.renderedRows.rows.filter(r=>!r.disabled);switch(e.key){case"ArrowDown":if(e.preventDefault(),!this.open){this.show();return}this.activeIndex=Math.min(navigable.length-1,this.activeIndex+1);break;case"ArrowUp":if(e.preventDefault(),!this.open){this.show();return}this.activeIndex=Math.max(0,this.activeIndex-1);break;case"Enter":{const activeRow=navigable[this.activeIndex];if(this.open&&this.activeIndex>=0&&activeRow){e.preventDefault(),this.pickRow(activeRow);break}const create=this.createRow;if(this.open&&create){e.preventDefault(),this.createOption(create.createInput);break}if(this.open&&this.allowCustomValue&&!this.multiple&&this.query.trim()){e.preventDefault(),this.commitCustomValue(this.query.trim());break}submitOnEnter(this,e);break}case"Escape":this.open&&(!this.overlayHandle?.isActive()||this.overlayHandle.isTopmost())&&(e.preventDefault(),this.hide());break;case"Home":this.open&&(e.preventDefault(),this.activeIndex=0);break;case"End":this.open&&(e.preventDefault(),this.activeIndex=navigable.length-1);break;case"Backspace":this.multiple&&!this.query&&this._selected.length&&this.removeValueAt(this._selected.length-1);break}},this.onComboMouseDown=e=>{this.liveDisabled||e.composedPath()[0]!==this.inputEl&&(e.target.closest("button")||(e.preventDefault(),this.inputEl?.focus(),this.show()))},this.onListboxMouseDown=e=>{e.preventDefault()},this.onListboxClick=e=>{const value=e.target.closest('[part="option"]')?.dataset.value;if(value===void 0)return;const row=this._rowsByValue.get(value);row&&this.pickRow(row)},new GlassScrollLayer(this,'[part="listbox"]',()=>this.open),this.internals=attachInternalsSafely(this),this.validityController=new AnchoredValidityController(this,this.internals,()=>this[VALIDITY_ANCHOR]()),installCustomErrorProperty(this,()=>this.validityController.customValidityMessage),installInvalidEventAlias(this,init=>this.emit("lr-invalid",null,init)),installInteractionOnInvalid(this,this.markInteracted)}get form(){return getFormOwner(this.internals)}set form(owner){setFormOwner(this,owner)}getForm(){return getFormOwner(this.internals)}get labels(){return this.internals.labels}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}get willValidate(){return this.internals.willValidate}get validationTarget(){return this.validationTargetOverride??this.inputEl??void 0}set validationTarget(next){this.validationTargetOverride=next??void 0,this.validityController.refreshAnchor()}resetValidity(){this.validityController.setCustomValidity(""),this.updateValidity()}get input(){return this.inputEl??null}get selectionStart(){return this.inputEl?.selectionStart??null}set selectionStart(value){this.inputEl&&(this.inputEl.selectionStart=value)}get selectionEnd(){return this.inputEl?.selectionEnd??null}set selectionEnd(value){this.inputEl&&(this.inputEl.selectionEnd=value)}get selectionDirection(){return this.inputEl?.selectionDirection}set selectionDirection(value){this.inputEl&&(this.inputEl.selectionDirection=value)}get liveDisabled(){return this.effectiveDisabled||this.matches(":disabled")}focus(options){this.liveDisabled||this.inputEl?.focus(options)}blur(){this.inputEl?.blur()}click(){this.liveDisabled||(this.inputEl?.focus(),this.show())}select(){this.inputEl?.select()}setSelectionRange(start,end,direction){this.inputEl?.setSelectionRange(start,end,direction)}setRangeText(replacement,start,end,selectMode){const input=this.inputEl;input&&(start===void 0||end===void 0?input.setRangeText(replacement):input.setRangeText(replacement,start,end,selectMode),this.explicitInputValue=!0,this.query=input.value,this.activeIndex=-1,this.source&&this.runSource(this.query))}[VALIDITY_ANCHOR](){return this.validationTarget}syncExternalDescription(){if(!this.isConnected)return;const target=this.renderRoot.querySelector('[part="combobox-input"]');target&&(this.externalDescriptionLease?this.externalDescriptionLease.update(target):this.externalDescriptionLease=acquireNativeControlDescription(this,target,()=>this.localDescriptionIds))}releaseExternalDescription(){this.externalDescriptionLease?.release(),this.externalDescriptionLease=void 0}connectedCallback(){super.connectedCallback(),this.hasUpdated&&this.syncExternalDescription(),this.syncSourceErrorAnnouncementSink(),this.updateValidity(),this.hasUpdated&&this.syncValidatorAttributeObserver(),this.hasUpdated&&queueMicrotask(()=>{this.open?this.reconnectOpenPopup():this.source&&this._selected.length&&this.asyncRows.length===0&&this.runSource("")})}adoptedCallback(){super.adoptedCallback(),this.releaseExternalDescription(),this.hasUpdated&&this.syncExternalDescription(),this.listboxPositioned=!1,this.invalidateListboxPositioning(),this.overlayHandle?.deactivate({restoreFocus:!1}),this.overlayHandle=void 0,this.unbindDocumentPointer(),this.clearSourceTimer(),this.sourceToken+=1,this.sourceAbort?.abort(),this.sourceAbort=void 0,this.releaseSourceErrorAnnouncementSink(),this.syncSourceErrorAnnouncementSink()}syncSourceErrorAnnouncementSink(){this.isConnected&&this.sourceErrorAnnouncementSink?.element.ownerDocument!==this.ownerDocument&&(this.releaseSourceErrorAnnouncementSink(),this.sourceErrorAnnouncementSink=acquireAnnouncementSink("assertive",{document:this.ownerDocument,source:this}))}releaseSourceErrorAnnouncementSink(){this.sourceErrorAnnouncementSink?.release(),this.sourceErrorAnnouncementSink=void 0}willUpdate(changed){super.willUpdate(changed),this._isFirstUpdate=!this.hasUpdated,this.announceOpenTransition(changed),this.open&&(this.listboxHidden=!1),changed.has("open")&&!this.openVetoed&&(this.listboxPositioned=!1),changed.has("open")&&this.openVetoed?this.closeCleanupPending=!1:changed.has("open")&&!this.open&&this.finalizeCloseState(),changed.has("source")&&(this.clearSourceTimer(),this.sourceAbort?.abort(),this.sourceAbort=void 0,this.sourceToken++,this.sourceLoading=!1,this.sourceFailed=!1,this.sourceEverSettled=!1,this.asyncRows=[],this._sourceTotal=0,this._sourceTruncated=!1,this.activeIndex=-1,this._sourceWarmed=!1,this.source&&this.open&&this.runSource(this.query)),!this._sourceWarmed&&this.source&&(this._selected.length>0||(this.pendingSelectedRowValues?.length??0)>0)&&this.asyncRows.length===0&&(this._sourceWarmed=!0,this.runSource(""))}firstUpdated(changed){super.firstUpdated(changed);const slot=this.optionsSlot;queueMicrotask(()=>{collectInitialSlotAssignment(slot,s=>{s.assignedElements({flatten:!0}).some(isLyraOptionElement)&&this.collectOptionsFromSlot(s)})})}get name(){return this._name}set name(next){const old=this._name;this._name=next??"",this._name?this.setAttribute("name",this._name):this.removeAttribute("name"),this.syncFormValue(),this.requestUpdate("name",old)}get multiple(){return this._multiple}set multiple(next){const old=this._multiple;this._multiple=!!next,this.toggleAttribute("multiple",this._multiple),this.reflectSelected(),this.syncFormValue(),this.requestUpdate("multiple",old)}get disabled(){return this._disabled}set disabled(next){const old=this._disabled;this._disabled=!!next,this.toggleAttribute("disabled",this._disabled),this._disabled&&this.hide(),this.updateValidity(),this.requestUpdate("disabled",old)}get required(){return this._required}set required(next){const old=this._required;this._required=!!next,this.toggleAttribute("required",this._required),this.updateValidity(),this.requestUpdate("required",old)}get readonly(){return this._readonly}set readonly(next){const old=this._readonly;this._readonly=!!next,this.toggleAttribute("readonly",this._readonly),this._readonly&&this.hide(),this.updateValidity(),this.requestUpdate("readonly",old)}get value(){return this.multiple?[...this._selected]:this._selected[0]??""}set value(next){this.setValue(next,!0)}setValue(next,dirty,preferred){const old=this._selected;this.singleSelectedOption=preferred,dirty&&(this._restoredStateActive=!1,this._valueDirty=!0),this._selected=normalizeSelectionValues(next);const selected=new Set(this._selected);for(const value of selected){const row=this.effectiveRows.find(candidate=>candidate.value===value)??this.asyncRows.find(candidate=>candidate.value===value);row&&this._selectedRowCache.set(value,row)}for(const value of this._selectedRowCache.keys())selected.has(value)||this._selectedRowCache.delete(value);for(const value of this._selectedLabelCache.keys())selected.has(value)||this._selectedLabelCache.delete(value);this.syncFormValue(),this.reflectSelected(),this.updateValidity(),this.requestUpdate("value",old)}get maxOptionsVisible(){return this._maxOptionsVisible}set maxOptionsVisible(next){const old=this._maxOptionsVisible;this._maxOptionsVisible=finiteCount(next,3),this.requestUpdate("maxOptionsVisible",old)}get maxRender(){return this._maxRender}get sourceDelay(){return this._sourceDelay}set sourceDelay(next){const old=this._sourceDelay;this._sourceDelay=finiteDuration(next,200),this.requestUpdate("sourceDelay",old)}set maxRender(next){const old=this._maxRender;this._maxRender=Math.min(finiteCount(next,200),MAX_RENDER_ROWS),this.requestUpdate("maxRender",old)}get sourceTotal(){return this._sourceTotal}get sourceTruncated(){return this._sourceTruncated}get selectedRows(){return this.resolveSelectedRowSlots().filter(row=>row!=null).map(row=>({...row}))}resolveSelectedRowSlots(){return this._selected.map(value=>this._selectedRowCache.get(value)??this.effectiveRows.find(row=>row.value===value)??this.asyncRows.find(row=>row.value===value))}set selectedRows(next){const values=[],seen=new Set;if(Array.isArray(next))for(const candidate of next){let value;try{value=candidate?.value}catch{continue}typeof value!="string"||seen.has(value)||(seen.add(value),values.push(value))}if(values.length>0&&this.selectionSourceRows.length===0){this.pendingSelectedRowValues=values,this.source&&this.isConnected&&(this._sourceWarmed=!0,this.runSource(""));return}this.pendingSelectedRowValues=void 0,this.applySelectedRowValues(values)}get barredFromValidation(){return isBarredFromValidation(this,this.internals)}validatorResult(){const self=this,current=self.value;for(const validator of Array.isArray(this.validators)?this.validators:[]){let result;try{if(typeof validator=="object"&&validator!==null&&"checkValidity"in validator){const checked=validator.checkValidity(this);if(checked?.isValid===!0)continue;const flags={};for(const key of Array.isArray(checked?.invalidKeys)?checked.invalidKeys:[])isValidityFlagKey(key)&&(flags[key]=!0);Object.values(flags).some(Boolean)||(flags.customError=!0);let message=typeof checked?.message=="string"?checked.message:"";return!message&&typeof validator.message=="string"&&(message=validator.message),!message&&typeof validator.message=="function"&&(message=validator.message(this)),{flags,message:message||this.localize("valueInvalid")}}result=typeof validator=="function"?validator(current,self):validator?.validate(current,self)}catch{return{flags:{customError:!0},message:this.localize("valueInvalid")}}if(!(result===void 0||result===!0)){if(typeof result=="string")return{flags:{customError:!0},message:result};if(result===!1)return{flags:{customError:!0},message:this.localize("valueInvalid")};if(result&&typeof result=="object"&&Object.values(result).some(Boolean))return{flags:result,message:this.localize("valueInvalid")}}}return{}}syncValidatorAttributeObserver(){this.disconnectValidatorAttributeObserver();const owner=this.ownerDocument.defaultView,MutationObserverCtor=owner?.MutationObserver;if(!this.isConnected||!owner||typeof MutationObserverCtor!="function")return;const attributes=new Set;for(const validator of Array.isArray(this.validators)?this.validators:[]){if(typeof validator!="object"||validator===null||!("checkValidity"in validator))continue;let observed;try{observed=validator.observedAttributes}catch{continue}if(Array.isArray(observed))for(const name of observed)typeof name=="string"&&name.length>0&&attributes.add(name)}if(attributes.size===0)return;const binding={},observer=new MutationObserverCtor(()=>{this.validatorAttributeObserver!==binding||!this.isConnected||this.ownerDocument.defaultView!==owner||(this.updateValidity(),this.validityRevision++)});binding.observer=observer,binding.owner=owner;try{observer.observe(this,{attributes:!0,attributeFilter:[...attributes]}),this.validatorAttributeObserver=binding}catch{observer.disconnect()}}disconnectValidatorAttributeObserver(){const binding=this.validatorAttributeObserver;this.validatorAttributeObserver=void 0,binding?.observer.disconnect()}updateValidity(){if(this.barredFromValidation){this.validityController.setValidity({}),this.syncCustomStates();return}const flags={};let message="";this.required&&this._selected.length===0&&(flags.valueMissing=!0,message=this.localize("comboboxRequired"));const configured=this.validatorResult();configured.flags&&Object.assign(flags,configured.flags),configured.message&&(message=configured.message),this.validityController.setValidity(flags,message),this.syncCustomStates()}syncCustomStates(){syncValidityStates(this.internals,{required:this.required,hasInteracted:this.touched,barred:this.barredFromValidation}),setCustomState(this.internals,"blank",this._selected.length===0),setCustomState(this.internals,"disabled",this.effectiveDisabled)}syncFormValue(){const state2=JSON.stringify(this._selected);if(this.multiple){if(!this.name){this.internals.setFormValue(null,state2);return}const fd=new FormData;for(const v of this._selected)fd.append(this.name,v);this.internals.setFormValue(fd,state2)}else this.internals.setFormValue(this._selected[0]??"",state2)}get effectiveDisabled(){return this.disabled||this._fieldsetDisabled}formResetCallback(){this.touched=!1,this._restoredStateActive=!1,this._valueDirty=!1;const resetValues=this._defaultSelected.length>0?this._defaultSelected:this.options.filter(option=>wasOptionInitiallySelected(option)).map(option=>option.value);this._defaultSelected.length===0&&resetValues.length>0&&(this._defaultSelected=[...resetValues]);const defaults=new Set(resetValues);for(const option of this.options)option[RESET_OPTION_SELECTED_FROM_OWNER](defaults.has(option.value));this.setValue(this.multiple?[...resetValues]:resetValues.slice(0,1),!1),this.query="",this.explicitInputValue=!1}formStateRestoreCallback(state2,reason){let selected=[];if(typeof state2=="string")try{const parsed=JSON.parse(state2);Array.isArray(parsed)&&parsed.every(value=>typeof value=="string")&&(selected=parsed)}catch{}this.assignValue(this.multiple?selected:selected.slice(0,1)),this._restoredStateActive=!0}formDisabledCallback(disabled){this._fieldsetDisabled=disabled,disabled&&this.hide(),this.updateValidity(),this.requestUpdate()}checkValidity(){return this.updateValidity(),withStaticValidityCheck(this,()=>this.internals.checkValidity())}reportValidity(){return this.touched=!0,this.updateValidity(),this.syncCustomStates(),this.internals.reportValidity()}setCustomValidity(message){this.validityController.setCustomValidity(message??""),this.syncCustomStates()}disconnectedCallback(){this.listboxHidden=!0,this.releaseExternalDescription(),this.transitionToken++,this.listboxPositioned=!1,this.releaseSourceErrorAnnouncementSink(),this.disconnectValidatorAttributeObserver(),super.disconnectedCallback(),this.invalidateListboxPositioning(),this.clearSourceTimer(),this.sourceToken+=1,this.sourceAbort?.abort(),this.sourceAbort=void 0,this.overlayHandle?.deactivate({restoreFocus:!1}),this.overlayHandle=void 0,this.unbindDocumentPointer(),this.resolveTransitionWaiters("lr-after-show"),this.resolveTransitionWaiters("lr-after-hide"),this.open=!1}collectOptionsFromSlot(slot){const previous=new Set(this.options);if(this.options=slot.assignedElements({flatten:!0}).filter(isLyraOptionElement),this.adornmentClones=new WeakMap,this.normalizeActiveIndex(),this.applyPendingSelectedRows(),this._defaultCaptured){const newDefaults=this.options.filter(option=>!previous.has(option)&&option.defaultSelected),newLive=this.options.filter(option=>!previous.has(option)&&option.selected&&!option.defaultSelected);this.refreshOptionDefaults();const eligible=[...!this._restoredStateActive&&!this._valueDirty?newDefaults:[],...this._restoredStateActive?[]:newLive];if(eligible.length){const values=eligible.map(option=>option.value),next=this.multiple?[...new Set([...this._selected,...values])]:values[values.length-1];newLive.length>0?this.assignValue(next):this.setValue(next,!1);return}}else{this._defaultCaptured=!0;const allDefaults=this.options.filter(option=>option.defaultSelected).map(option=>option.value),allLive=this.options.filter(option=>option.selected).map(option=>option.value),defaults=this.multiple?allDefaults:allDefaults.slice(0,1),live=this.multiple?allLive:allLive.slice(0,1),initialLive=this.options.filter(option=>wasOptionInitiallySelected(option)).map(option=>option.value),optionDirty=this.options.some(option=>isOptionSelectedDirty(option)),dirtyValues=this.options.filter(option=>isOptionSelectedDirty(option)&&option.selected).map(option=>option.value);this._defaultSelected=[...defaults.length>0?defaults:initialLive.length>0?initialLive:live];const fromDefaults=defaults.length>0,initial=optionDirty?this.multiple?allLive:dirtyValues.slice(-1)[0]?dirtyValues.slice(-1):live:fromDefaults?defaults:live;if(initial.length&&!this._restoredStateActive&&!this._valueDirty){const next=this.multiple?initial:initial[0];fromDefaults&&!optionDirty?this.setValue(next,!1):this.assignValue(next);return}optionDirty&&(this._valueDirty=!0)}this.reflectSelected()}refreshOptionDefaults(){const declared=this.options.filter(option=>option.defaultSelected).map(option=>option.value);this._defaultSelected=this.multiple?declared:declared.slice(0,1),!this._valueDirty&&!this._restoredStateActive&&this.setValue([...this._defaultSelected],!1)}reflectSelected(){const value=this._selected[0];(!this.singleSelectedOption||!this.options.includes(this.singleSelectedOption)||this.singleSelectedOption.value!==value)&&(this.singleSelectedOption=this.options.find(option=>option.value===value));const selected=new Set(this._selected);for(const option of this.options)option[SET_OPTION_SELECTED_FROM_OWNER](this.multiple?selected.has(option.value):option===this.singleSelectedOption)}labelFor(value){const nonBlank=label=>label!==void 0&&label.trim().length>0?label:void 0;if(this.getUnknownLabel&&this.isUnknownValue(value)){const override=nonBlank(this.getUnknownLabel(value));if(override!==void 0)return override}return(!this.source&&!this.multiple&&this.singleSelectedOption?.value===value?nonBlank(this.singleSelectedOption.label):void 0)??nonBlank(this._selectedLabelCache.get(value))??nonBlank(this.options.find(o=>o.value===value)?.label)??nonBlank(this.asyncRows.find(r=>r.value===value)?.label)??(this.loading||this.source&&!this.sourceEverSettled?this.statusText("loading",this.loadingText):void 0)??value}isUnknownValue(value){return this.loading||this.source&&!this.sourceEverSettled?!1:!(!this.source&&!this.multiple&&this.singleSelectedOption?.value===value||this._selectedLabelCache.has(value)||this.options.some(option=>option.value===value)||this.asyncRows.some(row=>row.value===value))}adornmentMarkup(option){return Array.from(option.children).filter(child=>["start","end","prefix","suffix"].includes(child.getAttribute("slot")??"")).map(child=>child.outerHTML).join("")}adornmentsFor(option){const cached=this.adornmentClones.get(option);if(cached)return cached;const cloneSlot=selector=>{const nodes=Array.from(option.querySelectorAll(selector));if(nodes.length!==0)return nodes.map(node=>node.cloneNode(!0))},resolved={markup:this.adornmentMarkup(option),start:cloneSlot(':scope > [slot="start"], :scope > [slot="prefix"]'),end:cloneSlot(':scope > [slot="end"], :scope > [slot="suffix"]')};return this.adornmentClones.set(option,resolved),resolved}rowForOption(option){const adornments=this.adornmentsFor(option),row={value:option.value,label:option.label,sub:option.sub||void 0,dotColor:option.dotColor||void 0,group:option.group||void 0,disabled:option.disabled||option.inert||option.closest("[inert]")!==null,data:option.data,...adornments.start===void 0?{}:{start:adornments.start},...adornments.end===void 0?{}:{end:adornments.end}};return this.sourceOptionsByRow.set(row,option),row}get selectionSourceRows(){return this.source?this.asyncRows:this.options.map(option=>this.rowForOption(option))}applySelectedRowValues(values){const rowsByValue=new Map;for(const row of this.selectionSourceRows)rowsByValue.has(row.value)||rowsByValue.set(row.value,row);const rows=values.map(value=>rowsByValue.get(value)).filter(row=>row!==void 0),limited=this.multiple?rows:rows.slice(0,1);this.assignValue(limited.map(row=>row.value));for(const row of limited)this._selectedRowCache.set(row.value,row)}applyPendingSelectedRows(acceptEmptySource=!1){if(this.pendingSelectedRowValues===void 0||!acceptEmptySource&&this.selectionSourceRows.length===0)return!1;const values=this.pendingSelectedRowValues;return this.pendingSelectedRowValues=void 0,this.applySelectedRowValues(values),!0}get effectiveRows(){return this.source?this.asyncRows:this.filtered.map(option=>this.rowForOption(option))}get unknownRows(){if(!this.withUnknownOption)return[];const locale=this.effectiveLocale,query2=this.query.trim().toLocaleLowerCase(locale);return this._selected.filter(value=>this.isUnknownValue(value)).map(value=>({value,label:this.labelFor(value),badge:this.localize("notInCatalog"),unknownValue:value})).filter(row=>!query2||row.label.toLocaleLowerCase(locale).includes(query2)||row.value.toLocaleLowerCase(locale).includes(query2))}get createRow(){if(!this.allowCreate)return;const inputValue=this.query.trim();if(!inputValue)return;const locale=this.effectiveLocale,folded=inputValue.toLocaleLowerCase(locale);if(!(this.source?this.asyncRows:this.options.map(option=>({value:option.value,label:option.label}))).some(row=>row.value.toLocaleLowerCase(locale)===folded||row.label.toLocaleLowerCase(locale)===folded))return{value:inputValue,label:this.localize("comboboxCreate",void 0,{value:inputValue}),createInput:inputValue}}get renderedRows(){const all=this.effectiveRows,create=this.createRow,sourceOverflow=this.source?Math.max(0,this._sourceTotal-all.length):0,unknown=this.unknownRows;if(all.length<=this.maxRender)return{rows:[...all,...unknown,...create?[create]:[]],overflow:sourceOverflow};const originalIndex=new Map(all.map((r,i)=>[r,i])),capped=all.slice(0,this.maxRender),cappedValues=new Set(capped.map(r=>r.value));let appendedOutOfCap=!1;for(const v of this._selected)if(!cappedValues.has(v)){const selectedRow=all.find(r=>r.value===v);selectedRow&&(capped.push(selectedRow),appendedOutOfCap=!0)}return appendedOutOfCap&&capped.sort((a,b)=>originalIndex.get(a)-originalIndex.get(b)),capped.push(...unknown),create&&capped.push(create),{rows:capped,overflow:all.length-capped.length+unknown.length+(create?1:0)+sourceOverflow}}normalizeActiveIndex(){if(this.activeIndex<0)return;const navigableCount=this.renderedRows.rows.filter(row=>!row.disabled).length,next=navigableCount>0?Math.min(this.activeIndex,navigableCount-1):-1;next!==this.activeIndex&&(this.activeIndex=next)}get filtered(){const locale=this.effectiveLocale,q=this.query.trim().toLocaleLowerCase(locale),selectedLabel=this.multiple?"":this.labelFor(this._selected[0]??"")??"",effective=q&&q===selectedLabel.toLocaleLowerCase(locale)?"":q;if(!effective)return this.options;const fn=this.filter??((o,query2)=>o.label.toLocaleLowerCase(locale).includes(query2)||o.searchText.toLocaleLowerCase(locale).includes(query2));return this.options.filter(o=>fn(o,effective))}get displayValue(){return this.multiple||this.open||this.explicitInputValue?this.query:this._selected[0]?this.labelFor(this._selected[0]):""}announceOpenTransition(changed){this.openVetoed=!1;const closeAfterPositioningFailure=!this.open&&this.closeAfterPositioningFailure;if(this.closeAfterPositioningFailure=!1,!changed.has("open")||this._isFirstUpdate)return;const name=this.open?"lr-show":"lr-hide";if(!this.isConnected||closeAfterPositioningFailure){this.emit("lr-hide");return}this.emit(name,null,{cancelable:!0}).defaultPrevented&&(this.openVetoed=!0,this.open=!this.open,this.resolveTransitionWaiters(this.open?"lr-after-hide":"lr-after-show"))}show(){if(this.open||this.liveDisabled||this.readonly)return Promise.resolve();this.resolveTransitionWaiters("lr-after-hide");const settled=this.waitForTransition("lr-after-show");return this.open=!0,settled}hide(){if(!this.open)return Promise.resolve();this.resolveTransitionWaiters("lr-after-show");const settled=this.waitForTransition("lr-after-hide");return this.closeCleanupPending=!0,this.open=!1,settled}finalizeCloseState(){if(this.closeCleanupPending&&(this.closeCleanupPending=!1,this.activeIndex=-1,!this.multiple)){const queryChanged=this.query!=="";this.query="",this.explicitInputValue=!1,queryChanged&&this.source&&(this.asyncRows=[],this.sourceFailed=!1,this._sourceTotal=0,this._sourceTruncated=!1)}}activateListboxOverlay(){this.invalidateListboxPositioning(),this.overlayHandle?.deactivate({restoreFocus:!1}),this.restoreFocusOnClose=!0,this.overlayHandle=activateNonmodalOverlay({host:this,panel:()=>this.renderRoot.querySelector('[part="listbox"]'),onEscape:()=>{this.hide()},onBackdrop:()=>{this.restoreFocusOnClose=!1,this.hide()},restoreFocusTo:this.inputEl??null}),this.bindDocumentPointer(),this.beginListboxPositioning()}beginListboxPositioning(){const anchor=this.renderRoot.querySelector('[part="combobox"]'),listbox=this.renderRoot.querySelector('[part="listbox"]');if(anchor&&listbox){const generation=this.positioningGeneration;this.positioningReady=new Promise(resolve=>{this.resolvePositioningReady=resolve}),this.startListboxPositioning(generation,anchor,listbox)}}invalidateListboxPositioning(){this.positioningGeneration++,this.cleanup?.(),this.cleanup=void 0,this.resolvePositioningReady?.(!1),this.resolvePositioningReady=void 0}resolveCurrentPositioning(positioned){const resolve=this.resolvePositioningReady;this.resolvePositioningReady=void 0,resolve?.(positioned)}async startListboxPositioning(generation,anchor,listbox){try{const runtime=await loadAnchoredOverlayRuntime(),{place}=runtime;if(generation!==this.positioningGeneration||!this.open||!this.isConnected||this.renderRoot.querySelector('[part="combobox"]')!==anchor||this.renderRoot.querySelector('[part="listbox"]')!==listbox)return;this.placedTopLayer=syncTopLayerRelease(listbox,this.placedTopLayer,this.topLayer,runtime);const cleanup=place(anchor,listbox,{placement:`${this.placement}-start`,...topLayerPlacement(this.topLayer,resolveEffectivePositioningStrategy(this,this._positioningStrategy,"fixed")),sync:this.sync,onPlaced:()=>{generation===this.positioningGeneration&&(this.listboxPositioned=!0,this.updateComplete.then(()=>{generation!==this.positioningGeneration||!this.open||this.resolveCurrentPositioning(!0)}))}});generation!==this.positioningGeneration?cleanup():this.cleanup=cleanup}catch{if(generation!==this.positioningGeneration||!this.open)return;this.resolveCurrentPositioning(!1),this.closeAfterPositioningFailure=!0,this.hide()}}teardownListboxOverlay(restoreFocus=this.restoreFocusOnClose){this.invalidateListboxPositioning(),this.restoringOverlayFocus=restoreFocus;try{this.overlayHandle?.deactivate({restoreFocus})}finally{this.restoringOverlayFocus=!1}this.overlayHandle=void 0,this.unbindDocumentPointer(),this.restoreFocusOnClose=!0}bindDocumentPointer(){if(!this.isConnected)return;const ownerDocument=this.ownerDocument;if(this.pointerListenerDocument===ownerDocument&&this.pointerListener)return;this.unbindDocumentPointer();const listener=event=>{this.pointerListener!==listener||this.pointerListenerDocument!==ownerDocument||!this.isConnected||this.ownerDocument!==ownerDocument||this.onDocPointer(event)};this.pointerListenerDocument=ownerDocument,this.pointerListener=listener,ownerDocument.addEventListener("pointerdown",listener,!0)}unbindDocumentPointer(){this.pointerListenerDocument&&this.pointerListener&&this.pointerListenerDocument.removeEventListener("pointerdown",this.pointerListener,!0),this.pointerListenerDocument=void 0,this.pointerListener=void 0}reconnectOpenPopup(){!this.isConnected||!this.open||(this.activateListboxOverlay(),this.source&&this.asyncRows.length===0&&this.runSource(this.query))}syncVisibleOptionsCap(){const listbox=this.renderRoot?.querySelector('[part="listbox"]');if(!listbox)return;const clear=()=>{listbox.style.removeProperty("max-block-size")},requested=typeof this.visibleOptions=="number"?finiteCount(this.visibleOptions,0):0;if(requested<=0)return clear();const rows=listbox.querySelectorAll('[part="option"]');if(rows.length<=requested)return clear();const boundary=rows[requested];if(!boundary)return clear();const cap=boundary.getBoundingClientRect().top-listbox.getBoundingClientRect().top;if(!Number.isFinite(cap)||cap<=0)return clear();listbox.style.setProperty("max-block-size",`min(${Math.ceil(cap)}px, var(--lr-positioner-available-block-size, var(--lr-size-18rem)))`)}updated(changed){super.updated(changed),this.syncExternalDescription(),this.syncVisibleOptionsCap(),changed.has("open")&&!this.openVetoed?this.open&&this.isConnected?(this.activateListboxOverlay(),this._isFirstUpdate||this.settleTransition("lr-after-show"),this.refreshQueued?(this.refreshQueued=!1,this.runSource(this.query)):this.source&&this.asyncRows.length===0&&this.runSource(this.query)):this.open?this.teardownListboxOverlay(!1):(this.teardownListboxOverlay(),this._isFirstUpdate||this.settleTransition("lr-after-hide")):changed.has("open")&&this.openVetoed&&(this.restoreFocusOnClose=!0),changed.has("topLayer")&&!changed.has("open")&&this.open&&this.isConnected&&(this.invalidateListboxPositioning(),this.beginListboxPositioning()),changed.has("name")&&this.syncFormValue(),changed.has("validators")&&(this.updateValidity(),this.syncValidatorAttributeObserver()),(changed.has("touched")||changed.has("required")||changed.has("value")||changed.has("validators")||changed.has("validityRevision"))&&this.toggleAttribute("data-invalid",this.touched&&!this.internals.validity.valid),changed.has("activeIndex")&&this.renderRoot.querySelector('[part="option"][data-active]')?.scrollIntoView({block:"nearest"})}async settleTransition(event){const token=++this.transitionToken;if(await this.updateComplete,this.transitionToken===token){if(event==="lr-after-show"){for(;this.open&&!this.listboxPositioned;){const readiness=this.positioningReady,positioned=await readiness;if(this.transitionToken!==token)return;if(positioned)break;if(readiness===this.positioningReady)return}if(await this.updateComplete,this.transitionToken!==token)return}if(this.isConnected){const view=this.ownerDocument.defaultView;if(view&&await new Promise(resolve=>view.requestAnimationFrame(()=>resolve())),this.transitionToken!==token)return;const animations=this.renderRoot.querySelector('[part="listbox"]')?.getAnimations({subtree:!0})??[];if(await Promise.all(animations.map(animation=>animation.finished.catch(()=>{}))),this.transitionToken!==token)return}event==="lr-after-hide"&&(this.listboxHidden=!0,await this.updateComplete,this.transitionToken!==token)||(this.emit(event),this.resolveTransitionWaiters(event))}}waitForTransition(event){return new Promise(resolve=>{const waiters=this.transitionWaiters.get(event)??new Set;waiters.add(resolve),this.transitionWaiters.set(event,waiters)})}resolveTransitionWaiters(event){const waiters=this.transitionWaiters.get(event);if(waiters){this.transitionWaiters.delete(event);for(const resolve of waiters)resolve()}}emitValueEvents(){const self=this,data=this.resolveSelectedRowSlots().map(row=>row?.data);self.emit("input",{value:self.value,data}),self.emit("change",{value:self.value,data}),self.emit("lr-change",{value:self.value,data})}assignValue(next){this.value=next}createOption(inputValue){if(this.liveDisabled||this.readonly||this.emit("lr-create",{inputValue},{cancelable:!0}).defaultPrevented)return;const option=this.ownerDocument.createElement(tag("option"));option.setAttribute("value",inputValue),option.textContent=inputValue,this.append(option),this.pickRow({value:inputValue,label:inputValue})}commitCustomValue(inputValue){if(this.liveDisabled||this.readonly||this.multiple||!inputValue)return;const selectionChanged=this._selected[0]!==inputValue;this._selectedLabelCache.set(inputValue,inputValue),this.assignValue(inputValue),this.query="",this.explicitInputValue=!1,this.hide(),selectionChanged&&this.emitValueEvents()}pickRow(row){const sourceOption=this.sourceOptionsByRow.get(row);if(this.liveDisabled||this.readonly||row.disabled||sourceOption&&(sourceOption.disabled||sourceOption.closest("[inert]")))return;if(row.createInput!==void 0){this.createOption(row.createInput);return}const synthetic=row.unknownValue!==void 0,selectionChanged=this.multiple||this._selected[0]!==row.value;if(this.multiple){const set=new Set(this._selected);set.has(row.value)?(set.delete(row.value),this._selectedRowCache.delete(row.value)):(set.add(row.value),synthetic||(this._selectedLabelCache.set(row.value,row.label),this._selectedRowCache.set(row.value,row))),this.assignValue([...set]),this.query="",this.explicitInputValue=!1}else synthetic||(this._selectedLabelCache.set(row.value,row.label),this._selectedRowCache.clear(),this._selectedRowCache.set(row.value,row)),this.setValue(row.value,!0,sourceOption),this.query="",this.explicitInputValue=!1,this.hide();this.source&&this.runSource(this.query),selectionChanged&&this.emitValueEvents(),this.emit("lr-activate",{value:row.value})}removeValueAt(index){if(this.liveDisabled||this.readonly||index<0||index>=this._selected.length)return;const next=this._selected.filter((_,i)=>i!==index);this.assignValue(next),this.emitValueEvents()}clear(){if(this.liveDisabled||this.readonly)return;const hadSelection=this._selected.length>0,queryChanged=this.query!=="";!hadSelection&&!queryChanged||(hadSelection&&this.assignValue([]),this.query="",this.explicitInputValue=!1,this.source&&this.runSource(this.query),hadSelection&&(this.emitValueEvents(),this.emit("lr-clear")),queryChanged&&this.emit("lr-filter",{value:this.query}))}refresh(){if(this.source){if(!this.open){this.refreshQueued=!0;return}this.refreshQueued=!1,this.runSource(this.query,{immediate:!0})}}runSource(query2,options){const source=this.source;if(!source)return;this.clearSourceTimer(),this.sourceAbort?.abort(),this.sourceAbort=void 0;const token=++this.sourceToken,ownerWindow=this.ownerDocument.defaultView;if(!this.isConnected||!ownerWindow)return;const request={query:query2,token,owner:ownerWindow,source};if(options?.immediate){this.runSourceRequest(request);return}this.sourceDebounce.delayMs=this._sourceDelay,this.sourceDebounce.push(request)}runSourceRequest({query:query2,token,owner:ownerWindow,source}){if(token!==this.sourceToken||!this.isConnected||this.ownerDocument.defaultView!==ownerWindow)return;const controller=new ownerWindow.AbortController;this.sourceAbort=controller,this.sourceLoading=!0,this.sourceFailed=!1,Promise.resolve().then(()=>source(query2,{signal:controller.signal,limit:MAX_SOURCE_ROWS})).then(result=>{if(token!==this.sourceToken||!this.isConnected||this.ownerDocument.defaultView!==ownerWindow)return;const normalized=normalizeSourceResult(result);this._sourceTotal=normalized.total,this._sourceTruncated=normalized.truncated,this.asyncRows=normalized.rows,this.sourceFailed=!1,this.sourceEverSettled=!0,this.normalizeActiveIndex(),this.applyPendingSelectedRows(!0);const selected=new Set(this._selected);for(const row of normalized.rows)selected.has(row.value)&&this._selectedRowCache.set(row.value,row)}).catch(err=>{token!==this.sourceToken||!this.isConnected||this.ownerDocument.defaultView!==ownerWindow||typeof err=="object"&&err!==null&&"name"in err&&err.name==="AbortError"||(this.asyncRows=[],this._sourceTotal=0,this._sourceTruncated=!1,this.activeIndex=-1,this.sourceFailed=!0,this.sourceEverSettled=!0,this.sourceErrorAnnouncementSink?.announce(this.localize("comboboxLoadError")),this.emit("lr-source-error",{error:err,query:query2}),console.warn("<lr-combobox> source() rejected:",err))}).finally(()=>{token===this.sourceToken&&(this.sourceLoading=!1)})}clearSourceTimer(){this.sourceDebounce.cancel()}renderRows(rows,activeId){const out=[];let currentGroup,currentGroupRows=[],groupIndex=0;const selectedSet=new Set(this.multiple?this._selected:this._selected.slice(0,1)),flushGroup=()=>{if(currentGroupRows.length){if(currentGroup){const labelId=`${this.listId}-group-${groupIndex++}`;out.push(html`<div role="group" aria-labelledby=${labelId}>
|
|
1
|
+
import{__decorate}from"tslib";import{GlassScrollLayer}from"../../../internal/glass-scroll-layer.js";import{collectionSupport}from"../../../internal/collection-snapshot.js";import{acquireNativeControlDescription}from"../../../internal/native-control-description.js";import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{styleMap}from"lit/directives/style-map.js";import{LyraElement}from"../../../internal/lyra-element.js";import{installFormControlLabelSupport}from"../../../internal/form-control-labels.js";installFormControlLabelSupport();import{loadAnchoredOverlayRuntime,syncTopLayerRelease,topLayerPlacement}from"../../../internal/anchored-overlay-runtime.js";import{hostAriaLabel,nextId}from"../../../internal/a11y.js";import{chevronIcon,closeIcon}from"../../../internal/icons.js";import{AnchoredValidityController,VALIDITY_ANCHOR}from"../../../internal/anchored-validity.js";import{setCustomState,syncValidityStates}from"../../../internal/custom-states.js";import{submitOnEnter}from"../../../internal/submit-on-enter.js";import{finiteCount,finiteDuration}from"../../../internal/numbers.js";import{DebounceController}from"../../../internal/debounce-controller.js";import{sizes}from"../../../internal/sizes.styles.js";import{styles}from"./combobox.styles.js";import"./option.class.js";import{autocorrectConverter,literalSetConverter,omittedEmptyStringConverter,optionalLiteralSetConverter,spellcheckConverter}from"../../../internal/converters.js";import{resolveEffectivePositioningStrategy}from"../../../internal/positioning-strategy.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{sanitizeCssColor}from"../../../internal/safe-css.js";import{attachInternalsSafely,getFormOwner,installCustomErrorProperty,isBarredFromValidation,setFormOwner}from"../../../internal/form-associated.js";import{installInteractionOnInvalid,installInvalidEventAlias,withStaticValidityCheck}from"../../../internal/invalid-event-alias.js";import{tag}from"../../../internal/prefix.js";import{renderInertPresentation}from"../../../internal/inert-presentation.js";import{collectInitialSlotAssignment}from"../../../internal/initial-slot-collection.js";import{renderDataState}from"../../../internal/data-state-renderer.js";import{SlotPresenceController}from"../../../internal/slot-presence-controller.js";import{acquireAnnouncementSink}from"../../../internal/announcer.js";import{activateNonmodalOverlay}from"../../../internal/nonmodal-overlay-manager.js";import{isOptionSelectedDirty,isOptionSelectedWrite,wasOptionInitiallySelected,RESET_OPTION_SELECTED_FROM_OWNER,SET_OPTION_SELECTED_FROM_OWNER}from"../../../internal/option-selection.js";import{isHtmlElement}from"../../../internal/dom-guards.js";import{relayNativeEvent}from"../../../internal/native-event-relay.js";import{LYRA_DEFAULT_clear,LYRA_DEFAULT_collapse,LYRA_DEFAULT_comboboxCreate,LYRA_DEFAULT_comboboxLabel,LYRA_DEFAULT_comboboxLoadError,LYRA_DEFAULT_comboboxOverflow,LYRA_DEFAULT_comboboxRequired,LYRA_DEFAULT_comboboxSelectedOverflow,LYRA_DEFAULT_date,LYRA_DEFAULT_details,LYRA_DEFAULT_fieldRequired,LYRA_DEFAULT_loading,LYRA_DEFAULT_map,LYRA_DEFAULT_navigation,LYRA_DEFAULT_noData,LYRA_DEFAULT_noMatches,LYRA_DEFAULT_notInCatalog,LYRA_DEFAULT_open,LYRA_DEFAULT_progress,LYRA_DEFAULT_removeWithContext,LYRA_DEFAULT_restore,LYRA_DEFAULT_retry,LYRA_DEFAULT_search,LYRA_DEFAULT_select,LYRA_DEFAULT_tableLoadFailed,LYRA_DEFAULT_valueInvalid}from"../../../internal/default-strings.generated.js";function isLyraOptionElement(value){return isHtmlElement(value)&&value.localName===tag("option")}function normalizeSelectionValues(next){return Array.isArray(next)?next.filter(value=>typeof value=="string"):typeof next=="string"?[next]:[]}const POSITIONING_STRATEGY=optionalLiteralSetConverter(["absolute","fixed"]),APPEARANCE=literalSetConverter(["accent","filled","outlined","filled-outlined","plain"],"outlined"),VALIDITY_FLAG_KEYS=new Set(["badInput","customError","patternMismatch","rangeOverflow","rangeUnderflow","stepMismatch","tooLong","tooShort","typeMismatch","valueMissing"]),comboboxSpellcheckConverter={...spellcheckConverter,fromAttribute:(value,type)=>value===null?void 0:spellcheckConverter.fromAttribute?.(value,type)};function adornmentContent(value){return typeof value=="string"||typeof value=="number"?html`<span>${value}</span>`:value}function isValidityFlagKey(value){return typeof value=="string"&&VALIDITY_FLAG_KEYS.has(value)}const MAX_SOURCE_ROWS=2e3,MAX_SOURCE_TEXT_UNITS=25e4,MAX_SOURCE_FIELD_UNITS=4096,MAX_RENDER_ROWS=1e3;function normalizeSourceResult(input){let candidateRows,candidateTotal;try{Array.isArray(input)?candidateRows=input:typeof input=="object"&&input!==null&&(candidateRows=input.rows,candidateTotal=input.total)}catch{throw new TypeError("Invalid combobox source result")}if(!Array.isArray(candidateRows))throw new TypeError("Invalid combobox source result");const providerTotal=typeof candidateTotal=="number"&&Number.isFinite(candidateTotal)&&candidateTotal>=0?Math.trunc(candidateTotal):candidateRows.length,rows=[];let textUnits=0;const limit=Math.min(candidateRows.length,MAX_SOURCE_ROWS);for(let index=0;index<limit;index++)try{const value=candidateRows[index]?.value,label=candidateRows[index]?.label;if(typeof value!="string"||typeof label!="string"||value.length>MAX_SOURCE_FIELD_UNITS||label.length>MAX_SOURCE_FIELD_UNITS)continue;const source=candidateRows[index],optionalText=key=>{const candidate=source[key];return typeof candidate=="string"&&candidate.length<=MAX_SOURCE_FIELD_UNITS?candidate:void 0},sub=optionalText("sub"),accessibleLabel=optionalText("accessibleLabel"),dotColor=optionalText("dotColor"),group=optionalText("group"),badgeCandidate=source.badge,badge=typeof badgeCandidate=="string"&&badgeCandidate.length<=MAX_SOURCE_FIELD_UNITS||typeof badgeCandidate=="number"&&Number.isFinite(badgeCandidate)?badgeCandidate:void 0,units=value.length+label.length+(sub?.length??0)+(accessibleLabel?.length??0)+(dotColor?.length??0)+(group?.length??0)+(typeof badge=="string"?badge.length:0);if(textUnits+units>MAX_SOURCE_TEXT_UNITS)break;textUnits+=units,rows.push({value,label,...sub===void 0?{}:{sub},...source.icon===void 0?{}:{icon:source.icon},...source.start===void 0?{}:{start:source.start},...source.end===void 0?{}:{end:source.end},...badge===void 0?{}:{badge},...accessibleLabel===void 0?{}:{accessibleLabel},...source.data===void 0?{}:{data:source.data},...dotColor===void 0?{}:{dotColor},...group===void 0?{}:{group},...typeof source.disabled=="boolean"?{disabled:source.disabled}:{}})}catch{}const total=Math.max(providerTotal,candidateRows.length);return{rows,total,truncated:total>rows.length}}class LyraCombobox extends LyraElement{static{this.defaultStrings={...super.defaultStrings,clear:LYRA_DEFAULT_clear,collapse:LYRA_DEFAULT_collapse,comboboxCreate:LYRA_DEFAULT_comboboxCreate,comboboxLabel:LYRA_DEFAULT_comboboxLabel,comboboxLoadError:LYRA_DEFAULT_comboboxLoadError,comboboxOverflow:LYRA_DEFAULT_comboboxOverflow,comboboxRequired:LYRA_DEFAULT_comboboxRequired,comboboxSelectedOverflow:LYRA_DEFAULT_comboboxSelectedOverflow,date:LYRA_DEFAULT_date,details:LYRA_DEFAULT_details,fieldRequired:LYRA_DEFAULT_fieldRequired,loading:LYRA_DEFAULT_loading,map:LYRA_DEFAULT_map,navigation:LYRA_DEFAULT_navigation,noData:LYRA_DEFAULT_noData,noMatches:LYRA_DEFAULT_noMatches,notInCatalog:LYRA_DEFAULT_notInCatalog,open:LYRA_DEFAULT_open,progress:LYRA_DEFAULT_progress,removeWithContext:LYRA_DEFAULT_removeWithContext,restore:LYRA_DEFAULT_restore,retry:LYRA_DEFAULT_retry,search:LYRA_DEFAULT_search,select:LYRA_DEFAULT_select,tableLoadFailed:LYRA_DEFAULT_tableLoadFailed,valueInvalid:LYRA_DEFAULT_valueInvalid}}static{this.collectionSupport=collectionSupport}static{this.immutableEventDetails=Object.freeze(["lr-change","input","change"])}static{this.identityEventDetailCollectionItems=Object.freeze({"lr-change":Object.freeze(["data"]),input:Object.freeze(["data"]),change:Object.freeze(["data"])})}static{this.formAssociated=!0}static{this.styles=[LyraElement.styles,sizes,styles]}static{this.properties={customError:{attribute:"custom-error",reflect:!0,noAccessor:!0},multiple:{type:Boolean,reflect:!0,noAccessor:!0},disabled:{type:Boolean,reflect:!0,noAccessor:!0},required:{type:Boolean,reflect:!0,noAccessor:!0},readonly:{type:Boolean,reflect:!0,noAccessor:!0},value:{noAccessor:!0},name:{reflect:!0,noAccessor:!0,converter:omittedEmptyStringConverter},maxOptionsVisible:{type:Number,attribute:"max-options-visible",noAccessor:!0},maxRender:{type:Number,attribute:"max-render",noAccessor:!0},sourceDelay:{type:Number,attribute:"source-delay",noAccessor:!0}}}get open(){return this._open}set open(next){const old=this._open,liveDisabled=this.effectiveDisabled||typeof this.matches=="function"&&this.matches(":disabled");if(this._open=!!next&&!this.readonly&&!liveDisabled,this._open===old){next&&!this._open&&this.hasAttribute("open")&&this.removeAttribute("open");return}this.requestUpdate("open",old)}get appearance(){return this._appearance}set appearance(next){const normalized=APPEARANCE.normalizeReflected(this,"appearance",next),old=this._appearance;this._appearance=normalized,normalized!==old&&this.requestUpdate("appearance",old)}get positioningStrategy(){return this._positioningStrategy??"fixed"}set positioningStrategy(next){const normalized=POSITIONING_STRATEGY.normalize(next)??"fixed",old=this.positioningStrategy;this._positioningStrategy=normalized,normalized!==old&&this.requestUpdate("positioningStrategy",old)}get autocorrect(){return this.autocorrectValue}set autocorrect(next){this.autocorrectValue=!!next,this.requestUpdate()}get inputmode(){return this.inputMode}set inputmode(next){this.inputMode=next??""}get enterkeyhint(){return this.enterKeyHint}set enterkeyhint(next){this.enterKeyHint=next??""}get inputValue(){return this.query}set inputValue(next){this.explicitInputValue=!0,this.query=next??"",this.activeIndex=-1,this.source&&this.runSource(this.query),this.requestUpdate()}constructor(){super(),this.placeholder="",this.label="",this.hint="",this.errorText="",this.allowCreate=!1,this.allowCustomValue=!1,this.withUnknownOption=!1,this.loading=!1,this._appearance="outlined",this.placement="bottom",this.topLayer=!1,this.size="m",this.pill=!1,this.clearable=!1,this.withClear=!1,this.withLabel=!1,this.withHint=!1,this.validators=[],this.autocomplete="off",this.inputMode="",this.enterKeyHint="",this.spellcheck=!1,this.autocapitalize="",this.autocorrectValue=!0,this.filter=null,this.source=null,this.query="",this.explicitInputValue=!1,this.activeIndex=-1,this.options=[],this.touched=!1,this.validityRevision=0,this.slotPresence=new SlotPresenceController(this),this.sourceLoading=!1,this.sourceFailed=!1,this.sourceEverSettled=!1,this.asyncRows=[],this._sourceTotal=0,this._sourceTruncated=!1,this.sourceDebounce=new DebounceController(0,request=>this.runSourceRequest(request),()=>this.ownerDocument.defaultView),this.sourceToken=0,this.refreshQueued=!1,this._sourceWarmed=!1,this._selectedLabelCache=new Map,this._selectedRowCache=new Map,this._rowsByValue=new Map,this._open=!1,this._fieldsetDisabled=!1,this.listId=nextId("combobox-list"),this.inputId=nextId("combobox-input"),this.listboxPositioned=!1,this.positioningGeneration=0,this.positioningReady=Promise.resolve(!1),this.restoreFocusOnClose=!0,this.restoringOverlayFocus=!1,this.listboxHidden=!0,this._isFirstUpdate=!0,this.openVetoed=!1,this.closeAfterPositioningFailure=!1,this.closeCleanupPending=!1,this.transitionToken=0,this.transitionWaiters=new Map,this._selected=[],this.sourceOptionsByRow=new WeakMap,this._valueDirty=!1,this._multiple=!1,this._disabled=!1,this._required=!1,this._readonly=!1,this._defaultSelected=[],this._defaultCaptured=!1,this._restoredStateActive=!1,this._name="",this._maxOptionsVisible=3,this._maxRender=200,this._sourceDelay=200,this.localDescriptionIds="",this.markInteracted=()=>{this.touched||(this.touched=!0,this.updateValidity(),this.syncCustomStates())},this.collectOptions=e=>{this.collectOptionsFromSlot(e.target)},this.optionRefreshPending=!1,this.onOptionChange=e=>{e.stopPropagation();const option=e.composedPath().find(isLyraOptionElement);if(isLyraOptionElement(option)&&this.options.includes(option)&&isOptionSelectedWrite(e)){if(this.multiple){const next=option.selected?this._selected.includes(option.value)?this._selected:[...this._selected,option.value]:this._selected.filter(value=>value!==option.value);this.assignValue(next)}else{if(this._valueDirty=!0,this._restoredStateActive=!1,!option.selected&&this.singleSelectedOption!==option)return;this.setValue(option.selected?option.value:[],!0,option.selected?option:void 0)}return}isLyraOptionElement(option)&&this.adornmentClones.get(option)?.markup!==this.adornmentMarkup(option)&&this.adornmentClones.delete(option),!this.optionRefreshPending&&(this.optionRefreshPending=!0,queueMicrotask(()=>{this.optionRefreshPending=!1,this.refreshOptionDefaults(),this.reflectSelected(),this.options=[...this.options],this.normalizeActiveIndex()}))},this.adornmentClones=new WeakMap,this.onDocPointer=e=>{if(!e.composedPath().includes(this)){if(this.overlayHandle?.isActive()){this.overlayHandle.dismissBackdrop();return}this.restoreFocusOnClose=!1,this.hide()}},this.onInput=e=>{this.liveDisabled||this.readonly||(this.explicitInputValue=!1,this.query=e.target.value,this.activeIndex=-1,this.show(),this.source&&this.runSource(this.query),this.emit("lr-filter",{value:this.query}))},this.onInputBlur=event=>{this.liveDisabled||(this.touched=!0),this.syncCustomStates(),this.onComboFocusOut(event),relayNativeEvent(this,event)},this.onComboFocusOut=event=>{const trigger=this.renderRoot.querySelector('[part="combobox"]'),target=event.relatedTarget;target&&typeof target.nodeType=="number"&&trigger?.contains(target)||(this.restoreFocusOnClose=!1,this.hide())},this.onInputFocus=event=>{if(this.liveDisabled){event.stopPropagation();return}this.restoringOverlayFocus||this.show(),relayNativeEvent(this,event)},this.onKeyDown=e=>{if(e.isComposing||e.keyCode===229||this.liveDisabled||this.readonly)return;const navigable=this.renderedRows.rows.filter(r=>!r.disabled);switch(e.key){case"ArrowDown":if(e.preventDefault(),!this.open){this.show();return}this.activeIndex=Math.min(navigable.length-1,this.activeIndex+1);break;case"ArrowUp":if(e.preventDefault(),!this.open){this.show();return}this.activeIndex=Math.max(0,this.activeIndex-1);break;case"Enter":{const activeRow=navigable[this.activeIndex];if(this.open&&this.activeIndex>=0&&activeRow){e.preventDefault(),this.pickRow(activeRow);break}const create=this.createRow;if(this.open&&create){e.preventDefault(),this.createOption(create.createInput);break}if(this.open&&this.allowCustomValue&&!this.multiple&&this.query.trim()){e.preventDefault(),this.commitCustomValue(this.query.trim());break}submitOnEnter(this,e);break}case"Escape":this.open&&(!this.overlayHandle?.isActive()||this.overlayHandle.isTopmost())&&(e.preventDefault(),this.hide());break;case"Home":this.open&&(e.preventDefault(),this.activeIndex=0);break;case"End":this.open&&(e.preventDefault(),this.activeIndex=navigable.length-1);break;case"Backspace":this.multiple&&!this.query&&this._selected.length&&this.removeValueAt(this._selected.length-1);break}},this.onComboMouseDown=e=>{this.liveDisabled||e.composedPath()[0]!==this.inputEl&&(e.target.closest("button")||(e.preventDefault(),this.inputEl?.focus(),this.show()))},this.onListboxMouseDown=e=>{e.preventDefault()},this.onListboxClick=e=>{const value=e.target.closest('[part="option"]')?.dataset.value;if(value===void 0)return;const row=this._rowsByValue.get(value);row&&this.pickRow(row)},new GlassScrollLayer(this,'[part="listbox"]',()=>this.open),this.internals=attachInternalsSafely(this),this.validityController=new AnchoredValidityController(this,this.internals,()=>this[VALIDITY_ANCHOR]()),installCustomErrorProperty(this,()=>this.validityController.customValidityMessage),installInvalidEventAlias(this,init=>this.emit("lr-invalid",null,init)),installInteractionOnInvalid(this,this.markInteracted)}get form(){return getFormOwner(this.internals)}set form(owner){setFormOwner(this,owner)}getForm(){return getFormOwner(this.internals)}get labels(){return this.internals.labels}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}get willValidate(){return this.internals.willValidate}get validationTarget(){return this.validationTargetOverride??this.inputEl??void 0}set validationTarget(next){this.validationTargetOverride=next??void 0,this.validityController.refreshAnchor()}resetValidity(){this.validityController.setCustomValidity(""),this.updateValidity()}get input(){return this.inputEl??null}get selectionStart(){return this.inputEl?.selectionStart??null}set selectionStart(value){this.inputEl&&(this.inputEl.selectionStart=value)}get selectionEnd(){return this.inputEl?.selectionEnd??null}set selectionEnd(value){this.inputEl&&(this.inputEl.selectionEnd=value)}get selectionDirection(){return this.inputEl?.selectionDirection}set selectionDirection(value){this.inputEl&&(this.inputEl.selectionDirection=value)}get liveDisabled(){return this.effectiveDisabled||this.matches(":disabled")}focus(options){this.liveDisabled||this.inputEl?.focus(options)}blur(){this.inputEl?.blur()}click(){this.liveDisabled||(this.inputEl?.focus(),this.show())}select(){this.inputEl?.select()}setSelectionRange(start,end,direction){this.inputEl?.setSelectionRange(start,end,direction)}setRangeText(replacement,start,end,selectMode){const input=this.inputEl;input&&(start===void 0||end===void 0?input.setRangeText(replacement):input.setRangeText(replacement,start,end,selectMode),this.explicitInputValue=!0,this.query=input.value,this.activeIndex=-1,this.source&&this.runSource(this.query))}[VALIDITY_ANCHOR](){return this.validationTarget}syncExternalDescription(){if(!this.isConnected)return;const target=this.renderRoot.querySelector('[part="combobox-input"]');target&&(this.externalDescriptionLease?this.externalDescriptionLease.update(target):this.externalDescriptionLease=acquireNativeControlDescription(this,target,()=>this.localDescriptionIds))}releaseExternalDescription(){this.externalDescriptionLease?.release(),this.externalDescriptionLease=void 0}connectedCallback(){super.connectedCallback(),this.hasUpdated&&this.syncExternalDescription(),this.syncSourceErrorAnnouncementSink(),this.updateValidity(),this.hasUpdated&&this.syncValidatorAttributeObserver(),this.hasUpdated&&queueMicrotask(()=>{this.open?this.reconnectOpenPopup():this.source&&this._selected.length&&this.asyncRows.length===0&&this.runSource("")})}adoptedCallback(){super.adoptedCallback(),this.releaseExternalDescription(),this.hasUpdated&&this.syncExternalDescription(),this.listboxPositioned=!1,this.invalidateListboxPositioning(),this.overlayHandle?.deactivate({restoreFocus:!1}),this.overlayHandle=void 0,this.unbindDocumentPointer(),this.clearSourceTimer(),this.sourceToken+=1,this.sourceAbort?.abort(),this.sourceAbort=void 0,this.releaseSourceErrorAnnouncementSink(),this.syncSourceErrorAnnouncementSink()}syncSourceErrorAnnouncementSink(){this.isConnected&&this.sourceErrorAnnouncementSink?.element.ownerDocument!==this.ownerDocument&&(this.releaseSourceErrorAnnouncementSink(),this.sourceErrorAnnouncementSink=acquireAnnouncementSink("assertive",{document:this.ownerDocument,source:this}))}releaseSourceErrorAnnouncementSink(){this.sourceErrorAnnouncementSink?.release(),this.sourceErrorAnnouncementSink=void 0}willUpdate(changed){super.willUpdate(changed),this._isFirstUpdate=!this.hasUpdated,this.announceOpenTransition(changed),this.open&&(this.listboxHidden=!1),changed.has("open")&&!this.openVetoed&&(this.listboxPositioned=!1),changed.has("open")&&this.openVetoed?this.closeCleanupPending=!1:changed.has("open")&&!this.open&&this.finalizeCloseState(),changed.has("source")&&(this.clearSourceTimer(),this.sourceAbort?.abort(),this.sourceAbort=void 0,this.sourceToken++,this.sourceLoading=!1,this.sourceFailed=!1,this.sourceEverSettled=!1,this.asyncRows=[],this._sourceTotal=0,this._sourceTruncated=!1,this.activeIndex=-1,this._sourceWarmed=!1,this.source&&this.open&&this.runSource(this.query)),!this._sourceWarmed&&this.source&&(this._selected.length>0||(this.pendingSelectedRowValues?.length??0)>0)&&this.asyncRows.length===0&&(this._sourceWarmed=!0,this.runSource(""))}firstUpdated(changed){super.firstUpdated(changed);const slot=this.optionsSlot;queueMicrotask(()=>{collectInitialSlotAssignment(slot,s=>{s.assignedElements({flatten:!0}).some(isLyraOptionElement)&&this.collectOptionsFromSlot(s)})})}get name(){return this._name}set name(next){const old=this._name;this._name=next??"",this._name?this.setAttribute("name",this._name):this.removeAttribute("name"),this.syncFormValue(),this.requestUpdate("name",old)}get multiple(){return this._multiple}set multiple(next){const old=this._multiple;this._multiple=!!next,this.toggleAttribute("multiple",this._multiple),this.reflectSelected(),this.syncFormValue(),this.requestUpdate("multiple",old)}get disabled(){return this._disabled}set disabled(next){const old=this._disabled;this._disabled=!!next,this.toggleAttribute("disabled",this._disabled),this._disabled&&this.hide(),this.updateValidity(),this.requestUpdate("disabled",old)}get required(){return this._required}set required(next){const old=this._required;this._required=!!next,this.toggleAttribute("required",this._required),this.updateValidity(),this.requestUpdate("required",old)}get readonly(){return this._readonly}set readonly(next){const old=this._readonly;this._readonly=!!next,this.toggleAttribute("readonly",this._readonly),this._readonly&&this.hide(),this.updateValidity(),this.requestUpdate("readonly",old)}get value(){return this.multiple?[...this._selected]:this._selected[0]??""}set value(next){this.setValue(next,!0)}setValue(next,dirty,preferred){const old=this._selected;this.singleSelectedOption=preferred,dirty&&(this._restoredStateActive=!1,this._valueDirty=!0),this._selected=normalizeSelectionValues(next);const selected=new Set(this._selected);for(const value of selected){const row=this.effectiveRows.find(candidate=>candidate.value===value)??this.asyncRows.find(candidate=>candidate.value===value);row&&this._selectedRowCache.set(value,row)}for(const value of this._selectedRowCache.keys())selected.has(value)||this._selectedRowCache.delete(value);for(const value of this._selectedLabelCache.keys())selected.has(value)||this._selectedLabelCache.delete(value);this.syncFormValue(),this.reflectSelected(),this.updateValidity(),this.requestUpdate("value",old)}get maxOptionsVisible(){return this._maxOptionsVisible}set maxOptionsVisible(next){const old=this._maxOptionsVisible;this._maxOptionsVisible=finiteCount(next,3),this.requestUpdate("maxOptionsVisible",old)}get maxRender(){return this._maxRender}get sourceDelay(){return this._sourceDelay}set sourceDelay(next){const old=this._sourceDelay;this._sourceDelay=finiteDuration(next,200),this.requestUpdate("sourceDelay",old)}set maxRender(next){const old=this._maxRender;this._maxRender=Math.min(finiteCount(next,200),MAX_RENDER_ROWS),this.requestUpdate("maxRender",old)}get sourceTotal(){return this._sourceTotal}get sourceTruncated(){return this._sourceTruncated}get selectedRows(){return this.resolveSelectedRowSlots().filter(row=>row!=null).map(row=>({...row}))}resolveSelectedRowSlots(){return this._selected.map(value=>this._selectedRowCache.get(value)??this.effectiveRows.find(row=>row.value===value)??this.asyncRows.find(row=>row.value===value))}set selectedRows(next){const values=[],seen=new Set;if(Array.isArray(next))for(const candidate of next){let value;try{value=candidate?.value}catch{continue}typeof value!="string"||seen.has(value)||(seen.add(value),values.push(value))}if(values.length>0&&this.selectionSourceRows.length===0){this.pendingSelectedRowValues=values,this.source&&this.isConnected&&(this._sourceWarmed=!0,this.runSource(""));return}this.pendingSelectedRowValues=void 0,this.applySelectedRowValues(values)}get barredFromValidation(){return isBarredFromValidation(this,this.internals)}validatorResult(){const self=this,current=self.value;for(const validator of Array.isArray(this.validators)?this.validators:[]){let result;try{if(typeof validator=="object"&&validator!==null&&"checkValidity"in validator){const checked=validator.checkValidity(this);if(checked?.isValid===!0)continue;const flags={};for(const key of Array.isArray(checked?.invalidKeys)?checked.invalidKeys:[])isValidityFlagKey(key)&&(flags[key]=!0);Object.values(flags).some(Boolean)||(flags.customError=!0);let message=typeof checked?.message=="string"?checked.message:"";return!message&&typeof validator.message=="string"&&(message=validator.message),!message&&typeof validator.message=="function"&&(message=validator.message(this)),{flags,message:message||this.localize("valueInvalid")}}result=typeof validator=="function"?validator(current,self):validator?.validate(current,self)}catch{return{flags:{customError:!0},message:this.localize("valueInvalid")}}if(!(result===void 0||result===!0)){if(typeof result=="string")return{flags:{customError:!0},message:result};if(result===!1)return{flags:{customError:!0},message:this.localize("valueInvalid")};if(result&&typeof result=="object"&&Object.values(result).some(Boolean))return{flags:result,message:this.localize("valueInvalid")}}}return{}}syncValidatorAttributeObserver(){this.disconnectValidatorAttributeObserver();const owner=this.ownerDocument.defaultView,MutationObserverCtor=owner?.MutationObserver;if(!this.isConnected||!owner||typeof MutationObserverCtor!="function")return;const attributes=new Set;for(const validator of Array.isArray(this.validators)?this.validators:[]){if(typeof validator!="object"||validator===null||!("checkValidity"in validator))continue;let observed;try{observed=validator.observedAttributes}catch{continue}if(Array.isArray(observed))for(const name of observed)typeof name=="string"&&name.length>0&&attributes.add(name)}if(attributes.size===0)return;const binding={},observer=new MutationObserverCtor(()=>{this.validatorAttributeObserver!==binding||!this.isConnected||this.ownerDocument.defaultView!==owner||(this.updateValidity(),this.validityRevision++)});binding.observer=observer,binding.owner=owner;try{observer.observe(this,{attributes:!0,attributeFilter:[...attributes]}),this.validatorAttributeObserver=binding}catch{observer.disconnect()}}disconnectValidatorAttributeObserver(){const binding=this.validatorAttributeObserver;this.validatorAttributeObserver=void 0,binding?.observer.disconnect()}updateValidity(){if(this.barredFromValidation){this.validityController.setValidity({}),this.syncCustomStates();return}const flags={};let message="";this.required&&this._selected.length===0&&(flags.valueMissing=!0,message=this.localize("comboboxRequired"));const configured=this.validatorResult();configured.flags&&Object.assign(flags,configured.flags),configured.message&&(message=configured.message),this.validityController.setValidity(flags,message),this.syncCustomStates()}syncCustomStates(){syncValidityStates(this.internals,{required:this.required,hasInteracted:this.touched,barred:this.barredFromValidation}),setCustomState(this.internals,"blank",this._selected.length===0),setCustomState(this.internals,"disabled",this.effectiveDisabled)}syncFormValue(){const state2=JSON.stringify(this._selected);if(this.multiple){if(!this.name){this.internals.setFormValue(null,state2);return}const fd=new FormData;for(const v of this._selected)fd.append(this.name,v);this.internals.setFormValue(fd,state2)}else this.internals.setFormValue(this._selected[0]??"",state2)}get effectiveDisabled(){return this.disabled||this._fieldsetDisabled}formResetCallback(){this.touched=!1,this._restoredStateActive=!1,this._valueDirty=!1;const resetValues=this._defaultSelected.length>0?this._defaultSelected:this.options.filter(option=>wasOptionInitiallySelected(option)).map(option=>option.value);this._defaultSelected.length===0&&resetValues.length>0&&(this._defaultSelected=[...resetValues]);const defaults=new Set(resetValues);for(const option of this.options)option[RESET_OPTION_SELECTED_FROM_OWNER](defaults.has(option.value));this.setValue(this.multiple?[...resetValues]:resetValues.slice(0,1),!1),this.query="",this.explicitInputValue=!1}formStateRestoreCallback(state2,reason){let selected=[];if(typeof state2=="string")try{const parsed=JSON.parse(state2);Array.isArray(parsed)&&parsed.every(value=>typeof value=="string")&&(selected=parsed)}catch{}this.assignValue(this.multiple?selected:selected.slice(0,1)),this._restoredStateActive=!0}formDisabledCallback(disabled){this._fieldsetDisabled=disabled,disabled&&this.hide(),this.updateValidity(),this.requestUpdate()}checkValidity(){return this.updateValidity(),withStaticValidityCheck(this,()=>this.internals.checkValidity())}reportValidity(){return this.touched=!0,this.updateValidity(),this.syncCustomStates(),this.internals.reportValidity()}setCustomValidity(message){this.validityController.setCustomValidity(message??""),this.syncCustomStates()}disconnectedCallback(){this.listboxHidden=!0,this.releaseExternalDescription(),this.transitionToken++,this.listboxPositioned=!1,this.releaseSourceErrorAnnouncementSink(),this.disconnectValidatorAttributeObserver(),super.disconnectedCallback(),this.invalidateListboxPositioning(),this.clearSourceTimer(),this.sourceToken+=1,this.sourceAbort?.abort(),this.sourceAbort=void 0,this.overlayHandle?.deactivate({restoreFocus:!1}),this.overlayHandle=void 0,this.unbindDocumentPointer(),this.resolveTransitionWaiters("lr-after-show"),this.resolveTransitionWaiters("lr-after-hide"),this.open=!1}collectOptionsFromSlot(slot){const previous=new Set(this.options);if(this.options=slot.assignedElements({flatten:!0}).filter(isLyraOptionElement),this.adornmentClones=new WeakMap,this.normalizeActiveIndex(),this.applyPendingSelectedRows(),this._defaultCaptured){const newDefaults=this.options.filter(option=>!previous.has(option)&&option.defaultSelected),newLive=this.options.filter(option=>!previous.has(option)&&option.selected&&!option.defaultSelected);this.refreshOptionDefaults();const eligible=[...!this._restoredStateActive&&!this._valueDirty?newDefaults:[],...this._restoredStateActive?[]:newLive];if(eligible.length){const values=eligible.map(option=>option.value),next=this.multiple?[...new Set([...this._selected,...values])]:values[values.length-1];newLive.length>0?this.assignValue(next):this.setValue(next,!1);return}}else{this._defaultCaptured=!0;const allDefaults=this.options.filter(option=>option.defaultSelected).map(option=>option.value),allLive=this.options.filter(option=>option.selected).map(option=>option.value),defaults=this.multiple?allDefaults:allDefaults.slice(0,1),live=this.multiple?allLive:allLive.slice(0,1),initialLive=this.options.filter(option=>wasOptionInitiallySelected(option)).map(option=>option.value),optionDirty=this.options.some(option=>isOptionSelectedDirty(option)),dirtyValues=this.options.filter(option=>isOptionSelectedDirty(option)&&option.selected).map(option=>option.value);this._defaultSelected=[...defaults.length>0?defaults:initialLive.length>0?initialLive:live];const fromDefaults=defaults.length>0,initial=optionDirty?this.multiple?allLive:dirtyValues.slice(-1)[0]?dirtyValues.slice(-1):live:fromDefaults?defaults:live;if(initial.length&&!this._restoredStateActive&&!this._valueDirty){const next=this.multiple?initial:initial[0];fromDefaults&&!optionDirty?this.setValue(next,!1):this.assignValue(next);return}optionDirty&&(this._valueDirty=!0)}this.reflectSelected()}refreshOptionDefaults(){const declared=this.options.filter(option=>option.defaultSelected).map(option=>option.value);this._defaultSelected=this.multiple?declared:declared.slice(0,1),!this._valueDirty&&!this._restoredStateActive&&this.setValue([...this._defaultSelected],!1)}reflectSelected(){const value=this._selected[0];(!this.singleSelectedOption||!this.options.includes(this.singleSelectedOption)||this.singleSelectedOption.value!==value)&&(this.singleSelectedOption=this.options.find(option=>option.value===value));const selected=new Set(this._selected);for(const option of this.options)option[SET_OPTION_SELECTED_FROM_OWNER](this.multiple?selected.has(option.value):option===this.singleSelectedOption)}labelFor(value){const nonBlank=label=>label!==void 0&&label.trim().length>0?label:void 0;if(this.getUnknownLabel&&this.isUnknownValue(value)){const override=nonBlank(this.getUnknownLabel(value));if(override!==void 0)return override}return(!this.source&&!this.multiple&&this.singleSelectedOption?.value===value?nonBlank(this.singleSelectedOption.label):void 0)??nonBlank(this._selectedLabelCache.get(value))??nonBlank(this.options.find(o=>o.value===value)?.label)??nonBlank(this.asyncRows.find(r=>r.value===value)?.label)??(this.loading||this.source&&!this.sourceEverSettled?this.statusText("loading",this.loadingText):void 0)??value}isUnknownValue(value){return this.loading||this.source&&!this.sourceEverSettled?!1:!(!this.source&&!this.multiple&&this.singleSelectedOption?.value===value||this._selectedLabelCache.has(value)||this.options.some(option=>option.value===value)||this.asyncRows.some(row=>row.value===value))}adornmentMarkup(option){return Array.from(option.children).filter(child=>["start","end","prefix","suffix"].includes(child.getAttribute("slot")??"")).map(child=>child.outerHTML).join("")}adornmentsFor(option){const cached=this.adornmentClones.get(option);if(cached)return cached;const cloneSlot=selector=>{const nodes=Array.from(option.querySelectorAll(selector));if(nodes.length!==0)return nodes.map(node=>node.cloneNode(!0))},resolved={markup:this.adornmentMarkup(option),start:cloneSlot(':scope > [slot="start"], :scope > [slot="prefix"]'),end:cloneSlot(':scope > [slot="end"], :scope > [slot="suffix"]')};return this.adornmentClones.set(option,resolved),resolved}rowForOption(option){const adornments=this.adornmentsFor(option),row={value:option.value,label:option.label,sub:option.sub||void 0,dotColor:option.dotColor||void 0,group:option.group||void 0,disabled:option.disabled||option.inert||option.closest("[inert]")!==null,data:option.data,...adornments.start===void 0?{}:{start:adornments.start},...adornments.end===void 0?{}:{end:adornments.end}};return this.sourceOptionsByRow.set(row,option),row}get selectionSourceRows(){return this.source?this.asyncRows:this.options.map(option=>this.rowForOption(option))}applySelectedRowValues(values){const rowsByValue=new Map;for(const row of this.selectionSourceRows)rowsByValue.has(row.value)||rowsByValue.set(row.value,row);const rows=values.map(value=>rowsByValue.get(value)).filter(row=>row!==void 0),limited=this.multiple?rows:rows.slice(0,1);this.assignValue(limited.map(row=>row.value));for(const row of limited)this._selectedRowCache.set(row.value,row)}applyPendingSelectedRows(acceptEmptySource=!1){if(this.pendingSelectedRowValues===void 0||!acceptEmptySource&&this.selectionSourceRows.length===0)return!1;const values=this.pendingSelectedRowValues;return this.pendingSelectedRowValues=void 0,this.applySelectedRowValues(values),!0}get effectiveRows(){return this.source?this.asyncRows:this.filtered.map(option=>this.rowForOption(option))}get unknownRows(){if(!this.withUnknownOption)return[];const locale=this.effectiveLocale,query2=this.query.trim().toLocaleLowerCase(locale);return this._selected.filter(value=>this.isUnknownValue(value)).map(value=>({value,label:this.labelFor(value),badge:this.localize("notInCatalog"),unknownValue:value})).filter(row=>!query2||row.label.toLocaleLowerCase(locale).includes(query2)||row.value.toLocaleLowerCase(locale).includes(query2))}get createRow(){if(!this.allowCreate)return;const inputValue=this.query.trim();if(!inputValue)return;const locale=this.effectiveLocale,folded=inputValue.toLocaleLowerCase(locale);if(!(this.source?this.asyncRows:this.options.map(option=>({value:option.value,label:option.label}))).some(row=>row.value.toLocaleLowerCase(locale)===folded||row.label.toLocaleLowerCase(locale)===folded))return{value:inputValue,label:this.localize("comboboxCreate",void 0,{value:inputValue}),createInput:inputValue}}get renderedRows(){const all=this.effectiveRows,create=this.createRow,sourceOverflow=this.source?Math.max(0,this._sourceTotal-all.length):0,unknown=this.unknownRows;if(all.length<=this.maxRender)return{rows:[...all,...unknown,...create?[create]:[]],overflow:sourceOverflow};const originalIndex=new Map(all.map((r,i)=>[r,i])),capped=all.slice(0,this.maxRender),cappedValues=new Set(capped.map(r=>r.value));let appendedOutOfCap=!1;for(const v of this._selected)if(!cappedValues.has(v)){const selectedRow=all.find(r=>r.value===v);selectedRow&&(capped.push(selectedRow),appendedOutOfCap=!0)}return appendedOutOfCap&&capped.sort((a,b)=>originalIndex.get(a)-originalIndex.get(b)),capped.push(...unknown),create&&capped.push(create),{rows:capped,overflow:all.length-capped.length+unknown.length+(create?1:0)+sourceOverflow}}normalizeActiveIndex(){if(this.activeIndex<0)return;const navigableCount=this.renderedRows.rows.filter(row=>!row.disabled).length,next=navigableCount>0?Math.min(this.activeIndex,navigableCount-1):-1;next!==this.activeIndex&&(this.activeIndex=next)}get filtered(){const locale=this.effectiveLocale,q=this.query.trim().toLocaleLowerCase(locale),selectedLabel=this.multiple?"":this.labelFor(this._selected[0]??"")??"",effective=q&&q===selectedLabel.toLocaleLowerCase(locale)?"":q;if(!effective)return this.options;const fn=this.filter??((o,query2)=>o.label.toLocaleLowerCase(locale).includes(query2)||o.searchText.toLocaleLowerCase(locale).includes(query2));return this.options.filter(o=>fn(o,effective))}get displayValue(){return this.multiple||this.open||this.explicitInputValue?this.query:this._selected[0]?this.labelFor(this._selected[0]):""}announceOpenTransition(changed){this.openVetoed=!1;const closeAfterPositioningFailure=!this.open&&this.closeAfterPositioningFailure;if(this.closeAfterPositioningFailure=!1,!changed.has("open")||this._isFirstUpdate)return;const name=this.open?"lr-show":"lr-hide";if(!this.isConnected||closeAfterPositioningFailure){this.emit("lr-hide");return}this.emit(name,null,{cancelable:!0}).defaultPrevented&&(this.openVetoed=!0,this.open=!this.open,this.resolveTransitionWaiters(this.open?"lr-after-hide":"lr-after-show"))}show(){if(this.open||this.liveDisabled||this.readonly)return Promise.resolve();this.resolveTransitionWaiters("lr-after-hide");const settled=this.waitForTransition("lr-after-show");return this.open=!0,settled}hide(){if(!this.open)return Promise.resolve();this.resolveTransitionWaiters("lr-after-show");const settled=this.waitForTransition("lr-after-hide");return this.closeCleanupPending=!0,this.open=!1,settled}finalizeCloseState(){if(this.closeCleanupPending&&(this.closeCleanupPending=!1,this.activeIndex=-1,!this.multiple)){const queryChanged=this.query!=="";this.query="",this.explicitInputValue=!1,queryChanged&&this.source&&(this.asyncRows=[],this.sourceFailed=!1,this._sourceTotal=0,this._sourceTruncated=!1)}}activateListboxOverlay(){this.invalidateListboxPositioning(),this.overlayHandle?.deactivate({restoreFocus:!1}),this.restoreFocusOnClose=!0,this.overlayHandle=activateNonmodalOverlay({host:this,panel:()=>this.renderRoot.querySelector('[part="listbox"]'),onEscape:()=>{this.hide()},onBackdrop:()=>{this.restoreFocusOnClose=!1,this.hide()},restoreFocusTo:this.inputEl??null}),this.bindDocumentPointer(),this.beginListboxPositioning()}beginListboxPositioning(){const anchor=this.renderRoot.querySelector('[part="combobox"]'),listbox=this.renderRoot.querySelector('[part="listbox"]');if(anchor&&listbox){const generation=this.positioningGeneration;this.positioningReady=new Promise(resolve=>{this.resolvePositioningReady=resolve}),this.startListboxPositioning(generation,anchor,listbox)}}invalidateListboxPositioning(){this.positioningGeneration++,this.cleanup?.(),this.cleanup=void 0,this.resolvePositioningReady?.(!1),this.resolvePositioningReady=void 0}resolveCurrentPositioning(positioned){const resolve=this.resolvePositioningReady;this.resolvePositioningReady=void 0,resolve?.(positioned)}async startListboxPositioning(generation,anchor,listbox){try{const runtime=await loadAnchoredOverlayRuntime(),{place}=runtime;if(generation!==this.positioningGeneration||!this.open||!this.isConnected||this.renderRoot.querySelector('[part="combobox"]')!==anchor||this.renderRoot.querySelector('[part="listbox"]')!==listbox)return;this.placedTopLayer=syncTopLayerRelease(listbox,this.placedTopLayer,this.topLayer,runtime);const cleanup=place(anchor,listbox,{placement:`${this.placement}-start`,...topLayerPlacement(this.topLayer,resolveEffectivePositioningStrategy(this,this._positioningStrategy,"fixed")),sync:this.sync,onPlaced:()=>{generation===this.positioningGeneration&&(this.listboxPositioned=!0,this.updateComplete.then(()=>{generation!==this.positioningGeneration||!this.open||this.resolveCurrentPositioning(!0)}))}});generation!==this.positioningGeneration?cleanup():this.cleanup=cleanup}catch{if(generation!==this.positioningGeneration||!this.open)return;this.resolveCurrentPositioning(!1),this.closeAfterPositioningFailure=!0,this.hide()}}teardownListboxOverlay(restoreFocus=this.restoreFocusOnClose){this.invalidateListboxPositioning(),this.restoringOverlayFocus=restoreFocus;try{this.overlayHandle?.deactivate({restoreFocus})}finally{this.restoringOverlayFocus=!1}this.overlayHandle=void 0,this.unbindDocumentPointer(),this.restoreFocusOnClose=!0}bindDocumentPointer(){if(!this.isConnected)return;const ownerDocument=this.ownerDocument;if(this.pointerListenerDocument===ownerDocument&&this.pointerListener)return;this.unbindDocumentPointer();const listener=event=>{this.pointerListener!==listener||this.pointerListenerDocument!==ownerDocument||!this.isConnected||this.ownerDocument!==ownerDocument||this.onDocPointer(event)};this.pointerListenerDocument=ownerDocument,this.pointerListener=listener,ownerDocument.addEventListener("pointerdown",listener,!0)}unbindDocumentPointer(){this.pointerListenerDocument&&this.pointerListener&&this.pointerListenerDocument.removeEventListener("pointerdown",this.pointerListener,!0),this.pointerListenerDocument=void 0,this.pointerListener=void 0}reconnectOpenPopup(){!this.isConnected||!this.open||(this.activateListboxOverlay(),this.source&&this.asyncRows.length===0&&this.runSource(this.query))}syncVisibleOptionsCap(){const listbox=this.renderRoot?.querySelector('[part="listbox"]');if(!listbox)return;const clear=()=>{listbox.style.removeProperty("max-block-size")},requested=typeof this.visibleOptions=="number"?finiteCount(this.visibleOptions,0):0;if(requested<=0)return clear();const rows=listbox.querySelectorAll('[part="option"]');if(rows.length<=requested)return clear();const boundary=rows[requested];if(!boundary)return clear();const cap=boundary.getBoundingClientRect().top-listbox.getBoundingClientRect().top;if(!Number.isFinite(cap)||cap<=0)return clear();listbox.style.setProperty("max-block-size",`min(${Math.ceil(cap)}px, var(--lr-positioner-available-block-size, var(--lr-size-18rem)))`)}updated(changed){super.updated(changed),this.syncExternalDescription(),this.syncVisibleOptionsCap(),changed.has("open")&&!this.openVetoed?this.open&&this.isConnected?(this.activateListboxOverlay(),this._isFirstUpdate||this.settleTransition("lr-after-show"),this.refreshQueued?(this.refreshQueued=!1,this.runSource(this.query)):this.source&&this.asyncRows.length===0&&this.runSource(this.query)):this.open?this.teardownListboxOverlay(!1):(this.teardownListboxOverlay(),this._isFirstUpdate||this.settleTransition("lr-after-hide")):changed.has("open")&&this.openVetoed&&(this.restoreFocusOnClose=!0),changed.has("topLayer")&&!changed.has("open")&&this.open&&this.isConnected&&(this.invalidateListboxPositioning(),this.beginListboxPositioning()),changed.has("name")&&this.syncFormValue(),changed.has("validators")&&(this.updateValidity(),this.syncValidatorAttributeObserver()),(changed.has("touched")||changed.has("required")||changed.has("value")||changed.has("validators")||changed.has("validityRevision"))&&this.toggleAttribute("data-invalid",this.touched&&!this.internals.validity.valid),changed.has("activeIndex")&&this.renderRoot.querySelector('[part="option"][data-active]')?.scrollIntoView({block:"nearest"})}async settleTransition(event){const token=++this.transitionToken;if(await this.updateComplete,this.transitionToken===token){if(event==="lr-after-show"){for(;this.open&&!this.listboxPositioned;){const readiness=this.positioningReady,positioned=await readiness;if(this.transitionToken!==token)return;if(positioned)break;if(readiness===this.positioningReady)return}if(await this.updateComplete,this.transitionToken!==token)return}if(this.isConnected){const view=this.ownerDocument.defaultView;if(view&&await new Promise(resolve=>view.requestAnimationFrame(()=>resolve())),this.transitionToken!==token)return;const animations=this.renderRoot.querySelector('[part="listbox"]')?.getAnimations({subtree:!0})??[];if(await Promise.all(animations.map(animation=>animation.finished.catch(()=>{}))),this.transitionToken!==token)return}event==="lr-after-hide"&&(this.listboxHidden=!0,await this.updateComplete,this.transitionToken!==token)||(this.emit(event),this.resolveTransitionWaiters(event))}}waitForTransition(event){return new Promise(resolve=>{const waiters=this.transitionWaiters.get(event)??new Set;waiters.add(resolve),this.transitionWaiters.set(event,waiters)})}resolveTransitionWaiters(event){const waiters=this.transitionWaiters.get(event);if(waiters){this.transitionWaiters.delete(event);for(const resolve of waiters)resolve()}}emitValueEvents(){const self=this,data=this.resolveSelectedRowSlots().map(row=>row?.data);self.emit("input",{value:self.value,data}),self.emit("change",{value:self.value,data}),self.emit("lr-change",{value:self.value,data})}assignValue(next){this.value=next}createOption(inputValue){if(this.liveDisabled||this.readonly||this.emit("lr-create",{inputValue},{cancelable:!0}).defaultPrevented)return;const option=this.ownerDocument.createElement(tag("option"));option.setAttribute("value",inputValue),option.textContent=inputValue,this.append(option),this.pickRow({value:inputValue,label:inputValue})}commitCustomValue(inputValue){if(this.liveDisabled||this.readonly||this.multiple||!inputValue)return;const selectionChanged=this._selected[0]!==inputValue;this._selectedLabelCache.set(inputValue,inputValue),this.assignValue(inputValue),this.query="",this.explicitInputValue=!1,this.hide(),selectionChanged&&this.emitValueEvents()}pickRow(row){const sourceOption=this.sourceOptionsByRow.get(row);if(this.liveDisabled||this.readonly||row.disabled||sourceOption&&(sourceOption.disabled||sourceOption.closest("[inert]")))return;if(row.createInput!==void 0){this.createOption(row.createInput);return}const synthetic=row.unknownValue!==void 0,selectionChanged=this.multiple||this._selected[0]!==row.value;if(this.multiple){const set=new Set(this._selected);set.has(row.value)?(set.delete(row.value),this._selectedRowCache.delete(row.value)):(set.add(row.value),synthetic||(this._selectedLabelCache.set(row.value,row.label),this._selectedRowCache.set(row.value,row))),this.assignValue([...set]),this.query="",this.explicitInputValue=!1}else synthetic||(this._selectedLabelCache.set(row.value,row.label),this._selectedRowCache.clear(),this._selectedRowCache.set(row.value,row)),this.setValue(row.value,!0,sourceOption),this.query="",this.explicitInputValue=!1,this.hide();this.source&&this.runSource(this.query),selectionChanged&&this.emitValueEvents(),this.emit("lr-activate",{value:row.value})}removeValueAt(index){if(this.liveDisabled||this.readonly||index<0||index>=this._selected.length)return;const next=this._selected.filter((_,i)=>i!==index);this.assignValue(next),this.emitValueEvents()}clear(){if(this.liveDisabled||this.readonly)return;const hadSelection=this._selected.length>0,queryChanged=this.query!=="";!hadSelection&&!queryChanged||(hadSelection&&this.assignValue([]),this.query="",this.explicitInputValue=!1,this.source&&this.runSource(this.query),hadSelection&&(this.emitValueEvents(),this.emit("lr-clear")),queryChanged&&this.emit("lr-filter",{value:this.query}))}refresh(){if(this.source){if(!this.open){this.refreshQueued=!0;return}this.refreshQueued=!1,this.runSource(this.query,{immediate:!0})}}runSource(query2,options){const source=this.source;if(!source)return;this.clearSourceTimer(),this.sourceAbort?.abort(),this.sourceAbort=void 0;const token=++this.sourceToken,ownerWindow=this.ownerDocument.defaultView;if(!this.isConnected||!ownerWindow)return;const request={query:query2,token,owner:ownerWindow,source};if(options?.immediate){this.runSourceRequest(request);return}this.sourceDebounce.delayMs=this._sourceDelay,this.sourceDebounce.push(request)}runSourceRequest({query:query2,token,owner:ownerWindow,source}){if(token!==this.sourceToken||!this.isConnected||this.ownerDocument.defaultView!==ownerWindow)return;const controller=new ownerWindow.AbortController;this.sourceAbort=controller,this.sourceLoading=!0,this.sourceFailed=!1,Promise.resolve().then(()=>source(query2,{signal:controller.signal,limit:MAX_SOURCE_ROWS})).then(result=>{if(token!==this.sourceToken||!this.isConnected||this.ownerDocument.defaultView!==ownerWindow)return;const normalized=normalizeSourceResult(result);this._sourceTotal=normalized.total,this._sourceTruncated=normalized.truncated,this.asyncRows=normalized.rows,this.sourceFailed=!1,this.sourceEverSettled=!0,this.normalizeActiveIndex(),this.applyPendingSelectedRows(!0);const selected=new Set(this._selected);for(const row of normalized.rows)selected.has(row.value)&&this._selectedRowCache.set(row.value,row)}).catch(err=>{token!==this.sourceToken||!this.isConnected||this.ownerDocument.defaultView!==ownerWindow||typeof err=="object"&&err!==null&&"name"in err&&err.name==="AbortError"||(this.asyncRows=[],this._sourceTotal=0,this._sourceTruncated=!1,this.activeIndex=-1,this.sourceFailed=!0,this.sourceEverSettled=!0,this.sourceErrorAnnouncementSink?.announce(this.localize("comboboxLoadError")),this.emit("lr-source-error",{error:err,query:query2}),console.warn("<lr-combobox> source() rejected:",err))}).finally(()=>{token===this.sourceToken&&(this.sourceLoading=!1)})}clearSourceTimer(){this.sourceDebounce.cancel()}renderRows(rows,activeId){const out=[];let currentGroup,currentGroupRows=[],groupIndex=0;const selectedSet=new Set(this.multiple?this._selected:this._selected.slice(0,1)),flushGroup=()=>{if(currentGroupRows.length){if(currentGroup){const labelId=`${this.listId}-group-${groupIndex++}`;out.push(html`<div role="group" aria-labelledby=${labelId}>
|
|
2
2
|
<div id=${labelId} part="group-label" class="group-label">${currentGroup}</div>
|
|
3
3
|
${currentGroupRows}
|
|
4
4
|
</div>`)}else out.push(...currentGroupRows);currentGroupRows=[]}};return rows.forEach((o,i)=>{o.group!==currentGroup&&(flushGroup(),currentGroup=o.group);const id=`${this.listId}-opt-${i}`,selected=this.multiple||this.source?selectedSet.has(o.value):this.singleSelectedOption!==void 0&&this.sourceOptionsByRow.get(o)===this.singleSelectedOption;selected&&!this.multiple&&selectedSet.delete(o.value),currentGroupRows.push(html`<div
|
|
@@ -48,7 +48,11 @@ import{__decorate}from"tslib";import{GlassScrollLayer}from"../../../internal/gla
|
|
|
48
48
|
>
|
|
49
49
|
<span part="label">${this.label}<slot name="label"></slot></span>
|
|
50
50
|
</label>
|
|
51
|
-
<div
|
|
51
|
+
<div
|
|
52
|
+
part="combobox"
|
|
53
|
+
@mousedown=${this.onComboMouseDown}
|
|
54
|
+
@focusout=${this.onComboFocusOut}
|
|
55
|
+
>
|
|
52
56
|
<span part="form-control-input" class="control-contents">
|
|
53
57
|
<span part="start" ?hidden=${!this.slotPresence.has("start")}>
|
|
54
58
|
<slot name="start"></slot>
|
|
@@ -94,7 +98,8 @@ import{__decorate}from"tslib";import{GlassScrollLayer}from"../../../internal/gla
|
|
|
94
98
|
type="button"
|
|
95
99
|
?disabled=${this.effectiveDisabled||this.readonly}
|
|
96
100
|
aria-label=${this.localize("clear")}
|
|
97
|
-
@
|
|
101
|
+
@mousedown=${e=>e.preventDefault()}
|
|
102
|
+
@click=${e=>{e.stopPropagation(),this.clear();const restoringFocus=this.restoringOverlayFocus;this.restoringOverlayFocus=!0;try{this.inputEl?.focus()}finally{this.restoringOverlayFocus=restoringFocus}}}
|
|
98
103
|
>
|
|
99
104
|
<span aria-hidden="true" inert
|
|
100
105
|
><slot name="clear-icon">${closeIcon()}</slot></span
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{css}from"lit";import{glassSurface}from"../../../internal/glass-surface.styles.js";import{glassScrollLayerStyles}from"../../../internal/glass-scroll-layer.styles.js";import{glassIndependentRootStyles}from"../../../internal/glass-independent-root.styles.js";import{formControlFocusHalo,formControlRequiredMarker}from"../../../internal/form-control.styles.js";import{overlaySurfaceFill,overlaySurfaceControlEdge}from"../../../internal/overlay-surface.styles.js";const styles=css` :host { display: block; --_lr-locale-picker-trigger-padding-default: var(--lr-space-xs) var(--lr-space-s); --_lr-locale-picker-trigger-min-height-default: var(--lr-form-control-height); --_lr-locale-picker-font-size-default: var(--lr-form-control-font-size); --_lr-locale-picker-expand-size-default: var(--lr-size-1-75rem); --_lr-locale-picker-gap-default: var(--lr-space-xs); --_lr-locale-picker-radius-default: var(--lr-form-control-radius); --_lr-form-control-focus-shadow: var(--lr-form-control-focus-shadow, none); } :host([size='2xs']) { --_lr-locale-picker-trigger-padding-default: var(--lr-size-0-0625rem) var(--lr-space-2xs); --_lr-locale-picker-expand-size-default: var(--lr-size-1rem); } :host([size='xs']) { --_lr-locale-picker-trigger-padding-default: var(--lr-size-0-125rem) var(--lr-space-xs); --_lr-locale-picker-expand-size-default: var(--lr-size-1rem); } :host([size='s']), :host([size='small']) { --_lr-locale-picker-trigger-padding-default: var(--lr-space-xs) var(--lr-space-xs); --_lr-locale-picker-expand-size-default: var(--lr-size-1-25rem); } :host([size='l']), :host([size='large']) { --_lr-locale-picker-trigger-padding-default: var(--lr-space-s) var(--lr-space-m); } :host([size='xl']) { --_lr-locale-picker-trigger-padding-default: var(--lr-space-m) var(--lr-space-l); } [part='form-control-label'] { display: block; margin-block-end: var(--lr-space-xs); font-size: var(--lr-font-size-md-sm); font-weight: var(--lr-font-weight-semibold); } [part='form-control-label'][hidden] { display: none; } ${formControlRequiredMarker} [part='trigger'] { display: flex; align-items: center; justify-content: space-between; gap: var(--lr-locale-picker-gap, var(--_lr-locale-picker-gap-default)); inline-size: 100%; min-block-size: var(--lr-locale-picker-trigger-height, var(--lr-locale-picker-trigger-min-height, var(--_lr-locale-picker-trigger-min-height-default))); box-sizing: border-box; block-size: var(--lr-locale-picker-trigger-height, auto); padding: var(--lr-locale-picker-trigger-padding, var(--_lr-locale-picker-trigger-padding-default)); border: var(--lr-border-width-thin) solid var(--lr-locale-picker-trigger-border-color, var(--lr-color-border)); border-radius: var(--lr-locale-picker-radius, var(--_lr-locale-picker-radius-default)); background: var(--lr-locale-picker-trigger-fill, var(--lr-color-surface)); color: inherit; font: inherit; font-size: var(--lr-locale-picker-font-size, var(--_lr-locale-picker-font-size-default)); text-align: start; cursor: pointer; transition: background-color var(--lr-transition-fast), border-color var(--lr-transition-fast); } [part='trigger']:focus-visible { outline: var(--lr-focus-ring-width) solid var(--lr-focus-ring-color); outline-offset: var(--lr-focus-ring-offset); } [part='trigger']:focus { ${formControlFocusHalo} } [part='trigger']:where(.flag-only) { --_lr-locale-picker-compact-size: max(var(--lr-size-24px), var(--lr-locale-picker-trigger-height, var(--lr-locale-picker-trigger-min-height, var(--_lr-locale-picker-trigger-min-height-default)))); inline-size: var(--_lr-locale-picker-compact-size); block-size: var(--_lr-locale-picker-compact-size); min-inline-size: min(var(--lr-icon-button-size), var(--_lr-locale-picker-compact-size)); min-block-size: min(var(--lr-icon-button-size), var(--_lr-locale-picker-compact-size)); justify-content: center; padding: var(--lr-locale-picker-trigger-padding, 0); } :where([part='trigger']):hover:where(:not(:disabled)) { background: var(--lr-locale-picker-trigger-hover-bg, var(--lr-color-brand-quiet)); border-color: var( --lr-locale-picker-trigger-hover-border-color, var(--lr-locale-picker-trigger-border-color, var(--lr-color-border)) ); } :where([part='trigger']):active:where(:not(:disabled)) { background: color-mix( in oklab, var(--lr-locale-picker-trigger-hover-bg, var(--lr-color-brand-quiet)), var(--lr-color-mix-partner) var(--lr-color-mix-active) ); } :host([open]) [part='trigger'] { border-color: var(--lr-locale-picker-open-border-color, var(--lr-color-brand)); ${formControlFocusHalo} } :host(:disabled) [part='trigger'] { opacity: var(--lr-opacity-disabled); cursor: not-allowed; } [part='trigger-flag'] { flex: 0 0 auto; } .trigger-label { flex: 1 1 auto; min-inline-size: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } [part='expand-icon'] { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; color: var(--lr-color-text-quiet); min-inline-size: min(var(--lr-icon-button-size), var(--lr-locale-picker-expand-size, var(--_lr-locale-picker-expand-size-default))); min-block-size: min(var(--lr-icon-button-size), var(--lr-locale-picker-expand-size, var(--_lr-locale-picker-expand-size-default))); line-height: var(--lr-line-height-none); } [part='expand-icon'] svg { transform: rotate(90deg); } [part='listbox'][hidden] { display: none; } [part='listbox'] { position: fixed; z-index: var(--lr-overlay-stack-index, var(--lr-layer-dropdown)); box-sizing: border-box; max-block-size: var(--lr-size-18rem); overflow-y: auto; overflow-x: hidden; inline-size: max-content; min-inline-size: min(var(--lr-size-12rem), var(--lr-popover-viewport-clamp), var(--lr-size-28rem)); max-inline-size: min(var(--lr-popover-viewport-clamp), var(--lr-size-28rem)); padding: var(--lr-space-xs); ${overlaySurfaceFill} ${overlaySurfaceControlEdge} border-radius: var( --lr-locale-picker-radius, var(--lr-overlay-radius, var(--_lr-locale-picker-radius-default)) ); box-shadow: var(--lr-overlay-shadow-anchored, var(--lr-shadow-m)); visibility: hidden; opacity: 0; transform: translateY(var(--lr-size-neg-0-25rem)); transition: opacity var(--lr-transition-fast), transform var(--lr-transition-fast), visibility var(--lr-transition-fast); } :host([open]) [part='listbox'] { visibility: visible; opacity: 1; transform: translateY(0); } @media (prefers-reduced-motion: reduce) { [part='listbox'] { transition: none !important; } } [part='option'] { display: flex; align-items: center; gap: var(--lr-locale-picker-gap, var(--_lr-locale-picker-gap-default)); inline-size: 100%; box-sizing: border-box; padding: var(--lr-space-xs) var(--lr-space-s); border: var(--lr-border-width-thin) solid transparent; border-radius: var(--lr-locale-picker-radius, var(--_lr-locale-picker-radius-default)); background: none; color: inherit; font: inherit; text-align: start; cursor: pointer; transition: background-color var(--lr-transition-fast); } [part='option']:hover { background: var( --lr-locale-picker-option-active-bg, var(--lr-color-brand-quiet) ); } [part='option'][data-active] { background: var(--lr-locale-picker-option-active-bg, var(--lr-color-brand-quiet)); } [part='option']:active { background: color-mix( in oklab, var(--lr-locale-picker-option-active-bg, var(--lr-color-brand-quiet)), var(--lr-color-mix-partner) var(--lr-color-mix-active) ); } [part='option'][aria-selected='true'] { border-color: var(--lr-locale-picker-option-selected-border-color, var(--lr-color-brand)); color: var(--lr-locale-picker-option-selected-color, var(--lr-color-brand)); font-weight: var(--lr-locale-picker-option-selected-font-weight, var(--lr-font-weight-semibold)); } @media (forced-colors: active) { :where([part='trigger']):hover:where(:not(:disabled)) { outline: var(--lr-border-width-thin) dashed Highlight; outline-offset: calc(-1 * var(--lr-border-width-thin)); } :where([part="trigger"]):active:where(:not(:disabled)) { outline-style: double; outline-width: var(--lr-border-width-medium); } [part="option"][data-active] { outline: var(--lr-border-width-thin) dashed Highlight; outline-offset: calc(-1 * var(--lr-border-width-thin)); } [part="option"][aria-selected="true"] { border-color: Highlight; border-style: double; } } [part='option-flag'] { flex: 0 0 auto; } [part='option-label'] { display: flex; flex-direction: column; min-inline-size: 0; overflow: hidden; } [part='option-label'] span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } [part='option-tag'] { font-size: var(--lr-font-size-xs); color: var(--lr-color-text-quiet); } [part='load-status'] { display: flex; flex-wrap: wrap; align-items: center; gap: var(--lr-space-xs); margin-block-start: var(--lr-space-xs); color: var(--lr-color-text-quiet); font-size: var(--lr-font-size-sm); overflow-wrap: anywhere; } [part='load-retry'] { min-inline-size: var(--lr-icon-button-size); min-block-size: var(--lr-icon-button-size); padding: var(--lr-space-xs) var(--lr-space-s); border: var(--lr-border-width-thin) solid var(--lr-color-border); border-radius: var(--lr-radius-button); background: var(--lr-color-surface); color: var(--lr-color-text); font: inherit; cursor: pointer; transition: background var(--lr-transition-fast), box-shadow var(--lr-transition-fast); } [part='load-retry']:where(:hover:not(:disabled)) { background: color-mix(in oklab, var(--lr-color-surface), var(--lr-color-text) var(--lr-color-mix-hover)); } [part='load-retry']:where(:active:not(:disabled)) { background: color-mix(in oklab, var(--lr-color-surface), var(--lr-color-text) var(--lr-color-mix-active)); } [part='load-retry']:focus-visible { outline: var(--lr-focus-ring-width) solid var(--lr-focus-ring-color); outline-offset: var(--lr-focus-ring-offset); } [part='load-retry']:where(:disabled) { cursor: default; opacity: var(--lr-opacity-disabled); } @media (prefers-reduced-motion: reduce) { [part='load-retry'] { transition: none; } } [part='hint'] { margin-block-start: var(--lr-space-xs); font-size: var(--lr-font-size-sm); color: var(--lr-color-text-quiet); } [part='hint'][hidden] { display: none; } [part='error'] { margin-block-start: var(--lr-space-xs); font-size: var(--lr-font-size-sm); color: var(--lr-color-danger); } [part='error'][hidden] { display: none; } [part='form-control'], [part='form-control-label'], [part='hint'], [part='error'] { min-inline-size: 0; max-inline-size: 100%; overflow-wrap: anywhere; } ${glassScrollLayerStyles} ${glassIndependentRootStyles} ${glassSurface('[part="listbox"]',css`var(--lr-overlay-surface, var(--_lr-overlay-surface, var(--lr-color-surface-container-high)))`,void 0,!0)} `;export{styles};
|
|
1
|
+
import{css}from"lit";import{glassSurface}from"../../../internal/glass-surface.styles.js";import{glassScrollLayerStyles}from"../../../internal/glass-scroll-layer.styles.js";import{glassIndependentRootStyles}from"../../../internal/glass-independent-root.styles.js";import{formControlFocusHalo,formControlRequiredMarker}from"../../../internal/form-control.styles.js";import{overlaySurfaceFill,overlaySurfaceControlEdge}from"../../../internal/overlay-surface.styles.js";const styles=css` :host { display: block; --_lr-locale-picker-trigger-padding-default: var(--lr-space-xs) var(--lr-space-s); --_lr-locale-picker-trigger-min-height-default: var(--lr-form-control-height); --_lr-locale-picker-font-size-default: var(--lr-form-control-font-size); --_lr-locale-picker-expand-size-default: var(--lr-size-1-75rem); --_lr-locale-picker-gap-default: var(--lr-space-xs); --_lr-locale-picker-radius-default: var(--lr-form-control-radius); --_lr-form-control-focus-shadow: var(--lr-form-control-focus-shadow, none); } :host([size='2xs']) { --_lr-locale-picker-trigger-padding-default: var(--lr-size-0-0625rem) var(--lr-space-2xs); --_lr-locale-picker-expand-size-default: var(--lr-size-1rem); } :host([size='xs']) { --_lr-locale-picker-trigger-padding-default: var(--lr-size-0-125rem) var(--lr-space-xs); --_lr-locale-picker-expand-size-default: var(--lr-size-1rem); } :host([size='s']), :host([size='small']) { --_lr-locale-picker-trigger-padding-default: var(--lr-space-xs) var(--lr-space-xs); --_lr-locale-picker-expand-size-default: var(--lr-size-1-25rem); } :host([size='l']), :host([size='large']) { --_lr-locale-picker-trigger-padding-default: var(--lr-space-s) var(--lr-space-m); } :host([size='xl']) { --_lr-locale-picker-trigger-padding-default: var(--lr-space-m) var(--lr-space-l); } [part='form-control-label'] { display: block; margin-block-end: var(--lr-space-xs); font-size: var(--lr-font-size-md-sm); font-weight: var(--lr-font-weight-semibold); } [part='form-control-label'][hidden] { display: none; } ${formControlRequiredMarker} [part='trigger'] { display: flex; align-items: center; justify-content: space-between; gap: var(--lr-locale-picker-gap, var(--_lr-locale-picker-gap-default)); inline-size: 100%; min-block-size: var(--lr-locale-picker-trigger-height, var(--lr-locale-picker-trigger-min-height, var(--_lr-locale-picker-trigger-min-height-default))); box-sizing: border-box; block-size: var(--lr-locale-picker-trigger-height, auto); padding: var(--lr-locale-picker-trigger-padding, var(--_lr-locale-picker-trigger-padding-default)); border: var(--lr-border-width-thin) solid var(--lr-locale-picker-trigger-border-color, var(--lr-color-border)); border-radius: var(--lr-locale-picker-radius, var(--_lr-locale-picker-radius-default)); background: var(--lr-locale-picker-trigger-fill, var(--lr-color-surface)); color: inherit; font: inherit; font-size: var(--lr-locale-picker-font-size, var(--_lr-locale-picker-font-size-default)); text-align: start; cursor: pointer; transition: background-color var(--lr-transition-fast), border-color var(--lr-transition-fast); } [part='trigger']:focus-visible { outline: var(--lr-focus-ring-width) solid var(--lr-focus-ring-color); outline-offset: var(--lr-focus-ring-offset); } [part='trigger']:focus { ${formControlFocusHalo} } [part='trigger']:where(.flag-only) { --_lr-locale-picker-compact-size: max(var(--lr-size-24px), var(--lr-locale-picker-trigger-height, var(--lr-locale-picker-trigger-min-height, var(--_lr-locale-picker-trigger-min-height-default)))); inline-size: var(--_lr-locale-picker-compact-size); block-size: var(--_lr-locale-picker-compact-size); min-inline-size: min(var(--lr-icon-button-size), var(--_lr-locale-picker-compact-size)); min-block-size: min(var(--lr-icon-button-size), var(--_lr-locale-picker-compact-size)); justify-content: center; padding: var(--lr-locale-picker-trigger-padding, 0); } :where([part='trigger']):hover:where(:not(:disabled)) { background: var(--lr-locale-picker-trigger-hover-bg, var(--lr-color-brand-quiet)); border-color: var( --lr-locale-picker-trigger-hover-border-color, var(--lr-locale-picker-trigger-border-color, var(--lr-color-border)) ); } :where([part='trigger']):active:where(:not(:disabled)) { background: color-mix( in oklab, var(--lr-locale-picker-trigger-hover-bg, var(--lr-color-brand-quiet)), var(--lr-color-mix-partner) var(--lr-color-mix-active) ); } :host([open]) [part='trigger'] { border-color: var(--lr-locale-picker-open-border-color, var(--lr-color-brand)); ${formControlFocusHalo} } :host(:disabled) [part='trigger'] { opacity: var(--lr-opacity-disabled); cursor: not-allowed; } [part='trigger-flag'] { flex: 0 0 auto; } .trigger-label { flex: 1 1 auto; min-inline-size: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } [part='expand-icon'] { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; color: var(--lr-color-text-quiet); min-inline-size: min(var(--lr-icon-button-size), var(--lr-locale-picker-expand-size, var(--_lr-locale-picker-expand-size-default))); min-block-size: min(var(--lr-icon-button-size), var(--lr-locale-picker-expand-size, var(--_lr-locale-picker-expand-size-default))); line-height: var(--lr-line-height-none); } [part='expand-icon'] svg { transform: rotate(90deg); } [part='listbox'][hidden] { display: none; } [part='listbox'] { position: fixed; z-index: var(--lr-overlay-stack-index, var(--lr-layer-dropdown)); box-sizing: border-box; max-block-size: var(--lr-size-18rem); overflow-y: auto; overflow-x: hidden; inline-size: max-content; min-inline-size: min(var(--lr-size-12rem), var(--lr-popover-viewport-clamp), var(--lr-size-28rem)); max-inline-size: min(var(--lr-popover-viewport-clamp), var(--lr-size-28rem)); padding: var(--lr-space-xs); ${overlaySurfaceFill} ${overlaySurfaceControlEdge} border-radius: var( --lr-locale-picker-radius, var(--lr-overlay-radius, var(--_lr-locale-picker-radius-default)) ); box-shadow: var(--lr-overlay-shadow-anchored, var(--lr-shadow-m)); visibility: hidden; opacity: 0; transform: translateY(var(--lr-size-neg-0-25rem)); transition: opacity var(--lr-transition-fast), transform var(--lr-transition-fast), visibility var(--lr-transition-fast); } :host([open]) [part='listbox'] { visibility: visible; opacity: 1; transform: translateY(0); } @media (prefers-reduced-motion: reduce) { [part='listbox'] { transition: none !important; } } [part='option'] { display: flex; align-items: center; gap: var(--lr-locale-picker-gap, var(--_lr-locale-picker-gap-default)); inline-size: 100%; box-sizing: border-box; min-block-size: max(var(--lr-form-control-height-m), var(--lr-form-control-height)); padding: var(--lr-space-xs) var(--lr-space-s); border: var(--lr-border-width-thin) solid transparent; border-radius: var(--lr-locale-picker-radius, var(--_lr-locale-picker-radius-default)); background: none; color: inherit; font: inherit; text-align: start; cursor: pointer; transition: background-color var(--lr-transition-fast); } [part='option']:hover { background: var( --lr-locale-picker-option-active-bg, var(--lr-color-brand-quiet) ); } [part='option'][data-active] { background: var(--lr-locale-picker-option-active-bg, var(--lr-color-brand-quiet)); } [part='option']:active { background: color-mix( in oklab, var(--lr-locale-picker-option-active-bg, var(--lr-color-brand-quiet)), var(--lr-color-mix-partner) var(--lr-color-mix-active) ); } [part='option'][aria-selected='true'] { border-color: var(--lr-locale-picker-option-selected-border-color, var(--lr-color-brand)); color: var(--lr-locale-picker-option-selected-color, var(--lr-color-brand)); font-weight: var(--lr-locale-picker-option-selected-font-weight, var(--lr-font-weight-semibold)); } @media (forced-colors: active) { :where([part='trigger']):hover:where(:not(:disabled)) { outline: var(--lr-border-width-thin) dashed Highlight; outline-offset: calc(-1 * var(--lr-border-width-thin)); } :where([part="trigger"]):active:where(:not(:disabled)) { outline-style: double; outline-width: var(--lr-border-width-medium); } [part="option"][data-active] { outline: var(--lr-border-width-thin) dashed Highlight; outline-offset: calc(-1 * var(--lr-border-width-thin)); } [part="option"][aria-selected="true"] { border-color: Highlight; border-style: double; } } [part='option-flag'] { flex: 0 0 auto; } [part='option-label'] { display: flex; flex-direction: column; min-inline-size: 0; overflow: hidden; } [part='option-label'] span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } [part='option-tag'] { font-size: var(--lr-font-size-xs); color: var(--lr-color-text-quiet); } [part='load-status'] { display: flex; flex-wrap: wrap; align-items: center; gap: var(--lr-space-xs); margin-block-start: var(--lr-space-xs); color: var(--lr-color-text-quiet); font-size: var(--lr-font-size-sm); overflow-wrap: anywhere; } [part='load-retry'] { min-inline-size: var(--lr-icon-button-size); min-block-size: var(--lr-icon-button-size); padding: var(--lr-space-xs) var(--lr-space-s); border: var(--lr-border-width-thin) solid var(--lr-color-border); border-radius: var(--lr-radius-button); background: var(--lr-color-surface); color: var(--lr-color-text); font: inherit; cursor: pointer; transition: background var(--lr-transition-fast), box-shadow var(--lr-transition-fast); } [part='load-retry']:where(:hover:not(:disabled)) { background: color-mix(in oklab, var(--lr-color-surface), var(--lr-color-text) var(--lr-color-mix-hover)); } [part='load-retry']:where(:active:not(:disabled)) { background: color-mix(in oklab, var(--lr-color-surface), var(--lr-color-text) var(--lr-color-mix-active)); } [part='load-retry']:focus-visible { outline: var(--lr-focus-ring-width) solid var(--lr-focus-ring-color); outline-offset: var(--lr-focus-ring-offset); } [part='load-retry']:where(:disabled) { cursor: default; opacity: var(--lr-opacity-disabled); } @media (prefers-reduced-motion: reduce) { [part='load-retry'] { transition: none; } } [part='hint'] { margin-block-start: var(--lr-space-xs); font-size: var(--lr-font-size-sm); color: var(--lr-color-text-quiet); } [part='hint'][hidden] { display: none; } [part='error'] { margin-block-start: var(--lr-space-xs); font-size: var(--lr-font-size-sm); color: var(--lr-color-danger); } [part='error'][hidden] { display: none; } [part='form-control'], [part='form-control-label'], [part='hint'], [part='error'] { min-inline-size: 0; max-inline-size: 100%; overflow-wrap: anywhere; } ${glassScrollLayerStyles} ${glassIndependentRootStyles} ${glassSurface('[part="listbox"]',css`var(--lr-overlay-surface, var(--_lr-overlay-surface, var(--lr-color-surface-container-high)))`,void 0,!0)} `;export{styles};
|
|
@@ -144,7 +144,7 @@ rel?:string;private get resolvedRel();private hasHeaderSlot;private hasMediaSlot
|
|
|
144
144
|
* click on `<lr-button>` retargets to the host, but its composed path still contains the
|
|
145
145
|
* internal native `<button>`.
|
|
146
146
|
*/
|
|
147
|
-
private originatesInNestedControl;private onBaseClick;private onLinkedContentClick;connectedCallback():void;private recomputeAccessibleContentText;private armContentObserver;disconnectedCallback():void;adoptedCallback():void;private resetContentObserver;
|
|
147
|
+
private originatesInNestedControl;private onBaseClick;private onLinkedContentClick;connectedCallback():void;private needsAccessibleContentText;private syncAccessibleContentText;private recomputeAccessibleContentText;private armContentObserver;disconnectedCallback():void;adoptedCallback():void;private resetContentObserver;
|
|
148
148
|
/** Activates the native whole-card owner: the linked anchor when `href` is safe, or the
|
|
149
149
|
* activation button while `actionable` is set without a link. Passive and `disabled` cards
|
|
150
150
|
* remain inert. */
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{__decorate}from"tslib";import{CustomElementUpgradeObserver}from"../../../internal/custom-element-upgrade-observer.js";import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{activeElementIn}from"../../../internal/active-element.js";import{hostAriaLabel}from"../../../internal/a11y.js";import{declaredDefaultConverter}from"../../../internal/converters.js";import{bindAccessibleTextObserver,composedAccessibilityText}from"../../../internal/accessibility-visibility.js";import{resolveGuardedRel}from"../../../internal/link-rel.js";import{LyraElement}from"../../../internal/lyra-element.js";import{safeLinkHref}from"../../../internal/safe-url.js";import{styles}from"./card.styles.js";import{LYRA_DEFAULT_open}from"../../../internal/default-strings.generated.js";const NESTED_CONTROL_SELECTOR=["a[href]","button","input","select","textarea","summary","audio[controls]","video[controls]","label",'[contenteditable]:not([contenteditable="false"])','[tabindex]:not([tabindex="-1"])','[role="button"]','[role="link"]','[role="checkbox"]','[role="switch"]','[role="radio"]','[role="menuitem"]','[role="option"]','[role="tab"]','[role="textbox"]','[role="slider"]','[role="spinbutton"]'].join(",");function isElementNode(value){return typeof value=="object"&&value!==null&&value.nodeType===1&&typeof value.matches=="function"}class LyraCard extends LyraElement{constructor(){super(...arguments),this.appearance="outlined",this.orientation="vertical",this.withHeader=!1,this.withHeaderActions=!1,this.withMedia=!1,this.withFooter=!1,this.withFooterActions=!1,this.actionable=!1,this.disabled=!1,this.accessibleLabel=null,this.triggerPressed=null,this.triggerCurrent=null,this.hasHeaderSlot=!1,this.hasMediaSlot=!1,this.hasImageSlot=!1,this.hasFooterSlot=!1,this.hasActionsSlot=!1,this.hasHeaderActionsSlot=!1,this.hasFooterActionsSlot=!1,this.accessibleContentText="",this.contentUpgrades=new CustomElementUpgradeObserver(()=>{!this.isConnected||!this.contentObserver||(this.recomputeAccessibleContentText(),bindAccessibleTextObserver(this.contentObserver,this,["alt","aria-labelledby","slot"],this.contentUpgrades))}),this.contentObserverGeneration=0,this.onHeaderSlotChange=e=>{this.hasHeaderSlot=e.target.assignedElements({flatten:!0}).length>0},this.onMediaSlotChange=e=>{this.hasMediaSlot=e.target.assignedElements({flatten:!0}).length>0},this.onImageSlotChange=e=>{this.hasImageSlot=e.target.assignedElements({flatten:!0}).length>0},this.onFooterSlotChange=e=>{this.hasFooterSlot=e.target.assignedElements({flatten:!0}).length>0},this.onActionsSlotChange=e=>{this.hasActionsSlot=e.target.assignedElements({flatten:!0}).length>0},this.onHeaderActionsSlotChange=e=>{this.hasHeaderActionsSlot=e.target.assignedElements({flatten:!0}).length>0},this.onFooterActionsSlotChange=e=>{this.hasFooterActionsSlot=e.target.assignedElements({flatten:!0}).length>0},this.onBaseClick=e=>{if(this.disabled)return;const origin=e.composedPath()[0];if(isElementNode(origin)&&origin.getAttribute("part")==="activation-button"){this.emit("lr-card-activate",null);return}this.originatesInNestedControl(e,e.currentTarget)||this.emit("lr-card-activate",null)},this.onLinkedContentClick=e=>{this.disabled||e.defaultPrevented||this.originatesInNestedControl(e,e.currentTarget)||(e.stopPropagation(),this.renderRoot.querySelector('a[part~="base"][href]')?.click())}}static{this.defaultStrings={...super.defaultStrings,open:LYRA_DEFAULT_open}}static{this.styles=[LyraElement.styles,styles]}get resolvedRel(){return resolveGuardedRel(this.rel,this.target)}semanticOwner(){const root=this.renderRoot;return root?root.querySelector('a[part="base"]')??root.querySelector('button[part="activation-button"]')??root.querySelector('div[part="base"]'):null}willUpdate(changed){if(super.willUpdate(changed),changed.has("href")||changed.has("actionable")){const previous=this.semanticOwner(),nextKind=safeLinkHref(this.href)?"a":this.actionable?"button":"div";this.semanticFocusOrigin=previous!==null&&previous.localName!==nextKind&&activeElementIn(this.shadowRoot)===previous?previous:void 0}this.hasUpdated||(this.hasHeaderSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="header"),this.hasMediaSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="media"),this.hasImageSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="image"),this.hasFooterSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="footer"),this.hasActionsSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="actions"),this.hasHeaderActionsSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="header-actions"),this.hasFooterActionsSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="footer-actions"),this.
|
|
1
|
+
import{__decorate}from"tslib";import{CustomElementUpgradeObserver}from"../../../internal/custom-element-upgrade-observer.js";import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{activeElementIn}from"../../../internal/active-element.js";import{hostAriaLabel}from"../../../internal/a11y.js";import{declaredDefaultConverter}from"../../../internal/converters.js";import{bindAccessibleTextObserver,composedAccessibilityText}from"../../../internal/accessibility-visibility.js";import{resolveGuardedRel}from"../../../internal/link-rel.js";import{LyraElement}from"../../../internal/lyra-element.js";import{safeLinkHref}from"../../../internal/safe-url.js";import{styles}from"./card.styles.js";import{LYRA_DEFAULT_open}from"../../../internal/default-strings.generated.js";const NESTED_CONTROL_SELECTOR=["a[href]","button","input","select","textarea","summary","audio[controls]","video[controls]","label",'[contenteditable]:not([contenteditable="false"])','[tabindex]:not([tabindex="-1"])','[role="button"]','[role="link"]','[role="checkbox"]','[role="switch"]','[role="radio"]','[role="menuitem"]','[role="option"]','[role="tab"]','[role="textbox"]','[role="slider"]','[role="spinbutton"]'].join(",");function isElementNode(value){return typeof value=="object"&&value!==null&&value.nodeType===1&&typeof value.matches=="function"}class LyraCard extends LyraElement{constructor(){super(...arguments),this.appearance="outlined",this.orientation="vertical",this.withHeader=!1,this.withHeaderActions=!1,this.withMedia=!1,this.withFooter=!1,this.withFooterActions=!1,this.actionable=!1,this.disabled=!1,this.accessibleLabel=null,this.triggerPressed=null,this.triggerCurrent=null,this.hasHeaderSlot=!1,this.hasMediaSlot=!1,this.hasImageSlot=!1,this.hasFooterSlot=!1,this.hasActionsSlot=!1,this.hasHeaderActionsSlot=!1,this.hasFooterActionsSlot=!1,this.accessibleContentText="",this.contentUpgrades=new CustomElementUpgradeObserver(()=>{!this.isConnected||!this.contentObserver||!this.needsAccessibleContentText()||(this.recomputeAccessibleContentText(),bindAccessibleTextObserver(this.contentObserver,this,["alt","aria-labelledby","slot"],this.contentUpgrades))}),this.contentObserverGeneration=0,this.onHeaderSlotChange=e=>{this.hasHeaderSlot=e.target.assignedElements({flatten:!0}).length>0},this.onMediaSlotChange=e=>{this.hasMediaSlot=e.target.assignedElements({flatten:!0}).length>0},this.onImageSlotChange=e=>{this.hasImageSlot=e.target.assignedElements({flatten:!0}).length>0},this.onFooterSlotChange=e=>{this.hasFooterSlot=e.target.assignedElements({flatten:!0}).length>0},this.onActionsSlotChange=e=>{this.hasActionsSlot=e.target.assignedElements({flatten:!0}).length>0},this.onHeaderActionsSlotChange=e=>{this.hasHeaderActionsSlot=e.target.assignedElements({flatten:!0}).length>0},this.onFooterActionsSlotChange=e=>{this.hasFooterActionsSlot=e.target.assignedElements({flatten:!0}).length>0},this.onBaseClick=e=>{if(this.disabled)return;const origin=e.composedPath()[0];if(isElementNode(origin)&&origin.getAttribute("part")==="activation-button"){this.emit("lr-card-activate",null);return}this.originatesInNestedControl(e,e.currentTarget)||this.emit("lr-card-activate",null)},this.onLinkedContentClick=e=>{this.disabled||e.defaultPrevented||this.originatesInNestedControl(e,e.currentTarget)||(e.stopPropagation(),this.renderRoot.querySelector('a[part~="base"][href]')?.click())}}static{this.defaultStrings={...super.defaultStrings,open:LYRA_DEFAULT_open}}static{this.styles=[LyraElement.styles,styles]}get resolvedRel(){return resolveGuardedRel(this.rel,this.target)}semanticOwner(){const root=this.renderRoot;return root?root.querySelector('a[part="base"]')??root.querySelector('button[part="activation-button"]')??root.querySelector('div[part="base"]'):null}willUpdate(changed){if(super.willUpdate(changed),changed.has("href")||changed.has("actionable")){const previous=this.semanticOwner(),nextKind=safeLinkHref(this.href)?"a":this.actionable?"button":"div";this.semanticFocusOrigin=previous!==null&&previous.localName!==nextKind&&activeElementIn(this.shadowRoot)===previous?previous:void 0}this.hasUpdated||(this.hasHeaderSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="header"),this.hasMediaSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="media"),this.hasImageSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="image"),this.hasFooterSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="footer"),this.hasActionsSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="actions"),this.hasHeaderActionsSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="header-actions"),this.hasFooterActionsSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="footer-actions")),this.syncAccessibleContentText()}updated(changed){super.updated(changed);const focusOrigin=this.semanticFocusOrigin;this.semanticFocusOrigin=void 0,focusOrigin&&this.scheduleAfterUpdate(()=>{const internalActive=activeElementIn(this.shadowRoot),documentActive=activeElementIn(this.ownerDocument);if(internalActive!==null&&internalActive!==focusOrigin||documentActive!==null&&documentActive!==this&&documentActive!==this.ownerDocument.body)return;this.semanticOwner()?.focus()},"card-owner-focus")}originatesInNestedControl(e,root){for(const node of e.composedPath()){if(node===root)return!1;if(isElementNode(node)&&node.matches(NESTED_CONTROL_SELECTOR))return!0}return!1}connectedCallback(){super.connectedCallback(),this.requestUpdate()}needsAccessibleContentText(){return this.actionable&&!safeLinkHref(this.href)&&(hostAriaLabel(this)??this.accessibleLabel??null)===null}syncAccessibleContentText(){if(!this.needsAccessibleContentText()){this.contentObserver&&this.resetContentObserver(),this.accessibleContentText="";return}(!this.hasUpdated||!this.contentObserver)&&this.recomputeAccessibleContentText(),this.armContentObserver()}recomputeAccessibleContentText(){this.accessibleContentText=composedAccessibilityText(this.childNodes,{requireRendered:!1}).replace(/\s+/g," ").trim()}armContentObserver(){const ownerDocument=this.ownerDocument;if(!this.isConnected||this.contentObserver&&this.contentObserverDocument===ownerDocument)return;this.resetContentObserver();const MutationObserverCtor=ownerDocument.defaultView?.MutationObserver;if(!MutationObserverCtor)return;const generation=this.contentObserverGeneration,observer=new MutationObserverCtor(()=>{this.contentObserver!==observer||this.contentObserverDocument!==ownerDocument||this.contentObserverGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument||!this.needsAccessibleContentText()||(this.recomputeAccessibleContentText(),bindAccessibleTextObserver(observer,this,["alt","aria-labelledby","slot"],this.contentUpgrades))});this.contentObserver=observer,this.contentObserverDocument=ownerDocument,bindAccessibleTextObserver(observer,this,["alt","aria-labelledby","slot"],this.contentUpgrades)}disconnectedCallback(){super.disconnectedCallback(),this.semanticFocusOrigin=void 0,this.resetContentObserver()}adoptedCallback(){super.adoptedCallback(),this.resetContentObserver()}resetContentObserver(){this.contentObserverGeneration+=1,this.contentObserver?.disconnect(),this.contentUpgrades.disconnect(),this.contentObserver=void 0,this.contentObserverDocument=void 0}click(){this.disabled||this.renderRoot.querySelector('a[part~="base"], button[part~="activation-button"]')?.click()}render(){const hasMedia=this.withMedia||this.hasMediaSlot||this.hasImageSlot,hasHeaderActions=this.withHeaderActions||this.hasHeaderActionsSlot||this.hasActionsSlot,hasHeader=this.withHeader||this.hasHeaderSlot||hasHeaderActions,hasFooterActions=this.withFooterActions||this.hasFooterActionsSlot,hasFooter=this.withFooter||this.hasFooterSlot||hasFooterActions,href=safeLinkHref(this.href),activatable=this.actionable&&!href,disabled=this.disabled&&(activatable||!!href),pressed=["true","false","mixed"].includes(this.triggerPressed??"")?this.triggerPressed:nothing,current=["page","step","location","date","time","true","false"].includes(this.triggerCurrent??"")?this.triggerCurrent:nothing,accessibleLabel=hostAriaLabel(this)??this.accessibleLabel,fallbackAccessibleLabel=this.accessibleContentText||this.localize("open"),body=html`
|
|
2
2
|
${activatable?html`<button
|
|
3
3
|
part="activation-button"
|
|
4
4
|
type="button"
|
|
@@ -163,13 +163,21 @@ readonly radiusSteps?:readonly(readonly[number,number])[];
|
|
|
163
163
|
* reaches MapLibre, which paints to a WebGL canvas and never sees the CSS cascade.
|
|
164
164
|
*/
|
|
165
165
|
readonly colorSteps?:readonly(readonly[number,string])[];
|
|
166
|
+
/** Outline color for aggregate cluster circles only. Defaults to the layer stroke, color, then tone; individual pins keep their layer paint. */
|
|
167
|
+
readonly strokeColor?:string;
|
|
166
168
|
/**
|
|
167
169
|
* Font stack for the cluster count label, which must exist in the style's own glyph source.
|
|
168
170
|
* Defaults to MapLibre's spec default; supply the names your style actually ships when that
|
|
169
171
|
* default is absent. The count label is skipped entirely when the style declares no `glyphs`,
|
|
170
172
|
* since a text layer without one paints nothing and only emits peer errors.
|
|
171
173
|
*/
|
|
172
|
-
readonly countFont?:readonly string[];
|
|
174
|
+
readonly countFont?:readonly string[];
|
|
175
|
+
/** Count label foreground. Defaults to the layer tone's on-color. CSS token references resolve against this map. */
|
|
176
|
+
readonly countColor?:string;
|
|
177
|
+
/** Optional count label halo color. Without it, the label has no halo. */
|
|
178
|
+
readonly countHaloColor?:string;
|
|
179
|
+
/** Halo width in CSS pixels, clamped to 0–3 (one quarter of the 12px count text size). Defaults to 1 when a halo color is set. */
|
|
180
|
+
readonly countHaloWidth?:number;}
|
|
173
181
|
/** A heatmap paint value expressed either as one constant or bounded `[zoom, value]` stops. */
|
|
174
182
|
export type LyraMapHeatmapZoomValue=number|readonly(readonly[zoom:number,value:number])[];
|
|
175
183
|
/** Paint configuration for a `kind: 'heatmap'` data layer. */
|