@aceshooting/lyra-ui 13.0.1 → 14.1.0

package/dist/components/layout/tab-group/tab-group.class.js

@@ -1,4 +1,4 @@
-var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{repeat}from"lit/directives/repeat.js";import{LyraElement}from"../../../internal/lyra-element.js";import{isRtl}from"../../../internal/rtl.js";import{nextId}from"../../../internal/a11y.js";import{composedAccessibilityText}from"../../../internal/accessibility-visibility.js";import{chevronIcon}from"../../../internal/icons.js";import{prefersReducedMotion}from"../../../internal/motion.js";import{tag}from"../../../internal/prefix.js";import{observeScrollOverflow}from"../../../internal/scroll-overflow.js";import{styles}from"./tab-group.styles.js";import{activeElementIn}from"../../../internal/active-element.js";import{LYRA_DEFAULT_scrollNext,LYRA_DEFAULT_scrollPrevious}from"../../../internal/default-strings.generated.js";function isHtmlElement(child){return child.nodeType===1&&child.namespaceURI==="http://www.w3.org/1999/xhtml"}function isInertChild(child){return isHtmlElement(child)&&child.inert}function isTabLabelSubtreeExcludedWithoutInert(element){if(element.hasAttribute("hidden")||element.getAttribute("aria-hidden")?.trim().toLowerCase()==="true")return!0;const rendered=element.ownerDocument.defaultView?.getComputedStyle(element);return rendered?.display==="none"||rendered?.contentVisibility==="hidden"}const SYNTHETIC_PANEL_PREFIX="lr-tab-",SCROLL_STEP_RATIO=.8;class LyraTabGroup extends LyraElement{constructor(){super(...arguments),this.active="",this.accessibleLabel=null,this.placement="top",this.activation="auto",this.withoutScrollControls=!1,this.noScrollControls=!1,this.fixedScrollControls=!1,this.tabs=[],this.focusedTab="",this.baseId=nextId("tab-group"),this.nextOpaqueId=0,this.idsBySlot=new Map,this.mutationObserverGeneration=0,this.projectedSourceSnapshots=new Map,this.projectedSlotSnapshots=new Map,this.projectedSourceObserverGeneration=0,this.rehomeTabFocus=!1,this.scrollStartAvailable=!1,this.scrollEndAvailable=!1,this.scrollOverflow=observeScrollOverflow(this,()=>this.renderRoot.querySelector('[part~="tablist"]'),()=>this.measureTabScrollEdges()),this.syncTabs=()=>{const children=Array.from(this.children);this.adoptProjectedSourceInertStates(),this.adoptProjectedSlotStates();const projectedSlots=new Set,next=this.readElementModel(children,projectedSlots);this.syncProjectedSlots(projectedSlots),this.syncProjectedSources(next);const liveSlots=new Set(next.map(tab=>tab.slotName));for(const slotName of this.idsBySlot.keys())liveSlots.has(slotName)||this.idsBySlot.delete(slotName);this.tabs=next},this.onTabListKeyDown=e=>{const navigable=this.tabs.filter(t=>this.isNavigable(t));if(navigable.length===0)return;const origin=this.keyboardOriginTab(e,navigable),currentIndex=origin?navigable.indexOf(origin):-1;if(e.key==="Delete"){if(!origin?.element.closable)return;e.preventDefault(),origin.element.requestCloseFromOwner();return}const rtl=isRtl(this),forwardKey=this.isVertical?"ArrowDown":rtl?"ArrowLeft":"ArrowRight",backwardKey=this.isVertical?"ArrowUp":rtl?"ArrowRight":"ArrowLeft";if(this.activation==="manual"&&(e.key==="Enter"||e.key===" "||e.key==="Spacebar")){if(!origin)return;e.preventDefault(),this.selectTab(origin);return}let targetIndex;switch(e.key){case forwardKey:targetIndex=currentIndex<0?0:(currentIndex+1)%navigable.length;break;case backwardKey:targetIndex=currentIndex<0?navigable.length-1:(currentIndex-1+navigable.length)%navigable.length;break;case"Home":targetIndex=0;break;case"End":targetIndex=navigable.length-1;break;default:return}e.preventDefault();const target=navigable[targetIndex];if(this.activation==="manual"){this.focusOnly(target);return}this.selectTab(target),this.focusTab(target.slotName)},this.onTabListScroll=()=>{this.measureTabScrollEdges()},this.onScrollControlMouseDown=event=>{event.preventDefault()},this.onScrollControlPointerDown=event=>{const control=event.currentTarget;control instanceof HTMLElement&&(control.setAttribute("data-pressed",""),control.setPointerCapture(event.pointerId))},this.onScrollControlPointerEnd=event=>{const control=event.currentTarget;control instanceof HTMLElement&&(control.removeAttribute("data-pressed"),control.hasPointerCapture(event.pointerId)&&control.releasePointerCapture(event.pointerId))}}static{this.defaultStrings={...super.defaultStrings,scrollNext:LYRA_DEFAULT_scrollNext,scrollPrevious:LYRA_DEFAULT_scrollPrevious}}static{this.styles=[LyraElement.styles,styles]}connectedCallback(){super.connectedCallback(),this.hasUpdated?this.syncTabs():this.seedFirstRenderState(this.syncTabs),this.resetMutationObserver();const ownerDocument=this.ownerDocument,MutationObserverCtor=ownerDocument.defaultView?.MutationObserver;if(!MutationObserverCtor)return;const generation=this.mutationObserverGeneration,observer=new MutationObserverCtor(records=>{if(this.mutationObserver!==observer||this.mutationObserverDocument!==ownerDocument||this.mutationObserverGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument)return;const isDirectChild=node=>node.parentNode===this,isElementTabContent=node=>{let current=node.nodeType===1?node:node.parentElement;for(;current&&current!==this;){if(current.localName===tag("tab")&&current.parentNode===this)return!0;current=current.parentElement}return!1};records.some(record=>record.type==="childList"?record.target===this||isElementTabContent(record.target):record.type==="characterData"?isElementTabContent(record.target):record.attributeName==="inert"&&this.projectedSourceSnapshots.has(record.target)?!1:isDirectChild(record.target)||isElementTabContent(record.target))&&this.syncTabs()});this.mutationObserver=observer,this.mutationObserverDocument=ownerDocument,observer.observe(this,{childList:!0,subtree:!0,attributes:!0,characterData:!0,attributeFilter:["alt","aria-hidden","aria-label","aria-labelledby","class","closable","disabled","hidden","inert","id","label","name","open","panel","slot","style"]})}disconnectedCallback(){this.resetMutationObserver(),this.resetProjectedSourceObserver(),this.restoreProjectedSources(),this.restoreProjectedSlots(),super.disconnectedCallback()}adoptedCallback(){super.adoptedCallback(),this.resetMutationObserver(),this.resetProjectedSourceObserver()}resetMutationObserver(){this.mutationObserverGeneration+=1,this.mutationObserver?.disconnect(),this.mutationObserver=void 0,this.mutationObserverDocument=void 0}readElementModel(children,projectedSlots){const seen=new Set,next=[],panels=children.filter(child=>child.localName===tag("tab-panel")),authoredNames=new Set(children.flatMap(child=>{if(child.localName===tag("tab")){const name=child.getAttribute("panel");return name?[name]:[]}if(child.localName===tag("tab-panel")){const name=child.getAttribute("name");return name?[name]:[]}return[]}));let index=0;for(const child of children){if(child.localName!==tag("tab"))continue;const authoredPanel=child.getAttribute("panel")||void 0;let slotName=authoredPanel??`${SYNTHETIC_PANEL_PREFIX}${index}`;if(!authoredPanel){let collision=0;for(;authoredNames.has(slotName)||seen.has(slotName);)collision+=1,slotName=`${SYNTHETIC_PANEL_PREFIX}${index}-${collision}`}if(index+=1,!authoredPanel&&!this.readElementLabel(child,{allowUnprojected:!0})||seen.has(slotName))continue;seen.add(slotName);const tabSlot=this.tabSlotName(slotName);this.projectSlot(child,tabSlot,projectedSlots);const visibleLabel=this.readElementLabel(child);if(!authoredPanel&&!visibleLabel)continue;const label=visibleLabel||slotName,panel=panels.find(candidate=>candidate.getAttribute("name")===slotName);panel&&this.projectSlot(panel,slotName,projectedSlots),next.push({slotName,label,disabled:child.hasAttribute("disabled"),inert:isInertChild(child),element:child}),!this.active&&child.hasAttribute("active")&&(this.active=slotName)}return next}readElementLabel(tab,options={}){const labelNodes=Array.from(tab.childNodes).filter(node=>node.nodeType!==Node.ELEMENT_NODE||node.getAttribute("slot")===null||node.getAttribute("slot")==="");return composedAccessibilityText(labelNodes,{ancestorBoundary:tab,isSubtreeExcluded:element=>this.isTabLabelSubtreeExcluded(element),requireRendered:!options.allowUnprojected,skipRootAncestorValidation:options.allowUnprojected}).replace(/\s+/g," ").trim()}libraryOwnsSourceInert(element){return this.projectedSourceSnapshots.get(element)?.libraryOwnsInert===!0}isTabLabelSubtreeExcluded(element){return isTabLabelSubtreeExcludedWithoutInert(element)||element.hasAttribute("inert")&&!this.libraryOwnsSourceInert(element)}snapshotProjectedSource(source){const inert=source.getAttribute("inert");return{inert,appliedInert:inert,libraryOwnsInert:!1}}adoptProjectedSourceInert(source,snapshot){const current=source.getAttribute("inert");current!==snapshot.appliedInert&&(snapshot.inert=current,snapshot.libraryOwnsInert=!1)}makeProjectedSourceInert(source,snapshot){source.hasAttribute("inert")||(source.setAttribute("inert",""),snapshot.libraryOwnsInert=!0),snapshot.appliedInert=source.getAttribute("inert")}restoreProjectedSource(source,snapshot){this.adoptProjectedSourceInert(source,snapshot),snapshot.inert===null?source.removeAttribute("inert"):source.setAttribute("inert",snapshot.inert)}restoreProjectedSources(){for(const[source,snapshot]of this.projectedSourceSnapshots)this.restoreProjectedSource(source,snapshot);this.projectedSourceSnapshots.clear()}resetProjectedSourceObserver(){this.projectedSourceObserverGeneration+=1,this.projectedSourceObserver?.disconnect(),this.projectedSourceObserver=void 0,this.projectedSourceObserverDocument=void 0}observeProjectedSources(){this.resetProjectedSourceObserver();const ownerDocument=this.ownerDocument,MutationObserverCtor=ownerDocument.defaultView?.MutationObserver;if(!MutationObserverCtor||!this.isConnected||this.projectedSourceSnapshots.size===0)return;const generation=this.projectedSourceObserverGeneration,observer=new MutationObserverCtor(records=>{this.projectedSourceObserver!==observer||this.projectedSourceObserverDocument!==ownerDocument||this.projectedSourceObserverGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument||records.some(record=>this.projectedSourceSnapshots.has(record.target))&&this.syncTabs()});this.projectedSourceObserver=observer,this.projectedSourceObserverDocument=ownerDocument;for(const source of this.projectedSourceSnapshots.keys())observer.observe(source,{attributes:!0,attributeFilter:["inert"]})}projectedSources(tabs){const sources=new Set;for(const tab of tabs)for(const child of Array.from(tab.element.children))(child.getAttribute("slot")??"")===""&&sources.add(child);return sources}syncProjectedSources(tabs){const sources=this.projectedSources(tabs);for(const[source,snapshot]of this.projectedSourceSnapshots)this.adoptProjectedSourceInert(source,snapshot),sources.has(source)||(this.restoreProjectedSource(source,snapshot),this.projectedSourceSnapshots.delete(source));for(const source of sources){const snapshot=this.projectedSourceSnapshots.get(source)??this.snapshotProjectedSource(source);this.projectedSourceSnapshots.set(source,snapshot),this.adoptProjectedSourceInert(source,snapshot),this.makeProjectedSourceInert(source,snapshot)}this.observeProjectedSources()}adoptProjectedSourceInertStates(){for(const[source,snapshot]of this.projectedSourceSnapshots)this.adoptProjectedSourceInert(source,snapshot)}snapshotProjectedSlot(source){const slot=source.getAttribute("slot");return{slot,appliedSlot:slot,libraryOwnsSlot:!1}}adoptProjectedSlot(source,snapshot){const current=source.getAttribute("slot");current!==snapshot.appliedSlot&&(snapshot.slot=current,snapshot.libraryOwnsSlot=!1)}projectSlot(source,slot,projectedSlots){const snapshot=this.projectedSlotSnapshots.get(source)??this.snapshotProjectedSlot(source);this.projectedSlotSnapshots.set(source,snapshot),this.adoptProjectedSlot(source,snapshot),source.getAttribute("slot")!==slot&&(source.setAttribute("slot",slot),snapshot.libraryOwnsSlot=!0),snapshot.appliedSlot=source.getAttribute("slot"),projectedSlots.add(source)}restoreProjectedSlot(source,snapshot){this.adoptProjectedSlot(source,snapshot),snapshot.slot===null?source.removeAttribute("slot"):source.setAttribute("slot",snapshot.slot)}syncProjectedSlots(projectedSlots){for(const[source,snapshot]of this.projectedSlotSnapshots)projectedSlots.has(source)||(this.restoreProjectedSlot(source,snapshot),this.projectedSlotSnapshots.delete(source))}restoreProjectedSlots(){for(const[source,snapshot]of this.projectedSlotSnapshots)this.restoreProjectedSlot(source,snapshot);this.projectedSlotSnapshots.clear()}adoptProjectedSlotStates(){for(const[source,snapshot]of this.projectedSlotSnapshots)this.adoptProjectedSlot(source,snapshot)}isNavigable(tab){return!tab.disabled&&!tab.inert}willUpdate(changed){if(super.willUpdate(changed),!changed.has("tabs")&&!changed.has("active"))return;const current=this.tabs.find(t=>t.slotName===this.active);current&&this.isNavigable(current)||(this.rehomeTabFocus=activeElementIn(this.renderRoot)?.getAttribute("part")==="tab",this.active=this.tabs.find(t=>this.isNavigable(t))?.slotName??"",this.focusedTab=this.active)}updated(changed){super.updated(changed),(changed.has("active")||changed.has("tabs"))&&this.syncElementActiveState(),this.scrollOverflow.observeExtra(this.renderRoot.querySelectorAll('[part="tab"]')),this.measureTabScrollEdges(),this.rehomeTabFocus&&(this.rehomeTabFocus=!1,this.renderRoot.querySelector('[part="tab"][tabindex="0"]')?.focus())}selectTab(tab){if(!this.isNavigable(tab)||tab.slotName===this.active)return;const previous=this.active;this.active=tab.slotName,this.focusedTab=tab.slotName,previous&&this.emit("lr-tab-hide",{name:previous}),this.emit("lr-tab-show",{name:tab.slotName})}show(panel){const tab=this.tabs.find(candidate=>candidate.slotName===panel);tab&&this.selectTab(tab)}syncElementActiveState(){for(const child of Array.from(this.children))if(child.localName===tag("tab")){const definition=this.tabs.find(tab=>tab.element===child);child.toggleAttribute("active",definition?.slotName===this.active)}else child.localName===tag("tab-panel")&&child.toggleAttribute("active",child.getAttribute("name")===this.active)}focusOnly(tab){this.focusedTab=tab.slotName,this.focusTab(tab.slotName)}get rovingTab(){if(this.activation!=="manual")return this.active;const candidate=this.tabs.find(t=>t.slotName===this.focusedTab&&this.isNavigable(t));return candidate?candidate.slotName:this.active}keyboardOriginTab(event,navigable){const eventButton=event.composedPath().find(candidate=>candidate.nodeType===1&&candidate.getAttribute?.("part")==="tab"&&candidate.getRootNode()===this.renderRoot),focused=activeElementIn(this.renderRoot),owned=(eventButton??(focused?.getAttribute("part")==="tab"?focused:void 0))?.dataset.slot;return navigable.find(tab=>tab.slotName===owned)??navigable.find(tab=>tab.slotName===this.rovingTab)}focusTab(slotName){const buttons=this.renderRoot.querySelectorAll('[part="tab"]');for(const button of Array.from(buttons))if(button.dataset.slot===slotName){button.focus();return}}get isVertical(){return this.placement==="start"||this.placement==="end"}tabId(slotName){return this.idsFor(slotName).tab}panelId(slotName){return this.idsFor(slotName).panel}idsFor(slotName){const existing=this.idsBySlot.get(slotName);if(existing)return existing;const token=`${this.baseId}-${this.nextOpaqueId++}`,ids={tab:`${token}-tab`,panel:`${token}-panel`};return this.idsBySlot.set(slotName,ids),ids}tabSlotName(slotName){return`${slotName}-tab`}get scrollControlsSuppressed(){return this.withoutScrollControls||this.noScrollControls}measureTabScrollEdges(){const tablist=this.renderRoot.querySelector('[part~="tablist"]');if(!tablist||this.isVertical){this.setTabScrollEdges(!1,!1,tablist);return}const maximum=Math.max(0,tablist.scrollWidth-tablist.clientWidth),position=Math.max(0,Math.min(maximum,this.effectiveDirection==="rtl"?-tablist.scrollLeft:tablist.scrollLeft));this.setTabScrollEdges(position>1,position<maximum-1,tablist)}setTabScrollEdges(start,end,tablist){tablist?.toggleAttribute("data-scroll-start",start),tablist?.toggleAttribute("data-scroll-end",end),!(start===this.scrollStartAvailable&&end===this.scrollEndAvailable)&&(this.scrollStartAvailable=start,this.scrollEndAvailable=end)}scrollTabs(edge){const tablist=this.renderRoot.querySelector('[part~="tablist"]');if(!tablist||!isHtmlElement(tablist)||typeof tablist.scrollBy!="function")return;const step=Math.max(1,tablist.clientWidth*SCROLL_STEP_RATIO),towardEnd=edge==="end"?1:-1,physical=this.effectiveDirection==="rtl"?-towardEnd:towardEnd;tablist.scrollBy({left:step*physical,behavior:prefersReducedMotion(this.ownerDocument.defaultView)?"instant":"smooth"})}renderScrollControl(edge){if(this.isVertical||this.scrollControlsSuppressed)return nothing;const available=edge==="start"?this.scrollStartAvailable:this.scrollEndAvailable;return html`<button
+var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{repeat}from"lit/directives/repeat.js";import{LyraElement}from"../../../internal/lyra-element.js";import{isRtl}from"../../../internal/rtl.js";import{nextId}from"../../../internal/a11y.js";import{composedAccessibilityText}from"../../../internal/accessibility-visibility.js";import{chevronIcon}from"../../../internal/icons.js";import{prefersReducedMotion}from"../../../internal/motion.js";import{tag}from"../../../internal/prefix.js";import{observeScrollOverflow}from"../../../internal/scroll-overflow.js";import{styles}from"./tab-group.styles.js";import{activeElementIn}from"../../../internal/active-element.js";import{LYRA_DEFAULT_scrollNext,LYRA_DEFAULT_scrollPrevious}from"../../../internal/default-strings.generated.js";function isHtmlElement(child){return child.nodeType===1&&child.namespaceURI==="http://www.w3.org/1999/xhtml"}function isInertChild(child){return isHtmlElement(child)&&child.inert}function isTabLabelSubtreeExcludedWithoutInert(element){if(element.hasAttribute("hidden")||element.getAttribute("aria-hidden")?.trim().toLowerCase()==="true")return!0;const rendered=element.ownerDocument.defaultView?.getComputedStyle(element);return rendered?.display==="none"||rendered?.contentVisibility==="hidden"}const SYNTHETIC_PANEL_PREFIX="lr-tab-",SCROLL_STEP_RATIO=.8;class LyraTabGroup extends LyraElement{constructor(){super(...arguments),this.active="",this.accessibleLabel=null,this.placement="top",this.activation="auto",this.withoutScrollControls=!1,this.noScrollControls=!1,this.fixedScrollControls=!1,this.tabs=[],this.focusedTab="",this.baseId=nextId("tab-group"),this.nextOpaqueId=0,this.idsBySlot=new Map,this.mutationObserverGeneration=0,this.projectedSourceSnapshots=new Map,this.projectedSlotSnapshots=new Map,this.projectedSourceObserverGeneration=0,this.rehomeTabFocus=!1,this.scrollStartAvailable=!1,this.scrollEndAvailable=!1,this.scrollOverflow=observeScrollOverflow(this,()=>this.renderRoot.querySelector('[part~="tablist"]'),()=>this.measureTabScrollEdges()),this.syncTabs=()=>{const children=Array.from(this.children);this.adoptProjectedSourceInertStates(),this.adoptProjectedSlotStates();const projectedSlots=new Set,next=this.readElementModel(children,projectedSlots);this.syncProjectedSlots(projectedSlots),this.syncProjectedSources(next);const liveSlots=new Set(next.map(tab=>tab.slotName));for(const slotName of this.idsBySlot.keys())liveSlots.has(slotName)||this.idsBySlot.delete(slotName);this.tabs=next},this.onTabListKeyDown=e=>{const navigable=this.tabs.filter(t=>this.isNavigable(t));if(navigable.length===0)return;const origin=this.keyboardOriginTab(e,navigable),currentIndex=origin?navigable.indexOf(origin):-1;if(e.key==="Delete"){if(!origin?.element.closable)return;e.preventDefault(),origin.element.requestCloseFromOwner();return}const rtl=isRtl(this),forwardKey=this.isVertical?"ArrowDown":rtl?"ArrowLeft":"ArrowRight",backwardKey=this.isVertical?"ArrowUp":rtl?"ArrowRight":"ArrowLeft";if(this.activation==="manual"&&(e.key==="Enter"||e.key===" "||e.key==="Spacebar")){if(!origin)return;e.preventDefault(),this.selectTab(origin);return}let targetIndex;switch(e.key){case forwardKey:targetIndex=currentIndex<0?0:(currentIndex+1)%navigable.length;break;case backwardKey:targetIndex=currentIndex<0?navigable.length-1:(currentIndex-1+navigable.length)%navigable.length;break;case"Home":targetIndex=0;break;case"End":targetIndex=navigable.length-1;break;default:return}e.preventDefault();const target=navigable[targetIndex];if(this.activation==="manual"){this.focusOnly(target);return}this.selectTab(target),this.focusTab(target.slotName)},this.onTabListScroll=()=>{this.measureTabScrollEdges()},this.onScrollControlMouseDown=event=>{event.preventDefault()},this.onScrollControlPointerDown=event=>{const control=event.currentTarget;control instanceof HTMLElement&&(control.setAttribute("data-pressed",""),control.setPointerCapture(event.pointerId))},this.onScrollControlPointerEnd=event=>{const control=event.currentTarget;control instanceof HTMLElement&&(control.removeAttribute("data-pressed"),control.hasPointerCapture(event.pointerId)&&control.releasePointerCapture(event.pointerId))}}static{this.defaultStrings={...super.defaultStrings,scrollNext:LYRA_DEFAULT_scrollNext,scrollPrevious:LYRA_DEFAULT_scrollPrevious}}static{this.styles=[LyraElement.styles,styles]}connectedCallback(){super.connectedCallback(),this.hasUpdated?this.syncTabs():this.seedFirstRenderState(this.syncTabs),this.resetMutationObserver();const ownerDocument=this.ownerDocument,MutationObserverCtor=ownerDocument.defaultView?.MutationObserver;if(!MutationObserverCtor)return;const generation=this.mutationObserverGeneration,observer=new MutationObserverCtor(records=>{if(this.mutationObserver!==observer||this.mutationObserverDocument!==ownerDocument||this.mutationObserverGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument)return;const isDirectChild=node=>node.parentNode===this,isElementTabContent=node=>{let current=node.nodeType===1?node:node.parentElement;for(;current&&current!==this;){if(current.localName===tag("tab")&&current.parentNode===this)return!0;current=current.parentElement}return!1};records.some(record=>record.type==="childList"?record.target===this||isElementTabContent(record.target):record.type==="characterData"?isElementTabContent(record.target):record.attributeName==="inert"&&this.projectedSourceSnapshots.has(record.target)?!1:isDirectChild(record.target)||isElementTabContent(record.target))&&this.syncTabs()});this.mutationObserver=observer,this.mutationObserverDocument=ownerDocument,observer.observe(this,{childList:!0,subtree:!0,attributes:!0,characterData:!0,attributeFilter:["alt","aria-hidden","aria-label","aria-labelledby","class","closable","disabled","hidden","inert","id","label","name","open","panel","slot","style"]})}disconnectedCallback(){this.resetMutationObserver(),this.resetProjectedSourceObserver(),this.restoreProjectedSources(),this.restoreProjectedSlots(),super.disconnectedCallback()}adoptedCallback(){super.adoptedCallback(),this.resetMutationObserver(),this.resetProjectedSourceObserver()}resetMutationObserver(){this.mutationObserverGeneration+=1,this.mutationObserver?.disconnect(),this.mutationObserver=void 0,this.mutationObserverDocument=void 0}readElementModel(children,projectedSlots){const seen=new Set,next=[],panels=children.filter(child=>child.localName===tag("tab-panel")),authoredNames=new Set(children.flatMap(child=>{if(child.localName===tag("tab")){const name=child.getAttribute("panel");return name?[name]:[]}if(child.localName===tag("tab-panel")){const name=child.getAttribute("name");return name?[name]:[]}return[]}));let index=0;for(const child of children){if(child.localName!==tag("tab"))continue;const authoredPanel=child.getAttribute("panel")||void 0;let slotName=authoredPanel??`${SYNTHETIC_PANEL_PREFIX}${index}`;if(!authoredPanel){let collision=0;for(;authoredNames.has(slotName)||seen.has(slotName);)collision+=1,slotName=`${SYNTHETIC_PANEL_PREFIX}${index}-${collision}`}if(index+=1,!authoredPanel&&!this.readElementLabel(child,{allowUnprojected:!0})||seen.has(slotName))continue;seen.add(slotName);const tabSlot=this.tabSlotName(slotName);this.projectSlot(child,tabSlot,projectedSlots);const visibleLabel=this.readElementLabel(child);if(!authoredPanel&&!visibleLabel)continue;const label=visibleLabel||slotName,panel=panels.find(candidate=>candidate.getAttribute("name")===slotName);panel&&this.projectSlot(panel,slotName,projectedSlots),next.push({slotName,label,disabled:child.hasAttribute("disabled"),inert:isInertChild(child),element:child}),!this.active&&child.hasAttribute("active")&&(this.active=slotName)}return next}readElementLabel(tab,options={}){const labelNodes=Array.from(tab.childNodes).filter(node=>node.nodeType!==Node.ELEMENT_NODE||node.getAttribute("slot")===null||node.getAttribute("slot")==="");return composedAccessibilityText(labelNodes,{ancestorBoundary:tab,isSubtreeExcluded:element=>this.isTabLabelSubtreeExcluded(element),requireRendered:!options.allowUnprojected,skipRootAncestorValidation:options.allowUnprojected}).replace(/\s+/g," ").trim()}libraryOwnsSourceInert(element){return this.projectedSourceSnapshots.get(element)?.libraryOwnsInert===!0}isTabLabelSubtreeExcluded(element){return isTabLabelSubtreeExcludedWithoutInert(element)||element.hasAttribute("inert")&&!this.libraryOwnsSourceInert(element)}snapshotProjectedSource(source){const inert=source.getAttribute("inert");return{inert,appliedInert:inert,libraryOwnsInert:!1}}adoptProjectedSourceInert(source,snapshot){const current=source.getAttribute("inert");current!==snapshot.appliedInert&&(snapshot.inert=current,snapshot.libraryOwnsInert=!1)}makeProjectedSourceInert(source,snapshot){source.hasAttribute("inert")||(source.setAttribute("inert",""),snapshot.libraryOwnsInert=!0),snapshot.appliedInert=source.getAttribute("inert")}restoreProjectedSource(source,snapshot){this.adoptProjectedSourceInert(source,snapshot),snapshot.inert===null?source.removeAttribute("inert"):source.setAttribute("inert",snapshot.inert)}restoreProjectedSources(){for(const[source,snapshot]of this.projectedSourceSnapshots)this.restoreProjectedSource(source,snapshot);this.projectedSourceSnapshots.clear()}resetProjectedSourceObserver(){this.projectedSourceObserverGeneration+=1,this.projectedSourceObserver?.disconnect(),this.projectedSourceObserver=void 0,this.projectedSourceObserverDocument=void 0}observeProjectedSources(){this.resetProjectedSourceObserver();const ownerDocument=this.ownerDocument,MutationObserverCtor=ownerDocument.defaultView?.MutationObserver;if(!MutationObserverCtor||!this.isConnected||this.projectedSourceSnapshots.size===0)return;const generation=this.projectedSourceObserverGeneration,observer=new MutationObserverCtor(records=>{this.projectedSourceObserver!==observer||this.projectedSourceObserverDocument!==ownerDocument||this.projectedSourceObserverGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument||records.some(record=>this.projectedSourceSnapshots.has(record.target))&&this.syncTabs()});this.projectedSourceObserver=observer,this.projectedSourceObserverDocument=ownerDocument;for(const source of this.projectedSourceSnapshots.keys())observer.observe(source,{attributes:!0,attributeFilter:["inert"]})}projectedSources(tabs){const sources=new Set;for(const tab of tabs)for(const child of Array.from(tab.element.children))(child.getAttribute("slot")??"")===""&&sources.add(child);return sources}syncProjectedSources(tabs){const sources=this.projectedSources(tabs);for(const[source,snapshot]of this.projectedSourceSnapshots)this.adoptProjectedSourceInert(source,snapshot),sources.has(source)||(this.restoreProjectedSource(source,snapshot),this.projectedSourceSnapshots.delete(source));for(const source of sources){const snapshot=this.projectedSourceSnapshots.get(source)??this.snapshotProjectedSource(source);this.projectedSourceSnapshots.set(source,snapshot),this.adoptProjectedSourceInert(source,snapshot),this.makeProjectedSourceInert(source,snapshot)}this.observeProjectedSources()}adoptProjectedSourceInertStates(){for(const[source,snapshot]of this.projectedSourceSnapshots)this.adoptProjectedSourceInert(source,snapshot)}snapshotProjectedSlot(source){const slot=source.getAttribute("slot");return{slot,appliedSlot:slot,libraryOwnsSlot:!1}}adoptProjectedSlot(source,snapshot){const current=source.getAttribute("slot");current!==snapshot.appliedSlot&&(snapshot.slot=current,snapshot.libraryOwnsSlot=!1)}projectSlot(source,slot,projectedSlots){const snapshot=this.projectedSlotSnapshots.get(source)??this.snapshotProjectedSlot(source);this.projectedSlotSnapshots.set(source,snapshot),this.adoptProjectedSlot(source,snapshot),source.getAttribute("slot")!==slot&&(source.setAttribute("slot",slot),snapshot.libraryOwnsSlot=!0),snapshot.appliedSlot=source.getAttribute("slot"),projectedSlots.add(source)}restoreProjectedSlot(source,snapshot){this.adoptProjectedSlot(source,snapshot),snapshot.slot===null?source.removeAttribute("slot"):source.setAttribute("slot",snapshot.slot)}syncProjectedSlots(projectedSlots){for(const[source,snapshot]of this.projectedSlotSnapshots)projectedSlots.has(source)||(this.restoreProjectedSlot(source,snapshot),this.projectedSlotSnapshots.delete(source))}restoreProjectedSlots(){for(const[source,snapshot]of this.projectedSlotSnapshots)this.restoreProjectedSlot(source,snapshot);this.projectedSlotSnapshots.clear()}adoptProjectedSlotStates(){for(const[source,snapshot]of this.projectedSlotSnapshots)this.adoptProjectedSlot(source,snapshot)}isNavigable(tab){return!tab.disabled&&!tab.inert}willUpdate(changed){if(super.willUpdate(changed),!changed.has("tabs")&&!changed.has("active"))return;const focused=activeElementIn(this.renderRoot),focusedSlot=focused?.getAttribute("part")==="tab"?focused.getAttribute("data-slot"):null;focusedSlot!==null&&!this.tabs.some(tab=>tab.slotName===focusedSlot&&this.isNavigable(tab))&&(this.rehomeTabFocus=!0,this.focusedTab=this.active);const current=this.tabs.find(t=>t.slotName===this.active);current&&this.isNavigable(current)||(this.rehomeTabFocus=this.rehomeTabFocus||focusedSlot!==null,this.active=this.tabs.find(t=>this.isNavigable(t))?.slotName??"",this.focusedTab=this.active)}updated(changed){super.updated(changed),(changed.has("active")||changed.has("tabs"))&&this.syncElementActiveState(),this.scrollOverflow.observeExtra(this.renderRoot.querySelectorAll('[part="tab"]')),this.measureTabScrollEdges(),this.rehomeTabFocus&&(this.rehomeTabFocus=!1,this.renderRoot.querySelector('[part="tab"][tabindex="0"]')?.focus())}selectTab(tab){if(!this.isNavigable(tab)||tab.slotName===this.active)return;const previous=this.active;this.active=tab.slotName,this.focusedTab=tab.slotName,previous&&this.emit("lr-tab-hide",{name:previous}),this.emit("lr-tab-show",{name:tab.slotName})}show(panel){const tab=this.tabs.find(candidate=>candidate.slotName===panel);tab&&this.selectTab(tab)}syncElementActiveState(){for(const child of Array.from(this.children))if(child.localName===tag("tab")){const definition=this.tabs.find(tab=>tab.element===child);child.toggleAttribute("active",definition?.slotName===this.active)}else child.localName===tag("tab-panel")&&child.toggleAttribute("active",child.getAttribute("name")===this.active)}focusOnly(tab){this.focusedTab=tab.slotName,this.focusTab(tab.slotName)}get rovingTab(){if(this.activation!=="manual")return this.active;const candidate=this.tabs.find(t=>t.slotName===this.focusedTab&&this.isNavigable(t));return candidate?candidate.slotName:this.active}keyboardOriginTab(event,navigable){const eventButton=event.composedPath().find(candidate=>candidate.nodeType===1&&candidate.getAttribute?.("part")==="tab"&&candidate.getRootNode()===this.renderRoot),focused=activeElementIn(this.renderRoot),owned=(eventButton??(focused?.getAttribute("part")==="tab"?focused:void 0))?.dataset.slot;return navigable.find(tab=>tab.slotName===owned)??navigable.find(tab=>tab.slotName===this.rovingTab)}focusTab(slotName){const buttons=this.renderRoot.querySelectorAll('[part="tab"]');for(const button of Array.from(buttons))if(button.dataset.slot===slotName){button.focus();return}}get isVertical(){return this.placement==="start"||this.placement==="end"}tabId(slotName){return this.idsFor(slotName).tab}panelId(slotName){return this.idsFor(slotName).panel}idsFor(slotName){const existing=this.idsBySlot.get(slotName);if(existing)return existing;const token=`${this.baseId}-${this.nextOpaqueId++}`,ids={tab:`${token}-tab`,panel:`${token}-panel`};return this.idsBySlot.set(slotName,ids),ids}tabSlotName(slotName){return`${slotName}-tab`}get scrollControlsSuppressed(){return this.withoutScrollControls||this.noScrollControls}measureTabScrollEdges(){const tablist=this.renderRoot.querySelector('[part~="tablist"]');if(!tablist||this.isVertical){this.setTabScrollEdges(!1,!1,tablist);return}const maximum=Math.max(0,tablist.scrollWidth-tablist.clientWidth),position=Math.max(0,Math.min(maximum,this.effectiveDirection==="rtl"?-tablist.scrollLeft:tablist.scrollLeft));this.setTabScrollEdges(position>1,position<maximum-1,tablist)}setTabScrollEdges(start,end,tablist){tablist?.toggleAttribute("data-scroll-start",start),tablist?.toggleAttribute("data-scroll-end",end),!(start===this.scrollStartAvailable&&end===this.scrollEndAvailable)&&(this.scrollStartAvailable=start,this.scrollEndAvailable=end)}scrollTabs(edge){const tablist=this.renderRoot.querySelector('[part~="tablist"]');if(!tablist||!isHtmlElement(tablist)||typeof tablist.scrollBy!="function")return;const step=Math.max(1,tablist.clientWidth*SCROLL_STEP_RATIO),towardEnd=edge==="end"?1:-1,physical=this.effectiveDirection==="rtl"?-towardEnd:towardEnd;tablist.scrollBy({left:step*physical,behavior:prefersReducedMotion(this.ownerDocument.defaultView)?"instant":"smooth"})}renderScrollControl(edge){if(this.isVertical||this.scrollControlsSuppressed)return nothing;const available=edge==="start"?this.scrollStartAvailable:this.scrollEndAvailable;return html`<button
       type="button"
       part=${edge==="start"?"scroll-button scroll-button__base scroll-button-start scroll-button--start":"scroll-button scroll-button__base scroll-button-end scroll-button--end"}
       tabindex="-1"

package/dist/components/layout/tab-group/tab-group.styles.js

@@ -1 +1 @@
-import{css}from"lit";const styles=css`:host{min-block-size:0;min-inline-size:0;max-inline-size:100%;display:block}[part~=base]{gap:var(--lr-space-s);box-sizing:border-box;flex-direction:column;block-size:100%;min-block-size:0;max-block-size:100%;min-inline-size:0;display:flex}[part=nav]{align-items:stretch;min-block-size:0;min-inline-size:0;display:flex}[part~=tablist]{align-items:stretch;gap:var(--lr-space-m);border-block-end:var(--track-width,var(--lr-border-width-thin)) solid var(--track-color,var(--lr-color-border));flex:auto;min-inline-size:0;display:flex;overflow:auto hidden}:where([part~=scroll-button]){inline-size:var(--lr-icon-button-size);min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);appearance:none;border:none;border-block-end:var(--lr-border-width-thin) solid var(--lr-color-border);color:var(--lr-color-text-quiet);cursor:pointer;transition:color var(--lr-transition-fast), background var(--lr-transition-fast);background:0 0;flex:none;place-items:center;padding:0;display:inline-grid}:where([part=nav]:not(:has([part~=tablist][data-scroll-overflow]))) [part~=scroll-button],:where([part~=scroll-button][hidden]){display:none}:where([part~=scroll-button]):where(:hover){color:var(--lr-tab-group-scroll-button-hover-color,var(--lr-color-text))}:where([part~=scroll-button]):where(:active),:where([part~=scroll-button]):where([data-pressed]){background:var(--lr-tab-group-scroll-button-active-bg,color-mix(in oklab, transparent, var(--lr-color-mix-partner) var(--lr-color-mix-active)));color:var(--lr-tab-group-scroll-button-active-color,var(--lr-color-text))}[part~=scroll-button]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:calc(var(--lr-focus-ring-offset) * -1);border-radius:var(--lr-radius)}[part=scroll-button-glyph]{align-items:center;display:inline-flex}[part~=scroll-button-start] [part=scroll-button-glyph]{transform:scaleX(-1)}:host(:dir(rtl)) [part~=scroll-button-start] [part=scroll-button-glyph]{transform:none}:host(:dir(rtl)) [part~=scroll-button-end] [part=scroll-button-glyph]{transform:scaleX(-1)}[part~=tablist][data-scroll-overflow]:where([data-scroll-start][data-scroll-end]){-webkit-mask-image:linear-gradient(to right, transparent, var(--lr-mask-opaque) var(--lr-scroll-fade-size), var(--lr-mask-opaque) calc(100% - var(--lr-scroll-fade-size)), transparent);mask-image:linear-gradient(to right, transparent, var(--lr-mask-opaque) var(--lr-scroll-fade-size), var(--lr-mask-opaque) calc(100% - var(--lr-scroll-fade-size)), transparent)}[part~=tablist][data-scroll-overflow]:where([data-scroll-end]:not([data-scroll-start])){-webkit-mask-image:linear-gradient(to right, var(--lr-mask-opaque), var(--lr-mask-opaque) calc(100% - var(--lr-scroll-fade-size)), transparent);mask-image:linear-gradient(to right, var(--lr-mask-opaque), var(--lr-mask-opaque) calc(100% - var(--lr-scroll-fade-size)), transparent)}[part~=tablist][data-scroll-overflow]:where([data-scroll-start]:not([data-scroll-end])),:host(:dir(rtl)) [part~=tablist][data-scroll-overflow]:where([data-scroll-end]:not([data-scroll-start])){-webkit-mask-image:linear-gradient(to right, transparent, var(--lr-mask-opaque) var(--lr-scroll-fade-size), var(--lr-mask-opaque));mask-image:linear-gradient(to right, transparent, var(--lr-mask-opaque) var(--lr-scroll-fade-size), var(--lr-mask-opaque))}:host(:dir(rtl)) [part~=tablist][data-scroll-overflow]:where([data-scroll-start]:not([data-scroll-end])){-webkit-mask-image:linear-gradient(to right, var(--lr-mask-opaque), var(--lr-mask-opaque) calc(100% - var(--lr-scroll-fade-size)), transparent);mask-image:linear-gradient(to right, var(--lr-mask-opaque), var(--lr-mask-opaque) calc(100% - var(--lr-scroll-fade-size)), transparent)}[part=tab]{appearance:none;border:none;border-block-end:var(--lr-border-width-medium) solid transparent;padding:var(--lr-space-s) var(--lr-space-xs);font:inherit;font-weight:var(--lr-font-weight-medium);color:var(--lr-color-text-quiet);cursor:pointer;white-space:nowrap;align-items:center;gap:var(--lr-space-xs);transition:color var(--lr-transition-fast), border-color var(--lr-transition-fast);background:0 0;margin-block-end:var(--lr-size-neg-1px);display:inline-flex;position:relative}[data-tab-label]{min-inline-size:0}:where([part=tab]):hover:where(:not([aria-disabled=true])){color:var(--lr-tab-group-hover-color,var(--lr-color-text))}:where([part=tab]):active:where(:not([aria-disabled=true])){background:var(--lr-tab-group-active-bg,color-mix(in oklab, transparent, var(--lr-color-mix-partner) var(--lr-color-mix-active)));color:var(--lr-tab-group-active-color,var(--lr-tab-group-hover-color,var(--lr-color-text)))}[part=tab][aria-selected=true]{color:var(--lr-tab-group-selected-color,var(--lr-color-brand));border-block-end-color:var(--indicator-color,var(--lr-tab-group-indicator-color,var(--lr-color-brand)))}[part=active-tab-indicator]{block-size:var(--lr-border-width-medium);background:var(--indicator-color,var(--lr-tab-group-indicator-color,var(--lr-color-brand)));pointer-events:none;position:absolute;inset-block-end:calc(-1 * var(--lr-border-width-medium));inset-inline:0}[part=tab][aria-disabled=true]{cursor:not-allowed;pointer-events:none;opacity:var(--lr-opacity-disabled)}[part=tab]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:calc(var(--lr-focus-ring-offset) * -1);border-radius:var(--lr-radius)}[part=panel]{min-inline-size:0;overflow-wrap:anywhere;padding-block-start:var(--lr-space-xs)}[part=body]{flex:auto;min-block-size:0;min-inline-size:0;overflow:auto}[part=panel]:hover{outline:var(--lr-border-width-thin) solid var(--lr-color-border);outline-offset:var(--lr-focus-ring-offset);border-radius:var(--lr-radius)}[part=panel]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset);border-radius:var(--lr-radius)}@media (prefers-reduced-motion:reduce){[part=tab],[part~=scroll-button]{transition:none!important}}:host([placement=bottom]) [part~=base]{flex-direction:column-reverse}:host([placement=bottom]) [part~=tablist],:host([placement=bottom]) [part~=scroll-button]{border-block-end:none;border-block-start:var(--track-width,var(--lr-border-width-thin)) solid var(--track-color,var(--lr-color-border))}:host([placement=bottom]) [part=tab][aria-selected=true]{border-block-end-color:#0000}:host([placement=bottom]) [part=active-tab-indicator]{inset-block-start:calc(-1 * var(--lr-border-width-medium));inset-block-end:auto}:host([placement=start]) [part=nav],:host([placement=end]) [part=nav]{min-inline-size:0;max-inline-size:var(--lr-tab-group-vertical-nav-max-inline-size,var(--lr-size-12rem));flex:0 auto;max-block-size:100%}:host([placement=start]) [part~=base],:host([placement=end]) [part~=base]{flex-direction:row;align-items:stretch}:host([placement=end]) [part~=base]{flex-direction:row-reverse}:host([placement=start]) [part~=tablist],:host([placement=end]) [part~=tablist]{align-items:stretch;gap:var(--lr-space-2xs);border-block-end:none;flex-direction:column;flex:auto;min-block-size:0;max-block-size:100%;min-inline-size:0;max-inline-size:100%;overflow:hidden auto}:host([placement=start]) [part=tab],:host([placement=end]) [part=tab]{text-overflow:ellipsis;min-inline-size:0;max-inline-size:100%;overflow:hidden}:host([placement=start]) [data-tab-label],:host([placement=end]) [data-tab-label]{text-overflow:ellipsis;white-space:nowrap;flex:auto;max-inline-size:100%;display:block;overflow:hidden}:host([placement=start]) [part~=tablist]{border-inline-end:var(--track-width,var(--lr-border-width-thin)) solid var(--track-color,var(--lr-color-border))}:host([placement=end]) [part~=tablist]{border-inline-start:var(--track-width,var(--lr-border-width-thin)) solid var(--track-color,var(--lr-color-border))}:host([placement=start]) [part~=tablist][data-scroll-overflow],:host([placement=end]) [part~=tablist][data-scroll-overflow]{-webkit-mask-image:none;mask-image:none}:host([placement=start]) [part=tab][aria-selected=true],:host([placement=end]) [part=tab][aria-selected=true]{box-shadow:none;border-block-end-color:#0000}:host([placement=start]) [part=tab][aria-selected=true]{border-inline-end:var(--lr-border-width-thick) solid var(--indicator-color,var(--lr-tab-group-indicator-color,var(--lr-color-brand)))}:host([placement=end]) [part=tab][aria-selected=true]{border-inline-start:var(--lr-border-width-thick) solid var(--indicator-color,var(--lr-tab-group-indicator-color,var(--lr-color-brand)))}:host([placement=start]) [part=active-tab-indicator]{inset-block:0;inset-inline:auto calc(-1 * var(--lr-border-width-thick));inline-size:var(--lr-border-width-thick);block-size:auto}:host([placement=end]) [part=active-tab-indicator]{inset-block:0;inset-inline:calc(-1 * var(--lr-border-width-thick)) auto;inline-size:var(--lr-border-width-thick);block-size:auto}:host([placement=start]) [part=panel],:host([placement=end]) [part=panel]{flex:auto;min-inline-size:0}@media (forced-colors:active){[part~=tablist][data-scroll-overflow],:host(:dir(rtl)) [part~=tablist][data-scroll-overflow]{-webkit-mask-image:none;mask-image:none}}`;export{styles};
+import{css}from"lit";const styles=css`:host{min-block-size:0;min-inline-size:0;max-inline-size:100%;display:block}[part~=base]{gap:var(--lr-space-s);box-sizing:border-box;flex-direction:column;block-size:100%;min-block-size:0;max-block-size:100%;min-inline-size:0;display:flex}[part=nav]{align-items:stretch;min-block-size:0;min-inline-size:0;display:flex}[part~=tablist]{align-items:stretch;gap:var(--lr-space-m);border-block-end:var(--track-width,var(--lr-border-width-thin)) solid var(--track-color,var(--lr-color-border));flex:auto;min-inline-size:0;display:flex;overflow:auto hidden}:where([part~=scroll-button]){inline-size:var(--lr-icon-button-size);min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);appearance:none;font:inherit;border:none;border-block-end:var(--lr-border-width-thin) solid var(--lr-color-border);color:var(--lr-color-text-quiet);cursor:pointer;transition:color var(--lr-transition-fast), background var(--lr-transition-fast);background:0 0;flex:none;place-items:center;padding:0;display:inline-grid}:where([part=nav]:not(:has([part~=tablist][data-scroll-overflow]))) [part~=scroll-button],:where([part~=scroll-button][hidden]){display:none}:where([part~=scroll-button]):where(:hover){color:var(--lr-tab-group-scroll-button-hover-color,var(--lr-color-text))}:where([part~=scroll-button]):where(:active),:where([part~=scroll-button]):where([data-pressed]){background:var(--lr-tab-group-scroll-button-active-bg,color-mix(in oklab, transparent, var(--lr-color-mix-partner) var(--lr-color-mix-active)));color:var(--lr-tab-group-scroll-button-active-color,var(--lr-color-text))}[part~=scroll-button]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:calc(var(--lr-focus-ring-offset) * -1);border-radius:var(--lr-radius)}[part=scroll-button-glyph]{align-items:center;display:inline-flex}[part~=scroll-button-start] [part=scroll-button-glyph]{transform:scaleX(-1)}:host(:dir(rtl)) [part~=scroll-button-start] [part=scroll-button-glyph]{transform:none}:host(:dir(rtl)) [part~=scroll-button-end] [part=scroll-button-glyph]{transform:scaleX(-1)}[part~=tablist][data-scroll-overflow]:where([data-scroll-start][data-scroll-end]){-webkit-mask-image:linear-gradient(to right, transparent, var(--lr-mask-opaque) var(--lr-scroll-fade-size), var(--lr-mask-opaque) calc(100% - var(--lr-scroll-fade-size)), transparent);mask-image:linear-gradient(to right, transparent, var(--lr-mask-opaque) var(--lr-scroll-fade-size), var(--lr-mask-opaque) calc(100% - var(--lr-scroll-fade-size)), transparent)}[part~=tablist][data-scroll-overflow]:where([data-scroll-end]:not([data-scroll-start])){-webkit-mask-image:linear-gradient(to right, var(--lr-mask-opaque), var(--lr-mask-opaque) calc(100% - var(--lr-scroll-fade-size)), transparent);mask-image:linear-gradient(to right, var(--lr-mask-opaque), var(--lr-mask-opaque) calc(100% - var(--lr-scroll-fade-size)), transparent)}[part~=tablist][data-scroll-overflow]:where([data-scroll-start]:not([data-scroll-end])),:host(:dir(rtl)) [part~=tablist][data-scroll-overflow]:where([data-scroll-end]:not([data-scroll-start])){-webkit-mask-image:linear-gradient(to right, transparent, var(--lr-mask-opaque) var(--lr-scroll-fade-size), var(--lr-mask-opaque));mask-image:linear-gradient(to right, transparent, var(--lr-mask-opaque) var(--lr-scroll-fade-size), var(--lr-mask-opaque))}:host(:dir(rtl)) [part~=tablist][data-scroll-overflow]:where([data-scroll-start]:not([data-scroll-end])){-webkit-mask-image:linear-gradient(to right, var(--lr-mask-opaque), var(--lr-mask-opaque) calc(100% - var(--lr-scroll-fade-size)), transparent);mask-image:linear-gradient(to right, var(--lr-mask-opaque), var(--lr-mask-opaque) calc(100% - var(--lr-scroll-fade-size)), transparent)}[part=tab]{appearance:none;border:none;border-block-end:var(--lr-border-width-medium) solid transparent;padding:var(--lr-space-s) var(--lr-space-xs);font:inherit;font-weight:var(--lr-font-weight-medium);color:var(--lr-color-text-quiet);cursor:pointer;white-space:nowrap;align-items:center;gap:var(--lr-space-xs);transition:color var(--lr-transition-fast), border-color var(--lr-transition-fast);background:0 0;margin-block-end:var(--lr-size-neg-1px);display:inline-flex;position:relative}[data-tab-label]{min-inline-size:0}:where([part=tab]):hover:where(:not([aria-disabled=true])){color:var(--lr-tab-group-hover-color,var(--lr-color-text))}:where([part=tab]):active:where(:not([aria-disabled=true])){background:var(--lr-tab-group-active-bg,color-mix(in oklab, transparent, var(--lr-color-mix-partner) var(--lr-color-mix-active)));color:var(--lr-tab-group-active-color,var(--lr-tab-group-hover-color,var(--lr-color-text)))}[part=tab][aria-selected=true]{color:var(--lr-tab-group-selected-color,var(--lr-color-brand));border-block-end-color:var(--indicator-color,var(--lr-tab-group-indicator-color,var(--lr-color-brand)))}[part=active-tab-indicator]{block-size:var(--lr-border-width-medium);background:var(--indicator-color,var(--lr-tab-group-indicator-color,var(--lr-color-brand)));pointer-events:none;position:absolute;inset-block-end:calc(-1 * var(--lr-border-width-medium));inset-inline:0}[part=tab][aria-disabled=true]{cursor:not-allowed;pointer-events:none;opacity:var(--lr-opacity-disabled)}[part=tab]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:calc(var(--lr-focus-ring-offset) * -1);border-radius:var(--lr-radius)}[part=panel]{min-inline-size:0;overflow-wrap:anywhere;padding-block-start:var(--lr-space-xs)}[part=body]{flex:auto;min-block-size:0;min-inline-size:0;overflow:auto}[part=panel]:hover{outline:var(--lr-border-width-thin) solid var(--lr-color-border);outline-offset:var(--lr-focus-ring-offset);border-radius:var(--lr-radius)}[part=panel]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset);border-radius:var(--lr-radius)}@media (prefers-reduced-motion:reduce){[part=tab],[part~=scroll-button]{transition:none!important}}:host([placement=bottom]) [part~=base]{flex-direction:column-reverse}:host([placement=bottom]) [part~=tablist],:host([placement=bottom]) [part~=scroll-button]{border-block-end:none;border-block-start:var(--track-width,var(--lr-border-width-thin)) solid var(--track-color,var(--lr-color-border))}:host([placement=bottom]) [part=tab][aria-selected=true]{border-block-end-color:#0000}:host([placement=bottom]) [part=active-tab-indicator]{inset-block-start:calc(-1 * var(--lr-border-width-medium));inset-block-end:auto}:host([placement=start]) [part=nav],:host([placement=end]) [part=nav]{min-inline-size:0;max-inline-size:var(--lr-tab-group-vertical-nav-max-inline-size,var(--lr-size-12rem));flex:0 auto;max-block-size:100%}:host([placement=start]) [part~=base],:host([placement=end]) [part~=base]{flex-direction:row;align-items:stretch}:host([placement=end]) [part~=base]{flex-direction:row-reverse}:host([placement=start]) [part~=tablist],:host([placement=end]) [part~=tablist]{align-items:stretch;gap:var(--lr-space-2xs);border-block-end:none;flex-direction:column;flex:auto;min-block-size:0;max-block-size:100%;min-inline-size:0;max-inline-size:100%;overflow:hidden auto}:host([placement=start]) [part=tab],:host([placement=end]) [part=tab]{text-overflow:ellipsis;min-inline-size:0;max-inline-size:100%;overflow:hidden}:host([placement=start]) [data-tab-label],:host([placement=end]) [data-tab-label]{text-overflow:ellipsis;white-space:nowrap;flex:auto;max-inline-size:100%;display:block;overflow:hidden}:host([placement=start]) [part~=tablist]{border-inline-end:var(--track-width,var(--lr-border-width-thin)) solid var(--track-color,var(--lr-color-border))}:host([placement=end]) [part~=tablist]{border-inline-start:var(--track-width,var(--lr-border-width-thin)) solid var(--track-color,var(--lr-color-border))}:host([placement=start]) [part~=tablist][data-scroll-overflow],:host([placement=end]) [part~=tablist][data-scroll-overflow]{-webkit-mask-image:none;mask-image:none}:host([placement=start]) [part=tab][aria-selected=true],:host([placement=end]) [part=tab][aria-selected=true]{box-shadow:none;border-block-end-color:#0000}:host([placement=start]) [part=tab][aria-selected=true]{border-inline-end:var(--lr-border-width-thick) solid var(--indicator-color,var(--lr-tab-group-indicator-color,var(--lr-color-brand)))}:host([placement=end]) [part=tab][aria-selected=true]{border-inline-start:var(--lr-border-width-thick) solid var(--indicator-color,var(--lr-tab-group-indicator-color,var(--lr-color-brand)))}:host([placement=start]) [part=active-tab-indicator]{inset-block:0;inset-inline:auto calc(-1 * var(--lr-border-width-thick));inline-size:var(--lr-border-width-thick);block-size:auto}:host([placement=end]) [part=active-tab-indicator]{inset-block:0;inset-inline:calc(-1 * var(--lr-border-width-thick)) auto;inline-size:var(--lr-border-width-thick);block-size:auto}:host([placement=start]) [part=panel],:host([placement=end]) [part=panel]{flex:auto;min-inline-size:0}@media (forced-colors:active){[part~=tablist][data-scroll-overflow],:host(:dir(rtl)) [part~=tablist][data-scroll-overflow]{-webkit-mask-image:none;mask-image:none}}`;export{styles};

package/dist/components/layout/virtual-list/virtual-list.class.js

@@ -1,4 +1,4 @@
-var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{repeat}from"lit/directives/repeat.js";import{styleMap}from"lit/directives/style-map.js";import{LyraElement}from"../../../internal/lyra-element.js";import{prefersReducedMotion}from"../../../internal/motion.js";import{finiteAdd,finiteCount,finiteInteger}from"../../../internal/numbers.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{styles}from"./virtual-list.styles.js";const DEFAULT_ROW_ESTIMATE_PX=48,DEFAULT_GROUP_ESTIMATE_PX=32,DEFAULT_OVERSCAN_ROWS=6,MAX_OVERSCAN_ROWS=100;function normalizeOverscan(value){if(value===null)return DEFAULT_OVERSCAN_ROWS;const numeric=typeof value=="number"?value:Number(value);return Number.isFinite(numeric)?Math.min(MAX_OVERSCAN_ROWS,Math.max(0,Math.floor(numeric))):DEFAULT_OVERSCAN_ROWS}const overscanConverter={fromAttribute(value){return normalizeOverscan(value)}};function normalizeRowHeight(value){if(value==="auto")return"auto";const numeric=typeof value=="number"?value:Number(value);return Number.isFinite(numeric)&&numeric>0?numeric:"auto"}const rowHeightConverter={fromAttribute(value){return value===null?"auto":normalizeRowHeight(value)}};function isIndexedSource(source){return!Array.isArray(source)}function domKeyToken(key){if(typeof key=="number"){if(Number.isNaN(key))return"number:NaN";if(Object.is(key,-0))return"number:-0"}return`${typeof key}:${String(key)}`}class LyraVirtualList extends LyraElement{constructor(){super(...arguments),this.items=[],this.renderItem=()=>nothing,this.rowHeight="auto",this.itemRole="listitem",this.rowIndexOffset=0,this.overscan=DEFAULT_OVERSCAN_ROWS,this.activeItemId="",this.loading=!1,this.hasMore=!1,this.containerScrollTop=0,this.viewportHeight=0,this.renderUnmeasuredWindow=!0,this.offsets=[0],this.rowIdentities=[],this.fixedRowHeight=null,this.measuredHeights=new Map,this.measuredIndices=new Map,this.indexedMeasurementIndices=[],this.indexedMeasurementDeltaPrefix=[0],this.indexedMeasurementIndexDirty=!0,this.offsetsDirty=!0,this.itemsChangedPendingPrune=!1,this.renderStart=0,this.renderEnd=-1,this.visibleStart=0,this.visibleEnd=-1,this.lastEmittedStart=-1,this.lastEmittedEnd=-1,this.loadMoreArmed=!0,this.measurementGeneration=0,this.isFirstUpdate=!0,this.stickyHeight=0,this.observedRows=new Map,this.observedRowKeys=new WeakMap,this.observedRowIndices=new WeakMap,this.observedGroups=new Map,this.observedGroupIndices=new WeakMap,this.ownerRealmGeneration=0,this.inResizeDelivery=!1,this.deferredRowObservations=new Map,this.deferredGroupObservations=new Map,this.activeIndexForLength=-1,this.activeIndexForId="",this.activeIndexCache=-1,this.pendingScrollTop=null,this.normalizedGroups=[],this.normalizedGroupByIndex=new Map,this.measuredGroupHeights=new Map,this.groupHeightPrefix=[0],this.onUserScrollIntent=event=>{event instanceof KeyboardEvent&&!new Set(["ArrowUp","ArrowDown","PageUp","PageDown","Home","End"," "]).has(event.key)||(this.pendingScrollCorrection=void 0)},this.onScroll=e=>{if(this.pendingScrollTop=e.currentTarget.scrollTop,this.scrollRafId!==void 0)return;const ownerDocument=this.ownerDocument,ownerWindow=ownerDocument.defaultView;if(!ownerWindow||!this.isConnected)return;const generation=this.ownerRealmGeneration,handle=ownerWindow.requestAnimationFrame(()=>{if(!(this.scrollRafId!==handle||this.scrollRafOwner!==ownerWindow||this.scrollRafDocument!==ownerDocument||!this.isCurrentOwnerWork(ownerDocument,generation))&&(this.scrollRafId=void 0,this.scrollRafOwner=void 0,this.scrollRafDocument=void 0,this.pendingScrollTop!==null)){const scrollTop=this.pendingScrollTop;this.pendingScrollTop=null;const moved=this.containerScrollTop!==scrollTop;this.containerScrollTop=scrollTop,moved&&this.emit("lr-virtual-scroll",{scrollTop,viewportHeight:this.viewportHeight})}});this.scrollRafId=handle,this.scrollRafOwner=ownerWindow,this.scrollRafDocument=ownerDocument},this.onRowsResized=entries=>{if(this.beginResizeDelivery(),this.fixedRowHeight!=null)return;const base=this.scrollContainer,oldScrollTop=base?.scrollTop??this.containerScrollTop;let scrollAdjustment=0,changed=!1;for(const entry of entries){const row=entry.target,key=this.observedRowKeys.get(row),index=this.observedRowIndices.get(row);if(key===void 0||index===void 0)continue;const height=entry.borderBoxSize?.[0]?.blockSize??entry.target.getBoundingClientRect().height,prev=this.measuredHeights.get(key);if(prev===void 0||Math.abs(prev-height)>.5){const oldBottom=this.rowBottomAt(index);this.measuredHeights.set(key,height),this.measuredIndices.set(key,index);const oldHeight=prev??DEFAULT_ROW_ESTIMATE_PX;oldBottom<=oldScrollTop&&(scrollAdjustment+=height-oldHeight),changed=!0}}if(changed){if(this.indexedMeasurementIndexDirty=!0,base&&scrollAdjustment!==0){const nextScrollTop=Math.max(0,oldScrollTop+scrollAdjustment);base.scrollTop=nextScrollTop,this.containerScrollTop=nextScrollTop,this.pendingScrollTop=null}this.offsetsDirty=!0,this.measurementGeneration+=1,this.requestUpdate()}},this.onGroupsResized=entries=>{this.beginResizeDelivery();const base=this.scrollContainer,oldScrollTop=base?.scrollTop??this.containerScrollTop;let scrollAdjustment=0,changed=!1;for(const entry of entries){const marker=entry.target,index=this.observedGroupIndices.get(marker);if(index===void 0||!this.normalizedGroupByIndex.has(index))continue;const height=entry.borderBoxSize?.[0]?.blockSize??entry.target.getBoundingClientRect().height;if(!Number.isFinite(height)||height<0)continue;const previous=this.measuredGroupHeights.get(index)??DEFAULT_GROUP_ESTIMATE_PX;if(Math.abs(previous-height)<=.5)continue;const oldRowTop=this.offsetAt(index);this.measuredGroupHeights.set(index,height),oldRowTop<=oldScrollTop&&(scrollAdjustment+=height-previous),changed=!0}if(changed){if(base&&scrollAdjustment!==0){const nextScrollTop=Math.max(0,oldScrollTop+scrollAdjustment);base.scrollTop=nextScrollTop,this.containerScrollTop=nextScrollTop,this.pendingScrollTop=null}this.offsetsDirty=!0,this.measurementGeneration+=1,this.requestUpdate()}},this.onStickyResized=entries=>{this.beginResizeDelivery();const entry=entries[0];if(!entry)return;const height=entry.borderBoxSize?.[0]?.blockSize??entry.contentRect.height;Math.abs(this.stickyHeight-height)>.5&&(this.stickyHeight=height)}}static{this.ownedCollectionProperties=Object.freeze(["items","source","groups"])}static{this.identityCollectionProperties=Object.freeze(["items","source"])}static{this.identityCollectionObjectProperties=Object.freeze(["source"])}static{this.styles=[LyraElement.styles,styles]}get scrollContainer(){return this.renderRoot?.querySelector('[part="base"]')??void 0}get renderedRows(){const root=this.renderRoot;return root?[...root.querySelectorAll('[part="row"]')]:[]}get safeRowIndexOffset(){return finiteCount(this.rowIndexOffset)}computedAriaRowIndex(index){return finiteInteger(finiteAdd(index+1,this.safeRowIndexOffset),1,1,Number.MAX_SAFE_INTEGER)}get activeIndex(){if(this.activeItemId==="")return-1;const source=this.effectiveSource,count=this.itemCount;if(this.activeIndexFor===source&&this.activeIndexForLength===count&&Object.is(this.activeIndexForId,this.activeItemId)&&this.activeIndexForKeyFn===this.keyFunction)return this.activeIndexCache;if(this.activeIndexFor=source,this.activeIndexForLength=count,this.activeIndexForId=this.activeItemId,this.activeIndexForKeyFn=this.keyFunction,this.activeIndexCache=-1,isIndexedSource(source)){if(!this.keyFunction&&source.indexOfKey){const candidate=source.indexOfKey(this.activeItemId);Number.isInteger(candidate)&&candidate>=0&&candidate<count&&(this.activeIndexCache=candidate)}return this.activeIndexCache}for(let index=0;index<count;index++){const item=this.itemAt(index);if(Object.is(this.keyOf(item,index),this.activeItemId)){this.activeIndexCache=index;break}}return this.activeIndexCache}connectedCallback(){super.connectedCallback(),this.ownerDocument.defaultView&&this.seedFirstRenderState(()=>{this.renderUnmeasuredWindow=!1,this.requestUpdate()}),this.resetOwnerRealmWork();const ownerDocument=this.ownerDocument,ownerWindow=ownerDocument.defaultView,generation=this.ownerRealmGeneration,ResizeObserverCtor=ownerWindow?.ResizeObserver;if(ResizeObserverCtor){const rowObserver=new ResizeObserverCtor(entries=>{this.rowResizeObserver!==rowObserver||!this.isCurrentOwnerWork(ownerDocument,generation)||this.onRowsResized(entries)}),groupObserver=new ResizeObserverCtor(entries=>{this.groupResizeObserver!==groupObserver||!this.isCurrentOwnerWork(ownerDocument,generation)||this.onGroupsResized(entries)}),stickyObserver=new ResizeObserverCtor(entries=>{this.stickyResizeObserver!==stickyObserver||!this.isCurrentOwnerWork(ownerDocument,generation)||this.onStickyResized(entries)});this.rowResizeObserver=rowObserver,this.groupResizeObserver=groupObserver,this.stickyResizeObserver=stickyObserver}this.hasUpdated&&(this.attachContainerListeners(),this.syncRowObservers(),this.syncGroupObservers(),this.syncStickyOverlay())}disconnectedCallback(){this.resetOwnerRealmWork(),super.disconnectedCallback()}adoptedCallback(){super.adoptedCallback(),this.resetOwnerRealmWork()}isCurrentOwnerWork(ownerDocument,generation){return this.ownerRealmGeneration===generation&&this.isConnected&&this.ownerDocument===ownerDocument}resetOwnerRealmWork(){this.ownerRealmGeneration+=1,this.rowResizeObserver?.disconnect(),this.rowResizeObserver=void 0,this.groupResizeObserver?.disconnect(),this.groupResizeObserver=void 0,this.observedRows.clear(),this.observedGroups.clear(),this.deferredRowObservations.clear(),this.deferredGroupObservations.clear(),this.inResizeDelivery=!1,this.rowObserveRafId!==void 0&&this.rowObserveRafOwner?.cancelAnimationFrame(this.rowObserveRafId),this.rowObserveRafId=void 0,this.rowObserveRafOwner=void 0,this.rowObserveRafDocument=void 0,this.containerResizeObserver?.disconnect(),this.containerResizeObserver=void 0,this.stickyResizeObserver?.disconnect(),this.stickyResizeObserver=void 0,this.observedSticky=void 0,this.scrollRafId!==void 0&&this.scrollRafOwner?.cancelAnimationFrame(this.scrollRafId),this.scrollRafId=void 0,this.scrollRafOwner=void 0,this.scrollRafDocument=void 0,this.pendingScrollTop=null,this.pendingScrollCorrection=void 0,this.detachContainerListeners(),this.scrollListenerTarget=void 0}firstUpdated(changed){super.firstUpdated(changed),this.attachContainerListeners()}willUpdate(changed){super.willUpdate(changed),this.isFirstUpdate=!this.hasUpdated,(changed.has("items")||changed.has("source")||changed.has("keyFunction")||changed.has("rowHeight")||changed.has("groups")||changed.has("activeItemId"))&&(this.pendingScrollCorrection=void 0),(changed.has("items")||changed.has("source")||changed.has("rowHeight")||changed.has("keyFunction")||changed.has("groups"))&&(this.offsetsDirty=!0),(changed.has("items")||changed.has("source"))&&(this.itemsChangedPendingPrune=!0),isIndexedSource(this.effectiveSource)&&(changed.has("items")||changed.has("source")||changed.has("keyFunction"))&&(this.measuredHeights.clear(),this.measuredIndices.clear(),this.indexedMeasurementIndexDirty=!0),changed.has("groups")&&this.measuredGroupHeights.clear(),(changed.has("items")||changed.has("source")||changed.has("groups"))&&this.recomputeGroups(),changed.has("rowHeight")&&(this.fixedRowHeight=this.parseRowHeight(this.rowHeight),this.fixedRowHeight!=null&&(this.measuredHeights.clear(),this.measuredIndices.clear(),this.indexedMeasurementIndexDirty=!0)),this.offsetsDirty&&(this.recomputeOffsets(),this.offsetsDirty=!1),this.computeRange()}updated(changed){super.updated(changed),this.syncRowObservers(),this.syncGroupObservers(),this.syncStickyOverlay(),changed.has("activeItemId")&&!this.isFirstUpdate&&this.scrollActiveIntoView(),this.emitRangeChangeIfNeeded(),this.maybeFireLoadMore(),this.maybeCorrectPendingScroll()}parseRowHeight(value){const normalized=normalizeRowHeight(value);return normalized==="auto"?null:normalized}get effectiveSource(){return this.source??this.items}get itemCount(){const source=this.effectiveSource;return isIndexedSource(source)?finiteCount(source.count):source.length}itemAt(index){const source=this.effectiveSource;return isIndexedSource(source)?source.itemAt(index):source[index]}keyOf(item,index){const source=this.effectiveSource,key=this.keyFunction?this.keyFunction(item,index):isIndexedSource(source)?source.keyAt?.(index)??index:index;return typeof key=="string"||typeof key=="number"?key:index}rowIdentity(key,occurrence){const token=domKeyToken(key);return`${token.length}:${token}:${occurrence}`}identityAt(index,item=this.itemAt(index)){return isIndexedSource(this.effectiveSource)?this.rowIdentity(this.keyOf(item,index),index):this.rowIdentities[index]??this.rowIdentity(this.keyOf(item,index),index)}groupHeightAt(index){const group=this.normalizedGroupByIndex.get(index);return!group||group.label===""?0:this.measuredGroupHeights.get(index)??DEFAULT_GROUP_ESTIMATE_PX}rowHeightAt(index){return this.fixedRowHeight!=null?this.fixedRowHeight:this.measuredHeights.get(this.identityAt(index))??DEFAULT_ROW_ESTIMATE_PX}groupContributionThrough(index){let low=0,high=this.normalizedGroups.length;for(;low<high;){const middle=low+high>>1;this.normalizedGroups[middle].startIndex<=index?low=middle+1:high=middle}return this.groupHeightPrefix[low]??0}recomputeGroupHeightPrefix(){const prefix=new Array(this.normalizedGroups.length+1);prefix[0]=0;for(let index=0;index<this.normalizedGroups.length;index++){const group=this.normalizedGroups[index],height=group.label===""?0:this.measuredGroupHeights.get(group.startIndex)??DEFAULT_GROUP_ESTIMATE_PX;prefix[index+1]=finiteAdd(prefix[index],height)}this.groupHeightPrefix=prefix}indexedOffsetForIndex(index){const baseHeight=this.fixedRowHeight??DEFAULT_ROW_ESTIMATE_PX;let offset=index>Number.MAX_VALUE/baseHeight?Number.MAX_VALUE:index*baseHeight;if(this.fixedRowHeight==null){this.rebuildIndexedMeasurementIndex();let low=0,high=this.indexedMeasurementIndices.length;for(;low<high;){const middle=low+high>>1;this.indexedMeasurementIndices[middle]<index?low=middle+1:high=middle}offset=finiteAdd(offset,this.indexedMeasurementDeltaPrefix[low]??0)}return Math.max(0,finiteAdd(offset,this.groupContributionThrough(index)))}rebuildIndexedMeasurementIndex(){if(!this.indexedMeasurementIndexDirty)return;const retained=[];for(const[identity,index]of this.measuredIndices){const height=this.measuredHeights.get(identity);height!==void 0&&retained.push({index,delta:height-DEFAULT_ROW_ESTIMATE_PX})}retained.sort((a,b)=>a.index-b.index);const indices=new Array(retained.length),prefix=new Array(retained.length+1);prefix[0]=0;for(let position=0;position<retained.length;position++){const measurement=retained[position];indices[position]=measurement.index,prefix[position+1]=finiteAdd(prefix[position],measurement.delta)}this.indexedMeasurementIndices=indices,this.indexedMeasurementDeltaPrefix=prefix,this.indexedMeasurementIndexDirty=!1}pruneIndexedMeasurements(){if(!isIndexedSource(this.effectiveSource)||this.fixedRowHeight!=null||this.renderEnd<this.renderStart)return!1;const renderedCount=this.renderEnd-this.renderStart+1,retentionRows=Math.max(renderedCount,normalizeOverscan(this.overscan)*4),firstRetained=Math.max(0,this.renderStart-retentionRows),lastRetained=Math.min(this.itemCount-1,this.renderEnd+retentionRows);let removedDeltaBeforeWindow=0,pruned=!1;for(const[identity,measuredIndex]of this.measuredIndices)if(measuredIndex<firstRetained||measuredIndex>lastRetained){const height=this.measuredHeights.get(identity);height!==void 0&&measuredIndex<firstRetained&&(removedDeltaBeforeWindow=finiteAdd(removedDeltaBeforeWindow,height-DEFAULT_ROW_ESTIMATE_PX)),this.measuredIndices.delete(identity),this.measuredHeights.delete(identity),pruned=!0}if(pruned&&(this.indexedMeasurementIndexDirty=!0,removedDeltaBeforeWindow!==0)){const base=this.scrollContainer,oldScrollTop=base?.scrollTop??this.containerScrollTop,nextScrollTop=Math.max(0,oldScrollTop-removedDeltaBeforeWindow);base&&(base.scrollTop=nextScrollTop),this.containerScrollTop=nextScrollTop,this.pendingScrollTop=null}return pruned}offsetAt(index){return isIndexedSource(this.effectiveSource)?this.indexedOffsetForIndex(index):this.offsets[index]??0}recomputeOffsets(){const n=this.itemCount;if(this.recomputeGroupHeightPrefix(),isIndexedSource(this.effectiveSource)){this.offsets=[0],this.rowIdentities=[],this.itemsChangedPendingPrune=!1;return}const offsets=new Array(n+1);let cursor=0;const liveKeys=this.itemsChangedPendingPrune&&this.fixedRowHeight==null?new Set:null,occurrences=new Map,identities=new Array(n);for(let i=0;i<n;i++){cursor=finiteAdd(cursor,this.groupHeightAt(i)),offsets[i]=cursor;const key=this.keyOf(this.itemAt(i),i),token=domKeyToken(key),occurrence=occurrences.get(token)??0;occurrences.set(token,occurrence+1);const identity=this.rowIdentity(key,occurrence);identities[i]=identity;let h;this.fixedRowHeight!=null?h=this.fixedRowHeight:(liveKeys?.add(identity),h=this.measuredHeights.get(identity)??DEFAULT_ROW_ESTIMATE_PX),cursor=finiteAdd(cursor,h)}if(offsets[n]=cursor,this.offsets=offsets,this.rowIdentities=identities,this.itemsChangedPendingPrune=!1,liveKeys){for(const key of this.measuredHeights.keys())liveKeys.has(key)||(this.measuredHeights.delete(key),this.measuredIndices.delete(key),this.indexedMeasurementIndexDirty=!0);for(const key of this.measuredIndices.keys())liveKeys.has(key)||(this.measuredIndices.delete(key),this.indexedMeasurementIndexDirty=!0)}}groupTopAt(index){return Math.max(0,this.offsetAt(index)-this.groupHeightAt(index))}rowBottomAt(index){return finiteAdd(this.offsetAt(index),this.rowHeightAt(index))}entryTopAt(index){return this.groupTopAt(index)}findIndexAtOrAfter(offset){let lo=0,hi=this.itemCount-1;for(;lo<hi;){const mid=lo+Math.floor((hi-lo)/2);this.rowBottomAt(mid)<=offset?lo=mid+1:hi=mid}return lo}findIndexAtOrBefore(offset){let lo=0,hi=this.itemCount-1;for(;lo<hi;){const mid=lo+Math.ceil((hi-lo)/2);this.entryTopAt(mid)<offset?lo=mid:hi=mid-1}return lo}offsetForIndex(index){const clamped=Math.min(this.itemCount,Math.max(0,Math.trunc(index)||0));return this.offsetAt(clamped)}indexAtOffset(px){const n=this.itemCount;return n===0?-1:Number.isFinite(px)?Math.min(n-1,Math.max(0,this.findIndexAtOrAfter(px))):px>0?n-1:0}computeRange(){const n=this.itemCount;if(n===0){this.visibleStart=0,this.visibleEnd=-1,this.renderStart=0,this.renderEnd=-1;return}if(this.viewportHeight<=0){if(!this.renderUnmeasuredWindow){this.visibleStart=0,this.visibleEnd=-1,this.renderStart=0,this.renderEnd=-1;return}this.visibleStart=0,this.visibleEnd=0,this.renderStart=0,this.renderEnd=Math.min(n-1,normalizeOverscan(this.overscan));return}const viewTop=this.containerScrollTop,viewBottom=viewTop+this.viewportHeight;this.visibleStart=this.findIndexAtOrAfter(viewTop),this.visibleEnd=this.findIndexAtOrBefore(viewBottom);const overscan=normalizeOverscan(this.overscan);this.renderStart=Math.max(0,this.visibleStart-overscan),this.renderEnd=Math.min(n-1,this.visibleEnd+overscan),this.pruneIndexedMeasurements()&&this.computeRange()}attachContainerListeners(){const base=this.scrollContainer,ownerDocument=this.ownerDocument,ownerWindow=ownerDocument.defaultView;if(!base||!this.isConnected||!ownerWindow)return;this.containerResizeObserver?.disconnect(),this.detachContainerListeners();const generation=this.ownerRealmGeneration,ResizeObserverCtor=ownerWindow.ResizeObserver;if(ResizeObserverCtor){const observer=new ResizeObserverCtor(entries=>{if(this.containerResizeObserver!==observer||this.scrollListenerTarget!==base||!this.isCurrentOwnerWork(ownerDocument,generation))return;this.beginResizeDelivery();const entry=entries[0];entry&&(this.viewportHeight=entry.borderBoxSize?.[0]?.blockSize??entry.contentRect.height)});this.containerResizeObserver=observer,observer.observe(base)}else this.containerResizeObserver=void 0;base.addEventListener("scroll",this.onScroll,{passive:!0}),base.addEventListener("wheel",this.onUserScrollIntent,{passive:!0}),base.addEventListener("pointerdown",this.onUserScrollIntent,{passive:!0}),base.addEventListener("touchstart",this.onUserScrollIntent,{passive:!0}),base.addEventListener("keydown",this.onUserScrollIntent),this.scrollListenerTarget=base,ownerWindow.queueMicrotask(()=>{if(this.scrollListenerTarget!==base||this.scrollContainer!==base||!this.isCurrentOwnerWork(ownerDocument,generation))return;const viewportHeight=base.clientHeight,scrollTop=base.scrollTop;this.viewportHeight!==viewportHeight&&(this.viewportHeight=viewportHeight),this.containerScrollTop!==scrollTop&&(this.containerScrollTop=scrollTop)})}detachContainerListeners(){const target=this.scrollListenerTarget;target&&(target.removeEventListener("scroll",this.onScroll),target.removeEventListener("wheel",this.onUserScrollIntent),target.removeEventListener("pointerdown",this.onUserScrollIntent),target.removeEventListener("touchstart",this.onUserScrollIntent),target.removeEventListener("keydown",this.onUserScrollIntent))}beginResizeDelivery(){if(this.inResizeDelivery=!0,this.rowObserveRafId!==void 0)return;const ownerDocument=this.ownerDocument,ownerWindow=ownerDocument.defaultView;if(!ownerWindow||!this.isConnected){this.inResizeDelivery=!1;return}const generation=this.ownerRealmGeneration,handle=ownerWindow.requestAnimationFrame(()=>{if(this.rowObserveRafId!==handle||this.rowObserveRafOwner!==ownerWindow||this.rowObserveRafDocument!==ownerDocument||!this.isCurrentOwnerWork(ownerDocument,generation))return;this.rowObserveRafId=void 0,this.rowObserveRafOwner=void 0,this.rowObserveRafDocument=void 0,this.inResizeDelivery=!1;const ro=this.rowResizeObserver;for(const[identity,el]of this.deferredRowObservations)ro&&this.observedRows.get(identity)===el&&ro.observe(el);this.deferredRowObservations.clear();const groupObserver=this.groupResizeObserver;for(const[index,el]of this.deferredGroupObservations)groupObserver&&this.observedGroups.get(index)===el&&groupObserver.observe(el);this.deferredGroupObservations.clear()});this.rowObserveRafId=handle,this.rowObserveRafOwner=ownerWindow,this.rowObserveRafDocument=ownerDocument}syncRowObservers(){const ro=this.rowResizeObserver;if(!ro)return;if(this.fixedRowHeight!=null){for(const el of this.observedRows.values())ro.unobserve(el);this.observedRows.clear(),this.deferredRowObservations.clear();return}const current=new Map;this.renderRoot.querySelectorAll('[part="row"]').forEach(el=>{const index=Number(el.getAttribute("data-row-index"));if(!Number.isInteger(index)||index<0||index>=this.itemCount)return;const identity=this.identityAt(index);current.set(identity,el),this.observedRowKeys.set(el,identity),this.observedRowIndices.set(el,index)});for(const[identity,el]of this.observedRows)current.get(identity)!==el&&(ro.unobserve(el),this.observedRows.delete(identity),this.deferredRowObservations.delete(identity));for(const[identity,el]of current)this.observedRows.has(identity)||(this.observedRows.set(identity,el),this.inResizeDelivery?this.deferredRowObservations.set(identity,el):ro.observe(el))}syncGroupObservers(){const observer=this.groupResizeObserver;if(!observer)return;const current=new Map;this.renderRoot.querySelectorAll('[part="group"][data-group-index]').forEach(marker=>{const index=Number(marker.dataset.groupIndex);!Number.isInteger(index)||!this.normalizedGroupByIndex.has(index)||(current.set(index,marker),this.observedGroupIndices.set(marker,index))});for(const[index,marker]of this.observedGroups)current.get(index)!==marker&&(observer.unobserve(marker),this.observedGroups.delete(index),this.deferredGroupObservations.delete(index));for(const[index,marker]of current)this.observedGroups.has(index)||(this.observedGroups.set(index,marker),this.inResizeDelivery?this.deferredGroupObservations.set(index,marker):observer.observe(marker))}get stickyInset(){return this.renderStickyGroup?this.stickyHeight:0}scrollActiveIntoView(){const index=this.activeIndex;if(index<0)return;const behavior=prefersReducedMotion(this.ownerDocument.defaultView)?"auto":"smooth";this.performScrollTo(index,"auto",behavior)&&this.beginPendingScrollCorrection(index,"auto",behavior,this.activeItemId)}scrollToIndex(index,options){const n=this.itemCount;if(n===0)return;const clamped=finiteInteger(index,0,0,n-1),align=options?.align??"auto",behavior=prefersReducedMotion(this.ownerDocument.defaultView)?"auto":options?.behavior??"smooth";this.performScrollTo(clamped,align,behavior)?this.beginPendingScrollCorrection(clamped,align,behavior):this.pendingScrollCorrection=void 0}hasUnmeasuredGroupThrough(index){return this.normalizedGroups.some(group=>group.startIndex<=index&&group.label!==""&&!this.measuredGroupHeights.has(group.startIndex))}beginPendingScrollCorrection(index,align,behavior,activeItemId){if(this.fixedRowHeight!=null&&!this.hasUnmeasuredGroupThrough(index)){this.pendingScrollCorrection=void 0;return}this.pendingScrollCorrection={identity:this.identityAt(index),index,align,behavior,source:this.effectiveSource,keyFunction:this.keyFunction,activeItemId:activeItemId===""?void 0:activeItemId,lastMeasurementGeneration:this.measurementGeneration}}performScrollTo(index,align,behavior){const base=this.scrollContainer;if(!base)return!1;const inset=this.stickyInset,top=this.offsetAt(index),bottom=this.rowBottomAt(index),viewTop=base.scrollTop,viewBottom=viewTop+base.clientHeight;let target=null;return align==="start"?target=top-inset:align==="end"?target=bottom-base.clientHeight:top-inset<viewTop?target=top-inset:bottom>viewBottom&&(target=bottom-base.clientHeight),target===null?!1:(base.scrollTo({top:Math.max(0,target),behavior}),!0)}maybeCorrectPendingScroll(){const pending=this.pendingScrollCorrection;if(!pending||pending.lastMeasurementGeneration>=this.measurementGeneration)return;if(pending.source!==this.effectiveSource||pending.keyFunction!==this.keyFunction||pending.activeItemId!==void 0&&!Object.is(pending.activeItemId,this.activeItemId)){this.pendingScrollCorrection=void 0;return}const index=pending.activeItemId!==void 0?this.activeIndex:isIndexedSource(this.effectiveSource)?pending.index:this.rowIdentities.indexOf(pending.identity);if(index<0||index>=this.itemCount||this.identityAt(index)!==pending.identity){this.pendingScrollCorrection=void 0;return}this.performScrollTo(index,pending.align,pending.behavior),pending.index=index,pending.lastMeasurementGeneration=this.measurementGeneration,(this.fixedRowHeight!=null||this.measuredHeights.has(pending.identity))&&!this.hasUnmeasuredGroupThrough(index)&&(this.pendingScrollCorrection=void 0)}emitRangeChangeIfNeeded(){if(this.visibleEnd<this.visibleStart){this.lastEmittedStart=-1,this.lastEmittedEnd=-1;return}this.visibleStart===this.lastEmittedStart&&this.visibleEnd===this.lastEmittedEnd||(this.lastEmittedStart=this.visibleStart,this.lastEmittedEnd=this.visibleEnd,this.emit("lr-visible-range-change",{start:this.visibleStart,end:this.visibleEnd}))}maybeFireLoadMore(){const n=this.itemCount;if(!(n>0&&this.visibleEnd>=n-1)){this.loadMoreArmed=!0;return}!this.hasMore||this.loading||!this.loadMoreArmed||(this.loadMoreArmed=!1,this.emit("lr-load-more"))}renderRow(item,index,total,activeIndex){const key=this.keyOf(item,index),top=this.offsetAt(index),isActive=index===activeIndex,isRowMode=this.itemRole==="row";return html`
+var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{repeat}from"lit/directives/repeat.js";import{styleMap}from"lit/directives/style-map.js";import{LyraElement}from"../../../internal/lyra-element.js";import{prefersReducedMotion}from"../../../internal/motion.js";import{finiteAdd,finiteCount,finiteInteger}from"../../../internal/numbers.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{getOwnDataDescriptor,MISSING_OWN_DATA_DESCRIPTOR,UNSAFE_OWN_DATA_DESCRIPTOR}from"../../../internal/data-descriptors.js";import{styles}from"./virtual-list.styles.js";const DEFAULT_ROW_ESTIMATE_PX=48,DEFAULT_GROUP_ESTIMATE_PX=32,DEFAULT_OVERSCAN_ROWS=6,MAX_OVERSCAN_ROWS=100,MAX_VIRTUAL_LIST_GROUPS=1e4,EMPTY_VIRTUAL_LIST_GROUPS=Object.freeze([]);function normalizeOverscan(value){if(value===null)return DEFAULT_OVERSCAN_ROWS;const numeric=typeof value=="number"?value:Number(value);return Number.isFinite(numeric)?Math.min(MAX_OVERSCAN_ROWS,Math.max(0,Math.floor(numeric))):DEFAULT_OVERSCAN_ROWS}const overscanConverter={fromAttribute(value){return normalizeOverscan(value)}};function normalizeRowHeight(value){if(value==="auto")return"auto";const numeric=typeof value=="number"?value:Number(value);return Number.isFinite(numeric)&&numeric>0?numeric:"auto"}const rowHeightConverter={fromAttribute(value){return value===null?"auto":normalizeRowHeight(value)}};function isIndexedSource(source){return!Array.isArray(source)}function domKeyToken(key){if(typeof key=="number"){if(Number.isNaN(key))return"number:NaN";if(Object.is(key,-0))return"number:-0"}return`${typeof key}:${String(key)}`}class LyraVirtualList extends LyraElement{constructor(){super(...arguments),this.items=[],this.renderItem=()=>nothing,this.rowHeight="auto",this.itemRole="listitem",this.rowIndexOffset=0,this.overscan=DEFAULT_OVERSCAN_ROWS,this.activeItemId="",this.loading=!1,this.hasMore=!1,this.containerScrollTop=0,this.viewportHeight=0,this.renderUnmeasuredWindow=!0,this.offsets=[0],this.rowIdentities=[],this.fixedRowHeight=null,this.measuredHeights=new Map,this.measuredIndices=new Map,this.indexedMeasurementIndices=[],this.indexedMeasurementDeltaPrefix=[0],this.indexedMeasurementIndexDirty=!0,this.offsetsDirty=!0,this.itemsChangedPendingPrune=!1,this.renderStart=0,this.renderEnd=-1,this.visibleStart=0,this.visibleEnd=-1,this.lastEmittedStart=-1,this.lastEmittedEnd=-1,this.loadMoreArmed=!0,this.measurementGeneration=0,this.isFirstUpdate=!0,this.stickyHeight=0,this.observedRows=new Map,this.observedRowKeys=new WeakMap,this.observedRowIndices=new WeakMap,this.observedGroups=new Map,this.observedGroupIndices=new WeakMap,this.ownerRealmGeneration=0,this.inResizeDelivery=!1,this.deferredRowObservations=new Map,this.deferredGroupObservations=new Map,this.activeIndexForLength=-1,this.activeIndexForId="",this.activeIndexCache=-1,this.pendingScrollTop=null,this.normalizedGroups=EMPTY_VIRTUAL_LIST_GROUPS,this.normalizedGroupByIndex=new Map,this.measuredGroupHeights=new Map,this.groupHeightPrefix=[0],this.onUserScrollIntent=event=>{event instanceof KeyboardEvent&&!new Set(["ArrowUp","ArrowDown","PageUp","PageDown","Home","End"," "]).has(event.key)||(this.pendingScrollCorrection=void 0)},this.onScroll=e=>{if(this.pendingScrollTop=e.currentTarget.scrollTop,this.scrollRafId!==void 0)return;const ownerDocument=this.ownerDocument,ownerWindow=ownerDocument.defaultView;if(!ownerWindow||!this.isConnected)return;const generation=this.ownerRealmGeneration,handle=ownerWindow.requestAnimationFrame(()=>{if(!(this.scrollRafId!==handle||this.scrollRafOwner!==ownerWindow||this.scrollRafDocument!==ownerDocument||!this.isCurrentOwnerWork(ownerDocument,generation))&&(this.scrollRafId=void 0,this.scrollRafOwner=void 0,this.scrollRafDocument=void 0,this.pendingScrollTop!==null)){const scrollTop=this.pendingScrollTop;this.pendingScrollTop=null;const moved=this.containerScrollTop!==scrollTop;this.containerScrollTop=scrollTop,moved&&this.emit("lr-virtual-scroll",{scrollTop,viewportHeight:this.viewportHeight})}});this.scrollRafId=handle,this.scrollRafOwner=ownerWindow,this.scrollRafDocument=ownerDocument},this.onRowsResized=entries=>{if(this.beginResizeDelivery(),this.fixedRowHeight!=null)return;const base=this.scrollContainer,oldScrollTop=base?.scrollTop??this.containerScrollTop;let scrollAdjustment=0,changed=!1;for(const entry of entries){const row=entry.target,key=this.observedRowKeys.get(row),index=this.observedRowIndices.get(row);if(key===void 0||index===void 0)continue;const height=entry.borderBoxSize?.[0]?.blockSize??entry.target.getBoundingClientRect().height,prev=this.measuredHeights.get(key);if(prev===void 0||Math.abs(prev-height)>.5){const oldBottom=this.rowBottomAt(index);this.measuredHeights.set(key,height),this.measuredIndices.set(key,index);const oldHeight=prev??DEFAULT_ROW_ESTIMATE_PX;oldBottom<=oldScrollTop&&(scrollAdjustment+=height-oldHeight),changed=!0}}if(changed){if(this.indexedMeasurementIndexDirty=!0,base&&scrollAdjustment!==0){const nextScrollTop=Math.max(0,oldScrollTop+scrollAdjustment);base.scrollTop=nextScrollTop,this.containerScrollTop=nextScrollTop,this.pendingScrollTop=null}this.offsetsDirty=!0,this.measurementGeneration+=1,this.requestUpdate()}},this.onGroupsResized=entries=>{this.beginResizeDelivery();const base=this.scrollContainer,oldScrollTop=base?.scrollTop??this.containerScrollTop;let scrollAdjustment=0,changed=!1;for(const entry of entries){const marker=entry.target,index=this.observedGroupIndices.get(marker);if(index===void 0||!this.normalizedGroupByIndex.has(index))continue;const height=entry.borderBoxSize?.[0]?.blockSize??entry.target.getBoundingClientRect().height;if(!Number.isFinite(height)||height<0)continue;const previous=this.measuredGroupHeights.get(index)??DEFAULT_GROUP_ESTIMATE_PX;if(Math.abs(previous-height)<=.5)continue;const oldRowTop=this.offsetAt(index);this.measuredGroupHeights.set(index,height),oldRowTop<=oldScrollTop&&(scrollAdjustment+=height-previous),changed=!0}if(changed){if(base&&scrollAdjustment!==0){const nextScrollTop=Math.max(0,oldScrollTop+scrollAdjustment);base.scrollTop=nextScrollTop,this.containerScrollTop=nextScrollTop,this.pendingScrollTop=null}this.offsetsDirty=!0,this.measurementGeneration+=1,this.requestUpdate()}},this.onStickyResized=entries=>{this.beginResizeDelivery();const entry=entries[0];if(!entry)return;const height=entry.borderBoxSize?.[0]?.blockSize??entry.contentRect.height;Math.abs(this.stickyHeight-height)>.5&&(this.stickyHeight=height)}}static{this.ownedCollectionProperties=Object.freeze(["items","source","groups"])}static{this.identityCollectionProperties=Object.freeze(["items","source"])}static{this.identityCollectionObjectProperties=Object.freeze(["source"])}static{this.styles=[LyraElement.styles,styles]}get scrollContainer(){return this.renderRoot?.querySelector('[part="base"]')??void 0}get renderedRows(){const root=this.renderRoot;return root?[...root.querySelectorAll('[part="row"]')]:[]}get safeRowIndexOffset(){return finiteCount(this.rowIndexOffset)}computedAriaRowIndex(index){return finiteInteger(finiteAdd(index+1,this.safeRowIndexOffset),1,1,Number.MAX_SAFE_INTEGER)}get activeIndex(){if(this.activeItemId==="")return-1;const source=this.effectiveSource,count=this.itemCount;if(this.activeIndexFor===source&&this.activeIndexForLength===count&&Object.is(this.activeIndexForId,this.activeItemId)&&this.activeIndexForKeyFn===this.keyFunction)return this.activeIndexCache;if(this.activeIndexFor=source,this.activeIndexForLength=count,this.activeIndexForId=this.activeItemId,this.activeIndexForKeyFn=this.keyFunction,this.activeIndexCache=-1,isIndexedSource(source)){if(!this.keyFunction&&source.indexOfKey){const candidate=source.indexOfKey(this.activeItemId);Number.isInteger(candidate)&&candidate>=0&&candidate<count&&(this.activeIndexCache=candidate)}return this.activeIndexCache}for(let index=0;index<count;index++){const item=this.itemAt(index);if(Object.is(this.keyOf(item,index),this.activeItemId)){this.activeIndexCache=index;break}}return this.activeIndexCache}connectedCallback(){super.connectedCallback(),this.ownerDocument.defaultView&&this.seedFirstRenderState(()=>{this.renderUnmeasuredWindow=!1,this.requestUpdate()}),this.resetOwnerRealmWork();const ownerDocument=this.ownerDocument,ownerWindow=ownerDocument.defaultView,generation=this.ownerRealmGeneration,ResizeObserverCtor=ownerWindow?.ResizeObserver;if(ResizeObserverCtor){const rowObserver=new ResizeObserverCtor(entries=>{this.rowResizeObserver!==rowObserver||!this.isCurrentOwnerWork(ownerDocument,generation)||this.onRowsResized(entries)}),groupObserver=new ResizeObserverCtor(entries=>{this.groupResizeObserver!==groupObserver||!this.isCurrentOwnerWork(ownerDocument,generation)||this.onGroupsResized(entries)}),stickyObserver=new ResizeObserverCtor(entries=>{this.stickyResizeObserver!==stickyObserver||!this.isCurrentOwnerWork(ownerDocument,generation)||this.onStickyResized(entries)});this.rowResizeObserver=rowObserver,this.groupResizeObserver=groupObserver,this.stickyResizeObserver=stickyObserver}this.hasUpdated&&(this.attachContainerListeners(),this.syncRowObservers(),this.syncGroupObservers(),this.syncStickyOverlay())}disconnectedCallback(){this.resetOwnerRealmWork(),super.disconnectedCallback()}adoptedCallback(){super.adoptedCallback(),this.resetOwnerRealmWork()}isCurrentOwnerWork(ownerDocument,generation){return this.ownerRealmGeneration===generation&&this.isConnected&&this.ownerDocument===ownerDocument}resetOwnerRealmWork(){this.ownerRealmGeneration+=1,this.rowResizeObserver?.disconnect(),this.rowResizeObserver=void 0,this.groupResizeObserver?.disconnect(),this.groupResizeObserver=void 0,this.observedRows.clear(),this.observedGroups.clear(),this.deferredRowObservations.clear(),this.deferredGroupObservations.clear(),this.inResizeDelivery=!1,this.rowObserveRafId!==void 0&&this.rowObserveRafOwner?.cancelAnimationFrame(this.rowObserveRafId),this.rowObserveRafId=void 0,this.rowObserveRafOwner=void 0,this.rowObserveRafDocument=void 0,this.containerResizeObserver?.disconnect(),this.containerResizeObserver=void 0,this.stickyResizeObserver?.disconnect(),this.stickyResizeObserver=void 0,this.observedSticky=void 0,this.scrollRafId!==void 0&&this.scrollRafOwner?.cancelAnimationFrame(this.scrollRafId),this.scrollRafId=void 0,this.scrollRafOwner=void 0,this.scrollRafDocument=void 0,this.pendingScrollTop=null,this.pendingScrollCorrection=void 0,this.detachContainerListeners(),this.scrollListenerTarget=void 0}firstUpdated(changed){super.firstUpdated(changed),this.attachContainerListeners()}willUpdate(changed){super.willUpdate(changed),this.isFirstUpdate=!this.hasUpdated,(changed.has("items")||changed.has("source")||changed.has("keyFunction")||changed.has("rowHeight")||changed.has("groups")||changed.has("activeItemId"))&&(this.pendingScrollCorrection=void 0),(changed.has("items")||changed.has("source")||changed.has("rowHeight")||changed.has("keyFunction")||changed.has("groups"))&&(this.offsetsDirty=!0),(changed.has("items")||changed.has("source"))&&(this.itemsChangedPendingPrune=!0),isIndexedSource(this.effectiveSource)&&(changed.has("items")||changed.has("source")||changed.has("keyFunction"))&&(this.measuredHeights.clear(),this.measuredIndices.clear(),this.indexedMeasurementIndexDirty=!0),changed.has("groups")&&this.measuredGroupHeights.clear(),(changed.has("items")||changed.has("source")||changed.has("groups"))&&this.recomputeGroups(),changed.has("rowHeight")&&(this.fixedRowHeight=this.parseRowHeight(this.rowHeight),this.fixedRowHeight!=null&&(this.measuredHeights.clear(),this.measuredIndices.clear(),this.indexedMeasurementIndexDirty=!0)),this.offsetsDirty&&(this.recomputeOffsets(),this.offsetsDirty=!1),this.computeRange()}updated(changed){super.updated(changed),this.syncRowObservers(),this.syncGroupObservers(),this.syncStickyOverlay(),changed.has("activeItemId")&&!this.isFirstUpdate&&this.scrollActiveIntoView(),this.emitRangeChangeIfNeeded(),this.maybeFireLoadMore(),this.maybeCorrectPendingScroll()}parseRowHeight(value){const normalized=normalizeRowHeight(value);return normalized==="auto"?null:normalized}get effectiveSource(){return this.source??this.items}get itemCount(){const source=this.effectiveSource;return isIndexedSource(source)?finiteCount(source.count):source.length}itemAt(index){const source=this.effectiveSource;return isIndexedSource(source)?source.itemAt(index):source[index]}keyOf(item,index){const source=this.effectiveSource,key=this.keyFunction?this.keyFunction(item,index):isIndexedSource(source)?source.keyAt?.(index)??index:index;return typeof key=="string"||typeof key=="number"?key:index}rowIdentity(key,occurrence){const token=domKeyToken(key);return`${token.length}:${token}:${occurrence}`}identityAt(index,item=this.itemAt(index)){return isIndexedSource(this.effectiveSource)?this.rowIdentity(this.keyOf(item,index),index):this.rowIdentities[index]??this.rowIdentity(this.keyOf(item,index),index)}groupHeightAt(index){const group=this.normalizedGroupByIndex.get(index);return!group||group.label===""?0:this.measuredGroupHeights.get(index)??DEFAULT_GROUP_ESTIMATE_PX}rowHeightAt(index){return this.fixedRowHeight!=null?this.fixedRowHeight:this.measuredHeights.get(this.identityAt(index))??DEFAULT_ROW_ESTIMATE_PX}groupContributionThrough(index){let low=0,high=this.normalizedGroups.length;for(;low<high;){const middle=low+high>>1;this.normalizedGroups[middle].startIndex<=index?low=middle+1:high=middle}return this.groupHeightPrefix[low]??0}recomputeGroupHeightPrefix(){const prefix=new Array(this.normalizedGroups.length+1);prefix[0]=0;for(let index=0;index<this.normalizedGroups.length;index++){const group=this.normalizedGroups[index],height=group.label===""?0:this.measuredGroupHeights.get(group.startIndex)??DEFAULT_GROUP_ESTIMATE_PX;prefix[index+1]=finiteAdd(prefix[index],height)}this.groupHeightPrefix=prefix}indexedOffsetForIndex(index){const baseHeight=this.fixedRowHeight??DEFAULT_ROW_ESTIMATE_PX;let offset=index>Number.MAX_VALUE/baseHeight?Number.MAX_VALUE:index*baseHeight;if(this.fixedRowHeight==null){this.rebuildIndexedMeasurementIndex();let low=0,high=this.indexedMeasurementIndices.length;for(;low<high;){const middle=low+high>>1;this.indexedMeasurementIndices[middle]<index?low=middle+1:high=middle}offset=finiteAdd(offset,this.indexedMeasurementDeltaPrefix[low]??0)}return Math.max(0,finiteAdd(offset,this.groupContributionThrough(index)))}rebuildIndexedMeasurementIndex(){if(!this.indexedMeasurementIndexDirty)return;const retained=[];for(const[identity,index]of this.measuredIndices){const height=this.measuredHeights.get(identity);height!==void 0&&retained.push({index,delta:height-DEFAULT_ROW_ESTIMATE_PX})}retained.sort((a,b)=>a.index-b.index);const indices=new Array(retained.length),prefix=new Array(retained.length+1);prefix[0]=0;for(let position=0;position<retained.length;position++){const measurement=retained[position];indices[position]=measurement.index,prefix[position+1]=finiteAdd(prefix[position],measurement.delta)}this.indexedMeasurementIndices=indices,this.indexedMeasurementDeltaPrefix=prefix,this.indexedMeasurementIndexDirty=!1}pruneIndexedMeasurements(){if(!isIndexedSource(this.effectiveSource)||this.fixedRowHeight!=null||this.renderEnd<this.renderStart)return!1;const renderedCount=this.renderEnd-this.renderStart+1,retentionRows=Math.max(renderedCount,normalizeOverscan(this.overscan)*4),firstRetained=Math.max(0,this.renderStart-retentionRows),lastRetained=Math.min(this.itemCount-1,this.renderEnd+retentionRows);let removedDeltaBeforeWindow=0,pruned=!1;for(const[identity,measuredIndex]of this.measuredIndices)if(measuredIndex<firstRetained||measuredIndex>lastRetained){const height=this.measuredHeights.get(identity);height!==void 0&&measuredIndex<firstRetained&&(removedDeltaBeforeWindow=finiteAdd(removedDeltaBeforeWindow,height-DEFAULT_ROW_ESTIMATE_PX)),this.measuredIndices.delete(identity),this.measuredHeights.delete(identity),pruned=!0}if(pruned&&(this.indexedMeasurementIndexDirty=!0,removedDeltaBeforeWindow!==0)){const base=this.scrollContainer,oldScrollTop=base?.scrollTop??this.containerScrollTop,nextScrollTop=Math.max(0,oldScrollTop-removedDeltaBeforeWindow);base&&(base.scrollTop=nextScrollTop),this.containerScrollTop=nextScrollTop,this.pendingScrollTop=null}return pruned}offsetAt(index){return isIndexedSource(this.effectiveSource)?this.indexedOffsetForIndex(index):this.offsets[index]??0}recomputeOffsets(){const n=this.itemCount;if(this.recomputeGroupHeightPrefix(),isIndexedSource(this.effectiveSource)){this.offsets=[0],this.rowIdentities=[],this.itemsChangedPendingPrune=!1;return}const offsets=new Array(n+1);let cursor=0;const liveKeys=this.itemsChangedPendingPrune&&this.fixedRowHeight==null?new Set:null,occurrences=new Map,identities=new Array(n);for(let i=0;i<n;i++){cursor=finiteAdd(cursor,this.groupHeightAt(i)),offsets[i]=cursor;const key=this.keyOf(this.itemAt(i),i),token=domKeyToken(key),occurrence=occurrences.get(token)??0;occurrences.set(token,occurrence+1);const identity=this.rowIdentity(key,occurrence);identities[i]=identity;let h;this.fixedRowHeight!=null?h=this.fixedRowHeight:(liveKeys?.add(identity),h=this.measuredHeights.get(identity)??DEFAULT_ROW_ESTIMATE_PX),cursor=finiteAdd(cursor,h)}if(offsets[n]=cursor,this.offsets=offsets,this.rowIdentities=identities,this.itemsChangedPendingPrune=!1,liveKeys){for(const key of this.measuredHeights.keys())liveKeys.has(key)||(this.measuredHeights.delete(key),this.measuredIndices.delete(key),this.indexedMeasurementIndexDirty=!0);for(const key of this.measuredIndices.keys())liveKeys.has(key)||(this.measuredIndices.delete(key),this.indexedMeasurementIndexDirty=!0)}}groupTopAt(index){return Math.max(0,this.offsetAt(index)-this.groupHeightAt(index))}rowBottomAt(index){return finiteAdd(this.offsetAt(index),this.rowHeightAt(index))}entryTopAt(index){return this.groupTopAt(index)}findIndexAtOrAfter(offset){let lo=0,hi=this.itemCount-1;for(;lo<hi;){const mid=lo+Math.floor((hi-lo)/2);this.rowBottomAt(mid)<=offset?lo=mid+1:hi=mid}return lo}findIndexAtOrBefore(offset){let lo=0,hi=this.itemCount-1;for(;lo<hi;){const mid=lo+Math.ceil((hi-lo)/2);this.entryTopAt(mid)<offset?lo=mid:hi=mid-1}return lo}offsetForIndex(index){const clamped=Math.min(this.itemCount,Math.max(0,Math.trunc(index)||0));return this.offsetAt(clamped)}indexAtOffset(px){const n=this.itemCount;return n===0?-1:Number.isFinite(px)?Math.min(n-1,Math.max(0,this.findIndexAtOrAfter(px))):px>0?n-1:0}computeRange(){const n=this.itemCount;if(n===0){this.visibleStart=0,this.visibleEnd=-1,this.renderStart=0,this.renderEnd=-1;return}if(this.viewportHeight<=0){if(!this.renderUnmeasuredWindow){this.visibleStart=0,this.visibleEnd=-1,this.renderStart=0,this.renderEnd=-1;return}this.visibleStart=0,this.visibleEnd=0,this.renderStart=0,this.renderEnd=Math.min(n-1,normalizeOverscan(this.overscan));return}const viewTop=this.containerScrollTop,viewBottom=viewTop+this.viewportHeight;this.visibleStart=this.findIndexAtOrAfter(viewTop),this.visibleEnd=this.findIndexAtOrBefore(viewBottom);const overscan=normalizeOverscan(this.overscan);this.renderStart=Math.max(0,this.visibleStart-overscan),this.renderEnd=Math.min(n-1,this.visibleEnd+overscan),this.pruneIndexedMeasurements()&&this.computeRange()}attachContainerListeners(){const base=this.scrollContainer,ownerDocument=this.ownerDocument,ownerWindow=ownerDocument.defaultView;if(!base||!this.isConnected||!ownerWindow)return;this.containerResizeObserver?.disconnect(),this.detachContainerListeners();const generation=this.ownerRealmGeneration,ResizeObserverCtor=ownerWindow.ResizeObserver;if(ResizeObserverCtor){const observer=new ResizeObserverCtor(entries=>{if(this.containerResizeObserver!==observer||this.scrollListenerTarget!==base||!this.isCurrentOwnerWork(ownerDocument,generation))return;this.beginResizeDelivery();const entry=entries[0];entry&&(this.viewportHeight=entry.borderBoxSize?.[0]?.blockSize??entry.contentRect.height)});this.containerResizeObserver=observer,observer.observe(base)}else this.containerResizeObserver=void 0;base.addEventListener("scroll",this.onScroll,{passive:!0}),base.addEventListener("wheel",this.onUserScrollIntent,{passive:!0}),base.addEventListener("pointerdown",this.onUserScrollIntent,{passive:!0}),base.addEventListener("touchstart",this.onUserScrollIntent,{passive:!0}),base.addEventListener("keydown",this.onUserScrollIntent),this.scrollListenerTarget=base,ownerWindow.queueMicrotask(()=>{if(this.scrollListenerTarget!==base||this.scrollContainer!==base||!this.isCurrentOwnerWork(ownerDocument,generation))return;const viewportHeight=base.clientHeight,scrollTop=base.scrollTop;this.viewportHeight!==viewportHeight&&(this.viewportHeight=viewportHeight),this.containerScrollTop!==scrollTop&&(this.containerScrollTop=scrollTop)})}detachContainerListeners(){const target=this.scrollListenerTarget;target&&(target.removeEventListener("scroll",this.onScroll),target.removeEventListener("wheel",this.onUserScrollIntent),target.removeEventListener("pointerdown",this.onUserScrollIntent),target.removeEventListener("touchstart",this.onUserScrollIntent),target.removeEventListener("keydown",this.onUserScrollIntent))}beginResizeDelivery(){if(this.inResizeDelivery=!0,this.rowObserveRafId!==void 0)return;const ownerDocument=this.ownerDocument,ownerWindow=ownerDocument.defaultView;if(!ownerWindow||!this.isConnected){this.inResizeDelivery=!1;return}const generation=this.ownerRealmGeneration,handle=ownerWindow.requestAnimationFrame(()=>{if(this.rowObserveRafId!==handle||this.rowObserveRafOwner!==ownerWindow||this.rowObserveRafDocument!==ownerDocument||!this.isCurrentOwnerWork(ownerDocument,generation))return;this.rowObserveRafId=void 0,this.rowObserveRafOwner=void 0,this.rowObserveRafDocument=void 0,this.inResizeDelivery=!1;const ro=this.rowResizeObserver;for(const[identity,el]of this.deferredRowObservations)ro&&this.observedRows.get(identity)===el&&ro.observe(el);this.deferredRowObservations.clear();const groupObserver=this.groupResizeObserver;for(const[index,el]of this.deferredGroupObservations)groupObserver&&this.observedGroups.get(index)===el&&groupObserver.observe(el);this.deferredGroupObservations.clear()});this.rowObserveRafId=handle,this.rowObserveRafOwner=ownerWindow,this.rowObserveRafDocument=ownerDocument}syncRowObservers(){const ro=this.rowResizeObserver;if(!ro)return;if(this.fixedRowHeight!=null){for(const el of this.observedRows.values())ro.unobserve(el);this.observedRows.clear(),this.deferredRowObservations.clear();return}const current=new Map;this.renderRoot.querySelectorAll('[part="row"]').forEach(el=>{const index=Number(el.getAttribute("data-row-index"));if(!Number.isInteger(index)||index<0||index>=this.itemCount)return;const identity=this.identityAt(index);current.set(identity,el),this.observedRowKeys.set(el,identity),this.observedRowIndices.set(el,index)});for(const[identity,el]of this.observedRows)current.get(identity)!==el&&(ro.unobserve(el),this.observedRows.delete(identity),this.deferredRowObservations.delete(identity));for(const[identity,el]of current)this.observedRows.has(identity)||(this.observedRows.set(identity,el),this.inResizeDelivery?this.deferredRowObservations.set(identity,el):ro.observe(el))}syncGroupObservers(){const observer=this.groupResizeObserver;if(!observer)return;const current=new Map;this.renderRoot.querySelectorAll('[part="group"][data-group-index]').forEach(marker=>{const index=Number(marker.dataset.groupIndex);!Number.isInteger(index)||!this.normalizedGroupByIndex.has(index)||(current.set(index,marker),this.observedGroupIndices.set(marker,index))});for(const[index,marker]of this.observedGroups)current.get(index)!==marker&&(observer.unobserve(marker),this.observedGroups.delete(index),this.deferredGroupObservations.delete(index));for(const[index,marker]of current)this.observedGroups.has(index)||(this.observedGroups.set(index,marker),this.inResizeDelivery?this.deferredGroupObservations.set(index,marker):observer.observe(marker))}get stickyInset(){return this.renderStickyGroup?this.stickyHeight:0}scrollActiveIntoView(){const index=this.activeIndex;if(index<0)return;const behavior=prefersReducedMotion(this.ownerDocument.defaultView)?"auto":"smooth";this.performScrollTo(index,"auto",behavior)&&this.beginPendingScrollCorrection(index,"auto",behavior,this.activeItemId)}scrollToIndex(index,options){const n=this.itemCount;if(n===0)return;const clamped=finiteInteger(index,0,0,n-1),align=options?.align??"auto",behavior=prefersReducedMotion(this.ownerDocument.defaultView)?"auto":options?.behavior??"smooth";this.performScrollTo(clamped,align,behavior)?this.beginPendingScrollCorrection(clamped,align,behavior):this.pendingScrollCorrection=void 0}hasUnmeasuredGroupThrough(index){return this.normalizedGroups.some(group=>group.startIndex<=index&&group.label!==""&&!this.measuredGroupHeights.has(group.startIndex))}beginPendingScrollCorrection(index,align,behavior,activeItemId){if(this.fixedRowHeight!=null&&!this.hasUnmeasuredGroupThrough(index)){this.pendingScrollCorrection=void 0;return}this.pendingScrollCorrection={identity:this.identityAt(index),index,align,behavior,source:this.effectiveSource,keyFunction:this.keyFunction,activeItemId:activeItemId===""?void 0:activeItemId,lastMeasurementGeneration:this.measurementGeneration}}performScrollTo(index,align,behavior){const base=this.scrollContainer;if(!base)return!1;const inset=this.stickyInset,top=this.offsetAt(index),bottom=this.rowBottomAt(index),viewTop=base.scrollTop,viewBottom=viewTop+base.clientHeight;let target=null;return align==="start"?target=top-inset:align==="end"?target=bottom-base.clientHeight:top-inset<viewTop?target=top-inset:bottom>viewBottom&&(target=bottom-base.clientHeight),target===null?!1:(base.scrollTo({top:Math.max(0,target),behavior}),!0)}maybeCorrectPendingScroll(){const pending=this.pendingScrollCorrection;if(!pending||pending.lastMeasurementGeneration>=this.measurementGeneration)return;if(pending.source!==this.effectiveSource||pending.keyFunction!==this.keyFunction||pending.activeItemId!==void 0&&!Object.is(pending.activeItemId,this.activeItemId)){this.pendingScrollCorrection=void 0;return}const index=pending.activeItemId!==void 0?this.activeIndex:isIndexedSource(this.effectiveSource)?pending.index:this.rowIdentities.indexOf(pending.identity);if(index<0||index>=this.itemCount||this.identityAt(index)!==pending.identity){this.pendingScrollCorrection=void 0;return}this.performScrollTo(index,pending.align,pending.behavior),pending.index=index,pending.lastMeasurementGeneration=this.measurementGeneration,(this.fixedRowHeight!=null||this.measuredHeights.has(pending.identity))&&!this.hasUnmeasuredGroupThrough(index)&&(this.pendingScrollCorrection=void 0)}emitRangeChangeIfNeeded(){if(this.visibleEnd<this.visibleStart){this.lastEmittedStart=-1,this.lastEmittedEnd=-1;return}this.visibleStart===this.lastEmittedStart&&this.visibleEnd===this.lastEmittedEnd||(this.lastEmittedStart=this.visibleStart,this.lastEmittedEnd=this.visibleEnd,this.emit("lr-visible-range-change",{start:this.visibleStart,end:this.visibleEnd}))}maybeFireLoadMore(){const n=this.itemCount;if(!(n>0&&this.visibleEnd>=n-1)){this.loadMoreArmed=!0;return}!this.hasMore||this.loading||!this.loadMoreArmed||(this.loadMoreArmed=!1,this.emit("lr-load-more"))}renderRow(item,index,total,activeIndex){const key=this.keyOf(item,index),top=this.offsetAt(index),isActive=index===activeIndex,isRowMode=this.itemRole==="row";return html`
       <div
         part="row"
         role=${isRowMode?"row":"listitem"}
@@ -12,7 +12,7 @@ var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3
       >
         ${this.renderItem(item,index)}
       </div>
-    `}recomputeGroups(){const seen=new Set;this.normalizedGroups=(this.groups??[]).filter(group=>{if(typeof group!="object"||group===null)return!1;const index=group.startIndex;return!Number.isInteger(index)||index<0||index>=this.itemCount||seen.has(index)?!1:(seen.add(index),!0)}).sort((a,b)=>a.startIndex-b.startIndex),this.normalizedGroupByIndex.clear();for(const group of this.normalizedGroups)this.normalizedGroupByIndex.set(group.startIndex,group)}renderGroups(){return this.normalizedGroups.filter(group=>group.startIndex>=this.renderStart&&group.startIndex<=this.renderEnd).filter(group=>group.label!=="").map(group=>html`
+    `}recomputeGroups(){const normalized=[],seen=new Set;try{const groups=this.groups;if(!Array.isArray(groups))throw new TypeError("groups must be an array");const length=getOwnDataDescriptor(groups,"length");if(length===MISSING_OWN_DATA_DESCRIPTOR||length===UNSAFE_OWN_DATA_DESCRIPTOR||typeof length.value!="number"||!Number.isSafeInteger(length.value)||length.value<0)throw new TypeError("groups must have a bounded length");for(let position=0;position<Math.min(length.value,MAX_VIRTUAL_LIST_GROUPS);position+=1){const entry=getOwnDataDescriptor(groups,String(position));if(entry===MISSING_OWN_DATA_DESCRIPTOR||entry===UNSAFE_OWN_DATA_DESCRIPTOR||entry.value===null||typeof entry.value!="object"||Array.isArray(entry.value))continue;const key=getOwnDataDescriptor(entry.value,"key"),label=getOwnDataDescriptor(entry.value,"label"),startIndex=getOwnDataDescriptor(entry.value,"startIndex");if(key===MISSING_OWN_DATA_DESCRIPTOR||key===UNSAFE_OWN_DATA_DESCRIPTOR||startIndex===MISSING_OWN_DATA_DESCRIPTOR||startIndex===UNSAFE_OWN_DATA_DESCRIPTOR||label===UNSAFE_OWN_DATA_DESCRIPTOR||typeof key.value!="string"&&typeof key.value!="number"||typeof startIndex.value!="number"||!Number.isInteger(startIndex.value)||startIndex.value<0||startIndex.value>=this.itemCount||seen.has(startIndex.value))continue;const labelValue=label===MISSING_OWN_DATA_DESCRIPTOR||typeof label.value!="string"?void 0:label.value;seen.add(startIndex.value),normalized.push(Object.freeze({key:key.value,startIndex:startIndex.value,...labelValue===void 0?{}:{label:labelValue}}))}}catch{}this.normalizedGroups=Object.freeze(normalized.sort((a,b)=>a.startIndex-b.startIndex)),this.normalizedGroupByIndex.clear();for(const group of this.normalizedGroups)this.normalizedGroupByIndex.set(group.startIndex,group)}renderGroups(){return this.normalizedGroups.filter(group=>group.startIndex>=this.renderStart&&group.startIndex<=this.renderEnd).filter(group=>group.label!=="").map(group=>html`
             <div
               part="group"
               data-group-index=${group.startIndex}

package/dist/components/layout/widget/widget.class.d.ts

@@ -104,12 +104,16 @@ ariaLabel?:string;}export interface LyraWidgetEventMap{'lr-collapse-request':Cus
 * @status stable
 * @since 4.0.0
 */
-export declare class LyraWidget extends LyraElement<LyraWidgetEventMap>{static styles:import("lit").CSSResultGroup[];private actionsScrollOverflow;private viewTogglesScrollOverflow;label:string;
+export declare class LyraWidget extends LyraElement<LyraWidgetEventMap>{static styles:import("lit").CSSResultGroup[];private actionsScrollOverflow;private viewTogglesScrollOverflow;
+/** Header title. Removing the attribute omits the copy without changing null readback. */
+label:string;
 /** Overrides the fullscreen dialog's accessible name, taking precedence over both `label` and a
 *  slotted `label`. An explicitly empty value remains an explicit name; fallbacks apply only when
 *  the value is absent. Fed only by a host `aria-label`, matching `lr-scroller`'s/`lr-carousel`'s
 *  own host-override pattern. */
-accessibleLabel:string|null;sublabel:string;collapsible:boolean;collapsed:boolean;
+accessibleLabel:string|null;
+/** Secondary header copy. Removed or empty attributes render no fallback text. */
+sublabel:string;collapsible:boolean;collapsed:boolean;
 /** Persists `collapsed` to `localStorage` across reloads when set. Namespaced as
 *  `lr-widget:${storageKey}` -- mirrors `lr-app-rail`'s/`lr-table`'s identical `storage-key`
 *  pattern. Unset (the default) touches storage not at all. */

package/dist/components/layout/widget/widget.class.js

@@ -1,4 +1,4 @@
-var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{repeat}from"lit/directives/repeat.js";import{styleMap}from"lit/directives/style-map.js";import{LyraElement}from"../../../internal/lyra-element.js";import{renderInertPresentation}from"../../../internal/inert-presentation.js";import{activateOverlay,collectFocusableElements,deepActiveElement}from"../../../internal/overlay-manager.js";import{readPersistedState,writePersistedState}from"../../../internal/persisted-state.js";import{nextId}from"../../../internal/a11y.js";import{bindAccessibleTextObserver,composedAccessibilityText}from"../../../internal/accessibility-visibility.js";import{observeScrollOverflow}from"../../../internal/scroll-overflow.js";import{chevronIcon,closeIcon,expandIcon}from"../../../internal/icons.js";import{styles}from"./widget.styles.js";import{sanitizeCssInset}from"../../../internal/safe-css.js";import{LYRA_DEFAULT_widgetCollapse,LYRA_DEFAULT_widgetExitFullscreen,LYRA_DEFAULT_widgetExpand,LYRA_DEFAULT_widgetExpandToFullscreen,LYRA_DEFAULT_widgetFullscreenPanel,LYRA_DEFAULT_widgetViewGroup}from"../../../internal/default-strings.generated.js";const MAX_WIDGET_VIEWS=256;function snapshotWidgetViews(value){if(!Array.isArray(value))return Object.freeze([]);const seen=new Set,normalized=[];for(const candidate of value.slice(0,MAX_WIDGET_VIEWS))try{if(!candidate||typeof candidate!="object")continue;const record=candidate,viewId=record.viewId;if(typeof viewId!="string"||viewId.length===0||viewId!==viewId.trim()||seen.has(viewId))continue;const label=record.label,ariaLabel=record.ariaLabel,icon=record.icon;if(label!==void 0&&typeof label!="string"||ariaLabel!==void 0&&typeof ariaLabel!="string")continue;seen.add(viewId),normalized.push(Object.freeze({viewId,...label!==void 0?{label}:{},...icon!==void 0?{icon}:{},...ariaLabel!==void 0?{ariaLabel}:{}}))}catch{}return Object.freeze(normalized)}class LyraWidget extends LyraElement{constructor(){super(...arguments),this.actionsScrollOverflow=observeScrollOverflow(this,()=>this.renderRoot.querySelector('[part="actions"]')),this.viewTogglesScrollOverflow=observeScrollOverflow(this,()=>this.renderRoot.querySelector('[part="view-toggles"]')),this.label="",this.accessibleLabel=null,this.sublabel="",this.collapsible=!1,this.collapsed=!1,this.expandable=!1,this.fullscreen=!1,this.fullscreenInset="",this.backdropInset="",this.compact=!1,this.effectiveViews=Object.freeze([]),this.activeViewId="",this.activeView="",this.hasActionsSlot=!1,this.hasIconSlot=!1,this.hasLabelSlot=!1,this.hasSublabelSlot=!1,this.labelSlotObserverGeneration=0,this.ownerRealmGeneration=0,this.bodyId=nextId("widget-body"),this.persistReady=!1,this.onActionsSlotChange=e=>{this.hasActionsSlot=e.target.assignedElements({flatten:!0}).length>0},this.onIconSlotChange=e=>{this.hasIconSlot=e.target.assignedElements({flatten:!0}).length>0},this.onLabelSlotChange=e=>{const assigned=e.target.assignedElements({flatten:!0});this.syncLabelSlot(assigned)},this.onSublabelSlotChange=e=>{this.hasSublabelSlot=e.target.assignedElements({flatten:!0}).length>0},this.setActiveView=viewId=>{viewId===this.activeViewId||this.emit("lr-view-request",{viewId},{cancelable:!0}).defaultPrevented||(this.activeViewId=viewId,this.emit("lr-view-change",{viewId}))},this.toggleCollapsed=()=>{this.requestCollapse(!this.collapsed)},this.toggleFullscreen=e=>{const next=!this.fullscreen,trigger=e.currentTarget;this.requestFullscreenChange(next)&&next&&(this.explicitTrigger=trigger)},this.dismissFullscreen=()=>{this.fullscreen&&this.requestFullscreenChange(!1)},this.onBackdropClick=()=>{this.overlayHandle?.dismissBackdrop()}}static{this.defaultStrings={...super.defaultStrings,widgetCollapse:LYRA_DEFAULT_widgetCollapse,widgetExitFullscreen:LYRA_DEFAULT_widgetExitFullscreen,widgetExpand:LYRA_DEFAULT_widgetExpand,widgetExpandToFullscreen:LYRA_DEFAULT_widgetExpandToFullscreen,widgetFullscreenPanel:LYRA_DEFAULT_widgetFullscreenPanel,widgetViewGroup:LYRA_DEFAULT_widgetViewGroup}}static{this.styles=[LyraElement.styles,styles]}get views(){return this.effectiveViews}set views(value){const previous=this.effectiveViews;this.effectiveViews=snapshotWidgetViews(value),this.requestUpdate("views",previous)}get storageFullKey(){return this.storageKey?`lr-widget:${this.storageKey}`:void 0}willUpdate(changed){if(super.willUpdate(changed),!this.hasUpdated){this.hasActionsSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="actions"),this.hasIconSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="icon");const labelChildren=Array.from(this.children).filter(el=>el.getAttribute("slot")==="label");this.hasLabelSlot=labelChildren.length>0,this.labelSlotText=this.readLabelSlotText(labelChildren),this.hasSublabelSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="sublabel");const parsed=readPersistedState(this.storageFullKey,v=>typeof v=="object"&&v!==null);parsed&&typeof parsed.collapsed=="boolean"&&(this.collapsed=parsed.collapsed)}if(changed.has("fullscreen")&&(this.fullscreen?this.activateFullscreenOverlay():this.deactivateFullscreenOverlay()),changed.has("activeView")&&this.activeView!==""&&(this.activeViewId=this.activeView),changed.has("views")||changed.has("activeViewId")||changed.has("activeView")){const focused=this.renderRoot?.querySelector('[part="view-toggle"]:focus');this.focusedViewIdBeforeUpdate=focused?.dataset.viewId;const views=this.views;views.some(view=>view.viewId===this.activeViewId)||(this.activeViewId=views[0]?.viewId??"")}}updated(changed){super.updated(changed);const actionsSlot=this.renderRoot.querySelector('slot[name="actions"]');if(this.actionsScrollOverflow.observeExtra(actionsSlot?actionsSlot.assignedElements({flatten:!0}):[]),this.viewTogglesScrollOverflow.observeExtra(this.renderRoot.querySelectorAll('[part="view-toggle"]')),this.persistReady&&changed.has("collapsed")&&writePersistedState(this.storageFullKey,{collapsed:this.collapsed}),this.persistReady=!0,changed.has("fullscreen")&&this.fullscreen)this.overlayHandle?.focusInitial();else if(changed.has("collapsed")&&this.fullscreen){const panel=this.shadowRoot?.querySelector('[part="base"]'),active=deepActiveElement(this.ownerDocument);panel&&!collectFocusableElements(panel).includes(active)&&(active&&typeof active.blur=="function"&&active.blur(),this.overlayHandle?.focusInitial())}if(changed.has("views")||changed.has("activeViewId")){const focusedId=this.focusedViewIdBeforeUpdate;this.focusedViewIdBeforeUpdate=void 0,focusedId&&!this.views.some(view=>view.viewId===focusedId)&&Array.from(this.renderRoot.querySelectorAll('[part="view-toggle"]')).find(toggle=>toggle.dataset.viewId===this.activeViewId)?.focus()}}connectedCallback(){super.connectedCallback(),this.hasUpdated&&this.fullscreen&&(this.overlayHandle?.isActive()?this.overlayHandle.resume():this.activateFullscreenOverlay(),this.queueOwnerMicrotask(()=>this.overlayHandle?.focusInitial())),this.hasUpdated&&this.queueOwnerMicrotask(()=>{const slot=this.shadowRoot?.querySelector('slot[name="label"]');slot&&this.syncLabelSlot(slot.assignedElements({flatten:!0}))})}disconnectedCallback(){super.disconnectedCallback(),this.overlayHandle?.suspend(),this.resetOwnerRealmWork()}adoptedCallback(){super.adoptedCallback(),this.resetOwnerRealmWork()}resetOwnerRealmWork(){this.ownerRealmGeneration+=1,this.resetLabelSlotObserver()}queueOwnerMicrotask(callback){const ownerDocument=this.ownerDocument,ownerWindow=ownerDocument.defaultView;if(!ownerWindow||!this.isConnected)return;const generation=this.ownerRealmGeneration;ownerWindow.queueMicrotask(()=>{this.ownerRealmGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument||callback()})}activateFullscreenOverlay(){this.overlayHandle=activateOverlay({host:this,panel:()=>this.shadowRoot?.querySelector('[part="base"]')??null,onEscape:this.dismissFullscreen,onBackdrop:this.dismissFullscreen,restoreFocusTo:this.explicitTrigger,lockScroll:!0,suspendWhenUnrendered:!0}),this.explicitTrigger=void 0}deactivateFullscreenOverlay(){this.overlayHandle?.deactivate(),this.overlayHandle=void 0}syncLabelSlot(assigned){if(this.hasLabelSlot=assigned.length>0,this.labelSlotText=this.readLabelSlotText(assigned),this.resetLabelSlotObserver(),assigned.length===0||!this.isConnected)return;const ownerDocument=this.ownerDocument,MutationObserverCtor=ownerDocument.defaultView?.MutationObserver;if(!MutationObserverCtor)return;const generation=this.labelSlotObserverGeneration,observer=new MutationObserverCtor(()=>{this.labelSlotObserver!==observer||this.labelSlotObserverDocument!==ownerDocument||this.labelSlotObserverGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument||(this.labelSlotText=this.readLabelSlotText(assigned))});this.labelSlotObserver=observer,this.labelSlotObserverDocument=ownerDocument,bindAccessibleTextObserver(observer,this,["alt","aria-labelledby","slot"]);for(const element of assigned)observer.observe(element,{attributes:!0,attributeFilter:["alt","aria-hidden","aria-label","aria-labelledby","class","hidden","inert","style"],childList:!0,characterData:!0,subtree:!0})}readLabelSlotText(assigned){return composedAccessibilityText(assigned).replace(/\s+/g," ").trim()||void 0}resetLabelSlotObserver(){this.labelSlotObserverGeneration+=1,this.labelSlotObserver?.disconnect(),this.labelSlotObserver=void 0,this.labelSlotObserverDocument=void 0}requestCollapse(next){this.emit("lr-collapse-request",{collapsed:next},{cancelable:!0}).defaultPrevented||(this.collapsed=next,this.emit("lr-collapse-change",{collapsed:next}))}requestFullscreenChange(next){return this.emit("lr-fullscreen-request",{fullscreen:next},{cancelable:!0}).defaultPrevented?!1:(this.fullscreen=next,this.emit("lr-fullscreen-change",{fullscreen:next}),!0)}render(){const hasLabel=this.label.length>0,hasSublabel=this.sublabel.length>0,views=this.views,fullscreenInset=sanitizeCssInset(this.fullscreenInset),backdropInset=sanitizeCssInset(this.backdropInset);return html`
+var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{repeat}from"lit/directives/repeat.js";import{styleMap}from"lit/directives/style-map.js";import{LyraElement}from"../../../internal/lyra-element.js";import{renderInertPresentation}from"../../../internal/inert-presentation.js";import{activateOverlay,collectFocusableElements,deepActiveElement}from"../../../internal/overlay-manager.js";import{readPersistedState,writePersistedState}from"../../../internal/persisted-state.js";import{nextId}from"../../../internal/a11y.js";import{bindAccessibleTextObserver,composedAccessibilityText}from"../../../internal/accessibility-visibility.js";import{observeScrollOverflow}from"../../../internal/scroll-overflow.js";import{chevronIcon,closeIcon,expandIcon}from"../../../internal/icons.js";import{styles}from"./widget.styles.js";import{sanitizeCssInset}from"../../../internal/safe-css.js";import{LYRA_DEFAULT_widgetCollapse,LYRA_DEFAULT_widgetExitFullscreen,LYRA_DEFAULT_widgetExpand,LYRA_DEFAULT_widgetExpandToFullscreen,LYRA_DEFAULT_widgetFullscreenPanel,LYRA_DEFAULT_widgetViewGroup}from"../../../internal/default-strings.generated.js";const MAX_WIDGET_VIEWS=256;function snapshotWidgetViews(value){if(!Array.isArray(value))return Object.freeze([]);const seen=new Set,normalized=[];for(const candidate of value.slice(0,MAX_WIDGET_VIEWS))try{if(!candidate||typeof candidate!="object")continue;const record=candidate,viewId=record.viewId;if(typeof viewId!="string"||viewId.length===0||viewId!==viewId.trim()||seen.has(viewId))continue;const label=record.label,ariaLabel=record.ariaLabel,icon=record.icon;if(label!==void 0&&typeof label!="string"||ariaLabel!==void 0&&typeof ariaLabel!="string")continue;seen.add(viewId),normalized.push(Object.freeze({viewId,...label!==void 0?{label}:{},...icon!==void 0?{icon}:{},...ariaLabel!==void 0?{ariaLabel}:{}}))}catch{}return Object.freeze(normalized)}class LyraWidget extends LyraElement{constructor(){super(...arguments),this.actionsScrollOverflow=observeScrollOverflow(this,()=>this.renderRoot.querySelector('[part="actions"]')),this.viewTogglesScrollOverflow=observeScrollOverflow(this,()=>this.renderRoot.querySelector('[part="view-toggles"]')),this.label="",this.accessibleLabel=null,this.sublabel="",this.collapsible=!1,this.collapsed=!1,this.expandable=!1,this.fullscreen=!1,this.fullscreenInset="",this.backdropInset="",this.compact=!1,this.effectiveViews=Object.freeze([]),this.activeViewId="",this.activeView="",this.hasActionsSlot=!1,this.hasIconSlot=!1,this.hasLabelSlot=!1,this.hasSublabelSlot=!1,this.labelSlotObserverGeneration=0,this.ownerRealmGeneration=0,this.bodyId=nextId("widget-body"),this.persistReady=!1,this.onActionsSlotChange=e=>{this.hasActionsSlot=e.target.assignedElements({flatten:!0}).length>0},this.onIconSlotChange=e=>{this.hasIconSlot=e.target.assignedElements({flatten:!0}).length>0},this.onLabelSlotChange=e=>{const assigned=e.target.assignedElements({flatten:!0});this.syncLabelSlot(assigned)},this.onSublabelSlotChange=e=>{this.hasSublabelSlot=e.target.assignedElements({flatten:!0}).length>0},this.setActiveView=viewId=>{viewId===this.activeViewId||this.emit("lr-view-request",{viewId},{cancelable:!0}).defaultPrevented||(this.activeViewId=viewId,this.emit("lr-view-change",{viewId}))},this.toggleCollapsed=()=>{this.requestCollapse(!this.collapsed)},this.toggleFullscreen=e=>{const next=!this.fullscreen,trigger=e.currentTarget;this.requestFullscreenChange(next)&&next&&(this.explicitTrigger=trigger)},this.dismissFullscreen=()=>{this.fullscreen&&this.requestFullscreenChange(!1)},this.onBackdropClick=()=>{this.overlayHandle?.dismissBackdrop()}}static{this.defaultStrings={...super.defaultStrings,widgetCollapse:LYRA_DEFAULT_widgetCollapse,widgetExitFullscreen:LYRA_DEFAULT_widgetExitFullscreen,widgetExpand:LYRA_DEFAULT_widgetExpand,widgetExpandToFullscreen:LYRA_DEFAULT_widgetExpandToFullscreen,widgetFullscreenPanel:LYRA_DEFAULT_widgetFullscreenPanel,widgetViewGroup:LYRA_DEFAULT_widgetViewGroup}}static{this.styles=[LyraElement.styles,styles]}get views(){return this.effectiveViews}set views(value){const previous=this.effectiveViews;this.effectiveViews=snapshotWidgetViews(value),this.requestUpdate("views",previous)}get storageFullKey(){return this.storageKey?`lr-widget:${this.storageKey}`:void 0}willUpdate(changed){if(super.willUpdate(changed),!this.hasUpdated){this.hasActionsSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="actions"),this.hasIconSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="icon");const labelChildren=Array.from(this.children).filter(el=>el.getAttribute("slot")==="label");this.hasLabelSlot=labelChildren.length>0,this.labelSlotText=this.readLabelSlotText(labelChildren),this.hasSublabelSlot=Array.from(this.children).some(el=>el.getAttribute("slot")==="sublabel");const parsed=readPersistedState(this.storageFullKey,v=>typeof v=="object"&&v!==null);parsed&&typeof parsed.collapsed=="boolean"&&(this.collapsed=parsed.collapsed)}if(changed.has("fullscreen")&&(this.fullscreen?this.activateFullscreenOverlay():this.deactivateFullscreenOverlay()),changed.has("activeView")&&this.activeView!==""&&(this.activeViewId=this.activeView),changed.has("views")||changed.has("activeViewId")||changed.has("activeView")){const focused=this.renderRoot?.querySelector('[part="view-toggle"]:focus');this.focusedViewIdBeforeUpdate=focused?.dataset.viewId;const views=this.views;views.some(view=>view.viewId===this.activeViewId)||(this.activeViewId=views[0]?.viewId??"")}}updated(changed){super.updated(changed);const actionsSlot=this.renderRoot.querySelector('slot[name="actions"]');if(this.actionsScrollOverflow.observeExtra(actionsSlot?actionsSlot.assignedElements({flatten:!0}):[]),this.viewTogglesScrollOverflow.observeExtra(this.renderRoot.querySelectorAll('[part="view-toggle"]')),this.persistReady&&changed.has("collapsed")&&writePersistedState(this.storageFullKey,{collapsed:this.collapsed}),this.persistReady=!0,changed.has("fullscreen")&&this.fullscreen)this.overlayHandle?.focusInitial();else if(changed.has("collapsed")&&this.fullscreen){const panel=this.shadowRoot?.querySelector('[part="base"]'),active=deepActiveElement(this.ownerDocument);panel&&!collectFocusableElements(panel).includes(active)&&(active&&typeof active.blur=="function"&&active.blur(),this.overlayHandle?.focusInitial())}if(changed.has("views")||changed.has("activeViewId")){const focusedId=this.focusedViewIdBeforeUpdate;this.focusedViewIdBeforeUpdate=void 0,focusedId&&!this.views.some(view=>view.viewId===focusedId)&&Array.from(this.renderRoot.querySelectorAll('[part="view-toggle"]')).find(toggle=>toggle.dataset.viewId===this.activeViewId)?.focus()}}connectedCallback(){super.connectedCallback(),this.hasUpdated&&this.fullscreen&&(this.overlayHandle?.isActive()?this.overlayHandle.resume():this.activateFullscreenOverlay(),this.queueOwnerMicrotask(()=>this.overlayHandle?.focusInitial())),this.hasUpdated&&this.queueOwnerMicrotask(()=>{const slot=this.shadowRoot?.querySelector('slot[name="label"]');slot&&this.syncLabelSlot(slot.assignedElements({flatten:!0}))})}disconnectedCallback(){super.disconnectedCallback(),this.overlayHandle?.suspend(),this.resetOwnerRealmWork()}adoptedCallback(){super.adoptedCallback(),this.resetOwnerRealmWork()}resetOwnerRealmWork(){this.ownerRealmGeneration+=1,this.resetLabelSlotObserver()}queueOwnerMicrotask(callback){const ownerDocument=this.ownerDocument,ownerWindow=ownerDocument.defaultView;if(!ownerWindow||!this.isConnected)return;const generation=this.ownerRealmGeneration;ownerWindow.queueMicrotask(()=>{this.ownerRealmGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument||callback()})}activateFullscreenOverlay(){this.overlayHandle=activateOverlay({host:this,panel:()=>this.shadowRoot?.querySelector('[part="base"]')??null,onEscape:this.dismissFullscreen,onBackdrop:this.dismissFullscreen,restoreFocusTo:this.explicitTrigger,lockScroll:!0,suspendWhenUnrendered:!0}),this.explicitTrigger=void 0}deactivateFullscreenOverlay(){this.overlayHandle?.deactivate(),this.overlayHandle=void 0}syncLabelSlot(assigned){if(this.hasLabelSlot=assigned.length>0,this.labelSlotText=this.readLabelSlotText(assigned),this.resetLabelSlotObserver(),assigned.length===0||!this.isConnected)return;const ownerDocument=this.ownerDocument,MutationObserverCtor=ownerDocument.defaultView?.MutationObserver;if(!MutationObserverCtor)return;const generation=this.labelSlotObserverGeneration,observer=new MutationObserverCtor(()=>{this.labelSlotObserver!==observer||this.labelSlotObserverDocument!==ownerDocument||this.labelSlotObserverGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument||(this.labelSlotText=this.readLabelSlotText(assigned))});this.labelSlotObserver=observer,this.labelSlotObserverDocument=ownerDocument,bindAccessibleTextObserver(observer,this,["alt","aria-labelledby","slot"]);for(const element of assigned)observer.observe(element,{attributes:!0,attributeFilter:["alt","aria-hidden","aria-label","aria-labelledby","class","hidden","inert","style"],childList:!0,characterData:!0,subtree:!0})}readLabelSlotText(assigned){return composedAccessibilityText(assigned).replace(/\s+/g," ").trim()||void 0}resetLabelSlotObserver(){this.labelSlotObserverGeneration+=1,this.labelSlotObserver?.disconnect(),this.labelSlotObserver=void 0,this.labelSlotObserverDocument=void 0}requestCollapse(next){this.emit("lr-collapse-request",{collapsed:next},{cancelable:!0}).defaultPrevented||(this.collapsed=next,this.emit("lr-collapse-change",{collapsed:next}))}requestFullscreenChange(next){return this.emit("lr-fullscreen-request",{fullscreen:next},{cancelable:!0}).defaultPrevented?!1:(this.fullscreen=next,this.emit("lr-fullscreen-change",{fullscreen:next}),!0)}render(){const hasLabel=(this.label??"").length>0,hasSublabel=(this.sublabel??"").length>0,views=this.views,fullscreenInset=sanitizeCssInset(this.fullscreenInset),backdropInset=sanitizeCssInset(this.backdropInset);return html`
       ${this.fullscreen?html`<div
             part="backdrop"
             style=${backdropInset?styleMap({"--lr-widget-backdrop-inset":backdropInset}):nothing}

package/dist/components/layout/widget/widget.styles.js

@@ -1 +1 @@
-import{css}from"lit";const styles=css`:host{--_lr-widget-overlay-color:var(--lr-color-overlay);--_lr-widget-fullscreen-inset:max(var(--lr-space-l), var(--lr-safe-area-top)) max(var(--lr-space-l), var(--lr-safe-area-inline-end)) max(var(--lr-space-l), var(--lr-safe-area-bottom)) max(var(--lr-space-l), var(--lr-safe-area-inline-start));--_lr-widget-backdrop-inset:0;display:block}[part=base]{box-sizing:border-box;border:var(--lr-border-width-thin) solid var(--lr-color-border);border-radius:var(--lr-radius);background:var(--lr-color-surface);flex-direction:column;display:flex;overflow:hidden}:host(:not([fullscreen])) [part=base]{block-size:100%;min-block-size:0}[part=header]{align-items:center;gap:var(--lr-space-s);min-inline-size:0;padding:var(--lr-space-s) var(--lr-space-m);border-block-end:var(--lr-border-width-thin) solid var(--lr-color-border);flex:none;display:flex}[part=title]{align-items:center;gap:var(--lr-space-xs);flex:auto;min-inline-size:0;display:flex}[part=icon]{flex:none;align-items:center;display:inline-flex}[part=icon][hidden]{display:none}[part=label-group]{flex-direction:column;min-inline-size:0;display:flex}[part=label],[part=sublabel]{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}[part=label]{font-weight:var(--lr-font-weight-semibold)}[part=sublabel]{font-size:var(--lr-font-size-sm);color:var(--lr-color-text-quiet)}[part=label][hidden],[part=sublabel][hidden]{display:none}[part=actions]{align-items:center;gap:var(--lr-space-xs);flex:0 auto;min-inline-size:0;max-inline-size:100%;display:flex;overflow:auto hidden}[part=actions][hidden]{display:none}[part=view-toggles]{gap:var(--lr-space-2xs);flex:0 auto;min-inline-size:0;max-inline-size:100%;display:flex;overflow:auto hidden}[part=actions][data-scroll-overflow]:where([data-scroll-start][data-scroll-end]),[part=view-toggles][data-scroll-overflow]:where([data-scroll-start][data-scroll-end]){-webkit-mask-image:linear-gradient(to right, transparent, var(--lr-mask-opaque) var(--lr-scroll-fade-size), var(--lr-mask-opaque) calc(100% - var(--lr-scroll-fade-size)), transparent);mask-image:linear-gradient(to right, transparent, var(--lr-mask-opaque) var(--lr-scroll-fade-size), var(--lr-mask-opaque) calc(100% - var(--lr-scroll-fade-size)), transparent)}[part=actions][data-scroll-overflow]:where([data-scroll-end]:not([data-scroll-start])),[part=view-toggles][data-scroll-overflow]:where([data-scroll-end]:not([data-scroll-start])){-webkit-mask-image:linear-gradient(to right, var(--lr-mask-opaque), var(--lr-mask-opaque) calc(100% - var(--lr-scroll-fade-size)), transparent);mask-image:linear-gradient(to right, var(--lr-mask-opaque), var(--lr-mask-opaque) calc(100% - var(--lr-scroll-fade-size)), transparent)}[part=actions][data-scroll-overflow]:where([data-scroll-start]:not([data-scroll-end])),[part=view-toggles][data-scroll-overflow]:where([data-scroll-start]:not([data-scroll-end])),:host(:dir(rtl)) [part=actions][data-scroll-overflow]:where([data-scroll-end]:not([data-scroll-start])),:host(:dir(rtl)) [part=view-toggles][data-scroll-overflow]:where([data-scroll-end]:not([data-scroll-start])){-webkit-mask-image:linear-gradient(to right, transparent, var(--lr-mask-opaque) var(--lr-scroll-fade-size), var(--lr-mask-opaque));mask-image:linear-gradient(to right, transparent, var(--lr-mask-opaque) var(--lr-scroll-fade-size), var(--lr-mask-opaque))}:host(:dir(rtl)) [part=actions][data-scroll-overflow]:where([data-scroll-start]:not([data-scroll-end])),:host(:dir(rtl)) [part=view-toggles][data-scroll-overflow]:where([data-scroll-start]:not([data-scroll-end])){-webkit-mask-image:linear-gradient(to right, var(--lr-mask-opaque), var(--lr-mask-opaque) calc(100% - var(--lr-scroll-fade-size)), transparent);mask-image:linear-gradient(to right, var(--lr-mask-opaque), var(--lr-mask-opaque) calc(100% - var(--lr-scroll-fade-size)), transparent)}[part=view-toggle]{min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);justify-content:center;align-items:center;gap:var(--lr-space-2xs);max-inline-size:100%;padding:var(--lr-size-0-125rem) var(--lr-space-s);border:var(--lr-border-width-thin) solid var(--lr-color-border);border-radius:var(--lr-radius-pill);color:var(--lr-color-text-quiet);font:inherit;font-size:var(--lr-font-size-sm);cursor:pointer;background:0 0;flex:0 auto;display:inline-flex}[part=view-icon]{flex:none;display:inline-flex}[part=view-label]{text-overflow:ellipsis;white-space:nowrap;min-inline-size:0;overflow:hidden}:where([part=view-toggle]):hover{background:var(--lr-widget-view-toggle-hover-bg,var(--lr-color-brand-quiet));color:var(--lr-widget-view-toggle-hover-color,var(--lr-color-text))}:where([part=view-toggle]):active{background:color-mix(in oklab, var(--lr-widget-view-toggle-hover-bg,var(--lr-color-brand-quiet)), var(--lr-color-mix-partner) var(--lr-color-mix-active));color:var(--lr-widget-view-toggle-hover-color,var(--lr-color-text))}[part=view-toggle][aria-pressed=true]{background:var(--lr-widget-view-toggle-active-bg,var(--lr-color-brand-quiet));color:var(--lr-widget-view-toggle-active-color,var(--lr-color-brand));border-color:var(--lr-widget-view-toggle-active-border-color,transparent)}[part=view-toggle][aria-pressed=true]:active{background:color-mix(in oklab, var(--lr-widget-view-toggle-active-bg,var(--lr-color-brand-quiet)), var(--lr-color-mix-partner) var(--lr-color-mix-active));color:var(--lr-widget-view-toggle-active-color,var(--lr-color-brand))}[part=view-toggle]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}[part=collapse-button],[part=fullscreen-button]{min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);color:var(--lr-color-text-quiet);border-radius:var(--lr-radius);cursor:pointer;transition:transform var(--lr-transition-fast);background:0 0;border:none;justify-content:center;align-items:center;display:inline-flex}[part=collapse-button]:hover,[part=fullscreen-button]:hover{background:var(--lr-color-brand-quiet);color:var(--lr-color-brand)}[part=collapse-button]:active,[part=fullscreen-button]:active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active));color:var(--lr-color-brand)}[part=collapse-button]:focus-visible,[part=fullscreen-button]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}:host(:not([collapsed])) [part=collapse-button]{transform:rotate(90deg)}:host([collapsed]:dir(rtl)) [part=collapse-button]{transform:scaleX(-1)}[part=body]{padding:var(--lr-space-m);flex:auto;min-block-size:0;overflow:auto}[part=body][hidden]{display:none}[part=backdrop]{inset:var(--lr-widget-backdrop-inset,var(--_lr-widget-backdrop-inset,0));background:var(--lr-widget-overlay-color,var(--_lr-widget-overlay-color));z-index:var(--lr-overlay-stack-index,var(--lr-layer-modal));position:fixed}:host([fullscreen]) [part=base]{inset:var(--lr-widget-fullscreen-inset,var(--_lr-widget-fullscreen-inset,0));z-index:calc(var(--lr-overlay-stack-index,var(--lr-layer-modal)) + 1);box-shadow:var(--lr-shadow-xl);position:fixed}:host([fullscreen]) [part=body]{block-size:100%}:host([compact]) [part=header]{padding:var(--lr-space-xs) var(--lr-space-s);gap:var(--lr-space-xs)}:host([compact]) [part=body]{padding:var(--lr-space-s)}@media (prefers-reduced-motion:reduce){[part=collapse-button],[part=fullscreen-button]{transition:none!important}}@media (forced-colors:active){[part=actions],[part=view-toggles],[part=actions][data-scroll-overflow],[part=view-toggles][data-scroll-overflow],:host(:dir(rtl)) [part=actions][data-scroll-overflow],:host(:dir(rtl)) [part=view-toggles][data-scroll-overflow]{-webkit-mask-image:none;mask-image:none}}`;export{styles};
+import{css}from"lit";const styles=css`:host{--_lr-widget-overlay-color:var(--lr-color-overlay);--_lr-widget-fullscreen-inset:max(var(--lr-space-l), var(--lr-safe-area-top)) max(var(--lr-space-l), var(--lr-safe-area-inline-end)) max(var(--lr-space-l), var(--lr-safe-area-bottom)) max(var(--lr-space-l), var(--lr-safe-area-inline-start));--_lr-widget-backdrop-inset:0;display:block}[part=base]{box-sizing:border-box;border:var(--lr-border-width-thin) solid var(--lr-color-border);border-radius:var(--lr-radius);background:var(--lr-color-surface);flex-direction:column;display:flex;overflow:hidden}:host(:not([fullscreen])) [part=base]{block-size:100%;min-block-size:0}[part=header]{align-items:center;gap:var(--lr-space-s);min-inline-size:0;padding:var(--lr-space-s) var(--lr-space-m);border-block-end:var(--lr-border-width-thin) solid var(--lr-color-border);flex:none;display:flex}[part=title]{align-items:center;gap:var(--lr-space-xs);flex:auto;min-inline-size:0;display:flex}[part=icon]{flex:none;align-items:center;display:inline-flex}[part=icon][hidden]{display:none}[part=label-group]{flex-direction:column;min-inline-size:0;display:flex}[part=label],[part=sublabel]{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}[part=label]{font-weight:var(--lr-font-weight-semibold)}[part=sublabel]{font-size:var(--lr-font-size-sm);color:var(--lr-color-text-quiet)}[part=label][hidden],[part=sublabel][hidden]{display:none}[part=actions]{align-items:center;gap:var(--lr-space-xs);flex:0 auto;min-inline-size:0;max-inline-size:100%;display:flex;overflow:auto hidden}[part=actions][hidden]{display:none}[part=view-toggles]{gap:var(--lr-space-2xs);flex:0 auto;min-inline-size:0;max-inline-size:100%;display:flex;overflow:auto hidden}[part=actions][data-scroll-overflow]:where([data-scroll-start][data-scroll-end]),[part=view-toggles][data-scroll-overflow]:where([data-scroll-start][data-scroll-end]){-webkit-mask-image:linear-gradient(to right, transparent, var(--lr-mask-opaque) var(--lr-scroll-fade-size), var(--lr-mask-opaque) calc(100% - var(--lr-scroll-fade-size)), transparent);mask-image:linear-gradient(to right, transparent, var(--lr-mask-opaque) var(--lr-scroll-fade-size), var(--lr-mask-opaque) calc(100% - var(--lr-scroll-fade-size)), transparent)}[part=actions][data-scroll-overflow]:where([data-scroll-end]:not([data-scroll-start])),[part=view-toggles][data-scroll-overflow]:where([data-scroll-end]:not([data-scroll-start])){-webkit-mask-image:linear-gradient(to right, var(--lr-mask-opaque), var(--lr-mask-opaque) calc(100% - var(--lr-scroll-fade-size)), transparent);mask-image:linear-gradient(to right, var(--lr-mask-opaque), var(--lr-mask-opaque) calc(100% - var(--lr-scroll-fade-size)), transparent)}[part=actions][data-scroll-overflow]:where([data-scroll-start]:not([data-scroll-end])),[part=view-toggles][data-scroll-overflow]:where([data-scroll-start]:not([data-scroll-end])),:host(:dir(rtl)) [part=actions][data-scroll-overflow]:where([data-scroll-end]:not([data-scroll-start])),:host(:dir(rtl)) [part=view-toggles][data-scroll-overflow]:where([data-scroll-end]:not([data-scroll-start])){-webkit-mask-image:linear-gradient(to right, transparent, var(--lr-mask-opaque) var(--lr-scroll-fade-size), var(--lr-mask-opaque));mask-image:linear-gradient(to right, transparent, var(--lr-mask-opaque) var(--lr-scroll-fade-size), var(--lr-mask-opaque))}:host(:dir(rtl)) [part=actions][data-scroll-overflow]:where([data-scroll-start]:not([data-scroll-end])),:host(:dir(rtl)) [part=view-toggles][data-scroll-overflow]:where([data-scroll-start]:not([data-scroll-end])){-webkit-mask-image:linear-gradient(to right, var(--lr-mask-opaque), var(--lr-mask-opaque) calc(100% - var(--lr-scroll-fade-size)), transparent);mask-image:linear-gradient(to right, var(--lr-mask-opaque), var(--lr-mask-opaque) calc(100% - var(--lr-scroll-fade-size)), transparent)}[part=view-toggle]{min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);justify-content:center;align-items:center;gap:var(--lr-space-2xs);max-inline-size:100%;padding:var(--lr-size-0-125rem) var(--lr-space-s);border:var(--lr-border-width-thin) solid var(--lr-color-border);border-radius:var(--lr-radius-pill);color:var(--lr-color-text-quiet);font:inherit;font-size:var(--lr-font-size-sm);cursor:pointer;background:0 0;flex:0 auto;display:inline-flex}[part=view-icon]{flex:none;display:inline-flex}[part=view-label]{text-overflow:ellipsis;white-space:nowrap;min-inline-size:0;overflow:hidden}:where([part=view-toggle]):hover{background:var(--lr-widget-view-toggle-hover-bg,var(--lr-color-brand-quiet));color:var(--lr-widget-view-toggle-hover-color,var(--lr-color-text))}:where([part=view-toggle]):active{background:color-mix(in oklab, var(--lr-widget-view-toggle-hover-bg,var(--lr-color-brand-quiet)), var(--lr-color-mix-partner) var(--lr-color-mix-active));color:var(--lr-widget-view-toggle-hover-color,var(--lr-color-text))}[part=view-toggle][aria-pressed=true]{background:var(--lr-widget-view-toggle-active-bg,var(--lr-color-brand-quiet));color:var(--lr-widget-view-toggle-active-color,var(--lr-color-brand));border-color:var(--lr-widget-view-toggle-active-border-color,transparent)}[part=view-toggle][aria-pressed=true]:active{background:color-mix(in oklab, var(--lr-widget-view-toggle-active-bg,var(--lr-color-brand-quiet)), var(--lr-color-mix-partner) var(--lr-color-mix-active));color:var(--lr-widget-view-toggle-active-color,var(--lr-color-brand))}[part=view-toggle]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}[part=collapse-button],[part=fullscreen-button]{min-inline-size:var(--lr-icon-button-size);min-block-size:var(--lr-icon-button-size);color:var(--lr-color-text-quiet);border-radius:var(--lr-radius);font:inherit;cursor:pointer;transition:transform var(--lr-transition-fast);background:0 0;border:none;justify-content:center;align-items:center;display:inline-flex}[part=collapse-button]:hover,[part=fullscreen-button]:hover{background:var(--lr-color-brand-quiet);color:var(--lr-color-brand)}[part=collapse-button]:active,[part=fullscreen-button]:active{background:color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active));color:var(--lr-color-brand)}[part=collapse-button]:focus-visible,[part=fullscreen-button]:focus-visible{outline:var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);outline-offset:var(--lr-focus-ring-offset)}:host(:not([collapsed])) [part=collapse-button]{transform:rotate(90deg)}:host([collapsed]:dir(rtl)) [part=collapse-button]{transform:scaleX(-1)}[part=body]{padding:var(--lr-space-m);flex:auto;min-block-size:0;overflow:auto}[part=body][hidden]{display:none}[part=backdrop]{inset:var(--lr-widget-backdrop-inset,var(--_lr-widget-backdrop-inset,0));background:var(--lr-widget-overlay-color,var(--_lr-widget-overlay-color));z-index:var(--lr-overlay-stack-index,var(--lr-layer-modal));position:fixed}:host([fullscreen]) [part=base]{inset:var(--lr-widget-fullscreen-inset,var(--_lr-widget-fullscreen-inset,0));z-index:calc(var(--lr-overlay-stack-index,var(--lr-layer-modal)) + 1);box-shadow:var(--lr-shadow-xl);position:fixed}:host([fullscreen]) [part=body]{block-size:100%}:host([compact]) [part=header]{padding:var(--lr-space-xs) var(--lr-space-s);gap:var(--lr-space-xs)}:host([compact]) [part=body]{padding:var(--lr-space-s)}@media (prefers-reduced-motion:reduce){[part=collapse-button],[part=fullscreen-button]{transition:none!important}}@media (forced-colors:active){[part=actions],[part=view-toggles],[part=actions][data-scroll-overflow],[part=view-toggles][data-scroll-overflow],:host(:dir(rtl)) [part=actions][data-scroll-overflow],:host(:dir(rtl)) [part=view-toggles][data-scroll-overflow]{-webkit-mask-image:none;mask-image:none}}`;export{styles};

package/dist/components/media/animation/animation.class.d.ts

@@ -12,7 +12,8 @@ export type LyraAnimationTimingPreset='custom'|'fast'|'base'|'ambient';export in
 * native Web Animations API: a small curated preset catalog (`name`) or fully
 * custom `keyframes`, explicit WAAPI timing controls, an optional
 * `playOnVisible` trigger, and a `lr-start`/`lr-finish`/`lr-cancel` event
-* contract.
+* contract. An initial playing mount creates one animation and emits one start; later target or
+* timing changes still rebuild, and replay keeps its normal lifecycle.
 *
 * `keyframes`, when set, always wins over `name`. The `iterations` default is
 * `Infinity` (mirrors the upstream Web Awesome/Shoelace animation contract
@@ -63,7 +64,7 @@ export declare class LyraAnimation extends LyraElement<LyraAnimationEventMap>{st
 /** Built-in preset or consumer-registered `animation.<name>` key. */
 name:string;keyframes:Keyframe[]|undefined;play:boolean;delay:number;direction:PlaybackDirection;duration:number;easing:string;endDelay:number;fill:FillMode;iterations:number;iterationStart:number;playbackRate:number;timingPreset:LyraAnimationTimingPreset;respectReducedMotion:boolean;playOnVisible:boolean;playOnVisibleRepeat:boolean;rootMargin:string;private _threshold;
 /** Intersection thresholds for `playOnVisible`; arrays are bounded, filtered, and frozen. */
-get threshold():number|readonly number[];set threshold(next:number|readonly number[]);root:Element|null;private animation?;private hasStarted;private visibilityObserver?;private motionQuery?;private motionQueryListener?;private lastTextDirection?;private get safeDelay();private get safeDuration();private get safeEndDelay();
+get threshold():number|readonly number[];set threshold(next:number|readonly number[]);root:Element|null;private animation?;private animationTarget?;private hasStarted;private visibilityObserver?;private motionQuery?;private motionQueryListener?;private lastTextDirection?;private get safeDelay();private get safeDuration();private get safeEndDelay();
 /** `iterations` normalized to a finite, non-negative real -- *or* `Infinity` verbatim.
 *  `Infinity` is this property's own documented default (an animation that repeats forever,
 *  mirroring the upstream Web Awesome/Shoelace contract) and a legitimate, spec-sanctioned

package/dist/components/media/animation/animation.class.js

@@ -1 +1 @@
-var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html}from"lit";import{property}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{prefersReducedMotion}from"../../../internal/motion.js";import{finiteNumber,finiteRange}from"../../../internal/numbers.js";import{getAnimation}from"../../../utilities/animation-registry.js";import{styles}from"./animation.styles.js";import{trueDefaultBooleanConverter}from"../../../internal/converters.js";import{resolveCatalogAnimation,resolveNamedEasing}from"./animation-catalog.js";import{animations,getAnimationNames,getEasingNames,LYRA_ANIMATION_NAMES,LYRA_EASINGS}from"./animation-catalog.js";const MAX_VISIBILITY_THRESHOLDS=1e3;function snapshotVisibilityThreshold(value){if(!Array.isArray(value)){const threshold=typeof value=="number"?finiteNumber(value,-1):-1;return threshold>=0&&threshold<=1?threshold:0}try{const count=Math.min(value.length,MAX_VISIBILITY_THRESHOLDS),thresholds=[];for(let index=0;index<count;index++)try{const candidate=value[index],threshold=typeof candidate=="number"?finiteNumber(candidate,-1):-1;threshold>=0&&threshold<=1&&thresholds.push(threshold)}catch{}return thresholds.length?Object.freeze(thresholds):0}catch{return 0}}const PRESETS={"fade-in":[{opacity:0},{opacity:1}],"fade-out":[{opacity:1},{opacity:0}],"zoom-in":[{opacity:0,transform:"scale(var(--lr-animation-zoom-scale, var(--_lr-animation-zoom-scale)))"},{opacity:1,transform:"scale(1)"}],"zoom-out":[{opacity:1,transform:"scale(1)"},{opacity:0,transform:"scale(var(--lr-animation-zoom-scale, var(--_lr-animation-zoom-scale)))"}],"slide-in-up":[{transform:"translateY(var(--lr-animation-slide-distance, var(--_lr-animation-slide-distance)))",opacity:0},{transform:"translateY(0)",opacity:1}],"slide-in-down":[{transform:"translateY(calc(-1 * var(--lr-animation-slide-distance, var(--_lr-animation-slide-distance))))",opacity:0},{transform:"translateY(0)",opacity:1}],bounce:[{transform:"translateY(0)",offset:0},{transform:"translateY(calc(-1 * var(--lr-animation-bounce-height, var(--_lr-animation-bounce-height))))",offset:.4},{transform:"translateY(0)",offset:.7},{transform:"translateY(calc(-0.4 * var(--lr-animation-bounce-height, var(--_lr-animation-bounce-height))))",offset:.85},{transform:"translateY(0)",offset:1}],pulse:[{transform:"scale(1)",opacity:1,offset:0},{transform:"scale(0.92)",opacity:.75,offset:.5},{transform:"scale(1)",opacity:1,offset:1}],spin:[{transform:"rotate(0deg)"},{transform:"rotate(360deg)"}],shake:[{transform:"translateX(0)",offset:0},{transform:"translateX(calc(-1 * var(--lr-animation-shake-distance, var(--_lr-animation-shake-distance))))",offset:.2},{transform:"translateX(var(--lr-animation-shake-distance, var(--_lr-animation-shake-distance)))",offset:.4},{transform:"translateX(calc(-1 * var(--lr-animation-shake-distance, var(--_lr-animation-shake-distance))))",offset:.6},{transform:"translateX(var(--lr-animation-shake-distance, var(--_lr-animation-shake-distance)))",offset:.8},{transform:"translateX(0)",offset:1}]};function slidePreset(edge,mode,dir){const offscreen=`translateX(${(dir==="ltr"?edge==="start":edge==="end")?"calc(-1 * var(--lr-animation-slide-distance, var(--_lr-animation-slide-distance)))":"var(--lr-animation-slide-distance, var(--_lr-animation-slide-distance))"})`,onscreen="translateX(0)";return mode==="in"?[{transform:offscreen,opacity:0},{transform:onscreen,opacity:1}]:[{transform:onscreen,opacity:1},{transform:offscreen,opacity:0}]}const DIRECTIONAL_SLIDE_NAMES=new Set(["slide-in-start","slide-in-end","slide-out-start","slide-out-end"]),PLAYBACK_DIRECTIONS=new Set(["normal","reverse","alternate","alternate-reverse"]),FILL_MODES=new Set(["none","forwards","backwards","both","auto"]);function isElementOwnedBy(value,ownerDocument){if(value===null||typeof value!="object")return!1;const candidate=value;if(candidate.nodeType!==1||candidate.ownerDocument!==ownerDocument||typeof candidate.localName!="string"||typeof candidate.getAttribute!="function")return!1;const ElementCtor=ownerDocument.defaultView?.Element;return ElementCtor&&value instanceof ElementCtor?!0:typeof candidate.matches=="function"&&typeof candidate.getRootNode=="function"}function resolveTimingToken(el,preset){const raw=el.ownerDocument.defaultView?.getComputedStyle(el).getPropertyValue(`--lr-transition-${preset}`).trim()??"",match=/^((?:\d+(?:\.\d*)?)|(?:\.\d+))(ms|s)\s+(.+)$/.exec(raw);if(!match)return{duration:1e3,easing:"linear"};const num=match[1],unit=match[2],easing=match[3],duration=(unit==="s"?1e3:1)*Number(num),resolvedEasing=easing.trim();return!Number.isFinite(duration)||!el.ownerDocument.defaultView?.CSS?.supports("animation-timing-function",resolvedEasing)?{duration:1e3,easing:"linear"}:{duration,easing:resolvedEasing}}class LyraAnimation extends LyraElement{constructor(){super(...arguments),this.name="none",this.keyframes=void 0,this.play=!1,this.delay=0,this.direction="normal",this.duration=1e3,this.easing="linear",this.endDelay=0,this.fill="auto",this.iterations=1/0,this.iterationStart=0,this.playbackRate=1,this.timingPreset="custom",this.respectReducedMotion=!0,this.playOnVisible=!1,this.playOnVisibleRepeat=!1,this.rootMargin="0px",this._threshold=0,this.root=null,this.hasStarted=!1,this.onSlotChange=()=>{this.createAnimation(),this.syncVisibilityObserver()},this.syncVisibilityObserver=()=>{if(this.disconnectVisibilityObserver(),!this.isConnected||!this.playOnVisible)return;const target=this.currentTarget();if(!target)return;const owner=this.ownerDocument.defaultView,Observer=owner?.IntersectionObserver;if(!owner||!Observer){this.play=!0;return}let observer;const callback=entries=>{if(!observer||this.visibilityObserver!==observer||!this.isConnected||this.ownerDocument.defaultView!==owner)return;const entry=entries[entries.length-1];entry&&(entry.isIntersecting?(this.play=!0,this.playOnVisibleRepeat||(observer.disconnect(),this.visibilityObserver===observer&&(this.visibilityObserver=void 0))):this.playOnVisibleRepeat&&(this.play=!1))},root=isElementOwnedBy(this.root,this.ownerDocument)?this.root:null;try{observer=new Observer(callback,{root,rootMargin:this.rootMargin,threshold:typeof this.threshold=="number"?this.threshold:[...this.threshold]})}catch{try{observer=new Observer(callback,{root,rootMargin:"0px",threshold:0})}catch{this.play=!0;return}}this.visibilityObserver=observer;try{observer.observe(target)}catch{this.disconnectVisibilityObserver(),this.play=!0}},this.createAnimation=()=>{if(this.destroyAnimation(),!this.isConnected)return;const target=this.currentTarget(),registered=this.resolveAnimation();if(!target||!registered)return;const disabled=registered.keyframes.length===0;let keyframes;try{const source=disabled?[{},{}]:registered.keyframes;if(!Array.isArray(source)||source.length>512)throw new TypeError("Invalid keyframe sequence.");keyframes=source.map(keyframe=>{if(typeof keyframe!="object"||keyframe===null)throw new TypeError("Invalid keyframe record.");return{...keyframe}})}catch{keyframes=[{},{}]}const reduced=this.respectReducedMotion&&prefersReducedMotion(this.ownerDocument.defaultView),timingPreset=this.safeTimingPreset,{duration,easing}=timingPreset==="custom"?{duration:this.safeDuration,easing:this.safeEasing(this.easing)}:resolveTimingToken(this,timingPreset),baseOptions={delay:this.safeDelay,direction:this.safeDirection,duration,easing,endDelay:this.safeEndDelay,fill:this.safeFill,iterationStart:this.safeIterationStart,iterations:reduced?Math.min(this.safeIterations,1):this.safeIterations},options={...baseOptions,...registered.options};(reduced||disabled)&&(options.delay=0,options.duration=0,options.endDelay=0,options.iterations=1);try{this.animation=target.animate(keyframes,options)}catch{try{this.animation=target.animate([{},{}],baseOptions)}catch{this.animation=void 0,this.hasStarted=!1;return}}this.animation.playbackRate=this.safePlaybackRate,this.animation.addEventListener("cancel",this.onAnimationCancel),this.animation.addEventListener("finish",this.onAnimationFinish),this.play?(this.hasStarted=!0,this.emit("lr-start",null),reduced&&this.animation.finish()):this.animation.pause()},this.applyPlayState=()=>{this.animation&&(this.play?(this.hasStarted||(this.hasStarted=!0,this.emit("lr-start",null)),this.animation.play()):this.animation.playState!=="idle"&&this.animation.pause())},this.onAnimationFinish=()=>{this.play=!1,this.hasStarted=!1,this.emit("lr-finish",null)},this.onAnimationCancel=()=>{this.play=!1,this.hasStarted=!1,this.emit("lr-cancel",null)}}static{this.styles=[LyraElement.styles,styles]}get threshold(){return this._threshold}set threshold(next){const old=this._threshold;this._threshold=snapshotVisibilityThreshold(next),this.requestUpdate("threshold",old)}get safeDelay(){return finiteNumber(this.delay,0)}get safeDuration(){return finiteRange(this.duration,1e3,0)}get safeEndDelay(){return finiteNumber(this.endDelay,0)}get safeIterations(){return this.iterations===1/0?1/0:finiteRange(this.iterations,1,0)}get safeIterationStart(){return finiteRange(this.iterationStart,0,0)}get safePlaybackRate(){return finiteNumber(this.playbackRate,1)}get safeDirection(){return PLAYBACK_DIRECTIONS.has(this.direction)?this.direction:"normal"}get safeFill(){return FILL_MODES.has(this.fill)?this.fill:"auto"}get safeTimingPreset(){return this.timingPreset==="fast"||this.timingPreset==="base"||this.timingPreset==="ambient"?this.timingPreset:"custom"}safeEasing(value){const resolved=resolveNamedEasing(value);return this.ownerDocument.defaultView?.CSS?.supports("animation-timing-function",resolved)?resolved:"linear"}connectedCallback(){super.connectedCallback(),this.bindMotionPreference(),this.scheduleAfterUpdate(()=>{this.createAnimation(),this.syncVisibilityObserver()})}disconnectedCallback(){this.destroyAnimation(),this.disconnectVisibilityObserver(),this.unbindMotionPreference(),super.disconnectedCallback()}adoptedCallback(){super.adoptedCallback(),this.destroyAnimation(),this.disconnectVisibilityObserver(),this.unbindMotionPreference(),this.isConnected&&(this.bindMotionPreference(),this.scheduleAfterUpdate(()=>{this.createAnimation(),this.syncVisibilityObserver()}))}bindMotionPreference(){this.unbindMotionPreference();const owner=this.ownerDocument.defaultView,query=owner?.matchMedia?.("(prefers-reduced-motion: reduce)");if(!owner||!query)return;const listener=()=>{!this.isConnected||this.ownerDocument.defaultView!==owner||this.motionQuery!==query||this.createAnimation()};this.motionQuery=query,this.motionQueryListener=listener,query.addEventListener("change",listener)}unbindMotionPreference(){this.motionQuery&&this.motionQueryListener&&this.motionQuery.removeEventListener("change",this.motionQueryListener),this.motionQuery=void 0,this.motionQueryListener=void 0}updated(changed){super.updated(changed);const rebuildKeys=["name","keyframes","delay","direction","duration","easing","endDelay","fill","iterations","iterationStart","timingPreset","respectReducedMotion"],textDirection=this.effectiveDirection,textDirectionChanged=this.lastTextDirection!==void 0&&this.lastTextDirection!==textDirection;this.lastTextDirection=textDirection,rebuildKeys.some(key=>changed.has(key))||textDirectionChanged?this.createAnimation():changed.has("play")&&this.applyPlayState(),changed.has("playbackRate")&&this.animation&&(this.animation.playbackRate=this.safePlaybackRate),["playOnVisible","playOnVisibleRepeat","rootMargin","threshold","root"].some(key=>changed.has(key))&&this.scheduleAfterUpdate(this.syncVisibilityObserver)}currentTarget(){const slot=this.renderRoot.querySelector("slot"),[first]=slot?.assignedElements({flatten:!0})??[];return isElementOwnedBy(first,this.ownerDocument)?first:void 0}resolveAnimation(){if(this.keyframes)return{keyframes:this.keyframes,options:{}};const{name}=this;if(name==="none")return;let fallback;if(DIRECTIONAL_SLIDE_NAMES.has(name)){const mode=name.startsWith("slide-in-")?"in":"out",edge=name.endsWith("-start")?"start":"end";fallback={keyframes:slidePreset(edge,mode,"ltr"),rtlKeyframes:slidePreset(edge,mode,"rtl")}}else{const keyframes=PRESETS[name]??resolveCatalogAnimation(name);keyframes&&(fallback={keyframes})}try{return getAnimation(this,`animation.${name}`,{dir:this.effectiveDirection,fallback,respectReducedMotion:!1})}catch{return fallback?{keyframes:fallback.keyframes,options:fallback.options??{}}:void 0}}disconnectVisibilityObserver(){this.visibilityObserver?.disconnect(),this.visibilityObserver=void 0}destroyAnimation(){this.animation&&(this.animation.removeEventListener("cancel",this.onAnimationCancel),this.animation.removeEventListener("finish",this.onAnimationFinish),this.animation.cancel(),this.animation=void 0,this.hasStarted=!1)}get currentTime(){return this.animation?.currentTime??0}set currentTime(value){this.animation&&(typeof value=="number"&&!Number.isFinite(value)||(this.animation.currentTime=value))}start(){this.play=!0}pause(){this.play=!1}cancel(){this.animation?.cancel()}finish(){this.animation?.finish()}render(){return html`<slot @slotchange=${this.onSlotChange}></slot>`}}__decorate([property()],LyraAnimation.prototype,"name",void 0),__decorate([property({attribute:!1})],LyraAnimation.prototype,"keyframes",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraAnimation.prototype,"play",void 0),__decorate([property({type:Number})],LyraAnimation.prototype,"delay",void 0),__decorate([property()],LyraAnimation.prototype,"direction",void 0),__decorate([property({type:Number})],LyraAnimation.prototype,"duration",void 0),__decorate([property()],LyraAnimation.prototype,"easing",void 0),__decorate([property({type:Number,attribute:"end-delay"})],LyraAnimation.prototype,"endDelay",void 0),__decorate([property()],LyraAnimation.prototype,"fill",void 0),__decorate([property({type:Number})],LyraAnimation.prototype,"iterations",void 0),__decorate([property({type:Number,attribute:"iteration-start"})],LyraAnimation.prototype,"iterationStart",void 0),__decorate([property({type:Number,attribute:"playback-rate"})],LyraAnimation.prototype,"playbackRate",void 0),__decorate([property({attribute:"timing-preset",reflect:!0})],LyraAnimation.prototype,"timingPreset",void 0),__decorate([property({type:Boolean,attribute:"respect-reduced-motion",reflect:!0,converter:trueDefaultBooleanConverter})],LyraAnimation.prototype,"respectReducedMotion",void 0),__decorate([property({type:Boolean,attribute:"play-on-visible",reflect:!0})],LyraAnimation.prototype,"playOnVisible",void 0),__decorate([property({type:Boolean,attribute:"play-on-visible-repeat",reflect:!0})],LyraAnimation.prototype,"playOnVisibleRepeat",void 0),__decorate([property({attribute:"root-margin"})],LyraAnimation.prototype,"rootMargin",void 0),__decorate([property({attribute:!1})],LyraAnimation.prototype,"threshold",null),__decorate([property({attribute:!1})],LyraAnimation.prototype,"root",void 0);export{LYRA_ANIMATION_NAMES,LYRA_EASINGS,LyraAnimation,animations,getAnimationNames,getEasingNames};
+var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html}from"lit";import{property}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{prefersReducedMotion}from"../../../internal/motion.js";import{finiteNumber,finiteRange}from"../../../internal/numbers.js";import{getAnimation}from"../../../utilities/animation-registry.js";import{styles}from"./animation.styles.js";import{trueDefaultBooleanConverter}from"../../../internal/converters.js";import{resolveCatalogAnimation,resolveNamedEasing}from"./animation-catalog.js";import{animations,getAnimationNames,getEasingNames,LYRA_ANIMATION_NAMES,LYRA_EASINGS}from"./animation-catalog.js";const MAX_VISIBILITY_THRESHOLDS=1e3;function snapshotVisibilityThreshold(value){if(!Array.isArray(value)){const threshold=typeof value=="number"?finiteNumber(value,-1):-1;return threshold>=0&&threshold<=1?threshold:0}try{const count=Math.min(value.length,MAX_VISIBILITY_THRESHOLDS),thresholds=[];for(let index=0;index<count;index++)try{const candidate=value[index],threshold=typeof candidate=="number"?finiteNumber(candidate,-1):-1;threshold>=0&&threshold<=1&&thresholds.push(threshold)}catch{}return thresholds.length?Object.freeze(thresholds):0}catch{return 0}}const PRESETS={"fade-in":[{opacity:0},{opacity:1}],"fade-out":[{opacity:1},{opacity:0}],"zoom-in":[{opacity:0,transform:"scale(var(--lr-animation-zoom-scale, var(--_lr-animation-zoom-scale)))"},{opacity:1,transform:"scale(1)"}],"zoom-out":[{opacity:1,transform:"scale(1)"},{opacity:0,transform:"scale(var(--lr-animation-zoom-scale, var(--_lr-animation-zoom-scale)))"}],"slide-in-up":[{transform:"translateY(var(--lr-animation-slide-distance, var(--_lr-animation-slide-distance)))",opacity:0},{transform:"translateY(0)",opacity:1}],"slide-in-down":[{transform:"translateY(calc(-1 * var(--lr-animation-slide-distance, var(--_lr-animation-slide-distance))))",opacity:0},{transform:"translateY(0)",opacity:1}],bounce:[{transform:"translateY(0)",offset:0},{transform:"translateY(calc(-1 * var(--lr-animation-bounce-height, var(--_lr-animation-bounce-height))))",offset:.4},{transform:"translateY(0)",offset:.7},{transform:"translateY(calc(-0.4 * var(--lr-animation-bounce-height, var(--_lr-animation-bounce-height))))",offset:.85},{transform:"translateY(0)",offset:1}],pulse:[{transform:"scale(1)",opacity:1,offset:0},{transform:"scale(0.92)",opacity:.75,offset:.5},{transform:"scale(1)",opacity:1,offset:1}],spin:[{transform:"rotate(0deg)"},{transform:"rotate(360deg)"}],shake:[{transform:"translateX(0)",offset:0},{transform:"translateX(calc(-1 * var(--lr-animation-shake-distance, var(--_lr-animation-shake-distance))))",offset:.2},{transform:"translateX(var(--lr-animation-shake-distance, var(--_lr-animation-shake-distance)))",offset:.4},{transform:"translateX(calc(-1 * var(--lr-animation-shake-distance, var(--_lr-animation-shake-distance))))",offset:.6},{transform:"translateX(var(--lr-animation-shake-distance, var(--_lr-animation-shake-distance)))",offset:.8},{transform:"translateX(0)",offset:1}]};function slidePreset(edge,mode,dir){const offscreen=`translateX(${(dir==="ltr"?edge==="start":edge==="end")?"calc(-1 * var(--lr-animation-slide-distance, var(--_lr-animation-slide-distance)))":"var(--lr-animation-slide-distance, var(--_lr-animation-slide-distance))"})`,onscreen="translateX(0)";return mode==="in"?[{transform:offscreen,opacity:0},{transform:onscreen,opacity:1}]:[{transform:onscreen,opacity:1},{transform:offscreen,opacity:0}]}const DIRECTIONAL_SLIDE_NAMES=new Set(["slide-in-start","slide-in-end","slide-out-start","slide-out-end"]),PLAYBACK_DIRECTIONS=new Set(["normal","reverse","alternate","alternate-reverse"]),FILL_MODES=new Set(["none","forwards","backwards","both","auto"]);function isElementOwnedBy(value,ownerDocument){if(value===null||typeof value!="object")return!1;const candidate=value;if(candidate.nodeType!==1||candidate.ownerDocument!==ownerDocument||typeof candidate.localName!="string"||typeof candidate.getAttribute!="function")return!1;const ElementCtor=ownerDocument.defaultView?.Element;return ElementCtor&&value instanceof ElementCtor?!0:typeof candidate.matches=="function"&&typeof candidate.getRootNode=="function"}function resolveTimingToken(el,preset){const raw=el.ownerDocument.defaultView?.getComputedStyle(el).getPropertyValue(`--lr-transition-${preset}`).trim()??"",match=/^((?:\d+(?:\.\d*)?)|(?:\.\d+))(ms|s)\s+(.+)$/.exec(raw);if(!match)return{duration:1e3,easing:"linear"};const num=match[1],unit=match[2],easing=match[3],duration=(unit==="s"?1e3:1)*Number(num),resolvedEasing=easing.trim();return!Number.isFinite(duration)||!el.ownerDocument.defaultView?.CSS?.supports("animation-timing-function",resolvedEasing)?{duration:1e3,easing:"linear"}:{duration,easing:resolvedEasing}}class LyraAnimation extends LyraElement{constructor(){super(...arguments),this.name="none",this.keyframes=void 0,this.play=!1,this.delay=0,this.direction="normal",this.duration=1e3,this.easing="linear",this.endDelay=0,this.fill="auto",this.iterations=1/0,this.iterationStart=0,this.playbackRate=1,this.timingPreset="custom",this.respectReducedMotion=!0,this.playOnVisible=!1,this.playOnVisibleRepeat=!1,this.rootMargin="0px",this._threshold=0,this.root=null,this.hasStarted=!1,this.onSlotChange=()=>{this.currentTarget()!==this.animationTarget&&this.createAnimation(),this.syncVisibilityObserver()},this.syncVisibilityObserver=()=>{if(this.disconnectVisibilityObserver(),!this.isConnected||!this.playOnVisible)return;const target=this.currentTarget();if(!target)return;const owner=this.ownerDocument.defaultView,Observer=owner?.IntersectionObserver;if(!owner||!Observer){this.play=!0;return}let observer;const callback=entries=>{if(!observer||this.visibilityObserver!==observer||!this.isConnected||this.ownerDocument.defaultView!==owner)return;const entry=entries[entries.length-1];entry&&(entry.isIntersecting?(this.play=!0,this.playOnVisibleRepeat||(observer.disconnect(),this.visibilityObserver===observer&&(this.visibilityObserver=void 0))):this.playOnVisibleRepeat&&(this.play=!1))},root=isElementOwnedBy(this.root,this.ownerDocument)?this.root:null;try{observer=new Observer(callback,{root,rootMargin:this.rootMargin,threshold:typeof this.threshold=="number"?this.threshold:[...this.threshold]})}catch{try{observer=new Observer(callback,{root,rootMargin:"0px",threshold:0})}catch{this.play=!0;return}}this.visibilityObserver=observer;try{observer.observe(target)}catch{this.disconnectVisibilityObserver(),this.play=!0}},this.createAnimation=()=>{if(this.destroyAnimation(),!this.isConnected)return;const target=this.currentTarget(),registered=this.resolveAnimation();if(!target||!registered)return;const disabled=registered.keyframes.length===0;let keyframes;try{const source=disabled?[{},{}]:registered.keyframes;if(!Array.isArray(source)||source.length>512)throw new TypeError("Invalid keyframe sequence.");keyframes=source.map(keyframe=>{if(typeof keyframe!="object"||keyframe===null)throw new TypeError("Invalid keyframe record.");return{...keyframe}})}catch{keyframes=[{},{}]}const reduced=this.respectReducedMotion&&prefersReducedMotion(this.ownerDocument.defaultView),timingPreset=this.safeTimingPreset,{duration,easing}=timingPreset==="custom"?{duration:this.safeDuration,easing:this.safeEasing(this.easing)}:resolveTimingToken(this,timingPreset),baseOptions={delay:this.safeDelay,direction:this.safeDirection,duration,easing,endDelay:this.safeEndDelay,fill:this.safeFill,iterationStart:this.safeIterationStart,iterations:reduced?Math.min(this.safeIterations,1):this.safeIterations},options={...baseOptions,...registered.options};(reduced||disabled)&&(options.delay=0,options.duration=0,options.endDelay=0,options.iterations=1);try{this.animation=target.animate(keyframes,options)}catch{try{this.animation=target.animate([{},{}],baseOptions)}catch{this.animation=void 0,this.hasStarted=!1;return}}this.animationTarget=target,this.animation.playbackRate=this.safePlaybackRate,this.animation.addEventListener("cancel",this.onAnimationCancel),this.animation.addEventListener("finish",this.onAnimationFinish),this.play?(this.hasStarted=!0,this.emit("lr-start",null),reduced&&this.animation.finish()):this.animation.pause()},this.applyPlayState=()=>{this.animation&&(this.play?(this.hasStarted||(this.hasStarted=!0,this.emit("lr-start",null)),this.animation.play()):this.animation.playState!=="idle"&&this.animation.pause())},this.onAnimationFinish=()=>{this.play=!1,this.hasStarted=!1,this.emit("lr-finish",null)},this.onAnimationCancel=()=>{this.play=!1,this.hasStarted=!1,this.emit("lr-cancel",null)}}static{this.styles=[LyraElement.styles,styles]}get threshold(){return this._threshold}set threshold(next){const old=this._threshold;this._threshold=snapshotVisibilityThreshold(next),this.requestUpdate("threshold",old)}get safeDelay(){return finiteNumber(this.delay,0)}get safeDuration(){return finiteRange(this.duration,1e3,0)}get safeEndDelay(){return finiteNumber(this.endDelay,0)}get safeIterations(){return this.iterations===1/0?1/0:finiteRange(this.iterations,1,0)}get safeIterationStart(){return finiteRange(this.iterationStart,0,0)}get safePlaybackRate(){return finiteNumber(this.playbackRate,1)}get safeDirection(){return PLAYBACK_DIRECTIONS.has(this.direction)?this.direction:"normal"}get safeFill(){return FILL_MODES.has(this.fill)?this.fill:"auto"}get safeTimingPreset(){return this.timingPreset==="fast"||this.timingPreset==="base"||this.timingPreset==="ambient"?this.timingPreset:"custom"}safeEasing(value){const resolved=resolveNamedEasing(value);return this.ownerDocument.defaultView?.CSS?.supports("animation-timing-function",resolved)?resolved:"linear"}connectedCallback(){super.connectedCallback(),this.bindMotionPreference(),this.scheduleAfterUpdate(()=>{this.animation||this.createAnimation(),this.syncVisibilityObserver()})}disconnectedCallback(){this.destroyAnimation(),this.disconnectVisibilityObserver(),this.unbindMotionPreference(),super.disconnectedCallback()}adoptedCallback(){super.adoptedCallback(),this.destroyAnimation(),this.disconnectVisibilityObserver(),this.unbindMotionPreference(),this.isConnected&&(this.bindMotionPreference(),this.scheduleAfterUpdate(()=>{this.animation||this.createAnimation(),this.syncVisibilityObserver()}))}bindMotionPreference(){this.unbindMotionPreference();const owner=this.ownerDocument.defaultView,query=owner?.matchMedia?.("(prefers-reduced-motion: reduce)");if(!owner||!query)return;const listener=()=>{!this.isConnected||this.ownerDocument.defaultView!==owner||this.motionQuery!==query||this.createAnimation()};this.motionQuery=query,this.motionQueryListener=listener,query.addEventListener("change",listener)}unbindMotionPreference(){this.motionQuery&&this.motionQueryListener&&this.motionQuery.removeEventListener("change",this.motionQueryListener),this.motionQuery=void 0,this.motionQueryListener=void 0}updated(changed){super.updated(changed);const rebuildKeys=["name","keyframes","delay","direction","duration","easing","endDelay","fill","iterations","iterationStart","timingPreset","respectReducedMotion"],textDirection=this.effectiveDirection,textDirectionChanged=this.lastTextDirection!==void 0&&this.lastTextDirection!==textDirection;this.lastTextDirection=textDirection,rebuildKeys.some(key=>changed.has(key))||textDirectionChanged?this.createAnimation():changed.has("play")&&this.applyPlayState(),changed.has("playbackRate")&&this.animation&&(this.animation.playbackRate=this.safePlaybackRate),["playOnVisible","playOnVisibleRepeat","rootMargin","threshold","root"].some(key=>changed.has(key))&&this.scheduleAfterUpdate(this.syncVisibilityObserver)}currentTarget(){const slot=this.renderRoot.querySelector("slot"),[first]=slot?.assignedElements({flatten:!0})??[];return isElementOwnedBy(first,this.ownerDocument)?first:void 0}resolveAnimation(){if(this.keyframes)return{keyframes:this.keyframes,options:{}};const{name}=this;if(name==="none")return;let fallback;if(DIRECTIONAL_SLIDE_NAMES.has(name)){const mode=name.startsWith("slide-in-")?"in":"out",edge=name.endsWith("-start")?"start":"end";fallback={keyframes:slidePreset(edge,mode,"ltr"),rtlKeyframes:slidePreset(edge,mode,"rtl")}}else{const keyframes=PRESETS[name]??resolveCatalogAnimation(name);keyframes&&(fallback={keyframes})}try{return getAnimation(this,`animation.${name}`,{dir:this.effectiveDirection,fallback,respectReducedMotion:!1})}catch{return fallback?{keyframes:fallback.keyframes,options:fallback.options??{}}:void 0}}disconnectVisibilityObserver(){this.visibilityObserver?.disconnect(),this.visibilityObserver=void 0}destroyAnimation(){this.animation&&(this.animation.removeEventListener("cancel",this.onAnimationCancel),this.animation.removeEventListener("finish",this.onAnimationFinish),this.animation.cancel(),this.animation=void 0,this.animationTarget=void 0,this.hasStarted=!1)}get currentTime(){return this.animation?.currentTime??0}set currentTime(value){this.animation&&(typeof value=="number"&&!Number.isFinite(value)||(this.animation.currentTime=value))}start(){this.play=!0}pause(){this.play=!1}cancel(){this.animation?.cancel()}finish(){this.animation?.finish()}render(){return html`<slot @slotchange=${this.onSlotChange}></slot>`}}__decorate([property()],LyraAnimation.prototype,"name",void 0),__decorate([property({attribute:!1})],LyraAnimation.prototype,"keyframes",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraAnimation.prototype,"play",void 0),__decorate([property({type:Number})],LyraAnimation.prototype,"delay",void 0),__decorate([property()],LyraAnimation.prototype,"direction",void 0),__decorate([property({type:Number})],LyraAnimation.prototype,"duration",void 0),__decorate([property()],LyraAnimation.prototype,"easing",void 0),__decorate([property({type:Number,attribute:"end-delay"})],LyraAnimation.prototype,"endDelay",void 0),__decorate([property()],LyraAnimation.prototype,"fill",void 0),__decorate([property({type:Number})],LyraAnimation.prototype,"iterations",void 0),__decorate([property({type:Number,attribute:"iteration-start"})],LyraAnimation.prototype,"iterationStart",void 0),__decorate([property({type:Number,attribute:"playback-rate"})],LyraAnimation.prototype,"playbackRate",void 0),__decorate([property({attribute:"timing-preset",reflect:!0})],LyraAnimation.prototype,"timingPreset",void 0),__decorate([property({type:Boolean,attribute:"respect-reduced-motion",reflect:!0,converter:trueDefaultBooleanConverter})],LyraAnimation.prototype,"respectReducedMotion",void 0),__decorate([property({type:Boolean,attribute:"play-on-visible",reflect:!0})],LyraAnimation.prototype,"playOnVisible",void 0),__decorate([property({type:Boolean,attribute:"play-on-visible-repeat",reflect:!0})],LyraAnimation.prototype,"playOnVisibleRepeat",void 0),__decorate([property({attribute:"root-margin"})],LyraAnimation.prototype,"rootMargin",void 0),__decorate([property({attribute:!1})],LyraAnimation.prototype,"threshold",null),__decorate([property({attribute:!1})],LyraAnimation.prototype,"root",void 0);export{LYRA_ANIMATION_NAMES,LYRA_EASINGS,LyraAnimation,animations,getAnimationNames,getEasingNames};

package/dist/components/media/attachment-chip/attachment-chip.class.d.ts

@@ -1,4 +1,4 @@
-import{type PropertyValues,type TemplateResult}from'lit';import{LyraElement}from'../../../internal/lyra-element.js';export{FILE_SIZE_UNIT_KEYS,formatFileSize}from'./file-size.js';export type LyraAttachmentUploadStatus='pending'|'uploading'|'error'|'success';export interface LyraAttachmentIdDetail{attachmentId:string;}export interface LyraAttachmentPreviewRequestDetail extends LyraAttachmentIdDetail{name:string;mimeType:string;src:string;}export interface LyraAttachmentChipEventMap{'lr-remove':CustomEvent<LyraAttachmentIdDetail>;'lr-retry':CustomEvent<LyraAttachmentIdDetail>;'lr-preview-request':CustomEvent<LyraAttachmentPreviewRequestDetail>;}
+import{type PropertyValues,type PropertyDeclaration,type TemplateResult}from'lit';import{LyraElement}from'../../../internal/lyra-element.js';export{FILE_SIZE_UNIT_KEYS,formatFileSize}from'./file-size.js';export type LyraAttachmentUploadStatus='pending'|'uploading'|'error'|'success';export interface LyraAttachmentIdDetail{attachmentId:string;}export interface LyraAttachmentPreviewRequestDetail extends LyraAttachmentIdDetail{name:string;mimeType:string;src:string;}export interface LyraAttachmentChipEventMap{'lr-remove':CustomEvent<LyraAttachmentIdDetail>;'lr-retry':CustomEvent<LyraAttachmentIdDetail>;'lr-preview-request':CustomEvent<LyraAttachmentPreviewRequestDetail>;}
 /**
 * `<lr-attachment-chip>` — a compact chip representing one file queued for
 * (or already part of) a chat message: a composer's pre-send attachment
@@ -102,7 +102,8 @@ thumbnailSrc:string;
 previewSrc:string;
 /** Shows the preview action when a `file` or `preview-src` is available. */
 previewable:boolean;
-/** Lifecycle state — drives the accent tint and which of `progress`/`spinner`/`retry-button` renders. */
+/** Lifecycle state — drives the accent tint and which of `progress`/`spinner`/`retry-button` renders.
+* Failures already present on reconnect render silently; new connected failures announce once. */
 status:LyraAttachmentUploadStatus;
 /** Upload completion, 0-100. Only meaningful while `status="uploading"`;
 *  a value of 0 (the default), `NaN`, or negative falls back to the indeterminate spinner
@@ -146,7 +147,7 @@ private sink?;private readonly fallbackId;private get effectiveName();private ge
 /** Returns (creating or reusing as needed) the object URL for `file`'s
 * image thumbnail. Called from the update lifecycle, never from `render()`,
 * so rendering stays a pure projection of already-prepared state. */
-private ensureObjectUrl;private revokeObjectUrl;connectedCallback():void;adoptedCallback():void;private syncAnnouncementSink;private releaseAnnouncementSink;protected willUpdate(changed:PropertyValues):void;disconnectedCallback():void;
+private ensureObjectUrl;private revokeObjectUrl;private connectedStatusTransition;requestUpdate(name?:PropertyKey,oldValue?:unknown,options?:PropertyDeclaration):void;connectedCallback():void;adoptedCallback():void;private syncAnnouncementSink;private releaseAnnouncementSink;protected willUpdate(changed:PropertyValues):void;disconnectedCallback():void;
 /** The localized upload-failure message. Same override-wins-verbatim rule as `untitledLabel`;
 *  read both by `render()` and by the failure announcement in `willUpdate()`. */
 private get localizedUploadFailedLabel();private onRemoveClick;private onRetryClick;private onPreviewClick;private renderThumbnail;render():TemplateResult;}declare global{interface HTMLElementTagNameMap{'lr-attachment-chip':LyraAttachmentChip;}}

package/dist/components/media/attachment-chip/attachment-chip.class.js

@@ -11,7 +11,7 @@ var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3
       aria-hidden="true"
       focusable="false"
     ><polyline points="1 4 1 10 7 10"></polyline><path d="M3.51 15a9 9 0 1 0 2.13-9.36L1 10"></path></svg>
-  `}function statusText(status,uploadingText,uploadFailedLabel){return status==="error"?uploadFailedLabel:status==="uploading"?uploadingText:""}class LyraAttachmentChip extends LyraElement{constructor(){super(...arguments),this.name="",this.attachmentId="",this.mimeType="",this.thumbnailSrc="",this.previewSrc="",this.previewable=!0,this.status="pending",this.progress=0,this.removable=!0,this.compact=!1,this.thumbnailOnly=!1,this.fallbackId=nextId("attachment-chip"),this.onRemoveClick=()=>{this.emit("lr-remove",{attachmentId:this.resolvedId})},this.onRetryClick=()=>{this.emit("lr-retry",{attachmentId:this.resolvedId})},this.onPreviewClick=()=>{this.effectivePreviewSrc&&this.emit("lr-preview-request",{attachmentId:this.resolvedId,name:this.effectiveName,mimeType:this.effectiveMimeType,src:this.effectivePreviewSrc})}}static{this.defaultStrings={...super.defaultStrings,attachmentPreviewFile:LYRA_DEFAULT_attachmentPreviewFile,attachmentPreviewName:LYRA_DEFAULT_attachmentPreviewName,attachmentRetryWithContext:LYRA_DEFAULT_attachmentRetryWithContext,attachmentUntitledFile:LYRA_DEFAULT_attachmentUntitledFile,attachmentUploadFailed:LYRA_DEFAULT_attachmentUploadFailed,attachmentUploadingIndeterminate:LYRA_DEFAULT_attachmentUploadingIndeterminate,attachmentUploadingProgress:LYRA_DEFAULT_attachmentUploadingProgress,attachmentUploadingWithContext:LYRA_DEFAULT_attachmentUploadingWithContext,collapse:LYRA_DEFAULT_collapse,details:LYRA_DEFAULT_details,fileSizeUnitB:LYRA_DEFAULT_fileSizeUnitB,fileSizeUnitGb:LYRA_DEFAULT_fileSizeUnitGb,fileSizeUnitKb:LYRA_DEFAULT_fileSizeUnitKb,fileSizeUnitMb:LYRA_DEFAULT_fileSizeUnitMb,fileSizeUnitTb:LYRA_DEFAULT_fileSizeUnitTb,map:LYRA_DEFAULT_map,navigation:LYRA_DEFAULT_navigation,open:LYRA_DEFAULT_open,popover:LYRA_DEFAULT_popover,removeWithContext:LYRA_DEFAULT_removeWithContext,search:LYRA_DEFAULT_search,select:LYRA_DEFAULT_select}}static{this.styles=[LyraElement.styles,styles]}get bytes(){return this._bytes}set bytes(value){const old=this._bytes;this._bytes=typeof value=="number"&&Number.isFinite(value)&&value>=0?finiteRange(value,0,0):void 0,this.requestUpdate("bytes",old)}get effectiveName(){return this.file?this.file.name:this.name}get effectiveSize(){return this.file?Number.isFinite(this.file.size)&&this.file.size>=0?finiteRange(this.file.size,0,0):void 0:this.bytes}get effectiveMimeType(){return this.file?this.file.type:this.mimeType}get effectivePreviewSrc(){return this.file?this.objectUrl??"":this.previewSrc}get resolvedId(){return this.attachmentId.trim().length>0?this.attachmentId:this.file?`${this.file.name}:${this.file.size}:${this.file.lastModified}`:this.fallbackId}get hasNumericProgress(){return this.status==="uploading"&&this.clampedProgress>0}get clampedProgress(){return finiteRange(this.progress,0,0,100)}get effectiveStatus(){return this.status==="uploading"||this.status==="error"||this.status==="success"?this.status:"pending"}ensureObjectUrl(file){return this.objectUrlFile===file&&this.objectUrl?this.objectUrl:(this.revokeObjectUrl(),this.objectUrl=URL.createObjectURL(file),this.objectUrlFile=file,this.objectUrl)}revokeObjectUrl(){this.objectUrl&&URL.revokeObjectURL(this.objectUrl),this.objectUrl=void 0,this.objectUrlFile=void 0}connectedCallback(){super.connectedCallback(),this.syncAnnouncementSink(),this.hasUpdated&&this.requestUpdate()}adoptedCallback(){super.adoptedCallback(),this.releaseAnnouncementSink(),this.syncAnnouncementSink()}syncAnnouncementSink(){this.isConnected&&this.sink?.element.ownerDocument!==this.ownerDocument&&(this.releaseAnnouncementSink(),this.sink=acquireAnnouncementSink("assertive",{document:this.ownerDocument,source:this}))}releaseAnnouncementSink(){this.sink?.release(),this.sink=void 0}willUpdate(changed){super.willUpdate(changed),changed.has("status")&&this.status!==this.effectiveStatus&&(this.status=this.effectiveStatus),this.hasUpdated&&changed.has("status")&&this.status==="error"&&this.sink?.announce(this.localizedUploadFailedLabel),this.isConnected&&this.file&&(this.file.type.startsWith("image/")||this.previewable)?this.ensureObjectUrl(this.file):this.objectUrlFile&&this.revokeObjectUrl()}disconnectedCallback(){super.disconnectedCallback(),this.revokeObjectUrl(),this.releaseAnnouncementSink()}get localizedUploadFailedLabel(){return this.uploadFailedLabel??this.localize("attachmentUploadFailed")}renderThumbnail(){if(this.file){const fileImageSrc=this.objectUrl?safeMediaSrc(this.objectUrl):null;return this.effectiveMimeType.startsWith("image/")?fileImageSrc?html`<img src=${fileImageSrc} alt="" />`:html`${fileIcon()}`:html`${fileIcon()}`}const thumbnailSrc=safeMediaSrc(this.thumbnailSrc);return thumbnailSrc?html`<img src=${thumbnailSrc} alt="" />`:html`${fileIcon()}`}render(){const name=this.effectiveName,untitledLabel=this.untitledLabel??this.localize("attachmentUntitledFile"),displayName=name||untitledLabel,sizeText=this.effectiveSize!==void 0?formatFileSize(this.effectiveSize,unit=>this.localize(FILE_SIZE_UNIT_KEYS[unit]),(value,fractionDigits)=>getNumberFormat(this.effectiveLocale,{minimumFractionDigits:fractionDigits,maximumFractionDigits:fractionDigits}).format(value)):"",uploadFailedLabel=this.localizedUploadFailedLabel,progressPercent=getNumberFormat(this.effectiveLocale,{maximumFractionDigits:0}).format(Math.round(this.clampedProgress)),uploadingText=this.uploadingLabel!==void 0?this.uploadingLabel:this.hasNumericProgress?this.localize("attachmentUploadingProgress",void 0,{percent:progressPercent}):this.localize("attachmentUploadingIndeterminate"),uploadingWithContext=this.uploadingLabel??this.localize("attachmentUploadingWithContext",void 0,{label:displayName}),retryWithContext=this.retryLabel??this.localize("attachmentRetryWithContext",void 0,{label:displayName}),removeWithContext=this.removeLabel??this.localize("removeWithContext",void 0,{label:displayName}),status=this.effectiveStatus,text=statusText(status,uploadingText,uploadFailedLabel),uploading=status==="uploading";return html`
+  `}function statusText(status,uploadingText,uploadFailedLabel){return status==="error"?uploadFailedLabel:status==="uploading"?uploadingText:""}class LyraAttachmentChip extends LyraElement{constructor(){super(...arguments),this.name="",this.attachmentId="",this.mimeType="",this.thumbnailSrc="",this.previewSrc="",this.previewable=!0,this.status="pending",this.progress=0,this.removable=!0,this.compact=!1,this.thumbnailOnly=!1,this.fallbackId=nextId("attachment-chip"),this.connectedStatusTransition=!1,this.onRemoveClick=()=>{this.emit("lr-remove",{attachmentId:this.resolvedId})},this.onRetryClick=()=>{this.emit("lr-retry",{attachmentId:this.resolvedId})},this.onPreviewClick=()=>{this.effectivePreviewSrc&&this.emit("lr-preview-request",{attachmentId:this.resolvedId,name:this.effectiveName,mimeType:this.effectiveMimeType,src:this.effectivePreviewSrc})}}static{this.defaultStrings={...super.defaultStrings,attachmentPreviewFile:LYRA_DEFAULT_attachmentPreviewFile,attachmentPreviewName:LYRA_DEFAULT_attachmentPreviewName,attachmentRetryWithContext:LYRA_DEFAULT_attachmentRetryWithContext,attachmentUntitledFile:LYRA_DEFAULT_attachmentUntitledFile,attachmentUploadFailed:LYRA_DEFAULT_attachmentUploadFailed,attachmentUploadingIndeterminate:LYRA_DEFAULT_attachmentUploadingIndeterminate,attachmentUploadingProgress:LYRA_DEFAULT_attachmentUploadingProgress,attachmentUploadingWithContext:LYRA_DEFAULT_attachmentUploadingWithContext,collapse:LYRA_DEFAULT_collapse,details:LYRA_DEFAULT_details,fileSizeUnitB:LYRA_DEFAULT_fileSizeUnitB,fileSizeUnitGb:LYRA_DEFAULT_fileSizeUnitGb,fileSizeUnitKb:LYRA_DEFAULT_fileSizeUnitKb,fileSizeUnitMb:LYRA_DEFAULT_fileSizeUnitMb,fileSizeUnitTb:LYRA_DEFAULT_fileSizeUnitTb,map:LYRA_DEFAULT_map,navigation:LYRA_DEFAULT_navigation,open:LYRA_DEFAULT_open,popover:LYRA_DEFAULT_popover,removeWithContext:LYRA_DEFAULT_removeWithContext,search:LYRA_DEFAULT_search,select:LYRA_DEFAULT_select}}static{this.styles=[LyraElement.styles,styles]}get bytes(){return this._bytes}set bytes(value){const old=this._bytes;this._bytes=typeof value=="number"&&Number.isFinite(value)&&value>=0?finiteRange(value,0,0):void 0,this.requestUpdate("bytes",old)}get effectiveName(){return this.file?this.file.name:this.name}get effectiveSize(){return this.file?Number.isFinite(this.file.size)&&this.file.size>=0?finiteRange(this.file.size,0,0):void 0:this.bytes}get effectiveMimeType(){return this.file?this.file.type:this.mimeType}get effectivePreviewSrc(){return this.file?this.objectUrl??"":this.previewSrc}get resolvedId(){return this.attachmentId.trim().length>0?this.attachmentId:this.file?`${this.file.name}:${this.file.size}:${this.file.lastModified}`:this.fallbackId}get hasNumericProgress(){return this.status==="uploading"&&this.clampedProgress>0}get clampedProgress(){return finiteRange(this.progress,0,0,100)}get effectiveStatus(){return this.status==="uploading"||this.status==="error"||this.status==="success"?this.status:"pending"}ensureObjectUrl(file){return this.objectUrlFile===file&&this.objectUrl?this.objectUrl:(this.revokeObjectUrl(),this.objectUrl=URL.createObjectURL(file),this.objectUrlFile=file,this.objectUrl)}revokeObjectUrl(){this.objectUrl&&URL.revokeObjectURL(this.objectUrl),this.objectUrl=void 0,this.objectUrlFile=void 0}requestUpdate(name,oldValue,options){name==="status"&&this.isConnected&&this.hasUpdated&&oldValue!==this.status&&(this.connectedStatusTransition=!0),super.requestUpdate(name,oldValue,options)}connectedCallback(){super.connectedCallback(),this.connectedStatusTransition=!1,this.syncAnnouncementSink(),this.hasUpdated&&this.requestUpdate()}adoptedCallback(){super.adoptedCallback(),this.releaseAnnouncementSink(),this.syncAnnouncementSink()}syncAnnouncementSink(){this.isConnected&&this.sink?.element.ownerDocument!==this.ownerDocument&&(this.releaseAnnouncementSink(),this.sink=acquireAnnouncementSink("assertive",{document:this.ownerDocument,source:this}))}releaseAnnouncementSink(){this.sink?.release(),this.sink=void 0}willUpdate(changed){super.willUpdate(changed),changed.has("status")&&this.status!==this.effectiveStatus&&(this.status=this.effectiveStatus),this.isConnected&&this.hasUpdated&&this.connectedStatusTransition&&this.status==="error"&&this.sink?.announce(this.localizedUploadFailedLabel),this.connectedStatusTransition=!1,this.isConnected&&this.file&&(this.file.type.startsWith("image/")||this.previewable)?this.ensureObjectUrl(this.file):this.objectUrlFile&&this.revokeObjectUrl()}disconnectedCallback(){super.disconnectedCallback(),this.revokeObjectUrl(),this.releaseAnnouncementSink()}get localizedUploadFailedLabel(){return this.uploadFailedLabel??this.localize("attachmentUploadFailed")}renderThumbnail(){if(this.file){const fileImageSrc=this.objectUrl?safeMediaSrc(this.objectUrl):null;return this.effectiveMimeType.startsWith("image/")?fileImageSrc?html`<img src=${fileImageSrc} alt="" />`:html`${fileIcon()}`:html`${fileIcon()}`}const thumbnailSrc=safeMediaSrc(this.thumbnailSrc);return thumbnailSrc?html`<img src=${thumbnailSrc} alt="" />`:html`${fileIcon()}`}render(){const name=this.effectiveName,untitledLabel=this.untitledLabel??this.localize("attachmentUntitledFile"),displayName=name||untitledLabel,sizeText=this.effectiveSize!==void 0?formatFileSize(this.effectiveSize,unit=>this.localize(FILE_SIZE_UNIT_KEYS[unit]),(value,fractionDigits)=>getNumberFormat(this.effectiveLocale,{minimumFractionDigits:fractionDigits,maximumFractionDigits:fractionDigits}).format(value)):"",uploadFailedLabel=this.localizedUploadFailedLabel,progressPercent=getNumberFormat(this.effectiveLocale,{maximumFractionDigits:0}).format(Math.round(this.clampedProgress)),uploadingText=this.uploadingLabel!==void 0?this.uploadingLabel:this.hasNumericProgress?this.localize("attachmentUploadingProgress",void 0,{percent:progressPercent}):this.localize("attachmentUploadingIndeterminate"),uploadingWithContext=this.uploadingLabel??this.localize("attachmentUploadingWithContext",void 0,{label:displayName}),retryWithContext=this.retryLabel??this.localize("attachmentRetryWithContext",void 0,{label:displayName}),removeWithContext=this.removeLabel??this.localize("removeWithContext",void 0,{label:displayName}),status=this.effectiveStatus,text=statusText(status,uploadingText,uploadFailedLabel),uploading=status==="uploading";return html`
       <div part="base">
         <span part="thumbnail" aria-hidden="true"
           >${this.renderThumbnail()}</span